From e3811226eba6ea6119be196bbf21831376223227 Mon Sep 17 00:00:00 2001
From: Harlan Wilton <harlan@harlanzw.com>
Date: Mon, 5 Oct 2026 13:41:09 +1100
Subject: [PATCH 1/3] fix(onboarding): preserve attribution and recovery

---
 app/pages/index.vue                           |  1 -
 app/utils/homepage-person-skills.ts           |  8 ++-
 layers/identity/app/pages/login.vue           |  1 +
 layers/identity/app/pages/me/index.vue        |  2 +
 .../app/pages/onboarding/discover.vue         | 35 +++++++------
 .../identity/app/pages/onboarding/email.vue   |  9 ++--
 test/unit/me-watchlist.test.ts                | 11 ++++
 test/unit/onboarding-watch.test.ts            | 50 +++++++++++++++++++
 test/unit/skill-source-list.test.ts           | 19 +++++++
 9 files changed, 116 insertions(+), 20 deletions(-)
 create mode 100644 test/unit/onboarding-watch.test.ts

diff --git a/app/pages/index.vue b/app/pages/index.vue
index 64051fc1..7064f8e3 100644
--- a/app/pages/index.vue
+++ b/app/pages/index.vue
@@ -193,7 +193,6 @@ const homepageTrendingSelection = computed(() => selectHomepageTrendingSkills(
       name: skill.name,
       displayName: skill.displayName,
       registryPath: skill.registryPath,
-      maintainerName: repo.evidence?.authorName ?? null,
       description: skill.description,
       context: trendingShareLabel(repo.authorCount),
     })),
