@almadar/cli 1.0.6 → 1.0.8

package/shells/typescript-shell/packages/client/src/clients/inspection-system/molecules/InspectionTimeline.tsx

@@ -1,253 +0,0 @@
-/**
- * InspectionTimeline
- *
- * Timeline view of inspection events and activities.
- * Shows chronological history of inspection progress.
- *
- * Event Contract:
- * - Emits: UI:TIMELINE_ITEM_CLICK { itemId, item }
- */
-
-import React, { useCallback } from "react";
-import { cn } from "../../../lib/cn";
-import { Box } from "../../../components/atoms/Box";
-import { VStack, HStack } from "../../../components/atoms/Stack";
-import { Typography } from "../../../components/atoms/Typography";
-import { Badge } from "../../../components/atoms/Badge";
-import { useEventBus } from "../../../hooks/useEventBus";
-import {
-  Clock,
-  CheckCircle,
-  AlertCircle,
-  FileText,
-  User,
-  Camera,
-  MessageSquare,
-  Flag,
-  Play,
-  Pause,
-} from "lucide-react";
-
-export type TimelineEventType =
-  | "start"
-  | "pause"
-  | "resume"
-  | "participant_added"
-  | "rule_checked"
-  | "photo_added"
-  | "objection"
-  | "finding"
-  | "document"
-  | "complete"
-  | "note";
-
-export interface TimelineItem {
-  id: string;
-  type: TimelineEventType;
-  title: string;
-  description?: string;
-  timestamp: string;
-  user?: string;
-  metadata?: Record<string, string>;
-}
-
-export interface InspectionTimelineProps {
-  /** Timeline items */
-  items: TimelineItem[];
-  /** Show relative time */
-  relativeTime?: boolean;
-  /** Clickable items */
-  clickable?: boolean;
-  /** Compact mode */
-  compact?: boolean;
-  /** Additional CSS classes */
-  className?: string;
-  /** Item click handler */
-  onItemClick?: (item: TimelineItem) => void;
-}
-
-const eventConfig: Record<
-  TimelineEventType,
-  { icon: typeof Clock; color: string; bgColor: string }
-> = {
-  start: {
-    icon: Play,
-    color: "text-green-600",
-    bgColor: "bg-green-100",
-  },
-  pause: {
-    icon: Pause,
-    color: "text-amber-600",
-    bgColor: "bg-amber-100",
-  },
-  resume: {
-    icon: Play,
-    color: "text-blue-600",
-    bgColor: "bg-blue-100",
-  },
-  participant_added: {
-    icon: User,
-    color: "text-purple-600",
-    bgColor: "bg-purple-100",
-  },
-  rule_checked: {
-    icon: CheckCircle,
-    color: "text-green-600",
-    bgColor: "bg-green-100",
-  },
-  photo_added: {
-    icon: Camera,
-    color: "text-blue-600",
-    bgColor: "bg-blue-100",
-  },
-  objection: {
-    icon: AlertCircle,
-    color: "text-red-600",
-    bgColor: "bg-red-100",
-  },
-  finding: {
-    icon: Flag,
-    color: "text-orange-600",
-    bgColor: "bg-orange-100",
-  },
-  document: {
-    icon: FileText,
-    color: "text-slate-600",
-    bgColor: "bg-slate-100",
-  },
-  complete: {
-    icon: CheckCircle,
-    color: "text-green-600",
-    bgColor: "bg-green-100",
-  },
-  note: {
-    icon: MessageSquare,
-    color: "text-neutral-600",
-    bgColor: "bg-neutral-100",
-  },
-};
-
-// Format relative time
-const formatRelativeTime = (timestamp: string): string => {
-  const date = new Date(timestamp);
-  const now = new Date();
-  const diffMs = now.getTime() - date.getTime();
-  const diffMins = Math.floor(diffMs / 60000);
-  const diffHours = Math.floor(diffMins / 60);
-  const diffDays = Math.floor(diffHours / 24);
-
-  if (diffMins < 1) return "Just now";
-  if (diffMins < 60) return `${diffMins}m ago`;
-  if (diffHours < 24) return `${diffHours}h ago`;
-  if (diffDays < 7) return `${diffDays}d ago`;
-  return date.toLocaleDateString();
-};
-
-export const InspectionTimeline: React.FC<InspectionTimelineProps> = ({
-  items,
-  relativeTime = true,
-  clickable = false,
-  compact = false,
-  className,
-  onItemClick,
-}) => {
-  const eventBus = useEventBus();
-
-  const handleItemClick = useCallback(
-    (item: TimelineItem) => {
-      if (!clickable) return;
-      onItemClick?.(item);
-      eventBus.emit("UI:TIMELINE_ITEM_CLICK", { itemId: item.id, item });
-    },
-    [clickable, onItemClick, eventBus]
-  );
-
-  if (items.length === 0) {
-    return (
-      <Box
-        padding="lg"
-        rounded="lg"
-        className={cn("bg-neutral-50 text-center", className)}
-      >
-        <VStack align="center" gap="sm" className="text-neutral-400">
-          <Clock className="h-8 w-8" />
-          <Typography variant="body">No activity recorded yet</Typography>
-        </VStack>
-      </Box>
-    );
-  }
-
-  return (
-    <VStack gap="none" className={cn("relative", className)}>
-      {/* Timeline line */}
-      <Box
-        className="absolute left-4 top-0 bottom-0 w-0.5 bg-neutral-200"
-        style={{ transform: "translateX(-50%)" }}
-      />
-
-      {items.map((item, index) => {
-        const config = eventConfig[item.type];
-        const Icon = config.icon;
-        const isLast = index === items.length - 1;
-
-        return (
-          <Box
-            key={item.id}
-            className={cn(
-              "relative pl-10",
-              !isLast && (compact ? "pb-4" : "pb-6"),
-              clickable && "cursor-pointer hover:bg-neutral-50 -ml-2 pl-12 pr-2 py-2 rounded-lg"
-            )}
-            onClick={() => handleItemClick(item)}
-          >
-            {/* Icon */}
-            <Box
-              rounded="full"
-              padding="xs"
-              className={cn(
-                "absolute left-0 z-10",
-                config.bgColor,
-                config.color
-              )}
-              style={{ transform: "translateX(-50%)" }}
-            >
-              <Icon className={compact ? "h-3 w-3" : "h-4 w-4"} />
-            </Box>
-
-            {/* Content */}
-            <VStack gap="xs">
-              <HStack justify="between" align="start" wrap>
-                <Typography
-                  variant={compact ? "small" : "body"}
-                  className="font-medium text-neutral-800"
-                >
-                  {item.title}
-                </Typography>
-                <Typography variant="small" className="text-neutral-500">
-                  {relativeTime
-                    ? formatRelativeTime(item.timestamp)
-                    : new Date(item.timestamp).toLocaleString()}
-                </Typography>
-              </HStack>
-
-              {item.description && !compact && (
-                <Typography variant="small" className="text-neutral-600">
-                  {item.description}
-                </Typography>
-              )}
-
-              {item.user && (
-                <HStack gap="xs" align="center" className="text-neutral-500">
-                  <User className="h-3 w-3" />
-                  <Typography variant="small">{item.user}</Typography>
-                </HStack>
-              )}
-            </VStack>
-          </Box>
-        );
-      })}
-    </VStack>
-  );
-};
-
-InspectionTimeline.displayName = "InspectionTimeline";

