Simplify sidebar: show sprint info and project list only

This commit is contained in:
OpenClaw Bot 2026-02-19 18:53:26 -06:00
parent dd1c65453a
commit c9d48c323d

View File

@ -168,82 +168,53 @@ export default function Home() {
<div className="max-w-[1800px] mx-auto px-4 py-4 md:py-6">
<div className="flex flex-col lg:flex-row gap-4 lg:gap-6">
{/* Sidebar - Projects */}
{/* Sidebar - Sprint Info */}
<aside className="w-full lg:w-64 shrink-0">
<Card className="bg-slate-900 border-slate-800">
<CardHeader className="pb-3">
<CardTitle className="text-sm font-semibold text-slate-400 uppercase tracking-wider">
Current Sprint
</CardTitle>
</CardHeader>
<CardContent className="space-y-3">
{currentSprint ? (
<>
<div>
<h3 className="font-medium text-white">{currentSprint.name}</h3>
<p className="text-sm text-slate-400">
{new Date(currentSprint.startDate).toLocaleDateString()} - {new Date(currentSprint.endDate).toLocaleDateString()}
</p>
</div>
<div className="flex items-center gap-4 text-sm">
<span className="text-slate-400">
<strong className="text-white">{sprintTasks.length}</strong> tasks
</span>
<span className="text-slate-400">
<strong className="text-white">{sprintTasks.filter(t => t.status === 'done').length}</strong> done
</span>
</div>
</>
) : (
<p className="text-sm text-slate-500">No active sprint</p>
)}
</CardContent>
</Card>
{/* Projects Quick View */}
<Card className="bg-slate-900 border-slate-800 mt-4">
<CardHeader className="pb-3">
<CardTitle className="text-sm font-semibold text-slate-400 uppercase tracking-wider">
Projects
</CardTitle>
</CardHeader>
<CardContent className="space-y-1">
<CardContent className="space-y-2">
{projects.map((project) => (
<button
key={project.id}
onClick={() => selectProject(project.id)}
className={`w-full flex items-center gap-3 px-3 py-2 rounded-lg text-left transition-colors ${
selectedProjectId === project.id
? "bg-slate-800 text-white"
: "text-slate-400 hover:bg-slate-800/50 hover:text-slate-200"
}`}
>
<div key={project.id} className="flex items-center gap-2 text-sm">
<div
className="w-3 h-3 rounded-full"
className="w-2 h-2 rounded-full"
style={{ backgroundColor: project.color }}
/>
<span className="flex-1 truncate">{project.name}</span>
<span className="text-xs text-slate-500">
{tasks.filter((t) => t.projectId === project.id).length}
</span>
</button>
))}
{showNewProject ? (
<div className="flex gap-2 mt-2">
<input
type="text"
value={newProjectName}
onChange={(e) => setNewProjectName(e.target.value)}
placeholder="Project name"
className="flex-1 px-3 py-2 bg-slate-800 border border-slate-700 rounded-lg text-sm text-white placeholder-slate-500 focus:outline-none focus:border-blue-500"
onKeyDown={(e) => e.key === "Enter" && handleAddProject()}
/>
<Button size="sm" onClick={handleAddProject}>
<Check className="w-4 h-4" />
</Button>
<Button
size="sm"
variant="ghost"
onClick={() => setShowNewProject(false)}
>
<X className="w-4 h-4" />
</Button>
</div>
) : (
<Button
variant="ghost"
className="w-full justify-start text-slate-400 hover:text-white mt-2"
onClick={() => setShowNewProject(true)}
>
<Plus className="w-4 h-4 mr-2" />
New Project
</Button>
)}
</CardContent>
</Card>
{/* Task Type Legend */}
<Card className="bg-slate-900 border-slate-800 mt-4">
<CardHeader className="pb-3">
<CardTitle className="text-sm font-semibold text-slate-400 uppercase tracking-wider">
Types
</CardTitle>
</CardHeader>
<CardContent className="space-y-2">
{Object.entries(typeLabels).map(([type, label]) => (
<div key={type} className="flex items-center gap-2 text-sm text-slate-400">
<div className={`w-2 h-2 rounded-full ${typeColors[type as TaskType]}`} />
{label}
<span className="text-slate-400">{project.name}</span>
</div>
))}
</CardContent>