groot/automatisch
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: stop flickering due to late initiated token

Browse Source
This commit is contained in:
Ali BARIN
2022-03-09 20:58:51 +01:00
parent 343b360303
commit 906a8d0644
4 changed files with 11 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
packages/web/src/components/ApolloProvider/index.tsx
View File

@@ -2,7 +2,7 @@ import * as React from 'react';
import { ApolloProvider as BaseApolloProvider } from '@apollo/client'; import { ApolloProvider as BaseApolloProvider } from '@apollo/client';
import { useSnackbar } from 'notistack'; import { useSnackbar } from 'notistack';
import client, { setLink } from 'graphql/client'; import { mutateAndGetClient } from 'graphql/client';
import useAuthentication from 'hooks/useAuthentication'; import useAuthentication from 'hooks/useAuthentication';
type ApolloProviderProps = { type ApolloProviderProps = {
@@ -17,8 +17,11 @@ const ApolloProvider = (props: ApolloProviderProps): React.ReactElement => {
enqueueSnackbar(message, { variant: 'error' }); enqueueSnackbar(message, { variant: 'error' });
}, [enqueueSnackbar]); }, [enqueueSnackbar]);
React.useEffect(() => { const client = React.useMemo(() => {
setLink({ onError, token: authentication.token }) return mutateAndGetClient({
onError,
token: authentication.token,
});
}, [onError, authentication]); }, [onError, authentication]);
return ( return (

1
packages/web/src/components/LoginForm/index.tsx
View File

@@ -30,6 +30,7 @@ function renderFields(props: { loading: boolean }) {
required required
fullWidth fullWidth
margin="dense" margin="dense"
autoComplete="username"
/> />
<TextField <TextField

2
packages/web/src/graphql/client.ts
View File

@@ -13,7 +13,7 @@ const client = new ApolloClient({
link: createLink({ uri: appConfig.graphqlUrl }) link: createLink({ uri: appConfig.graphqlUrl })
}); });
export function setLink(options: CreateClientOptions): typeof client { export function mutateAndGetClient(options: CreateClientOptions): typeof client {
const { onError, token } = options; const { onError, token } = options;
const link = createLink({ uri: appConfig.graphqlUrl, token, onError }); const link = createLink({ uri: appConfig.graphqlUrl, token, onError });

2
packages/web/src/graphql/link.ts
View File

@@ -2,6 +2,7 @@ import { HttpLink, from } from '@apollo/client';
import type { ApolloLink } from '@apollo/client'; import type { ApolloLink } from '@apollo/client';
import { onError } from '@apollo/client/link/error'; import { onError } from '@apollo/client/link/error';
import { setItem } from 'helpers/storage';
import * as URLS from 'config/urls'; import * as URLS from 'config/urls';
type CreateLinkOptions = { type CreateLinkOptions = {
@@ -29,6 +30,7 @@ const createErrorLink = (callback: CreateLinkOptions['onError']): ApolloLink =>
); );
if (message === NOT_AUTHORISED) { if (message === NOT_AUTHORISED) {
setItem('token', '');
window.location.href = URLS.LOGIN; window.location.href = URLS.LOGIN;
} }
}); });