package/shells/typescript-shell/packages/client/src/clients/inspection-system/molecules/ObjectionRecorder.tsx

@@ -1,213 +0,0 @@
-/**
- * ObjectionRecorder
- *
- * Records objections from inspection participants.
- * Used to capture disagreements or concerns during inspections.
- *
- * Event Contract:
- * - Emits: UI:OBJECTION_SUBMITTED { objection, participantId }
- */
-
-import React, { useState, useCallback } from "react";
-import { cn } from "../../../lib/cn";
-import { Box } from "../../../components/atoms/Box";
-import { VStack, HStack } from "../../../components/atoms/Stack";
-import { Typography } from "../../../components/atoms/Typography";
-import { Button } from "../../../components/atoms/Button";
-import { Card } from "../../../components/atoms/Card";
-import { Textarea } from "../../../components/atoms/Textarea";
-import { Select } from "../../../components/atoms/Select";
-import { Badge } from "../../../components/atoms/Badge";
-import { useEventBus } from "../../../hooks/useEventBus";
-import { AlertCircle, Plus, User, Clock } from "lucide-react";
-
-export interface Objection {
-  id: string;
-  participantId: string;
-  participantName: string;
-  text: string;
-  timestamp: string;
-}
-
-export interface ObjectionRecorderProps {
-  /** Existing objections */
-  objections?: Objection[];
-  /** Available participants */
-  participants?: Array<{ id: string; name: string }>;
-  /** Inspection ID */
-  inspectionId?: string;
-  /** Read-only mode */
-  readOnly?: boolean;
-  /** Additional CSS classes */
-  className?: string;
-  /** Objection submitted handler - can receive objection object or sectionRef + text */
-  onSubmit?: (
-    objectionOrSectionRef: { participantId: string; text: string } | string,
-    text?: string,
-  ) => void;
-}
-
-export const ObjectionRecorder: React.FC<ObjectionRecorderProps> = ({
-  objections = [],
-  participants = [],
-  inspectionId,
-  readOnly = false,
-  className,
-  onSubmit,
-}) => {
-  const eventBus = useEventBus();
-  const [isAdding, setIsAdding] = useState(false);
-  const [selectedParticipant, setSelectedParticipant] = useState("");
-  const [objectionText, setObjectionText] = useState("");
-
-  const handleSubmit = useCallback(() => {
-    if (!selectedParticipant || !objectionText.trim()) return;
-
-    const objectionData = {
-      participantId: selectedParticipant,
-      text: objectionText.trim(),
-    };
-
-    onSubmit?.(objectionData);
-    eventBus.emit("UI:OBJECTION_SUBMITTED", {
-      objection: objectionData,
-      inspectionId,
-    });
-
-    // Reset form
-    setSelectedParticipant("");
-    setObjectionText("");
-    setIsAdding(false);
-  }, [selectedParticipant, objectionText, inspectionId, onSubmit, eventBus]);
-
-  const handleCancel = useCallback(() => {
-    setSelectedParticipant("");
-    setObjectionText("");
-    setIsAdding(false);
-  }, []);
-
-  return (
-    <VStack gap="md" className={cn("w-full", className)}>
-      {/* Header */}
-      <HStack justify="between" align="center">
-        <HStack gap="sm" align="center">
-          <AlertCircle className="h-5 w-5 text-amber-500" />
-          <Typography variant="h4" className="text-neutral-800">
-            Objections
-          </Typography>
-          {objections.length > 0 && (
-            <Badge variant="warning">{objections.length}</Badge>
-          )}
-        </HStack>
-
-        {!readOnly && !isAdding && (
-          <Button
-            variant="secondary"
-            size="sm"
-            onClick={() => setIsAdding(true)}
-            className="gap-1"
-          >
-            <Plus className="h-4 w-4" />
-            Record Objection
-          </Button>
-        )}
-      </HStack>
-
-      {/* Add objection form */}
-      {isAdding && (
-        <Card className="p-4 border-amber-200 bg-amber-50">
-          <VStack gap="md">
-            <Typography variant="body" className="font-medium text-amber-800">
-              Record New Objection
-            </Typography>
-
-            <VStack gap="xs">
-              <Typography variant="label" className="text-neutral-700">
-                Participant
-              </Typography>
-              <Select
-                value={selectedParticipant}
-                onChange={(e) => setSelectedParticipant(e.target.value)}
-                className="w-full"
-                placeholder="Select participant..."
-                options={participants.map((p) => ({
-                  value: p.id,
-                  label: p.name,
-                }))}
-              />
-            </VStack>
-
-            <VStack gap="xs">
-              <Typography variant="label" className="text-neutral-700">
-                Objection Details
-              </Typography>
-              <Textarea
-                value={objectionText}
-                onChange={(e) => setObjectionText(e.target.value)}
-                placeholder="Describe the objection or concern..."
-                rows={3}
-                className="w-full"
-              />
-            </VStack>
-
-            <HStack gap="sm" justify="end">
-              <Button variant="secondary" size="sm" onClick={handleCancel}>
-                Cancel
-              </Button>
-              <Button
-                variant="primary"
-                size="sm"
-                onClick={handleSubmit}
-                disabled={!selectedParticipant || !objectionText.trim()}
-              >
-                Record Objection
-              </Button>
-            </HStack>
-          </VStack>
-        </Card>
-      )}
-
-      {/* Objections list */}
-      {objections.length === 0 && !isAdding ? (
-        <Card className="p-6">
-          <VStack align="center" gap="sm" className="text-neutral-400">
-            <AlertCircle className="h-8 w-8" />
-            <Typography variant="body">No objections recorded</Typography>
-            <Typography variant="small">
-              Objections will be documented in the final report
-            </Typography>
-          </VStack>
-        </Card>
-      ) : (
-        <VStack gap="sm">
-          {objections.map((objection) => (
-            <Card key={objection.id} className="p-4 border-amber-100">
-              <VStack gap="sm">
-                <HStack justify="between" align="start">
-                  <HStack gap="sm" align="center">
-                    <User className="h-4 w-4 text-neutral-500" />
-                    <Typography variant="body" className="font-medium">
-                      {objection.participantName}
-                    </Typography>
-                  </HStack>
-                  <HStack gap="xs" align="center" className="text-neutral-500">
-                    <Clock className="h-3 w-3" />
-                    <Typography variant="small">
-                      {new Date(objection.timestamp).toLocaleString()}
-                    </Typography>
-                  </HStack>
-                </HStack>
-
-                <Typography variant="body" className="text-neutral-700">
-                  {objection.text}
-                </Typography>
-              </VStack>
-            </Card>
-          ))}
-        </VStack>
-      )}
-    </VStack>
-  );
-};
-
-ObjectionRecorder.displayName = "ObjectionRecorder";

