True clean start with src folder

2026-03-10 19:05:37 -05:00
parent 806ebad1c3
commit 5a8b20a827
25 changed files with 3305 additions and 1 deletions
@@ -0,0 +1,68 @@
+import type { Component } from 'solid-js';
+import { createSignal, For, Show } from 'solid-js';
+import { ChevronDown, ChevronRight, AlertCircle } from 'lucide-solid';
+
+interface IgnoredLinesListProps {
+    lines: string[][];
+}
+
+const IgnoredLinesList: Component<IgnoredLinesListProps> = (props) => {
+    const [isOpen, setIsOpen] = createSignal(false);
+
+    return (
+        <div class="bg-card rounded-3xl shadow-premium border border-border overflow-hidden transition-all hover:shadow-elevated">
+            <button
+                onClick={() => setIsOpen(!isOpen())}
+                class="w-full flex items-center justify-between p-6 hover:bg-muted/30 transition-colors text-left"
+            >
+                <div class="flex items-center gap-4">
+                    <div class="p-3 bg-muted rounded-2xl shadow-sm">
+                        <AlertCircle class="w-6 h-6 text-primary" />
+                    </div>
+                    <div>
+                        <h3 class="font-black text-lg text-foreground tracking-tight">Ignored CSV Rows ({props.lines.length})</h3>
+                        <p class="text-[10px] font-bold text-muted-foreground uppercase tracking-wider mt-0.5">Lines that didn't match the extraction rules</p>
+                    </div>
+                </div>
+                <div class="text-muted-foreground/40">
+                    <Show when={isOpen()} fallback={<ChevronRight class="w-5 h-5" />}>
+                        <ChevronDown class="w-5 h-5 transition-transform duration-300 rotate-180" />
+                    </Show>
+                </div>
+            </button>
+
+            <Show when={isOpen()}>
+                <div class="border-t border-border bg-muted/20 p-6 max-h-[500px] overflow-y-auto custom-scrollbar">
+                    <table class="w-full text-left border-collapse">
+                        <thead>
+                            <tr class="text-[10px] font-black uppercase tracking-[0.2em] text-muted-foreground/60 border-b border-border/60">
+                                <th class="pb-3 px-3">Line</th>
+                                <th class="pb-3 px-3">Raw Data</th>
+                            </tr>
+                        </thead>
+                        <tbody class="text-xs text-foreground font-medium">
+                            <For each={props.lines}>
+                                {(row, index) => (
+                                    <tr class="border-b border-border/40 last:border-0 hover:bg-card/50 transition-colors group">
+                                        <td class="py-3 px-3 font-mono text-muted-foreground/40 w-16 text-[10px]">{index() + 1}</td>
+                                        <td class="py-3 px-3 font-mono break-all leading-relaxed text-muted-foreground group-hover:text-foreground">
+                                            {row.join(' | ')}
+                                        </td>
+                                    </tr>
+                                )}
+                            </For>
+                        </tbody>
+                    </table>
+                    <div class="mt-6 flex items-center gap-3 justify-center px-4 py-3 bg-card/50 rounded-2xl border border-border/40 shadow-inner">
+                        <AlertCircle class="w-4 h-4 text-muted-foreground/40" />
+                        <p class="text-[10px] font-bold text-muted-foreground/60 uppercase tracking-wider italic">
+                            These lines were skipped because they don't follow the "Item : Description (Qty)" or "Item : Description" pattern.
+                        </p>
+                    </div>
+                </div>
+            </Show>
+        </div>
+    );
+};
+
+export default IgnoredLinesList;