@principal-ai/subsystems-react 0.17.0 → 0.18.0

package/src/stories/data/activity-feed-analytics.dashboard.json

@@ -1,300 +0,0 @@
-{
-  "$schema": "https://principal.ai/schemas/dashboard.v1.json",
-  "id": "activity-feed-analytics",
-  "name": "Activity Feed Analytics",
-  "description": "User engagement metrics for the activity feed home page",
-  "owner": "web-ade-team",
-
-  "externalLinks": {
-    "grafana": "https://grafana.internal/d/activity-feed",
-    "runbook": "https://wiki.internal/runbooks/activity-feed"
-  },
-
-  "metrics": [
-    {
-      "id": "mobile-view-percentage",
-      "name": "Mobile View %",
-      "description": "Percentage of activity feed loads on mobile devices",
-      "type": "gauge",
-      "unit": "%",
-
-      "sources": [{
-        "storyboard": "activity-feed",
-        "workflow": "feed-load",
-        "nodes": ["init-started"],
-        "event": "activity-feed.init.started"
-      }],
-
-      "query": {
-        "derivation": "percentage",
-        "filter": "isMobile = true",
-        "window": "1h"
-      },
-
-      "display": {
-        "component": "MetricCard",
-        "size": "medium",
-        "showTrend": true,
-        "showSparkline": true
-      },
-
-      "_mockData": {
-        "current": 34.2,
-        "previous": 31.8,
-        "trend": "up",
-        "series": [
-          { "date": "2024-03-27T00:00", "value": 31.2 },
-          { "date": "2024-03-27T01:00", "value": 32.1 },
-          { "date": "2024-03-27T02:00", "value": 33.0 },
-          { "date": "2024-03-27T03:00", "value": 32.5 },
-          { "date": "2024-03-27T04:00", "value": 33.8 },
-          { "date": "2024-03-27T05:00", "value": 34.2 }
-        ]
-      }
-    },
-    {
-      "id": "total-page-views",
-      "name": "Total Page Views",
-      "description": "Total home page views in the last hour",
-      "type": "counter",
-      "unit": "views",
-
-      "sources": [{
-        "storyboard": "activity-feed",
-        "workflow": "feed-load",
-        "event": "activity-feed.init.started"
-      }],
-
-      "query": {
-        "derivation": "count",
-        "window": "1h"
-      },
-
-      "display": {
-        "component": "MetricCard",
-        "size": "medium",
-        "showSparkline": true
-      },
-
-      "_mockData": {
-        "current": 28493,
-        "previous": 26102,
-        "trend": "up",
-        "series": [
-          { "date": "2024-03-27T00:00", "value": 25102 },
-          { "date": "2024-03-27T01:00", "value": 26234 },
-          { "date": "2024-03-27T02:00", "value": 25890 },
-          { "date": "2024-03-27T03:00", "value": 27102 },
-          { "date": "2024-03-27T04:00", "value": 28100 },
-          { "date": "2024-03-27T05:00", "value": 28493 }
-        ]
-      }
-    },
-    {
-      "id": "error-rate",
-      "name": "Error Rate",
-      "description": "Percentage of feed loads that resulted in errors",
-      "type": "gauge",
-      "unit": "%",
-
-      "sources": [{
-        "storyboard": "activity-feed",
-        "workflow": "feed-load",
-        "nodes": ["init-error"]
-      }],
-
-      "query": {
-        "derivation": "error_rate",
-        "window": "1h"
-      },
-
-      "thresholds": {
-        "warning": 2.0,
-        "critical": 5.0
-      },
-
-      "display": {
-        "component": "MetricCard",
-        "size": "medium",
-        "showTrend": true,
-        "showSparkline": true
-      },
-
-      "_mockData": {
-        "current": 0.8,
-        "previous": 1.2,
-        "trend": "down",
-        "series": [
-          { "date": "2024-03-27T00:00", "value": 1.4 },
-          { "date": "2024-03-27T01:00", "value": 1.2 },
-          { "date": "2024-03-27T02:00", "value": 1.1 },
-          { "date": "2024-03-27T03:00", "value": 0.9 },
-          { "date": "2024-03-27T04:00", "value": 0.85 },
-          { "date": "2024-03-27T05:00", "value": 0.8 }
-        ]
-      }
-    },
-    {
-      "id": "daily-home-page-views",
-      "name": "Daily Page Views",
-      "description": "Home page views per day for the last 7 days",
-      "type": "counter",
-      "unit": "views",
-
-      "sources": [{
-        "storyboard": "activity-feed",
-        "workflow": "feed-load",
-        "event": "activity-feed.init.started"
-      }],
-
-      "query": {
-        "derivation": "count",
-        "timeGroup": "day"
-      },
-
-      "display": {
-        "component": "LineChart",
-        "size": "large"
-      },
-
-      "_mockData": {
-        "series": [
-          { "date": "2024-03-21", "value": 28493 },
-          { "date": "2024-03-22", "value": 31247 },
-          { "date": "2024-03-23", "value": 29102 },
-          { "date": "2024-03-24", "value": 27856 },
-          { "date": "2024-03-25", "value": 30421 },
-          { "date": "2024-03-26", "value": 32109 },
-          { "date": "2024-03-27", "value": 29876 }
-        ]
-      }
-    },
-    {
-      "id": "views-by-viewport",
-      "name": "Views by Viewport",
-      "description": "Daily page views split by mobile vs desktop",
-      "type": "counter",
-      "unit": "views",
-
-      "sources": [{
-        "storyboard": "activity-feed",
-        "workflow": "feed-load",
-        "event": "activity-feed.init.started"
-      }],
-
-      "query": {
-        "derivation": "count",
-        "groupBy": ["isMobile"],
-        "timeGroup": "day"
-      },
-
-      "display": {
-        "component": "StackedBarChart",
-        "size": "large"
-      },
-
-      "_mockData": {
-        "series": [
-          { "date": "2024-03-21", "mobile": 9847, "desktop": 18646 },
-          { "date": "2024-03-22", "mobile": 11023, "desktop": 20224 },
-          { "date": "2024-03-23", "mobile": 10156, "desktop": 18946 },
-          { "date": "2024-03-24", "mobile": 9234, "desktop": 18622 },
-          { "date": "2024-03-25", "mobile": 10567, "desktop": 19854 },
-          { "date": "2024-03-26", "mobile": 11234, "desktop": 20875 },
-          { "date": "2024-03-27", "mobile": 10423, "desktop": 19453 }
-        ]
-      }
-    },
-    {
-      "id": "mobile-interaction-rate",
-      "name": "Mobile Interactions/Session",
-      "description": "Average number of interactions per mobile session",
-      "type": "gauge",
-      "unit": "interactions",
-
-      "sources": [{
-        "storyboard": "activity-feed",
-        "workflow": "mobile-interaction",
-        "nodes": ["card-swipe", "commit-browse"]
-      }],
-
-      "query": {
-        "derivation": "avg",
-        "window": "1h"
-      },
-
-      "display": {
-        "component": "MetricCard",
-        "size": "medium"
-      },
-
-      "_mockData": {
-        "current": 4.7,
-        "previous": 4.2,
-        "trend": "up"
-      }
-    },
-    {
-      "id": "desktop-search-usage",
-      "name": "Search Usage Rate",
-      "description": "Percentage of desktop sessions that use search",
-      "type": "gauge",
-      "unit": "%",
-
-      "sources": [{
-        "storyboard": "activity-feed",
-        "workflow": "desktop-interaction",
-        "nodes": ["search-and-select"]
-      }],
-
-      "query": {
-        "derivation": "percentage",
-        "window": "1h"
-      },
-
-      "display": {
-        "component": "MetricCard",
-        "size": "medium"
-      },
-
-      "_mockData": {
-        "current": 23.4,
-        "previous": 21.8,
-        "trend": "up"
-      }
-    }
-  ],
-
-  "layout": {
-    "columns": 12,
-    "gap": 16,
-    "breakpoints": {
-      "mobile": 768,
-      "tablet": 1024
-    },
-    "rows": [
-      {
-        "title": "Overview",
-        "panels": [
-          { "id": "mobile-view-percentage", "span": 4, "spanMobile": 12 },
-          { "id": "total-page-views", "span": 4, "spanMobile": 12 },
-          { "id": "error-rate", "span": 4, "spanMobile": 12 }
-        ]
-      },
-      {
-        "title": "Traffic Trends",
-        "panels": [
-          { "id": "daily-home-page-views", "span": 6, "spanMobile": 12, "minHeight": 280 },
-          { "id": "views-by-viewport", "span": 6, "spanMobile": 12, "minHeight": 280 }
-        ]
-      },
-      {
-        "title": "Engagement",
-        "panels": [
-          { "id": "mobile-interaction-rate", "span": 6, "spanMobile": 12 },
-          { "id": "desktop-search-usage", "span": 6, "spanMobile": 12 }
-        ]
-      }
-    ]
-  }
-}

