Initial commit: Meshkee dashboards monorepo.

Includes business, customer, and super-admin apps with shared packages and production deploy scripts. Co-authored-by: Cursor <cursoragent@cursor.com>
2026-07-22 13:48:53 +03:30
commit f566387c61
509 changed files with 62690 additions and 0 deletions
@@ -0,0 +1,86 @@
+import { useEffect, useState } from 'react'
+import { AlertTriangle, X } from 'lucide-react'
+import styles from './ConfirmDeleteModal.module.css'
+
+interface ConfirmDeleteModalProps {
+  open: boolean
+  title: string
+  message: string
+  onConfirm: () => void
+  onCancel: () => void
+}
+
+const ANIMATION_MS = 220
+
+export function ConfirmDeleteModal({
+  open,
+  title,
+  message,
+  onConfirm,
+  onCancel,
+}: ConfirmDeleteModalProps) {
+  const [mounted, setMounted] = useState(open)
+  const [closing, setClosing] = useState(false)
+
+  useEffect(() => {
+    if (open) {
+      setMounted(true)
+      setClosing(false)
+    } else if (mounted) {
+      setClosing(true)
+      const timer = setTimeout(() => {
+        setMounted(false)
+        setClosing(false)
+      }, ANIMATION_MS)
+      return () => clearTimeout(timer)
+    }
+  }, [open, mounted])
+
+  useEffect(() => {
+    if (!mounted || closing) return
+    const onKey = (e: KeyboardEvent) => {
+      if (e.key === 'Escape') onCancel()
+    }
+    document.addEventListener('keydown', onKey)
+    return () => document.removeEventListener('keydown', onKey)
+  }, [mounted, closing, onCancel])
+
+  if (!mounted) return null
+
+  return (
+    <div
+      className={`${styles.overlay} ${closing ? styles.overlayOut : styles.overlayIn}`}
+      onClick={onCancel}
+    >
+      <div
+        className={`${styles.modal} ${closing ? styles.modalOut : styles.modalIn}`}
+        onClick={(e) => e.stopPropagation()}
+        role="alertdialog"
+        aria-modal="true"
+        aria-labelledby="confirm-delete-title"
+      >
+        <div className={styles.iconWrap}>
+          <AlertTriangle size={28} />
+        </div>
+
+        <h3 id="confirm-delete-title" className={styles.title}>
+          {title}
+        </h3>
+        <p className={styles.message}>{message}</p>
+
+        <div className={styles.actions}>
+          <button type="button" className={styles.cancelBtn} onClick={onCancel}>
+            Cancel
+          </button>
+          <button type="button" className={styles.deleteBtn} onClick={onConfirm}>
+            Delete
+          </button>
+        </div>
+
+        <button className={styles.closeBtn} onClick={onCancel} aria-label="Close">
+          <X size={18} />
+        </button>
+      </div>
+    </div>
+  )
+}