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

TRPC useContext, not seeing trpc react-query helpers

Hey, I want to create optimistic update, but my trpc useContext does not see methods that are mentioned in docs. Anyone tried doing that? Do I need to add something to the config? I'm attaching screenshot of my code. ...

Including multiple tables on prisma

Is there a way to include more than 1 relation in a prisma query? When I write: ``` include: {...

Disable Refetch on Focus in TRPC

Hello! I believe trpc refetches data when the user focuses on the window due to using react/tanstack query under the hood, and I know you can disable refetching on window focus in react query. Where would I adjust that in the context of trpc in a create-t3-app?

Is it possible to refresh a nextAuth session?

I thought that using router.push('/') etc would refresh the session state, but it doesn't. I'm assuming a page refresh would do it, but either way. Is there a good way refresh the session?

Hashing oauth username and email in auth. Js?

Would that work to improve privacy of users and would it even work? To do that I would need to modify database adapter but it may not be too much of work. What other ways there would be to improve privacy?...

how to get the same effect as browser zoom/unzoom in css natively

so it looks like this on 100% zoom but i wanna get it to how it looks like in the 80%

Why can't I access array immediately after checking the index?

I check that the array index is accessible, but it is still typed as possibly undefined

nextjs 13 eslint not flagging empty button type or poor indentation

So I am just starting a new nextjs 13 project and I wanted to get some linting rules to help speed things along and keep consistency but it really feels that none of the important linting rules are being triggered like indentation and such. Are these not included in nextjs default eslint.
```json...

NextAuth and custom paths

How would you use NextAuth in a t3 app, where I am developing on a virtual machine?

next script / _document

i want to add a sciprt to the video page. when i place a next script in the head it says that scripts loaded before interactive have to be placed in _document. how do i make a _document that only applies to video page

createTRPCNext returns strings, cannot use .withTRPC()

createTRPCNext returns error strings so I cannot use its withTRPC method. ```ts export const api = createTRPCNext<AppRouter>({ config() {...

What causes infinite fetch or query?

I was doing some editing on the schema, using trpc.category.getAll.useQuery() and suddenly infinite refetch started. Anyone know why?

Manage items position field after delete

Hey, I'm working currently on todo list where user can change position of task using drag and drop. To do this i need number field on task to know on which position he is. And there is my question - if i have 5 items and someone deletes item 3 for example. should i change 4th and 5th items position to -1? I'm now using items length to set newly created task position (which isn't perfect i guess?). So, should I decrement positions that are higher than deleted one? Or there is some other solution? here is my Task schema...

[Noob] Not understanding how to create an edit form.

I have 2 major questions/problems, full noob to thank you for any guidance. I am trying to create an edit form for already submitted data, profile related data like username, description etc. During this process, a user picks a URL choice. ``` defaultValues: {...

Omegle clone saving socket ids

Hi everyone. I’m currently trying to make an Omegle Clone using NodeJS and React. For this, it’s important that random people are being matched with each other. I’m doing this by just randomly selecting two socket ids and have them communicate with each other automatically to eventually establish a video connection (through WebRTC) One thing I was originally doing was having an array in my server.js to store all socket ids. However, if I were to deploy this application, what would be the best way to implement saving these socket ids? I was thinking about using Redis, but I’m not sure what that would look like in this case....

Prisma cant find ENV variable in turbo repo

@acme/db:db:push: error: Environment variable not found: DATABASE_URL.
@acme/db:db:push: --> schema.prisma:10
@acme/db:db:push: |
@acme/db:db:push: 9 | provider = "mysql"
@acme/db:db:push: 10 | url = env("DATABASE_URL")
@acme/db:db:push: error: Environment variable not found: DATABASE_URL.
@acme/db:db:push: --> schema.prisma:10
@acme/db:db:push: |
@acme/db:db:push: 9 | provider = "mysql"
@acme/db:db:push: 10 | url = env("DATABASE_URL")
...

Pusher integration

Hi this procedure is going to send out either video saved or video is saving. when it is saving it activates a while loop. everytime i console.log on line 160 i want to send out progress update at the beginning of every while that is a number representing percent completed. how do i set up a websocket to send a number everytime the while loop restarts? does anyone have good resources for learning how to integrate pusher with t3 stack...

ESLint rule for not passing type into useState?

Hey guys, is there a ESLint rule I can enable to give me a error when Im not passing a type into useState? I thought this would have been standard, so maybe this isn't the correct pattern, but I would have thought best practice would be to enforce type declaration on state? Example: ```js const [prevBtnEnabled, setPrevBtnEnabled] = useState<boolean>(false); const [nextBtnEnabled, setNextBtnEnabled] = useState(false);...

helpful tips to prepare for deploying/launching an app?

i've been working on an app for a few months now, and i'm getting ready to release it, just wondering if anyone has any tips/blog posts/etc. that were helpful to them when doing this. currently i've been in 'move-super-fast' mode, so im not really following any good conventions for working on a properly deployed app (i have one hosted db and im using it for dev and on the live site, for example). obviously this is kind of vague, but in the past ive run into issues where the app breaks on everybody and i have to rush to fix it, so any advice on this would be awesome. some things im wondering: handling databases for prod vs dev, oauth apps in prod vs dev (callback urls have to be different), prod vs staging branches, etc etc. thanks!...

Use State and metadata API in the same component (next 13 app dir)

I have a component that's marked with "use client", because I also want to use useState but I also want to set some metadata on it, so I added this: ``` export const metadata: Metadata = { title: "Name", description: "Securing your success!",...