Theo's Typesafe Cult

TTC

Theo's Typesafe Cult

Join the community to ask questions about Theo's Typesafe Cult and get answers from other members.

Join

getStaticProps runs multiple times!

Have no idea why this happens, few threads on github but no solution it seems. When it runs, only one of the runs has the proper params, the rest are just undefined. ```ts //[pid].tsx...

Railway React deploy error

has anyone got this error while trying to deploy react app to Railway? FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory...

React hook form append custom key value

I have a form with an input type text, I can add text and click on enter to add the value to an array. I want to save the data from the array to my form, but currently tags is still undefined once I submit. Any ideas what I may be missing? ...

Is trpc returns promise?

I am pretty noobie, accept that. Is trpc returns promise? If it doesnt how do we handle errors?

Stripe - can I use tRPC for Stripe's webhook?

I'm building a Strip checkout and I am wondering if it is possible to use tRPC endpoint for handling Stripe's webook. I have one more question regarding to Strapi, how can I verify what custom has paid for the product? (I am using T3 stack)...

Cross platform authentication

What would you recommend for authentication in a cross platform (web / mobile) application? tRPC will be used for BE and for DB I'm not certain but leaning towards a postgres db handled through Prisma...

TRPC still looks for old column name after renaming

So I updated my prisma schema and also renamed my column in my table. But somehow I still get an TRPC which says that the column name is wrong. ``ts TRPCClientError: Invalid prisma.customer.create()` invocation: ...

Please help with complex form query state management mess

```ts type EditChapterInput = { content: string, id: number, title?: string...

SSR to help mitigate slow client data transfer and improve TTI?

I'm involved in an ongoing saga at work to improve the state of a SPA that is just an order form. This app was built with CRA before I started working here, and we are rendering on the client-side, fetching data via GQL (7-ish requests in total), then doing a bit of processing of that data before setting in state and allowing full interaction. I've had some success moving the app away from using Context for everything and triggering tons and tons of updates, and also restructuring the way in which we are fetching data. However, I'm still not fully happy with the performance of the app on mobile. I've been told that we do have users that may be on slower phones and with connections as slow as 2G worldwide, and so I'm looking to see how I can potential mitigate some of the issues a user may run into. Please forgive me if this is a super basic question, as I'm not incredibly familiar with SSR/Next in practice and I could just have a fundamental misunderstanding. But it struck me that if a big area of concern is the potential slow speeds of CPU/network on the client side, it might make sense to send off for the data necessary to allow interaction on the server-side with something like getServerSideProps. This data is not consistent and varies depending on the URL's query string, so unfortunately generating something static and rebuilding doesn't strike me as feasible....

Changing URL but components re-rendering.

I'm working on an application wherein you click on various chapters of a story and it should update the form fields on the page with that chapters content. The URL is changing correctly, but the form fields are not rerendering with the new content. What do?

Weird React error

When I show a notification or a modal that is outside of root div. In each render, this error will occur and this is not the first time that this happened. I investigated it a bit, but I couldn't find a solution. This error happens exactly when I call a notification that is set to be positioned absolute or outside the root div. It says can't set the property of undefined, but I can't find it I guess it's deep into react...

Is there a way to async await a mutation instead of passing a callback to onSuccess?

Basically I would like to do: ```ts let m = trpc.useMutation(["example.testing"]); let result = await m.mutate({something: "example"});...

Needed help to write unit test for image download

Hey there, I wanted to write test for the handleShareClick function, this function uses html2canvas lib and I am not sure how I acna write a unit test using jest. PS I am new to testing. Here is the code: `` const handleShareClick = () => {     html2canvas(document.querySelector('#share')!).then(canvas => {       const dataURL = canvas.toDataURL();...

Fixing React video questions came up to my mind !

* do I have to work full stack to use the benefits of async components? * Instead of Prisma any promise-based function will do the same right? * what about useQuery(). it's a hook so is it gonna work just like Theo showed us like : ...

how would u await something, if you cant use promises and await 👀

I have a function in a class that cannot be async, however in that function i need to run another function that will do a playthrough of a game (basically just run a set interval, every 50 ms) and when that returns, then execute the rest of the function i dont think that can work with a callback as i specifically need to wait for the function that does the playthrough to complete as it returns values that the outer function needs. ...

how to block first trpc call fetching user data after next auth authentication completed

I'm trying to implement auth such that I pass some string derived from the token from the auth provider into the authorization header of the request I would send via trpc or react query, for that matter, which means that fetching should definitely not start until the auth process is totally complete, which can be signalled by either the token being available through . I feel like this is a common pattern but I'm having trouble finding docs for this. Thanks.

NextAuth Alternatives

Hello, im looking for a NextAuth alternative because cloudflare functions isn't supported yet https://github.com/nextauthjs/next-auth/issues/5142 anyone know of an alternative? Reason im wanting an alternative instead of just waiting is cause i think it will, take a while to actually get pushed and my application mainly focuses on having some sort of google auth.

how to access value on next auth jwt from client

When logging my next auth jwt, I see a value i had added but am not seeing it in my cookies.

Returning Prisma generated in nextjs issues error 'TypeError Do not know how to serialize a BigInt'

I tried following the thread here https://github.com/prisma/studio/issues/614 and it sounds like I have to monkeypatch BigInt to get it to work. Is there a better way?

trpc.useQuery() succeeding but returning empty data?

Ive checked my db and the entries definitely exist. and the query is sending the right Id input to find a unique entry using the id. But the data object in the useQuery result is undefined...