Jacob
Jacob
Explore posts from servers
CDCloudflare DevelopersTTCTheo's Typesafe CultHHonoDTDrizzle Team
PostsComments
HHono
Created by Jacob on 12/5/2024 in #help
Default headers not setting in nextjs rpc requests
Sorry for the really late response, the issue ending up being that in dev we are using http for transit where the cookies needed a secure connection to send across so both front end and api had to be run using https to send cookies across in development
19 replies
TTCTheo's Typesafe Cult
Created by Jacob on 1/8/2025 in #questions
Getting build errors after upgrading to nextjs 15 and react 19
How would I go about that?
4 replies
TTCTheo's Typesafe Cult
Created by Jacob on 12/29/2024 in #questions
Error building nextjs application on vercel
The issue seemed to be the following: 1. instrumentationHook was not set in nextjs config: 
  experimental: {
    instrumentationHook: true,
  },
  experimental: {
    instrumentationHook: true,
  },
2. Incorrect sentry version 3. missing configs
6 replies
TTCTheo's Typesafe Cult
Created by Jacob on 12/29/2024 in #questions
Error building nextjs application on vercel
Yes but no
6 replies
HHono
Created by Jacob on 12/5/2024 in #help
Default headers not setting in nextjs rpc requests
Assuming cookies are set very similar on web to mobile however not set to the api on web thinking cors or nextjs might be the issue as it doesn’t automatically attach headers to the request e.g cookies to external apis unless specified
19 replies
HHono
Created by Jacob on 12/5/2024 in #help
Default headers not setting in nextjs rpc requests
The clerk cookies are set via the clerk nextjs sdk and read by the @hono/clerk provider that wraps the clerk back end node sdk. Here is the repo: https://github.com/jacobsamo/BuzzTrip/tree/improve-web
19 replies
HHono
Created by Jacob on 12/5/2024 in #help
Default headers not setting in nextjs rpc requests
Hey @ambergristle my setup is split into 3 different part 1 the api (hono) the web app (nextjs) and 3 the mobile app (expo/react native) currently in my web app using clerk for auth it won’t send across the cookies to the hono api however my mobile app sends them across fine, feeling like it is a cors issue but not sure how to fix it or it could be something else internally
19 replies
TTCTheo's Typesafe Cult
Created by Crian. on 11/23/2024 in #questions
T3 Turbo Add Another App
if your have any more questions feel free to reach out
4 replies
TTCTheo's Typesafe Cult
Created by Crian. on 11/23/2024 in #questions
T3 Turbo Add Another App
depends on what your adding, if we are adding a new app e.g web app, mobile app, etc: 1. First we need to go to /apps 2. create a new folder with the name of the app or use a setup tool e.g nextjs: npx create-next-app@latest my-cool-app (this will create a new app with the name my-cool-app it will also prompt you for a name when creating) if your creating a new package: 1. go to /packages 2. create a new folder with the name of your package 3. run npm init -y to create a new package.json 4. change the "name" field in the package.json to the name of your package 
{
  "name": "@acme/my-package",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}
{
  "name": "@acme/my-package",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}
then in here create your files to your hearts content
4 replies
TTCTheo's Typesafe Cult
Created by Jacob on 11/23/2024 in #questions
Shadcn components not working in nextjs 15 / react 19
I get the error from quite a few other shadcn components too, e.g Sidebar, Tooltip, Dialog, Drawer, etc
5 replies
TTCTheo's Typesafe Cult
Created by Jacob on 11/23/2024 in #questions
Shadcn components not working in nextjs 15 / react 19
the button component: 
import * as React from "react"
import { Slot } from "@radix-ui/react-slot"
import { cva, type VariantProps } from "class-variance-authority"

import { cn } from "@/lib/utils"

const buttonVariants = cva(
  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
  {
    variants: {
      variant: {
        default:
          "bg-primary text-primary-foreground shadow hover:bg-primary/90",
        destructive:
          "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
        outline:
          "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
        secondary:
          "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
        ghost: "hover:bg-accent hover:text-accent-foreground",
        link: "text-primary underline-offset-4 hover:underline",
      },
      size: {
        default: "h-9 px-4 py-2",
        sm: "h-8 rounded-md px-3 text-xs",
        lg: "h-10 rounded-md px-8",
        icon: "h-9 w-9",
      },
    },
    defaultVariants: {
      variant: "default",
      size: "default",
    },
  }
)

