Son Comments

there are no implementation differences between query and mutation according to the docs, its just semantics. Also by definition it’s a query, because its checking if the database exists in the database only.

7 replies

TtRPC

•Created by Son on 12/7/2022 in #❓-help

correct way to call TRPC inside a function

This helped ill try some variation of this for my needs. thanks

13 replies

TtRPC

•Created by Son on 12/7/2022 in #❓-help

correct way to call TRPC inside a function

This is the pattern I came up with. I want to call my route when a button is clicked and have access to isLoading, onError etc… I have implemented a pattern using ‘’refetch()’’ but it doesn’t feel ‘correct’ is there a better way of doing this. I will also create a custom hook out of it. ‘’’js const { refetch } = trpc.authDomain.signIn.useQuery( { email: userEmail }, { enabled: false, onError: (e: any) => { console.log('there was an error with the endpoint'); }, } ); async function isEmailVerified() { const response = await refetch(); const verification = response.data; // i want to access isLoading directly without writing many lines of new code which i would have to with this current approach if (verification?.status === 'tryAgain') { console.log('email not verified'); setHasInitiatedSignIn(true); } if (verification?.status === 'ok') { console.log('user can now verify code sent to their email address'); setHasInitiatedSignIn(true); } } Return <button onClick={isEmailVerified}/> ‘’’

13 replies

TtRPC

•Created by rustclan on 11/30/2022 in #❓-help

TRPC waiting until the query has completed

Wht vscode extension are you using to get the gui lsp?

19 replies

TtRPC

•Created by Son on 12/7/2022 in #❓-help

correct way to call TRPC inside a function

Thank you, i made use of the enabled property, and used refectch() in the component. I’m going to export it into. Custom hook and rejig it.

13 replies

TtRPC

•Created by Son on 12/7/2022 in #❓-help

correct way to call TRPC inside a function

13 replies

TtRPC

•Created by Son on 11/24/2022 in #❓-help

Delay IsLoading....

Thank you for getting back to me with these solutions. I'm ganna read over them and implement. 🙏🏾

6 replies

TtRPC

•Created by Son on 11/21/2022 in #❓-help

TRPC Testing Wrapper - Unit Testing components that contain a query (Not testing the query it self)

Thank you this is was the final solution

export const TRPCWrapper = ({ children }: { children: ReactNode }) => {
  const [queryClient] = useState(() => new QueryClient());
  const [trpcClient] = useState(() =>
    trpc.createClient({
      links: [
        httpBatchLink({
          url: platformSpecificLocalHostUrl,
          fetch: async (input, init?) => {
            const fetch = getFetch();
            return fetch(input, {
              ...init,
              // credentials: "include",
            });
          },
        }),
      ],
    })
  );

  return (
    <trpc.Provider client={trpcClient} queryClient={queryClient}>
      <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
    </trpc.Provider>
  );
};

export const TRPCWrapper = ({ children }: { children: ReactNode }) => {
  const [queryClient] = useState(() => new QueryClient());
  const [trpcClient] = useState(() =>
    trpc.createClient({
      links: [
        httpBatchLink({
          url: platformSpecificLocalHostUrl,
          fetch: async (input, init?) => {
            const fetch = getFetch();
            return fetch(input, {
              ...init,
              // credentials: "include",
            });
          },
        }),
      ],
    })
  );

  return (
    <trpc.Provider client={trpcClient} queryClient={queryClient}>
      <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
    </trpc.Provider>
  );
};

can this be added to the docs?

14 replies

TtRPC

•Created by Son on 11/21/2022 in #❓-help

TRPC Testing Wrapper - Unit Testing components that contain a query (Not testing the query it self)

Or are you saying I don’t need the shared client? I just need to add the fetch prop

14 replies

TtRPC

•Created by Son on 11/21/2022 in #❓-help

TRPC Testing Wrapper - Unit Testing components that contain a query (Not testing the query it self)

With the wrapper?

14 replies

TtRPC

•Created by Son on 11/21/2022 in #❓-help

TRPC Testing Wrapper - Unit Testing components that contain a query (Not testing the query it self)

Thank you, its only to get rid of type errors? Is my mock the right way to go about it?

14 replies

TtRPC

•Created by Son on 11/21/2022 in #❓-help

TRPC Testing Wrapper - Unit Testing components that contain a query (Not testing the query it self)

Thanks for entering this thread! Really appreciate it. I’m a total noob tbh but I’m learning as i go. Why do i need to add that and how should I implement it. Im guessing i would need a mutation aswell? Or am I mixing things up here?

14 replies

TtRPC

•Created by Son on 11/21/2022 in #❓-help

TRPC Testing Wrapper - Unit Testing components that contain a query (Not testing the query it self)

SOLVED: I had to share the same instance of the trpc client into my trpc mock. so I put it in global store and used that instance in my test and it worked.

14 replies