Skip to content

Commit e5b9bb9

Browse files
charlesviencharlesvien
committed
wip
1 parent 67ff0b0 commit e5b9bb9

File tree

4 files changed

+145
-91
lines changed

4 files changed

+145
-91
lines changed

‎apps/array/src/main/services/types.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,3 +3,4 @@
33
* This file is auto-generated by vite-plugin-auto-services.ts
44
*/
55

6+

‎apps/array/src/renderer/components/StatusBar.tsx‎

Lines changed: 1 addition & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,5 @@
11
import { StatusBarMenu } from "@components/StatusBarMenu";
2-
import { GearIcon } from "@radix-ui/react-icons";
3-
import { Badge, Box, Code, Flex, IconButton, Kbd } from "@radix-ui/themes";
4-
import { useNavigationStore } from "@stores/navigationStore";
2+
import { Badge, Box, Code, Flex, Kbd } from "@radix-ui/themes";
53
import { useStatusBarStore } from "@stores/statusBarStore";
64

75
import { IS_DEV } from "@/constants/environment";
@@ -12,7 +10,6 @@ interface StatusBarProps {
1210

1311
export function StatusBar({ showKeyHints = true }: StatusBarProps) {
1412
const { statusText, keyHints } = useStatusBarStore();
15-
const { toggleSettings } = useNavigationStore();
1613

1714
return (
1815
<Box className="flex flex-row items-center justify-between border-gray-6 border-t bg-gray-2 px-4 py-2">
@@ -46,15 +43,6 @@ export function StatusBar({ showKeyHints = true }: StatusBarProps) {
4643
)}
4744

4845
<Flex align="center" gap="2">
49-
<IconButton
50-
size="1"
51-
variant="ghost"
52-
color="gray"
53-
onClick={toggleSettings}
54-
title="Settings"
55-
>
56-
<GearIcon />
57-
</IconButton>
5846
{IS_DEV && (
5947
<Badge size="1">
6048
<Code size="1" variant="ghost">

‎apps/array/src/renderer/features/sidebar/components/SidebarFooter.tsx‎

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
import { Plus } from "@phosphor-icons/react";
2+
import { GearIcon } from "@radix-ui/react-icons";
3+
import { Box, Flex, IconButton, Text } from "@radix-ui/themes";
4+
import { useRegisteredFoldersStore } from "@renderer/stores/registeredFoldersStore";
5+
import { trpcVanilla } from "@renderer/trpc";
6+
import { useNavigationStore } from "@stores/navigationStore";
7+
import { useCallback } from "react";
8+
9+
export function SidebarFooter() {
10+
const addFolder = useRegisteredFoldersStore((state) => state.addFolder);
11+
const { toggleSettings } = useNavigationStore();
12+
13+
const handleAddRepository = useCallback(async () => {
14+
const selectedPath = await trpcVanilla.os.selectDirectory.query();
15+
if (selectedPath) {
16+
await addFolder(selectedPath);
17+
}
18+
}, [addFolder]);
19+
20+
return (
21+
<Box
22+
style={{
23+
position: "absolute",
24+
bottom: 0,
25+
left: 0,
26+
right: 0,
27+
borderTop: "1px solid var(--gray-6)",
28+
background: "var(--color-background)",
29+
padding: "8px 12px",
30+
}}
31+
>
32+
<Flex align="center" justify="between">
33+
<IconButton
34+
size="1"
35+
variant="ghost"
36+
color="gray"
37+
onClick={handleAddRepository}
38+
title="Add repository"
39+
>
40+
<Flex align="center" gap="1">
41+
<Plus size={14} weight="bold" />
42+
<Text size="1">Add repository</Text>
43+
</Flex>
44+
</IconButton>
45+
46+
<IconButton
47+
size="1"
48+
variant="ghost"
49+
color="gray"
50+
onClick={toggleSettings}
51+
title="Settings"
52+
>
53+
<GearIcon />
54+
</IconButton>
55+
</Flex>
56+
</Box>
57+
);
58+
}

‎apps/array/src/renderer/features/sidebar/components/SidebarMenu.tsx‎

Lines changed: 85 additions & 78 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ import { useTaskViewedStore } from "../stores/taskViewedStore";
2020
import { HomeItem } from "./items/HomeItem";
2121
import { NewTaskItem } from "./items/NewTaskItem";
2222
import { TaskItem } from "./items/TaskItem";
23+
import { SidebarFooter } from "./SidebarFooter";
2324
import { SortableFolderSection } from "./SortableFolderSection";
2425

2526
function SidebarMenuComponent() {
@@ -143,85 +144,91 @@ function SidebarMenuComponent() {
143144
onOpenChange={setRenameDialogOpen}
144145
/>
145146

146-
<Box
147-
style={{
148-
flexGrow: 1,
149-
overflowY: "auto",
150-
overflowX: "hidden",
151-
}}
152-
>
153-
<Flex direction="column" py="2">
154-
<HomeItem
155-
isActive={sidebarData.isHomeActive}
156-
onClick={handleHomeClick}
157-
/>
158-
159-
<DragDropProvider
160-
onDragOver={handleDragOver}
161-
sensors={[
162-
PointerSensor.configure({
163-
activationConstraints: {
164-
distance: { value: 5 },
165-
},
166-
}),
167-
]}
168-
>
169-
{sidebarData.folders.map((folder, index) => {
170-
const isExpanded = !collapsedSections.has(folder.id);
171-
return (
172-
<SortableFolderSection
173-
key={folder.id}
174-
id={folder.id}
175-
index={index}
176-
label={folder.name}
177-
icon={
178-
isExpanded ? (
179-
<FolderOpenIcon size={14} weight="regular" />
180-
) : (
181-
<FolderIcon size={14} weight="regular" />
182-
)
183-
}
184-
isExpanded={isExpanded}
185-
onToggle={() => toggleSection(folder.id)}
186-
onContextMenu={(e) => handleFolderContextMenu(folder.id, e)}
187-
>
188-
<NewTaskItem onClick={() => handleFolderNewTask(folder.id)} />
189-
{folder.tasks.map((task) => (
190-
<TaskItem
191-
key={task.id}
192-
id={task.id}
193-
label={task.title}
194-
isActive={sidebarData.activeTaskId === task.id}
195-
worktreeName={
196-
workspaces[task.id]?.worktreeName ?? undefined
197-
}
198-
worktreePath={
199-
workspaces[task.id]?.worktreePath ??
200-
workspaces[task.id]?.folderPath
201-
}
202-
workspaceMode={taskStates[task.id]?.workspaceMode}
203-
lastActivityAt={task.lastActivityAt}
204-
isGenerating={task.isGenerating}
205-
isUnread={task.isUnread}
206-
onClick={() => handleTaskClick(task.id)}
207-
onContextMenu={(e) => handleTaskContextMenu(task.id, e)}
147+
<Box height="100%" position="relative">
148+
<Box
149+
style={{
150+
height: "100%",
151+
overflowY: "auto",
152+
overflowX: "hidden",
153+
paddingBottom: "52px",
154+
}}
155+
>
156+
<Flex direction="column" py="2">
157+
<HomeItem
158+
isActive={sidebarData.isHomeActive}
159+
onClick={handleHomeClick}
160+
/>
161+
162+
<DragDropProvider
163+
onDragOver={handleDragOver}
164+
sensors={[
165+
PointerSensor.configure({
166+
activationConstraints: {
167+
distance: { value: 5 },
168+
},
169+
}),
170+
]}
171+
>
172+
{sidebarData.folders.map((folder, index) => {
173+
const isExpanded = !collapsedSections.has(folder.id);
174+
return (
175+
<SortableFolderSection
176+
key={folder.id}
177+
id={folder.id}
178+
index={index}
179+
label={folder.name}
180+
icon={
181+
isExpanded ? (
182+
<FolderOpenIcon size={14} weight="regular" />
183+
) : (
184+
<FolderIcon size={14} weight="regular" />
185+
)
186+
}
187+
isExpanded={isExpanded}
188+
onToggle={() => toggleSection(folder.id)}
189+
onContextMenu={(e) => handleFolderContextMenu(folder.id, e)}
190+
>
191+
<NewTaskItem
192+
onClick={() => handleFolderNewTask(folder.id)}
208193
/>
209-
))}
210-
</SortableFolderSection>
211-
);
212-
})}
213-
<DragOverlay>
214-
{(source) =>
215-
source?.type === "folder" ? (
216-
<div className="flex w-full items-center gap-1 rounded bg-gray-2 px-2 py-1 font-mono text-[12px] text-gray-11 shadow-lg">
217-
<FolderIcon size={14} weight="regular" />
218-
<span className="font-medium">{source.data?.label}</span>
219-
</div>
220-
) : null
221-
}
222-
</DragOverlay>
223-
</DragDropProvider>
224-
</Flex>
194+
{folder.tasks.map((task) => (
195+
<TaskItem
196+
key={task.id}
197+
id={task.id}
198+
label={task.title}
199+
isActive={sidebarData.activeTaskId === task.id}
200+
worktreeName={
201+
workspaces[task.id]?.worktreeName ?? undefined
202+
}
203+
worktreePath={
204+
workspaces[task.id]?.worktreePath ??
205+
workspaces[task.id]?.folderPath
206+
}
207+
workspaceMode={taskStates[task.id]?.workspaceMode}
208+
lastActivityAt={task.lastActivityAt}
209+
isGenerating={task.isGenerating}
210+
isUnread={task.isUnread}
211+
onClick={() => handleTaskClick(task.id)}
212+
onContextMenu={(e) => handleTaskContextMenu(task.id, e)}
213+
/>
214+
))}
215+
</SortableFolderSection>
216+
);
217+
})}
218+
<DragOverlay>
219+
{(source) =>
220+
source?.type === "folder" ? (
221+
<div className="flex w-full items-center gap-1 rounded bg-gray-2 px-2 py-1 font-mono text-[12px] text-gray-11 shadow-lg">
222+
<FolderIcon size={14} weight="regular" />
223+
<span className="font-medium">{source.data?.label}</span>
224+
</div>
225+
) : null
226+
}
227+
</DragOverlay>
228+
</DragDropProvider>
229+
</Flex>
230+
</Box>
231+
<SidebarFooter />
225232
</Box>
226233
</>
227234
);

0 commit comments

Comments
 (0)