fix: broken redirects in setup (#1065)

Author: ThibaudDauce

composables/useCurrentOwned.ts

@@ -39,6 +39,13 @@ export function useCurrentOwned() {
       return organizations.value[route.params.oid] || null
     }
 
+    // Route explicitly identifies a user context, so no organization. Reading
+    // currentOwnedId here would couple this getter to mutations performed by
+    // the currentUser getter below, causing SSR-vs-hydration mismatches on
+    // routes like /admin/me/datasets where a fetch had populated currentOwnedId
+    // before render but currentUser then resets it.
+    if (route.params.uid || route.fullPath.includes('/admin/me/')) return null
+
     if (!currentOwnedId.value) return null
     if (!('organization' in currentOwnedId.value)) return null
 
@@ -58,6 +65,9 @@ export function useCurrentOwned() {
       return me.value
     }
 
+    // Symmetrical to currentOrganization: route identifies an organization, no user
+    if (route.params.oid) return null
+
     if (!currentOwnedId.value) return null
     if (!('user' in currentOwnedId.value)) return null
 

pages/admin.vue

@@ -57,28 +57,27 @@ import type { OrganizationReference } from '@datagouv/components-next'
 
 definePageMeta({
   layout: 'fluid',
-  middleware: ['auth'],
+  middleware: [
+    'auth',
+    (to) => {
+      if (to.path !== '/admin' && to.path !== '/admin/') return
+      const me = useMaybeMe()
+      const target = me.value && me.value.organizations.length > 0
+        ? `/admin/organizations/${me.value.organizations[0].id}/datasets`
+        : '/admin/me/datasets'
+      return navigateTo(target, { replace: true })
+    },
+  ],
   matomoIgnore: true,
 })
 
 const { t } = useTranslation()
-const route = useRoute()
-const { resolve } = useRouter()
 const me = useMe()
 
 useSeoMeta({ title: 'Admin' })
 
 const { organizations, users } = useCurrentOwned()
 const isSiteAdmin = computed(() => me.value.roles?.includes('admin') || false)
-
-if (route.name === resolve('/admin')?.name) {
-  if (me.value.organizations.length > 0) {
-    await navigateTo(`/admin/organizations/${me.value.organizations[0].id}/datasets`, { replace: true })
-  }
-  else {
-    await navigateTo('/admin/me/datasets', { replace: true })
-  }
-}
 </script>
 
 <style>

pages/organizations/[oid]/index.vue

@@ -5,11 +5,11 @@
 <script setup lang="ts">
 import type { Organization } from '@datagouv/components-next'
 
+definePageMeta({
+  middleware: to => navigateTo(`/organizations/${to.params.oid}/datasets`, { replace: true }),
+})
+
 defineProps<{
   organization: Organization
 }>()
-
-const route = useRoute()
-
-await navigateTo(`/organizations/${route.params.oid}/datasets`, { replace: true })
 </script>

tests/admin/redirect.spec.ts

@@ -0,0 +1,20 @@
+import { test, expect } from '../base'
+
+test('clicking Administration in the header redirects and renders content', async ({ page }) => {
+  await page.goto('/')
+
+  await page.getByRole('banner').getByRole('link', { name: 'Administration' }).click()
+
+  await expect(page).toHaveURL(/\/admin\/(me|organizations\/[^/]+)\/datasets/)
+  await expect(page.getByRole('heading', { level: 1, name: 'Jeux de données' })).toBeVisible()
+})
+
+test('clicking Administration breadcrumb from an admin page redirects and renders content', async ({ page }) => {
+  await page.goto('/admin/me/datasets')
+  await expect(page.getByRole('heading', { level: 1, name: 'Jeux de données' })).toBeVisible()
+
+  await page.getByLabel('Vous êtes ici :').getByRole('link', { name: 'Administration' }).click()
+
+  await expect(page).toHaveURL(/\/admin\/(me|organizations\/[^/]+)\/datasets/)
+  await expect(page.getByRole('heading', { level: 1, name: 'Jeux de données' })).toBeVisible()
+})

tests/organizations/[oid].spec.ts

@@ -15,6 +15,15 @@ test('organization root redirects to datasets tab', async ({ page }) => {
   await expect(page).toHaveURL(/\/organizations\/sobrana\/datasets/)
 })
 
+test('clicking an organization from the list redirects and renders the page', async ({ page }) => {
+  await page.goto('/organizations')
+
+  await page.getByRole('link', { name: /sobrana/i }).first().click()
+
+  await expect(page).toHaveURL(/\/organizations\/sobrana\/datasets/)
+  await expect(page.getByRole('heading', { level: 1, name: /SOBRANA/i })).toBeVisible()
+})
+
 test('tabs display correct counts', async ({ page }) => {
   await page.goto(`/organizations/${ORG_SLUG}/datasets`)