orbital-command 0.1.4 → 0.3.0

package/src/components/ColumnMenu.tsx

@@ -1,99 +0,0 @@
-import { MoreVertical, ChevronUp, ChevronDown, Eye, EyeOff } from 'lucide-react';
-import { Popover, PopoverTrigger, PopoverContent } from '@/components/ui/popover';
-import { cn } from '@/lib/utils';
-import type { SortField, SortDirection } from '@/hooks/useBoardSettings';
-
-interface ColumnMenuProps {
-  sortField: SortField;
-  sortDirection: SortDirection;
-  onSetSort: (field: SortField) => void;
-  collapsed: boolean;
-  onToggleCollapse: () => void;
-}
-
-const SORT_OPTIONS: { field: SortField; label: string }[] = [
-  { field: 'id', label: 'Scope ID' },
-  { field: 'priority', label: 'Priority' },
-  { field: 'effort', label: 'Effort' },
-  { field: 'updated_at', label: 'Last Updated' },
-  { field: 'created_at', label: 'Created' },
-  { field: 'title', label: 'Alphabetical' },
-];
-
-export function ColumnMenu({
-  sortField,
-  sortDirection,
-  onSetSort,
-  collapsed,
-  onToggleCollapse,
-}: ColumnMenuProps) {
-  const Arrow = sortDirection === 'asc' ? ChevronUp : ChevronDown;
-
-  return (
-    <Popover>
-      <PopoverTrigger asChild>
-        <button
-          className="ml-1 flex h-5 w-5 shrink-0 items-center justify-center rounded text-muted-foreground hover:bg-white/[0.06] hover:text-foreground"
-          aria-label="Column menu"
-        >
-          <MoreVertical className="h-3 w-3" />
-        </button>
-      </PopoverTrigger>
-
-      <PopoverContent className="filter-popover-glass !bg-transparent w-44" align="end">
-        {/* Sort options */}
-        <div className="space-y-0.5">
-          <p className="px-2 pb-1 text-[10px] font-medium uppercase tracking-wider text-muted-foreground">
-            Sort by
-          </p>
-          {SORT_OPTIONS.map((opt) => {
-            const isActive = sortField === opt.field;
-            return (
-              <button
-                key={opt.field}
-                onClick={() => onSetSort(opt.field)}
-                className={cn(
-                  'flex w-full items-center gap-2 rounded px-2 py-1.5 text-xs transition-colors',
-                  'hover:bg-white/[0.06]',
-                  isActive && 'bg-white/[0.06]',
-                )}
-              >
-                {/* Radio indicator */}
-                <span
-                  className={cn(
-                    'flex h-3 w-3 shrink-0 items-center justify-center rounded-full border',
-                    isActive ? 'border-primary bg-primary' : 'border-white/15',
-                  )}
-                >
-                  {isActive && <span className="h-1.5 w-1.5 rounded-full bg-white" />}
-                </span>
-
-                <span className={cn('flex-1 text-left', isActive && 'text-foreground')}>
-                  {opt.label}
-                </span>
-
-                {isActive && <Arrow className="h-3 w-3 text-muted-foreground" />}
-              </button>
-            );
-          })}
-        </div>
-
-        {/* Separator */}
-        <div className="my-1.5 border-t border-white/10" />
-
-        {/* Collapse toggle */}
-        <button
-          onClick={onToggleCollapse}
-          className="flex w-full items-center gap-2 rounded px-2 py-1.5 text-xs transition-colors hover:bg-white/[0.06]"
-        >
-          {collapsed ? (
-            <Eye className="h-3 w-3 text-muted-foreground" />
-          ) : (
-            <EyeOff className="h-3 w-3 text-muted-foreground" />
-          )}
-          <span>{collapsed ? 'Expand column' : 'Collapse column'}</span>
-        </button>
-      </PopoverContent>
-    </Popover>
-  );
-}

package/src/components/DeployHistory.tsx

