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

why are people not using t3 stack on production?

Ever since i found this stack i have used it in all production apps where i have the opportunity of picking a stack But whenever i see people on YouTube they all say they use t3 stack just for side project So i am wondering so am i in trouble for using t3 stack for production apps?...

useState bug????

i want to store the product id on a state but when i first click it show empty array, how can i fix this?

Next Auth Google not working ('client_id is required')

Hi, just started out. I changed all the DISCORD_CLIENT_ID and DISCORD_CLIENT_SECRET to GOOGLE_CLIENT_ID and GOOGLE_CLIENT SECRENT, in auth.ts, env.mjs, and .env (please let me know if you need to see the files) ...

Should I disable T3 eslint rule: no-floating-promises? Issues with React....

The typical model for fetching data, or doing anything asynchronous inside useEffect, does always triggers this rule,
Promises must be awaited, end with a call to .catch, end with a call to .then with a rejection handler or be explicitly marked as ignored with the `void` operator.eslint@typescript-eslint/no-floating-promises
Promises must be awaited, end with a call to .catch, end with a call to .then with a rejection handler or be explicitly marked as ignored with the `void` operator.eslint@typescript-eslint/no-floating-promises
Here's my code (with the rule disabled for the line): ```...

(Solved) Fresh T3 App Complaining About Session

Started a new project and was brought with this. It runs fine and can be ignored but I'm a bit of a neat freak and I'd love to sort it out. No errors during creation and no errors running.

file structure in react query

hello i wanted to know opinionated file structures for RQ im a rtk query users wanted to jump in RQ but i want to know before a good structuring that can scale if you have repos,blogs, or just your opinions about it i would love that...

Managing assets

Hey everyone, I kinda hit a wall so I need some help from You awesome people. At work we run a monorepo with two Next JS apps (deployed with Vercel) and a UI library. It got to a point where one of our apps has a 2MB initial load JS bundle and around 1MB additional code for every route. There's lots of code but we also have A LOT of SVG assets so I'm guessing it's partly due to them. Previous devs just put the assets alongside code (not even in /public) and just ran with it. I was wondering how You guys run assets in React apps (client-side mostly but I guess it doesn't matter). My idea for now is to move all assets to one of the two apps /public directory and create some utilities for using them directly in components of these apps. SVGs used in UI library components will be directly in code (so they don't depend on any unrelated service). I was also thinking of using react-inlinesvg for SVGs that require some modification (I ran some tests and it seems it's internal cache doesn't work - for the same asset it sends another request and you can see a wave of loading images). ...

Image is missing required "src" when it comes session.user.image

the image actually show up with showing any error but show error on the console

Prisma middleware delete

I have 3 models - Category, Product and Color. Whenever a category gets deleted, its products also get deleted(Cascade) and each product's colors get deleted. Each color has an image saved in a bucket that I want to delete whenever a Color gets deleted, how can I write an event or middleware that get triggered whenever a Color gets deleted whenever a Category or Product get deleted? I tried doing $use but when deleting a Product I don't get params related to the colors...

Good way to run single file script with NextJS

Is there a good way to run single file script without starting the webserver in a nextjs project and utilizing prisma/other server side features? Similar to django management commands (if you are familiar with python/django). I have tried using tsx but I am running into many small issues mostly related to tsconfig/module importing etc.

Forms: How would you go about updating relations from the frontend?

(long-ish post) I'm currently building an admin dashboard, where you can manage users for example. A user can be edited by going to /dashboard/users/<userid>, and there I fetch the whole user object including relations (role object, permissions object). ```javascript model User {...

queryClient type errors when adding default options to queryclient

```ts export const TRPCProvider: React.FC<{ children: React.ReactNode }> = ({ children, }) => { const [queryClient] = React.useState(...

how to work with tailwind intellisense on vs code

it's virtually unusable since the only way I can trigger suggestions is to kick it off with a whitespace. If I have something like text- already and remove the hyphen, I don't get any suggestions, but have to delete everything before I can get any suggestions. Is there some usage pattern I'm missing? the one I'm using is bradlc.vscode-tailwindcss

Deploying NextJS to GCP and using IAP

Has anyone ever deployed NextJS and added a IAP to require login before serving any files? I'm looking to see if I can deploy my NextJS app this way alongside a db that's also tucked away behind IAP.

How to avoid duplicate code in getServerSideProps?

Hey guys, sort of off-topic but lets say I have multiple components with getServerSideProps like this: ``` export const getServerSideProps = async (ctx: GetServerSidePropsContext) => { const supabase = createServerSupabaseClient(ctx); const {...

Off-Topic Animating using Framer

I'm trying to build a vertical carousel in react and I'm really stuck on how to actually animate the position changes ```ts import { type NextPage } from "next"; import Head from "next/head";...

trpc/react-query render logic

I've made the attached diagram to try and explain the scenario, but for additional context, my issue is this: I have a page that conditionally renders two main views. the editable view submits a form, after which I would like to render the opposite view, but with the new data. currently, i'm invalidating on success, though it seems that the completion of invalidate doesn't ensure that my other component will have refetched its data yet. my idea would then be to block my readonly component on both loading AND fetching. the issue here is that toggling between views when there is not a form submission ends up showing a load state, presumably because isRefetching is true even if its fetching from cache. ...

Add custom background from file with tailwind

I would like to add custom background to website via local file and I used this <div class="bg-[url('/your/image.svg')]"> <!-- ... --> </div> Doesnt work...

Not sure if data is being exposed to the client

Hello team, I have the following Supabase JS client which should not be exposed to the client. ``` // pages/api/supabase.ts import type { SupabaseClient} from "@supabase/supabase-js"; import { createClient } from "@supabase/supabase-js";...

Deployment on AWS

Hello, I want to deploy my t3 app with a postgres db on aws using the free tier. Is dockerizing the project and using ECS the easiest option?