File tree because we're just that cool

apps/desktop/package.json

@@ -162,6 +162,7 @@
 		"tree-kill": "^1.2.2",
 		"trpc-electron": "^0.1.2",
 		"tw-animate-css": "^1.4.0",
+		"use-resize-observer": "^9.1.0",
 		"zod": "^4.3.5",
 		"zustand": "^5.0.8"
 	},

apps/desktop/src/lib/trpc/routers/filesystem/index.ts

@@ -0,0 +1,286 @@
+import fs from "node:fs/promises";
+import path from "node:path";
+import { shell } from "electron";
+import type { DirectoryEntry } from "shared/file-tree-types";
+import { z } from "zod";
+import { publicProcedure, router } from "../..";
+
+export const createFilesystemRouter = () => {
+	return router({
+		readDirectory: publicProcedure
+			.input(
+				z.object({
+					dirPath: z.string(),
+					rootPath: z.string(),
+					includeHidden: z.boolean().default(false),
+				}),
+			)
+			.query(async ({ input }): Promise<DirectoryEntry[]> => {
+				const { dirPath, rootPath, includeHidden } = input;
+
+				try {
+					const entries = await fs.readdir(dirPath, { withFileTypes: true });
+
+					return entries
+						.filter((entry) => includeHidden || !entry.name.startsWith("."))
+						.map((entry) => {
+							const fullPath = path.join(dirPath, entry.name);
+							const relativePath = path.relative(rootPath, fullPath);
+							return {
+								id: relativePath,
+								name: entry.name,
+								path: fullPath,
+								relativePath,
+								isDirectory: entry.isDirectory(),
+							};
+						})
+						.sort((a, b) => {
+							if (a.isDirectory !== b.isDirectory) {
+								return a.isDirectory ? -1 : 1;
+							}
+							return a.name.localeCompare(b.name);
+						});
+				} catch (error) {
+					console.error("[filesystem/readDirectory] Failed:", {
+						dirPath,
+						error,
+					});
+					return [];
+				}
+			}),
+
+		createFile: publicProcedure
+			.input(
+				z.object({
+					dirPath: z.string(),
+					fileName: z.string(),
+					content: z.string().default(""),
+				}),
+			)
+			.mutation(async ({ input }) => {
+				const filePath = path.join(input.dirPath, input.fileName);
+
+				try {
+					await fs.access(filePath);
+					throw new Error(`File already exists: ${input.fileName}`);
+				} catch (error) {
+					if (
+						error instanceof Error &&
+						error.message.includes("already exists")
+					) {
+						throw error;
+					}
+				}
+
+				await fs.writeFile(filePath, input.content, "utf-8");
+				return { path: filePath };
+			}),
+
+		createDirectory: publicProcedure
+			.input(
+				z.object({
+					parentPath: z.string(),
+					dirName: z.string(),
+				}),
+			)
+			.mutation(async ({ input }) => {
+				const dirPath = path.join(input.parentPath, input.dirName);
+
+				try {
+					await fs.access(dirPath);
+					throw new Error(`Directory already exists: ${input.dirName}`);
+				} catch (error) {
+					if (
+						error instanceof Error &&
+						error.message.includes("already exists")
+					) {
+						throw error;
+					}
+				}
+
+				await fs.mkdir(dirPath, { recursive: true });
+				return { path: dirPath };
+			}),
+
+		rename: publicProcedure
+			.input(
+				z.object({
+					oldPath: z.string(),
+					newName: z.string(),
+				}),
+			)
+			.mutation(async ({ input }) => {
+				const newPath = path.join(path.dirname(input.oldPath), input.newName);
+
+				try {
+					await fs.access(newPath);
+					throw new Error(`Target already exists: ${input.newName}`);
+				} catch (error) {
+					if (
+						error instanceof Error &&
+						error.message.includes("already exists")
+					) {
+						throw error;
+					}
+				}
+
+				await fs.rename(input.oldPath, newPath);
+				return { oldPath: input.oldPath, newPath };
+			}),
+
+		delete: publicProcedure
+			.input(
+				z.object({
+					paths: z.array(z.string()),
+					permanent: z.boolean().default(false),
+				}),
+			)
+			.mutation(async ({ input }) => {
+				const deleted: string[] = [];
+				const errors: { path: string; error: string }[] = [];
+
+				for (const filePath of input.paths) {
+					try {
+						if (input.permanent) {
+							await fs.rm(filePath, { recursive: true, force: true });
+						} else {
+							await shell.trashItem(filePath);
+						}
+						deleted.push(filePath);
+					} catch (error) {
+						errors.push({
+							path: filePath,
+							error: error instanceof Error ? error.message : String(error),
+						});
+					}
+				}
+
+				return { deleted, errors };
+			}),
+
+		move: publicProcedure
+			.input(
+				z.object({
+					sourcePaths: z.array(z.string()),
+					destinationDir: z.string(),
+				}),
+			)
+			.mutation(async ({ input }) => {
+				const moved: { from: string; to: string }[] = [];
+				const errors: { path: string; error: string }[] = [];
+
+				for (const sourcePath of input.sourcePaths) {
+					try {
+						const fileName = path.basename(sourcePath);
+						const destPath = path.join(input.destinationDir, fileName);
+
+						try {
+							await fs.access(destPath);
+							throw new Error(`Target already exists: ${fileName}`);
+						} catch (accessError) {
+							if (
+								accessError instanceof Error &&
+								accessError.message.includes("already exists")
+							) {
+								throw accessError;
+							}
+						}
+
+						await fs.rename(sourcePath, destPath);
+						moved.push({ from: sourcePath, to: destPath });
+					} catch (error) {
+						errors.push({
+							path: sourcePath,
+							error: error instanceof Error ? error.message : String(error),
+						});
+					}
+				}
+
+				return { moved, errors };
+			}),
+
+		copy: publicProcedure
+			.input(
+				z.object({
+					sourcePaths: z.array(z.string()),
+					destinationDir: z.string(),
+				}),
+			)
+			.mutation(async ({ input }) => {
+				const copied: { from: string; to: string }[] = [];
+				const errors: { path: string; error: string }[] = [];
+
+				for (const sourcePath of input.sourcePaths) {
+					try {
+						const fileName = path.basename(sourcePath);
+						let destPath = path.join(input.destinationDir, fileName);
+
+						let counter = 1;
+						while (true) {
+							try {
+								await fs.access(destPath);
+								const ext = path.extname(fileName);
+								const base = path.basename(fileName, ext);
+								destPath = path.join(
+									input.destinationDir,
+									`${base} (${counter})${ext}`,
+								);
+								counter++;
+							} catch {
+								break;
+							}
+						}
+
+						await fs.cp(sourcePath, destPath, { recursive: true });
+						copied.push({ from: sourcePath, to: destPath });
+					} catch (error) {
+						errors.push({
+							path: sourcePath,
+							error: error instanceof Error ? error.message : String(error),
+						});
+					}
+				}
+
+				return { copied, errors };
+			}),
+
+		exists: publicProcedure
+			.input(z.object({ path: z.string() }))
+			.query(async ({ input }) => {
+				try {
+					await fs.access(input.path);
+					const stats = await fs.stat(input.path);
+					return {
+						exists: true,
+						isDirectory: stats.isDirectory(),
+						isFile: stats.isFile(),
+					};
+				} catch {
+					return { exists: false, isDirectory: false, isFile: false };
+				}
+			}),
+
+		stat: publicProcedure
+			.input(z.object({ path: z.string() }))
+			.query(async ({ input }) => {
+				try {
+					const stats = await fs.stat(input.path);
+					return {
+						size: stats.size,
+						isDirectory: stats.isDirectory(),
+						isFile: stats.isFile(),
+						isSymbolicLink: stats.isSymbolicLink(),
+						createdAt: stats.birthtime.toISOString(),
+						modifiedAt: stats.mtime.toISOString(),
+						accessedAt: stats.atime.toISOString(),
+					};
+				} catch (error) {
+					console.error("[filesystem/stat] Failed:", {
+						path: input.path,
+						error,
+					});
+					return null;
+				}
+			}),
+	});
+};