@@ -1,141 +0,0 @@
-import { useState } from 'react';
-import { format, formatDistanceToNow } from 'date-fns';
-import {
-  Rocket,
-  CheckCircle2,
-  XCircle,
-  Loader2,
-} from 'lucide-react';
-import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
-import { Badge } from '@/components/ui/badge';
-import { cn } from '@/lib/utils';
-import type { Deployment, DeployStatus } from '@/types';
-
-const STATUS_CONFIG: Record<DeployStatus, {
-  icon: typeof CheckCircle2;
-  color: string;
-  label: string;
-  animate?: string;
-}> = {
-  deploying: { icon: Loader2, color: 'text-accent-blue', label: 'Deploying', animate: 'animate-spin' },
-  healthy: { icon: CheckCircle2, color: 'text-bid-green', label: 'Healthy' },
-  failed: { icon: XCircle, color: 'text-ask-red', label: 'Failed' },
-  'rolled-back': { icon: XCircle, color: 'text-warning-amber', label: 'Rolled Back' },
-};
-
-const DEFAULT_VISIBLE = 20;
-
-interface Props {
-  deployments: Deployment[];
-}
-
-function groupByDate(deployments: Deployment[]): Map<string, Deployment[]> {
-  const groups = new Map<string, Deployment[]>();
-  for (const d of deployments) {
-    const dateKey = d.started_at ? format(new Date(d.started_at), 'yyyy-MM-dd') : 'Unknown';
-    const existing = groups.get(dateKey);
-    if (existing) {
-      existing.push(d);
-    } else {
-      groups.set(dateKey, [d]);
-    }
-  }
-  return groups;
-}
-
-function computeDuration(d: Deployment): string | null {
-  if (!d.started_at || !d.completed_at) return null;
-  const ms = new Date(d.completed_at).getTime() - new Date(d.started_at).getTime();
-  if (ms < 1000) return '<1s';
-  if (ms < 60_000) return `${Math.round(ms / 1000)}s`;
-  return `${Math.round(ms / 60_000)}m`;
-}
-
-export function DeployHistory({ deployments }: Props) {
-  const [showAll, setShowAll] = useState(false);
-  const visible = showAll ? deployments : deployments.slice(0, DEFAULT_VISIBLE);
-  const grouped = groupByDate(visible);
-
-  return (
-    <Card>
-      <CardHeader>
-        <CardTitle className="text-base">
-          Deployment History
-          <Badge variant="secondary" className="ml-2">
-            {deployments.length}
-          </Badge>
-        </CardTitle>
-      </CardHeader>
-      <CardContent>
-        {deployments.length === 0 ? (
-          <div className="py-8 text-center">
-            <Rocket className="mx-auto mb-3 h-10 w-10 text-muted-foreground/50" />
-            <p className="text-sm text-muted-foreground">
-              No deployments recorded yet.
-            </p>
-          </div>
-        ) : (
-          <div className="space-y-4">
-            {[...grouped.entries()].map(([dateKey, deploys]) => (
-              <div key={dateKey}>
-                <div className="sticky top-0 z-10 bg-card pb-1 pt-0.5">
-                  <span className="text-xxs font-medium uppercase tracking-wider text-muted-foreground">
-                    {dateKey === 'Unknown' ? 'Unknown date' : format(new Date(dateKey), 'EEEE, MMM d')}
-                  </span>
-                </div>
-                <div className="space-y-0.5">
-                  {deploys.map((deploy) => {
-                    const config = STATUS_CONFIG[deploy.status];
-                    const Icon = config.icon;
-                    const duration = computeDuration(deploy);
-                    return (
-                      <div
-                        key={deploy.id}
-                        className="flex items-center gap-4 rounded px-2.5 py-1.5 transition-colors hover:bg-surface-light"
-                      >
-                        <Icon className={cn('h-4 w-4 shrink-0', config.color, config.animate)} />
-                        <Badge variant="outline" className="capitalize shrink-0">
-                          {deploy.environment}
-                        </Badge>
-                        <span className="text-xs font-normal shrink-0">{config.label}</span>
-                        {deploy.commit_sha && (
-                          <code className="font-mono text-xs text-muted-foreground shrink-0">
-                            {deploy.commit_sha.slice(0, 7)}
-                          </code>
-                        )}
-                        {deploy.branch && (
-                          <span className="truncate text-xs text-muted-foreground">
-                            {deploy.branch}
-                          </span>
-                        )}
-                        {duration && (
-                          <span className="font-mono text-xs text-muted-foreground/60 shrink-0">
-                            {duration}
-                          </span>
-                        )}
-                        <span className="ml-auto text-xs text-muted-foreground/60 shrink-0">
-                          {deploy.started_at
-                            ? formatDistanceToNow(new Date(deploy.started_at), { addSuffix: true })
-                            : '—'}
-                        </span>
-                      </div>
-                    );
-                  })}
-                </div>
-              </div>
-            ))}
-
-            {!showAll && deployments.length > DEFAULT_VISIBLE && (
-              <button
-                onClick={() => setShowAll(true)}
-                className="w-full rounded border border-border py-2 text-xs text-muted-foreground transition-colors hover:bg-surface-light hover:text-foreground"
-              >
-                Show all {deployments.length} deployments
-              </button>
-            )}
-          </div>
-        )}
-      </CardContent>
-    </Card>
-  );
-}

