Skip to content

useSocketEvent could send other types of events #39

@niekvenlo

Description

@niekvenlo

I like this hook a lot, but I need to separate sendable and receivable events, so I don't like having to do this:

const { sendMessage } = useSocketEvent('sendable-event');
// lastMessage would always be undefined
// and I can't TS type my events as easily.

I would rather be able to send an event without registering a listener for that same event.

What about something like this:

const { sendMessage, sendAnyMessage } = useSocketEvent();
// sendMessage won't do anything in this case since no event is 'registered'.

<button onClick={() => sendAnyEvent('button-clicked', payload)}>
  click me
</button>

Issue 38

Together with my previous suggestion, this is what using the hook could look like:

//Socket stuff
const { sendAnyMessage } = useSocketEvent();
useSocketEvent('chat-message-received', (message) => setMessages(messages => [...messages, message]);
useSocketEvent('star-received', (message) => setStarCount(count = count++);

// Form stuff
<input type="text" value={text} onChange={(e) => setText(e.target.value)} />
<button type="submit" onClick={() => sendAnyEvent('chat-message-sent', { text })}>
  send message
</button>

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions