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

avoid auto scrolling when intercepting routes

anybody knows a solution for this? scroll={false} won't work for everybody https://github.com/vercel/next.js/discussions/48445...

How to store/design dynamic roles in jwt

I've been working on a project that has users that can join groups that are either public or private. I'm using refresh und jwt access tokens for authentication of the api. For most examples online, roles are always defined statically like this user is has an admin or user role. To reduce database fetches to check if a user can see contents in a group (so either is a user a member or is the group public) for every request, is it reasonable to save roles on a group bases in the jwt token? The problem I see is that a high number of groups can be public and therefore a lot (to many) of roles have to be added. ...

LF Video where Theo talks about using react query for ping

I can't remember what the video is. But I remember he saying that for ping they are using react query a bunch for handling microphone and other devices instead of global state management. I'm building something that also has to deal with microphone and video devices and I wanted to rewatch that video because I can't really see how react query can be helpful

Career advice for a 3rd Year CS Undergrad from India

Hello guys, I'm a CS student from India, currently in 2nd semester of my 3rd year, being following theo's channel for a while, my aim is to get an entry-level tech job as a fresher in next 6 months This is my current tech stack: - Next.js - Typescript...

Multi-Tenancy + Stripe

Hey guys thank you so much for all of your knowledge. Making an app I intent to have stripe payments on, but I want to link each businesses stripe account to their account, and I want my own stripe account to deal with the monthly recurring charge to the business. The only documentation I can find is this which isn't very helpful as to what the setup should look like... https://docs.stripe.com/get-started/account/multiple-accounts...

Manage Stripe Prices and Products Saas

I am currently build a product that I am integrating Stripe in. It is my first time using Stripe and I am finding it difficult to find the best way to manage your products and prices. In my case, there are only three tiers with monthly and yearly pricing. So it should not be too hard to hard code the price and products Ids in code and then roll with this. But, I wanted to do something more comparable to IaC. I started using SST with the Stripe pulumi provider, but I was constantly having errors when I wanted to change a something in the Price object. Really what I wanted to ask is: to those that already have implemented Stripe in production, what is the recommended way to manage your Stripe products and prices? I feel like hard coding is not the best way to do it, but it seems to be the one with less friction when managing a small number of products. Thanks in advance!...

How do I parse this using python and langchain's WebBaseLoader?

