Hi jals! That's a great point and a use-case that slipped my mind, thanks for catching that!

Adding the organizationId into the route parameters is definitely a great option. If you add the organizationId into the URL though, I might prefer to do that across the board and drop the active_organization cookie altogether. That way you only have one source of truth on which organization is being worked with. Minimizing potential confusion down the road.

You could, alternatively, use a Broadcast Channel to communicate across the tabs to notify the others when the organizationId has changed. You could then display a modal warning the user, offering to re-up their active org. You could also add an event when the tab is focused to update, set, or check the active organizationId. Something like the below would probably suffice.

onMounted(() => window.addEventListener('focus', onFocus))
onUnmounted(() => window.removeEventListener('focus', onFocus))

function onFocus() {
  router.get(`/organizations/${props.organization.id}`)
}

  

    

      Copied!