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

@@ -0,0 +1,20 @@
/* eslint-disable formatjs/no-literal-string-in-jsx */
"use client"
import { Lang } from "@scandic-hotels/common/constants/language"
import { trpc } from "@scandic-hotels/trpc/client"
export function ClientComponent() {
const { data, isLoading } = trpc.autocomplete.destinations.useQuery({
lang: Lang.en,
includeTypes: ["hotels"],
query: "Malmö",
})
return (
<div>
<p>client component</p>
<p>Data: {JSON.stringify(data?.hits?.hotels[0]?.name)}</p>
<p>Is loading: {isLoading ? "Yes" : "No"}</p>
</div>
)
}

View File

@@ -0,0 +1,16 @@
import { fetchRequestHandler } from "@trpc/server/adapters/fetch"
import { appRouter } from "@scandic-hotels/trpc/routers/appRouter"
import { createAppContext } from "@/lib/trpc"
async function handler(req: Request) {
return fetchRequestHandler({
createContext: createAppContext,
endpoint: "/api/web/trpc",
req,
router: appRouter,
})
}
export { handler as GET, handler as POST }

View File

@@ -1,3 +1,2 @@
body {
background: rebeccapurple;
}

View File

@@ -3,6 +3,8 @@ import "@scandic-hotels/design-system/fonts.css"
import "@/public/_static/css/design-system-new-deprecated.css"
import "./globals.css"
import { TrpcProvider } from "@scandic-hotels/trpc/Provider"
import type { Metadata } from "next"
export const metadata: Metadata = {
@@ -23,7 +25,10 @@ export default function RootLayout({
{/* eslint-disable-next-line @next/next/no-css-tags */}
<link rel="stylesheet" href="/_static/css/scandic.css" />
</head>
<body className="scandic">{children}</body>
<body className="scandic">
{/* TODO handle onError */}
<TrpcProvider>{children}</TrpcProvider>
</body>
</html>
)
}

View File

@@ -1,7 +1,4 @@
.page {
color: white;
width: 500px;
height: 500px;
padding-left: 200px;
padding-top: 200px;
}

View File

@@ -4,6 +4,8 @@ import { Typography } from "@scandic-hotels/design-system/Typography"
import { serverClient } from "@/lib/trpc"
import { ClientComponent } from "./ClientComponent"
import styles from "./page.module.css"
export default async function Home() {
@@ -22,6 +24,9 @@ export default async function Home() {
{/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
<p>hello world with data: {hotel}</p>
</Typography>
<hr />
<ClientComponent />
<hr />
<Typography>
{/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
<p>from booking-flow package:</p>