Можете привести пример логина в Formik с GraphQL query, а не mutation?
В примере использовал GraphQL Code Generator, преобразующий запросы и мутации в хуки. Пример работать не будет, так как хук useLoginQuery внутри тела. Как наиболее элегантно создать авторизацию?
import { useLoginQuery } from 'graphql/generated'
const FormAuthorization = () => {
return (
<Wrapper>
<Formik
initialValues={{ mail: '', password: ''}}
onSubmit={(values) => {
useLoginQuery({
variables: {
email: values.mail,
password: values.password,
},
})
}}
>
{() => (
<Form>
<UiInput
name="mail"
placeholder="Введите эл. почту"
id="mail"
label="Mail"
/>
<UiInput
name="password"
placeholder="Введите пароль"
id="password"
label="Password"
type="password"
/>
<UiButton type="submit">Войти</UiButton>
</Form>
)}
</Formik>
</Wrapper>
)
}
Запрос
query Login($email: String!, $password: String!) {
Login(email: $email, password: $password) {
token
}
}
Генератор GraphQL(Cтарался почистить, хук внизу)
import * as Apollo from '@apollo/client';
export type Maybe<T> = T | null;
export type Exact<T extends { [key: string]: unknown }> = { [K in keyof T]: T[K] };
export type Scalars = {
ID: string;
String: string;
Boolean: boolean;
Int: number;
Float: number;
};
export type User = {
__typename?: 'User';
id: Scalars['ID'];
login: Scalars['String'];
name: Scalars['String'];
email: Scalars['String'];
token?: Maybe<Scalars['String']>;
services_tokens?: Maybe<Array<Maybe<Token>>>;
};
export type LoginQueryVariables = Exact<{
email: Scalars['String'];
password: Scalars['String'];
}>;
export type LoginQuery = (
{ __typename?: 'Query' }
& { Login?: Maybe<(
{ __typename?: 'User' }
& Pick<User, 'email' | 'token'>
)> }
);
export function useLoginQuery(baseOptions?: Apollo.QueryHookOptions<LoginQuery, LoginQueryVariables>) {
return Apollo.useQuery<LoginQuery, LoginQueryVariables>(LoginDocument, baseOptions);
}