Merged in feat/sw-3125-move-client-trpc-setup (pull request #2493)

feat(SW-3125): Move client trpc setup

* Move client trpc to package

* Client setup in partner-sas

* Add todo


Approved-by: Linus Flood
This commit is contained in:
Anton Gunnarsson
2025-07-01 12:41:28 +00:00
parent 481044346c
commit be25be7bb5
57 changed files with 247 additions and 154 deletions

View File

@@ -1,101 +1,39 @@
"use client"
import {
QueryCache,
QueryClient,
QueryClientProvider,
} from "@tanstack/react-query"
import { httpLink, loggerLink, TRPCClientError } from "@trpc/client"
import { useState } from "react"
import { TRPCClientError } from "@trpc/client"
import { SessionExpiredError } from "@scandic-hotels/trpc/errors"
import { transformer } from "@scandic-hotels/trpc/transformer"
import { TrpcProvider as InternalTrpcProvider } from "@scandic-hotels/trpc/Provider"
import { login } from "@/constants/routes/handleAuth"
import { env } from "@/env/client"
import useLang from "@/hooks/useLang"
import { trpc } from "./client"
import type { AnyTRPCRouter } from "@trpc/server"
function initializeTrpcClient() {
// Locally we set nextjs to run on port to 3000 so that we always guarantee
// that trpc and next are running on the same port.
return trpc.createClient({
links: [
loggerLink({
enabled: (opts) =>
(env.NEXT_PUBLIC_NODE_ENV === "development" &&
typeof window !== "undefined") ||
(opts.direction === "down" && opts.result instanceof Error),
}),
httpLink({
transformer,
/**
* This is locally in Next.js
*/
url: `/api/web/trpc`,
}),
],
})
}
export default function TrpcProvider({ children }: React.PropsWithChildren) {
export default function TrpcProvider({
children,
}: {
children: React.ReactNode
}) {
const lang = useLang()
const [queryClient] = useState(
() =>
new QueryClient({
queryCache: new QueryCache({
async onError(error) {
if (error instanceof TRPCClientError) {
const appError: TRPCClientError<AnyTRPCRouter> = error
console.log({ appError })
if (appError.data?.code === "UNAUTHORIZED") {
if (appError.data?.cause instanceof SessionExpiredError) {
const loginUrl = login[lang]
window.location.assign(loginUrl)
}
}
}
},
}),
defaultOptions: {
queries: {
staleTime: 60 * 1000,
retry(failureCount, error) {
if (error instanceof TRPCClientError) {
const appError: TRPCClientError<AnyTRPCRouter> = error
// Do not retry query requests that got UNAUTHORIZED error.
// It won't make a difference sending the same request again.
if (appError.data?.code) {
if (
[
"UNAUTHORIZED",
"INTERNAL_SERVER_ERROR",
"FORBIDDEN",
].includes(appError.data.code)
) {
return false
}
}
}
// Retry all client requests that fail (and are not handled above)
// at most 3 times.
return failureCount < 3
},
},
},
})
)
const [trpcClient] = useState(() => initializeTrpcClient())
return (
<trpc.Provider client={trpcClient} queryClient={queryClient}>
<QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
</trpc.Provider>
<InternalTrpcProvider
onError={(error) => {
if (error instanceof TRPCClientError) {
const appError: TRPCClientError<AnyTRPCRouter> = error
console.log({ appError })
if (appError.data?.code === "UNAUTHORIZED") {
if (appError.data?.cause instanceof SessionExpiredError) {
const loginUrl = login[lang]
window.location.assign(loginUrl)
}
}
}
}}
>
{children}
</InternalTrpcProvider>
)
}