diff options
Diffstat (limited to 'web/source/settings/components')
| -rw-r--r-- | web/source/settings/components/authorization/index.tsx | 21 | ||||
| -rw-r--r-- | web/source/settings/components/form/inputs.tsx | 10 | ||||
| -rw-r--r-- | web/source/settings/components/pageable-list.tsx | 2 |
3 files changed, 21 insertions, 12 deletions
diff --git a/web/source/settings/components/authorization/index.tsx b/web/source/settings/components/authorization/index.tsx index 22a0d24b7..e8f4d6673 100644 --- a/web/source/settings/components/authorization/index.tsx +++ b/web/source/settings/components/authorization/index.tsx @@ -17,10 +17,9 @@ along with this program. If not, see <http://www.gnu.org/licenses/>. */ -import { useVerifyCredentialsQuery } from "../../lib/query/oauth"; +import { useLogoutMutation, useVerifyCredentialsQuery } from "../../lib/query/oauth"; import { store } from "../../redux/store"; - -import React from "react"; +import React, { ReactNode } from "react"; import Login from "./login"; import Loading from "../loading"; @@ -30,18 +29,20 @@ import { NoArg } from "../../lib/types/query"; export function Authorization({ App }) { const { loginState, expectingRedirect } = store.getState().oauth; const skip = (loginState == "none" || loginState == "logout" || expectingRedirect); + const [ logoutQuery ] = useLogoutMutation(); const { isLoading, + isFetching, isSuccess, data: account, error, } = useVerifyCredentialsQuery(NoArg, { skip: skip }); let showLogin = true; - let content: React.JSX.Element | null = null; + let content: ReactNode; - if (isLoading) { + if (isLoading || isFetching) { showLogin = false; let loadingInfo = ""; @@ -56,7 +57,15 @@ export function Authorization({ App }) { <Loading /> {loadingInfo} </div> ); - } else if (error != undefined) { + } else if (error !== undefined) { + if ("status" in error && error.status === 401) { + // 401 unauthorized was received. + // That means the token or app we + // were using is no longer valid, + // so just log the user out. + logoutQuery(NoArg); + } + content = ( <div> <Error error={error} /> diff --git a/web/source/settings/components/form/inputs.tsx b/web/source/settings/components/form/inputs.tsx index 1e0d8eaab..f82937fc1 100644 --- a/web/source/settings/components/form/inputs.tsx +++ b/web/source/settings/components/form/inputs.tsx @@ -34,7 +34,7 @@ export interface TextInputProps extends React.DetailedHTMLProps< React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement > { - label?: string; + label?: ReactNode; field: TextFormInputHook; } @@ -60,7 +60,7 @@ export interface TextAreaProps extends React.DetailedHTMLProps< React.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement > { - label?: string; + label?: ReactNode; field: TextFormInputHook; } @@ -86,7 +86,7 @@ export interface FileInputProps extends React.DetailedHTMLProps< React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement > { - label?: string; + label?: ReactNode; field: FileFormInputHook; } @@ -133,7 +133,7 @@ export interface SelectProps extends React.DetailedHTMLProps< React.SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement > { - label?: string; + label?: ReactNode; field: TextFormInputHook; children?: ReactNode; options: React.JSX.Element; @@ -164,7 +164,7 @@ export interface RadioGroupProps extends React.DetailedHTMLProps< React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement > { - label?: string; + label?: ReactNode; field: RadioFormInputHook; } diff --git a/web/source/settings/components/pageable-list.tsx b/web/source/settings/components/pageable-list.tsx index 918103ead..3571fb1cd 100644 --- a/web/source/settings/components/pageable-list.tsx +++ b/web/source/settings/components/pageable-list.tsx @@ -33,7 +33,7 @@ export interface PageableListProps<T> { isFetching: boolean; isError: boolean; error: FetchBaseQueryError | SerializedError | undefined; - emptyMessage: string; + emptyMessage: ReactNode; prevNextLinks?: Links | null | undefined; } |