From 981514fe223f3fab42e707d0a6a7c1d6164cdca9 Mon Sep 17 00:00:00 2001
From: Rudi Matz <rudi@staff.ietf.org>
Date: Wed, 15 Jul 2026 15:41:00 +0200
Subject: [PATCH 1/4] feat: add modal to create new assignment

---
 client/app/components/AssignmentModal.vue  |  56 ++++++++--
 client/app/pages/docs/[id]/assignments.vue | 120 +++++++++++++++++++--
 client/app/utils/queue.ts                  |   8 ++
 3 files changed, 165 insertions(+), 19 deletions(-)

diff --git a/client/app/components/AssignmentModal.vue b/client/app/components/AssignmentModal.vue
index 13acb2d7..63a1becf 100644
--- a/client/app/components/AssignmentModal.vue
+++ b/client/app/components/AssignmentModal.vue
@@ -11,6 +11,17 @@
           <BaseBadge :label="props.message.role" size="xl"></BaseBadge>
           assignment
         </span>
+        <span v-else-if="props.message.type === 'add'" class="flex items-center gap-2">
+          Add
+          <select
+            v-model="selectedRole"
+            class="text-base font-normal border border-gray-300 dark:border-gray-600 rounded px-2 py-1 bg-white dark:bg-neutral-800 min-w-[14rem]">
+            <option v-for="role in roleOptions" :key="role.slug" :value="role.slug">
+              {{ role.name }}
+            </option>
+          </select>
+          assignment
+        </span>
       </h1>
       <BaseButton btnType="cancel" class="m-2 flex items-center" @click="closeOverlayModal">
         <Icon name="uil:times" class="h-5 w-5" aria-hidden="true" />
@@ -94,7 +105,7 @@
 <script setup lang="ts">
 import { watch } from 'vue'
 import { BaseButton } from '#components'
-import type { Assignment, RpcPerson } from '~/purple_client'
+import type { Assignment, RpcPerson, RpcRole } from '~/purple_client'
 import type { AssignmentMessageProps } from '~/utils/queue'
 import type { ResolvedQueueItem } from './AssignmentsTypes'
 import { overlayModalKey } from '~/providers/providerKeys'
@@ -110,9 +121,28 @@ type Props = {
   peopleWorkload: Record<number, RpcPersonWorkload>
   clusters: ResolvedCluster[]
   onSuccess: () => void
+  // Only used by the 'add' message type: the roles the assigner can choose from
+  // (caller should exclude the synthetic 'blocked' role) and the role to
+  // pre-select (typically the draft's next pending activity).
+  roles?: RpcRole[]
+  defaultRole?: Assignment['role']
 }
 const props = defineProps<Props>()
 
+// Role options for the 'add' picker; defensively drop the synthetic 'blocked'
+// role even if the caller forgot to.
+const roleOptions = computed(() => (props.roles ?? []).filter((role) => role.slug !== 'blocked'))
+
+const selectedRole = ref<Assignment['role']>(
+  props.message.type === 'add' ? (props.defaultRole ?? roleOptions.value[0]?.slug ?? '') : ''
+)
+
+// The role an 'assign' action should use: chosen in the modal for 'add', or
+// fixed by the trigger for 'assign'/'change'.
+const effectiveRole = computed<Assignment['role']>(() =>
+  props.message.type === 'add' ? selectedRole.value : props.message.role
+)
+
 const generateId = (personId: number | undefined, personIndex: number): string =>
   `person-${personId ?? personIndex}`
 
