feat: atalhos de navegação Q/E e correções no i18n

2026-06-03 16:55:01 +01:00
parent 0a4de43635
commit 1930190c8d
10 changed files with 700 additions and 314 deletions
--- a/add_shortcuts.cjs
+++ b/add_shortcuts.cjs
@@ -0,0 +1,118 @@
+const fs = require('fs');
+
+let content = fs.readFileSync('src/App.jsx', 'utf8');
+
+// 1. State
+content = content.replace(
+    /const \[isPrivate, setIsPrivate\] = useState\(false\);/,
+    `const [isPrivate, setIsPrivate] = useState(false);\n    const [shortcutsEnabled, setShortcutsEnabled] = useState(false);`
+);
+
+// 2. Toggle and Nav handle
+const toggleInsert = `
+    const handlePrivacyToggle = (newVal) => {
+        setIsPrivate(newVal);
+        saveUserSetting('isPrivate', newVal);
+    };
+
+    const handleShortcutsToggle = (newVal) => {
+        setShortcutsEnabled(newVal);
+        saveUserSetting('shortcutsEnabled', newVal);
+    };
+
+    const handleNavShortcut = (direction) => {
+        const navItems = ['dashboard', 'closet', 'wishlist', 'laundry', 'outfits', 'planner', 'community', 'settings'];
+        const currentIndex = navItems.indexOf(view);
+        if (currentIndex === -1) return;
+        
+        let nextIndex;
+        if (direction === 'up') {
+            nextIndex = currentIndex === 0 ? navItems.length - 1 : currentIndex - 1;
+        } else {
+            nextIndex = currentIndex === navItems.length - 1 ? 0 : currentIndex + 1;
+        }
+        setView(navItems[nextIndex]);
+        if (window.innerWidth < 768) setSidebarOpen(false);
+    };
+`;
+
+content = content.replace(
+    /const handlePrivacyToggle = \(newVal\) => \{[\s\S]*?saveUserSetting\('isPrivate', newVal\);\n    \};/,
+    toggleInsert.trim()
+);
+
+// 3. Load from Firebase
+content = content.replace(
+    /if \(data\.settings\.isPrivate !== undefined\) setIsPrivate\(data\.settings\.isPrivate\);/,
+    `if (data.settings.isPrivate !== undefined) setIsPrivate(data.settings.isPrivate);\n                    if (data.settings.shortcutsEnabled !== undefined) setShortcutsEnabled(data.settings.shortcutsEnabled);`
+);
+
+// 4. UseEffect
+const useEffectInsert = `
+    useEffect(() => {
+        if (!shortcutsEnabled) return;
+
+        const handleKeyDown = (e) => {
+            if (e.target.tagName === 'INPUT' || e.target.tagName === 'TEXTAREA') return;
+
+            if (e.key.toLowerCase() === 'q') {
+                handleNavShortcut('up');
+            } else if (e.key.toLowerCase() === 'e') {
+                handleNavShortcut('down');
+            }
+        };
+
+        window.addEventListener('keydown', handleKeyDown);
+        return () => window.removeEventListener('keydown', handleKeyDown);
+    }, [shortcutsEnabled, view]);
+
+    useEffect(() => {
+        if (editingItem && editingItem.color) {`;
+
+content = content.replace(
+    /useEffect\(\(\) => \{\n        if \(editingItem && editingItem\.color\) \{/,
+    useEffectInsert.trim()
+);
+
+// 5. Settings UI
+const settingsUI = `
+                                        <div className="flex items-center justify-between">
+                                            <div>
+                                                <p className="font-bold text-inherit flex items-center gap-2">Atalhos de Teclado</p>
+                                                <p className="text-[10px] uppercase tracking-widest opacity-50 text-inherit">Ativar navegação com Q e E</p>
+                                            </div>
+                                            <button onClick={() => handleShortcutsToggle(!shortcutsEnabled)} className={\`w-14 h-8 rounded-full transition-colors relative \${shortcutsEnabled ? 'bg-primary-600' : 'bg-gray-200'}\`}>
+                                                <div className={\`w-6 h-6 rounded-full bg-white absolute top-1 transition-all \${shortcutsEnabled ? 'left-7' : 'left-1'}\`}></div>
+                                            </button>
+                                        </div>
+`;
+content = content.replace(
+    /(<div className="flex items-center justify-between">[\s\S]*?t\('lookReminders'\)}<\/p>[\s\S]*?<\/div>[\s\S]*?<\/button>[\s\S]*?<\/div>)/,
+    `$1\n${settingsUI}`
+);
+
+// 6. Sidebar UI Top
+const sidebarTop = `
+                    {shortcutsEnabled && (
+                        <button onClick={() => handleNavShortcut('up')} className="w-full flex items-center justify-center gap-2 p-2 bg-gray-100 dark:bg-gray-800 rounded-xl mb-3 text-xs font-bold hover:bg-gray-200 dark:hover:bg-gray-700 transition-colors">
+                            <span className="px-2 py-1 bg-white dark:bg-gray-900 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700">Q</span> Cima
+                        </button>
+                    )}
+                    <nav className="flex-1 space-y-3">
+`;
+content = content.replace(/<nav className="flex-1 space-y-3">/, sidebarTop.trim());
+
+// 7. Sidebar UI Bottom
+const sidebarBottom = `
+                        ))}
+                    </nav>
+                    {shortcutsEnabled && (
+                        <button onClick={() => handleNavShortcut('down')} className="w-full flex items-center justify-center gap-2 p-2 bg-gray-100 dark:bg-gray-800 rounded-xl mt-3 text-xs font-bold hover:bg-gray-200 dark:hover:bg-gray-700 transition-colors">
+                            <span className="px-2 py-1 bg-white dark:bg-gray-900 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700">E</span> Baixo
+                        </button>
+                    )}
+`;
+content = content.replace(/ \}\)\}\n                    <\/nav>/, sidebarBottom.trim());
+
+fs.writeFileSync('src/App.jsx', content);
+console.log('Shortcuts feature added successfully.');