Johnson
Johnson
PostsComments
TTCTheo's Typesafe Cult
Created by Johnson on 6/22/2023 in #questions
How to keep local changes after reloading webpage
I just want to change some thumbnails on the youtube home page for a joke, but when I change the thumbnails src to another image, I just get the small image not found box. Any easy way to fix this?
2 replies
TTCTheo's Typesafe Cult
Created by Johnson on 5/23/2023 in #questions
How to provide more info on ctx.session.user in the routers?
4 replies
TTCTheo's Typesafe Cult
Created by Johnson on 4/25/2023 in #questions
how stable is nextjs 13/server side components
I remember on release there was a bunch of advice not to start a new big project with it, what's the state now?
6 replies
TTCTheo's Typesafe Cult
Created by Johnson on 3/15/2023 in #questions
mp3 encoding
All I want to do is record the users audio and output a mp3 file. I got to the point where I can record audio using the web audio api and generate an mp3 with 1 second of silence using lamejs but I am too stupid to combine these 2. This a repo with a minimal example: https://github.com/vothvovo/recordtomp3 (this was done with electron so there is some ipc to get the data to lamejs but you don't have to do it in electron really) I made this post some time ago but it didn't receive a lot of attention (no downvotes tho wowie): https://stackoverflow.com/questions/75712706/how-to-record-and-encode-a-mp3-in-an-electron-app
1 replies
TTCTheo's Typesafe Cult
Created by Johnson on 3/5/2023 in #questions
API documentation tools?
I am looking for good tools to document an API. The result should be something like the t3 docs or tailwind
5 replies
TTCTheo's Typesafe Cult
Created by Johnson on 2/26/2023 in #questions
How to load a build index.js file that requires other modules
1 replies
TTCTheo's Typesafe Cult
Created by Johnson on 12/12/2022 in #questions
nextAuth working only locally (not on vercel deployment)
I've been trying for a day now. I don't know the issue. I can't even get an error. When the nextAuth singIn() method runs, I just get the /api/auth/error page.
158 replies
TTCTheo's Typesafe Cult
Created by Johnson on 11/4/2022 in #questions
What is this auth feature called and how do I do this?
22 replies
TTCTheo's Typesafe Cult
Created by Johnson on 11/3/2022 in #questions
Make .useInfiniteQuery global
I have an infinite query and 2 different places where I want to have the data/fetch new data. These are my considerations: 1. I can't pass the data via a simple child component (lifting state up) because the other place is a page created via dynamic routes ([id].tsx) 2. I can't make the .useInfiniteQuery reside outside of a component, so I can't really share data via exporting 3. I tried using zustand/jotai to make the data and the fetchNextPage() global. This works as far as getting the first page of data and also running another db query for the second page, but fails when I want to get the data of the second page. (which means I really haven't found a way to get data from this point on)
19 replies
TTCTheo's Typesafe Cult
Created by Johnson on 11/3/2022 in #questions
How to conditionally fetch data?
In my mind I want to do a mutation that returns data, but I guess that doesn't work. I have an edit button, and when the user clicks it and therefore goes into edit mode, I want to fetch some additional data from db.
3 replies
TTCTheo's Typesafe Cult
Created by Johnson on 10/31/2022 in #questions
How to have global state?
I want to set and read a state (the state will be an array of strings that is fetched when the user makes a search) from anywhere within the website(different routes). The information is temporary and can be deleted after the users session ended. reading the state needs to be really fast. I am kinda new to all of this. Is this a case for zustand?
4 replies
TTCTheo's Typesafe Cult
Created by Johnson on 10/25/2022 in #questions
How to use fetched data as State?
I am getting data (a post) from trpc inside my component: 
[id].tsx
const Post = (
  props: InferGetServerSidePropsType<typeof getServerSideProps>
) => {
  const { id } = props;
  const postData = trpc.post.getPost.useQuery({
    postId: id,
  });

...
[id].tsx
const Post = (
  props: InferGetServerSidePropsType<typeof getServerSideProps>
) => {
  const { id } = props;
  const postData = trpc.post.getPost.useQuery({
    postId: id,
  });

...
The user should be able to edit the post, so I want to make the fetched data a state via useState. I tried: 
useEffect(() => {
    setPostState({
      title: post.data.title,
      description: post.data.description,
    });
  }, []);
useEffect(() => {
    setPostState({
      title: post.data.title,
      description: post.data.description,
    });
  }, []);
but it doesnt work. I need to set the State after the data finished loading. How?
24 replies
TTCTheo's Typesafe Cult
Created by Johnson on 10/24/2022 in #questions
looking for example of dynamic-routes using trpc ssr
I couldn't find an example project and I am too stupid to understand the docs
2 replies
TTCTheo's Typesafe Cult
Created by Johnson on 10/24/2022 in #questions
ssg doesn't work for new data
When a user creates a new post, it doesn't generate a new site. I thought I could achieve that through revalidate but it doesn't seem to work. This is the code of post/[id].tsx: 
export const getStaticPaths: GetStaticPaths = async () => {
  const posts = await prisma.post.findMany();
  // TODO: this can cause problems if we run this the first time the database is reset
  if (posts) {
    return {
      paths: posts.map((post) => ({
        params: {
          id: post.id,
        },
      })),
      fallback: false,
    };
  } else {
    return {
      paths: [],
      fallback: false,
    };
  }
};

export const getStaticProps = async (
  // this is the id from the page
  context: GetStaticPropsContext<{ id: string }>
) => {
  const ssg = createProxySSGHelpers({
    router: appRouter,
    transformer: superjson,
    ctx: await createContextInner({ session: null }),
  });

  await ssg.post.getAllPosts.prefetch();

  return {
    props: {
      trpcState: ssg.dehydrate(),
      id: context.params?.id,
    },
    revalidate: 1,
  };
};
export const getStaticPaths: GetStaticPaths = async () => {
  const posts = await prisma.post.findMany();
  // TODO: this can cause problems if we run this the first time the database is reset
  if (posts) {
    return {
      paths: posts.map((post) => ({
        params: {
          id: post.id,
        },
      })),
      fallback: false,
    };
  } else {
    return {
      paths: [],
      fallback: false,
    };
  }
};

export const getStaticProps = async (
  // this is the id from the page
  context: GetStaticPropsContext<{ id: string }>
) => {
  const ssg = createProxySSGHelpers({
    router: appRouter,
    transformer: superjson,
    ctx: await createContextInner({ session: null }),
  });

  await ssg.post.getAllPosts.prefetch();

  return {
    props: {
      trpcState: ssg.dehydrate(),
      id: context.params?.id,
    },
    revalidate: 1,
  };
};
It works in dev mode (due to dev mode), but it doesn't work in production (vercel)
76 replies
TTCTheo's Typesafe Cult
Created by Johnson on 10/23/2022 in #questions
should I use a trpc request when using getStaticPaths()?
75 replies
TTCTheo's Typesafe Cult
Created by Johnson on 10/22/2022 in #questions
database write on button click
How do I do it? I can't use trpc(can only make calls at top level), I could make an api endpoint, I tried, it's kind of awkward and looks like this: 
const callAPI = async () => {
    try {
      const res = await fetch(`http://localhost:3000/api/cookbook/create`, {
        method: "post",
        body: JSON.stringify(state),
      });
      console.log(res);
    } catch (err) {
      console.log(err);
    }
  };
const callAPI = async () => {
    try {
      const res = await fetch(`http://localhost:3000/api/cookbook/create`, {
        method: "post",
        body: JSON.stringify(state),
      });
      console.log(res);
    } catch (err) {
      console.log(err);
    }
  };
I manage a ts type through useState. The user modifies that state and at the end, I want to upload that state to the database on the press of a button.
5 replies
TTCTheo's Typesafe Cult
Created by Johnson on 10/21/2022 in #questions
Is there something like create-t3-app for electronJS?
So I guess ts, trpc, tailwind, react, prisma, webpack(?)
4 replies