export interface ButtonProps
  extends React.ButtonHTMLAttributes<HTMLButtonElement>,
    VariantProps<typeof buttonVariants> {
  asChild?: boolean
}

const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
  ({ className, variant, size, asChild = false, ...props }, ref) => {
    const Comp = asChild ? Slot : "button"
    return (
      <Comp
        className={cn(buttonVariants({ variant, size, className }))}
        ref={ref}
        {...props}
      />
    )
  }
)
Button.displayName = "Button"

export { Button, buttonVariants }
import * as React from "react"
import { Slot } from "@radix-ui/react-slot"
import { cva, type VariantProps } from "class-variance-authority"

import { cn } from "@/lib/utils"

const buttonVariants = cva(
  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
  {
    variants: {
      variant: {
        default:
          "bg-primary text-primary-foreground shadow hover:bg-primary/90",
        destructive:
          "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
        outline:
          "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
        secondary:
          "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
        ghost: "hover:bg-accent hover:text-accent-foreground",
        link: "text-primary underline-offset-4 hover:underline",
      },
      size: {
        default: "h-9 px-4 py-2",
        sm: "h-8 rounded-md px-3 text-xs",
        lg: "h-10 rounded-md px-8",
        icon: "h-9 w-9",
      },
    },
    defaultVariants: {
      variant: "default",
      size: "default",
    },
  }
)

export interface ButtonProps
  extends React.ButtonHTMLAttributes<HTMLButtonElement>,
    VariantProps<typeof buttonVariants> {
  asChild?: boolean
}

const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
  ({ className, variant, size, asChild = false, ...props }, ref) => {
    const Comp = asChild ? Slot : "button"
    return (
      <Comp
        className={cn(buttonVariants({ variant, size, className }))}
        ref={ref}
        {...props}
      />
    )
  }
)
Button.displayName = "Button"

export { Button, buttonVariants }
the repo: https://github.com/jacobsamo/BuzzTrip/tree/improve-web
5 replies
TTCTheo's Typesafe Cult
Created by Mugetsu on 9/3/2024 in #questions
Use Zod schema after parse & transform as a new schema
Note: When using the .extend method even if you remove the field on the clientSchema it will still be there on the serverSchema
7 replies
TTCTheo's Typesafe Cult
Created by Mugetsu on 9/3/2024 in #questions
Use Zod schema after parse & transform as a new schema
@Mugetsu So what i would recommend is the following: 
// your default schema
const clientSchema = z.object({
  name: z.string(),
  bir: z.object({
      value: z.string(),
      label: z.string(),
  }).transform(val => val.value),
})

// your server schema which will extend the clientSchema
const serverSchema = clientSchema.extend({
  bir: z.string(), // overriding the bir field and keeping all other fields
})
// your default schema
const clientSchema = z.object({
  name: z.string(),
  bir: z.object({
      value: z.string(),
      label: z.string(),
  }).transform(val => val.value),
})

// your server schema which will extend the clientSchema
const serverSchema = clientSchema.extend({
  bir: z.string(), // overriding the bir field and keeping all other fields
})
What you could also do, is lets say we have many client fields that aren't all needed on the server e.g: 
// your default schema
const clientSchema = z.object({
  uid: z.string().uuid(),
  name: z.string(),
  bir: z
    .object({
      value: z.string(),
      label: z.string(),
    })
    .transform((val) => val.value),
});

// your server schema which will extend the clientSchema
const serverSchema = clientSchema.omit({ uid: true }).extend({
  bir: z.string(), // overriding the bir field and keeping all other fields
});
// your default schema
const clientSchema = z.object({
  uid: z.string().uuid(),
  name: z.string(),
  bir: z
    .object({
      value: z.string(),
      label: z.string(),
    })
    .transform((val) => val.value),
});

