variable_name Posts - Answer Overflow

variable_name

Explore posts from servers

•Created by variable_name on 8/26/2023 in #questions

T3 ENV fails when trying to generate migrations

When i try to generate drizzle migrations through drizzle-kit generate:pg it fails with message:

 Invalid environment variables: {
  DATABASE_URL: [ 'Required' ],
  NEXTAUTH_URL: [ 'Required' ],
  GOOGLE_CLIENT_ID: [ 'Required' ],
  GOOGLE_CLIENT_SECRET: [ 'Required' ],      
  NEXTAUTH_SECRET: [ 'Required' ]
}

node_modules\.pnpm\@[email protected][email protected][email protected]\node_modules\@t3-oss\core\index.ts:207
        !prop.startsWith(opts.clientPrefix) &&
                              ^


Error: Invalid environment variables

 Invalid environment variables: {
  DATABASE_URL: [ 'Required' ],
  NEXTAUTH_URL: [ 'Required' ],
  GOOGLE_CLIENT_ID: [ 'Required' ],
  GOOGLE_CLIENT_SECRET: [ 'Required' ],      
  NEXTAUTH_SECRET: [ 'Required' ]
}

node_modules\.pnpm\@[email protected][email protected][email protected]\node_modules\@t3-oss\core\index.ts:207
        !prop.startsWith(opts.clientPrefix) &&
                              ^


Error: Invalid environment variables

I have my environment variables inside .env file, and app doesn't break. There's only problem when generating migrations. Has somebody encountered similar problem?

1 replies

TTCTheo's Typesafe Cult

•Created by variable_name on 7/8/2023 in #questions

How to pass typesafe react-hook-form form object

I'm using react-hook-form to handle update user profile form.

const form = useForm<FormData>({
    resolver: zodResolver(updateProfileSchema),
    defaultValues: {
      firstName: undefined,
      lastName: undefined,
      email: undefined,
      oldPassword: undefined,
      newPassword: undefined,
      imageUrl: undefined,
    },
    mode: 'onSubmit',
  });

const form = useForm<FormData>({
    resolver: zodResolver(updateProfileSchema),
    defaultValues: {
      firstName: undefined,
      lastName: undefined,
      email: undefined,
      oldPassword: undefined,
      newPassword: undefined,
      imageUrl: undefined,
    },
    mode: 'onSubmit',
  });

I'm also using uploadthing for image upload (updating user profile pic), so I've created a custom upload button component and I'm passing to it a form, so I could setValue manually when upload is complete.

<UploadButton
   form={form}
   onUploadComplete={(url: string) => setProfileImageUrl(url)}
/>

<UploadButton
   form={form}
   onUploadComplete={(url: string) => setProfileImageUrl(url)}
/>

Inside UploadButtonProps I've declared form prop as a UseFormReturn type like this

interface UploadButtonProps {
  form: UseFormReturn;
  onUploadComplete: (url: string) => void;
}

interface UploadButtonProps {
  form: UseFormReturn;
  onUploadComplete: (url: string) => void;
}

So, the problem is now when I'm trying to use form to setValue I do not have typesafety.

form.setValue('imageUrl', imageUrl);

form.setValue('imageUrl', imageUrl);

How to achieve typesafety? I'm also using zod for form schema.

2 replies

TTCTheo's Typesafe Cult

•Created by variable_name on 7/5/2023 in #questions

Clerk: Is it possible to create custom metadata on signup using Clerk?

I need to create a custom metadata "credits" on each new user object, is it possible to achieve that with Clerk? One of my ideas was to call the api route after sign up which will update user object using clerkClient.

await signUp.authenticateWithRedirect({
  strategy: provider,
  redirectUrl: '/dashboard',
  redirectUrlComplete: '/dashboard',
});

await fetch('...');

await signUp.authenticateWithRedirect({
  strategy: provider,
  redirectUrl: '/dashboard',
  redirectUrlComplete: '/dashboard',
});

await fetch('...');

But fetch never get called because authenticateWithRedirect automatically redirects to the /dashboard as soon as sign up happens. Any ideas, how to achieve this? I need to create public metadata, so unsafeMetadata is not a solution.

4 replies

Gaming

Programming