lanc3 Comments - Answer Overflow

Would probably need the nextjs logs, signing out on t3 turbo does it in a unique way compared to the web with a specific tRPC procedure signOut https://github.com/t3-oss/create-t3-turbo/blob/main/packages/api/src/router/auth.ts

5 replies

TTCTheo's Typesafe Cult

•Created by antoni on 7/14/2024 in #questions

[t3-turbo]: Redirect does not work in app

You need to redirect to your app after successful login, it does not know when to close the browser. If you're using expo https://docs.expo.dev/guides/linking/#linking-to-your-app

3 replies

TTCTheo's Typesafe Cult

•Created by rdickert on 6/27/2024 in #questions

Using nextauth discord with vercel deployments

You create a proxy auth service like t3-turbo does. It basically just serves a static URI for your preview environments. I don't remember the exact logic, but you can just reference t3 turbo

8 replies

TTCTheo's Typesafe Cult

•Created by bythewayitsjosh on 6/23/2024 in #questions

trpc with Server Actions

If you're going to use server actions, that is what I would do. Server actions are not great for querying, unless you want to do a lot of route invalidation which might not be performant, but they do make certain data mutations a lot easier. Boiler plate of tRPC and generic API handlers to change a field or two is very annoying, but server actions handle that easily no issues Tanstack query is also just great tooling for queries and you can't use that with server components / server actions

6 replies

TTCTheo's Typesafe Cult

•Created by Ibnu Rasikh - creatypestudio.co on 6/4/2024 in #questions

Have you experienced your Next.js getting hacked?

Getting "hacked" in the traditional sense is basically non-existent in non-self hosted sites. Often WordPress users are non-technical and malware can easily be disguised in plugins and themes. This is also an issue for npm libraries but much less prevalent. You can definetly get hacked though for self-hosted solutions of wordpress and next.js, but that's regardless of the framework

4 replies

TTCTheo's Typesafe Cult

•Created by gwilliamnn on 10/24/2023 in #questions

How can I use a localStorage persister?

really depends though on how your application works

9 replies

TTCTheo's Typesafe Cult

•Created by gwilliamnn on 10/24/2023 in #questions

How can I use a localStorage persister?

You'll have to do something like this

const localStorage = typeof window !== "undefined" ? window.localStorage : null;

const localStorage = typeof window !== "undefined" ? window.localStorage : null;

9 replies

TTCTheo's Typesafe Cult

•Created by migs on 1/31/2024 in #questions

TRPC Security/ Authorization Concerns

This is fine to do depending on how you do it. I've found the easiest primitive way is to just have an ownerId column on DB resources and check if the session user id is equal to the ownerId

13 replies

TTCTheo's Typesafe Cult

•Created by migs on 1/31/2024 in #questions

TRPC Security/ Authorization Concerns

T3 stacks provides authentication functionality for TRPC, i.e. protectedProcedure but does not handle authorization as that is a complex problem to generically solve. The simplest thing you could do is check if the user owns that particular resource by using DB queries. There are also some libraries like https://github.com/stalniy/casl which provide a much more thorough layer of authorization

13 replies

TTCTheo's Typesafe Cult

•Created by Aditya Kirad on 12/23/2023 in #questions

Loading UI not showing

✅

14 replies

TTCTheo's Typesafe Cult

•Created by Aditya Kirad on 12/23/2023 in #questions

Loading UI not showing

Not too sure what you mean by that, I'd just make a component file for guilds, and the Page function can stay the same with the imported server component with migrated async calls

14 replies

TTCTheo's Typesafe Cult

•Created by Aditya Kirad on 12/23/2023 in #questions

Loading UI not showing

yes, that's best practice for server components. Really you'd just need to do

"use server";

const Guilds = async () => {
  const session = await getServerAuthSession();
  if (!session || !session.user) {
    redirect("/");
  }
  const discord = await api.discord.getGuilds.query({
    userId: session.user.id,
  });

  return (
    <>
      {discord?.guilds?.map((guild) => (
        <GuildCard key={guild.id} guild={guild} />
      ))}
    </>
  );
}

"use server";

const Guilds = async () => {
  const session = await getServerAuthSession();
  if (!session || !session.user) {
    redirect("/");
  }
  const discord = await api.discord.getGuilds.query({
    userId: session.user.id,
  });

  return (
    <>
      {discord?.guilds?.map((guild) => (
        <GuildCard key={guild.id} guild={guild} />
      ))}
    </>
  );
}

then

  <Container size="3" mx="4">
    <Heading className="mt-rx-8 text-center">Select a server</Heading>
    <Grid className="mt-rx-8 gap-rx-4 md:grid-cols-2 lg:grid-cols-3">
      <Suspense fallback={<LoadingGuildCard />}>
         <Guilds />
      </Suspense>
    </Grid>
  </Container>

  <Container size="3" mx="4">
    <Heading className="mt-rx-8 text-center">Select a server</Heading>
    <Grid className="mt-rx-8 gap-rx-4 md:grid-cols-2 lg:grid-cols-3">
      <Suspense fallback={<LoadingGuildCard />}>
         <Guilds />
      </Suspense>
    </Grid>
  </Container>

14 replies

TTCTheo's Typesafe Cult

•Created by Aditya Kirad on 12/23/2023 in #questions

Loading UI not showing

Ah this is a misuse of Suspense. Here's an example from the next.js docs. You use suspense to wrap child server componts

import { Suspense } from 'react'
import { PostFeed, Weather } from './Components'
 
export default function Posts() {
  return (
    <section>
      <Suspense fallback={<p>Loading feed...</p>}>
        <PostFeed />
      </Suspense>
      <Suspense fallback={<p>Loading weather...</p>}>
        <Weather />
      </Suspense>
    </section>
  )
}

import { Suspense } from 'react'
import { PostFeed, Weather } from './Components'
 
export default function Posts() {
  return (
    <section>
      <Suspense fallback={<p>Loading feed...</p>}>
        <PostFeed />
      </Suspense>
      <Suspense fallback={<p>Loading weather...</p>}>
        <Weather />
      </Suspense>
    </section>
  )
}

https://nextjs.org/docs/app/building-your-application/routing/loading-ui-and-streaming

14 replies

Gaming

Programming