TTC

Theo's Typesafe Cult

Join the Theo's Typesafe Cult server to ask questions!

Join

TTC

Theo's Typesafe Cult

Join the community to ask questions about Theo's Typesafe Cult and get answers from other members.

Join

george

1/12/2023

I can't apply justify-content: center to div #tailwind

Please guys tell me why i cannot apply justify-content: center... It works in the navbar. Sorry for the noob question...

omnimax

1/12/2023

Best way to type React components that don't directly render the data?

What is the best to type data in props that you are fetching from trpc? The error it is giving me is the following ``` typescript: Type '(Upload & { images: Image[]; }) | null | undefined' is not assignable to type 'UploadSelect'....

daishoarch

1/12/2023

How to extend trpc's default error codes?

I need to add more error codes to make error processing on the front-end easier. I tried adding a trpc.d.ts in the types folder. ```ts import { type TRPCError } from '@trpc/server'; declare module '@trpc/server' {...

Christian Lind

1/12/2023

Chakra UI union type is to complex

Getting this TS error when using chakra ui. Expression produces a union type that is too complex to represent.ts(2590) `import { Heading } from "@chakra-ui/react"; import React from "react";...

nanorise

1/12/2023

keep scrollbar position in Inverse Infinite scroll

I Implemented Inverse infinite scroll for a chat view It works nicely, and the query triggers when the scrollTop is in the 50px of the top of the container. if the query triggers and ends when the user is scrolled all the way to the top, the viewport stays on the top of the container, instead of staying on the current viewed chat message...

slidebug

1/12/2023

Cannot read properties of undefined (reading 'id)

Hey guys i just started with create-t3-app and setup the discord auth. but when im trying to login i get this error ``` https://next-auth.js.org/errors#jwt_session_error Cannot read properties of undefined (reading 'id')...

lois

1/12/2023

Hardware or IoT API

Maybe it's the wrong place to ask but out of curious: Does anyone have experience building API for hardware/IoT device? How's the process? How long did it take? How's the investment come back?

Aman

1/12/2023

Callback Url working locally but not working in vercel deployment

Hi guys, I am using NextAuth and providing callback conditionally on the basis of query params, the callback url is working fine in localhost but not in vercel prod, Here's a gist of my code ```...

WOLFLEADER

1/12/2023

Boosting SEO

Hey guys, I was wondering what techniques people use to boos the SEO of their websites? My current website shows up second when you google for my business, with the first result being some random instagram page. https://www.potpirate.com.au/ (yes its using yucky mui with nextjs, but eventually going to rewrite it tailwind + astro)...

Gabool

1/12/2023

React Hook Form Typescript - Tabs

Hello All, Currently I have setup tabs on my form, and currently the state only saves to the page context when submit is pressed on each tab, however I would like it to save the values between changing tabs without having to use submit or shouldUnregister: false as its deprecated. I figured I could persist the state on click of the tab (pretty much just run submit form outside of the form), but I don't like this method as I lose metadata like isDirty. ...

codefork

1/12/2023

Updating State does not rerender when calling a method on my class

I am setting a state with new FileSystem() After calling the createDirectory method which adds a new child directory to the current directory of the file system object it does not rerender the component. const [fs, setFS] = useState<FileSystem>(new FileSystem()); ...

Jakesdoc

1/11/2023

How to update data on a static site?

I have a site that is mostly static. I feel like astro would be fairly well suited for it. My problem is something about static sites just doesn't click with me. I see all these examples of Blogs for example. How are they adding new posts if a blog is static? Are they redeploying the entire app every time a new post is added? I have for example a few posts (not many. If things go well, there may be a few thousand) and a few users who manage those posts (again, not many. Maybe a few dozen or a couple hundred way down the line). I need to be able to go into a portal and submit a new post and have that show up without having to redeploy every time (unless there is some trick to make that happen really really fast that I don't know about. And I do have some minimal javascript required such as filtering and sorting and searching as well as analyzing metrics (how many posts there are, how many posts per user, etc.). Is there something I'm just not getting? I'm just feeling more and more like the t3 stack is overkill for what I'm doing but maybe that's just what is required for something like this?...

McKamyk

1/11/2023

Create T3, appDir, tRPC

So I'm wanting to start new pet project, this'll be the first time I'm using T3 with Tailwind, Next, and tRPC. I want to use the new experimental appDir setting. When I create a repo with npm create t3-app@latest it defaults to the pages/ style. I added experimental: {appDir: true} to the next config, created a app/ directory, and copy pasted pages/index.tsx to app/page.tsx. But I'm getting errors saying I'm importing a component that needs useState, which only works on Client Components....

gray0531

1/11/2023

Complex object interface

Sometimes I get an object CoolStuff from api. It has two kinds. I try using discriminated unions. type CoolStuff = ...

codythatsme

1/11/2023

Vercel failing build on empty arrow function in context

Hey guys, my Vercel build is failing because in my context declaration Im initiating an empty function which gets caught by the linter. Whats the correct way of doing this? Assuming I'm doing something wrong.

ayoub_owl

1/11/2023

react table v7 with typescript

I'm unable to get this example to work with typescript, from react table v7 docs https://codesandbox.io/s/github/tannerlinsley/react-table/tree/v7/examples/editable-data?from-embed here is my code Editable Cell component ```tsx...

Rhys

1/11/2023

Better Way Of Declaring Variables For Tests

In a lot of my tests, I use beforeEach to setup variables for the testing file. That code looks like this: ```typescript let text_channel: TextChannel; let client: Client;...

cyremur

1/11/2023

ct3a + react-hexgrid npm package = "Cannot use import statement outside a module"

So I'm a bit confused about this and it's somewhat hard to google cause content mills spam the search with unrelated(?) beginner tutorials... Basically, when I try to import from the react-hexgrid@2.0.1 npm package from a ct3a app, I get the error on page load. Any hints for understanding this problem are appreciated. FWIW, I tried the package with a create-react-app and at least it spat out a webpage (with a couple warnings/errors). ...

jack

1/11/2023

help styling footer

i have this chunk of my footer pictured (just assume it takes the width of the screen) my goal is that at large screens it is just 1 row as pictured, with even gaps, and then at smaller widths it becomes 2x2 grid to me, the easy solution is to just do 1x4 grid on large screens, and 2x2 on small screens, but hardcoding in grid sizes feels wrong to me. any suggestions are appreciated....

Tom

1/11/2023

Best library for pinch to zoom + drag to pan

Does anybody know a good library for pinch to zoom + drag to pan? Things I've tried: - I've heard Theo talk about useGesture() before and this seems good, but the docs are.... minimal and their only pinch example doesn't run anymore: https://codesandbox.io/s/github/pmndrs/use-gesture/tree/main/demo/src/sandboxes/card-zoom - I did some googling and also found react-zoom-pan-pinch, but it has dependency issues with react 18 https://www.npmjs.com/package/react-zoom-pan-pinch...

Previous Next

Gaming

Programming

Theo's Typesafe Cult

Join the Theo's Typesafe Cult server to ask questions!

Theo's Typesafe Cult

Join the community to ask questions about Theo's Typesafe Cult and get answers from other members.