From c1df53a7616ccbb9afad2deaf3026e70f3e974b4 Mon Sep 17 00:00:00 2001
From: Sophie Zhang <sophie_zhang@brown.edu>
Date: Tue, 11 Jul 2023 13:30:51 -0400
Subject: starting connecting to new upload endpoint and standardized
 displaying media

---
 src/client/util/reportManager/ReportManager.tsx | 75 ++++++++++++++-----------
 1 file changed, 41 insertions(+), 34 deletions(-)

(limited to 'src/client/util/reportManager/ReportManager.tsx')

diff --git a/src/client/util/reportManager/ReportManager.tsx b/src/client/util/reportManager/ReportManager.tsx
index ff17a5097..d091e2a34 100644
--- a/src/client/util/reportManager/ReportManager.tsx
+++ b/src/client/util/reportManager/ReportManager.tsx
@@ -164,11 +164,11 @@ export class ReportManager extends React.Component<{}> {
         this.setSubmitting(true);
 
         const links = await this.uploadFilesToServer();
+        console.log(links);
         if (!links) {
             // error uploading files to the server
             return;
         }
-        console.log(links);
         const formattedLinks = (links ?? []).map(this.fileLinktoServerLink);
 
         // const req = await this.octokit.request('POST /repos/{owner}/{repo}/issues', {
@@ -252,12 +252,43 @@ export class ReportManager extends React.Component<{}> {
 
     /**
      * Handles file upload.
+     *
      * @param files uploaded files
      */
     private onDrop = (files: File[]) => {
         this.setMediaFiles([...this.mediaFiles, ...files.map(file => ({ _id: v4(), file }))]);
     };
 
+    /**
+     * Returns when the issue passes the current filters.
+     *
+     * @param issue issue to check
+     * @returns boolean indicating whether the issue passes the current filters
+     */
+    private passesTagFilter = (issue: Issue) => {
+        let passesPriority = true;
+        let passesBug = true;
+        if (this.priorityFilter) {
+            passesPriority = issue.labels.some(label => {
+                if (typeof label === 'string') {
+                    return label === this.priorityFilter;
+                } else {
+                    return label.name === this.priorityFilter;
+                }
+            });
+        }
+        if (this.bugFilter) {
+            passesBug = issue.labels.some(label => {
+                if (typeof label === 'string') {
+                    return label === this.bugFilter;
+                } else {
+                    return label.name === this.bugFilter;
+                }
+            });
+        }
+        return passesPriority && passesBug;
+    };
+
     /**
      * Gets a JSX element to render a media preview
      * @param fileData file data
@@ -306,30 +337,6 @@ export class ReportManager extends React.Component<{}> {
         return <></>;
     };
 
-    private passesTagFilter = (issue: Issue) => {
-        let passesPriority = true;
-        let passesBug = true;
-        if (this.priorityFilter) {
-            passesPriority = issue.labels.some(label => {
-                if (typeof label === 'string') {
-                    return label === this.priorityFilter;
-                } else {
-                    return label.name === this.priorityFilter;
-                }
-            });
-        }
-        if (this.bugFilter) {
-            passesBug = issue.labels.some(label => {
-                if (typeof label === 'string') {
-                    return label === this.bugFilter;
-                } else {
-                    return label.name === this.bugFilter;
-                }
-            });
-        }
-        return passesPriority && passesBug;
-    };
-
     /**
      * @returns the component that dispays all issues
      */
@@ -487,26 +494,26 @@ export class ReportManager extends React.Component<{}> {
                         <option value="" disabled selected>
                             Type
                         </option>
-                        <option className="report-opt" value="bug">
+                        <option className="report-opt" value={BugType.BUG}>
                             Bug
                         </option>
-                        <option className="report-opt" value="cosmetic">
+                        <option className="report-opt" value={BugType.COSMETIC}>
                             Poor Design or Cosmetic
                         </option>
-                        <option className="report-opt" value="documentation">
+                        <option className="report-opt" value={BugType.DOCUMENTATION}>
                             Poor Documentation
                         </option>
-                        <option className="report-opt" value="enhancement">
+                        <option className="report-opt" value={BugType.ENHANCEMENT}>
                             New feature or request
                         </option>
                     </select>
-                    <select className="report-select" name="bigPriority" onChange={e => (this.bugPriority = e.target.value)}>
+                    <select className="report-select" name="priority" onChange={e => (this.bugPriority = e.target.value)}>
                         <option className="report-opt" value="" disabled selected>
                             Priority
                         </option>
-                        <option value="priority-low">Low</option>
-                        <option value="priority-medium">Medium</option>
-                        <option value="priority-high">High</option>
+                        <option value={Priority.LOW}>Low</option>
+                        <option value={Priority.MEDIUM}>Medium</option>
+                        <option value={Priority.HIGH}>High</option>
                     </select>
                 </div>
                 <Dropzone
@@ -536,7 +543,7 @@ export class ReportManager extends React.Component<{}> {
                         this.reportIssue();
                     }}>
                     Submit
-                    {this.submitting && <ReactLoading type="spin" color={theme.palette.primary.main} width={20} height={20} />}
+                    {this.submitting && <ReactLoading type="spin" color={'#ffffff'} width={20} height={20} />}
                 </Button>
                 <IconButton onClick={this.close} sx={{ position: 'absolute', top: '4px', right: '4px' }}>
                     <CgClose size={'16px'} />
-- 
cgit v1.2.3-70-g09d2

