From 85ec30234f8eb44cdfc400b85c0b36431cef161a Mon Sep 17 00:00:00 2001
From: Anthony Hinsinger <anthony.hinsinger@gmail.com>
Date: Thu, 21 Oct 2021 09:36:24 +0200
Subject: [PATCH] Splitted indi panel

---
 src/apolloclient.js          | 43 ++++++++++++++++++++++++++++++++++++
 src/components/indi/panel.js |  1 -
 src/devices.js               | 14 +++++-------
 3 files changed, 48 insertions(+), 10 deletions(-)

diff --git a/src/apolloclient.js b/src/apolloclient.js
index 3710cb4..fdec4a0 100644
--- a/src/apolloclient.js
+++ b/src/apolloclient.js
@@ -78,6 +78,49 @@ const client = new ApolloClient({
   }),
 });
 
+const GETDEVICES = gql`
+  query devices {
+    devices {
+      id
+      ...DeviceInfo
+      messages @client
+      properties {
+        id
+        name
+        ...PropertyVector
+      }
+    }
+  }
+
+  ${deviceInfoFragment}
+  ${propertyVectorFragment}
+`;
+
+const NEW_DEVICE = gql`
+  subscription newIndiDevice {
+    newIndiDevice {
+      id
+      ...DeviceInfo
+    }
+  }
+
+  ${deviceInfoFragment}
+`;
+
+client
+  .subscribe({
+    query: NEW_DEVICE,
+  })
+  .subscribe(({ data }) => {
+    const res = client.readQuery({ query: GETDEVICES });
+    data.newIndiDevice.properties = [];
+    data.newIndiDevice.messages = [];
+    client.writeQuery({
+      query: GETDEVICES,
+      data: { devices: [...res.devices, data.newIndiDevice] },
+    });
+  });
+
 const GETDEVICE = gql`
   query device($id: String!) {
     device(id: $id) {
diff --git a/src/components/indi/panel.js b/src/components/indi/panel.js
index 9575e80..3be3b9e 100644
--- a/src/components/indi/panel.js
+++ b/src/components/indi/panel.js
@@ -52,7 +52,6 @@ export const IndiPanel = () => {
           )}
         </Tabs>
       ) : null}
-      <Button icon={<Contact />} onClick={() => setOpenMsg(true)} />
     </Box>
   );
 };
diff --git a/src/devices.js b/src/devices.js
index 5daf743..603b396 100644
--- a/src/devices.js
+++ b/src/devices.js
@@ -26,9 +26,9 @@ const GETDEVICES = gql`
   ${deviceInfoFragment}
 `;
 
-const CONNECT = gql`
-  mutation connect {
-    connect
+const START = gql`
+  mutation start {
+    start
   }
 `;
 
@@ -51,14 +51,9 @@ const useIndiState = () => {
 
 const Devices = () => {
   //const connected = useIndiState();
-  const { data } = useQuery(GETDEVICES);
-  const [connect] = useMutation(CONNECT);
+  const [connect] = useMutation(START);
   const [disconnect] = useMutation(DISCONNECT);
 
-  if (!data || !data.devices) {
-    return <div>No data</div>;
-  }
-
   return (
     <Box fill background="light-3">
       <Header background="brand" pad="small">
@@ -85,6 +80,7 @@ const Devices = () => {
               }}
             />
           )}
+          <Button icon={<Contact />} onClick={() => {}} />
         </Box>
       </Header>