Merge pull request #132 from cu-mkp/dev

Replacing Axios
cu-mkp · Jul 1, 2024 · 9e60b36 · 9e60b36
2 parents 2ab7ca7 + 4ed7ba4
commit 9e60b36
Show file tree

Hide file tree

Showing 5 changed files with 72 additions and 87 deletions.
diff --git a/editioncrafter-umd/package.json b/editioncrafter-umd/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@cu-mkp/editioncrafter-umd",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "homepage": "https://cu-mkp.github.io/editioncrafter/",
   "description": "A simple digital critical edition publication tool",
   "private": false,

diff --git a/editioncrafter/package-lock.json b/editioncrafter/package-lock.json
diff --git a/editioncrafter/package.json b/editioncrafter/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@cu-mkp/editioncrafter",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "description": "A simple digital critical edition publication tool",
   "homepage": "https://cu-mkp.github.io/editioncrafter/",
   "private": false,
@@ -27,7 +27,6 @@
     "@material-ui/core": "^4.12.4",
     "@material-ui/icons": "^4.11.3",
     "@recogito/annotorious-openseadragon": "^2.7.11",
-    "axios": "^1.3.4",
     "history": "^5.3.0",
     "html-react-parser": "^4.2.2",
     "openseadragon": "^4.1.0",

diff --git a/editioncrafter/src/model/Folio.js b/editioncrafter/src/model/Folio.js
@@ -1,76 +1,64 @@
 import OpenSeadragon from 'openseadragon';
-import axios from 'axios';
 import { layoutMargin3 } from './folioLayout';
 
