starred/yaak-mountain-loop
1
0
Fork 0
mirror of https://github.com/mountain-loop/yaak.git synced 2026-03-25 02:41:07 +01:00
Code Issues 8 Packages Projects Releases 10 Wiki Activity

Add sidebar to proxy app

Browse Source
This commit is contained in:
Gregory Schier
2026-03-09 09:33:35 -07:00
parent a0442fb42b
commit e87c3291e7
1 changed files with 41 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

78
apps/yaak-proxy/main.tsx
View File

@@ -2,6 +2,7 @@ import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { type } from "@tauri-apps/plugin-os";
import { HeaderSize } from "@yaakapp-internal/ui";
import { ActionButton } from "./ActionButton";
import { Sidebar } from "./Sidebar";
import classNames from "classnames";
import { createStore, Provider, useAtomValue } from "jotai";
import { StrictMode } from "react";
@@ -57,45 +58,48 @@ function App() {
Yaak Proxy
</div>
</HeaderSize>
<main className="overflow-auto p-4">
<div className="flex items-center gap-3 mb-4">
<ActionButton
action={{ scope: "global", action: "proxy_start" }}
size="sm"
tone="primary"
/>
<ActionButton
action={{ scope: "global", action: "proxy_stop" }}
size="sm"
variant="border"
/>
</div>
<div className="grid grid-cols-[auto_1fr] min-h-0">
<Sidebar />
<main className="overflow-auto p-4">
<div className="flex items-center gap-3 mb-4">
<ActionButton
action={{ scope: "global", action: "proxy_start" }}
size="sm"
tone="primary"
/>
<ActionButton
action={{ scope: "global", action: "proxy_stop" }}
size="sm"
variant="border"
/>
</div>
<div className="text-xs font-mono">
{exchanges.length === 0 ? (
<p className="text-text-subtlest">No traffic yet</p>
) : (
<table className="w-full text-left">
<thead>
<tr className="text-text-subtlest border-b border-border-subtle">
<th className="py-1 pr-3 font-medium">Method</th>
<th className="py-1 pr-3 font-medium">URL</th>
<th className="py-1 pr-3 font-medium">Status</th>
</tr>
</thead>
<tbody>
{exchanges.map((ex) => (
<tr key={ex.id} className="border-b border-border-subtle">
<td className="py-1 pr-3">{ex.method}</td>
<td className="py-1 pr-3 truncate max-w-md">{ex.url}</td>
<td className="py-1 pr-3">{ex.resStatus ?? "—"}</td>
<div className="text-xs font-mono">
{exchanges.length === 0 ? (
<p className="text-text-subtlest">No traffic yet</p>
) : (
<table className="w-full text-left">
<thead>
<tr className="text-text-subtlest border-b border-border-subtle">
<th className="py-1 pr-3 font-medium">Method</th>
<th className="py-1 pr-3 font-medium">URL</th>
<th className="py-1 pr-3 font-medium">Status</th>
</tr>
))}
</tbody>
</table>
)}
</div>
</main>
</thead>
<tbody>
{exchanges.map((ex) => (
<tr key={ex.id} className="border-b border-border-subtle">
<td className="py-1 pr-3">{ex.method}</td>
<td className="py-1 pr-3 truncate max-w-md">{ex.url}</td>
<td className="py-1 pr-3">{ex.resStatus ?? "—"}</td>
</tr>
))}
</tbody>
</table>
)}
</div>
</main>
</div>
</div>
);
}