chore: improve setUser type, uses generic from useAuth (#8636)

Create specific type for setUser in auth provider that uses the generic.
This commit is contained in:
Jarrod Flesch
2024-10-10 08:47:15 -04:00
committed by GitHub
parent 5e94d9b1ca
commit a70b193527
4 changed files with 17 additions and 14 deletions

View File

@@ -1,15 +1,10 @@
'use client' 'use client'
import type { import type { FormProps, UserWithToken } from '@payloadcms/ui'
ClientCollectionConfig, import type { ClientCollectionConfig, FormState, LoginWithUsernameOptions } from 'payload'
FormState,
LoginWithUsernameOptions,
MeOperationResult,
} from 'payload'
import { import {
ConfirmPasswordField, ConfirmPasswordField,
Form, Form,
type FormProps,
FormSubmit, FormSubmit,
PasswordField, PasswordField,
RenderFields, RenderFields,
@@ -57,7 +52,7 @@ export const CreateFirstUserClient: React.FC<{
[apiRoute, userSlug, serverURL], [apiRoute, userSlug, serverURL],
) )
const handleFirstRegister = (data: MeOperationResult) => { const handleFirstRegister = (data: UserWithToken) => {
setUser(data) setUser(data)
} }

View File

@@ -6,7 +6,8 @@ import React from 'react'
const baseClass = 'login__form' const baseClass = 'login__form'
const Link = (LinkImport.default || LinkImport) as unknown as typeof LinkImport.default const Link = (LinkImport.default || LinkImport) as unknown as typeof LinkImport.default
import type { ClientUser, FormState, MeOperationResult } from 'payload' import type { UserWithToken } from '@payloadcms/ui'
import type { FormState } from 'payload'
import { Form, FormSubmit, PasswordField, useAuth, useConfig, useTranslation } from '@payloadcms/ui' import { Form, FormSubmit, PasswordField, useAuth, useConfig, useTranslation } from '@payloadcms/ui'
import { formatAdminURL } from '@payloadcms/ui/shared' import { formatAdminURL } from '@payloadcms/ui/shared'
@@ -74,7 +75,7 @@ export const LoginForm: React.FC<{
} }
} }
const handleLogin = (data: MeOperationResult) => { const handleLogin = (data: UserWithToken) => {
setUser(data) setUser(data)
} }

View File

@@ -192,6 +192,7 @@ export { XIcon } from '../../icons/X/index.js'
// providers // providers
export { ActionsProvider, SetViewActions, useActions } from '../../providers/Actions/index.js' export { ActionsProvider, SetViewActions, useActions } from '../../providers/Actions/index.js'
export { AuthProvider, useAuth } from '../../providers/Auth/index.js' export { AuthProvider, useAuth } from '../../providers/Auth/index.js'
export type { UserWithToken } from '../../providers/Auth/index.js'
export { ClientFunctionProvider, useClientFunctions } from '../../providers/ClientFunction/index.js' export { ClientFunctionProvider, useClientFunctions } from '../../providers/ClientFunction/index.js'
export { useAddClientFunction } from '../../providers/ClientFunction/index.js' export { useAddClientFunction } from '../../providers/ClientFunction/index.js'
export { RenderComponent } from '../../providers/Config/RenderComponent.js' export { RenderComponent } from '../../providers/Config/RenderComponent.js'

View File

@@ -1,5 +1,5 @@
'use client' 'use client'
import type { ClientUser, MeOperationResult, Permissions, User } from 'payload' import type { ClientUser, Permissions, User } from 'payload'
import { useModal } from '@faceless-ui/modal' import { useModal } from '@faceless-ui/modal'
import { usePathname, useRouter } from 'next/navigation.js' import { usePathname, useRouter } from 'next/navigation.js'
@@ -14,6 +14,12 @@ import { requests } from '../../utilities/api.js'
import { formatAdminURL } from '../../utilities/formatAdminURL.js' import { formatAdminURL } from '../../utilities/formatAdminURL.js'
import { useConfig } from '../Config/index.js' import { useConfig } from '../Config/index.js'
export type UserWithToken<T = ClientUser> = {
exp: number
token: string
user: T
}
export type AuthContext<T = ClientUser> = { export type AuthContext<T = ClientUser> = {
fetchFullUser: () => Promise<null | User> fetchFullUser: () => Promise<null | User>
logOut: () => Promise<boolean> logOut: () => Promise<boolean>
@@ -22,7 +28,7 @@ export type AuthContext<T = ClientUser> = {
refreshCookieAsync: () => Promise<ClientUser> refreshCookieAsync: () => Promise<ClientUser>
refreshPermissions: () => Promise<void> refreshPermissions: () => Promise<void>
setPermissions: (permissions: Permissions) => void setPermissions: (permissions: Permissions) => void
setUser: (user: MeOperationResult | null) => void setUser: (user: null | UserWithToken<T>) => void
strategy?: string strategy?: string
token?: string token?: string
tokenExpiration?: number tokenExpiration?: number
@@ -97,7 +103,7 @@ export function AuthProvider({
}, []) }, [])
const setNewUser = useCallback( const setNewUser = useCallback(
(userResponse: MeOperationResult | null) => { (userResponse: null | UserWithToken) => {
if (userResponse?.user) { if (userResponse?.user) {
setUserInMemory(userResponse.user) setUserInMemory(userResponse.user)
setTokenInMemory(userResponse.token) setTokenInMemory(userResponse.token)
@@ -240,7 +246,7 @@ export function AuthProvider({
}) })
if (request.status === 200) { if (request.status === 200) {
const json: MeOperationResult = await request.json() const json: UserWithToken = await request.json()
const user = null const user = null
setNewUser(json) setNewUser(json)