From 8f05f4ec7c975c310fe5bbc7b5c22b1d180e102a Mon Sep 17 00:00:00 2001
From: padreug <padreug@aiolabs.dev>
Date: Sun, 16 Nov 2025 21:14:34 +0100
Subject: [PATCH] Add communication confirmation checkbox for unclaiming tasks
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Require users to confirm they've communicated with the team before unclaiming a task to prevent coordination issues.

Changes:
- Add hasConfirmedCommunication checkbox state
- Show checkbox in unclaim confirmation dialog
- Disable "Unclaim Task" button until checkbox is checked
- Reset checkbox state when dialog is closed/cancelled
- Update dialog description to prompt communication

UX Flow:
1. User clicks "Unclaim" button
2. Dialog appears with message about removing claim
3. Checkbox: "I have communicated this to the team"
4. "Unclaim Task" button disabled until checkbox checked
5. Forces user acknowledgment before unclaiming

This prevents situations where:
- Someone unclaims without notifying others working on related tasks
- Team members are left confused about task status
- Work gets duplicated or blocked due to lack of communication

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 .../components/ScheduledEventCard.vue         | 34 +++++++++++++++++--
 1 file changed, 32 insertions(+), 2 deletions(-)

diff --git a/src/modules/nostr-feed/components/ScheduledEventCard.vue b/src/modules/nostr-feed/components/ScheduledEventCard.vue
index 3abb133..25d312a 100644
--- a/src/modules/nostr-feed/components/ScheduledEventCard.vue
+++ b/src/modules/nostr-feed/components/ScheduledEventCard.vue
@@ -2,6 +2,7 @@
 import { computed, ref } from 'vue'
 import { Badge } from '@/components/ui/badge'
 import { Button } from '@/components/ui/button'
+import { Checkbox } from '@/components/ui/checkbox'
 import {
   Dialog,
   DialogContent,
@@ -46,6 +47,7 @@ const authService = injectService<AuthService>(SERVICE_TOKENS.AUTH_SERVICE)
 
 // Confirmation dialog state
 const showConfirmDialog = ref(false)
+const hasConfirmedCommunication = ref(false)
 
 // Event address for tracking completion
 const eventAddress = computed(() => `31922:${props.event.pubkey}:${props.event.dTag}`)
@@ -178,6 +180,11 @@ function handleUnclaimTask() {
 function confirmAction() {
   if (!pendingAction.value) return
 
+  // For unclaim action, require checkbox confirmation
+  if (pendingAction.value === 'unclaim' && !hasConfirmedCommunication.value) {
+    return
+  }
+
   switch (pendingAction.value) {
     case 'claim':
       emit('claim-task', props.event, occurrence.value)
@@ -195,12 +202,14 @@ function confirmAction() {
 
   showConfirmDialog.value = false
   pendingAction.value = null
+  hasConfirmedCommunication.value = false
 }
 
 // Cancel action
 function cancelAction() {
   showConfirmDialog.value = false
   pendingAction.value = null
+  hasConfirmedCommunication.value = false
 }
 
 // Get dialog content based on pending action
@@ -227,7 +236,7 @@ const dialogContent = computed(() => {
     case 'unclaim':
       return {
         title: 'Unclaim Task?',
-        description: `This will remove your claim on "${props.event.title}" and make it available for others.`,
+        description: `This will remove your claim on "${props.event.title}" and make it available for others.\n\nHave you communicated to others that you are unclaiming this task?`,
         confirmText: 'Unclaim Task'
       }
     default:
@@ -466,9 +475,30 @@ const dialogContent = computed(() => {
           {{ dialogContent.description }}
         </DialogDescription>
       </DialogHeader>
+
+      <!-- Communication confirmation checkbox (only for unclaim) -->
+      <div v-if="pendingAction === 'unclaim'" class="flex items-start space-x-3 py-4">
+        <Checkbox
+          :model-value="hasConfirmedCommunication"
+          @update:model-value="(val) => hasConfirmedCommunication = !!val"
+          id="confirm-communication"
+        />
+        <label
+          for="confirm-communication"
+          class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70 cursor-pointer"
+        >
+          I have communicated this to the team.
+        </label>
+      </div>
+
       <DialogFooter>
         <Button variant="outline" @click="cancelAction">Cancel</Button>
-        <Button @click="confirmAction">{{ dialogContent.confirmText }}</Button>
+        <Button
+          @click="confirmAction"
+          :disabled="pendingAction === 'unclaim' && !hasConfirmedCommunication"
+        >
+          {{ dialogContent.confirmText }}
+        </Button>
       </DialogFooter>
     </DialogContent>
   </Dialog>