From 0eead9df1b0f23b4fe6bc6cb2dc3456f3ee2ca8f Mon Sep 17 00:00:00 2001
From: jhnnsrs <jhnnsrs@gmail.com>
Date: Thu, 26 Oct 2023 18:37:21 +0200
Subject: [PATCH] more and more

---
 src-tauri/src/cmd.rs                          |  2 +
 src/components/MyAgents.tsx                   | 56 ++++++++++++++++++-
 src/components/buttons/LoginButton.tsx        |  2 +-
 src/mikro/components/Representation.tsx       |  3 +-
 .../components/dialogs/CreateContextModal.tsx |  2 +-
 src/mikro/sidepanels/DataSidePanel.tsx        | 45 +++++++++------
 src/rekuest/selection/SmartModel.tsx          | 12 +++-
 src/rekuest/selection/context.tsx             |  3 +
 8 files changed, 101 insertions(+), 24 deletions(-)

diff --git a/src-tauri/src/cmd.rs b/src-tauri/src/cmd.rs
index 26d686a..2df4b97 100644
--- a/src-tauri/src/cmd.rs
+++ b/src-tauri/src/cmd.rs
@@ -66,6 +66,8 @@ pub fn start_with_config<F: FnMut(String) + Send + 'static>(
         None => TcpListener::bind(SocketAddr::from(([127, 0, 0, 1], 0))),
     }?;
 
