How to retrieve something from partykit storage from the front end

[mheaversmozilla]

Hi - I'm trying to wrap my brain around partykit and nextjs.

I have a working instance of this repo and what I want to do is, in each room created, store a unique prompt that all people in the chatroom should respond to - like "write about your earliest memory". In my code I'm calling this a 'challenge':

How do I either ensure that the users in the room are served this storage item, or vice versa ensure that when a user joins they retrieve the item from storage be displayed on the frontend component?

On the backend, in chatRoom.ts - I am successfully creating the prompt:

// chatRoom.ts (backend)

async onConnect(connection: ChatConnection) {
  await this.ensureChallenge();
})

async ensureChallenge() {
  if (!this.challenge) {
    let challenge = await this.party.storage.get<string>(
        'challenge'
      );
    if (!challenge) { 
      this.challenge = this.generateChallenge();
      await this.party.storage.put<string>(
        'challenge',
        challenge
      );
    }
  }
}

and on chat/[roomId]/page.tsx - I want to be able to display it to anyone in the room. Not sure how to make that connection of data.