mirror of
https://github.com/alkimake/paperclip.git
synced 2026-06-15 10:30:37 +09:00
Add React UI with Vite
Dashboard, agents, goals, issues, and projects pages with sidebar navigation. API client layer, custom hooks, and shared layout components. Built with Vite and TypeScript. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
c9d7cbfe44
commit
c3d82ed857
25 changed files with 482 additions and 0 deletions
8
ui/src/hooks/useAgents.ts
Normal file
8
ui/src/hooks/useAgents.ts
Normal file
|
|
@ -0,0 +1,8 @@
|
|||
import { useCallback } from "react";
|
||||
import { agentsApi } from "../api/agents";
|
||||
import { useApi } from "./useApi";
|
||||
|
||||
export function useAgents() {
|
||||
const fetcher = useCallback(() => agentsApi.list(), []);
|
||||
return useApi(fetcher);
|
||||
}
|
||||
21
ui/src/hooks/useApi.ts
Normal file
21
ui/src/hooks/useApi.ts
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
import { useState, useEffect, useCallback } from "react";
|
||||
|
||||
export function useApi<T>(fetcher: () => Promise<T>) {
|
||||
const [data, setData] = useState<T | null>(null);
|
||||
const [error, setError] = useState<Error | null>(null);
|
||||
const [loading, setLoading] = useState(true);
|
||||
|
||||
const load = useCallback(() => {
|
||||
setLoading(true);
|
||||
fetcher()
|
||||
.then(setData)
|
||||
.catch(setError)
|
||||
.finally(() => setLoading(false));
|
||||
}, [fetcher]);
|
||||
|
||||
useEffect(() => {
|
||||
load();
|
||||
}, [load]);
|
||||
|
||||
return { data, error, loading, reload: load };
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue