style: run prettier on entire codebase

src/admin/pages/Projects.tsx

@@ -1,107 +1,134 @@
-import { useState } from 'react'
-import { useAlert } from '../context/AlertContext'
-import { useAuth } from '../context/AuthContext'
-import { Link } from 'react-router-dom'
-import Forbidden from '../components/Forbidden'
-import { motion } from 'framer-motion'
-import ConfirmModal from '../components/ConfirmModal'
+import { useState } from "react";
+import { useAlert } from "../context/AlertContext";
+import { useAuth } from "../context/AuthContext";
+import { Link } from "react-router-dom";
+import Forbidden from "../components/Forbidden";
+import { motion } from "framer-motion";
+import ConfirmModal from "../components/ConfirmModal";
 
-import apiFetch from '../utils/api'
-import { formatDate, czechPlural } from '../utils/formatters'
-import SortIcon from '../components/SortIcon'
-import useTableSort from '../hooks/useTableSort'
-import useListData from '../hooks/useListData'
-import Pagination from '../components/Pagination'
+import apiFetch from "../utils/api";
+import { formatDate, czechPlural } from "../utils/formatters";
+import SortIcon from "../components/SortIcon";
+import useTableSort from "../hooks/useTableSort";
+import useListData from "../hooks/useListData";
+import Pagination from "../components/Pagination";
 
-const API_BASE = '/api/admin'
+const API_BASE = "/api/admin";
 
 const STATUS_LABELS: Record<string, string> = {
-  aktivni: 'Aktivní',
-  dokonceny: 'Dokončený',
-  zruseny: 'Zrušený'
-}
+  aktivni: "Aktivní",
+  dokonceny: "Dokončený",
+  zruseny: "Zrušený",
+};
 
 const STATUS_CLASSES: Record<string, string> = {
-  aktivni: 'admin-badge-project-aktivni',
-  dokonceny: 'admin-badge-project-dokonceny',
-  zruseny: 'admin-badge-project-zruseny'
-}
+  aktivni: "admin-badge-project-aktivni",
+  dokonceny: "admin-badge-project-dokonceny",
+  zruseny: "admin-badge-project-zruseny",
+};
 
 interface Project {
-  id: number
-  project_number: string
-  name: string
-  customer_name: string
-  responsible_user_name: string
-  status: string
-  start_date: string
-  end_date: string
-  order_id?: number
-  order_number?: string
+  id: number;
+  project_number: string;
+  name: string;
+  customer_name: string;
+  responsible_user_name: string;
+  status: string;
+  start_date: string;
+  end_date: string;
+  order_id?: number;
+  order_number?: string;
 }
 
 export default function Projects() {
-  const alert = useAlert()
-  const { hasPermission } = useAuth()
+  const alert = useAlert();
+  const { hasPermission } = useAuth();
 
-  const { sort, order, handleSort, activeSort } = useTableSort('project_number')
-  const [search, setSearch] = useState('')
-  const [page, setPage] = useState(1)
-  const [deletingId, setDeletingId] = useState<number | null>(null)
-  const [deleteTarget, setDeleteTarget] = useState<Project | null>(null)
-  const [deleteFiles, setDeleteFiles] = useState(false)
+  const { sort, order, handleSort, activeSort } =
+    useTableSort("project_number");
+  const [search, setSearch] = useState("");
+  const [page, setPage] = useState(1);
+  const [deletingId, setDeletingId] = useState<number | null>(null);
+  const [deleteTarget, setDeleteTarget] = useState<Project | null>(null);
+  const [deleteFiles, setDeleteFiles] = useState(false);
 
-  const { items: projects, setItems: setProjects, loading, initialLoad, pagination } = useListData<Project>('projects', {
-    search, sort, order, page,
-    errorMsg: 'Nepodařilo se načíst projekty'
-  })
+  const {
+    items: projects,
+    setItems: setProjects,
+    loading,
+    initialLoad,
+    pagination,
+  } = useListData<Project>("projects", {
+    search,
+    sort,
+    order,
+    page,
+    errorMsg: "Nepodařilo se načíst projekty",
+  });
 
-  if (!hasPermission('projects.view')) return <Forbidden />
+  if (!hasPermission("projects.view")) return <Forbidden />;
 
   const handleDelete = async () => {
-    if (!deleteTarget) return
-    setDeletingId(deleteTarget.id)
+    if (!deleteTarget) return;
+    setDeletingId(deleteTarget.id);
     try {
       const res = await apiFetch(`${API_BASE}/projects/${deleteTarget.id}`, {
-        method: 'DELETE',
-        headers: { 'Content-Type': 'application/json' },
+        method: "DELETE",
+        headers: { "Content-Type": "application/json" },
         body: JSON.stringify({ delete_files: deleteFiles }),
-      })
-      const data = await res.json()
+      });
+      const data = await res.json();
       if (data.success) {
-        alert.success(data.message || 'Projekt byl smazán')
-        setProjects((prev: Project[]) => prev.filter(p => p.id !== deleteTarget.id))
+        alert.success(data.message || "Projekt byl smazán");
+        setProjects((prev: Project[]) =>
+          prev.filter((p) => p.id !== deleteTarget.id),
+        );
       } else {
-        alert.error(data.error || 'Nepodařilo se smazat projekt')
+        alert.error(data.error || "Nepodařilo se smazat projekt");
       }
     } catch {
-      alert.error('Chyba připojení')
+      alert.error("Chyba připojení");
     } finally {
-      setDeletingId(null)
-      setDeleteTarget(null)
-      setDeleteFiles(false)
+      setDeletingId(null);
+      setDeleteTarget(null);
+      setDeleteFiles(false);
     }