-export function loadFolio(folioData) {
+export async function loadFolio(folioData) {
   if (folioData.loading) {
-    // promise to resolve this immediately
-    return new Promise((resolve) => {
-      resolve(folioData);
-    });
+    return folioData
   }
+
   folioData.loading = true;
   const folio = { ...folioData };
+  const transcriptionTypes = Object.keys(folio.annotationURLs);
+  const transcriptionTypeTracker = Object.fromEntries(transcriptionTypes.map((t) => [t, false]));
 
-  // promise to load all the data for this folio
-  return new Promise((resolve, reject) => {
-    const transcriptionTypes = Object.keys(folio.annotationURLs);
-    const transcriptionTypeTracker = Object.fromEntries(transcriptionTypes.map((t) => [t, false]));
-    if (transcriptionTypes.length > 0) {
-      axios.get(folio.image_zoom_url).then((imageServerResponse) => {
-        // Handle the image server response
-        folio.tileSource = new OpenSeadragon.IIIFTileSource(imageServerResponse.data);
+  if (transcriptionTypes.length > 0) {
+    const response = await fetch(folio.image_zoom_url)
+    const imageServerResponse = await response.json()
+    // Handle the image server response
+    folio.tileSource = new OpenSeadragon.IIIFTileSource(imageServerResponse);
 
-        for (const transcriptionType of transcriptionTypes) {
-          const { htmlURL, xmlURL } = folio.annotationURLs[transcriptionType];
-          if (!folio.transcription) folio.transcription = {};
-          folio.transcription[transcriptionType] = {};
-          axios.all([
-            axios.get(htmlURL),
-            axios.get(xmlURL),
-          ]).then(axios.spread((
-            htmlResponse,
-            xmlResponse,
-          ) => {
-            const transcription = parseTranscription(htmlResponse.data, xmlResponse.data);
-            if (!transcription) {
-              reject(new Error(`Unable to load transcription: ${htmlURL}`));
-            } else {
-              folio.transcription[transcriptionType] = transcription;
-              folio.loading = false;
-              transcriptionTypeTracker[transcriptionType] = true;
-            }
-          }))
-            .catch((error) => {
-              folioData.loading = false;
-              reject(error);
-            })
-            .finally(() => {
-              // Only resolve once all transcription types have been fetched
-              if (Object.values(transcriptionTypeTracker).filter(v => !v).length === 0) {
-                resolve(folio);
-              }
-            });
-        }
-      })
-        .catch((error) => {
-          folioData.loading = false;
-          reject(error);
-        });
-    } else {
-      // if there is no annotatation list, just load the image and provide a blank transcription
-      axios.get(folio.image_zoom_url)
-        .then((imageServerResponse) => {
-          folio.tileSource = new OpenSeadragon.IIIFTileSource(imageServerResponse.data);
+    for (const transcriptionType of transcriptionTypes) {
+      const { htmlURL, xmlURL } = folio.annotationURLs[transcriptionType];
+      if (!folio.transcription) folio.transcription = {};
+      folio.transcription[transcriptionType] = {};
+
+      try {
+        const htmlURLResponse = await fetch(htmlURL)
+        const xmlURLResponse = await fetch(xmlURL)
+        const html = await htmlURLResponse.text()
+        const xml = await xmlURLResponse.text()
+        const transcription = parseTranscription(html, xml);
+        if (!transcription) {
+          throw new Error(`Unable to load transcription: ${htmlURL}`)
+        } else {
+          folio.transcription[transcriptionType] = transcription;
           folio.loading = false;
-          resolve(folio);
-        })
-        .catch((error) => {
+          transcriptionTypeTracker[transcriptionType] = true;
+        }  
+      } catch(error) {
           folioData.loading = false;
-          reject(error);
-        });
+          throw error;
+      }
     }
-  });
+
+    // Once all transcription types have been fetched
+    if (Object.values(transcriptionTypeTracker).filter(v => !v).length === 0) {
+      return folio;
+    }
+  } else {
+    // if there is no annotatation list, just load the image and provide a blank transcription
+    try {
+      const response = await fetch(folio.image_zoom_url)
+      const imageServerResponse = await response.json()
+      folio.tileSource = new OpenSeadragon.IIIFTileSource(imageServerResponse);
+      folio.loading = false;
+      return folio
+    } 
+    catch(error) {
+        folioData.loading = false;
+        throw error;
+    }
+  }
 }
 
 // returns transcription or error message if unable to parse

diff --git a/editioncrafter/src/saga/RouteListenerSaga.js b/editioncrafter/src/saga/RouteListenerSaga.js
@@ -1,5 +1,4 @@
 /* eslint-disable prefer-destructuring */
-import axios from 'axios';
 import { takeEvery, select } from 'redux-saga/effects';
 
 // eslint-disable-next-line import/no-cycle
@@ -34,8 +33,8 @@ function* resolveDocumentManifest() {
     if (document.variorum) {
       const variorumData = {};
       for (const key of Object.keys(document.manifestURL)) {
-        const response = yield axios.get(document.manifestURL[key]);
-        variorumData[key] = response.data;
+        const response = yield fetch(document.manifestURL[key]);
+        variorumData[key] = yield response.json();
       }
       const variorumManifest = {
         type: 'variorum',
@@ -44,9 +43,10 @@ function* resolveDocumentManifest() {
       yield putResolveAction('DocumentActions.loadDocument', variorumManifest);
       return variorumManifest;
     }
-    const singleResponse = yield axios.get(document.manifestURL);
-    yield putResolveAction('DocumentActions.loadDocument', singleResponse.data);
-    return singleResponse.data;
+    const singleResponse = yield fetch(document.manifestURL);
+    const json = yield singleResponse.json()
+    yield putResolveAction('DocumentActions.loadDocument', json);
+    return json;
   }
 
   return null;
@@ -86,8 +86,9 @@ function* resolveGlossary() {
   const glossary = yield select(justGlossary);
   // NOTE: need to figure out how to deal with glossary for multidocument manifests
   if (!glossary.loaded && glossary.URL) {
-    const response = yield axios.get(glossary.URL);
-    yield putResolveAction('GlossaryActions.loadGlossary', response.data);
+    const response = yield fetch(glossary.URL);
+    const json = yield response.json()
+    yield putResolveAction('GlossaryActions.loadGlossary', json);
   }
 }