global fix and add tauri app

2026-06-26 13:56:54 +03:00
parent aa228d84eb
commit 3b05b7e4d4
50 changed files with 3947 additions and 80 deletions
--- a/tauri_app/src/components/mobile-shell.tsx
+++ b/tauri_app/src/components/mobile-shell.tsx
@@ -0,0 +1,76 @@
+import { KeyRound, MessageCircle, ShieldCheck } from 'lucide-react';
+import { cn } from '@/lib/utils';
+
+export type MobileTab = 'chats' | 'totp' | 'security';
+
+const tabs: Array<{ id: MobileTab; label: string; icon: React.ComponentType<{ className?: string }> }> = [
+  { id: 'chats', label: 'Чаты', icon: MessageCircle },
+  { id: 'totp', label: 'Коды', icon: KeyRound },
+  { id: 'security', label: 'Защита', icon: ShieldCheck }
+];
+
+export function MobileShell({
+  activeTab,
+  onTabChange,
+  children
+}: {
+  activeTab: MobileTab;
+  onTabChange: (tab: MobileTab) => void;
+  children: React.ReactNode;
+}) {
+  return (
+    <div className="min-h-screen bg-[#eef1f6] text-[#1f2430]">
+      <div className="mx-auto flex min-h-screen max-w-6xl">
+        <aside className="hidden w-72 border-r border-[#dce3ec] bg-white/80 p-4 backdrop-blur lg:block">
+          <div className="mb-8 rounded-[24px] bg-[#20212b] p-5 text-white shadow-xl">
+            <p className="text-sm text-white/70">Super App</p>
+            <h1 className="mt-1 text-2xl font-semibold">Lendry ID</h1>
+          </div>
+          <nav className="space-y-2">
+            {tabs.map((tab) => {
+              const Icon = tab.icon;
+              return (
+                <button
+                  key={tab.id}
+                  type="button"
+                  className={cn(
+                    'flex w-full items-center gap-3 rounded-2xl px-4 py-3 text-left text-sm font-medium transition',
+                    activeTab === tab.id ? 'bg-[#20212b] text-white' : 'text-[#667085] hover:bg-[#f4f5f8] hover:text-[#1f2430]'
+                  )}
+                  onClick={() => onTabChange(tab.id)}
+                >
+                  <Icon className="h-5 w-5" />
+                  {tab.label}
+                </button>
+              );
+            })}
+          </nav>
+        </aside>
+
+        <main className="min-w-0 flex-1 pb-[88px] lg:pb-0">{children}</main>
+      </div>
+
+      <nav className="safe-bottom fixed inset-x-0 bottom-0 z-50 border-t border-[#dce3ec] bg-white/95 px-4 py-2 shadow-[0_-12px_28px_rgba(31,36,48,0.12)] backdrop-blur lg:hidden">
+        <div className="mx-auto grid max-w-md grid-cols-3 gap-2">
+          {tabs.map((tab) => {
+            const Icon = tab.icon;
+            return (
+              <button
+                key={tab.id}
+                type="button"
+                className={cn(
+                  'flex flex-col items-center gap-1 rounded-2xl px-2 py-2 text-xs font-medium transition',
+                  activeTab === tab.id ? 'bg-[#20212b] text-white' : 'text-[#667085]'
+                )}
+                onClick={() => onTabChange(tab.id)}
+              >
+                <Icon className="h-5 w-5" />
+                {tab.label}
+              </button>
+            );
+          })}
+        </div>
+      </nav>
+    </div>
+  );
+}