orbital-command 0.2.0 → 0.3.0

package/src/components/SwimCell.tsx

@@ -1,67 +0,0 @@
-import { useDroppable } from '@dnd-kit/core';
-import type { Scope, ScopeStatus, CardDisplayConfig } from '@/types';
-import { ScopeCard } from './ScopeCard';
-import { cn } from '@/lib/utils';
-
-interface SwimCellProps {
-  laneValue: string;
-  status: ScopeStatus;
-  scopes: Scope[];
-  onScopeClick?: (scope: Scope) => void;
-  cardDisplay?: CardDisplayConfig;
-  dimmedIds?: Set<number>;
-  isDragActive: boolean;
-  isValidDrop: boolean;
-  isCollapsed: boolean;
-}
-
-export function SwimCell({
-  laneValue,
-  status,
-  scopes = [],
-  onScopeClick,
-  cardDisplay,
-  dimmedIds,
-  isDragActive,
-  isValidDrop,
-  isCollapsed,
-}: SwimCellProps) {
-  const droppableId = `swim::${laneValue}::${status}`;
-  const { setNodeRef, isOver } = useDroppable({ id: droppableId });
-
-  if (isCollapsed) return null;
-
-  return (
-    <div
-      ref={setNodeRef}
-      className={cn(
-        'swim-cell min-h-[48px] rounded border border-white/[0.04] p-1 transition-colors',
-        isDragActive && isOver && isValidDrop && 'ring-2 ring-green-500/60 border-green-500/40 bg-green-500/5',
-        isDragActive && isOver && !isValidDrop && 'ring-2 ring-red-500/50 border-red-500/30 bg-red-500/5',
-        isDragActive && !isOver && isValidDrop && 'border-green-500/20',
-        scopes.length === 0 && 'border-dashed border-white/[0.06]',
-      )}
-    >
-      <div className="space-y-1.5">
-        {scopes.filter((s) => !s.is_ghost).map((scope) => (
-          <ScopeCard
-            key={scope.id}
-            scope={scope}
-            onClick={onScopeClick}
-            cardDisplay={cardDisplay}
-            dimmed={dimmedIds?.has(scope.id)}
-          />
-        ))}
-        {scopes.filter((s) => s.is_ghost).map((scope) => (
-          <ScopeCard
-            key={scope.id}
-            scope={scope}
-            onClick={onScopeClick}
-            cardDisplay={cardDisplay}
-            dimmed={dimmedIds?.has(scope.id)}
-          />
-        ))}
-      </div>
-    </div>
-  );
-}

package/src/components/SwimLaneRow.tsx

@@ -1,94 +0,0 @@
-import { ChevronRight } from 'lucide-react';
-import type { SwimLane } from '@/lib/swimlane';
-import type { Scope, ScopeStatus, CardDisplayConfig, BoardColumn } from '@/types';
-import { SwimCell } from './SwimCell';
-import { cn } from '@/lib/utils';
-
-interface SwimLaneRowProps {
-  lane: SwimLane;
-  columns: BoardColumn[];
-  collapsedColumns: Set<string>;
-  isLaneCollapsed: boolean;
-  onToggleLane: () => void;
-  onScopeClick?: (scope: Scope) => void;
-  cardDisplay?: CardDisplayConfig;
-  dimmedIds?: Set<number>;
-  isDragActive: boolean;
-  validTargets: Set<ScopeStatus>;
-}
-
-export function SwimLaneRow({
-  lane,
-  columns,
-  collapsedColumns,
-  isLaneCollapsed,
-  onToggleLane,
-  onScopeClick,
-  cardDisplay,
-  dimmedIds,
-  isDragActive,
-  validTargets,
-}: SwimLaneRowProps) {
-  if (isLaneCollapsed) {
-    return (
-      <>
-        {/* Lane label cell — collapsed */}
-        <button
-          onClick={onToggleLane}
-          className="swim-lane-header flex items-center gap-2 rounded-l px-3 py-1.5 text-left hover:bg-white/[0.04] transition-colors cursor-pointer sticky left-0 z-10 bg-background"
-        >
-          <div className={cn('h-full w-0.5 rounded-full shrink-0 self-stretch', lane.color)} />
-          <ChevronRight className="h-3 w-3 text-muted-foreground shrink-0" />
-          <span className="text-xxs font-medium text-muted-foreground truncate capitalize">
-            {lane.label}
-          </span>
-          <span className="ml-auto rounded-full bg-muted px-1.5 py-0.5 text-[10px] text-muted-foreground shrink-0">
-            {lane.count}
-          </span>
-        </button>
-        {/* Empty cells across columns */}
-        {columns.map((col) => (
-          <div key={col.id} className={cn(collapsedColumns.has(col.id) && 'hidden')} />
-        ))}
-      </>
-    );
-  }
-
-  return (
-    <>
-      {/* Lane label cell */}
-      <button
-        onClick={onToggleLane}
-        className="swim-lane-header flex items-start gap-2 rounded-l px-3 py-2 text-left hover:bg-white/[0.04] transition-colors cursor-pointer sticky left-0 z-10 bg-background"
-      >
-        <div className={cn('w-0.5 rounded-full shrink-0 min-h-[32px] self-stretch', lane.color)} />
-        <div className="flex flex-col gap-1 min-w-0">
-          <div className="flex items-center gap-1.5">
-            <ChevronRight className="h-3 w-3 text-muted-foreground shrink-0 rotate-90 transition-transform" />
-            <span className="swim-lane-label text-xxs font-medium text-foreground/80 truncate capitalize">
-              {lane.label}
-            </span>
-          </div>
-          <span className="text-[10px] text-muted-foreground">
-            {lane.count} scope{lane.count !== 1 ? 's' : ''}
-          </span>
-        </div>
-      </button>
-      {/* Cells per column */}
-      {columns.map((col) => (
-        <SwimCell
-          key={col.id}
-          laneValue={lane.value}
-          status={col.id}
-          scopes={lane.cells[col.id]}
-          onScopeClick={onScopeClick}
-          cardDisplay={cardDisplay}
-          dimmedIds={dimmedIds}
-          isDragActive={isDragActive}
-          isValidDrop={validTargets.has(col.id)}
-          isCollapsed={collapsedColumns.has(col.id)}
-        />
-      ))}
-    </>
-  );
-}

