feat(start): hamburger toggles start page sidebar, settings accessible from start
This commit is contained in:
@@ -7,6 +7,7 @@ import React from 'react';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useAuthStore } from '@/store/authStore';
|
||||
import { useUIStore } from '@/store/uiStore';
|
||||
import { Settings, HelpCircle, LayoutGrid, ArrowRight, Plus } from 'lucide-react';
|
||||
|
||||
// Workspace tile definition
|
||||
@@ -34,6 +35,7 @@ export function StartPage() {
|
||||
const { t } = useTranslation();
|
||||
const navigate = useNavigate();
|
||||
const user = useAuthStore((state) => state.user);
|
||||
const sidebarOpen = useUIStore((state) => state.sidebarOpen);
|
||||
|
||||
const menuItems = [
|
||||
{ id: 'workspaces', label: 'Workspaces', icon: <LayoutGrid className="w-4 h-4" />, active: true },
|
||||
@@ -43,12 +45,12 @@ export function StartPage() {
|
||||
|
||||
return (
|
||||
<div className="flex h-full overflow-hidden bg-secondary-50">
|
||||
{/* Left column — menu */}
|
||||
<aside className="w-56 bg-white border-r border-secondary-200 flex flex-col flex-shrink-0">
|
||||
<div className="h-[58px] flex items-center px-4 border-b border-secondary-200">
|
||||
{/* Left column — menu (toggleable via hamburger) */}
|
||||
<aside className={`${sidebarOpen ? 'w-56' : 'w-0'} bg-white border-r border-secondary-200 flex flex-col flex-shrink-0 transition-all duration-200 overflow-hidden`}>
|
||||
<div className="h-[58px] flex items-center px-4 border-b border-secondary-200 w-56 flex-shrink-0">
|
||||
<span className="text-xl font-bold text-secondary-900">leocrm</span>
|
||||
</div>
|
||||
<nav className="flex-1 overflow-y-auto py-4">
|
||||
<nav className="flex-1 overflow-y-auto py-4 w-56 flex-shrink-0">
|
||||
<ul className="space-y-1 px-2">
|
||||
{menuItems.map((item) => (
|
||||
<li key={item.id}>
|
||||
@@ -68,7 +70,7 @@ export function StartPage() {
|
||||
</ul>
|
||||
</nav>
|
||||
{/* User info at bottom */}
|
||||
<div className="px-4 py-3 border-t border-secondary-200">
|
||||
<div className="px-4 py-3 border-t border-secondary-200 w-56 flex-shrink-0">
|
||||
<p className="text-xs text-secondary-500 truncate">{user?.email}</p>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
Reference in New Issue
Block a user