Move in progress apps temporarily

apps/link/pages/tickets/[id].tsx

@@ -1,6 +1,7 @@
 import { GetServerSideProps, GetServerSidePropsContext } from "next";
 import Head from "next/head";
 import useSWR from "swr";
+import { request, gql } from "graphql-request";
 import { NextPage } from "next";
 import { Grid, } from "@mui/material";
 import { Layout } from "components/Layout";
@@ -15,22 +16,72 @@ const Ticket: NextPage<TicketProps> = ({ id }) => {
   const origin = typeof window !== 'undefined' && window.location.origin
     ? window.location.origin
     : '';
-  const fetcher = async (url: string) => {
-    const res = await fetch(url);
-    return res.json();
-  }
+  const graphQLFetcher = async ({ document, variables }: any) => {
+    const data = await request({
+      url: `${origin}/graphql`,
+      document,
+      variables
+    })
+    console.log({ data })
 
-  const { data: ticketData, error: ticketError } = useSWR(
-    `${origin}/api/v1/tickets/${id}`,
-    fetcher
+    return data;
+  };
+
+  const { data: ticketData, error: ticketError }: any = useSWR(
+    {
+      document: gql`
+        query getTicket($ticketId: Int!) {
+        ticket(
+          ticket: {
+            ticketInternalId: $ticketId
+          }
+        ) {
+          id,
+          internalId,
+          title,
+          note,
+          number,
+          createdAt,
+          updatedAt,
+          closeAt,
+          articles {
+            edges {
+              node {
+                id,
+                body,
+                internal,
+                sender {
+                  name
+                }
+              }
+            }
+          }
+        }}`, variables: { ticketId: parseInt(id, 10) }
+    },
+    graphQLFetcher,
+    { refreshInterval: 1000 }
   );
 
-  const { data: articlesData, error: articlesError } = useSWR(
-    `${origin}/api/v1/ticket_articles/by_ticket/${id}`,
-    fetcher
+  const { data: graphqlData2, error: graphqlError2 } = useSWR(
+    {
+      document: gql`
+      {
+
+          __schema {
+            queryType {
+              name
+              fields {
+                name
+              }
+            }
+          }
+
+     }`, variables: {}
+    },
+    graphQLFetcher
   );
 
-  const shouldRender = !ticketError && !articlesError && ticketData && articlesData && !ticketData.error && !articlesData.error;
+  const shouldRender = !ticketError && ticketData;
 
   return (
     <Layout>
@@ -39,13 +90,13 @@ const Ticket: NextPage<TicketProps> = ({ id }) => {
       </Head>
       {shouldRender && (
         <Grid container spacing={0} sx={{ height: "100vh" }} direction="row">
-          <Grid item sx={{ height: "100vh" }} xs={10}>
+          <Grid item sx={{ height: "100vh" }} xs={12}>
 
-            <TicketDetail ticket={ticketData} articles={articlesData} />
-          </Grid>
-          <Grid item xs={2} sx={{ height: "100vh" }}>
-            <TicketEdit ticket={ticketData} />
+            <TicketDetail ticket={ticketData.ticket} />
           </Grid>
+          {/*<Grid item xs={0} sx={{ height: "100vh" }}>
+            <TicketEdit ticket={ticketData.ticket} />
+      </Grid>*/}
         </Grid>)}
       {ticketError && <div>{ticketError.toString()}</div>}
     </Layout>