package/src/components/SwimlaneBoardView.tsx

@@ -1,108 +0,0 @@
-import { Info } from 'lucide-react';
-import type { SwimLane } from '@/lib/swimlane';
-import type { Scope, ScopeStatus, CardDisplayConfig, BoardColumn, Sprint } from '@/types';
-import { SwimLaneRow } from './SwimLaneRow';
-import { cn } from '@/lib/utils';
-import { useTheme } from '@/hooks/useTheme';
-
-interface SwimlaneBoardViewProps {
-  lanes: SwimLane[];
-  columns: BoardColumn[];
-  collapsedColumns: Set<string>;
-  collapsedLanes: Set<string>;
-  onToggleLane: (laneValue: string) => void;
-  onToggleCollapse: (columnId: string) => void;
-  onScopeClick?: (scope: Scope) => void;
-  cardDisplay?: CardDisplayConfig;
-  dimmedIds?: Set<number>;
-  isDragActive: boolean;
-  validTargets: Set<ScopeStatus>;
-  sprints: Sprint[];
-}
-
-export function SwimlaneBoardView({
-  lanes,
-  columns,
-  collapsedColumns,
-  collapsedLanes,
-  onToggleLane,
-  onToggleCollapse,
-  onScopeClick,
-  cardDisplay,
-  dimmedIds,
-  isDragActive,
-  validTargets,
-  sprints,
-}: SwimlaneBoardViewProps) {
-  const { neonGlass } = useTheme();
-
-  // Filter out collapsed columns for grid sizing
-  const visibleColumns = columns.filter((c) => !collapsedColumns.has(c.id));
-  const gridTemplateColumns = `140px ${visibleColumns.map(() => '200px').join(' ')}`;
-
-  const hasActiveSprints = sprints.some((s) =>
-    s.group_type === 'sprint' || (s.group_type === 'batch' && s.status !== 'completed')
-  );
-
-  return (
-    <div className="min-h-0 flex-1 overflow-auto">
-      {/* Sprint info banner */}
-      {hasActiveSprints && (
-        <div className="mb-2 flex items-center gap-2 rounded border border-primary/20 bg-primary/5 px-3 py-1.5 text-xs text-muted-foreground">
-          <Info className="h-3.5 w-3.5 text-primary shrink-0" />
-          Sprint groups are hidden in swimlane view
-        </div>
-      )}
-
-      <div
-        className="grid gap-px pb-4"
-        style={{ gridTemplateColumns, width: 'max-content' }}
-      >
-        {/* Column headers — sticky top row */}
-        <div className="sticky top-0 z-20 bg-background" />
-        {visibleColumns.map((col) => (
-          <button
-            key={col.id}
-            onClick={() => onToggleCollapse(col.id)}
-            className={cn(
-              'sticky top-0 z-20 flex items-center gap-1.5 rounded-t border-b border-white/[0.06] bg-background px-2 py-1.5 text-left cursor-pointer hover:bg-white/[0.03] transition-colors',
-              neonGlass && 'border-b-white/[0.08]',
-            )}
-          >
-            <div className={cn('h-2 w-2 rounded-full shrink-0', neonGlass && 'animate-glow-pulse')} style={{ backgroundColor: `hsl(${col.color})` }} />
-            <span className="text-xxs uppercase tracking-wider font-normal text-muted-foreground truncate">
-              {col.label}
-            </span>
-          </button>
-        ))}
-
-        {/* Lane rows */}
-        {lanes.map((lane) => (
-          <SwimLaneRow
-            key={lane.value}
-            lane={lane}
-            columns={visibleColumns}
-            collapsedColumns={collapsedColumns}
-            isLaneCollapsed={collapsedLanes.has(lane.value)}
-            onToggleLane={() => onToggleLane(lane.value)}
-            onScopeClick={onScopeClick}
-            cardDisplay={cardDisplay}
-            dimmedIds={dimmedIds}
-            isDragActive={isDragActive}
-            validTargets={validTargets}
-          />
-        ))}
-
-        {/* Empty state */}
-        {lanes.length === 0 && (
-          <>
-            <div />
-            <div className={cn('col-span-full py-12 text-center text-xs text-muted-foreground')}>
-              No scopes to display
-            </div>
-          </>
-        )}
-      </div>
-    </div>
-  );
-}