+
+
     let port = listener.local_addr()?.port();
 
     thread::spawn(move || {
diff --git a/src/components/MyAgents.tsx b/src/components/MyAgents.tsx
index e09e235..0bf6541 100644
--- a/src/components/MyAgents.tsx
+++ b/src/components/MyAgents.tsx
@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useEffect } from "react";
 import { useNavigate } from "react-router";
 import { notEmpty } from "../floating/utils";
 import { SectionTitle } from "../layout/SectionTitle";
@@ -6,7 +6,7 @@ import { useBounceAgentMate } from "../mates/agent/useBounceAgentMate";
 import { useDeleteAgentMate } from "../mates/agent/useDeleteAgentMate";
 import { useKickAgentMate } from "../mates/agent/useKickAgentMate";
 import { withRekuest } from "../rekuest";
-import { ListAgentFragment, useMyAgentsQuery } from "../rekuest/api/graphql";
+import { AgentsEventDocument, AgentsEventSubscription, ListAgentFragment, MyAgentsQuery, useMyAgentsQuery } from "../rekuest/api/graphql";
 import { AgentCard } from "../rekuest/components/cards/AgentCard";
 import { ResponsiveContainerGrid } from "./layout/ResponsiveContainerGrid";
 
@@ -17,10 +17,60 @@ export const AgentItem = ({ agent }: { agent: ListAgentFragment }) => {};
 const MyAgents: React.FC<IActiveClientsProps> = ({}) => {
   const navigate = useNavigate();
 
-  const { data } = withRekuest(useMyAgentsQuery)({
+  const { data, subscribeToMore} = withRekuest(useMyAgentsQuery)({
     fetchPolicy: "cache-and-network",
   });
 
+  useEffect(() => {
+    console.log("Subscribing to My Representations");
+    const unsubscribe = subscribeToMore<AgentsEventSubscription>({
+      document: AgentsEventDocument,
+      updateQuery: (prev, { subscriptionData }) => {
+        console.log("Received Representation", subscriptionData);
+        var data = subscriptionData;
+        let action = data.data?.agentsEvent;
+        let newelements;
+        // Try to update
+        if (action?.updated) {
+          let updated_res = action.updated;
+          newelements = prev.myagents?.map((item: any) =>
+            item.id === updated_res?.id
+              ? { ...item, data: { ...item.data, ...updated_res } }
+              : item
+          );
+        }
+
+        if (action?.deleted) {
+          let ended_res = action.deleted;
+          newelements = prev.myagents
+            ?.map((item: any) => (item.id === ended_res ? null : item))
+            .filter((item) => item != null);
+        }
+
+        if (action?.created) {
+          let updated_res = action.created;
+          if (prev.myagents) {
+            newelements = [updated_res, ...prev.myagents];
+          } else {
+            newelements = [updated_res];
+          }
+        }
+
+        console.log("Received ", subscriptionData);
+        return {
+          ...prev,
+          myrepresentations: newelements,
+        } as MyAgentsQuery;
+      },
+    });
+    return () => unsubscribe();
+  }, [subscribeToMore]);
+
+
+
+
+
+
   const kickagent = useKickAgentMate();
   const bounceagent = useBounceAgentMate();
   const deleteagent = useDeleteAgentMate();
diff --git a/src/components/buttons/LoginButton.tsx b/src/components/buttons/LoginButton.tsx
index 1018e54..57b97e7 100644
--- a/src/components/buttons/LoginButton.tsx
+++ b/src/components/buttons/LoginButton.tsx
@@ -14,7 +14,7 @@ export const LoginButton: React.FC<{}> = (props) => {
       try {
         let redirect_uri: string;
         if (window.__TAURI__) {
-          let port = await invoke("oauth_start", { config: { ports: [7890] } });
+          let port = await invoke("oauth_start", { config: { ports: [7890, 4567, 7888, 8345, 2389, 5839, 6895, 23893, 2349, 23939] } });
           console.log("Server started on port", port);
           redirect_uri = `http://127.0.0.1:${port}/`;
         } else {
diff --git a/src/mikro/components/Representation.tsx b/src/mikro/components/Representation.tsx
index 86d05ee..7d55d97 100644
--- a/src/mikro/components/Representation.tsx
+++ b/src/mikro/components/Representation.tsx
@@ -635,7 +635,8 @@ const RepresentationScreen: React.FC<ISampleProps> = ({ id }) => {
                               object={met.id}
                               className="font-light"
                             >
-                              {met?.key}
+                              {met.key && <div className="text-xs">{met.key}</div>}
+                              {met.value && <div className="text-md">{met.value}</div>}
                             </MikroMetric.DetailLink>
                           </div>
                         </MikroMetric.Smart>
diff --git a/src/mikro/components/dialogs/CreateContextModal.tsx b/src/mikro/components/dialogs/CreateContextModal.tsx
index 22ed44b..45426af 100644
--- a/src/mikro/components/dialogs/CreateContextModal.tsx
+++ b/src/mikro/components/dialogs/CreateContextModal.tsx
@@ -62,7 +62,7 @@ export const CreateContextModal = (
       {(formikProps) => (
         <Form>
           <TwDialog
-            title="Scan Github Repo"
+            title="Create New Context"
             buttons={
               <>
                 <button
diff --git a/src/mikro/sidepanels/DataSidePanel.tsx b/src/mikro/sidepanels/DataSidePanel.tsx
index 8e4059f..ae5d3ab 100644
--- a/src/mikro/sidepanels/DataSidePanel.tsx
+++ b/src/mikro/sidepanels/DataSidePanel.tsx
@@ -243,78 +243,89 @@ const DataSidebar: React.FunctionComponent<IDataSidebarProps> = (props) => {
           className="flex-grow flex flex-col gap-2 p-5 overflow-y-scroll direct"
           data-enableselect={true}
         >
-          {data?.experiments && data?.experiments.length > 0 && (
+          {data?.experiments && data?.experiments.length > 0 && (<>
             <div className="font-semibold text-center text-xs dark:text-slate-50 mt-2">
               Experiments
             </div>
-          )}
-          <ResponsiveContainerGrid>
+            <ResponsiveContainerGrid>
             {data?.experiments?.map((experiment, index) => (
               <ExperimentItem key={index} experiment={experiment} />
             ))}
           </ResponsiveContainerGrid>
-          {data?.datasets && data?.datasets.length > 0 && (
+          </>
+          )}
+          
+          {data?.datasets && data?.datasets.length > 0 && (<>
             <div className="font-semibold text-center text-xs dark:text-slate-50 mt-2">
               Datasets
             </div>
-          )}
+          
           <ResponsiveContainerGrid>
             {data?.datasets?.map((dataset, index) => (
               <DatasetItem key={index} dataset={dataset} />
             ))}
           </ResponsiveContainerGrid>
+          </>)}
           {data?.samples && data?.samples.length > 0 && (
+            <>
             <div
               className="font-semibold text-center text-xs dark:text-slate-50 mt-2"
               data-enableselect={true}
             >
               Samples
             </div>
-          )}
-          <ResponsiveContainerGrid>
+            <ResponsiveContainerGrid>
             {data?.samples?.map((sa, index) => (
               <SampleItem key={index} sa={sa} />
             ))}
           </ResponsiveContainerGrid>
-          {data?.tables && data?.tables.length > 0 && (
+          </>
+          )}
+          
+          {data?.tables && data?.tables.length > 0 && (<>
             <div
               className="font-semibold text-center text-xs dark:text-slate-50 mt-2"
               data-enableselect={true}
             >
               Tables
             </div>
-          )}
-          <ResponsiveContainerGrid>
+            <ResponsiveContainerGrid>
             {data?.tables?.map((ta, index) => (
               <TableItem table={ta} key={index} />
             ))}
-          </ResponsiveContainerGrid>
-          {data?.representations && data?.representations.length > 0 && (
+          </ResponsiveContainerGrid></>
+          )}
+          
+          {data?.representations && data?.representations.length > 0 && (<>
             <div
               className="font-semibold text-center text-xs dark:text-slate-50 mt-2"
               data-enableselect={true}
             >
               Images
             </div>
-          )}
-          <ResponsiveContainerGrid>
+            <ResponsiveContainerGrid>
             {data?.representations?.map((re, index) => (
               <RepresentationItem key={index} re={re} />
             ))}
           </ResponsiveContainerGrid>
-          {data?.files && data?.files.length > 0 && (
+          </>
+          )}
+          
+          {data?.files && data?.files.length > 0 && (<>
             <div
               className="font-semibold text-center text-xs dark:text-slate-50 mt-2"
               data-enableselect={true}
             >
               Files
             </div>
-          )}
-          <ResponsiveContainerGrid>
+            <ResponsiveContainerGrid>
             {data?.files?.map((f, index) => (
               <FileItem key={index} file={f} />
             ))}
           </ResponsiveContainerGrid>
+          </>
+          )}
+          
         </div>
       </div>
     </>
diff --git a/src/rekuest/selection/SmartModel.tsx b/src/rekuest/selection/SmartModel.tsx
index 0ef9841..697d3b3 100644
--- a/src/rekuest/selection/SmartModel.tsx
+++ b/src/rekuest/selection/SmartModel.tsx
@@ -67,6 +67,7 @@ export const SmartModel = ({
 
   const [progress, setProgress] = useState<number | undefined>(undefined);
   const [show, setShow] = useState(false);
+  const [focus, setFocus] = useState(false);
 
   const on_progress = async (x: number | undefined) => {
     setProgress(x);
@@ -95,6 +96,9 @@ export const SmartModel = ({
     }
   }, [show]);
 
+
+
+
   const [{ isOver, canDrop, overItems }, drop] = useDrop(() => {
     return {
       accept: [SMART_MODEL_DROP_TYPE],
@@ -182,6 +186,12 @@ export const SmartModel = ({
           progress,
         })
       }
+      onFocus={() => {
+        setShow(true);
+      }}
+      onBlur={() => {
+        setShow(false);
+      }}
       onDoubleClick={() => {
         setShow(!show);
       }}
@@ -233,7 +243,7 @@ export const SmartModel = ({
             )}
           </>
         )}
-        {((isFocused && !isOver) || show) && (
+        {((isFocused && !isOver) || show ) && (
           <div
             ref={setPopperElement}
             style={{
diff --git a/src/rekuest/selection/context.tsx b/src/rekuest/selection/context.tsx
index 7a0ccdf..cdda9d7 100644
--- a/src/rekuest/selection/context.tsx
+++ b/src/rekuest/selection/context.tsx
@@ -78,6 +78,7 @@ export const useModelSelect = (
       item.id === proposedSelection.id
   );
 
+
   const mefocus =
     focus?.identifier === proposedSelection.identifier &&
     focus?.id === proposedSelection.id;
@@ -160,6 +161,8 @@ export const useModelSelect = (
     // }
   };
 
+  
+
   const bind = {
     onMouseDown,
   };