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

Updated T3 Tutorial

Apologies if this has already been explained recently. But did Theo mention releasing an updated t3 stack tutorial in his last stream? I thought he had but might have misinterpreted

Error with NextAuth and prisma

I am using the google provider with nextauth and prisma along with supabase, and I get this error when trying to sign in, ``[next-auth][error][OAUTH_CALLBACK_HANDLER_ERROR] https://next-auth.js.org/errors#oauth_callback_handler_error Invalid prisma.account.findUnique()` invocation: ...

How does UploadThing onClientUploadComplete work?

I'm looking at UploadThing to see how they implemented this cool services, and I do understand most of it, but 1 thing I still can't wrap my head around... How do they trigger onClientUploadComplete ? Steps 1-8 are pretty obvious to me. And in step 9 I understand that my server gets the response from the UT server with the metadata... but at what point is the onClientUpdateComplete triggered?...
No description

Best way to handle fetching large amounts of emails

So I have a T3 app that is essentially a project manager for a construction/remodel company. Every time the company is starting a project on a client's house, they create a new "project' in our app. One of the features for the scope is to have an "email" tab where we use the gmail API to fetch every conversation an employee of the company has had with the client, and display them in the app. The gmail API for orgs does have an endpoint to fetch all emails built in, but based on the fact that my fetch for single users emails takes like 3-5 seconds ATM, I'm guessing that doing a fetch on all this data at runtime is not going to to be viable. What approach would you guys recommend? One approach one of my coworkers floated was to essentially have a separate server that's running 24/7, and does this fetch call once every minute. We then have a DB that essentially just has one table, customers, and each customer has an array of messageIds. All we do is add in add in the ID of any message that has happened since the last fetch to the array. Then on the main app, we fetch the list of messageIds from the DB for the customer, and use that pre-compiled list of messages to fetch each email needed. ...

Streaming file from Client to Server to S3

I am working on a side project in which i need to upload data to an s3 bucket. The user will select a large file on the React frontend and upload it. The file is sent to an Express.js server that will pipe/stream the chunks to an s3 bucket as soon as they arrive. Is the formData that i send from the client to server a readableStream? ...

exported type changes on import (z.zodInfer)

I don't know why classes is being imported with undefined. When I check the export, there is no undefined, but when I check the import there is. This is causing issues in my code that I don't want to force away with a casting
No description

trpc/react not working on AWS

Everything works locally. When deployed to AWS (via sst.dev), trpc/react doesn't work. API is working (i can hit it via postman). It was working yesterday. Error:...
No description

trpc context not passed correctly

I will include my setup at the end. My problem is that I am using nextauth with database sessions and passing the session as context into the procedures; however, everything that I have added myself isn't being included in the context for some reason (user.id and user.role) This is my session type I declared, ```ts declare module "next-auth" {...

Recommended guides for knowing which html tags to style globally?

my design skills aren't great and i've gotten to know CSS mainly through tailwind. Most of my experience is designing app components but i'm working on some blogs and am finding myself sometimes confused where i tend to end up apply tw classes on many different main tags and what nto. I notice a lot of projects style their globals.css for some of the common tags. I'm wondering if there are guides that suggest like "you should do x to your body gloally, y to your h1's etc). I feel like im a little bit dyslexic so i hate getting "lost" in my tw classes , esp. across pages or components...

Clerk and tRPC "protectedProcedures" on the server.

Hey everyone! I am trying to integrate Clerk into tRPC so I can create protectedProcedures (using create-t3-app). Essentially I need the "auth" object returned by getAuth to be part of the ctx. Now I got this working nicely for client components. ...

TRPC Revalidating serverside queries

Hello, how can i revalidate serverside query data in TRPC? Common things like ```jsx const utils = api.useUtils() ...
No description

Vercel Deployment Stuck

This feels like a stupid question, so I apologize in advance if it is! I'm not having this issue anymore but it's still bothering me. I was reworking my portfolio, including OG images. I deleted the OG images, added new ones, and pushed the commit. On Vercel, the deployment was stuck on 'Deploying outputs.' I don't remember the exact steps I took before this, but I noticed I also had 'opengraph-image.png' in the public folder, as well as in app, so I deleted it from the public folder and the next push finally deployed. Would this have caused issues in deployment? The build never failed locally or in the deployment, and I never got any errors when running vercel build --debug. It just never made it past 'deploying outputs.' I couldn't find much information outside of this thread - https://github.com/orgs/vercel/discussions/4032 and those fixes weren't working. ANY feedback is appreciated. Like I said, this is resolved but it's driving me crazy not knowing what it was. ...
Solution:
Sometimes, deployment platforms like Vercel can cache certain files or states of your project. If a file is deleted in one location but not another, this could lead to conflicts or inconsistencies that prevent successful deployment.

How can I implement JWT access/refresh token flow with trpc

Lets say the access token has expiry of 1d and refresh token of 7d. When the access token expires the server will return 401 and will request for new access token. If it's past 7 days of login, the app should log out the user. Usually with axios I create an axios interceptor. What's the ideal way to do that in trpc. Any example of working code would be highly appreciated. ...

Resize Image

Is there a way to resize the image before sending it uploadthing? Since I do not need big images, it feels wasteful to save high res images.

white stroke and transparent fill

hey guys, wonder if there's anyone good with css here 😅 can anyone tell me why this outline looks like this? I don't quite understand how this text stroke thing works ```css .outline {...
No description

(SEARCHING) Visual API Design Site

Hi, I've seen a website that allows you to visualize your website processes (api), but I can't remember the name and there are so many unrelated results on google. Any help is appreciated!...

Managing High Bandwidth Consumption in Web Hosting and Cloud Storage

When using a web hosting service like Netlify or Vercel, it's advised to store files in cloud storage solutions such as Azure Blob or Amazon S3 to mitigate bandwidth surges and control costs during an attack or excessive file requests. However, this concern extends to cloud-hosted files as well. Attackers can target these files with repeated requests. Are there effective solutions to this problem? Or are the associated costs with cloud storage so minimal that this issue is rarely a concern?

next js production problem with auth

I’ve just deployed my app to vercel and when you enter it redirects instantly to auth which does not happen in dev. Any ideas what could be causing this?

How to interact with typescript language server programetically?

I am trying to build an app for user searching queries through language server. Maybe later on that can be enhanced with chatgpt for converting inference data to natural text. The issue I am stuck on is the search symbols api does not seem to be working at all. ( Check attached screenshot )....
Solution:
OK I figured it out, we have to pass all these stuff in initialization params: ```json { hostInfo: 'vscode',...
No description

Help with dynamic image in Nuxt!

does anyone know to import dynamic assets because ``<img :src="/nuxt/assets/images/${item.image}" :alt="card${index + 1}`" class="w-100 card_height"...