Change DataURL to BlobURL

Seneca-CDOT · Dec 11, 2022 · 3bdb458 · 3bdb458
1 parent 257e107
commit 3bdb458
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 10 deletions.
diff --git a/src/UploadInterface.js b/src/UploadInterface.js
@@ -23,13 +23,14 @@ const fileTypes = ['jpg', 'jpeg', 'png', 'bmp', 'gif'];
 function UploadInterface({ isAuthorized, token, repository }) {
   const [images, setImages] = useState([]);
   const [userMessage, setUserMessage] = useState('');
-  const [repoCreated, setRepoCreated] = useState(false);
+  const [errorOccurred, setErrorOccurred] = useState(false);
   const [loading, setLoading] = useState(false);
   const imgPreviewEl = useRef(null);
 
   async function uploadBtnClicked() {
     setUserMessage('MyPhotoHub is validating user token...');
     setLoading(true);
+    setErrorOccurred(false);
 
     const octokit = new Octokit({ auth: token });
     let username, repoCreated;
@@ -38,16 +39,15 @@ function UploadInterface({ isAuthorized, token, repository }) {
     } catch (err) {
       console.error('Invalid PAT token');
       setUserMessage('Sorry, could not find a user with the token');
-      setRepoCreated(false);
+      setErrorOccurred(true);
       setLoading(false);
       return;
     }
 
-    setUserMessage('Valid user! MyPhotoHub is creating a GitHub repository...');
+    setUserMessage('User validated! MyPhotoHub is creating a GitHub repository...');
     repoCreated = await createRepo(octokit, username, repository);
 
     if (repoCreated) {
-      setRepoCreated(true);
       setUserMessage('GitHub repository has been created! Creating optimized images...');
 
       const convertedFiles = await createOptimizedImages(images);
@@ -92,13 +92,14 @@ function UploadInterface({ isAuthorized, token, repository }) {
         setLoading(false);
       } catch (err) {
         setLoading(false);
-        setUserMessage(`Something went wrong while create a commit`);
+        setErrorOccurred(true);
+        setUserMessage(`Something went wrong while creating a commit`);
         console.error('Error occurred while creating a commit');
       }
     } else {
       console.error('Error occurred while creating a repo');
       setUserMessage('Sorry, something went wrong while creating a repository');
-      setRepoCreated(false);
+      setErrorOccurred(true);
       setLoading(false);
     }
   }
@@ -113,7 +114,7 @@ function UploadInterface({ isAuthorized, token, repository }) {
             <Image src={loadingGif} height="48" width="48" />
             {userMessage}
           </Alert>
-        ) : repoCreated ? (
+        ) : !errorOccurred ? (
           <Alert variant="success" style={{ width: '85%', textAlign: 'left' }}>
             {userMessage}
           </Alert>

diff --git a/src/worker/functions/commit-files.js b/src/worker/functions/commit-files.js
@@ -27,14 +27,17 @@ const createBlobForFile = async (octokit, username, repoName, files) => {
   let blobDataPromises = [];
   for (const file of files) {
     let reader = new FileReader();
-    await reader.readAsDataURL(file);
+    await reader.readAsArrayBuffer(file);
     const promise = new Promise((resolve, reject) => {
       reader.onload = async () => {
-        const base64Data = reader.result;
+        const imageBuffer = reader.result;
+        const byteArray = new Uint8Array(imageBuffer);
+        const blob = new Blob([byteArray]);
+        const BlobURL = URL.createObjectURL(blob);
         const blobData = octokit.request(`POST /repos/${username}/${repoName}/git/blobs`, {
           owner: username,
           repo: repoName,
-          content: base64Data,
+          content: BlobURL,
         });
         resolve(blobData);
       };