package/src/components/DispatchModal.tsx

@@ -1,164 +0,0 @@
-import { useState, useEffect } from 'react';
-import { ArrowRight, AlertTriangle, Terminal, Check } from 'lucide-react';
-import {
-  Dialog,
-  DialogContent,
-  DialogHeader,
-  DialogTitle,
-  DialogDescription,
-} from '@/components/ui/dialog';
-import { Button } from '@/components/ui/button';
-import { Badge } from '@/components/ui/badge';
-import { cn, formatScopeId } from '@/lib/utils';
-import type { WorkflowEdge } from '../../shared/workflow-config';
-import type { Scope } from '@/types';
-
-interface DispatchModalProps {
-  open: boolean;
-  scope: Scope | null;
-  transition: WorkflowEdge | null;
-  hasActiveSession: boolean;
-  onConfirm: () => void;
-  onCancel: () => void;
-}
-
-export function DispatchModal({
-  open,
-  scope,
-  transition,
-  hasActiveSession,
-  onConfirm,
-  onCancel,
-}: DispatchModalProps) {
-  const [checked, setChecked] = useState<Set<number>>(new Set());
-  const [loading, setLoading] = useState(false);
-
-  const checklist = transition?.checklist ?? [];
-  const allChecked = checklist.length === 0 || checked.size === checklist.length;
-
-  // Reset state when modal opens
-  useEffect(() => {
-    if (open) {
-      setChecked(new Set());
-      setLoading(false);
-    }
-  }, [open]);
-
-  if (!scope || !transition) return null;
-
-  const command = transition.command?.replace('{id}', String(scope.id)) ?? null;
-
-  function toggleCheck(idx: number) {
-    setChecked((prev) => {
-      const next = new Set(prev);
-      if (next.has(idx)) next.delete(idx);
-      else next.add(idx);
-      return next;
-    });
-  }
-
-  async function handleConfirm() {
-    setLoading(true);
-    onConfirm();
-  }
-
-  return (
-    <Dialog open={open} onOpenChange={(isOpen) => { if (!isOpen) onCancel(); }}>
-      <DialogContent className="max-w-md p-0 gap-0">
-        <DialogHeader className="px-5 pt-4 pb-3">
-          {/* Transition arrow */}
-          <div className="flex items-center gap-2 mb-2">
-            <Badge variant="outline" className="text-xxs capitalize">{transition.from}</Badge>
-            <ArrowRight className="h-3.5 w-3.5 text-muted-foreground" />
-            <Badge variant="default" className="text-xxs capitalize [color:#000]">{transition.to}</Badge>
-          </div>
-          <DialogTitle className="text-sm font-normal">
-            {transition.label}
-          </DialogTitle>
-          <DialogDescription className="text-xs text-muted-foreground mt-1">
-            {transition.description}
-          </DialogDescription>
-        </DialogHeader>
-
-        <div className="px-5 pb-4 space-y-3">
-          {/* Scope info */}
-          <div className="flex items-center gap-2 text-xs">
-            <span className="font-mono text-muted-foreground">{formatScopeId(scope.id)}</span>
-            <span className="font-light truncate">{scope.title}</span>
-            {scope.category && (
-              <Badge variant="secondary" className="ml-auto text-xxs">{scope.category}</Badge>
-            )}
-          </div>
-
-          {/* Command block */}
-          {command && (
-            <div className="flex items-center gap-2 rounded border border-border bg-black/40 px-3 py-2">
-              <Terminal className="h-3.5 w-3.5 shrink-0 text-primary" />
-              <code className="text-xs font-mono text-primary">{command}</code>
-            </div>
-          )}
-
-          {/* Checklist */}
-          {checklist.length > 0 && (
-            <div className="space-y-1.5">
-              <p className="text-xxs font-medium text-muted-foreground uppercase tracking-wider">
-                Pre-launch checklist
-              </p>
-              {checklist.map((item, idx) => (
-                <button
-                  key={idx}
-                  onClick={() => toggleCheck(idx)}
-                  className={cn(
-                    'flex w-full items-center gap-2 rounded px-2.5 py-1.5 text-xs text-left transition-colors',
-                    checked.has(idx)
-                      ? 'bg-primary/10 text-foreground'
-                      : 'bg-muted/30 text-muted-foreground hover:bg-muted/50'
-                  )}
-                >
-                  <div className={cn(
-                    'flex h-4 w-4 shrink-0 items-center justify-center rounded-sm border transition-colors',
-                    checked.has(idx)
-                      ? 'border-primary bg-primary text-primary-foreground'
-                      : 'border-muted-foreground/30'
-                  )}>
-                    {checked.has(idx) && <Check className="h-2.5 w-2.5" />}
-                  </div>
-                  <span className="font-light">{item}</span>
-                </button>
-              ))}
-            </div>
-          )}
-
-          {/* Active session warning */}
-          {hasActiveSession && (
-            <div className={cn(
-              'flex items-start gap-2 rounded border px-3 py-2 text-xs',
-              'border-warning-amber/30 bg-warning-amber/10 text-warning-amber'
-            )}>
-              <AlertTriangle className="mt-0.5 h-3.5 w-3.5 shrink-0" />
-              <span>A CLI session is already running for this scope. Launching will start a new one.</span>
-            </div>
-          )}
-
-          {/* Actions */}
-          <div className="flex items-center gap-2 pt-1">
-            <Button
-              onClick={handleConfirm}
-              disabled={!allChecked || loading}
-              className="flex-1"
-            >
-              {loading ? 'Launching...' : command ? 'Launch in iTerm' : 'Confirm Move'}
-            </Button>
-            <Button
-              variant="ghost"
-              onClick={onCancel}
-              disabled={loading}
-            >
-              Cancel
-            </Button>
-          </div>
-        </div>
-      </DialogContent>
-    </Dialog>
-  );
-}