package/src/components/VersionBadge.tsx

@@ -1,139 +0,0 @@
-import { RefreshCw, Download, Check, AlertCircle, GitBranch, GitCommit, Loader2 } from 'lucide-react';
-import { Badge } from '@/components/ui/badge';
-import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
-import { useVersion } from '@/hooks/useVersion';
-import { cn } from '@/lib/utils';
-
-export function VersionBadge() {
-  const {
-    version,
-    updateAvailable,
-    behindCount,
-    updateStage,
-    updateError,
-    loading,
-    checkForUpdate,
-    performUpdate,
-  } = useVersion();
-
-  if (loading) return null;
-  if (!version) {
-    return (
-      <button className="version-badge flex items-center gap-1.5 rounded-lg px-2 py-1 text-[10px] font-mono text-muted-foreground/50">
-        <span>v?</span>
-      </button>
-    );
-  }
-
-  const isWorking = updateStage === 'checking' || updateStage === 'pulling' || updateStage === 'installing';
-
-  return (
-    <Popover>
-      <PopoverTrigger asChild>
-        <button className="relative cursor-pointer">
-          <Badge
-            variant={updateAvailable ? 'warning' : 'success'}
-            className="version-badge font-mono text-[10px] transition-colors"
-          >
-            v{version.version}
-          </Badge>
-          {updateAvailable && (
-            <span className="version-pulse-dot absolute -top-1 -right-1 h-2 w-2 rounded-full bg-emerald-400" />
-          )}
-        </button>
-      </PopoverTrigger>
-
-      <PopoverContent
-        side="top"
-        align="end"
-        sideOffset={8}
-        className="w-64 filter-popover-glass"
-      >
-        <div className="space-y-3">
-          {/* Version header */}
-          <div className="flex items-center justify-between">
-            <span className="text-xs font-medium text-foreground">Orbital Command</span>
-            <Badge variant="outline" className="font-mono text-[10px]">
-              v{version.version}
-            </Badge>
-          </div>
-
-          {/* Git info */}
-          <div className="space-y-1.5 text-[11px] text-muted-foreground">
-            <div className="flex items-center gap-1.5">
-              <GitCommit className="h-3 w-3" />
-              <span className="font-mono">{version.commitSha}</span>
-            </div>
-            <div className="flex items-center gap-1.5">
-              <GitBranch className="h-3 w-3" />
-              <span className="font-mono">{version.branch}</span>
-            </div>
-          </div>
-
-          {/* Update status */}
-          {updateAvailable && updateStage !== 'done' && (
-            <div className="rounded-md border border-emerald-500/20 bg-emerald-500/5 px-2 py-1.5 text-[11px] text-emerald-400">
-              {behindCount} commit{behindCount !== 1 ? 's' : ''} behind remote
-            </div>
-          )}
-
-          {updateStage === 'done' && (
-            <div className="flex items-center gap-1.5 rounded-md border border-emerald-500/20 bg-emerald-500/5 px-2 py-1.5 text-[11px] text-emerald-400">
-              <Check className="h-3 w-3" />
-              Updated. Restart server to apply.
-            </div>
-          )}
-
-          {updateStage === 'error' && (
-            <div className="flex items-start gap-1.5 rounded-md border border-destructive/20 bg-destructive/5 px-2 py-1.5 text-[11px] text-destructive">
-              <AlertCircle className="h-3 w-3 mt-0.5 shrink-0" />
-              <span>{updateError ?? 'An unknown error occurred'}</span>
-            </div>
-          )}
-
-          {isWorking && (
-            <div className="flex items-center gap-1.5 text-[11px] text-muted-foreground">
-              <Loader2 className="h-3 w-3 animate-spin" />
-              <span>
-                {updateStage === 'checking' && 'Checking for updates...'}
-                {updateStage === 'pulling' && 'Pulling latest changes...'}
-                {updateStage === 'installing' && 'Installing dependencies...'}
-              </span>
-            </div>
-          )}
-
-          {/* Actions */}
-          <div className="flex gap-2 pt-1">
-            <button
-              onClick={checkForUpdate}
-              disabled={isWorking}
-              className={cn(
-                'flex flex-1 items-center justify-center gap-1.5 rounded-md border border-border px-2 py-1 text-[11px]',
-                'text-muted-foreground hover:text-foreground hover:bg-surface-light transition-colors',
-                'disabled:opacity-40 disabled:cursor-not-allowed',
-              )}
-            >
-              <RefreshCw className={cn('h-3 w-3', updateStage === 'checking' && 'animate-spin')} />
-              Check
-            </button>
-            {updateAvailable && updateStage !== 'done' && (
-              <button
-                onClick={performUpdate}
-                disabled={isWorking}
-                className={cn(
-                  'flex flex-1 items-center justify-center gap-1.5 rounded-md px-2 py-1 text-[11px]',
-                  'bg-emerald-500/10 border border-emerald-500/20 text-emerald-400',
-                  'hover:bg-emerald-500/20 transition-colors',
-                  'disabled:opacity-40 disabled:cursor-not-allowed',
-                )}
-              >
-                <Download className="h-3 w-3" />
-                Update
-              </button>
-            )}
-          </div>
-        </div>
-      </PopoverContent>
-    </Popover>
-  );
-}

