personae/app/composables/useEventHandlers.js

import { updateQueryData, useEntityStore } from "pinia-colada-plugin-normalizer"

export default function useEventHandlers() {
  const {
    $socketio: { socket }
  } = useNuxtApp()

  const entityStore = useEntityStore()
  const optionsCache = useOptionsCache()

  socket.on("character:create", createCharacter)
  socket.on("character:delete", deleteCharacter)
  socket.on("character:update", updateCharacter)

  function createCharacter(character) {
    updateQueryData(characterListQuery.key, (data) => [...data, character])
    optionsCache.update()
  }

  function deleteCharacter(id) {
    entityStore.remove("character", id)
    optionsCache.update()
  }

  function updateCharacter(character) {
    entityStore.set("character", character.id, character)
    optionsCache.update()
  }
}