Hi, I'm trying to do the following: Create an or condition for SoupStrainer as bs_kwargs for WebBaseLoader where it will look for either a html tag, or a classname on all of the html tags. Currently I have only found a way to do an and condition, where it searches html tags with the classname. ...
Solution:
perhaps I could try this: ```python class CustomSoupStrainer(SoupStrainer): def _matches(self, markup_name, d=None, markup_class=None): # Check for 'main' tag or 'entry-content' class...

Google drive as file storage

Ok, so I know that this is going to sound really stupid, but I have my reasons. I need to do all the CRUDs on a predefined google docs folder and I am having some issues with finding out how. TLDR on the app is you log inn through Kinde and you will be able to make a report, look at the folders and files in the doc and do the CRUD. I have looked at some guides, but all that I have found require you to sign inn with your google account and gives the client access to there drive, I don't want the users to sign inn with google and I want them to only access the files in the folder I have predefined...

Is it necessary to have backend to upload pdfs, in uploadthing ???

i am thinking of only using frontend to upload pdfs and catch the url given by the upload thing and save it in the database. i am using .net as the backend so any recommendation???

dockerhub storage problem?

anyone else using dockerhub for container image storing? since they still don't have tag ttl expiration, and now that they introduced paid storage how would one deal with automatically expiring older images to not pay for unnecessary storage? or is there a better/equivalent registry alternative in terms of pricing to use?

Issues while initialising t3-turbo repo .

As the title suggests , i've recently come across the t3 stack and the turbo version of it , it's for a use case project that i can't disclose . I've been facing issues with initialising the git repo , it keeps lacking and the docs are a hell with zero mention of what to do if you're using something else than the default . 1st error : ( using supabase for db ) : Even tho i use the transaction pooling connection string or the other , i gives me errors as the connection string is a direct connection ( even tho it's not ) , i've tired replacing the connection string with multiple instances but no luck 😦 ...
No description

Integrating uploadthing with REACT + VITE

How can I properly integrate uploadthing with React. I read the docs and didn't understand it well. It looks like docs was written only for Next.js developers. Do you guys have any example of using Vite React with Uploadthing. Thanks....

Couple Apache Question

Thank y'all for taking the time to read this, really do appreciate it. I'm looking into internship roles (within the Cyber Security Field), and I came across this role where it is really wanting understanding of Apache coming into the role. They mentioned specifically that they wanted an applicant to be knowledgeable in both Apache Tomcat and Apache Ant. After seeing that Tomcat, and correct me if I'm wrong is a variant of Apache for a specific need, and Apache Ant is a tool to be used within Apache. My question is how does one know the difference between tools/distros of Apache, & is it possible to deploy and an Apache instance within a VM, and if so help on how to do it is appreciated, but links to outside resources would help a lot. Below is the role, and thanks again for your time. Role: https://careers.rtx.com/global/en/job/01735782/Intern-Business-Systems-and-Transformation-Onsite-AZ...

Enable mouse scroll or mouse drag in number input?

I have an Offset field for users to adjust a background image a few units to better centralize them if the size is off. Me and a friend felt pressing the arrows to scroll through values was too slow but there was no option to drag with the mouse or use a scroll wheel. I tried googling this question a few times and every single result was instead on how to disable this behavior. Most posts were a few years old so maybe everyone universally agreed it was bad design and is the new default? But I also love using the mouse to tweak number values in software like Blender and Godot so i don't know. Does anyone know how to do it? Should I do it, is it bad accessibility or something? Is there a better solution to the initial problem I'm not aware of?...
Solution:
Scrolling or mouse drag can be source of accidental triggering, since scrolling is used for scrolling the page. Isn't it better to use a slider ?...
No description

Passing Handlers or Centralize them?

I am using react-hook-form to create invoices with multiple modals for adding invoice items, applying discounts, updating information, and more. Each modal modifies the form state and requires specific handlers. Should I define all handlers in the parent component and pass them down to the child components, or should I create the handlers directly within the child components?...

New safe actions library

next-safe-fetch, my latest library for Next.js developers! It simplifies data fetching by ensuring your functions return only validated data—no errors, no distractions. Fully TypeScript-compatible, it's built for clean and efficient workflows. Check it out on npm: npmjs.com/package/next-safe-fetch...

Trying to wrap my head around Docker, Dockerfile, Docker Compose - and what about for OSS projects?

Hey all, apologies if this is a dumb question but I've never set up Docker before. I'm mostly a C++ client app developer with about 10 YOE, and mostly working in large and well established corporate projects where choice of technology basically wasn't up to me. I have done a little backend service stuff, but basically no full stack, if that gives you an idea of where I'm coming from. I've used Docker in the context of a work project where the test environment on the local machine was deployed in Docker, but I've never really known how to set it up or what the logic is behind when to use a Dockerhub image or not, considering that you can just run a container based on your own machine and install whatever requirements you need inside of that via a script with Dockerfile. Basically just run this script, plug and play, no thinking or debugging required. I was working on an OSS project some time back, years ago, don't remember which one, where someone asked for a Docker image for building/testing/running the app, and I didn't know what that was about so I just let it be. Kinda wish I'd taken the time to learn at this point. It seems fairly important. When looking around for Docker images I see that there are sometimes several different users uploading a Docker image to Dockerhub for the same project. Doesn't that defeat the purpose of sharing a base Docker image suitable for a given app?...
Solution:
@DemiTastes To answer a question about dockerhub duplications: Yup some are just duplications, but more often than not, people publish their versions. And since docker images are layered, you can take base image, install an additional dependency and publish it to dockerhub or your private repo. This is especially usefull when that docker image installs and/or compiles something (e.g. system-wide binary) as in the end you'll get an image with those deps baked in. I do this all the time - take existing image, install additional tools, publish to private image repository and reuse that as an image during CI/CD to speed up build times....

Anyone using Sentry without being overwhelmed by random errors?

I’ve integrated Sentry into my Next.js project, but I’m constantly bombarded with random errors that aren’t always related to my code. These include Network Errors, Request aborted, <unknown> errors and so many others. Is there a way of handling this without manually ignoring issues?...

Help with webpack error

Hello! Could anyone that gets nextjs help me understand this error I get when running npm run build: ``` Failed to compile. ./app/page.tsx + 1 modules...
Solution:
i'd try creating a new app and seeing if the issue persists