From 1d06f55c2b729e25cd8684a146a86df6860d2876 Mon Sep 17 00:00:00 2001 From: Andrei Dekterev Date: Tue, 1 Mar 2022 19:03:35 +0700 Subject: [PATCH] fix(#2290): add new hook to auth and types --- .../AuthServiceApp/components/Login/hooks.tsx | 47 +++++++++---------- src/features/AuthServiceApp/requests/auth.tsx | 33 +++++-------- .../AuthServiceApp/requests/register.tsx | 27 ++++++----- src/features/AuthStore/helpers.tsx | 17 ++++++- 4 files changed, 63 insertions(+), 61 deletions(-) diff --git a/src/features/AuthServiceApp/components/Login/hooks.tsx b/src/features/AuthServiceApp/components/Login/hooks.tsx index c611748b..b2ba8a09 100644 --- a/src/features/AuthServiceApp/components/Login/hooks.tsx +++ b/src/features/AuthServiceApp/components/Login/hooks.tsx @@ -7,17 +7,21 @@ import { import { loginCheck } from 'features/AuthServiceApp/requests/auth' import { getApiUrl } from 'features/AuthServiceApp/config/routes' -import { useLexicsStore } from 'features/LexicsStore' import { useAuthFields } from 'features/AuthServiceApp/hooks/useAuthFields' -import { getClientSettings } from 'features/AuthStore/helpers' -import { useLocation } from 'react-router' +import { useParamsUrl } from '../../hooks/useParamsUrl' const url = getApiUrl('/authorize') export const useLoginForm = () => { - const location = useLocation() - const { lang } = useLexicsStore() + const { + client_id, + lang, + redirect_uri, + response_mode, + response_type, + scope, + } = useParamsUrl() const [authError, setAuthError] = useState('') const [isFetching, setIsFetching] = useState(false) const [isModalOpen, setIsModalOpen] = useState(false) @@ -47,20 +51,6 @@ export const useLoginForm = () => { } const submitForm = () => formRef.current?.submit() - const redirect_url = new URLSearchParams(location.search).get('redirect_uri') - const clientId = new URLSearchParams(location.search).get('client_id') - - const { - client_id, - redirect_uri, - response_mode, - response_type, - scope, - } = getClientSettings() - - const currentRedirectUrl = redirect_url ?? redirect_uri - const currentClientId = clientId ?? client_id - const handleError = (error: string) => { setAuthError(error) setIsFetching(false) @@ -70,13 +60,18 @@ export const useLoginForm = () => { e.preventDefault() setIsFetching(true) try { - await loginCheck( - currentClientId, + await loginCheck({ email, - lang, password, - currentRedirectUrl, - ) + urlParams: { + client_id, + lang, + redirect_uri, + response_mode, + response_type, + scope, + }, + }) submitForm() } catch (err) { handleError(String(err)) @@ -89,7 +84,7 @@ export const useLoginForm = () => { return { authError, - client_id: currentClientId, + client_id, email, formError, formRef, @@ -104,7 +99,7 @@ export const useLoginForm = () => { onPasswordBlur, onPasswordChange, password, - redirect_uri: currentRedirectUrl, + redirect_uri, response_mode, response_type, scope, diff --git a/src/features/AuthServiceApp/requests/auth.tsx b/src/features/AuthServiceApp/requests/auth.tsx index bc971374..612e48e3 100644 --- a/src/features/AuthServiceApp/requests/auth.tsx +++ b/src/features/AuthServiceApp/requests/auth.tsx @@ -1,7 +1,7 @@ -import { getClientSettings } from 'features/AuthStore/helpers' - import { getApiUrl } from '../config/routes' +import type { UrlParams } from './register' + const errorLexics = { 1: 'error_invalid_email_or_password', 4: 'error_user_not_found', @@ -20,35 +20,24 @@ type SuccessResponse = { ok: true, } -export const loginCheck = async ( - currentClientId: string | undefined, +type LoginProps = { email: string, - lang: string, password: string, - currentRedirectUrl: string | undefined, -) => { - const { - response_mode, - response_type, - scope, - } = getClientSettings() - - const paramsUrl = { - client_id: currentClientId, - lang, - redirect_uri: currentRedirectUrl, - response_mode, - response_type, - scope, - } + urlParams: UrlParams, +} +export const loginCheck = async ({ + email, + password, + urlParams, +}: LoginProps) => { const url = getApiUrl('/authorize-check') const init: RequestInit = { body: new URLSearchParams({ email, password, - ...paramsUrl as {}, + ...urlParams, }), method: 'POST', } diff --git a/src/features/AuthServiceApp/requests/register.tsx b/src/features/AuthServiceApp/requests/register.tsx index f0b45c13..6c16001f 100644 --- a/src/features/AuthServiceApp/requests/register.tsx +++ b/src/features/AuthServiceApp/requests/register.tsx @@ -1,3 +1,6 @@ +import type { ClientIds } from 'config/clients/types' +import type { Languages } from 'config/languages' + import { getApiUrl } from 'features/AuthServiceApp/config/routes' const errorLexics = { @@ -21,19 +24,21 @@ type SuccessResponse = { ok: true, } +export type UrlParams = { + client_id: ClientIds, + lang?: Languages, + nonce?: string, + redirect_uri: string, + response_mode: string, + response_type: string, + scope?: string, + state?: string, +} + type RegisterProps = { email: string, - lang?: string | undefined, password: string, - urlParams: { - client_id?: string, - none?: string, - redirect_uri?: string, - response_mode?: string, - response_type?: string, - scope?: string, - state?: string, - }, + urlParams: UrlParams, } export const registerCheck = async ({ @@ -47,7 +52,7 @@ export const registerCheck = async ({ body: new URLSearchParams({ email, password, - ...urlParams as {}, + ...urlParams, }), method: 'POST', } diff --git a/src/features/AuthStore/helpers.tsx b/src/features/AuthStore/helpers.tsx index 997f5ca3..35eeabf8 100644 --- a/src/features/AuthStore/helpers.tsx +++ b/src/features/AuthStore/helpers.tsx @@ -3,9 +3,22 @@ import { WebStorageStateStore } from 'oidc-client' import { client } from 'config/clients' import { AUTH_SERVICE } from 'config/routes' - +import { ClientIds } from 'config/clients/types' import { ENV } from 'config/env' +import type { Languages } from 'config/languages' + +interface Settings extends UserManagerSettings { + client_id: ClientIds, + lang?: Languages, + nonce?: string, + redirect_uri: string, + response_mode: string, + response_type: string, + scope?: string, + state?: string, +} + const redirectUrl = () => { if (process.env.NODE_ENV === 'development') { return `${window.origin}/redirect` @@ -16,7 +29,7 @@ const redirectUrl = () => { return `https://${client.name}.tv/redirect` } -export const getClientSettings = (): UserManagerSettings => ({ +export const getClientSettings = (): Settings => ({ authority: AUTH_SERVICE, automaticSilentRenew: true, client_id: client.auth.clientId,