fix(modals): consistent text colors, copy, and workspace delete confirmation

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Author: waleedlatif1

apps/sim/app/workspace/[workspaceId]/files/files.tsx

@@ -1232,10 +1232,8 @@ const DeleteConfirmModal = memo(function DeleteConfirmModal({
         <ModalBody>
           <p className='text-[var(--text-secondary)]'>
             Are you sure you want to delete{' '}
-            <span className='font-medium text-[var(--text-primary)]'>{fileName}</span>?{' '}
-            <span className='text-[var(--text-tertiary)]'>
-              You can restore it from Recently Deleted in Settings.
-            </span>
+            <span className='font-medium text-[var(--text-primary)]'>{fileName}</span>? You can
+            restore it from Recently Deleted in Settings.
           </p>
         </ModalBody>
         <ModalFooter>

apps/sim/app/workspace/[workspaceId]/knowledge/[id]/[documentId]/components/delete-chunk-modal/delete-chunk-modal.tsx

@@ -35,8 +35,7 @@ export function DeleteChunkModal({
         <ModalHeader>Delete Chunk</ModalHeader>
         <ModalBody>
           <p className='text-[var(--text-secondary)]'>
-            Are you sure you want to delete this chunk?{' '}
-            <span className='text-[var(--text-error)]'>This action cannot be undone.</span>
+            Are you sure you want to delete this chunk? This action cannot be undone.
           </p>
         </ModalBody>
         <ModalFooter>

apps/sim/app/workspace/[workspaceId]/knowledge/[id]/[documentId]/components/document-tags-modal/document-tags-modal.tsx

@@ -383,7 +383,7 @@ export function DocumentTagsModal({
 
   return (
     <Modal open={open} onOpenChange={handleClose}>
-      <ModalContent size='md'>
+      <ModalContent size='sm'>
         <ModalHeader>
           <div className='flex items-center justify-between'>
             <span>Document Tags</span>

apps/sim/app/workspace/[workspaceId]/knowledge/[id]/[documentId]/document.tsx

@@ -1187,7 +1187,7 @@ export function Document({
                   from future syncs. To temporarily hide it from search, disable it instead.
                 </span>
               ) : (
-                <span className='text-[var(--text-error)]'>This action cannot be undone.</span>
+                <>This action cannot be undone.</>
               )}
             </p>
           </ModalBody>

apps/sim/app/workspace/[workspaceId]/knowledge/[id]/base.tsx

@@ -1182,9 +1182,7 @@ export function KnowledgeBase({
                 The knowledge base and all {pagination.total} document
                 {pagination.total === 1 ? '' : 's'} within it will be removed.
               </span>{' '}
-              <span className='text-[var(--text-tertiary)]'>
-                You can restore it from Recently Deleted in Settings.
-              </span>
+              You can restore it from Recently Deleted in Settings.
             </p>
           </ModalBody>
           <ModalFooter>
@@ -1221,9 +1219,12 @@ export function KnowledgeBase({
                       it from future syncs. To temporarily hide it from search, disable it instead.
                     </span>
                   ) : (
-                    <span className='text-[var(--text-error)]'>
-                      This will permanently delete the document.
-                    </span>
+                    <>
+                      <span className='text-[var(--text-error)]'>
+                        This will permanently delete the document.
+                      </span>{' '}
+                      This action cannot be undone.
+                    </>
                   )}
                 </p>
               )
@@ -1256,7 +1257,8 @@ export function KnowledgeBase({
               <span className='text-[var(--text-error)]'>
                 This will permanently delete the selected document
                 {selectedDocuments.size === 1 ? '' : 's'}.
-              </span>
+              </span>{' '}
+              This action cannot be undone.
             </p>
           </ModalBody>
           <ModalFooter>

apps/sim/app/workspace/[workspaceId]/knowledge/[id]/components/base-tags-modal/base-tags-modal.tsx

@@ -261,7 +261,7 @@ export function BaseTagsModal({ open, onOpenChange, knowledgeBaseId }: BaseTagsM
   return (
     <>
       <Modal open={open} onOpenChange={handleClose}>
-        <ModalContent size='md'>
+        <ModalContent size='sm'>
           <ModalHeader>
             <div className='flex items-center justify-between'>
               <span>Tags</span>
@@ -421,7 +421,7 @@ export function BaseTagsModal({ open, onOpenChange, knowledgeBaseId }: BaseTagsM
                   This will remove this tag from {selectedTagUsage?.documentCount || 0} document
                   {selectedTagUsage?.documentCount !== 1 ? 's' : ''}.
                 </span>{' '}
-                <span className='text-[var(--text-error)]'>This action cannot be undone.</span>
+                This action cannot be undone.
               </p>
 
               {selectedTagUsage && selectedTagUsage.documentCount > 0 && (

apps/sim/app/workspace/[workspaceId]/knowledge/components/base-card/base-card.tsx

@@ -1,6 +1,6 @@
 'use client'
 
-import { useCallback, useRef, useState } from 'react'
+import { useCallback, useState } from 'react'
 import { useParams, useRouter } from 'next/navigation'
 import { Badge, DocumentAttachment, Tooltip } from '@/components/emcn'
 import { formatAbsoluteDate, formatRelativeTime } from '@/lib/core/utils/formatting'
@@ -101,23 +101,6 @@ export function BaseCard({
   const [isTagsModalOpen, setIsTagsModalOpen] = useState(false)
   const [isDeleting, setIsDeleting] = useState(false)
 
-  /**
-   * Guards against context menu actions triggering card navigation.
-   * The card's onClick fires synchronously during the click event bubble phase,
-   * so the ref is checked before the setTimeout-0 callback resets it.
-   */
-  const actionTakenRef = useRef(false)
-  const withActionGuard = useCallback((fn: () => void) => {
-    actionTakenRef.current = true
-    try {
-      fn()
-    } finally {
-      setTimeout(() => {
-        actionTakenRef.current = false
-      }, 0)
-    }
-  }, [])
-
   const searchParams = new URLSearchParams({
     kbName: title,
   })
@@ -127,7 +110,7 @@ export function BaseCard({
 
   const handleClick = useCallback(
     (e: React.MouseEvent) => {
-      if (isContextMenuOpen || actionTakenRef.current) {
+      if (isContextMenuOpen) {
         e.preventDefault()
         return
       }
@@ -147,25 +130,20 @@ export function BaseCard({
   )
 
   const handleOpenInNewTab = useCallback(() => {
-    withActionGuard(() => window.open(href, '_blank'))
-  }, [href, withActionGuard])
+    window.open(href, '_blank')
+  }, [href])
 
   const handleViewTags = useCallback(() => {
-    withActionGuard(() => setIsTagsModalOpen(true))
-  }, [withActionGuard])
+    setIsTagsModalOpen(true)
+  }, [])
 
   const handleEdit = useCallback(() => {
-    withActionGuard(() => setIsEditModalOpen(true))
-  }, [withActionGuard])
+    setIsEditModalOpen(true)
+  }, [])
 
   const handleDelete = useCallback(() => {
-    withActionGuard(() => setIsDeleteModalOpen(true))
-  }, [withActionGuard])
-
-  const handleCopyId = useCallback(() => {
-    if (!id) return
-    withActionGuard(() => navigator.clipboard.writeText(id))
-  }, [id, withActionGuard])
+    setIsDeleteModalOpen(true)
+  }, [])
 
   const handleConfirmDelete = useCallback(async () => {
     if (!id || !onDelete) return
@@ -262,7 +240,7 @@ export function BaseCard({
         onClose={closeContextMenu}
         onOpenInNewTab={handleOpenInNewTab}
         onViewTags={handleViewTags}
-        onCopyId={id ? handleCopyId : undefined}
+        onCopyId={id ? () => navigator.clipboard.writeText(id) : undefined}
         onEdit={handleEdit}
         onDelete={handleDelete}
         showOpenInNewTab={true}

apps/sim/app/workspace/[workspaceId]/knowledge/components/delete-knowledge-base-modal/delete-knowledge-base-modal.tsx

@@ -59,9 +59,7 @@ export const DeleteKnowledgeBaseModal = memo(function DeleteKnowledgeBaseModal({
                 </span>
               </>
             )}{' '}
-            <span className='text-[var(--text-tertiary)]'>
-              You can restore it from Recently Deleted in Settings.
-            </span>
+            You can restore it from Recently Deleted in Settings.
           </p>
         </ModalBody>
         <ModalFooter>

apps/sim/app/workspace/[workspaceId]/logs/components/logs-toolbar/components/notifications/notifications.tsx

@@ -1267,11 +1267,11 @@ export const NotificationSettings = memo(function NotificationSettings({
         <ModalContent size='sm'>
           <ModalHeader>Delete Notification</ModalHeader>
           <ModalBody>
-            <p className='text-[var(--text-secondary)] text-caption'>
+            <p className='text-[var(--text-secondary)]'>
               <span className='text-[var(--text-error)]'>
                 This will permanently remove the notification and stop all deliveries.
               </span>{' '}
-              <span className='text-[var(--text-error)]'>This action cannot be undone.</span>
+              This action cannot be undone.
             </p>
           </ModalBody>
           <ModalFooter>

apps/sim/app/workspace/[workspaceId]/scheduled-tasks/scheduled-tasks.tsx

@@ -447,12 +447,12 @@ export function ScheduledTasks() {
         <ModalContent size='sm'>
           <ModalHeader>Delete Scheduled Task</ModalHeader>
           <ModalBody>
-            <p className='text-[var(--text-secondary)] text-caption'>
+            <p className='text-[var(--text-secondary)]'>
               Are you sure you want to delete{' '}
               <span className='font-medium text-[var(--text-primary)]'>
                 {activeTask?.jobTitle || 'this task'}
               </span>
-              ? <span className='text-[var(--text-error)]'>This action cannot be undone.</span>
+              ? This action cannot be undone.
             </p>
           </ModalBody>
           <ModalFooter>