package/src/components/ViewModeSelector.tsx

@@ -1,114 +0,0 @@
-import { Columns3, Rows3 } from 'lucide-react';
-import { Popover, PopoverTrigger, PopoverContent } from '@/components/ui/popover';
-import { Button } from '@/components/ui/button';
-import { cn } from '@/lib/utils';
-import type { ViewMode, SwimGroupField } from '@/types';
-
-interface ViewModeSelectorProps {
-  viewMode: ViewMode;
-  groupField: SwimGroupField;
-  onViewModeChange: (mode: ViewMode) => void;
-  onGroupFieldChange: (field: SwimGroupField) => void;
-}
-
-const VIEW_MODES: { value: ViewMode; label: string; Icon: typeof Columns3 }[] = [
-  { value: 'kanban', label: 'Kanban', Icon: Columns3 },
-  { value: 'swimlane', label: 'Swimlane', Icon: Rows3 },
-];
-
-const GROUP_FIELDS: { value: SwimGroupField; label: string }[] = [
-  { value: 'priority', label: 'Priority' },
-  { value: 'category', label: 'Category' },
-  { value: 'tags', label: 'Tags' },
-  { value: 'effort', label: 'Effort' },
-  { value: 'dependencies', label: 'Dependencies' },
-];
-
-export function ViewModeSelector({
-  viewMode,
-  groupField,
-  onViewModeChange,
-  onGroupFieldChange,
-}: ViewModeSelectorProps) {
-  const ActiveIcon = viewMode === 'swimlane' ? Rows3 : Columns3;
-
-  return (
-    <Popover>
-      <PopoverTrigger asChild>
-        <Button
-          variant="outline"
-          size="sm"
-          className="gap-1.5 backdrop-blur-sm bg-white/[0.03] border-white/10"
-          aria-label="Toggle view mode"
-        >
-          <ActiveIcon className="h-3 w-3" />
-          {viewMode === 'swimlane' ? 'Swimlane' : 'Kanban'}
-        </Button>
-      </PopoverTrigger>
-
-      <PopoverContent align="end" className="filter-popover-glass !bg-transparent w-44">
-        {/* View mode selection */}
-        <div className="space-y-0.5">
-          <p className="px-2 pb-1 text-[10px] uppercase tracking-wider text-muted-foreground">View</p>
-          {VIEW_MODES.map(({ value, label, Icon }) => (
-            <button
-              key={value}
-              onClick={() => onViewModeChange(value)}
-              className={cn(
-                'flex w-full items-center gap-2 rounded px-2 py-1.5 text-xs transition-colors',
-                'hover:bg-white/[0.06]',
-                viewMode === value && 'bg-white/[0.06]',
-              )}
-            >
-              <span
-                className={cn(
-                  'flex h-3.5 w-3.5 shrink-0 items-center justify-center rounded-full border',
-                  viewMode === value ? 'border-primary bg-primary' : 'border-white/15',
-                )}
-              >
-                {viewMode === value && (
-                  <span className="h-1.5 w-1.5 rounded-full bg-primary-foreground" />
-                )}
-              </span>
-              <Icon className="h-3 w-3 text-muted-foreground" />
-              <span className={cn(viewMode === value && 'text-foreground')}>{label}</span>
-            </button>
-          ))}
-        </div>
-
-        {/* Group-by field — only visible in swimlane mode */}
-        {viewMode === 'swimlane' && (
-          <>
-            <div className="my-2 border-t border-white/[0.06]" />
-            <div className="space-y-0.5">
-              <p className="px-2 pb-1 text-[10px] uppercase tracking-wider text-muted-foreground">Group by</p>
-              {GROUP_FIELDS.map(({ value, label }) => (
-                <button
-                  key={value}
-                  onClick={() => onGroupFieldChange(value)}
-                  className={cn(
-                    'flex w-full items-center gap-2 rounded px-2 py-1.5 text-xs transition-colors',
-                    'hover:bg-white/[0.06]',
-                    groupField === value && 'bg-white/[0.06]',
-                  )}
-                >
-                  <span
-                    className={cn(
-                      'flex h-3.5 w-3.5 shrink-0 items-center justify-center rounded-full border',
-                      groupField === value ? 'border-primary bg-primary' : 'border-white/15',
-                    )}
-                  >
-                    {groupField === value && (
-                      <span className="h-1.5 w-1.5 rounded-full bg-primary-foreground" />
-                    )}
-                  </span>
-                  <span className={cn(groupField === value && 'text-foreground')}>{label}</span>
-                </button>
-              ))}
-            </div>
-          </>
-        )}
-      </PopoverContent>
-    </Popover>
-  );
-}

