Unhandled Runtime Error
Error: Hydration failed because the initial UI does not match what was rendered on the server.

Warning: Text content did not match. Server: "3/07/23" Client: "03/07/2023"

See more info here: https://nextjs.org/docs/messages/react-hydration-error

Unhandled Runtime Error
Error: Hydration failed because the initial UI does not match what was rendered on the server.

Warning: Text content did not match. Server: "3/07/23" Client: "03/07/2023"

See more info here: https://nextjs.org/docs/messages/react-hydration-error

const PostPage: NextPage<InferGetStaticPropsType<typeof getStaticProps>> = (
  { id }
) => {
...
const postCreatedAt = post ? dateTimeFormatter.format(post.createdAt) : "";
... }

const dateTimeFormatter = new Intl.DateTimeFormat(undefined, {
  dateStyle: "short",
});

export const getStaticPaths: GetStaticPaths = () => {
  return {
    paths: [],
    fallback: "blocking",
  }
}

export async function getStaticProps(context: GetStaticPropsContext<{id: string}>) {
  const id = context.params?.id;

  if (id == null) {
    return {
      redirect: {
        destination: "/"
      }
    }
  }

  const ssg = ssgHelper();
  await ssg.post.getById.prefetch({id});

  return {
    props: {
      trpcState: ssg.dehydrate(),
      id,
    }
  }
}

const PostPage: NextPage<InferGetStaticPropsType<typeof getStaticProps>> = (
  { id }
) => {
...
const postCreatedAt = post ? dateTimeFormatter.format(post.createdAt) : "";
... }

const dateTimeFormatter = new Intl.DateTimeFormat(undefined, {
  dateStyle: "short",
});

export const getStaticPaths: GetStaticPaths = () => {
  return {
    paths: [],
    fallback: "blocking",
  }
}

export async function getStaticProps(context: GetStaticPropsContext<{id: string}>) {
  const id = context.params?.id;

  if (id == null) {
    return {
      redirect: {
        destination: "/"
      }
    }
  }

  const ssg = ssgHelper();
  await ssg.post.getById.prefetch({id});

  return {
    props: {
      trpcState: ssg.dehydrate(),
      id,
    }
  }
}

TS2322: Type '{ name: string; bio: string; location: string; website: string; }' is not assignable to type '(Without<UserUpdateInput, UserUncheckedUpdateInput> & UserUncheckedUpdateInput) | (Without<...> & UserUpdateInput)'.   Object literal may only specify known properties, and 'bio' does not exist in type '(Without<UserUpdateInput, UserUncheckedUpdateInput> & UserUncheckedUpdateInput) | (Without<...> & UserUpdateInput)'.  index.d.ts(6234, 5): The expected type comes from property 'data' which is declared here on type '{ select?: UserSelect<DefaultArgs> | null | undefined; include?: UserInclude<DefaultArgs> | null | undefined; data: (Without<UserUpdateInput, UserUncheckedUpdateInput> & UserUncheckedUpdateInput) | (Without<...> & UserUpdateInput); where: UserWhereUniqueInput; }'

TS2322: Type '{ name: string; bio: string; location: string; website: string; }' is not assignable to type '(Without<UserUpdateInput, UserUncheckedUpdateInput> & UserUncheckedUpdateInput) | (Without<...> & UserUpdateInput)'.   Object literal may only specify known properties, and 'bio' does not exist in type '(Without<UserUpdateInput, UserUncheckedUpdateInput> & UserUncheckedUpdateInput) | (Without<...> & UserUpdateInput)'.  index.d.ts(6234, 5): The expected type comes from property 'data' which is declared here on type '{ select?: UserSelect<DefaultArgs> | null | undefined; include?: UserInclude<DefaultArgs> | null | undefined; data: (Without<UserUpdateInput, UserUncheckedUpdateInput> & UserUncheckedUpdateInput) | (Without<...> & UserUpdateInput); where: UserWhereUniqueInput; }'

editProfile: protectedProcedure.input(z.object({
          name: z.string(),
          bio: z.string(),
          location: z.string(),
          website: z.string(),
      }))
      .mutation(async ({ input: { name, bio, location, website }, ctx }) => {
        const currentUserId = ctx.session.user.id;
          return await ctx.prisma.user.update({
            where: { id: currentUserId },
            data: { name, bio, location, website },
        });
    }),

editProfile: protectedProcedure.input(z.object({
          name: z.string(),
          bio: z.string(),
          location: z.string(),
          website: z.string(),
      }))
      .mutation(async ({ input: { name, bio, location, website }, ctx }) => {
        const currentUserId = ctx.session.user.id;
          return await ctx.prisma.user.update({
            where: { id: currentUserId },
            data: { name, bio, location, website },
        });
    }),