feat(WEB-169): get profile data from API

lib/api/endpoints.ts

@@ -0,0 +1,10 @@
+/**
+ * Nested enum requires namespace
+ */
+export namespace endpoints {
+  export const enum v0 {
+    profile = "profile/v0/Profile",
+  }
+}
+
+export type Endpoint = endpoints.v0

lib/api/index.ts

@@ -0,0 +1,60 @@
+import merge from "deepmerge"
+
+import { env } from "@/env/server"
+
+import type {
+  RequestOptionsWithJSONBody,
+  RequestOptionsWithOutBody,
+} from "@/types/fetch"
+import type { Endpoint } from "./endpoints"
+
+export { endpoints } from "./endpoints"
+
+const defaultOptions: RequestInit = {
+  headers: {
+    "Content-Type": "application/json",
+  },
+  mode: "cors",
+}
+
+export async function get(
+  endpoint: Endpoint,
+  options: RequestOptionsWithOutBody
+) {
+  defaultOptions.method = "GET"
+  return fetch(`${env.API_BASEURL}/${endpoint}`, merge(defaultOptions, options))
+}
+
+export async function patch(
+  endpoint: Endpoint,
+  options: RequestOptionsWithJSONBody
+) {
+  const { body, ...requestOptions } = options
+  defaultOptions.body = JSON.stringify(body)
+  defaultOptions.method = "PATCH"
+  return fetch(
+    `${env.API_BASEURL}/${endpoint}`,
+    merge(defaultOptions, requestOptions)
+  )
+}
+
+export async function post(
+  endpoint: Endpoint,
+  options: RequestOptionsWithJSONBody
+) {
+  const { body, ...requestOptions } = options
+  defaultOptions.body = JSON.stringify(body)
+  defaultOptions.method = "POST"
+  return fetch(
+    `${env.API_BASEURL}/${endpoint}`,
+    merge(defaultOptions, requestOptions)
+  )
+}
+
+export async function remove(
+  endpoint: Endpoint,
+  options: RequestOptionsWithOutBody
+) {
+  defaultOptions.method = "DELETE"
+  return fetch(`${env.API_BASEURL}/${endpoint}`, merge(defaultOptions, options))
+}

lib/trpc/Provider.tsx

@@ -4,11 +4,11 @@ import { useState } from "react"
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query"
 import { httpBatchLink } from "@trpc/client"
 import { env } from "@/env/client"
-import { api } from "./client"
+import { trpc } from "./client"
 import { transformer } from "@/server/transformer"
 
 function initializeTrpcClient() {
-  return api.createClient({
+  return trpc.createClient({
     links: [
       httpBatchLink({
         transformer,
@@ -25,8 +25,8 @@ export default function TrpcProvider({ children }: React.PropsWithChildren) {
   const [queryClient] = useState(() => new QueryClient({}))
   const [trpcClient] = useState(() => initializeTrpcClient())
   return (
-    <api.Provider client={trpcClient} queryClient={queryClient}>
+    <trpc.Provider client={trpcClient} queryClient={queryClient}>
       <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
-    </api.Provider>
+    </trpc.Provider>
   )
 }

lib/trpc/client.ts

@@ -2,4 +2,4 @@ import { createTRPCReact } from "@trpc/react-query"
 
 import type { AppRouter } from "@/server"
 
-export const api = createTRPCReact<AppRouter>({})
+export const trpc = createTRPCReact<AppRouter>({})