diff --git a/app/utils/homepage-person-skills.ts b/app/utils/homepage-person-skills.ts
index 22da662e..7df88ba6 100644
--- a/app/utils/homepage-person-skills.ts
+++ b/app/utils/homepage-person-skills.ts
@@ -59,10 +59,14 @@ export function uniqueByOwner(items: readonly SkillSourceItem[]): SkillSourceIte
  * the caller then loads the live person feed instead.
  */
 export function selectHomepageTrendingSkills(
-  trending: readonly SkillSourceItem[],
+  trending: readonly Omit<SkillSourceItem, 'maintainerName'>[],
   fallbacks: readonly SkillSourceItem[],
 ): HomepageTrendingSelection {
-  const unique = uniqueByOwner(trending)
+  const namesByOwner = new Map(fallbacks.map(item => [item.owner, item.maintainerName ?? item.owner]))
+  const unique = uniqueByOwner(trending.map(item => ({
+    ...item,
+    maintainerName: namesByOwner.get(item.owner) ?? item.owner,
+  })))
   if (unique.length < HOMEPAGE_TRENDING_MINIMUM)
     return { _tag: 'fallback' }
 
diff --git a/layers/identity/app/pages/login.vue b/layers/identity/app/pages/login.vue
index 247230b9..7e69d379 100644
--- a/layers/identity/app/pages/login.vue
+++ b/layers/identity/app/pages/login.vue
@@ -43,6 +43,7 @@ useSeoMeta({
           icon="i-lucide-github"
           trailing-icon="i-lucide-arrow-right"
           size="sm"
+          class="min-h-11"
           block
         />
       </div>
diff --git a/layers/identity/app/pages/me/index.vue b/layers/identity/app/pages/me/index.vue
index bb57dc9f..b94e1e08 100644
--- a/layers/identity/app/pages/me/index.vue
+++ b/layers/identity/app/pages/me/index.vue
@@ -424,6 +424,7 @@ async function deleteAccount() {
               <div v-show="showEmail" id="email-settings-form" class="mt-4 space-y-4">
                 <UFormField label="Email address" name="email" :error="emailMissingAddress ? 'Add a valid email address, or turn off both emails.' : undefined">
                   <UInput
+                    id="account-digest-email"
                     v-model="emailForm.digest_email"
                     type="email"
                     autocomplete="email"
@@ -641,6 +642,7 @@ async function deleteAccount() {
           </p>
           <UFormField :label="`Type ${me?.login} to confirm`" name="confirm_login">
             <UInput
+              id="account-confirm-login"
               v-model="deleteConfirmation"
               autocomplete="off"
               autocapitalize="off"
diff --git a/layers/identity/app/pages/onboarding/discover.vue b/layers/identity/app/pages/onboarding/discover.vue
index 24f6cab6..7b798dd0 100644
--- a/layers/identity/app/pages/onboarding/discover.vue
+++ b/layers/identity/app/pages/onboarding/discover.vue
@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import type { IdentityMutationResponse } from '../../../shared/contracts/account'
 import type { StarsSyncResponse } from '../../utils/sync-starred-repos'
 import { syncStarredRepos } from '../../utils/sync-starred-repos'
 
@@ -82,22 +83,26 @@ onMounted(() => {
 
 const actionFailed = useActionFailure()
 
-const submitting = ref(false)
+const watchMutation = useNuxtMutation<Array<{ owner: string, repo: string }>, IdentityMutationResponse>({
+  mutation: repos => $fetch<IdentityMutationResponse>('/api/me/subscriptions', {
+    method: 'POST',
+    body: { source: 'star-import', repos },
+  }),
+  invalidates: ['identity:subscriptions'],
+  onError: actionFailed('start watching those repos'),
+})
+const submitting = watchMutation.pending
 async function watchSelected() {
   if (!selected.value.size) {
     await navigateTo('/onboarding/email')
     return
   }
-  submitting.value = true
-  const repos = [...selected.value].map((k) => {
-    const [owner, repo] = k.split('/')
-    return { owner, repo }
-  })
-  await $fetch('/api/me/subscriptions', {
-    method: 'POST',
-    body: { source: 'star-import', repos },
-  }).catch(actionFailed('start watching those repos'))
-  submitting.value = false
+  const repos = selectableItems.value
+    .filter(item => selected.value.has(`${item.owner}/${item.repo}`))
+    .map(({ owner, repo }) => ({ owner, repo }))
+  const saved = await watchMutation.mutateSafe(repos)
+  if (saved._tag === 'err')
+    return
   await navigateTo('/onboarding/email')
 }
 
@@ -123,6 +128,7 @@ useSeoMeta({ title: 'Discover skills', robots: 'noindex' })
       <UButton
         :loading="syncing"
         size="sm"
+        class="min-h-11"
         color="neutral"
         variant="outline"
         icon="i-lucide-refresh-cw"
@@ -151,7 +157,7 @@ useSeoMeta({ title: 'Discover skills', robots: 'noindex' })
       <template v-else>
         None of your starred repos with "skill" in the name are in the registry yet.
       </template>
-      <NuxtLink to="/onboarding/email" class="underline">
+      <NuxtLink to="/onboarding/email" class="inline-flex min-h-11 items-center underline">
         skip ahead
       </NuxtLink>.
     </div>
@@ -183,7 +189,7 @@ useSeoMeta({ title: 'Discover skills', robots: 'noindex' })
               type="checkbox"
               :checked="r.watching || selected.has(`${r.owner}/${r.repo}`)"
               :disabled="r.watching"
-              class="mt-1"
+              class="mt-1 size-4 accent-primary"
               @change="toggle(`${r.owner}/${r.repo}`)"
             >
             <div class="min-w-0 flex-1">
@@ -210,7 +216,7 @@ useSeoMeta({ title: 'Discover skills', robots: 'noindex' })
     </template>
 
     <div class="mt-8 flex items-center justify-between">
-      <NuxtLink to="/onboarding/email" class="text-sm text-muted hover:text-default underline">
+      <NuxtLink to="/onboarding/email" class="inline-flex min-h-11 min-w-11 items-center text-sm text-muted hover:text-default underline">
         Skip
       </NuxtLink>
       <UButton
@@ -218,6 +224,7 @@ useSeoMeta({ title: 'Discover skills', robots: 'noindex' })
         :label="selected.size ? `Watch ${selected.size}` : 'Continue'"
         trailing-icon="i-lucide-arrow-right"
         size="sm"
+        class="min-h-11"
         @click="watchSelected"
       />
     </div>
diff --git a/layers/identity/app/pages/onboarding/email.vue b/layers/identity/app/pages/onboarding/email.vue
index bb3e4923..b7403cf7 100644
--- a/layers/identity/app/pages/onboarding/email.vue
+++ b/layers/identity/app/pages/onboarding/email.vue
@@ -73,7 +73,8 @@ useSeoMeta({ title: 'Email opt-in', robots: 'noindex' })
           type="email"
           :aria-invalid="missingAddress"
           :aria-describedby="missingAddress ? 'email-error' : undefined"
-          class="mt-1 w-full rounded border border-default bg-default px-2 py-1 font-mono text-sm"
+          autocomplete="email"
+          class="mt-1 min-h-11 w-full rounded border border-default bg-default px-3 py-2 font-mono text-sm"
         >
         <p v-if="missingAddress" id="email-error" class="mt-1 text-xs text-error">
           Add an email address, or turn off both emails.
@@ -81,14 +82,14 @@ useSeoMeta({ title: 'Email opt-in', robots: 'noindex' })
       </div>
 
       <label class="flex min-h-11 items-start gap-3 cursor-pointer">
-        <input v-model="weeklyOptIn" type="checkbox" class="mt-0.5">
+        <input v-model="weeklyOptIn" type="checkbox" class="mt-0.5 size-4 accent-primary">
         <span class="text-sm text-muted leading-relaxed">
           Send me distinct trending Skills each Monday.
         </span>
       </label>
 
       <label class="flex min-h-11 items-start gap-3 cursor-pointer">
-        <input v-model="optIn" type="checkbox" class="mt-0.5">
+        <input v-model="optIn" type="checkbox" class="mt-0.5 size-4 accent-primary">
         <span class="text-sm text-muted leading-relaxed">
           Send me watched changes once a month.
         </span>
@@ -105,6 +106,7 @@ useSeoMeta({ title: 'Email opt-in', robots: 'noindex' })
         label="Back"
         leading-icon="i-lucide-arrow-left"
         size="sm"
+        class="min-h-11"
         color="neutral"
         variant="ghost"
       />
@@ -114,6 +116,7 @@ useSeoMeta({ title: 'Email opt-in', robots: 'noindex' })
         label="Finish"
         trailing-icon="i-lucide-check"
         size="sm"
+        class="min-h-11"
         @click="finish"
       />
     </div>
diff --git a/test/unit/me-watchlist.test.ts b/test/unit/me-watchlist.test.ts
index b0037ad6..9cd98521 100644
--- a/test/unit/me-watchlist.test.ts
+++ b/test/unit/me-watchlist.test.ts
@@ -281,6 +281,17 @@ describe('account skill watchlist', () => {
     expect(disabledWhilePending).toBe(true)
   })
 
+  it('connects the email address label to its textbox', async () => {
+    const wrapper = await mountPage()
+    document.body.append(wrapper.element)
+    await wrapper.get('button[aria-controls="email-settings-form"]').trigger('click')
+    const input = wrapper.get('input[type="email"]').element as HTMLInputElement
+
+    expect([...input.labels ?? []].map(label => label.textContent)).toContain('Email address')
+    wrapper.element.remove()
+    wrapper.unmount()
+  })
+
   it('saves the weekly email and monthly digest as separate choices', async () => {
     const wrapper = await mountPage()
     await wrapper.get('button[aria-controls="email-settings-form"]').trigger('click')
diff --git a/test/unit/onboarding-watch.test.ts b/test/unit/onboarding-watch.test.ts
new file mode 100644
index 00000000..761766c7
--- /dev/null
+++ b/test/unit/onboarding-watch.test.ts
@@ -0,0 +1,50 @@
+import { mockNuxtImport, mountSuspended } from '@nuxt/test-utils/runtime'
+import { flushPromises } from '@vue/test-utils'
+import { beforeEach, expect, it, vi } from 'vitest'
+import { ref } from 'vue'
+import Discover from '../../layers/identity/app/pages/onboarding/discover.vue'
+
+const request = vi.hoisted(() => vi.fn())
+const navigate = vi.hoisted(() => vi.fn())
+const reportFailure = vi.hoisted(() => vi.fn())
+
+mockNuxtImport('$fetch', () => request)
+mockNuxtImport('navigateTo', () => navigate)
+mockNuxtImport('useActionFailure', () => () => () => reportFailure)
+mockNuxtImport('useUserSession', () => () => ({ user: ref(null) }))
+mockNuxtImport('useFetch', () => () => ({
+  data: ref({
+    syncedAt: 1,
+    items: [{ owner: 'antfu', repo: 'skills', hasSkill: true, watching: false, skills: [] }],
+  }),
+  refresh: vi.fn(),
+  status: ref('success'),
+}))
+
+beforeEach(() => vi.clearAllMocks())
+
+it('keeps selected repos available when saving watches fails', async () => {
+  request.mockRejectedValueOnce(new Error('Unavailable'))
+  const wrapper = await mountSuspended(Discover)
+  await flushPromises()
+  const button = wrapper.findAll('button').find(button => button.text() === 'Watch 1')!
+  await button.trigger('click')
+  await flushPromises()
+
+  expect(request).toHaveBeenCalledWith('/api/me/subscriptions', {
+    method: 'POST',
+    body: { source: 'star-import', repos: [{ owner: 'antfu', repo: 'skills' }] },
+  })
+  expect(reportFailure).toHaveBeenCalledOnce()
+  expect(navigate).not.toHaveBeenCalled()
+  expect(button.attributes('disabled')).toBeUndefined()
+  expect((wrapper.get('input[type="checkbox"]').element as HTMLInputElement).checked).toBe(true)
+
+  request.mockResolvedValueOnce({ ok: true })
+  await button.trigger('click')
+  await flushPromises()
+
+  expect(navigate).toHaveBeenCalledExactlyOnceWith('/onboarding/email')
+  expect(request).toHaveBeenCalledTimes(2)
+  wrapper.unmount()
+})
diff --git a/test/unit/skill-source-list.test.ts b/test/unit/skill-source-list.test.ts
index 9e2c0906..478e5a8d 100644
--- a/test/unit/skill-source-list.test.ts
+++ b/test/unit/skill-source-list.test.ts
@@ -95,6 +95,25 @@ describe('skill source list', () => {
     expect(selectHomepageTrendingSkills(items, homepagePersonSkillFallbacks)).toEqual({ _tag: 'fallback' })
   })
 
+  it('attributes trending skills to repository maintainers', () => {
+    const items = Array.from({ length: HOMEPAGE_TRENDING_MINIMUM }, (_, index) => ({
+      owner: index === 0 ? 'addyosmani' : `author-${index}`,
+      repo: 'skills',
+      name: 'api-and-interface-design',
+      displayName: 'API and interface design',
+      registryPath: `/gh/${index === 0 ? 'addyosmani' : `author-${index}`}/skills/api-and-interface-design`,
+      maintainerName: 'Yarchi',
+    }))
+
+    const selection = selectHomepageTrendingSkills(items, homepagePersonSkillFallbacks)
+    expect(selection._tag).toBe('trending')
+    if (selection._tag !== 'trending')
+      return
+
+    expect(selection.items[0]?.maintainerName).toBe('Addy Osmani')
+    expect(selection.items[1]?.maintainerName).toBe('author-1')
+  })
+
   it('preserves a focused item until live data can replace it safely', async () => {
     const container = document.createElement('div')
     const outsideButton = document.createElement('button')

From 4729601527e534443e67747054e2a8341ce7bacb Mon Sep 17 00:00:00 2001
From: Harlan Wilton <harlan@harlanzw.com>
Date: Mon, 5 Oct 2026 13:46:52 +1100
Subject: [PATCH 2/3] fix(onboarding): enlarge the bulk selection target

---
 layers/identity/app/pages/onboarding/discover.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/layers/identity/app/pages/onboarding/discover.vue b/layers/identity/app/pages/onboarding/discover.vue
index 7b798dd0..27a4c525 100644
--- a/layers/identity/app/pages/onboarding/discover.vue
+++ b/layers/identity/app/pages/onboarding/discover.vue
@@ -169,7 +169,7 @@ useSeoMeta({ title: 'Discover skills', robots: 'noindex' })
         <button
           v-if="selectableItems.length"
           type="button"
-          class="text-xs text-muted hover:text-default underline"
+          class="min-h-11 text-xs text-muted hover:text-default underline"
           @click="toggleAll"
         >
           {{ allSelected ? 'Deselect all' : 'Select all' }}

From 2004e27af8cd51d78b8ffdc78dd1bcdfb55f8a2d Mon Sep 17 00:00:00 2001
From: Harlan Wilton <harlan@harlanzw.com>
Date: Mon, 5 Oct 2026 13:51:05 +1100
Subject: [PATCH 3/3] refactor(onboarding): keep fixes unique to this replay

---
 layers/identity/app/pages/login.vue           |  1 -
 .../app/pages/onboarding/discover.vue         | 31 +++++-------
 .../identity/app/pages/onboarding/email.vue   |  5 +-
 test/unit/onboarding-watch.test.ts            | 50 -------------------
 4 files changed, 14 insertions(+), 73 deletions(-)
 delete mode 100644 test/unit/onboarding-watch.test.ts

diff --git a/layers/identity/app/pages/login.vue b/layers/identity/app/pages/login.vue
index 7e69d379..247230b9 100644
--- a/layers/identity/app/pages/login.vue
+++ b/layers/identity/app/pages/login.vue
@@ -43,7 +43,6 @@ useSeoMeta({
           icon="i-lucide-github"
           trailing-icon="i-lucide-arrow-right"
           size="sm"
-          class="min-h-11"
           block
         />
       </div>
diff --git a/layers/identity/app/pages/onboarding/discover.vue b/layers/identity/app/pages/onboarding/discover.vue
index 27a4c525..e7c50ccf 100644
--- a/layers/identity/app/pages/onboarding/discover.vue
+++ b/layers/identity/app/pages/onboarding/discover.vue
@@ -1,5 +1,4 @@
 <script setup lang="ts">
-import type { IdentityMutationResponse } from '../../../shared/contracts/account'
 import type { StarsSyncResponse } from '../../utils/sync-starred-repos'
 import { syncStarredRepos } from '../../utils/sync-starred-repos'
 
@@ -83,26 +82,22 @@ onMounted(() => {
 
 const actionFailed = useActionFailure()
 
-const watchMutation = useNuxtMutation<Array<{ owner: string, repo: string }>, IdentityMutationResponse>({
-  mutation: repos => $fetch<IdentityMutationResponse>('/api/me/subscriptions', {
-    method: 'POST',
-    body: { source: 'star-import', repos },
-  }),
-  invalidates: ['identity:subscriptions'],
-  onError: actionFailed('start watching those repos'),
-})
-const submitting = watchMutation.pending
+const submitting = ref(false)
 async function watchSelected() {
   if (!selected.value.size) {
     await navigateTo('/onboarding/email')
     return
   }
-  const repos = selectableItems.value
-    .filter(item => selected.value.has(`${item.owner}/${item.repo}`))
-    .map(({ owner, repo }) => ({ owner, repo }))
-  const saved = await watchMutation.mutateSafe(repos)
-  if (saved._tag === 'err')
-    return
+  submitting.value = true
+  const repos = [...selected.value].map((k) => {
+    const [owner, repo] = k.split('/')
+    return { owner, repo }
+  })
+  await $fetch('/api/me/subscriptions', {
+    method: 'POST',
+    body: { source: 'star-import', repos },
+  }).catch(actionFailed('start watching those repos'))
+  submitting.value = false
   await navigateTo('/onboarding/email')
 }
 
@@ -169,7 +164,7 @@ useSeoMeta({ title: 'Discover skills', robots: 'noindex' })
         <button
           v-if="selectableItems.length"
           type="button"
-          class="min-h-11 text-xs text-muted hover:text-default underline"
+          class="text-xs text-muted hover:text-default underline"
           @click="toggleAll"
         >
           {{ allSelected ? 'Deselect all' : 'Select all' }}
@@ -216,7 +211,7 @@ useSeoMeta({ title: 'Discover skills', robots: 'noindex' })
     </template>
 
     <div class="mt-8 flex items-center justify-between">
-      <NuxtLink to="/onboarding/email" class="inline-flex min-h-11 min-w-11 items-center text-sm text-muted hover:text-default underline">
+      <NuxtLink to="/onboarding/email" class="inline-flex min-h-11 min-w-11 items-center font-mono text-sm text-muted hover:text-default underline">
         Skip
       </NuxtLink>
       <UButton
diff --git a/layers/identity/app/pages/onboarding/email.vue b/layers/identity/app/pages/onboarding/email.vue
index b7403cf7..0ce1240d 100644
--- a/layers/identity/app/pages/onboarding/email.vue
+++ b/layers/identity/app/pages/onboarding/email.vue
@@ -73,8 +73,7 @@ useSeoMeta({ title: 'Email opt-in', robots: 'noindex' })
           type="email"
           :aria-invalid="missingAddress"
           :aria-describedby="missingAddress ? 'email-error' : undefined"
-          autocomplete="email"
-          class="mt-1 min-h-11 w-full rounded border border-default bg-default px-3 py-2 font-mono text-sm"
+          class="mt-1 w-full rounded border border-default bg-default px-2 py-1 font-mono text-sm"
         >
         <p v-if="missingAddress" id="email-error" class="mt-1 text-xs text-error">
           Add an email address, or turn off both emails.
@@ -106,7 +105,6 @@ useSeoMeta({ title: 'Email opt-in', robots: 'noindex' })
         label="Back"
         leading-icon="i-lucide-arrow-left"
         size="sm"
-        class="min-h-11"
         color="neutral"
         variant="ghost"
       />
@@ -116,7 +114,6 @@ useSeoMeta({ title: 'Email opt-in', robots: 'noindex' })
         label="Finish"
         trailing-icon="i-lucide-check"
         size="sm"
-        class="min-h-11"
         @click="finish"
       />
     </div>
diff --git a/test/unit/onboarding-watch.test.ts b/test/unit/onboarding-watch.test.ts
deleted file mode 100644
index 761766c7..00000000
--- a/test/unit/onboarding-watch.test.ts
+++ /dev/null
@@ -1,50 +0,0 @@
-import { mockNuxtImport, mountSuspended } from '@nuxt/test-utils/runtime'
-import { flushPromises } from '@vue/test-utils'
-import { beforeEach, expect, it, vi } from 'vitest'
-import { ref } from 'vue'
-import Discover from '../../layers/identity/app/pages/onboarding/discover.vue'
-
-const request = vi.hoisted(() => vi.fn())
-const navigate = vi.hoisted(() => vi.fn())
-const reportFailure = vi.hoisted(() => vi.fn())
-
-mockNuxtImport('$fetch', () => request)
-mockNuxtImport('navigateTo', () => navigate)
-mockNuxtImport('useActionFailure', () => () => () => reportFailure)
-mockNuxtImport('useUserSession', () => () => ({ user: ref(null) }))
-mockNuxtImport('useFetch', () => () => ({
-  data: ref({
-    syncedAt: 1,
-    items: [{ owner: 'antfu', repo: 'skills', hasSkill: true, watching: false, skills: [] }],
-  }),
-  refresh: vi.fn(),
-  status: ref('success'),
-}))
-
-beforeEach(() => vi.clearAllMocks())
-
-it('keeps selected repos available when saving watches fails', async () => {
-  request.mockRejectedValueOnce(new Error('Unavailable'))
-  const wrapper = await mountSuspended(Discover)
-  await flushPromises()
-  const button = wrapper.findAll('button').find(button => button.text() === 'Watch 1')!
-  await button.trigger('click')
-  await flushPromises()
-
-  expect(request).toHaveBeenCalledWith('/api/me/subscriptions', {
-    method: 'POST',
-    body: { source: 'star-import', repos: [{ owner: 'antfu', repo: 'skills' }] },
-  })
-  expect(reportFailure).toHaveBeenCalledOnce()
-  expect(navigate).not.toHaveBeenCalled()
-  expect(button.attributes('disabled')).toBeUndefined()
-  expect((wrapper.get('input[type="checkbox"]').element as HTMLInputElement).checked).toBe(true)
-
-  request.mockResolvedValueOnce({ ok: true })
-  await button.trigger('click')
-  await flushPromises()
-
-  expect(navigate).toHaveBeenCalledExactlyOnceWith('/onboarding/email')
-  expect(request).toHaveBeenCalledTimes(2)
-  wrapper.unmount()
-})