// your server schema which will extend the clientSchema
const serverSchema = clientSchema.omit({ uid: true }).extend({
  bir: z.string(), // overriding the bir field and keeping all other fields
});
Or instead of omitting the value you could use the .pick method: 
// your default schema
const clientSchema = z.object({
  uid: z.string().uuid(),
  name: z.string(),
  bir: z
    .object({
      value: z.string(),
      label: z.string(),
    })
    .transform((val) => val.value),
});

// your server schema which will extend the clientSchema
const serverSchema = clientSchema.pick({ name: true, bir: true }).extend({
  bir: z.string(), // overriding the bir field and keeping all other fields
});
// your default schema
const clientSchema = z.object({
  uid: z.string().uuid(),
  name: z.string(),
  bir: z
    .object({
      value: z.string(),
      label: z.string(),
    })
    .transform((val) => val.value),
});

// your server schema which will extend the clientSchema
const serverSchema = clientSchema.pick({ name: true, bir: true }).extend({
  bir: z.string(), // overriding the bir field and keeping all other fields
});
7 replies
CDCloudflare Developers
Created by Jacob on 9/9/2024 in #pages-help
Configuring a monorepo
Forgot to remove the wrangler.toml from the .gitignore and decided to opt into using the Root Directory setting
2 replies
CDCloudflare Developers
Created by Jacob on 9/4/2024 in #d1-database
Hi, I am having troubble setting up
Figured out i was running the incorrect command was running drizzle-kit migrate rather than drizzle-kit generate
2 replies
TTCTheo's Typesafe Cult
Created by Wezter on 8/31/2024 in #questions
Developing for multiple platforms.
If i were to be building a app with web + mobile i would be using something like react and react native with something like expo. i has seen teams use react native as a standised apporach to building web apps and just change the complier to use their custom components so for example a View might be a customised div element. I can't find the video but this is something that Twitter (X) did for their webapp for mobile devices. Expo has released support for building out web apps (https://docs.expo.dev/workflow/web/). I think the biggest benift to building the web app with react and a frame work than using something like react-native is that is essentally the same logic just changed so you can share code, functions and much more between the platforms in a mono repo
4 replies
TTCTheo's Typesafe Cult
Created by Ankan on 9/1/2024 in #questions
need help in css
To build responsive websites i would recommend using an abstraction on css like tailwind to speed up the process and keep things nice and clean: https://tailwindcss.com/ If you want to use normal css than i would recommend doing something like this: 
/* Base styles */
.nav {
  width: 500px;
  marigin: auto;
}

/* ...other styles */

/* Screen size 1 */
@media screen and (max-width: 650px) {
  .nav {
    width: 300px;
  }
  
  /* ...other styles */
}

/* Screen size 2 */
@media screen and (max-width: 650px) {
  .nav {
    width: 100%;
  }
  
  /* ...other styles */
}

/* Contuine with screen sizes */
/* Base styles */
.nav {
  width: 500px;
  marigin: auto;
}

/* ...other styles */

/* Screen size 1 */
@media screen and (max-width: 650px) {
  .nav {
    width: 300px;
  }
  
  /* ...other styles */
}

/* Screen size 2 */
@media screen and (max-width: 650px) {
  .nav {
    width: 100%;
  }
  
  /* ...other styles */
}

/* Contuine with screen sizes */
Alternatively you could use instead for element you know you want a certain size of the page to use percentages or calculated values based off the screen size e.g width: 50% or width: calc(100% - 30px);
3 replies
TTCTheo's Typesafe Cult
Created by Mugetsu on 9/3/2024 in #questions
Use Zod schema after parse & transform as a new schema
So just going to add a clarifying question, you are using the schema: 
const schema = z.object({
    name: z.string(),
    bir: z.object({
        value: z.string(),
        label: z.string(),
    }).transform(val => val.value),

})
const schema = z.object({
    name: z.string(),
    bir: z.object({
        value: z.string(),
        label: z.string(),
    }).transform(val => val.value),

})
for the client side form validation? and for example you would want the tRPC validation schema to look something like this?: 
const schema = z.object({
    name: z.string(),
    bir: z.string()
})
const schema = z.object({
    name: z.string(),
    bir: z.string()
})
Is that correct or do i have it wrong?
7 replies