temp

Author: benfdking

vscode/react/src/App.css

@@ -65,3 +65,10 @@
     @apply outline-none ring-offset-2 ring-4;
   }
 }
+
+:root {
+  --color-graph-edge-secondary: blue;
+  --color-graph-edge-main: red;
+  --color-graph-edge-selected: green;
+  --color-graph-edge-direct: yellow; 
+}

vscode/react/src/components/graph/Graph.css

@@ -13,7 +13,8 @@ react-flow__attribution {
 }
 .lineage__column-source b {
   font-weight: 900;
-  color: var(--color-primary);
+  /* color: var(--color-primary); */
+  color: black;
 }
 .react-flow__edge {
   pointer-events: none !important;

vscode/react/src/pages/lineage.tsx

@@ -5,7 +5,7 @@ import {
   QueryClientProvider,
 } from '@tanstack/react-query'
 import { useApiModels } from '@/api'
-import LineageFlowProvider from '@/components/graph/context'
+import LineageFlowProvider, { useLineageFlow } from '@/components/graph/context'
 import { ModelLineage } from '@/components/graph/ModelLineage'
 import { useVSCode } from '@/hooks/vscode'
 import React from 'react'
@@ -108,9 +108,39 @@ export function LineageComponentFromWeb({
         handleError={handleError}
         models={models}
         showControls={false}
-      >
-        <ModelLineage model={model} />
+      > <UpdateLineageFocus>
+          <ModelLineage model={model} />
+        </UpdateLineageFocus>
       </LineageFlowProvider>
     </div>
   )
 }
+
+export function UpdateLineageFocus({ children }: { children: React.ReactNode }) {
+  const lineageFlow = useLineageFlow()
+
+  React.useEffect(() => {
+    const handleMessage = (event: MessageEvent) => {
+      // Ensure the message is from VSCode
+      if (event.data && event.data.key === 'vscode_send') {
+        const payload = event.data.payload
+        switch (payload.key) {
+          case 'changeFocusOnFile':
+            console.log('Changing focus to file:', payload.payload.path)
+            // Implement your focus change logic here
+            // TODO NEED TO PASS THE FQN of the model not the path 
+            lineageFlow.setMainNode(payload.payload.path)
+            break
+          default:
+            console.error('Unhandled message type in lineage page:', payload.key)
+        }
+      }
+    }
+    window.addEventListener('message', handleMessage)
+    return () => {
+      window.removeEventListener('message', handleMessage)
+    }
+  }, [])
+
+  return children
+}

vscode/react/src/style/variants.ts

@@ -21,3 +21,31 @@ export const EnumVariant = {
 } as const
 
 export type Variant = (typeof EnumVariant)[keyof typeof EnumVariant]
+
+
+interface Model {
+  test: string
+}
+
+Model.do_something(model)
+const do_something = (model: Model) => {
+  model.test = 'test'
+}
+
+vscpde.postMessage()
+
+class ModelClass {
+  test: string
+
+  constructor(test: string) {
+    this.test = test
+  }
+
+  static do_something(model: Model) {
+    model.test = 'test'
+  }
+
+  do_something() {
+    this.test = 'test'
+  }
+}