package/src/components/config/AgentChip.tsx

@@ -1,53 +0,0 @@
-import { Bot, X } from 'lucide-react';
-import { cn } from '@/lib/utils';
-import type { ResolvedAgent } from '@/types';
-
-interface AgentChipProps {
-  agent: ResolvedAgent;
-  mode?: 'always-on' | 'review';
-  selected?: boolean;
-  onClick?: () => void;
-  onRemove?: () => void;
-}
-
-export function AgentChip({ agent, mode, selected, onClick, onRemove }: AgentChipProps) {
-  const color = agent.color || '#8B5CF6';
-
-  return (
-    <button
-      type="button"
-      onClick={onClick}
-      data-pipeline-path={agent.filePath ?? undefined}
-      className={cn(
-        'inline-flex items-center gap-1.5 rounded-md border px-2 py-0.5 text-[11px] font-medium transition-colors',
-        'hover:brightness-125 cursor-pointer',
-        selected && 'glow-selected-pulse',
-      )}
-      style={{
-        color,
-        borderColor: `${color}4D`,
-        backgroundColor: `${color}1A`,
-        ...(selected ? { '--glow-color': `${color}A0`, '--glow-color-wide': `${color}40` } as React.CSSProperties : {}),
-      }}
-    >
-      {agent.emoji ? (
-        <span className="text-xs">{agent.emoji}</span>
-      ) : (
-        <Bot className="h-3 w-3 shrink-0" />
-      )}
-      <span className="truncate max-w-[100px]">{agent.label}</span>
-      {mode === 'always-on' && (
-        <span className="ml-0.5 h-1.5 w-1.5 rounded-full bg-green-500 shrink-0" title="Auto-invoke" />
-      )}
-      {onRemove && (
-        <span
-          role="button"
-          onClick={(e) => { e.stopPropagation(); onRemove(); }}
-          className="ml-0.5 rounded-full p-0.5 hover:bg-red-500/20"
-        >
-          <X className="h-2.5 w-2.5" />
-        </span>
-      )}
-    </button>
-  );
-}