package/src/stories/data/file-city-images-transformed.otel.canvas.json

@@ -1,295 +0,0 @@
-{
-  "nodes": [
-    {
-      "id": "title",
-      "type": "text",
-      "x": 250,
-      "y": -50,
-      "width": 500,
-      "height": 80,
-      "color": "#64748B",
-      "text": "# File City Image Generation (Participant Model)\n**Sequence-first architecture: Participants, Move Events, and Transform Events**"
-    },
-    {
-      "id": "main-process",
-      "type": "otel-participant",
-      "x": 100,
-      "y": 100,
-      "width": 350,
-      "height": 500,
-      "label": "Main Process",
-      "shape": "rectangle",
-      "participant": {
-        "name": "FileCityImageService",
-        "description": "Main process service handling File City image generation",
-        "scope": "principal-ade-main"
-      },
-      "transformEvents": [
-        {
-          "name": "file_city.image.requested",
-          "description": "Image generation request received via IPC",
-          "attributes": {
-            "repo_path": {
-              "type": "string",
-              "description": "Absolute path to the repository",
-              "required": true
-            }
-          }
-        },
-        {
-          "name": "file_city.cache.checked",
-          "description": "Checked disk cache for existing image",
-          "attributes": {
-            "cache_key": {
-              "type": "string",
-              "description": "SHA256 hash used as cache key"
-            },
-            "cache_hit": {
-              "type": "boolean",
-              "description": "Whether cached image was found"
-            }
-          }
-        },
-        {
-          "name": "file_city.filetree.fetched",
-          "description": "FileTree fetched from repository-monitoring cache",
-          "attributes": {
-            "file_count": {
-              "type": "integer",
-              "description": "Number of files in tree"
-            },
-            "has_tree": {
-              "type": "boolean",
-              "description": "Whether file tree was available"
-            }
-          }
-        },
-        {
-          "name": "file_city.image.generation_started",
-          "description": "Started generating File City image",
-          "attributes": {
-            "file_count": {
-              "type": "integer",
-              "description": "Number of files to visualize"
-            },
-            "image_width": {
-              "type": "integer",
-              "description": "Output image width in pixels"
-            },
-            "image_height": {
-              "type": "integer",
-              "description": "Output image height in pixels"
-            }
-          }
-        },
-        {
-          "name": "file_city.image.generation_complete",
-          "description": "Image generated and saved to cache",
-          "attributes": {
-            "cache_path": {
-              "type": "string",
-              "description": "Path where image was saved"
-            },
-            "duration_ms": {
-              "type": "integer",
-              "description": "Time taken to generate image"
-            },
-            "file_size_bytes": {
-              "type": "integer",
-              "description": "Size of generated PNG"
-            }
-          }
-        },
-        {
-          "name": "file_city.image.cache_hit",
-          "description": "Cached image found and returned",
-          "attributes": {
-            "cache_path": {
-              "type": "string",
-              "description": "Path to cached PNG file"
-            }
-          }
-        },
-        {
-          "name": "file_city.image.error",
-          "description": "Error occurred during image generation",
-          "attributes": {
-            "error_type": {
-              "type": "string",
-              "description": "Type of error"
-            },
-            "error_message": {
-              "type": "string",
-              "description": "Error message"
-            },
-            "phase": {
-              "type": "string",
-              "description": "Phase where error occurred"
-            }
-          }
-        },
-        {
-          "name": "file_city.image.skipped",
-          "description": "Image generation skipped - no file tree available",
-          "attributes": {
-            "reason": {
-              "type": "string",
-              "description": "Why generation was skipped"
-            }
-          }
-        }
-      ],
-      "otel": {
-        "status": "implemented",
-        "scope": "principal-ade-main",
-        "files": [
-          "src/main/stores/FileCityImageService.ts"
-        ]
-      }
-    },
-    {
-      "id": "renderer-process",
-      "type": "otel-participant",
-      "x": 550,
-      "y": 100,
-      "width": 350,
-      "height": 500,
-      "label": "Renderer Process",
-      "shape": "rectangle",
-      "participant": {
-        "name": "ProjectInfoPanel",
-        "description": "Renderer process component displaying File City images",
-        "scope": "principal-ade-principal-window"
-      },
-      "transformEvents": [
-        {
-          "name": "file_city.renderer.action_called",
-          "description": "Renderer action called to fetch File City image",
-          "attributes": {
-            "repo_path": {
-              "type": "string",
-              "description": "Repository path requested"
-            }
-          }
-        },
-        {
-          "name": "file_city.renderer.url_received",
-          "description": "URL received from main process via IPC",
-          "attributes": {
-            "url": {
-              "type": "string",
-              "description": "file:// URL or null"
-            },
-            "has_url": {
-              "type": "boolean",
-              "description": "Whether a URL was returned"
-            }
-          }
-        },
-        {
-          "name": "file_city.renderer.state_updated",
-          "description": "React state updated with image URL",
-          "attributes": {
-            "url": {
-              "type": "string",
-              "description": "URL set in state"
-            }
-          }
-        },
-        {
-          "name": "file_city.renderer.card_rendered",
-          "description": "LocalProjectCard rendered with image URL",
-          "attributes": {
-            "has_custom_image": {
-              "type": "boolean",
-              "description": "Whether customImageUrl prop was provided"
-            },
-            "image_url": {
-              "type": "string",
-              "description": "The customImageUrl prop value"
-            }
-          }
-        }
-      ],
-      "otel": {
-        "status": "implemented",
-        "scope": "principal-ade-principal-window",
-        "files": [
-          "src/renderer/panels/ProjectInfoPanel.tsx"
-        ]
-      }
-    },
-    {
-      "id": "legend",
-      "type": "text",
-      "x": 100,
-      "y": 650,
-      "width": 800,
-      "height": 120,
-      "color": "#64748B",
-      "text": "## Participant Model Explained\n\n**Nodes** = Participants (the processes/services that interact)  \n**Edges** = Move Events (data crossing participant boundaries via IPC)  \n**Transform Events** = Internal processing within each participant (annotations on nodes)"
-    }
-  ],
-  "edges": [
-    {
-      "id": "ipc-request",
-      "fromNode": "renderer-process",
-      "fromSide": "left",
-      "toNode": "main-process",
-      "toSide": "right",
-      "label": "IPC: Request Image",
-      "edgeType": "calls",
-      "moveEvent": {
-        "name": "file_city.image.requested",
-        "description": "IPC call from renderer to main process requesting image generation",
-        "type": "calls"
-      }
-    },
-    {
-      "id": "ipc-response-cache",
-      "fromNode": "main-process",
-      "fromSide": "right",
-      "toNode": "renderer-process",
-      "toSide": "left",
-      "label": "IPC: Return Cached URL",
-      "edgeType": "data-flow",
-      "moveEvent": {
-        "name": "file_city.image.cache_hit",
-        "description": "IPC response returning cached image URL",
-        "type": "data-flow"
-      }
-    },
-    {
-      "id": "ipc-response-generated",
-      "fromNode": "main-process",
-      "fromSide": "right",
-      "toNode": "renderer-process",
-      "toSide": "left",
-      "label": "IPC: Return Generated URL",
-      "edgeType": "data-flow",
-      "moveEvent": {
-        "name": "file_city.image.generation_complete",
-        "description": "IPC response returning newly generated image URL",
-        "type": "data-flow"
-      }
-    }
-  ],
-  "name": "File City Images (Participant Model)",
-  "description": "Participant-based canvas following graph-to-sequence concepts: participants as nodes, move events as edges, transform events as annotations",
-  "nodeTypes": {
-    "participant": {
-      "label": "Participant",
-      "color": "#3B82F6"
-    }
-  },
-  "edgeTypes": {
-    "calls": {
-      "label": "Synchronous Call",
-      "color": "#10B981"
-    },
-    "data-flow": {
-      "label": "Data Flow",
-      "color": "#8B5CF6"
-    }
-  }
-}