package/src/components/DispatchPopover.tsx

@@ -1,139 +0,0 @@
-import { useEffect, useRef, useState } from 'react';
-import { ArrowRight, AlertTriangle, Terminal, ExternalLink } from 'lucide-react';
-import {
-  Dialog,
-  DialogContent,
-} from '@/components/ui/dialog';
-import { Button } from '@/components/ui/button';
-import { Badge } from '@/components/ui/badge';
-import { cn, formatScopeId } from '@/lib/utils';
-import type { WorkflowEdge } from '../../shared/workflow-config';
-import type { Scope } from '@/types';
-
-interface DispatchPopoverProps {
-  open: boolean;
-  scope: Scope | null;
-  transition: WorkflowEdge | null;
-  hasActiveSession: boolean;
-  onConfirm: () => void;
-  onCancel: () => void;
-  onViewDetails: () => void;
-}
-
-export function DispatchPopover({
-  open,
-  scope,
-  transition,
-  hasActiveSession,
-  onConfirm,
-  onCancel,
-  onViewDetails,
-}: DispatchPopoverProps) {
-  const launchRef = useRef<HTMLButtonElement>(null);
-  const [loading, setLoading] = useState(false);
-
-  // Auto-focus launch button when dialog opens
-  useEffect(() => {
-    if (open) {
-      setTimeout(() => launchRef.current?.focus(), 100);
-      setLoading(false);
-    }
-  }, [open]);
-
-  if (!scope || !transition) return null;
-
-  const command = transition.command?.replace('{id}', String(scope.id)) ?? null;
-  const entryPointPromotion = transition.direction === 'forward' && !transition.command && transition.from !== transition.to;
-  const isIdeaPromotion = scope.status === transition.from && entryPointPromotion;
-  const displayCommand = isIdeaPromotion ? '/scope-create' : command;
-  const actionLabel = isIdeaPromotion ? 'Launch' : command ? 'Launch' : 'Move';
-
-  function handleConfirm() {
-    setLoading(true);
-    onConfirm();
-  }
-
-  return (
-    <Dialog open={open} onOpenChange={(isOpen) => { if (!isOpen) onCancel(); }}>
-      <DialogContent className="max-w-xs p-3 gap-0">
-        {/* Transition arrow */}
-        <div className="mb-2.5 flex items-center gap-2">
-          <Badge variant="outline" className="text-xxs capitalize">{transition.from}</Badge>
-          <ArrowRight className="h-3 w-3 text-muted-foreground" />
-          <Badge variant="default" className="text-xxs capitalize [color:#000]">{transition.to}</Badge>
-        </div>
-
-        {/* Scope preview */}
-        <div className="mb-2 text-xs text-muted-foreground">
-          {isIdeaPromotion ? (
-            <span className="font-light">{scope.title}</span>
-          ) : (
-            <>
-              <span className="font-mono">{formatScopeId(scope.id)}</span>
-              {' '}
-              <span className="font-light">{scope.title}</span>
-            </>
-          )}
-        </div>
-
-        {/* Command preview */}
-        {displayCommand && (
-          <div className="mb-3 flex items-center gap-1.5 rounded bg-black/40 px-2 py-1.5">
-            <Terminal className="h-3 w-3 shrink-0 text-primary" />
-            <code className="text-xxs font-mono text-primary">{displayCommand}</code>
-          </div>
-        )}
-
-        {/* Idea promotion info */}
-        {isIdeaPromotion && (
-          <p className="mb-3 text-xxs text-muted-foreground">
-            Creates a scope document from this idea
-          </p>
-        )}
-
-        {/* Active session warning */}
-        {hasActiveSession && (
-          <div className={cn(
-            'mb-3 flex items-start gap-1.5 rounded border px-2 py-1.5 text-xxs',
-            'border-warning-amber/30 bg-warning-amber/10 text-warning-amber'
-          )}>
-            <AlertTriangle className="mt-0.5 h-3 w-3 shrink-0" />
-            <span>A CLI session is already running for this scope.</span>
-          </div>
-        )}
-
-        {/* Actions */}
-        <div className="flex items-center gap-2">
-          <Button
-            ref={launchRef}
-            size="sm"
-            onClick={handleConfirm}
-            disabled={loading}
-            className="flex-1"
-          >
-            {loading ? 'Launching...' : actionLabel}
-          </Button>
-          <Button
-            size="sm"
-            variant="ghost"
-            onClick={onCancel}
-            disabled={loading}
-          >
-            Cancel
-          </Button>
-        </div>
-
-        {/* View details link */}
-        {(command || isIdeaPromotion) && (
-          <button
-            onClick={onViewDetails}
-            className="mt-2 flex items-center gap-1 text-xxs text-muted-foreground hover:text-foreground transition-colors"
-          >
-            <ExternalLink className="h-2.5 w-2.5" />
-            View Details
-          </button>
-        )}
-      </DialogContent>
-    </Dialog>
-  );
-}

package/src/components/DragOverlay.tsx

@@ -1,25 +0,0 @@
-import { DragOverlay as DndDragOverlay } from '@dnd-kit/core';
-import { ScopeCard } from './ScopeCard';
-import { SprintDragPreview } from './SprintContainer';
-import type { Scope, Sprint, CardDisplayConfig } from '@/types';
-
-interface DragOverlayProps {
-  activeScope: Scope | null;
-  activeSprint?: Sprint | null;
-  cardDisplay?: CardDisplayConfig;
-}
-
-export function DragOverlay({ activeScope, activeSprint, cardDisplay }: DragOverlayProps) {
-  return (
-    <DndDragOverlay dropAnimation={null}>
-      {activeScope && (
-        <div className="w-72 rotate-2 opacity-90 shadow-xl shadow-black/40">
-          <ScopeCard scope={activeScope} cardDisplay={cardDisplay} />
-        </div>
-      )}
-      {activeSprint && (
-        <SprintDragPreview sprint={activeSprint} />
-      )}
-    </DndDragOverlay>
-  );
-}