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

Filtering in React-Query & Trpc?

Say I have a filter on my frontend. I have an option to get all the users who are blue or all the users who are red. In the front-end, I pass that filter value into react-query and in the backend I use that passed-down filter value in my prisma call to my database. In trpc/react-query I do: ```javascript...

JS library for visualizing & interacting with graph db

Does anyone know if there is a good npm package or some other good off the shelf solution for visualizing and interacting with relations in a graph database? For example with a role based access system, figuring out through which edges someone has access to a role, and changing this. We're using Memgraph, which uses the same Cypher query language as Neo4j.

Using Rust with Turborepo project

Hey guys! I'm building a relatively big monorepo app. It contains NextJS app, Expo app and other parts of create-t3-turbo. However, I need to build a microservice (I'd love to have it in Rust). It's just going to be a algorithm for my backend....

what is the best way to redirect the user to login page in CSR?

I have this jamstack app and I want to redirect unauthenticated user to the login page, in case the session expired he still have the code in the browser to do certain actions. but the cookie is not there. so in the server I only send a response with 200 status. that says {redirect: true}. and I act in the front based on that. is this a good way to do it? or is there a more standard way?...

TRPC mutates the data in the backend but doesn't rerender on the client? (shows stale data)

I have a very simple useQuery call and a very simple mutation I am doing: ```js const mutation = trpc.item.update.useMutation(); ...

trpc.useQuery() doesn't have keys like with react-query?

I'm using trpc.useQuery() to get the user and was thinking of using a key like with react-query so I can query the cache for the user again later. However, from what I can see, it looks like there's no keys when using useQuery on trpc? If that's the case, is it good practice to store the user in context when using trpc? I wanted to avoid doing that if I can let react-query be my state manager. Ultimately, (1) does useQuery() have a key value cache function? If not, (2) is it bad to useContext to store the user?...

datepicker recommendations

Hi, does anyone have suggestions for a datepicker that supports time and works on all the basic browsers? It'd be great if it's also decently stylable (tailwind)

Help Needed with nested Comment Schema

Hey frens. I'm building a stack overflow clone for poultry farmers. For a commenting system, how should I go about modeling comments, and their replies? I watched a great tutorial by MonsterLessons Academy. https://www.youtube.com/watch?v=sjAeLwuezxo ...

Do I need to transfer react-query (trpc) values into local state first, if I want editable Inputs?

I am learning react-query and I get roughly how it works when I'm fetching & mutating some very simple data. What I don't understand is this: Say I have a Settings Page with multiple input fields where users can change their names, addresses and other things. Now I would love to put the data I get from react-query directly into a <Input value={data.name} />, but since the user will maybe want to change that data, I will need to have some way of updating it....

Help Simplifying this Type

Can anyone help me simplify this so that I only need to specify the 2nd parameter. Key and Key2 are always the same, I just needed to add additional constraints to Key and this was the only way I could figure out how to do it. FieldValues, ArrayPath, PathValue, and Control are all from react-hook-form if it matters. ```ts...

[SOLVED] How to get data using useQuery, then update it using useMutation without reseting inputs?

I'm using React-hook-forms in combination with T3v10 and I've come to a problem I don't have a solution to.... It's essentially a user profile form. I want to get the user's data with useQuery, then set those values as the default ones for the inputs, and when it's saved with useMutation it should keep the new data. Which is basically this part:...

Next-Auth types

Im trying to add type groups so I can have typings for my nextauth config. Can't seem to figure it out. Whats is the exact way I can do add the type for such ``` callbacks: { signIn({ profile }) { const { groups = [] } = profile; // <--- make groups typed...

How to type either

Quick question. I have an object I'm passing as a parameter. It has the shape
{id: number, name: string, foo: Partial<SomeObject>}
{id: number, name: string, foo: Partial<SomeObject>}
I need either or both id and name, and I require foo. How would I go about typing this?...

help with invalid prisma invocation

I'm getting
Invalid `prisma.invite.findMany()` invocation:
Error converting field "groupId" of expected non-nullable type "String", found incompatible value of "null".
Invalid `prisma.invite.findMany()` invocation:
Error converting field "groupId" of expected non-nullable type "String", found incompatible value of "null".
pictured below is an entry in the db im looking at from the prisma client, and here's the model in question ```...

Push notifications in a react app

I'm adding push notifications to my react app (TS and react-query on the frontend and MongoDB for the backend). Thinking of a pub-sub model (instead of webhooks/websockets) since the notifications need to go to all users of a workspace. Haven't ever built such a system before and was looking for recommendations on implementations.

The current domain is not authorized for OAuth operations

hello everyone i have vite app and i used firebase google auth . it works fine but when i deploy it on vercel it give me this error : The current domain is not authorized for OAuth operations. This will prevent signInWithPopup, signInWithRedirect, linkWithPopup and linkWithRedirect from working. Add your domain (todomarwenlabidi.vercel.app) to the OAuth redirect domains list in the Firebase console -> Auth section -> Sign in method tab. this is my app link : https://todomarwenlabidi.vercel.app/...

How to do this React Query thing without useEffect

Hi, here's some working code that I would love to remove the useEffect from. However if I just give the input text to the query directly, search results disappear when the user changes the search text because it creates a new query. Any ideas on an elegant way to solve this? ```ts const [inputVal, setInputVal] = useState(""); const [text, setText] = useState(""); ...

Dynamically rendering a component using an object

I'm currently building a React/Next application that's connecting to a CMS. The CMS gives the structure of the website in JSON and our job is to translate this to React components. Each "JSON component" has a unique name property that's being used to match the "JSON component" with the correct React component. Let's say we have two components, ComponentA and ComponentB. ComponentA has the following properties...

Validating supabase JWT token locally (without making a request to their API) [solved]

I have a nextjs api handler that calls this to validate the user (and then makes a DB request using user.id):
const { user } = await supabase.auth.api.getUserByCookie(req);
const { user } = await supabase.auth.api.getUserByCookie(req);
...