6.20.0: Копирование задач и меню действий

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

play-life-web/src/components/TaskForm.jsx

@@ -3,7 +3,7 @@ import { createPortal } from 'react-dom'
 import { useAuth } from './auth/AuthContext'
 import Toast from './Toast'
 import SubmitButton from './SubmitButton'
-import DeleteButton from './DeleteButton'
+import './Wishlist.css'
 import './TaskForm.css'
 
 const API_URL = '/api/tasks'
@@ -27,6 +27,9 @@ function TaskForm({ onNavigate, taskId, wishlistId, returnTo, returnWishlistId,
   const [toastMessage, setToastMessage] = useState(null)
   const [loadingTask, setLoadingTask] = useState(false)
   const [isDeleting, setIsDeleting] = useState(false)
+  const [isCopying, setIsCopying] = useState(false)
+  const [showActionMenu, setShowActionMenu] = useState(false)
+  const actionMenuHistoryRef = useRef(false)
   const [wishlistInfo, setWishlistInfo] = useState(null) // Информация о связанном желании
   const [currentWishlistId, setCurrentWishlistId] = useState(null) // Текущий wishlist_id задачи
   const [rewardPolicy, setRewardPolicy] = useState('general') // Политика награждения: 'personal' или 'general'
@@ -859,11 +862,43 @@ function TaskForm({ onNavigate, taskId, wishlistId, returnTo, returnWishlistId,
     }
   }
 
+  const openActionMenu = () => {
+    setShowActionMenu(true)
+    window.history.pushState({ actionMenu: true }, '')
+    actionMenuHistoryRef.current = true
+  }
+
+  const closeActionMenu = () => {
+    setShowActionMenu(false)
+    if (actionMenuHistoryRef.current) {
+      actionMenuHistoryRef.current = false
+      window.history.back()
+    }
+  }
+
+  // Обработка popstate для закрытия action menu кнопкой назад
+  useEffect(() => {
+    const handlePopState = (e) => {
+      if (showActionMenu) {
+        actionMenuHistoryRef.current = false
+        setShowActionMenu(false)
+      }
+    }
+    window.addEventListener('popstate', handlePopState)
+    return () => window.removeEventListener('popstate', handlePopState)
+  }, [showActionMenu])
+
   const handleDelete = async () => {
     if (!taskId) return
 
-    if (!window.confirm(`Вы уверены, что хотите удалить задачу "${name}"?`)) {
-      return
+    setShowActionMenu(false)
+    // Убираем запись action menu из истории + закрываем экран редактирования
+    if (actionMenuHistoryRef.current) {
+      actionMenuHistoryRef.current = false
+      // go(-2): action menu + task form
+      window.history.go(-2)
+    } else {
+      window.history.back()
     }
 
     setIsDeleting(true)
@@ -875,13 +910,35 @@ function TaskForm({ onNavigate, taskId, wishlistId, returnTo, returnWishlistId,
       if (!response.ok) {
         throw new Error('Ошибка при удалении задачи')
       }
-
-      // Возвращаемся к списку задач
-      onNavigate?.('tasks')
     } catch (err) {
       console.error('Error deleting task:', err)
-      setToastMessage({ text: err.message || 'Ошибка при удалении задачи', type: 'error' })
-      setIsDeleting(false)
+    }
+  }
+
+  const handleCopy = async () => {
+    if (!taskId) return
+
+    setShowActionMenu(false)
+    // Убираем запись action menu из истории + закрываем экран редактирования
+    if (actionMenuHistoryRef.current) {
+      actionMenuHistoryRef.current = false
+      window.history.go(-2)
+    } else {
+      window.history.back()
+    }
+
+    setIsCopying(true)
+    try {
+      const response = await authFetch(`${API_URL}/${taskId}/copy`, {
+        method: 'POST',
+      })
+
+      if (!response.ok) {
+        const errorText = await response.text().catch(() => '')
+        throw new Error(errorText || 'Ошибка при копировании задачи')
+      }
+    } catch (err) {
+      console.error('Error copying task:', err)
     }
   }
 
@@ -1443,16 +1500,57 @@ function TaskForm({ onNavigate, taskId, wishlistId, returnTo, returnWishlistId,
         {loading ? 'Сохранение...' : 'Сохранить'}
       </button>
       {taskId && (
-        <DeleteButton
-          onClick={handleDelete}
-          loading={isDeleting}
-          disabled={loading}
-          title="Удалить задачу"
-        />
+        <button
+          type="button"
+          onClick={openActionMenu}
+          disabled={loading || isDeleting || isCopying}
+          style={{
+            width: '52px',
+            height: '52px',
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'center',
+            background: 'transparent',
+            color: '#059669',
+            border: '2px solid #059669',
+            borderRadius: '0.5rem',
+            fontSize: '1.25rem',
+            fontWeight: 700,
+            cursor: (loading || isDeleting || isCopying) ? 'not-allowed' : 'pointer',
+            lineHeight: 1,
+            flexShrink: 0,
+            padding: 0,
+            boxSizing: 'border-box',
+            transition: 'all 0.2s',
+          }}
+          title="Действия"
+        >
+          ⋮
+        </button>
       )}
     </div>,
     document.body
   ) : null}
+  {showActionMenu && createPortal(
+    <div className="wishlist-modal-overlay" style={{ zIndex: 2000 }} onClick={closeActionMenu}>
+      <div className="wishlist-modal" onClick={(e) => e.stopPropagation()}>
+        <div className="wishlist-modal-header">
+          <h3>{name}</h3>
+        </div>
+        <div className="wishlist-modal-actions">
+          {!currentWishlistId && (
+            <button className="wishlist-modal-copy" onClick={handleCopy}>
+              Копировать
+            </button>
+          )}
+          <button className="wishlist-modal-delete" onClick={handleDelete}>
+            Удалить
+          </button>
+        </div>
+      </div>
+    </div>,
+    document.body
+  )}
   </>
   )
 }