s3: fixes #4039

pkg/interface/src/logic/lib/useDrag.ts

@@ -90,7 +90,7 @@ export function useFileDrag(dragged: (f: FileList | File[], e: DragEvent) => voi
     return () => {
       document.body.removeEventListener('mouseout', mouseleave);
     }
-  }, [setDragging]);
+  }, []);
 
   const bind = {
     onDragLeave,

pkg/interface/src/logic/lib/useS3.ts

@@ -1,6 +1,7 @@
 import { useCallback, useMemo, useEffect, useRef, useState } from "react";
 import { S3State } from "../../types/s3-update";
 import S3 from "aws-sdk/clients/s3";
+import { dateToDa, deSig } from "./util";
 
 export interface IuseS3 {
   canUpload: boolean;
@@ -37,9 +38,14 @@ const useS3 = (s3: S3State, { accept = '*' } = { accept: '*' }): IuseS3 => {
         throw new Error("S3 not ready");
       }
 
+      const fileParts = file.name.split('.');
+      const fileName = fileParts.slice(0, -1);
+      const fileExtension = fileParts.pop();
+      const timestamp = deSig(dateToDa(new Date()));
+
       const params = {
         Bucket: bucket,
-        Key: file.name,
+        Key: `${window.ship}/${timestamp}-${fileName}.${fileExtension}`,
         Body: file,
         ACL: "public-read",
         ContentType: file.type,
@@ -61,7 +67,7 @@ const useS3 = (s3: S3State, { accept = '*' } = { accept: '*' }): IuseS3 => {
       throw new Error("current bucket not set");
     }
     return upload(file, s3.configuration.currentBucket);
-  }, []);
+  }, [s3]);
 
   const promptUpload = useCallback(
     () => {

pkg/interface/src/views/apps/links/components/LinkSubmit.tsx

@@ -87,7 +87,7 @@ const LinkSubmit = (props: LinkSubmitProps) => {
   };
 
   const onFileDrag = useCallback(
-    async (files: FileList | File[], e: DragEvent) => {
+    (files: FileList | File[], e: DragEvent): void => {
       if (!canUpload) {
         return;
       }
@@ -117,17 +117,15 @@ const LinkSubmit = (props: LinkSubmitProps) => {
       event.preventDefault();
       event.stopPropagation();
       uploadDefault(event.clipboardData.files[0]).then(setLinkValue);
-    }, [setLinkValue]
+    }, [setLinkValue, uploadDefault]
   );
 
-  const onKeyPress = useCallback(
-    (e) => {
-      if (e.key === 'Enter') {
-        e.preventDefault();
-        doPost();
-      }
-    }, []
-  );
+  const onKeyPress = (e) => {
+    if (e.key === 'Enter') {
+      e.preventDefault();
+      doPost();
+    }
+  };
 
   const placeholder = <Text
     gray

pkg/interface/src/views/apps/publish/components/MarkdownEditor.tsx

@@ -98,7 +98,7 @@ export function MarkdownEditor(
   return (
     <Box
       height="100%"
-      position="static"
+      position="relative"
       className="publish"
       p={1}
       border={1}