https://lumivo.ai/assets/VektorProjectsPage-DBzJ5xeQ.js

1import{r as o,j as e,L as n}from"./react-core-CtJOhYur.js";import{u as b}from"./useVektorProjects-BiAKHUZm.js";import{F as u}from"./file-plus-2-aMj99Qp6.js";import{S as w}from"./search-B9mm3iZQ.js";import{L as k}from"./layout-grid-BvAGEkDP.js";import{L as S}from"./list-sWqJ74hh.js";import{T as f}from"./trash-2-CCy9xV6P.js";import{f as p}from"./formatDistanceToNow-BEYZE7_f.js";import{d as j}from"./de-C2C2CbzV.js";import"./image-tools-bOCyGMXp.js";import"./index-CPcMczU2.js";import"./radix-Dp6HzbEj.js";import"./supabase-D-PrslnG.js";import"./framer-motion-CdTbmNa9.js";function W(){const{projects:t,loading:c,remove:l}=b(),[d,g]=o.useState(""),[a,N]=o.useState("recent"),[h,m]=o.useState("grid"),v=o.useMemo(()=>{const s=d.trim().toLowerCase(),x=t.filter(r=>!s||r.name.toLowerCase().includes(s));return a==="name"?x.sort((r,i)=>r.name.localeCompare(i.name,"de")):a==="size"&&x.sort((r,i)=>i.width*i.height-r.width*r.height),x},[t,d,a]);return e.jsxs("div",{className:"flex flex-col",children:[e.jsxs("section",{className:"px-6 py-5 flex items-end justify-between gap-6",style:{background:"hsl(var(--v-surface-1))"},children:[e.jsxs("div",{children:[e.jsx("h1",{style:{fontSize:22,fontWeight:500,color:"hsl(var(--v-text-primary))"},children:"Projekte"}),e.jsx("div",{className:"tabular-nums",style:{fontSize:12,color:"hsl(var(--v-text-tertiary))",marginTop:2},children:c?"Lade…":`${t.length} Projekt${t.length===1?"":"e"}`})]}),e.jsxs(n,{to:"/vektor/editor",className:"inline-flex items-center gap-1.5 h-7 px-2.5",style:{background:"hsl(var(--v-accent))",color:"hsl(var(--v-accent-fg))",fontSize:12,fontWeight:600},children:[e.jsx(u,{className:"h-3.5 w-3.5"})," Neues Projekt"]})]}),e.jsxs("div",{className:"px-6 h-10 flex items-center gap-2",style:{background:"hsl(var(--v-surface-1))",borderTop:"1px solid hsl(var(--v-line-default))",borderBottom:"1px solid hsl(var(--v-line-default))"},children:[e.jsxs("div",{className:"flex items-center gap-2 h-7 px-2 w-full sm:w-[280px]",style:{background:"hsl(var(--v-surface-2))",border:"1px solid hsl(var(--v-line-default))"},children:[e.jsx(w,{className:"h-3.5 w-3.5",style:{color:"hsl(var(--v-text-tertiary))"}}),e.jsx("input",{type:"text",value:d,onChange:s=>g(s.target.value),placeholder:"Projekte durchsuchen…",className:"flex-1 bg-transparent outline-none",style:{fontSize:12,color:"hsl(var(--v-text-primary))"}})]}),e.jsxs("div",{className:"ml-auto flex items-center gap-3",children:[e.jsxs("div",{className:"flex items-center gap-1",style:{fontSize:11,color:"hsl(var(--v-text-tertiary))"},children:[e.jsx("span",{className:"uppercase",style:{letterSpacing:"0.06em"},children:"Sortieren"}),e.jsxs("select",{value:a,onChange:s=>N(s.target.value),className:"h-7 px-2 bg-transparent outline-none",style:{fontSize:12,color:"hsl(var(--v-text-primary))",border:"1px solid hsl(var(--v-line-default))"},children:[e.jsx("option",{value:"recent",children:"Zuletzt geändert"}),e.jsx("option",{value:"name",children:"Name (A–Z)"}),e.jsx("option",{value:"size",children:"Größe"})]})]}),e.jsxs("div",{className:"flex",style:{border:"1px solid hsl(var(--v-line-default))"},children:[e.jsx(y,{active:h==="grid",onClick:()=>m("grid"),children:e.jsx(k,{className:"h-3.5 w-3.5"})}),e.jsx(y,{active:h==="list",onClick:()=>m("list"),children:e.jsx(S,{className:"h-3.5 w-3.5"})})]})]})]}),e.jsx("section",{className:"px-6 py-6",children:v.length===0?e.jsx("div",{className:"py-16 text-center",style:{border:"1px dashed hsl(var(--v-line-strong))",color:"hsl(var(--v-text-secondary))",fontSize:12},children:"Keine Projekte gefunden."}):h==="grid"?e.jsx("div",{className:"grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-px",style:{background:"hsl(var(--v-line-default))",border:"1px solid hsl(var(--v-line-default))"},children:v.map(s=>e.jsxs("div",{className:"group flex flex-col",style:{background:"hsl(var(--v-surface-1))"},children:[e.jsx(n,{to:`/vektor/editor/${s.id}`,className:"aspect-[16/10] flex items-center justify-center overflow-hidden",style:{background:"hsl(var(--v-surface-2))"},children:s.thumbnail_url?e.jsx("img",{src:s.thumbnail_url,alt:s.name,className:"w-full h-full object-contain",loading:"lazy"}):e.jsx(u,{className:"h-8 w-8",style:{color:"hsl(var(--v-text-tertiary))",opacity:.4}})}),e.jsxs("div",{className:"flex items-center gap-1 px-3 py-2",style:{borderTop:"1px solid hsl(var(--v-line-subtle))"},children:[e.jsxs(n,{to:`/vektor/editor/${s.id}`,className:"flex-1 min-w-0",children:[e.jsx("div",{className:"font-semibold truncate",style:{fontSize:12,color:"hsl(var(--v-text-primary))"},children:s.name}),e.jsxs("div",{className:"truncate tabular-nums",style:{fontSize:10,

1color:"hsl(var(--v-text-tertiary))"},children:[s.width,"×",s.height," · ",p(new Date(s.updated_at),{addSuffix:!0,locale:j})]})]}),e.jsx("button",{onClick:()=>{confirm(`„${s.name}" löschen?`)&&l(s.id)},className:"opacity-0 group-hover:opacity-100 w-7 h-7 flex items-center justify-center hover:text-destructive shrink-0",style:{color:"hsl(var(--v-text-tertiary))"},"aria-label":"Löschen",children:e.jsx(f,{className:"h-3.5 w-3.5"})})]})]},s.id))}):e.jsx("div",{className:"overflow-x-auto",style:{border:"1px solid hsl(var(--v-line-default))"},children:e.jsxs("div",{className:"min-w-[560px]",children:[e.jsxs("div",{className:"grid grid-cols-[1fr_120px_180px_40px] px-3 h-8 items-center uppercase font-semibold",style:{fontSize:10,letterSpacing:"0.06em",color:"hsl(var(--v-text-secondary))",background:"hsl(var(--v-surface-2))",borderBottom:"1px solid hsl(var(--v-line-default))"},children:[e.jsx("div",{children:"Name"}),e.jsx("div",{className:"tabular-nums",children:"Format"}),e.jsx("div",{children:"Geändert"}),e.jsx("div",{})]}),v.map(s=>e.jsxs("div",{className:"grid grid-cols-[1fr_120px_180px_40px] px-3 h-9 items-center group hover:bg-[hsl(var(--v-surface-2))]",style:{borderBottom:"1px solid hsl(var(--v-line-subtle))"},children:[e.jsx(n,{to:`/vektor/editor/${s.id}`,className:"truncate font-semibold",style:{fontSize:12,color:"hsl(var(--v-text-primary))"},children:s.name}),e.jsxs("div",{className:"tabular-nums",style:{fontSize:11,color:"hsl(var(--v-text-secondary))"},children:[s.width,"×",s.height]}),e.jsx("div",{style:{fontSize:11,color:"hsl(var(--v-text-tertiary))"},children:p(new Date(s.updated_at),{addSuffix:!0,locale:j})}),e.jsx("button",{onClick:()=>{confirm(`„${s.name}" löschen?`)&&l(s.id)},className:"opacity-0 group-hover:opacity-100 w-7 h-7 flex items-center justify-center hover:text-destructive",style:{color:"hsl(var(--v-text-tertiary))"},"aria-label":"Löschen",children:e.jsx(f,{className:"h-3.5 w-3.5"})})]},s.id))]})})})]})}function y({active:t,onClick:c,children:l}){return e.jsx("button",{onClick:c,className:"w-7 h-7 flex items-center justify-center",style:{background:t?"hsl(var(--v-accent-soft))":"transparent",color:t?"hsl(var(--v-accent))":"hsl(var(--v-text-secondary))"},children:l})}export{W as default};