Add application state hook (#1308)

* Add application state hook

Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>

* Add docs

Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>
This commit is contained in:
Tilman Vatteroth 2021-06-11 15:21:24 +02:00 committed by GitHub
parent 4720f2d36b
commit 829cc2fe48
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
47 changed files with 149 additions and 195 deletions

View file

@ -6,9 +6,8 @@
import React, { Fragment } from 'react'
import { Col, Row } from 'react-bootstrap'
import { useSelector } from 'react-redux'
import { Redirect } from 'react-router'
import { ApplicationState } from '../../redux'
import { useApplicationState } from '../../hooks/common/use-application-state'
import { LoginProvider } from '../../redux/user/types'
import { ShowIf } from '../common/show-if/show-if'
import { ProfileAccessTokens } from './access-tokens/profile-access-tokens'
@ -17,7 +16,7 @@ import { ProfileChangePassword } from './settings/profile-change-password'
import { ProfileDisplayName } from './settings/profile-display-name'
export const ProfilePage: React.FC = () => {
const userProvider = useSelector((state: ApplicationState) => state.user?.provider)
const userProvider = useApplicationState((state) => state.user?.provider)
if (!userProvider) {
return <Redirect to={'/login'} />

View file

@ -7,15 +7,14 @@
import React, { ChangeEvent, FormEvent, useEffect, useState } from 'react'
import { Alert, Button, Card, Form } from 'react-bootstrap'
import { Trans, useTranslation } from 'react-i18next'
import { useSelector } from 'react-redux'
import { updateDisplayName } from '../../../api/me'
import { ApplicationState } from '../../../redux'
import { fetchAndSetUser } from '../../login-page/auth/utils'
import { useApplicationState } from '../../../hooks/common/use-application-state'
export const ProfileDisplayName: React.FC = () => {
const regexInvalidDisplayName = /^\s*$/
const { t } = useTranslation()
const userName = useSelector((state: ApplicationState) => state.user?.name)
const userName = useApplicationState((state) => state.user?.name)
const [submittable, setSubmittable] = useState(false)
const [error, setError] = useState(false)
const [displayName, setDisplayName] = useState('')