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

Just started trying to learn prisma through the docs and I'm getting an error

When I run "$ npx prisma migrate dev --name init", the terminal returns "Error: Couldn't find a datasource in the schema.prisma file"

Best way to pass down variables & filters from React-Query (& TRPC) to Prisma?

Say I want to get all users whose email address ends in prisma.io, who have also published some posts. I know how to do this in prisma: ```js const result = await prisma.user.findMany({ where: {...

Created a Resizable HTML table, missing one last thing

I created a Resizable table with event listeners, I used React because I need it in my project (mainly for useRef Hooks). Stackblitz - https://stackblitz.com/edit/react-ts-devbrv?file=useResizableTable.ts Basically when shrinking a column, it checks that the columns' widths are higher than the minimum width, and if not, recursively searches for the next column it can shrink and focuses on it....

Functional approach for concise code

Hello, Soon Im gonna rewrite my app with T3 stack and I just wonder about approaching backend/fronted Logic with more functional paradigms. Originally I wanted to use ramdajs but I read its problematic with typescript. Yesterday I found two libraries that seems very promising but wanted to hear if someone has any opinions about them and in general about FP data transformation handling.
https://github.com/mobily/ts-belt ...

Zod - sort schema

Hi. I am adding sort option to prisma findMany query. Since I don't know zod very well, I could not think of any possible type-safe solution. Sort format should be: columnFieldName:orderType, so for example: firstName:desc. I made my types from @prisma/client, but don't know how to add them to tRPC input. Is it even possible?...

tRPC client error

Someone that has any idea on what might cause this issue and how I can resolve it? (I'm trying to bump tRPC from v9 to 10 in my cross platform monorepo that is using the starter from the link below) https://github.com/chamatt/create-kaol-app This is the error I get on the client: ```...

Next JS API Route Never Returns HTTP Status

Hey Folks, I have a very basic REST API route (Its a web hook so it cant be a TRPC route) that checks if the request type is POST and if so returns a status of 200. However, when I try to use this the request times out and never returns a response. Could anyone point me in the right direction? Here is the route:...

Prisma TRPC Casing Issue

I have following schema: ```ts model Customer { id String @id @default(cuid())...

CSS Question - black or white text color based on background

Hey guys, I'd like to have my text colored based on the background color. I found a way to do it on the CSS tricks website, but it's using a mix-blend-mode - they say it's not well supported and it also does not work with only black / white coloring. Is there a pretty convenient way to do it in CSS (maybe Tailwind) / JS (I'm using React)? The screenshot shows what I have right now (I want the black text on the red-ish background to be white)...

What's the best way to attach functions to a TypeScript interface?

So I currently I have game objects with properties attached. For example, a creature card with properties attached. Now I have code like this:
const isSlow = card.properties.includes(Property.Slow);
const isSlow = card.properties.includes(Property.Slow);
I kinda hate this, especially if I have to write code like this all over the place. ...

NextAuth 2FA with oAuth

Just have a quick question about adding 2fa to oAuth providers with next-auth. Does anyone have any example code or advice for me? Ideally I'd like to continue to use the existing provider without having to re-write it.....

why is prettier broken on vs code?

I have the vs code plugin installed, I have prettier included as a dev dependency in my project, and my settings.json has these lines. ``` { "[typescript]": { "editor.defaultFormatter": "esbenp.prettier-vscode"...

When is the streaming with Primeagen?

I mean, we all want it and it's pretty obvious at this point

TRPC query initial undefined

How can I get rid of the undefined issue, the initial trpc request returns undefined, which is causing an error what may I be doing wrong here? ```ts export default function Clients() { const allClients = trpc.client.getAll.useQuery() console.log(allClients); // this is initial undefined but fill it later...

is anyone else having issues with creating a new preact next app with pnpm?

running pnpm create next-app --example using-preact preact-app is ok, but then once I run pnpm dev I get: ``` ready - started server on 0.0.0.0:3000, url: http://localhost:3000 error - ../../node_modules/@prefresh/core/src/index.js:7:0 Module not found: Can't resolve 'preact'...

Convert zod schema to typescript interfaces

Does anyone know of a good way to convert zod schemas to typescript interfaces?

React Query - Update data after successful mutation

Using vanilla react query I was used to use one of these options. What are the options with tRPC? Since queryClient doesn't provide any of these methods. const queryClient = trpc.useContext(); ...

Credentials Auth with tRPC

I'm rebuilding a client's site with the T3 stack. We originally had to do away with NextAuth because we figured its CredentialsProvider wasn't going to work for us. Then we moved to Strapi and after using Strapi I decided I'm just gonna do it myself. <Insert Thanos GIF> We still need to authenticate users based on username/password credentials, and I'm not sure how tRPC handles that within its ctx since according to NextAuth docs (https://next-auth.js.org/providers/credentials) it doesn't store session data in the DB....

Adding next.js plugin to T3?

if I want to add a next plugin to t3 do I just add it to the arg in defineNextConfig?

Next.js multi zones and shared components

I am using Next.js' multi zone feature with a blog and web app so I can develop and deploy both apps independently. It was easy to set up by following their example and I have set up a blog app at port 3000 and a web app at port 4200, which is working fine. Unfortunately I am encountering some problems that aren't described anywhere in their documentation (as far as I can tell). I am working in a monorepo and have shared components between both apps, such as the header and footer, which obviously includes navigation. When I am on the blog and want to navigate to e.g. the /about page, then it will obviously navigate to localhost:3000/blog/about instead of localhost:3000/about. One solution is to check the base path in the navigation component and then prepend localhost:3000 to the href if the base path equals blog, but that refreshes the entire app and does not result in smooth navigation, so it's not really ideal. Is there anything else can I do about this?...