All checks were successful
Build and Push Docker Image to Gitea / build-and-push (push) Successful in 58s
Features added:
- Group-based process organization with collapsible cards
- Batch operations for groups (Start All, Stop All, Restart All)
- Group statistics display (running, stopped, fatal counts)
- Dedicated /groups page for group-centric management
- View toggle in /processes page (Flat view | Grouped view)
Implementation details:
- Created group API routes: /api/supervisor/groups/[name]/{start,stop,restart}
- Added React Query hooks: useStartProcessGroup, useStopProcessGroup, useRestartProcessGroup
- Created components: GroupCard, GroupView, GroupSelector
- Updated Navbar with Groups navigation link
- Integrated grouped view in processes page with toggle
Phase 2 complete (6-8 hours estimated)
36 lines
868 B
TypeScript
36 lines
868 B
TypeScript
'use client';
|
|
|
|
import { ProcessInfo } from '@/lib/supervisor/types';
|
|
import { GroupCard } from './GroupCard';
|
|
|
|
interface GroupViewProps {
|
|
processes: ProcessInfo[];
|
|
}
|
|
|
|
export function GroupView({ processes }: GroupViewProps) {
|
|
// Group processes by their group name
|
|
const groupedProcesses = processes.reduce((acc, process) => {
|
|
const groupName = process.group;
|
|
if (!acc[groupName]) {
|
|
acc[groupName] = [];
|
|
}
|
|
acc[groupName].push(process);
|
|
return acc;
|
|
}, {} as Record<string, ProcessInfo[]>);
|
|
|
|
// Sort groups alphabetically
|
|
const sortedGroups = Object.keys(groupedProcesses).sort();
|
|
|
|
return (
|
|
<div className="space-y-6">
|
|
{sortedGroups.map((groupName) => (
|
|
<GroupCard
|
|
key={groupName}
|
|
groupName={groupName}
|
|
processes={groupedProcesses[groupName]}
|
|
/>
|
|
))}
|
|
</div>
|
|
);
|
|
}
|