@@ -125,7 +155,9 @@ if (!overlayModalKeyInjection) {
 type SelectedPeople = Record<number, boolean>
 
 const getInitialState = (message: AssignmentMessageProps): SelectedPeople => {
-  if (message.type === 'assign') {
+  // 'assign' and 'add' start with nobody selected; only 'change' pre-selects the
+  // people currently assigned to the role.
+  if (message.type !== 'change') {
     return {}
   }
   return message.assignments.reduce((acc, assignment) => {
@@ -229,12 +261,12 @@ watch(
             }
           })
       )
-    } else if (props.message.type === 'assign') {
-      const message = props.message
+    } else if (props.message.type === 'assign' || props.message.type === 'add') {
+      const rfcToBeId = props.message.rfcToBeId
       // withdrawals
-      // there are no withdrawals when initially assigning
+      // there are no withdrawals when initially assigning or adding
 
-      // new assignments
+      // new assignments — role is fixed for 'assign', chosen for 'add'
       newActions.push(
         ...Object.entries(isPersonSelected.value)
           .filter(([personIdString, isSelected]) => {
@@ -245,18 +277,26 @@ watch(
             return {
               type: 'assign',
               personId,
-              rfcToBeId: message.rfcToBeId,
-              role: message.role
+              rfcToBeId,
+              role: effectiveRole.value
             }
           })
       )
     }
 
     actions.value = newActions
+    // Changing the role in 'add' mode must rebuild the pending actions with the
+    // new role, so watch selectedRole alongside the person selection.
   },
   { deep: true }
 )
 
