b1dea9a5c2
- Added a new task store in `src-react/stores/task.ts` to manage tasks and their statuses. - Implemented functions for creating, executing, and retrying tasks, along with handling task progress and completion. - Introduced persistence for tasks using IPC. - Created utility functions for normalizing room types and building subtasks. - Added a new CSS file for global styles in `src-react/styles.css`. - Created runtime types in `src-react/types/runtime.ts` and exported them. - Updated the main entry points for Vue and React applications to support dynamic framework loading. - Refactored chat model interfaces and utility functions into `src/shared/chat-model.ts`. - Updated TypeScript configuration to include paths for React components and types. - Enhanced Vite configuration to support both Vue and React frameworks.
68 lines
2.3 KiB
TypeScript
68 lines
2.3 KiB
TypeScript
import { useLocation, useNavigate } from 'react-router-dom';
|
|
import { NAV_ITEMS, normalizeWorkspacePath } from '../../router/routes';
|
|
|
|
const MENU_MARKS: Record<string, string> = {
|
|
'/home': '首',
|
|
'/knowledge': '知',
|
|
'/agents': '模',
|
|
'/skills': '技',
|
|
'/cron': '时',
|
|
'/scripts': '脚',
|
|
'/setting': '设',
|
|
};
|
|
|
|
export default function Sidebar() {
|
|
const location = useLocation();
|
|
const navigate = useNavigate();
|
|
const currentId = normalizeWorkspacePath(location.pathname);
|
|
|
|
return (
|
|
<aside className="w-[80px] h-full box-border flex flex-col items-center pb-[8px]">
|
|
<div className="flex flex-col gap-[16px] w-full">
|
|
{NAV_ITEMS.map((item) => {
|
|
const active = currentId === item.path;
|
|
const isSetting = item.path === '/setting';
|
|
|
|
return (
|
|
<div
|
|
key={item.path}
|
|
className={['flex flex-col gap-[16px]', isSetting ? 'mt-auto mb-[8px] shrink-1' : ''].join(' ')}
|
|
>
|
|
<button
|
|
type="button"
|
|
className="cursor-pointer flex flex-col items-center justify-center"
|
|
onClick={() => navigate(item.path)}
|
|
>
|
|
<div
|
|
className={[
|
|
'box-border rounded-[16px] w-[48px] h-[48px] flex flex-col items-center justify-center hover:bg-white dark:hover:bg-[#222225]',
|
|
active ? 'bg-white dark:bg-[#222225]' : '',
|
|
].join(' ')}
|
|
>
|
|
<span
|
|
className="text-[18px] font-semibold leading-none"
|
|
style={{ color: active ? '#2B7FFF' : '#525866' }}
|
|
>
|
|
{MENU_MARKS[item.path]}
|
|
</span>
|
|
</div>
|
|
|
|
<div
|
|
className="text-[14px] mt-[4px] mb-[8px] hover:text-[#2B7FFF]"
|
|
style={{ color: active ? '#2B7FFF' : '#525866' }}
|
|
>
|
|
{item.label}
|
|
</div>
|
|
</button>
|
|
</div>
|
|
);
|
|
})}
|
|
</div>
|
|
|
|
<div className="w-[48px] h-[48px] rounded-full overflow-hidden mt-auto bg-white dark:bg-[#222225] flex items-center justify-center border border-black/10 dark:border-[#2a2a2d]">
|
|
<span className="text-[16px] font-bold text-[#2B7FFF]">Z</span>
|
|
</div>
|
|
</aside>
|
|
);
|
|
}
|