@donartcha/openlag 0.1.1 → 0.1.3

package/src/components/GraphView.tsx

@@ -2,6 +2,7 @@ import React, { useMemo, useCallback, useEffect, useState } from 'react';
 import { ReactFlow, MiniMap, Controls, Background, useNodesState, useEdgesState, Node, Edge, MarkerType, Handle, Position, Panel, ReactFlowProvider, useReactFlow } from '@xyflow/react';
 import dagre from 'dagre';
 import { Search, X, AlertCircle, ChevronUp, ChevronDown } from 'lucide-react';
+import Markdown from 'react-markdown';
 import '@xyflow/react/dist/style.css';
 import { useStore } from '../store';
 import { ArtifactType } from '../types';
@@ -40,6 +41,29 @@ const typeColors: Record<ArtifactType, string> = {
   PIPELINE: 'text-sky-400 border-sky-400',
 };
 
+const CompactMarkdown = ({ content }: { content: string }) => (
+  <div className="text-[11px] leading-relaxed opacity-60 h-8 overflow-hidden text-ellipsis line-clamp-2 [&_*]:m-0 [&_*]:p-0">
+    <Markdown
+      components={{
+        h1: ({ children }) => <span className="font-semibold">{children}</span>,
+        h2: ({ children }) => <span className="font-semibold">{children}</span>,
+        h3: ({ children }) => <span className="font-semibold">{children}</span>,
+        h4: ({ children }) => <span className="font-semibold">{children}</span>,
+        p: ({ children }) => <span>{children}</span>,
+        ul: ({ children }) => <span>{children}</span>,
+        ol: ({ children }) => <span>{children}</span>,
+        li: ({ children }) => <span>{children} </span>,
+        strong: ({ children }) => <strong className="font-semibold text-white/80">{children}</strong>,
+        em: ({ children }) => <em className="italic">{children}</em>,
+        code: ({ children }) => <code className="font-mono text-emerald-400/80">{children}</code>,
+        a: ({ children }) => <span className="text-blue-300/80 underline">{children}</span>,
+      }}
+    >
+      {content}
+    </Markdown>
+  </div>
+);
+
 const CustomNode = ({ data, selected }: any) => {
   const colorClass = typeColors[data.type as ArtifactType] || 'text-white/40 border-white/40';
   const isDimmed = data.dimmed;
@@ -72,7 +96,7 @@ const CustomNode = ({ data, selected }: any) => {
       </div>
       <div className="font-serif text-[#e0e0e0] text-sm mb-2 leading-tight">{data.title}</div>
       <div className="flex flex-col gap-1">
-          <div className="text-[11px] leading-relaxed opacity-60 h-8 overflow-hidden text-ellipsis line-clamp-2">{data.description}</div>
+          <CompactMarkdown content={data.description || ''} />
           {data.ownership?.owner && <div className="text-[8px] text-emerald-500 font-mono">OWNER: {data.ownership.owner}</div>}
           {data.ownership?.team && <div className="text-[8px] text-blue-400 font-mono">TEAM: {data.ownership.team}</div>}
       </div>
@@ -525,5 +549,4 @@ export const GraphView: React.FC = () => {
       <GraphFlow />
     </ReactFlowProvider>
   );
-};
-
+};

package/src/store.ts

@@ -27,7 +27,8 @@ interface StoreState {
     owner: string;
     team: string;
   };
-  
+  metadata?: { name: string; description: string; [key: string]: any };
+
   initializeStore: () => Promise<void>;
   setVersion: (versionId: string) => void;
   setView: (view: 'graph' | 'docs' | 'impact' | 'orphans' | 'guide' | 'settings') => void;
@@ -43,6 +44,7 @@ let cachedData: {
   systemVersions: SystemVersion[];
   changes: Change[];
   graphs: Record<string, GraphSnapshot>;
+  metadata?: { name: string; description: string; [key: string]: any };
 } | null = null;
 
 export const useStore = create<StoreState>((set, get) => ({
@@ -56,6 +58,7 @@ export const useStore = create<StoreState>((set, get) => ({
   activeView: 'graph',
   selectedArtifactId: null,
   isLoading: false,
+  metadata: undefined,
   settings: {
     graphFocusDepth: DEFAULT_NEIGHBORHOOD_DEPTH,
     docsFocusDepth: 1,
@@ -109,11 +112,12 @@ export const useStore = create<StoreState>((set, get) => ({
       cachedData = await response.json();
       
       if (cachedData) {
-        const { versions, systemVersions, changes } = cachedData;
+        const { versions, systemVersions, changes, metadata } = cachedData;
         set({ 
           versions, 
           systemVersions: systemVersions || [],
           changes,
+          metadata,
           isLoading: false
         });
         

package/dist/assets/channel-CfEECmqT.js

@@ -1 +0,0 @@
-import{ai as o,aj as n}from"./index-By2WPc1i.js";const t=(a,r)=>o.lang.round(n.parse(a)[r]);export{t as c};

package/dist/assets/classDiagram-4FO5ZUOK-CqWhRzlO.js

@@ -1 +0,0 @@
-import{s as a,c as s,a as e,C as t}from"./chunk-727SXJPM-CiQJMcWK.js";import{_ as i}from"./index-By2WPc1i.js";import"./chunk-FMBD7UC4-CSSwZdAo.js";import"./chunk-ND2GUHAM-CpsO12XK.js";import"./chunk-55IACEB6-BVCvy2y7.js";import"./chunk-2J33WTMH-DI5V_htM.js";var u={parser:e,get db(){return new t},renderer:s,styles:a,init:i(r=>{r.class||(r.class={}),r.class.arrowMarkerAbsolute=r.arrowMarkerAbsolute},"init")};export{u as diagram};

package/dist/assets/classDiagram-v2-Q7XG4LA2-CqWhRzlO.js

@@ -1 +0,0 @@
-import{s as a,c as s,a as e,C as t}from"./chunk-727SXJPM-CiQJMcWK.js";import{_ as i}from"./index-By2WPc1i.js";import"./chunk-FMBD7UC4-CSSwZdAo.js";import"./chunk-ND2GUHAM-CpsO12XK.js";import"./chunk-55IACEB6-BVCvy2y7.js";import"./chunk-2J33WTMH-DI5V_htM.js";var u={parser:e,get db(){return new t},renderer:s,styles:a,init:i(r=>{r.class||(r.class={}),r.class.arrowMarkerAbsolute=r.arrowMarkerAbsolute},"init")};export{u as diagram};