cooluke. Posts - Answer Overflow

cooluke.

•Created by cooluke. on 2/21/2025 in #🙋questions

Page with optional auth - How to get user data in React if the user is signed in?

If I set authRequired: true on a page in main.wasp, then I can get the user data just fine in the React front-end like:

export const MainPage = ({ user }: { user: AuthUser }) => {

export const MainPage = ({ user }: { user: AuthUser }) => {

BUT, if I set authRequired: false in main.wasp, then that user object is undefined. How do I make a page with auth "optional" (user doesn't have to be signed in to access it) but get the user data if the user does happen to be signed in?

5 replies

WWasp

•Created by cooluke. on 1/28/2025 in #🙋questions

What typescript type for queries that use "include"?

Normal behavior: When my query just returns an object from the database, Wasp automatically includes the proper Typescript type for me, like this:

export const getDecks: GetDeck<any, Deck[]> = async (args, context) => {
  return context.entities.Deck.findMany({
    where: {
      userId: context.user.id
    },
  });
}

// in frontend:
const { data: decks, isLoading, error } = useQuery(getDecks);
// decks already has type Deck[]! Amazing!

export const getDecks: GetDeck<any, Deck[]> = async (args, context) => {
  return context.entities.Deck.findMany({
    where: {
      userId: context.user.id
    },
  });
}

// in frontend:
const { data: decks, isLoading, error } = useQuery(getDecks);
// decks already has type Deck[]! Amazing!

But if I want to use Prisma's _include to include related objects, those won't be included in the automatic typescript type.

export const getDecks: GetDeck<any, Deck[]> = async (args, context) => {
  return context.entities.Deck.findMany({
    where: {
      userId: context.user.id
    },
    include: {
      cards: true
    },
  });
}

// in frontend:
const { data: decks, isLoading, error } = useQuery(getDecks);
const firstCard = decks[0].cards[0];
// ^ typescript error
// type Deck does not have a `cards` member

export const getDecks: GetDeck<any, Deck[]> = async (args, context) => {
  return context.entities.Deck.findMany({
    where: {
      userId: context.user.id
    },
    include: {
      cards: true
    },
  });
}

// in frontend:
const { data: decks, isLoading, error } = useQuery(getDecks);
const firstCard = decks[0].cards[0];
// ^ typescript error
// type Deck does not have a `cards` member

What to do in this case? I can't for the life of me figure out a good solution.

6 replies

WWasp

•Created by cooluke. on 1/21/2025 in #🙋questions

In development mode can I change the hostname of the server to something other than "localhost?"

I'd like to load my development site from my phone and other machines on my local network. I'm able to pull up the front-end on my phone, but the app doesn't work, because it sends all the server requests to "localhost:3000." I tried setting WASP_SERVER_URL but it didn't work.

18 replies

WWasp

•Created by cooluke. on 1/17/2025 in #🙋questions

Can I kick off an `action` from within a query?

If one of my queries finds that there are no results in the DB its search, I want to asynchronously kick off an "action" that I have to populate the DB. Am I allowed (in WASP) to send an action from within a query?

6 replies

Gaming

Programming