apps/desktop/src/lib/trpc/routers/index.ts

@@ -7,6 +7,7 @@ import { createCacheRouter } from "./cache";
 import { createChangesRouter } from "./changes";
 import { createConfigRouter } from "./config";
 import { createExternalRouter } from "./external";
+import { createFilesystemRouter } from "./filesystem";
 import { createHotkeysRouter } from "./hotkeys";
 import { createMenuRouter } from "./menu";
 import { createNotificationsRouter } from "./notifications";
@@ -30,6 +31,7 @@ export const createAppRouter = (getWindow: () => BrowserWindow | null) => {
 		workspaces: createWorkspacesRouter(),
 		terminal: createTerminalRouter(),
 		changes: createChangesRouter(),
+		filesystem: createFilesystemRouter(),
 		notifications: createNotificationsRouter(),
 		ports: createPortsRouter(),
 		menu: createMenuRouter(),

apps/desktop/src/renderer/screens/main/components/WorkspaceView/ChangesContent/components/FileDiffSection/FileDiffSection.tsx

@@ -8,7 +8,7 @@ import type { ChangeCategory, ChangedFile } from "shared/changes-types";
 import {
 	getStatusColor,
 	getStatusIndicator,
-} from "../../../Sidebar/ChangesView/utils";
+} from "../../../RightSidebar/ChangesView/utils";
 import { createFileKey, useScrollContext } from "../../context";
 import { DiffViewer } from "../DiffViewer";
 import { FileDiffHeader } from "./components/FileDiffHeader";