create hooks

packages/sylius/src/auth/use-login.tsx

@@ -1,16 +1,49 @@
 import { MutationHook } from '@vercel/commerce/utils/types'
 import useLogin, { UseLogin } from '@vercel/commerce/auth/use-login'
+import { useCallback } from 'react'
+import useCustomer from '@vercel/commerce/customer/use-customer'
+import { setCustomerToken } from '../utils/token/customer-token'
+import { setCustomerId } from '../utils/token/customer-id'
 
 export default useLogin as UseLogin<typeof handler>
 
 export const handler: MutationHook<any> = {
   fetchOptions: {
-    query: '',
+    url: '/authentication-token',
+    method: 'POST',
   },
-  async fetcher() {
+  fetcher: async ({ input: { email, password }, options, fetch }) => {
+    const authReturn = await fetch({
+      url: options.url,
+      method: options.method,
+      body: {
+        email: email,
+        password: password,
+      },
+      variables: {
+        useToken: false,
+      },
+    })
+
+    setCustomerToken(authReturn.token)
+    console.log(authReturn)
+    const custumerRouteParts = authReturn.customer.split('/')
+    console.log(custumerRouteParts)
+    setCustomerId(custumerRouteParts[5])
     return null
   },
-  useHook: () => () => {
+  useHook:
-    return async function () {}
+    ({ fetch }) =>
+    () => {
+      const { mutate } = useCustomer()
+
+      return useCallback(
+        async function login(input) {
+          const data = await fetch({ input })
+          await mutate()
+          return data
+        },
+        [fetch, mutate]
+      )
     },
 }

packages/sylius/src/customer/use-customer.tsx

@@ -2,16 +2,32 @@ import { SWRHook } from '@vercel/commerce/utils/types'
 import useCustomer, {
   UseCustomer,
 } from '@vercel/commerce/customer/use-customer'
+import { getCustomerId } from '../utils/token/customer-id'
+import { normalizeCustomer } from '../utils/normalize/normalize-customer'
 
 export default useCustomer as UseCustomer<typeof handler>
+
 export const handler: SWRHook<any> = {
   fetchOptions: {
-    query: '',
+    url: `/customers/`,
+    method: 'GET',
   },
-  async fetcher({ input, options, fetch }) {},
+  fetcher: async ({ options, fetch }) => {
-  useHook: () => () => {
+    const syliusCustomer = await fetch({
-    return async function addItem() {
+      url: options.url! + getCustomerId(),
-      return {}
+      method: options.method,
-    }
+    })
+    const customer = normalizeCustomer(syliusCustomer)
+    return customer
+  },
+  useHook:
+    ({ useData }) =>
+    (input) => {
+      return useData({
+        swrOptions: {
+          revalidateOnFocus: false,
+          ...input?.swrOptions,
+        },
+      })
     },
 }

packages/sylius/src/utils/token/customer-token.ts

@@ -0,0 +1,12 @@
+import { SYLIUS_CUSTOMER_TOKEN } from '../../const'
+
+export const getCustomerToken = () =>
+  localStorage.getItem(SYLIUS_CUSTOMER_TOKEN)
+
+export const setCustomerToken = (token: string | null) => {
+  if (!token) {
+    localStorage.removeItem(SYLIUS_CUSTOMER_TOKEN)
+  } else {
+    localStorage.setItem(SYLIUS_CUSTOMER_TOKEN, token)
+  }
+}