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

How to Install Forked Next Auth from GitHub

I forked the next-auth repo and made some changes to fit my needs. How can I install this repo with NPM from my forked github repo? I'm not very familiar with Turborepo

Auto populating new tables on user sign in

I created two models that are related to User in the same way Account and Session are. When a new user signs in User Session and Account all get populated with data, but GameData and UpgradeData dont seem to even with default values supplied. Ive looked through trpc.ts and auth.ts to see if I need to add anything in those files but I dont see anything related.

Stripe Webhooks

Hi, I've been struggling with the Stripe Webhooks for a while. Here is my webhook route (src/pages!/api/webhooks/stripe.ts): ```ts...

Using T3 as API & Admin Panel Layer then consuming API layer tRPC on React Native 🤔 utils/api.ts 😭

Im pretty new to tRPC , what i have understood is that tRPC typing is being consumed by the front-end using utils/api.ts. Does this mean if i use T3 as an API layer & Admin Panel layer then i have to copy paste the utils/api helper to my React Native project to have front-end typing :?...

ESLint parserOptions issues

In my src/env.mjs file, I get this error `` Parsing error: ESLint was configured to run on <tsconfigRootDir>/src/env.mjs using parserOptions.project`: /users/niels/path/to/project/tsconfig.json However, that TSConfig does not include this file. Either:...

Chat with trpc / nextjs / vercel

Hello, I would like to make a messaging system with trpc and nextjs. I host everything on Vercel so I need it to work in serverless. https://trpc.io/docs/subscriptions...

Theme with tailwind and shadcn

Background: Next-themes is working fine, it switches from light mode to dark mode and these switches are reflected - if you look at the inputs here, they are dark because we're on dark mode. When the app is light mode, they switch to light. In my global.css, I have it set up exactly like shadcn's docs (bc also that's how it's initialized when installing), and for :root bg-background is white, and for .dark bg-background is dark lol The issue is:...
Solution:
Hm... Try switching .dark to .dark, [data-theme='dark'] in your globals.css

How do I setup a base api url for the preview environment when deploying to Vercel?

New to Next and working with API routes. My API routes are working locally when I use http://localhost:3000/api as the base URL but how would I create a base url for the preview environment since the url is dynamic?

Moving Prisma Schema To Its Own Package in a Turborepo

Hello! I would like to move my prisma schema into its own package within a monorepo using turborepo. I have the monorepo up and running already, but was wondering if it is as simple as moving the prisma folder into the packages directory or if there is something else I have to do. Thanks!...

tRPC losing types on t3-turbo

I'm trying the t3 turbo repo, trpc loses type defs out of nowhere on nextjs, types work fine on expo, has anyone else experienced this? im not sure what information im suppose to give cause i have no idea what is even causing this. Thanks for any help. Using the latest version of t3-turbo

Shadcn fonts not working

Hi! So I'm using shadcn for as my component library. I'm using the Dialog component together with nextjs but using nextjs fonts does not apply to other components of shadcn, especially in my dialog content. Do you guys know how I might be able to fix this? Thank you!

react query persistQueryClient: store each queryKey/queryHash in its own IDB k-v row

I'm currently using react query to persist some queries to indexedDB (a lot of queries, so i can't use localStorage because it's limited to 5mb) I noticed that RQ stores all of the queries in one single k-v. it it possible to set the persister to store each queryKey/Hash on its own k-v row? Having them all inside one row makes it a bit harder to debug since now during dev, i periodically check if my cache is actually correct or not....

Typescript error for "property does not exist', when it clearly does.

I have some objects (named program' in code) in an array which I am iterating through, and reading program.programSecTitle of an object, which is string type. Typescript is showing error saying it does not exist, even though it shows that property name in the object type itself on hovering. It is working fine in the UI, i.e. program.programSecTitle is visible in the UI without any errors. But just in the vscode its showing error....

Context in App dir

I just wanted to understand , if I have global context providers that I need to use in all components, would it be possible to still use server components using app dir in Nextjs if I wrap the children in context Example from next documentation: import { ThemeProvider } from 'acme-theme'; export default function RootLayout({ children }) {...

Discord OAUTH not working, I've tried almost everything

When I try to sign in with discord it gives me the "Try signing in with a different account" error. I double checked my redirect link and it matches up. Database is pushed to the production branch, my NEXTAUTH_URL is set correctly in my environment variables. Discord id and secret all set correctly. I've retried all this multiple times and i've also reployed. Nothing is working.

What is the best way to push data from external sources into my db?

I want to import data from external sources into my app. I think it would be more efficient to access the database directly. We usually use FastAPI for our Python backends. I am curious if I can use Prisma/trpc on my backend and keep the Prisma schemas in sync somehow. This might be a crazy idea. I would appreciate some advice on this. Basically, we have a NLP department that generates content and needs to push it into the db's of the different apps. Wondering what the best route would be to do so....

persist user vertical scroll during navigation between pages NEXT 13 App Dir

i wanna learn how to keep the user where he was during navigation between pages like, open blog post, then go back to feed, but keeping the feed vertical scroll history i'm using server components, the issue is the page is rendered then the javascript loads and moves the user to desired position, garbage ux...

Reading public folder on prod

Hey y'all! So I have a folder of images residing in /public, that I read from a trpc procedure, and render the contents of it on client. Everything works great in development, but obviously things work different on prod. So my question is, how can I access the /public folder on prod, when the project is hosted on vercel. ```javascript let filePath; if (process.env.NODE_ENV === "development") {...

Property 'prisma' does not exist on type 'object'

#0 9.578 Failed to compile. #0 9.578 #0 9.578 ./src/server/api/routers/example.ts:19:16 #0 9.578 Type error: Property 'prisma' does not exist on type 'object'. #0 9.578 ...

SVGs in Next

Hey friends. I'm working on a new project and having some issues using SVGs. What is your recommended method for using SVGs in Next? I know there's a lot of answers online, but I'm wondering if there's a specific T3 way of doing this. Thanks! 😄...
Solution:
I create react components for them and put into separate folder.
const SVGLogo = () => <svg>...</svg>;
const SVGLogo = () => <svg>...</svg>;
...