Dani; Comments

Dani;

•Created by FleetAdmiralJakob 🗕 🗗 🗙 on 3/13/2024 in #❓-help

Return undefined if param is not there

I usually end up using non-null assertion when I have to deal with situations like this

  const weatherData = api.weather.getWeather.useQuery(
    {
      coordinates: cityById!.coord,
      //                   ^ non-null assertion
      timezone: dayjs.tz.guess(),
      lang: locale,
    },
    { 
        enabled: !!cityById,
        //           ^ disable the query
        refetchOnWindowFocus: false,
        staleTime: 1000 * 60 * 60 /* 1 hour */
     },
  );

  const weatherData = api.weather.getWeather.useQuery(
    {
      coordinates: cityById!.coord,
      //                   ^ non-null assertion
      timezone: dayjs.tz.guess(),
      lang: locale,
    },
    { 
        enabled: !!cityById,
        //           ^ disable the query
        refetchOnWindowFocus: false,
        staleTime: 1000 * 60 * 60 /* 1 hour */
     },
  );

5 replies

TtRPC

•Created by BillyBob on 1/15/2024 in #❓-help

tRPC, NextJS 14, createTRPCProxyClient, How can I globally manage errors?

Unfortunate; hopefully someone else has a solution

23 replies

TtRPC

•Created by BillyBob on 1/15/2024 in #❓-help

tRPC, NextJS 14, createTRPCProxyClient, How can I globally manage errors?

so just replace navigate with redirect

23 replies

TtRPC

•Created by BillyBob on 1/15/2024 in #❓-help

tRPC, NextJS 14, createTRPCProxyClient, How can I globally manage errors?

import { redirect } from 'next/navigation'

import { redirect } from 'next/navigation'

23 replies

TtRPC

•Created by BillyBob on 1/15/2024 in #❓-help

tRPC, NextJS 14, createTRPCProxyClient, How can I globally manage errors?

In your initial snippet you were importing redirect, can't you just use that?

23 replies

TtRPC

•Created by BillyBob on 1/15/2024 in #❓-help

tRPC, NextJS 14, createTRPCProxyClient, How can I globally manage errors?

23 replies

TtRPC

•Created by BillyBob on 1/15/2024 in #❓-help

tRPC, NextJS 14, createTRPCProxyClient, How can I globally manage errors?

Unsure if anything else is needed if you do SSR, haven't worked with next.js in a while

23 replies

TtRPC

•Created by BillyBob on 1/15/2024 in #❓-help

tRPC, NextJS 14, createTRPCProxyClient, How can I globally manage errors?

I'm using react-router-dom, it's an SPA in my case; you can just replace with whatever redirect function next.js provides you

23 replies

TtRPC

•Created by BillyBob on 1/15/2024 in #❓-help

tRPC, NextJS 14, createTRPCProxyClient, How can I globally manage errors?

import { OperationLink, TRPCLink } from '@trpc/react-query';
import { observable, tap } from '@trpc/server/observable';

const errorLink: TRPCLink<AppRouter> = (): OperationLink<AppRouter> => {
        const link: OperationLink<AppRouter> = ({ op, next }) => {
            return observable((observer) => {
                next(op)
                    .pipe(
                        tap({
                            error: (result) => {
                                if (result.data?.code === 'UNAUTHORIZED') {
                                    navigate('/auth/login');
                                }
                            },
                        }),
                    )
                    .subscribe(observer);
            });
        };
        return link;
    };

import { OperationLink, TRPCLink } from '@trpc/react-query';
import { observable, tap } from '@trpc/server/observable';

const errorLink: TRPCLink<AppRouter> = (): OperationLink<AppRouter> => {
        const link: OperationLink<AppRouter> = ({ op, next }) => {
            return observable((observer) => {
                next(op)
                    .pipe(
                        tap({
                            error: (result) => {
                                if (result.data?.code === 'UNAUTHORIZED') {
                                    navigate('/auth/login');
                                }
                            },
                        }),
                    )
                    .subscribe(observer);
            });
        };
        return link;
    };

currently using this ^

23 replies

TtRPC

•Created by asheeshh on 9/2/2023 in #❓-help

throwing custom errors from mutations

Pretty sure you need to await the promise inside the try-catch block

21 replies

TtRPC

•Created by pjnicolas on 7/21/2023 in #❓-help

How would you implement basic auth session tokens with tRPC?

There is this new tool which is gaining popularity recently: https://github.com/pilcrowOnPaper/lucia

10 replies

TtRPC

•Created by lambo1994 on 6/25/2023 in #❓-help

route needs jwt but it doesn't

Maybe you have some auth-checks in a middleware or in the function which creates the tRPC context?

3 replies

TtRPC

•Created by PotatisMannen on 6/23/2023 in #❓-help

how do you consume trpc endpoints from postman?

Some 3rd party libraries: trpc-panel: https://github.com/iway1/trpc-panel trpc-playground: https://github.com/sachinraja/trpc-playground Using postman is a bit awkward due to the RPC specification shape, there was a postman script which makes it easier to test using postman, search around on this discord server or through the issues on the main trpc repo, you'll find something.

7 replies

TtRPC

•Created by dang on 6/21/2023 in #❓-help

Migrating v9 to v10 - - using the client?

Unsure what your use case is, you could extract the type using this

// utils/trpc.ts
// keep in mind to only import the type
import type { AppRouter } from '@server/routers/main';
import { CreateTRPCProxyClient } from '@trpc/client';
export type TRPCClient = CreateTRPCProxyClient<AppRouter>;


// Component.tsx
import { TRPCClient } from 'utils/trpc';

type Props = {
 client: TRPCCLient
}

// utils/trpc.ts
// keep in mind to only import the type
import type { AppRouter } from '@server/routers/main';
import { CreateTRPCProxyClient } from '@trpc/client';
export type TRPCClient = CreateTRPCProxyClient<AppRouter>;


// Component.tsx
import { TRPCClient } from 'utils/trpc';

type Props = {
 client: TRPCCLient
}

7 replies

TtRPC

•Created by dang on 6/21/2023 in #❓-help

Migrating v9 to v10 - - using the client?

I'd just retrieve the client from the trpc.useContext() in that component personally

7 replies

TtRPC

•Created by dang on 6/21/2023 in #❓-help

Migrating v9 to v10 - - using the client?

Do you actually need the type? this would be the v10 way of writing your code

const { client } = trpc.useContext();
const addMeasurementPromise = client.measurements.add.mutate(data);

const { client } = trpc.useContext();
const addMeasurementPromise = client.measurements.add.mutate(data);

7 replies