package/shells/typescript-shell/packages/client/src/clients/inspection-system/molecules/ParticipantList.stories.tsx

@@ -1,86 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react";
-import { ParticipantList } from "./ParticipantList";
-
-const meta: Meta<typeof ParticipantList> = {
-  title: "Clients/Inspection-System/Molecules/ParticipantList",
-  component: ParticipantList,
-  parameters: {
-    layout: "padded",
-  },
-  tags: ["autodocs"],
-};
-
-export default meta;
-type Story = StoryObj<typeof ParticipantList>;
-
-const sampleParticipants = [
-  {
-    id: "p1",
-    name: "John",
-    surname: "Smith",
-    positionInCompany: "General Manager",
-    contactInfo: "+1 555-0123",
-    addedAt: "2024-01-15T10:30:00Z",
-  },
-  {
-    id: "p2",
-    name: "Sarah",
-    surname: "Johnson",
-    positionInCompany: "Operations Director",
-    contactInfo: "sarah.j@company.com",
-    addedAt: "2024-01-15T10:35:00Z",
-  },
-  {
-    id: "p3",
-    name: "Mike",
-    surname: "Williams",
-    positionInCompany: "Safety Officer",
-    addedAt: "2024-01-15T10:40:00Z",
-  },
-];
-
-export const Default: Story = {
-  args: {
-    inspectionId: "insp-123",
-    participants: sampleParticipants,
-  },
-};
-
-export const Empty: Story = {
-  args: {
-    inspectionId: "insp-123",
-    participants: [],
-  },
-};
-
-export const SingleParticipant: Story = {
-  args: {
-    inspectionId: "insp-123",
-    participants: [sampleParticipants[0]],
-    minParticipants: 1,
-  },
-};
-
-export const ReadOnly: Story = {
-  args: {
-    inspectionId: "insp-123",
-    participants: sampleParticipants,
-    readOnly: true,
-  },
-};
-
-export const MinimumRequired: Story = {
-  args: {
-    inspectionId: "insp-123",
-    participants: [],
-    minParticipants: 2,
-  },
-};
-
-export const NoEdit: Story = {
-  args: {
-    inspectionId: "insp-123",
-    participants: sampleParticipants,
-    allowEdit: false,
-  },
-};