Separate hook from component
This commit is contained in:
parent
816e21e4b7
commit
24f4aecd97
1 changed files with 42 additions and 10 deletions
|
@ -1,3 +1,4 @@
|
||||||
|
import { IMessageContext } from "@saleor/components/messages";
|
||||||
import { DEMO_MODE } from "@saleor/config";
|
import { DEMO_MODE } from "@saleor/config";
|
||||||
import { User } from "@saleor/fragments/types/User";
|
import { User } from "@saleor/fragments/types/User";
|
||||||
import useNotifier from "@saleor/hooks/useNotifier";
|
import useNotifier from "@saleor/hooks/useNotifier";
|
||||||
|
@ -7,9 +8,10 @@ import {
|
||||||
login as loginWithCredentialsManagementAPI,
|
login as loginWithCredentialsManagementAPI,
|
||||||
saveCredentials
|
saveCredentials
|
||||||
} from "@saleor/utils/credentialsManagement";
|
} from "@saleor/utils/credentialsManagement";
|
||||||
|
import ApolloClient from "apollo-client";
|
||||||
import React, { useContext, useEffect, useState } from "react";
|
import React, { useContext, useEffect, useState } from "react";
|
||||||
import { useMutation } from "react-apollo";
|
import { useApolloClient, useMutation } from "react-apollo";
|
||||||
import { useIntl } from "react-intl";
|
import { IntlShape, useIntl } from "react-intl";
|
||||||
|
|
||||||
import { UserContext } from "./";
|
import { UserContext } from "./";
|
||||||
import {
|
import {
|
||||||
|
@ -29,14 +31,11 @@ import {
|
||||||
|
|
||||||
const persistToken = false;
|
const persistToken = false;
|
||||||
|
|
||||||
interface AuthProviderProps {
|
function useAuthProvider(
|
||||||
children: React.ReactNode;
|
intl: IntlShape,
|
||||||
}
|
notify: IMessageContext,
|
||||||
|
apolloClient: ApolloClient<any>
|
||||||
const AuthProvider: React.FC<AuthProviderProps> = ({ children }) => {
|
) {
|
||||||
const intl = useIntl();
|
|
||||||
const notify = useNotifier();
|
|
||||||
|
|
||||||
const [userContext, setUserContext] = useState<undefined | User>(undefined);
|
const [userContext, setUserContext] = useState<undefined | User>(undefined);
|
||||||
|
|
||||||
const logout = () => {
|
const logout = () => {
|
||||||
|
@ -51,6 +50,7 @@ const AuthProvider: React.FC<AuthProviderProps> = ({ children }) => {
|
||||||
TokenAuth,
|
TokenAuth,
|
||||||
TokenAuthVariables
|
TokenAuthVariables
|
||||||
>(tokenAuthMutation, {
|
>(tokenAuthMutation, {
|
||||||
|
client: apolloClient,
|
||||||
onCompleted: result => {
|
onCompleted: result => {
|
||||||
if (result.tokenCreate.errors.length > 0) {
|
if (result.tokenCreate.errors.length > 0) {
|
||||||
logout();
|
logout();
|
||||||
|
@ -70,6 +70,7 @@ const AuthProvider: React.FC<AuthProviderProps> = ({ children }) => {
|
||||||
const [tokenRefresh] = useMutation<RefreshToken, RefreshTokenVariables>(
|
const [tokenRefresh] = useMutation<RefreshToken, RefreshTokenVariables>(
|
||||||
tokenRefreshMutation,
|
tokenRefreshMutation,
|
||||||
{
|
{
|
||||||
|
client: apolloClient,
|
||||||
onError: logout
|
onError: logout
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
|
@ -77,6 +78,7 @@ const AuthProvider: React.FC<AuthProviderProps> = ({ children }) => {
|
||||||
VerifyToken,
|
VerifyToken,
|
||||||
VerifyTokenVariables
|
VerifyTokenVariables
|
||||||
>(tokenVerifyMutation, {
|
>(tokenVerifyMutation, {
|
||||||
|
client: apolloClient,
|
||||||
onCompleted: result => {
|
onCompleted: result => {
|
||||||
if (result.tokenVerify === null) {
|
if (result.tokenVerify === null) {
|
||||||
logout();
|
logout();
|
||||||
|
@ -141,6 +143,36 @@ const AuthProvider: React.FC<AuthProviderProps> = ({ children }) => {
|
||||||
setAuthToken(refreshData.data.tokenRefresh.token, persistToken);
|
setAuthToken(refreshData.data.tokenRefresh.token, persistToken);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
return {
|
||||||
|
login,
|
||||||
|
loginByToken,
|
||||||
|
logout,
|
||||||
|
refreshToken,
|
||||||
|
tokenAuthOpts,
|
||||||
|
tokenVerifyOpts,
|
||||||
|
userContext
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
interface AuthProviderProps {
|
||||||
|
children: React.ReactNode;
|
||||||
|
}
|
||||||
|
|
||||||
|
const AuthProvider: React.FC<AuthProviderProps> = ({ children }) => {
|
||||||
|
const apolloClient = useApolloClient();
|
||||||
|
const intl = useIntl();
|
||||||
|
const notify = useNotifier();
|
||||||
|
|
||||||
|
const {
|
||||||
|
login,
|
||||||
|
loginByToken,
|
||||||
|
logout,
|
||||||
|
tokenAuthOpts,
|
||||||
|
refreshToken,
|
||||||
|
tokenVerifyOpts,
|
||||||
|
userContext
|
||||||
|
} = useAuthProvider(intl, notify, apolloClient);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<UserContext.Provider
|
<UserContext.Provider
|
||||||
value={{
|
value={{
|
||||||
|
|
Loading…
Reference in a new issue