Make changes for video processing check

regalijan · Oct 19, 2023 · de8fc6a · de8fc6a
1 parent 4e0729e
commit de8fc6a
Show file tree

Hide file tree

Showing 3 changed files with 95 additions and 135 deletions.
diff --git a/components/ReportCard.tsx b/components/ReportCard.tsx
@@ -21,28 +21,13 @@ export default function (props: ReportCardProps) {
   const [loading, setLoading] = useState(false);
   const toast = useToast();
   const targetMap: { [k: number]: string } = {};
-  const [attachmentsReady, setAttachmentReady] = useState(
-    !props.attachments_loading,
-  );
   const actionMap: { [k: number]: number } = {};
 
   for (let i = 0; i < props.target_ids.length; i++)
     Object.defineProperty(targetMap, props.target_ids[i], {
       value: props.target_usernames[i],
     });
 
-  async function recheckAttachment() {
-    const attachmentCheck = await fetch("/api/uploads/status", {
-      body: JSON.stringify(props.attachments),
-      headers: {
-        "content-type": "application/json",
-      },
-      method: "POST",
-    });
-
-    setAttachmentReady(attachmentCheck.ok);
-  }
-
   async function submitActions() {
     setLoading(true);
     const submitReq = await fetch(`/api/reports/${props.id}/action`, {
@@ -82,124 +67,109 @@ export default function (props: ReportCardProps) {
         <Text fontSize="xs">ID(s): {props.target_ids.toString()}</Text>
       </CardHeader>
       <CardBody>
-        {attachmentsReady ? (
-          <div style={{ position: "relative" }}>
-            <video
-              autoPlay={true}
-              controls={true}
-              src={`/api/uploads/${props.attachments[attachmentIdx]}`}
-              width="100%"
-            />
-            <HStack
-              pos="absolute"
-              top="50%"
-              transform="translate(5%, -50%)"
-              w="90%"
-              zIndex="1"
+        <div style={{ position: "relative" }}>
+          <video autoPlay={true} controls={true} width="100%">
+            <source src={`/api/uploads/${props.attachments[attachmentIdx]}`} />
+            <source src="/files/processing.webm" />
+          </video>
+          <HStack
+            pos="absolute"
+            top="50%"
+            transform="translate(5%, -50%)"
+            w="90%"
+            zIndex="1"
+          >
+            <Button
+              borderRadius="50%"
+              h="16"
+              onClick={() => setAttachmentIdx(attachmentIdx - 1)}
+              visibility={attachmentIdx > 0 ? "visible" : "hidden"}
+              w="16"
             >
-              <Button
-                borderRadius="50%"
-                h="16"
-                onClick={() => setAttachmentIdx(attachmentIdx - 1)}
-                visibility={attachmentIdx > 0 ? "visible" : "hidden"}
-                w="16"
+              <svg
+                xmlns="http://www.w3.org/2000/svg"
+                width="32"
+                height="32"
+                fill="currentColor"
+                viewBox="0 0 16 16"
               >
-                <svg
-                  xmlns="http://www.w3.org/2000/svg"
-                  width="32"
-                  height="32"
-                  fill="currentColor"
-                  viewBox="0 0 16 16"
-                >
-                  <path
-                    fillRule="evenodd"
-                    d="M12 8a.5.5 0 0 1-.5.5H5.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L5.707 7.5H11.5a.5.5 0 0 1 .5.5z"
-                  />
-                </svg>
-              </Button>
-              <Spacer />
-              <Button
-                borderRadius="50%"
-                h="16"
-                onClick={() => setAttachmentIdx(attachmentIdx + 1)}
-                visibility={
-                  props.attachments.length > attachmentIdx + 1
-                    ? "visible"
-                    : "hidden"
-                }
-                w="16"
+                <path
+                  fillRule="evenodd"
+                  d="M12 8a.5.5 0 0 1-.5.5H5.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L5.707 7.5H11.5a.5.5 0 0 1 .5.5z"
+                />
+              </svg>
+            </Button>
+            <Spacer />
+            <Button
+              borderRadius="50%"
+              h="16"
+              onClick={() => setAttachmentIdx(attachmentIdx + 1)}
+              visibility={
+                props.attachments.length > attachmentIdx + 1
+                  ? "visible"
+                  : "hidden"
+              }
+              w="16"
+            >
+              <svg
+                xmlns="http://www.w3.org/2000/svg"
+                width="32"
+                height="32"
+                fill="currentColor"
+                viewBox="0 0 16 16"
               >
-                <svg
-                  xmlns="http://www.w3.org/2000/svg"
-                  width="32"
-                  height="32"
-                  fill="currentColor"
-                  viewBox="0 0 16 16"
-                >
-                  <path
-                    fillRule="evenodd"
-                    d="M4 8a.5.5 0 0 1 .5-.5h5.793L8.146 5.354a.5.5 0 1 1 .708-.708l3 3a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708-.708L10.293 8.5H4.5A.5.5 0 0 1 4 8z"
-                  />
-                </svg>
-              </Button>
-            </HStack>
-          </div>
-        ) : (
-          <Text>Attachments processing...</Text>
-        )}
+                <path
+                  fillRule="evenodd"
+                  d="M4 8a.5.5 0 0 1 .5-.5h5.793L8.146 5.354a.5.5 0 1 1 .708-.708l3 3a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708-.708L10.293 8.5H4.5A.5.5 0 0 1 4 8z"
+                />
+              </svg>
+            </Button>
+          </HStack>
+        </div>
         <br />
         <Text my="16px">{props.description}</Text>
       </CardBody>
       <CardFooter>
-        {props.attachments_loading ? (
-          <Button
-            colorScheme="blue"
-            onClick={async () => await recheckAttachment()}
-          >
-            Reload Attachment
-          </Button>
-        ) : (
-          <Stack direction="column">
-            {(function () {
-              const radioGroups = [];
-              for (let i = 0; i < props.target_ids.length; i++) {
-                radioGroups.push(
-                  <RadioGroup
-                    name={props.target_ids[i].toString()}
-                    onChange={(val) => {
-                      actionMap[props.target_ids[i]] = parseInt(val);
-                    }}
-                  >
-                    <Stack direction="row">
-                      <Text>{props.target_usernames[i]}</Text>
-                      <Radio key={0} value="0">
-                        Ignore
-                      </Radio>
-                      <Radio key={1} value="1">
-                        Hide from Leaderboards
-                      </Radio>
-                      <Radio key={2} value="2">
-                        Ban
-                      </Radio>
-                    </Stack>
-                  </RadioGroup>,
-                );
-              }
+        <Stack direction="column">
+          {(function () {
+            const radioGroups = [];
+            for (let i = 0; i < props.target_ids.length; i++) {
+              radioGroups.push(
+                <RadioGroup
+                  name={props.target_ids[i].toString()}
+                  onChange={(val) => {
+                    actionMap[props.target_ids[i]] = parseInt(val);
+                  }}
+                >
+                  <Stack direction="row">
+                    <Text>{props.target_usernames[i]}</Text>
+                    <Radio key={0} value="0">
+                      Ignore
+                    </Radio>
+                    <Radio key={1} value="1">
+                      Hide from Leaderboards
+                    </Radio>
+                    <Radio key={2} value="2">
+                      Ban
+                    </Radio>
+                  </Stack>
+                </RadioGroup>,
+              );
+            }
 
-              return radioGroups;
-            })()}
-            <Box pt="16px">
-              <Button
-                colorScheme="blue"
-                onClick={async () => await submitActions()}
-                isLoading={loading}
-                loadingText="Submitting..."
-              >
-                Submit
-              </Button>
-            </Box>
-          </Stack>
-        )}
+            return radioGroups;
+          })()}
+          <Box pt="16px">
+            <Button
+              colorScheme="blue"
+              onClick={async () => await submitActions()}
+              isLoading={loading}
+              loadingText="Submitting..."
+            >
+              Submit
+            </Button>
+          </Box>
+        </Stack>
       </CardFooter>
     </Card>
   );

diff --git a/functions/api/reports/submit.ts b/functions/api/reports/submit.ts
@@ -189,15 +189,6 @@ export async function onRequestPost(context: RequestContext) {
     uploadUrls.push(urlResult.value);
 
     let url = new URL(urlResult.value).searchParams.get("name") as string;
-    const extension = (url.split(".").at(-1) as string).toLowerCase();
-
-    if (["mkv", "wmv"].includes(extension)) {
-      url = url.replace(`.${extension}`, ".mp4");
-
-      await context.env.DATA.put(`videoprocessing_${url}`, "1", {
-        expirationTtl: 600,
-      });
-    }
 
     attachments.push(url);
   }

diff --git a/index.d.ts b/index.d.ts
@@ -63,7 +63,6 @@ declare global {
 
   interface ReportCardProps {
     attachments: string[];
-    attachments_loading?: boolean;
     created_at: number;
     description?: string;
     id: string;