FastAPI Integration (#28)

* remove query references

* remove mut references

* remove apollo client

* remove references

* add check for currentWeakSupervisionRun

* remove references

* added Observable

* fixes huddle data race

* log check

* msg change

* removed msg change

* udpate ref

Author: anmarhindi

package.json

@@ -9,7 +9,6 @@
     "lint": "next lint"
   },
   "dependencies": {
-    "@apollo/client": "^3.7.10",
     "@headlessui/react": "^1.7.18",
     "@heroicons/react": "^2.0.17",
     "@monaco-editor/react": "^4.5.1",
@@ -30,7 +29,6 @@
     "eslint": "8.47.0",
     "eslint-config-next": "13.4.19",
     "focus-visible": "^5.2.0",
-    "graphql": "^16.6.0",
     "lodash.debounce": "^4.0.8",
     "next": "13.5.6",
     "postcss-focus-visible": "^6.0.4",

src/components/projects/projectId/data-browser/SearchGroups.tsx

@@ -200,6 +200,7 @@ export default function SearchGroups() {
     useEffect(() => {
         if (!currentWeakSupervisionRun) return;
         if (currentWeakSupervisionRun.state == Status.NOT_YET_RUN) return;
+        if (!currentWeakSupervisionRun.selectedInformationSources) return;
         setSelectedHeuristicsWS(currentWeakSupervisionRun.selectedInformationSources.split(','));
     }, [currentWeakSupervisionRun]);
 

src/components/projects/projectId/labeling/sessionId/main-component/LabelingMainComponent.tsx

@@ -8,7 +8,7 @@ import { SessionManager } from "@/src/util/classes/labeling/session-manager";
 import { UserManager } from "@/src/util/classes/labeling/user-manager";
 import { DUMMY_HUDDLE_ID, getDefaultLabelingSuiteSettings, parseLabelingLink, prepareRLADataForRole } from "@/src/util/components/projects/projectId/labeling/labeling-main-component-helper";
 import { useRouter } from "next/router";
-import { useCallback, useEffect, useState } from "react";
+import { useCallback, useEffect, useState, useRef } from "react";
 import { useDispatch, useSelector } from "react-redux";
 import style from "@/src/styles/components/projects/projectId/labeling.module.css";
 import NavigationBarTop from "./NavigationBarTop";
@@ -51,6 +51,8 @@ export default function LabelingMainComponent() {
     const [absoluteWarning, setAbsoluteWarning] = useState(null);
     const [lockedLink, setLockedLink] = useState(false);
 
+    const hasRequestedHuddleData = useRef(false);
+
     useEffect(() => {
         if (!projectId || !router.query) return;
         let tmp = localStorage.getItem(SETTINGS_KEY);
@@ -150,18 +152,20 @@ export default function LabelingMainComponent() {
             dispatch(updateRecordRequests('rla', null));
             return;
         }
-        setTimeout(() => {
-            getTokenizedRecord({ recordId: SessionManager.currentRecordId }, (res) => {
-                dispatch(updateRecordRequests('token', res.data.tokenizeRecord));
-            });
-            getRecordByRecordId(projectId, SessionManager.currentRecordId, (res) => {
-                dispatch(updateRecordRequests('record', res.data.recordByRecordId));
-            });
-            getRecordLabelAssociations(projectId, SessionManager.currentRecordId, (rla) => {
-                const rlas = rla['data']?.['recordByRecordId']?.['recordLabelAssociations']['edges'].map(e => e.node);
-                dispatch(updateRecordRequests('rla', prepareRLADataForRole(rlas, user, userDisplayId, userDisplayRole)));
-            });
-        }, 100);
+        if (SessionManager.currentRecordId !== null) {
+            setTimeout(() => {
+                getTokenizedRecord({ recordId: SessionManager.currentRecordId }, (res) => {
+                    dispatch(updateRecordRequests('token', res.data.tokenizeRecord));
+                });
+                getRecordByRecordId(projectId, SessionManager.currentRecordId, (res) => {
+                    dispatch(updateRecordRequests('record', res.data.recordByRecordId));
+                });
+                getRecordLabelAssociations(projectId, SessionManager.currentRecordId, (rla) => {
+                    const rlas = rla['data']?.['recordByRecordId']?.['recordLabelAssociations']['edges'].map(e => e.node);
+                    dispatch(updateRecordRequests('rla', prepareRLADataForRole(rlas, user, userDisplayId, userDisplayRole)));
+                });
+            }, 100);
+        }
     }, [SessionManager.currentRecordId, user]);
 
     useEffect(() => {
@@ -228,6 +232,8 @@ export default function LabelingMainComponent() {
     }
 
     function requestHuddleData(huddleId: string) {
+        if (hasRequestedHuddleData.current === true) return;
+        hasRequestedHuddleData.current = true;
         getHuddleData(projectId, { huddleId: huddleId, huddleType: SessionManager.labelingLinkData.linkType }, (result) => {
             const huddleData = result['data']['requestHuddleData'];
             if (huddleId == DUMMY_HUDDLE_ID) {
@@ -259,6 +265,7 @@ export default function LabelingMainComponent() {
             SessionManager.jumpToPosition(pos);
             dispatch(setDisplayUserRole(user.role));
             router.push(`/projects/${projectId}/labeling/${SessionManager.huddleData.linkData.huddleId}?pos=${SessionManager.huddleData.linkData.requestedPos}&type=${SessionManager.huddleData.linkData.linkType}`);
+            hasRequestedHuddleData.current = false;
         });
     }
 

src/pages/_app.tsx

@@ -1,6 +1,4 @@
-import { ApolloProvider } from '@apollo/client'
 import type { AppProps } from 'next/app'
-import client from '../services/gql/apollo-client'
 import '../styles/tailwind.css'
 import Head from 'next/head'
 import Layout from '../components/shared/layout/Layout'
@@ -24,13 +22,11 @@ export default function App({ Component, pageProps }: AppProps) {
     </Head>
 
     <Provider store={store}>
-      <ApolloProvider client={client}>
-        <GlobalStoreDataComponent>
-          <Layout {...pageProps}>
-            <Component {...pageProps} />
-          </Layout>
-        </GlobalStoreDataComponent>
-      </ApolloProvider>
+      <GlobalStoreDataComponent>
+        <Layout {...pageProps}>
+          <Component {...pageProps} />
+        </Layout>
+      </GlobalStoreDataComponent>
     </Provider>
   </>
 }

src/services/base/project.ts

@@ -10,7 +10,6 @@ export function getProjectByProjectId(projectId: string, onResult: (result: any)
     jsonFetchWrapper(finalUrl, FetchType.GET, onResult);
 }
 
-
 export function getAllProjects(onResult: (result: any) => void) {
     const finalUrl = `${projectEndpoint}/all-projects`;
     jsonFetchWrapper(finalUrl, FetchType.GET, onResult);

src/services/base/s3-service.ts

@@ -1,11 +1,10 @@
 import { UploadState, UploadStates } from "@/src/types/shared/upload";
-import { Observable } from '@apollo/client';
 import { S3 } from 'aws-sdk';
 import { ConfigManager } from "./config";
+import { Observable } from "rxjs";
 
 
 export function uploadFile(credentialsAndUploadIdParsed: any, file: File, filename: string): Observable<UploadState> {
-
     const credentials = credentialsAndUploadIdParsed["Credentials"];
     const uploadTaskId = credentialsAndUploadIdParsed["uploadTaskId"];
     const bucket = credentialsAndUploadIdParsed["bucket"];
@@ -42,7 +41,6 @@ export function uploadFile(credentialsAndUploadIdParsed: any, file: File, filena
                 state: UploadStates.DONE,
                 progress: 100
             })
-            subscriber.complete();
         });
         return managedUpload.on('httpUploadProgress', function (progress) {
             subscriber.next({
@@ -78,7 +76,6 @@ export function downloadFile(credentialBlock: any, isStringData: boolean = true)
     }
     return new Observable((subscriber) => {
         s3Client.getObject(getParams, function (err, data) {
-            // Handle any error and exit
             if (err) {
                 subscriber.error(null)
             }
@@ -88,7 +85,6 @@ export function downloadFile(credentialBlock: any, isStringData: boolean = true)
             } else {
                 subscriber.next(data.Body)
             }
-            subscriber.complete();
         });
     });