+watch(selectedRole, () => {
+  actions.value = actions.value.map((action) =>
+    action.type === 'assign' ? { ...action, role: selectedRole.value } : action
+  )
+})
+
 // filter the list of editors to those who are active or currently assigned
 const visiblePeople = computed(() => {
   return props.people.filter((person) => {
diff --git a/client/app/pages/docs/[id]/assignments.vue b/client/app/pages/docs/[id]/assignments.vue
index 3aecce03..94449808 100644
--- a/client/app/pages/docs/[id]/assignments.vue
+++ b/client/app/pages/docs/[id]/assignments.vue
@@ -20,12 +20,17 @@
           <div class="px-0 pt-6 sm:px-6">
             <div class="flex items-center justify-between mb-4">
               <h3 class="text-base font-semibold leading-7">Assignments</h3>
-              <BaseButton v-if="!hasManualHold" btn-type="cancel" @click="setManualHold"
-                >Set Manual Hold</BaseButton
-              >
-              <BaseButton v-else btn-type="secondary" @click="clearManualHold"
-                >Clear Manual Hold</BaseButton
-              >
+              <div class="flex items-center gap-2">
+                <BaseButton btn-type="default" @click="openAddAssignmentModal"
+                  >Add assignment</BaseButton
+                >
+                <BaseButton v-if="!hasManualHold" btn-type="cancel" @click="setManualHold"
+                  >Set Manual Hold</BaseButton
+                >
+                <BaseButton v-else btn-type="secondary" @click="clearManualHold"
+                  >Clear Manual Hold</BaseButton
+                >
+              </div>
             </div>
             <div class="text-sm font-medium">
               <div v-if="rfcToBeAssignments.length === 0">None</div>
@@ -98,10 +103,11 @@ import { useAsyncData } from '#app'
 import { snackbarForErrors } from '~/utils/snackbar'
 import { type DocTabId } from '~/utils/doc'
 import { teamMemberLink } from '~/utils/url'
-import type { Assignment } from '~/purple_client'
+import type { Assignment, RpcPerson, RpcRole } from '~/purple_client'
 import { overlayModalKey } from '~/providers/providerKeys'
-import { ManualHoldModal } from '#components'
-import { sortAssignmentsByRole } from '~/utils/sort'
+import { ManualHoldModal, AssignmentModal } from '#components'
+import { sortAssignmentsByRole, assignmentRoleOrder } from '~/utils/sort'
+import { calculatePeopleWorkload, type AssignmentMessageProps } from '~/utils/queue'
 
 const route = useRoute()
 const api = useApi()
@@ -255,10 +261,102 @@ watch(
   { deep: true }
 )
 
-const { data: people } = await useAsyncData(() => api.rpcPersonList(), {
+const {
+  data: people,
+  status: peopleStatus,
+  execute: loadPeople
+} = await useAsyncData('rpc-people', () => api.rpcPersonList(), {
+  server: false,
+  lazy: true,
+  default: () => [] as RpcPerson[]
+})
+
+// Data for the "Add assignment" modal: the full role list for the type picker,
+// plus the queue + clusters used to show each person's current workload.
+const {
+  data: roles,
+  status: rolesStatus,
+  execute: loadRoles
+} = await useAsyncData('rpc-roles', () => api.rpcRolesList(), {
+  server: false,
+  lazy: true,
+  default: () => [] as RpcRole[]
+})
+
+// Only the assignment-pipeline roles are selectable — excludes non-assignment
+// roles like `manager` and the synthetic `blocked`. `assignmentRoleOrder` is the
+// canonical set/order of assignment roles.
+const assignmentRoles = computed<RpcRole[]>(() =>
+  (roles.value ?? [])
+    .filter((r) => (assignmentRoleOrder as readonly string[]).includes(r.slug))
+    .sort(
+      (a, b) =>
+        assignmentRoleOrder.indexOf(a.slug as (typeof assignmentRoleOrder)[number]) -
+        assignmentRoleOrder.indexOf(b.slug as (typeof assignmentRoleOrder)[number])
+    )
+)
+
+const {
+  data: clusters,
+  status: clustersStatus,
+  execute: loadClusters
+} = await useAsyncData('assignments-clusters', () => api.clustersList(), {
+  server: false,
+  lazy: true,
+  default: () => []
+})
+
+const {
+  data: queueItems,
+  status: queueStatus,
+  execute: loadQueue
+} = await useAsyncData('assignments-queue', () => api.queueList(), {
   server: false,
-  lazy: true
+  lazy: true,
+  default: () => []
 })
 
+// Default the modal to the draft's next pending activity (earliest in the
+// pipeline order when several are pending), falling back to the first real role.
+const defaultRole = computed<string>(() => {
+  const pending = [...(rfcToBe.value?.pendingActivities ?? [])].sort(
+    (a, b) =>
+      assignmentRoleOrder.indexOf(a.slug as (typeof assignmentRoleOrder)[number]) -
+      assignmentRoleOrder.indexOf(b.slug as (typeof assignmentRoleOrder)[number])
+  )
+  return pending[0]?.slug ?? assignmentRoles.value[0]?.slug ?? ''
+})
+
+// The modal's data is loaded lazily, and openOverlayModal binds a one-time
+// snapshot of componentProps — so make sure everything has resolved before we
+// open, otherwise a still-in-flight fetch (e.g. the slower people list) would
+// snapshot as empty and show "(no people)".
+const ensureModalDataLoaded = () =>
+  Promise.all([
+    peopleStatus.value === 'success' ? undefined : loadPeople(),
+    rolesStatus.value === 'success' ? undefined : loadRoles(),
+    clustersStatus.value === 'success' ? undefined : loadClusters(),
+    queueStatus.value === 'success' ? undefined : loadQueue()
+  ])
+
+const openAddAssignmentModal = async () => {
+  const rfcToBeId = rfcToBe.value?.id
+  if (rfcToBeId === undefined) return
+  await ensureModalDataLoaded()
+  const peopleWorkload = calculatePeopleWorkload(clusters.value ?? [], queueItems.value ?? [])
+  openOverlayModal({
+    component: AssignmentModal,
+    componentProps: {
+      message: { type: 'add', rfcToBeId } satisfies AssignmentMessageProps,
+      people: people.value ?? [],
+      peopleWorkload,
+      clusters: clusters.value ?? [],
+      roles: assignmentRoles.value,
+      defaultRole: defaultRole.value,
+      onSuccess: refreshAll
+    }
+  }).catch(() => {})
+}
+
 useHeadSafe({ title: draftName.value })
 </script>
diff --git a/client/app/utils/queue.ts b/client/app/utils/queue.ts
index adb6c252..568f10b2 100644
--- a/client/app/utils/queue.ts
+++ b/client/app/utils/queue.ts
@@ -97,6 +97,14 @@ export type AssignmentMessageProps =
       role: Assignment['role']
       rfcToBeId: number
     }
+  | {
+      // Add an assignment of any role to a draft. Unlike 'assign' (role fixed by
+      // the pending-activity button that opened it), the assigner picks the role
+      // in the modal — allowing out-of-pipeline roles or re-adding a role whose
+      // earlier assignment was closed too early.
+      type: 'add'
+      rfcToBeId: number
+    }
 
 export type RpcPersonWorkload = {
   personId: number

From 201516008885555be912539471f4caf77dae0c18 Mon Sep 17 00:00:00 2001
From: Rudi Matz <rudi@staff.ietf.org>
Date: Fri, 17 Jul 2026 15:48:32 +0200
Subject: [PATCH 2/4] move ADD logic to Manage-Modal

---
 .../components/AssignmentFinishedModal.vue    |  77 +++++++++++-
 client/app/pages/docs/[id]/assignments.vue    | 117 ++----------------
 2 files changed, 81 insertions(+), 113 deletions(-)

diff --git a/client/app/components/AssignmentFinishedModal.vue b/client/app/components/AssignmentFinishedModal.vue
index 6a9244b3..b56448d0 100644
--- a/client/app/components/AssignmentFinishedModal.vue
+++ b/client/app/components/AssignmentFinishedModal.vue
@@ -7,9 +7,17 @@
           {{ props.rfcToBe.name }}
         </span>
       </h1>
-      <BaseButton btnType="cancel" class="m-2 flex items-center" @click="closeOverlayModal">
-        <Icon name="uil:times" class="h-5 w-5" aria-hidden="true" />
-      </BaseButton>
+      <div class="m-2 flex items-center gap-2">
+        <BaseButton btnType="default" class="flex items-center" @click="openAddAssignmentModal">
+          <span>Add assignment</span>
+          <span v-if="isLoadingAdd" class="w-3">
+            <Icon name="ei:spinner-3" size="1rem" class="animate-spin" />
+          </span>
+        </BaseButton>
+        <BaseButton btnType="cancel" class="flex items-center" @click="closeOverlayModal">
+          <Icon name="uil:times" class="h-5 w-5" aria-hidden="true" />
+        </BaseButton>
+      </div>
     </div>
     <div class="flex-1 overflow-y-scroll px-4 pt-4 pb-7">
       <ul class="flex flex-col gap-4">
@@ -36,11 +44,12 @@
 </template>
 
 <script setup lang="ts">
-import { BaseButton } from '#components'
-import type { Assignment, RpcPerson } from '~/purple_client'
+import { BaseButton, AssignmentModal } from '#components'
+import type { Assignment, RpcPerson, RpcRole } from '~/purple_client'
 import { overlayModalKey } from '~/providers/providerKeys'
 import { groupBy } from 'es-toolkit/array'
 import { assignmentRoleOrder } from '~/utils/sort'
+import { calculatePeopleWorkload, type AssignmentMessageProps } from '~/utils/queue'
 
 type Props = {
   rfcToBe: CookedDraft
@@ -50,6 +59,8 @@ type Props = {
 }
 const props = defineProps<Props>()
 
+const api = useApi()
+
 const assignmentsByRolesObj = groupBy(props.assignments, (assignment) => assignment.role)
 
 const assignmentsByRoles = ref(
@@ -72,5 +83,59 @@ if (!overlayModalKeyInjection) {
   throw Error('Expected injection of overlayModalKey')
 }
 
-const { closeOverlayModal } = overlayModalKeyInjection
+const { openOverlayModal, closeOverlayModal } = overlayModalKeyInjection
+
+// "Add assignment" — folds the standalone add-assignment flow into this modal.
+// Loads the data the add picker needs, then opens AssignmentModal in 'add' mode
+// (which replaces this modal in the single overlay slot).
+const isLoadingAdd = ref(false)
+
+const roleOrderIndex = (slug: string) =>
+  assignmentRoleOrder.indexOf(slug as (typeof assignmentRoleOrder)[number])
+
+const openAddAssignmentModal = async () => {
+  const rfcToBeId = props.rfcToBe.id
+  if (rfcToBeId === undefined) return
+
+  isLoadingAdd.value = true
+  try {
+    const [roles, clusters, queueItems] = await Promise.all([
+      api.rpcRolesList(),
+      api.clustersList(),
+      api.queueList()
+    ])
+
+    // Only assignment-pipeline roles are selectable (excludes `manager` and the
+    // synthetic `blocked`), ordered by the canonical pipeline order.
+    const roleOptions = roles
+      .filter((r) => (assignmentRoleOrder as readonly string[]).includes(r.slug))
+      .sort((a, b) => roleOrderIndex(a.slug) - roleOrderIndex(b.slug))
+
+    // Default to the draft's next pending activity (earliest in pipeline order),
+    // falling back to the first selectable role.
+    const pending = [...(props.rfcToBe.pendingActivities ?? [])].sort(
+      (a, b) => roleOrderIndex(a.slug) - roleOrderIndex(b.slug)
+    )
+    const defaultRole = pending[0]?.slug ?? roleOptions[0]?.slug ?? ''
+
+    const peopleWorkload = calculatePeopleWorkload(clusters, queueItems)
+
+    openOverlayModal({
+      component: AssignmentModal,
+      componentProps: {
+        message: { type: 'add', rfcToBeId } satisfies AssignmentMessageProps,
+        people: props.people,
+        peopleWorkload,
+        clusters,
+        roles: roleOptions,
+        defaultRole,
+        onSuccess: props.onSuccess
+      }
+    }).catch(() => {})
+  } catch (e) {
+    console.error(e)
+  } finally {
+    isLoadingAdd.value = false
+  }
+}
 </script>
diff --git a/client/app/pages/docs/[id]/assignments.vue b/client/app/pages/docs/[id]/assignments.vue
index 94449808..10b83e0e 100644
--- a/client/app/pages/docs/[id]/assignments.vue
+++ b/client/app/pages/docs/[id]/assignments.vue
@@ -20,17 +20,12 @@
           <div class="px-0 pt-6 sm:px-6">
             <div class="flex items-center justify-between mb-4">
               <h3 class="text-base font-semibold leading-7">Assignments</h3>
-              <div class="flex items-center gap-2">
-                <BaseButton btn-type="default" @click="openAddAssignmentModal"
-                  >Add assignment</BaseButton
-                >
-                <BaseButton v-if="!hasManualHold" btn-type="cancel" @click="setManualHold"
-                  >Set Manual Hold</BaseButton
-                >
-                <BaseButton v-else btn-type="secondary" @click="clearManualHold"
-                  >Clear Manual Hold</BaseButton
-                >
-              </div>
+              <BaseButton v-if="!hasManualHold" btn-type="cancel" @click="setManualHold"
+                >Set Manual Hold</BaseButton
+              >
+              <BaseButton v-else btn-type="secondary" @click="clearManualHold"
+                >Clear Manual Hold</BaseButton
+              >
             </div>
             <div class="text-sm font-medium">
               <div v-if="rfcToBeAssignments.length === 0">None</div>
@@ -103,11 +98,10 @@ import { useAsyncData } from '#app'
 import { snackbarForErrors } from '~/utils/snackbar'
 import { type DocTabId } from '~/utils/doc'
 import { teamMemberLink } from '~/utils/url'
-import type { Assignment, RpcPerson, RpcRole } from '~/purple_client'
+import type { Assignment, RpcPerson } from '~/purple_client'
 import { overlayModalKey } from '~/providers/providerKeys'
-import { ManualHoldModal, AssignmentModal } from '#components'
-import { sortAssignmentsByRole, assignmentRoleOrder } from '~/utils/sort'
-import { calculatePeopleWorkload, type AssignmentMessageProps } from '~/utils/queue'
+import { ManualHoldModal } from '#components'
+import { sortAssignmentsByRole } from '~/utils/sort'
 
 const route = useRoute()
 const api = useApi()
@@ -261,102 +255,11 @@ watch(
   { deep: true }
 )
 
-const {
-  data: people,
-  status: peopleStatus,
-  execute: loadPeople
-} = await useAsyncData('rpc-people', () => api.rpcPersonList(), {
+const { data: people } = await useAsyncData('rpc-people', () => api.rpcPersonList(), {
   server: false,
   lazy: true,
   default: () => [] as RpcPerson[]
 })
 
-// Data for the "Add assignment" modal: the full role list for the type picker,
-// plus the queue + clusters used to show each person's current workload.
-const {
-  data: roles,
-  status: rolesStatus,
-  execute: loadRoles
-} = await useAsyncData('rpc-roles', () => api.rpcRolesList(), {
-  server: false,
-  lazy: true,
-  default: () => [] as RpcRole[]
-})
-
-// Only the assignment-pipeline roles are selectable — excludes non-assignment
-// roles like `manager` and the synthetic `blocked`. `assignmentRoleOrder` is the
-// canonical set/order of assignment roles.
-const assignmentRoles = computed<RpcRole[]>(() =>
-  (roles.value ?? [])
-    .filter((r) => (assignmentRoleOrder as readonly string[]).includes(r.slug))
-    .sort(
-      (a, b) =>
-        assignmentRoleOrder.indexOf(a.slug as (typeof assignmentRoleOrder)[number]) -
-        assignmentRoleOrder.indexOf(b.slug as (typeof assignmentRoleOrder)[number])
-    )
-)
-
-const {
-  data: clusters,
-  status: clustersStatus,
-  execute: loadClusters
-} = await useAsyncData('assignments-clusters', () => api.clustersList(), {
-  server: false,
-  lazy: true,
-  default: () => []
-})
-
-const {
-  data: queueItems,
-  status: queueStatus,
-  execute: loadQueue
-} = await useAsyncData('assignments-queue', () => api.queueList(), {
-  server: false,
-  lazy: true,
-  default: () => []
-})
-
-// Default the modal to the draft's next pending activity (earliest in the
-// pipeline order when several are pending), falling back to the first real role.
-const defaultRole = computed<string>(() => {
-  const pending = [...(rfcToBe.value?.pendingActivities ?? [])].sort(
-    (a, b) =>
-      assignmentRoleOrder.indexOf(a.slug as (typeof assignmentRoleOrder)[number]) -
-      assignmentRoleOrder.indexOf(b.slug as (typeof assignmentRoleOrder)[number])
-  )
-  return pending[0]?.slug ?? assignmentRoles.value[0]?.slug ?? ''
-})
-
-// The modal's data is loaded lazily, and openOverlayModal binds a one-time
-// snapshot of componentProps — so make sure everything has resolved before we
-// open, otherwise a still-in-flight fetch (e.g. the slower people list) would
-// snapshot as empty and show "(no people)".
-const ensureModalDataLoaded = () =>
-  Promise.all([
-    peopleStatus.value === 'success' ? undefined : loadPeople(),
-    rolesStatus.value === 'success' ? undefined : loadRoles(),
-    clustersStatus.value === 'success' ? undefined : loadClusters(),
-    queueStatus.value === 'success' ? undefined : loadQueue()
-  ])
-
-const openAddAssignmentModal = async () => {
-  const rfcToBeId = rfcToBe.value?.id
-  if (rfcToBeId === undefined) return
-  await ensureModalDataLoaded()
-  const peopleWorkload = calculatePeopleWorkload(clusters.value ?? [], queueItems.value ?? [])
-  openOverlayModal({
-    component: AssignmentModal,
-    componentProps: {
-      message: { type: 'add', rfcToBeId } satisfies AssignmentMessageProps,
-      people: people.value ?? [],
-      peopleWorkload,
-      clusters: clusters.value ?? [],
-      roles: assignmentRoles.value,
-      defaultRole: defaultRole.value,
-      onSuccess: refreshAll
-    }
-  }).catch(() => {})
-}
-
 useHeadSafe({ title: draftName.value })
 </script>

From 49a5f6ab02c1e87a5a585b5840039a9ed56c2aed Mon Sep 17 00:00:00 2001
From: Rudi Matz <rudi@staff.ietf.org>
Date: Wed, 12 Aug 2026 16:51:20 -0400
Subject: [PATCH 3/4] add check to disable add assignment while blocked

---
 .../components/AssignmentFinishedModal.vue    | 22 +++++++++++++++++--
 1 file changed, 20 insertions(+), 2 deletions(-)

diff --git a/client/app/components/AssignmentFinishedModal.vue b/client/app/components/AssignmentFinishedModal.vue
index b56448d0..5f1719d8 100644
--- a/client/app/components/AssignmentFinishedModal.vue
+++ b/client/app/components/AssignmentFinishedModal.vue
@@ -8,7 +8,16 @@
         </span>
       </h1>
       <div class="m-2 flex items-center gap-2">
-        <BaseButton btnType="default" class="flex items-center" @click="openAddAssignmentModal">
+        <BaseButton
+          btnType="default"
+          class="flex items-center disabled:opacity-60 disabled:cursor-not-allowed"
+          :disabled="isBlocked"
+          :title="
+            isBlocked
+              ? 'This document is blocked — resolve the block before adding an assignment.'
+              : undefined
+          "
+          @click="openAddAssignmentModal">
           <span>Add assignment</span>
           <span v-if="isLoadingAdd" class="w-3">
             <Icon name="ei:spinner-3" size="1rem" class="animate-spin" />
@@ -46,6 +55,7 @@
 <script setup lang="ts">
 import { BaseButton, AssignmentModal } from '#components'
 import type { Assignment, RpcPerson, RpcRole } from '~/purple_client'
+import { StateEnum } from '~/purple_client'
 import { overlayModalKey } from '~/providers/providerKeys'
 import { groupBy } from 'es-toolkit/array'
 import { assignmentRoleOrder } from '~/utils/sort'
@@ -61,6 +71,14 @@ const props = defineProps<Props>()
 
 const api = useApi()
 
+// A blocked doc's work assignments are closed and held by an active (in_progress)
+// 'blocked' assignment, so adding a new one would create an inconsistent state.
+const isBlocked = computed(() =>
+  props.assignments.some(
+    (a) => a.role === 'blocked' && a.state === StateEnum.InProgress
+  )
+)
+
 const assignmentsByRolesObj = groupBy(props.assignments, (assignment) => assignment.role)
 
 const assignmentsByRoles = ref(
@@ -95,7 +113,7 @@ const roleOrderIndex = (slug: string) =>
 
 const openAddAssignmentModal = async () => {
   const rfcToBeId = props.rfcToBe.id
-  if (rfcToBeId === undefined) return
+  if (rfcToBeId === undefined || isBlocked.value) return
 
   isLoadingAdd.value = true
   try {

From 95bd97bd1bb4b6dc33f4e659ccd2e5da2ddc4118 Mon Sep 17 00:00:00 2001
From: Rudi Matz <rudi@staff.ietf.org>
Date: Wed, 12 Aug 2026 16:57:00 -0400
Subject: [PATCH 4/4] oxformat

---
 client/app/components/AssignmentFinishedModal.vue | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/client/app/components/AssignmentFinishedModal.vue b/client/app/components/AssignmentFinishedModal.vue
index 5f1719d8..0c98883f 100644
--- a/client/app/components/AssignmentFinishedModal.vue
+++ b/client/app/components/AssignmentFinishedModal.vue
@@ -74,9 +74,7 @@ const api = useApi()
 // A blocked doc's work assignments are closed and held by an active (in_progress)
 // 'blocked' assignment, so adding a new one would create an inconsistent state.
 const isBlocked = computed(() =>
-  props.assignments.some(
-    (a) => a.role === 'blocked' && a.state === StateEnum.InProgress
-  )
+  props.assignments.some((a) => a.role === 'blocked' && a.state === StateEnum.InProgress)
 )
 
 const assignmentsByRolesObj = groupBy(props.assignments, (assignment) => assignment.role)