fix(LOY-206): add missing lang input to friends transactions query, handles both server and client side

apps/scandic-web/components/Blocks/DynamicContent/Points/EarnAndBurn/JourneyTable/Client.tsx

@@ -7,17 +7,20 @@ import { trpc } from "@/lib/trpc/client"
 
 import LoadingSpinner from "@/components/LoadingSpinner"
 import Pagination from "@/components/MyPages/Pagination"
+import useLang from "@/hooks/useLang"
 
 import ClientTable from "./ClientTable"
 
 export default function TransactionTable() {
   const limit = 5
   const [page, setPage] = useState(1)
+  const lang = useLang()
   const { data, isFetching, isLoading } =
     trpc.user.transaction.friendTransactions.useQuery(
       {
         limit,
         page,
+        lang,
       },
       {
         placeholderData: keepPreviousData,

apps/scandic-web/server/routers/hotels/query.ts

@@ -6,7 +6,7 @@ import { badRequestError } from "@/server/errors/trpc"
 import {
   contentStackBaseWithServiceProcedure,
   protectedProcedure,
-  protectedServcieProcedure,
+  protectedServiceProcedure,
   publicProcedure,
   router,
   safeProtectedServiceProcedure,
@@ -793,7 +793,7 @@ export const getRoomAvailability = async (
     breakfastIncluded: !!rateDefinition?.breakfastIncluded,
     cancellationRule: rateDefinition?.cancellationRule,
     cancellationText: rateDefinition?.cancellationText ?? "",
-          chequeRate: rates?.bonusCheque,
+    chequeRate: rates?.bonusCheque,
     isFlexRate:
       rateDefinition?.cancellationRule ===
       CancellationRuleEnum.CancellableBefore6PM,
@@ -812,7 +812,7 @@ export const getRoomAvailability = async (
         : undefined,
     rateType: rateDefinition?.rateType ?? "",
     selectedRoom,
-          voucherRate: rates?.voucher,
+    voucherRate: rates?.voucher,
   }
 }
 
@@ -862,7 +862,7 @@ export const hotelQueryRouter = router({
       .query(async ({ input, ctx }) => {
         return getRoomAvailability(input, ctx.lang, ctx.serviceToken)
       }),
-    roomWithRedemption: protectedServcieProcedure
+    roomWithRedemption: protectedServiceProcedure
       .input(selectedRoomAvailabilityInputSchema)
       .query(async ({ input, ctx }) => {
         return getRoomAvailability(

apps/scandic-web/server/routers/user/input.ts

@@ -23,6 +23,7 @@ export const friendTransactionsInput = z
   .object({
     limit: z.number().int().positive(),
     page: z.number().int().positive(),
+    lang: z.nativeEnum(Lang).optional(),
   })
   .default({ limit: 5, page: 1 })
 

apps/scandic-web/server/routers/user/query.ts

@@ -4,6 +4,7 @@ import { countries } from "@/constants/countries"
 import * as api from "@/lib/api"
 import { dt } from "@/lib/dt"
 import {
+  languageProtectedProcedure,
   protectedProcedure,
   router,
   safeProtectedProcedure,
@@ -629,10 +630,11 @@ export const userQueryRouter = router({
       }),
   }),
   transaction: router({
-    friendTransactions: protectedProcedure
+    friendTransactions: languageProtectedProcedure
       .input(friendTransactionsInput)
       .query(async ({ ctx, input }) => {
         const { limit, page } = input
+
         getFriendTransactionsCounter.add(1)
         console.info(
           "api.transaction.friendTransactions start",
@@ -699,6 +701,7 @@ export const userQueryRouter = router({
           "api.transaction.friendTransactions success",
           JSON.stringify({})
         )
+
         const updatedData = await updateStaysBookingUrl(
           verifiedData.data.data,
           ctx.session.token.access_token,

apps/scandic-web/server/trpc.ts

@@ -52,32 +52,33 @@ const baseProcedure = t.procedure.use(sentryMiddleware)
 
 export const publicProcedure = baseProcedure
 
-export const contentstackBaseProcedure = baseProcedure.use(
+export const languageProcedure = baseProcedure.use(async function (opts) {
-  async function (opts) {
+  if (!opts.ctx.lang) {
-    if (!opts.ctx.lang) {
+    // When fetching data client side with TRPC we don't pass through middlewares and therefore do not get the lang through headers
-      // When fetching data client side with TRPC we don't pass through middlewares and therefore do not get the lang through headers
+    // We can then pass lang as an input in the request and set it to the context in the procedure
-      // We can then pass lang as an input in the request and set it to the context in the procedure
 
-      const input = await opts.getRawInput()
+    const input = await opts.getRawInput()
-      const parsedInput = langInput.safeParse(input)
+    const parsedInput = langInput.safeParse(input)
-      if (!parsedInput.success) {
+    if (!parsedInput.success) {
-        throw badRequestError("Missing Lang in tRPC context")
+      throw badRequestError("Missing Lang in tRPC context")
-      }
-
-      return opts.next({
-        ctx: {
-          lang: parsedInput.data.lang,
-        },
-      })
     }
 
     return opts.next({
       ctx: {
-        lang: opts.ctx.lang,
+        lang: parsedInput.data.lang,
       },
     })
   }
-)
+
+  return opts.next({
+    ctx: {
+      lang: opts.ctx.lang,
+    },
+  })
+})
+
+export const contentstackBaseProcedure = languageProcedure
+
 export const contentstackExtendedProcedureUID = contentstackBaseProcedure.use(
   async function (opts) {
     if (!opts.ctx.uid) {
@@ -207,5 +208,8 @@ export const contentStackBaseWithProtectedProcedure =
 export const safeProtectedServiceProcedure =
   safeProtectedProcedure.unstable_concat(serviceProcedure)
 
-export const protectedServcieProcedure =
+export const protectedServiceProcedure =
   protectedProcedure.unstable_concat(serviceProcedure)
+
+export const languageProtectedProcedure =
+  protectedProcedure.unstable_concat(languageProcedure)