ai-organizer-ui-consolidation
Build a unified, ADHD-friendly web UI that consolidates 70+ CLI tools into a beautiful liquid glass interface for the AI File Organizer. Use when creating the complete frontend application that replaces all terminal interactions with a macOS-inspired dashboard for file
Installation
Pick a client and clone the repository into its skills directory.
Installation
About this skill
Build a unified, ADHD-friendly web UI that consolidates 70+ CLI tools into a beautiful liquid glass interface for the AI File Organizer. Use when creating the complete frontend application that replaces all terminal interactions with a macOS-inspired dashboard for file organization, search, VEO prompts, and system management.
How to use
Zainstaluj skill w swoim projekcie Claude/Codex, wskazując repozytorium https://github.com/thebearwithabite/ai-file-organizer/tree/master/.claude/skills/ai-organizer-ui-consolidation jako źródło.
Przygotuj środowisko React 18 z Vite, Tailwind CSS, ShadCN UI, TanStack Query i Framer Motion — są to wymagane biblioteki do implementacji designu liquid glass i interakcji ADHD-friendly.
Użyj skilla do wygenerowania struktury komponentów dashboardu, który zastąpi wszystkie interakcje terminalowe. Skill zawiera design tokens dla frosted glass aesthetic (blur, kolory akcentów, przezroczystość) — zastosuj je w swoich kartach i panelach.
Zaimplementuj główne sekcje interfejsu: organizacja plików (drag-and-drop), wyszukiwanie zawartości, zarządzanie promptami VEO oraz kontrola ustawień systemu — wszystkie w jednym miejscu bez przełączania kontekstu.
Integruj wyniki z usług backendowych (Python CLI tools) poprzez REST API. Skill opisuje, jak konsolidować 31 415 linii kodu Pythona w serwisy, które frontend będzie konsumować.
Dodaj systemy rollback i undo dla operacji na plikach, aby użytkownik mógł bezpiecznie eksperymentować. Skill zawiera wytyczne do implementacji tych funkcji w React.