alexjyoung Posts - Answer Overflow

alexjyoung

Explore posts from servers

•Created by alexjyoung on 4/11/2023 in #questions

Offering Custom Domains to Users with T3

Hi, As part of my app I want to offer users the ability to add their own domain that will serve certain pages on my t3 app. Curious the best way to handle this with the t3 stack? The straightforward method of having a custom express server and intercepting requests to certain domains and rerouting them doesn't seem like it makes sense with this setup.

3 replies

TTCTheo's Typesafe Cult

•Created by alexjyoung on 3/25/2023 in #questions

Protected routes with middleware using the DB

Say I want to create a middleware function like authedProcedure called subscriberProcedure that checks if a user is a member of a team that has a paid subscription- simple trpc fetch of the users teamId to get that detail suffices. This works fine, but I am wondering if this is generally considered good/bad practice? Seems like the extra DB call for every single route is not ideal. I feel like this information could be stored in context session much like other user information is, but unlike the user id and other information, whether or not they are a member of a paid team is dynamic- it could change without the user actually doing anything (if say, an admin on the team changed the subscription). So where would be the appropriate place to fetch this value, and add it to the user session context? Or is my original approach fine.

2 replies

TTCTheo's Typesafe Cult

•Created by alexjyoung on 1/9/2023 in #questions

Scss in Next without modules?

Surprisingly difficult to find an answer for this when i was googling. Here's the situation as ive been taught in previous jobs: Say i have a component <MyComponent /> and i expect some default styles for this, defined in a mycomponent.scss file like:

.MyComponent {
background-color: red;
border-radius: 10px;
}

But say the component takes some various props, and I add a disabled state, to be defined like:

.MyComponent {
background-color: red;
border-radius: 10px;

  &.disabled {
    background-color: white;
  }
}

I want to just import this css with the mycomponent.tsx files and have something that correctly sets className based on which props I used. With css modules, it appears(?) I can't do that? The instructions are to label the disabled class like &disabled {} (inside mycomponent.module.scss now), and then use className={styles.MyComponentdisabled}. But this seems to ONLY apply the disabled styles, (i.e., no border-radius is set anymore), which seems like it makes the css class hierarchy useless. The only other option i can find is to just import mycomponent.scss in the root of the app. But that can't possibly be how you're supposed to be using css in next right? I would end up with like 50 scss file imports in the root component which seems like a waste of bundle and also just shit developer experience. Can someone explain how this is supposed to work? Thanks ❤️

7 replies

TTCTheo's Typesafe Cult

•Created by alexjyoung on 12/4/2022 in #questions

Is changing fields on Session regularly good or bad practice?

In this example, I've got a new field on the session.user object called activeTeamId. This is then used to decide which team data to display for a user on a homepage. It also is used to create some trpc middleware that checks info about the user and their permissions on that team (whether they have admin privileges, etc). When a user switches teams in the app, I was planning to just update this session.user.activeTeamId field. Noticed that updates the session don't seem to propagate throughout the app super reliably (have not done a deep dive to examine why), so I was just wondering if there is some reason this is generally a bad pattern to use. Thanks!

3 replies

TTCTheo's Typesafe Cult

•Created by alexjyoung on 12/2/2022 in #questions

tRPC Input from a Prisma Schema

Is there any way to tell tRPC (zod technically i guess) to expect a tRPC schema as a type? like procedure.input({myType: z.tRPC(myType)}).query() or something

11 replies

TTCTheo's Typesafe Cult

•Created by alexjyoung on 11/22/2022 in #questions

Lotsss of files being changed

14 replies

TTCTheo's Typesafe Cult

•Created by alexjyoung on 11/18/2022 in #questions

Redirect If Not Authed Pattern

Hi, is there any reason that it's not good to use the following pattern to gate pages?

export async function getServerSideProps(ctx: GetServerSidePropsContext) {
  // Redirect to Landing Page if Not Logged in
  return redirectIfNotAuthed({
    ctx,
    redirectUrl: "/",
  });
}

where we have

export async function redirectIfNotAuthed({
  ctx,
  redirectUrl,
  callback,
}: {
  ctx: GetServerSidePropsContext;
  redirectUrl: string;
  callback?: () => any;
}) {
  const session = await getSession(ctx);

  if (!session) {
    if (callback) {
      callback();
    }

    return {
      redirect: {
        permanent: false,
        destination: redirectUrl,
      },
      props: {},
    };
  } else {
    if (callback) {
      callback();
    }
    return { props: {} };
  }
}

It works fine but was just wondering if there is some reason this scales poorly or somethin

15 replies

TTCTheo's Typesafe Cult

•Created by alexjyoung on 11/16/2022 in #questions

Conditional Redirects

Hi, first time exploring the stack and NextAuth. I've extended the default NextAuth User model to include a reference to another model (Team), and I want the following behavior: 1. User logs in/is logged in 2. Check which team the User belongs to (column on the table User). 3. redirects to /<team-id> Whats the stacks opinion on how this should be done? I see some possibility of using getServerSideProps but I recall Theo saying T3 tries to avoid server side rendering? Am i supposed to be messing with the session() and redirect() callbacks in [...nextauth].ts or something entirely else?

29 replies

Gaming

Programming