-  }
+  };
 
   if (initialLoad) {
     return (
       <div>
-        <div className="admin-skeleton" style={{ padding: 0, gap: '1.5rem' }}>
-          <div className="admin-skeleton-row" style={{ justifyContent: 'space-between' }}>
+        <div className="admin-skeleton" style={{ padding: 0, gap: "1.5rem" }}>
+          <div
+            className="admin-skeleton-row"
+            style={{ justifyContent: "space-between" }}
+          >
             <div>
-              <div className="admin-skeleton-line h-8" style={{ width: '200px', marginBottom: '0.5rem' }} />
-              <div className="admin-skeleton-line" style={{ width: '140px' }} />
+              <div
+                className="admin-skeleton-line h-8"
+                style={{ width: "200px", marginBottom: "0.5rem" }}
+              />
+              <div className="admin-skeleton-line" style={{ width: "140px" }} />
             </div>
-            <div className="admin-skeleton-line h-10" style={{ width: '140px', borderRadius: '8px' }} />
+            <div
+              className="admin-skeleton-line h-10"
+              style={{ width: "140px", borderRadius: "8px" }}
+            />
           </div>
           <div className="admin-card">
-            <div className="admin-skeleton" style={{ gap: '1.25rem' }}>
-              {[0, 1, 2, 3, 4].map(i => (
+            <div className="admin-skeleton" style={{ gap: "1.25rem" }}>
+              {[0, 1, 2, 3, 4].map((i) => (
                 <div key={i} className="admin-skeleton-row">
                   <div className="admin-skeleton-line circle" />
                   <div className="flex-1">
-                    <div className="admin-skeleton-line w-1/3" style={{ marginBottom: '0.5rem' }} />
-                    <div className="admin-skeleton-line w-1/4" style={{ height: '10px' }} />
+                    <div
+                      className="admin-skeleton-line w-1/3"
+                      style={{ marginBottom: "0.5rem" }}
+                    />
+                    <div
+                      className="admin-skeleton-line w-1/4"
+                      style={{ height: "10px" }}
+                    />
                   </div>
                   <div className="admin-skeleton-line w-1/4" />
                 </div>
@@ -110,7 +137,7 @@ export default function Projects() {
           </div>
         </div>
       </div>
-    )
+    );
   }
 
   return (
@@ -124,12 +151,25 @@ export default function Projects() {
         <div>
           <h1 className="admin-page-title">Projekty</h1>
           <p className="admin-page-subtitle">
-            {pagination?.total ?? projects.length} {czechPlural(pagination?.total ?? projects.length, 'projekt', 'projekty', 'projektů')}
+            {pagination?.total ?? projects.length}{" "}
+            {czechPlural(
+              pagination?.total ?? projects.length,
+              "projekt",
+              "projekty",
+              "projektů",
+            )}
           </p>
         </div>
-        {hasPermission('projects.create') && (
+        {hasPermission("projects.create") && (
           <Link to="/projects/new" className="admin-btn admin-btn-primary">
-            <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
+            <svg
+              width="20"
+              height="20"
+              viewBox="0 0 24 24"
+              fill="none"
+              stroke="currentColor"
+              strokeWidth="2"
+            >
               <line x1="12" y1="5" x2="12" y2="19" />
               <line x1="5" y1="12" x2="19" y2="12" />
             </svg>
@@ -143,14 +183,17 @@ export default function Projects() {
         initial={{ opacity: 0, y: 12 }}
         animate={{ opacity: 1, y: 0 }}
         transition={{ duration: 0.25, delay: 0.06 }}
-        style={{ opacity: loading ? 0.6 : 1, transition: 'opacity 0.2s' }}
+        style={{ opacity: loading ? 0.6 : 1, transition: "opacity 0.2s" }}
       >
         <div className="admin-card-body">
           <div className="admin-search-bar mb-4">
             <input
               type="text"
               value={search}
-              onChange={(e) => { setSearch(e.target.value); setPage(1) }}
+              onChange={(e) => {
+                setSearch(e.target.value);
+                setPage(1);
+              }}
               className="admin-form-input"
               placeholder="Hledat podle čísla, názvu nebo zákazníka..."
             />
@@ -159,13 +202,25 @@ export default function Projects() {
           {projects.length === 0 ? (
             <div className="admin-empty-state">
               <div className="admin-empty-icon">
-                <svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round">
+                <svg
+                  width="28"
+                  height="28"
+                  viewBox="0 0 24 24"
+                  fill="none"
+                  stroke="currentColor"
+                  strokeWidth="1.5"
+                  strokeLinecap="round"
+                  strokeLinejoin="round"
+                >
                   <path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z" />
                 </svg>
               </div>
               <p>Zatím nejsou žádné projekty.</p>
-              <p style={{ color: 'var(--text-tertiary)', fontSize: '0.875rem' }}>
-                Vytvořte první projekt tlačítkem výše nebo automaticky při vytvoření objednávky.
+              <p
+                style={{ color: "var(--text-tertiary)", fontSize: "0.875rem" }}
+              >
+                Vytvořte první projekt tlačítkem výše nebo automaticky při
+                vytvoření objednávky.
               </p>
             </div>
           ) : (
@@ -173,22 +228,58 @@ export default function Projects() {
               <table className="admin-table">
                 <thead>
                   <tr>
-                    <th style={{ cursor: 'pointer' }} onClick={() => handleSort('project_number')}>
-                      Číslo <SortIcon column="project_number" sort={activeSort} order={order} />
+                    <th
+                      style={{ cursor: "pointer" }}
+                      onClick={() => handleSort("project_number")}
+                    >
+                      Číslo{" "}
+                      <SortIcon
+                        column="project_number"
+                        sort={activeSort}
+                        order={order}
+                      />
                     </th>
-                    <th style={{ cursor: 'pointer' }} onClick={() => handleSort('name')}>
-                      Název <SortIcon column="name" sort={activeSort} order={order} />
+                    <th
+                      style={{ cursor: "pointer" }}
+                      onClick={() => handleSort("name")}
+                    >
+                      Název{" "}
+                      <SortIcon column="name" sort={activeSort} order={order} />
                     </th>
                     <th>Zákazník</th>
                     <th>Zodpovědná osoba</th>
-                    <th style={{ cursor: 'pointer' }} onClick={() => handleSort('status')}>
-                      Stav <SortIcon column="status" sort={activeSort} order={order} />
+                    <th
+                      style={{ cursor: "pointer" }}
+                      onClick={() => handleSort("status")}
+                    >
+                      Stav{" "}
+                      <SortIcon
+                        column="status"
+                        sort={activeSort}
+                        order={order}
+                      />
                     </th>
-                    <th style={{ cursor: 'pointer' }} onClick={() => handleSort('start_date')}>
-                      Začátek <SortIcon column="start_date" sort={activeSort} order={order} />
+                    <th
+                      style={{ cursor: "pointer" }}
+                      onClick={() => handleSort("start_date")}
+                    >
+                      Začátek{" "}
+                      <SortIcon
+                        column="start_date"
+                        sort={activeSort}
+                        order={order}
+                      />
                     </th>
-                    <th style={{ cursor: 'pointer' }} onClick={() => handleSort('end_date')}>
-                      Konec <SortIcon column="end_date" sort={activeSort} order={order} />
+                    <th
+                      style={{ cursor: "pointer" }}
+                      onClick={() => handleSort("end_date")}
+                    >
+                      Konec{" "}
+                      <SortIcon
+                        column="end_date"
+                        sort={activeSort}
+                        order={order}
+                      />
                     </th>
                     <th>Objednávka</th>
                     <th>Akce</th>
@@ -202,11 +293,13 @@ export default function Projects() {
                           {p.project_number}
                         </Link>
                       </td>
-                      <td className="fw-500">{p.name || '—'}</td>
-                      <td>{p.customer_name || '—'}</td>
-                      <td>{p.responsible_user_name || '—'}</td>
+                      <td className="fw-500">{p.name || "—"}</td>
+                      <td>{p.customer_name || "—"}</td>
+                      <td>{p.responsible_user_name || "—"}</td>
                       <td>
-                        <span className={`admin-badge ${STATUS_CLASSES[p.status] || ''}`}>
+                        <span
+                          className={`admin-badge ${STATUS_CLASSES[p.status] || ""}`}
+                        >
                           {STATUS_LABELS[p.status] || p.status}
                         </span>
                       </td>
@@ -214,20 +307,38 @@ export default function Projects() {
                       <td className="admin-mono">{formatDate(p.end_date)}</td>
                       <td>
                         {p.order_id ? (
-                          <Link to={`/orders/${p.order_id}`} className="text-secondary" style={{ textDecoration: 'none' }}>
+                          <Link
+                            to={`/orders/${p.order_id}`}
+                            className="text-secondary"
+                            style={{ textDecoration: "none" }}
+                          >
                             {p.order_number}
                           </Link>
-                        ) : '—'}
+                        ) : (
+                          "—"
+                        )}
                       </td>
                       <td>
                         <div className="admin-table-actions">
-                          <Link to={`/projects/${p.id}`} className="admin-btn-icon" title="Upravit" aria-label="Upravit">
-                            <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
+                          <Link
+                            to={`/projects/${p.id}`}
+                            className="admin-btn-icon"
+                            title="Upravit"
+                            aria-label="Upravit"
+                          >
+                            <svg
+                              width="18"
+                              height="18"
+                              viewBox="0 0 24 24"
+                              fill="none"
+                              stroke="currentColor"
+                              strokeWidth="2"
+                            >
                               <path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7" />
                               <path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z" />
                             </svg>
                           </Link>
-                          {!p.order_id && hasPermission('projects.create') && (
+                          {!p.order_id && hasPermission("projects.create") && (
                             <button
                               onClick={() => setDeleteTarget(p)}
                               className="admin-btn-icon danger"
@@ -237,7 +348,14 @@ export default function Projects() {
                               {deletingId === p.id ? (
                                 <div className="admin-spinner admin-spinner-sm" />
                               ) : (
-                                <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
+                                <svg
+                                  width="18"
+                                  height="18"
+                                  viewBox="0 0 24 24"
+                                  fill="none"
+                                  stroke="currentColor"
+                                  strokeWidth="2"
+                                >
                                   <polyline points="3 6 5 6 21 6" />
                                   <path d="M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6" />
                                   <path d="M10 11v6M14 11v6" />
@@ -260,15 +378,18 @@ export default function Projects() {
       <ConfirmModal
         isOpen={!!deleteTarget}
         onClose={() => {
-          setDeleteTarget(null)
-          setDeleteFiles(false)
+          setDeleteTarget(null);
+          setDeleteFiles(false);
         }}
         onConfirm={handleDelete}
         title="Smazat projekt"
         message={
           <>
             Opravdu chcete smazat projekt {deleteTarget?.project_number}?
-            <label className="admin-form-checkbox" style={{ marginTop: '1rem', display: 'flex' }}>
+            <label
+              className="admin-form-checkbox"
+              style={{ marginTop: "1rem", display: "flex" }}
+            >
               <input
                 type="checkbox"
                 checked={deleteFiles}
@@ -283,5 +404,5 @@ export default function Projects() {
         loading={!!deletingId}
       />
     </div>
-  )
+  );
 }