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

is there an image lazy loading library for astro?

I found this cool library called Blurr-Hash with helps with lazy loading images in a really cool and efficient way. but the thing is I also want to use this component from @astro/image called Picture where I can specify multiple versions/sizes of images. and I don't know how to combine both, then I thought there must be some library for this that is specific to astro. unfortunately I found non....

How to infer the ref type of a component?

Let's say you have a component that wraps an input: ``` const Input = React.forwardRef<HTMLInputElement, React.ComponentPropsWithoutRef<"input">>((props, ref) => { return <input ref={ref} type="text" />;...

Handling prisma errors

Hey, quick question. Let's suppose that in my db I have model User with few unique fields: name, surname, email Should I validate manually that those fields are unique and throw an error if not or should I just let prisma do it? I guess that the 2nd solution is better. How do I map prisma errors to show more human friendly messages than this: ```ts { "statusCode": 500,...

Next.js middleware with NextAuth server session?

What is the best way to write a Next.js middleware (middleware.ts) that redirects to /login if the user is not logged in? I'm using the t3 stack with db sessions

Casl.js with create-t3-app

someone knows how can i setup casl.js for authorization? it is possible to use @casl/react with @casl/prisma ? i googled these question but i found nothing

Typing component based on props

Hi all, I'm trying to type a Link component based on it's props. If url is passed as a prop, I want the type of the component to be an HTMLAnchor element, if I pass in an onClick I want it to be an HTMLButton etc. I have the following but it doesn't seem to work. It lets me pass in both an onClick and an href, which shouldn't be possible as href doesn't exist on HTMLButton...

Audio Recording and Playback.

whats the best way to do this in react? all the libraries i find are old, i have a written a hook that records audio and returns a blob just want to know if there is a better way to do this.....

NextAuth CredentialsProvider + database strategy

It looks like NextAuth does not want you to use the credentials method in combination with a database. Even when providing a database adapter, NextAuth does not store sessions in the database. Is it advisable to just use JWT instead, or switch to another library?

Weird color change from production to developement?

Hi, I've recently encountered one of the weirdest things in some time. On my development build of my nextJS 13 app (t3-stack) I am using the following color code: #F9C74F in a css file. Also on inspect element it shows that color code. On my production build that exact same color code in inspect element is shown as: rgb(128, 93, 11); ...

Best practice for using router types on client-side?

I saw that in T3s src/utils/trpc.ts we are provided with:
export type RouterInputs = inferRouterInputs<AppRouter>;
export type RouterOutputs = inferRouterOutputs<AppRouter>;
export type RouterInputs = inferRouterInputs<AppRouter>;
export type RouterOutputs = inferRouterOutputs<AppRouter>;
...

Discord OAuth error OAuthCallback

Hey, this feels like a noob question but I've searched for related issues and not been able to solve it I'm trying to sign into discord on production - I'm able to do this just fine running on dev against http://localhost:3000 I've created a separate app in the discord developer portal for prod against https://www.mywebsite.example/api/auth/callback/discord and get as far as the attached image, but clicking Authorise just takes me back to the 'Try signing in with a different account' error message...

CT3A tRPC make List of dynamic fetches

I have a list of discord guild id's, how should I go about dynamically requesting the guild's information from discord? (Not asking for discord-specific implementation. My question would be the same if you wanted to, for example, convert a user-id to username using db

Is this a good way to fetch all of the users inside this relational table?

Hi guys, Is this the best way to have an endpoint that gets all of my "Workspaces"? (I want to get all of the Workspaces a user is in, based on the UserWorkspace table I have) I don't like how I had to pass in that long array type to userWorkspace constant. Is there a better way to do this?...

must i use snake case in all my database naming

Example when using prisma ``` model User { ... CompletedOrdersId String @map("completed_orders_id")...

myArr.findLast is not a function

Hi there, i have a problem with findLast in my test environment. It works properly in the browser, but when i was testing it, it cause error myArr.findLast is not a function

Writing Typesafe sql?

Advice for writing typesafe sql with some linter or something? I'm using supabase for a while now, and the only thing i don't like is writing sql without any type hint or autocomplete, there are some way of getting this right? vscode extensions or something?

Is there a way to request images from Next resized via URL without the Image component?

Question is pretty much in the title. Something like: https://example.com/img/test.png?w=500&h=500...

Copies of Database Schema In Multiple Regions (Prisma)

I want to make copies (just schema not data) of my database in different regions but have prisma search all of them (but not create). Any off-the-shelf packages that do this?

Middleware and firebase Auth

probably it is a noob question but I really didn't find any answer out there. How can i implement middleware in nextJs with firebase auth? i am using 12.2 nextJs and trying to authenticate my users in middleware before sending them to dashboard.