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

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>;
...

Server to server authentication

Hi guys, does anyone have experience with server to server authentication in a T3 setup? I find a lot of great solutions like clerk for user authentication but what if you want IOT devices or external server to be able to connect to your endpoints, Does anyone has any experience? Maybe a tool or technology to advice on?

Type error when using useInfiniteQuery

Argument of type '{ cursor: number; location: string; }' is not assignable to parameter of type 'Omit<{ cursor: string; location: string; }, "cursor">'.
Object literal may only specify known properties, and 'cursor' does not exist in type 'Omit<{ cursor: string; location: string; }, "cursor">'.
Argument of type '{ cursor: number; location: string; }' is not assignable to parameter of type 'Omit<{ cursor: string; location: string; }, "cursor">'.
Object literal may only specify known properties, and 'cursor' does not exist in type 'Omit<{ cursor: string; location: string; }, "cursor">'.
That's the type error I am getting. I am using trpc with nextjs ...

prisma push data loss

I had a table populated with a few records I then updated my prisma.schema to add a new table (and include the old ones) and used prisma push I got no warnings about data loss...

More Clerk + tRPC weirdness

I've seen a few questions recently related to the interaction between Clerk and tRPC, but my issue is apparently just different enough that it's not solved by the same things. I'm attempting to make the root route ("/") public and everything else protected, but any tRPC calls return a 401 error. For reference: ```typescript // src/middleware.ts export default authMiddleware({ publicRoutes: ["/((?!.\..|_next).)", "/", "/(api|trpc)(.)"],...

Fetch request in server action not working

I have a react hook form with 'use client' In my onsubmit I want to do a post request to my other backend (for testing on localhost:5001, but Nextjs always gives an error, Do I need to do things differently to make it work or is such fetch only possible in client side? ```export async function sendContactAction(data: any) {...

When Is it time to make the component wet and give up on ternaries?

https://github.com/diffim/diffinlist https://diffinlist.vercel.app Check out the Section.tsx component and how its implemented along with SectionCard.tsx, because of typesafety and different fetches I had to do the .map part of the component as children, yet I dont feel like this is very dry. Also there are a lot of ternaries in that component for things that only happen once. Should I just make the codebase wet and make a different componrnt for each different fetch/section? Like I.e for the landing page make <AllPlaylistsSection> as the project grows it feels more hectic to maintain this component as I keep having to add more ternaries. Or is this normal and I should just continue....

Outputting zod definitions for use in a different codebase

Hi, I would like to take my zod schemas and output them for use in another codebase. Unfortunately when using tsc emitDeclaration with: import { z } from 'zod';...

NPM and NODE errors

I clone a repo from bitbucket, delete the existing package-lock file then run npm install, make some changes on the code. When i run npm build or npm ci locally everything is ok. When i commit and the ci tool we use (jenkins) gives errors sayin!!!! "npm ci can only install packages when your package.json and package-lock.json or npm-shrinkwrap.json are in sync. Please update your lock file with npm install before continuing."!!!! This happens only on my machine, every other in the team has...

Making Next.js loves my custom conditional exports

Hello 👋, I'm trying to fiddle with the Next.js webpack config to have the resolution follow my custom condition in package.json#exports. Normally with webpack it would be as simple as putting the value in config.resolve.conditionNames, but it doesn't seem to work, my package is still not resolved....

NextJs router error in app dir

Can anyone help me why I am getting this error ,I have used 'use client' directive in this component , but still its throwing this

how to use useState in turborepo ui package component such that it works as client component

when I add a useState to https://github.com/vercel/turbo/blob/main/examples/with-tailwind/packages/ui/src/Button.tsx , I get this error You're importing a component that needs useState. It only works in a Client Component but none of its parents are marked with "use client", so they're Server Components by default., but I'm seeing that a useState is used just fine here https://github.com/vercel/turbo/blob/main/examples/kitchen-sink/packages/ui/src/CounterButton.tsx . I, then, saw https://github....

Is there a way in Zod to validate a field in a schema conditionally on another fields value?

i.e if z.object.itemType is set then z.object.itemMeta should not be null. Using refine it appears you don't have access to the object your inside of, so you can't check there and I don't want to refine on the whole object as I can only return one error message. Any thoughts or ideas?...

Prisma in TRPC context

hey, i'm using trpc and i have my prismaclient instance in trpc's context. i sometimes like to put business logic into functions seperate from my procedures. is it fine to just use a prisma instance which isn't in my trpc context or is it a bad idea?

Initiating another prisma client for SSR

I closed my project, opened it up again and got an error on prisma.etc. On my page that does SSR. I have since added the prisma client on that page. Initiated it, now it's working. Then i deleted it, shut down my project and spun it up again and it's working fine. What is this magic? /code ...

T3-APP + NextJS app/directory

Hello Guys I am glad to be here ! I was if someone knows if they are going to use the new app directory, i tried to migrate but didn't work 😦