feat: file backups

app/assets/javascripts/Components/AttachedFilesPopover/AttachedFilesButton.tsx

@@ -23,8 +23,20 @@ type Props = {
   onClickPreprocessing?: () => Promise<void>
 }
 
-const isHandlingFileDrag = (event: DragEvent) =>
-  event.dataTransfer?.items && Array.from(event.dataTransfer.items).some((item) => item.kind === 'file')
+const isHandlingFileDrag = (event: DragEvent, application: WebApplication) => {
+  const items = event.dataTransfer?.items
+
+  if (!items) {
+    return false
+  }
+
+  return Array.from(items).some((item) => {
+    const isFile = item.kind === 'file'
+    const fileName = item.getAsFile()?.name || ''
+    const isBackupMetadataFile = application.files.isFileNameFileBackupMetadataFile(fileName)
+    return isFile && !isBackupMetadataFile
+  })
+}
 
 export const AttachedFilesButton: FunctionComponent<Props> = observer(
   ({ application, appState, onClickPreprocessing }) => {
@@ -234,16 +246,19 @@ export const AttachedFilesButton: FunctionComponent<Props> = observer(
     const [isDraggingFiles, setIsDraggingFiles] = useState(false)
     const dragCounter = useRef(0)
 
-    const handleDrag = (event: DragEvent) => {
-      if (isHandlingFileDrag(event)) {
-        event.preventDefault()
-        event.stopPropagation()
-      }
-    }
+    const handleDrag = useCallback(
+      (event: DragEvent) => {
+        if (isHandlingFileDrag(event, application)) {
+          event.preventDefault()
+          event.stopPropagation()
+        }
+      },
+      [application],
+    )
 
     const handleDragIn = useCallback(
       (event: DragEvent) => {
-        if (!isHandlingFileDrag(event)) {
+        if (!isHandlingFileDrag(event, application)) {
           return
         }
 
@@ -268,29 +283,32 @@ export const AttachedFilesButton: FunctionComponent<Props> = observer(
           }
         }
       },
-      [open, toggleAttachedFilesMenu],
+      [open, toggleAttachedFilesMenu, application],
     )
 
-    const handleDragOut = (event: DragEvent) => {
-      if (!isHandlingFileDrag(event)) {
-        return
-      }
+    const handleDragOut = useCallback(
+      (event: DragEvent) => {
+        if (!isHandlingFileDrag(event, application)) {
+          return
+        }
 
-      event.preventDefault()
-      event.stopPropagation()
+        event.preventDefault()
+        event.stopPropagation()
 
-      dragCounter.current = dragCounter.current - 1
+        dragCounter.current = dragCounter.current - 1
 
-      if (dragCounter.current > 0) {
-        return
-      }
+        if (dragCounter.current > 0) {
+          return
+        }
 
-      setIsDraggingFiles(false)
-    }
+        setIsDraggingFiles(false)
+      },
+      [application],
+    )
 
     const handleDrop = useCallback(
       (event: DragEvent) => {
-        if (!isHandlingFileDrag(event)) {
+        if (!isHandlingFileDrag(event, application)) {
           return
         }
 
@@ -330,7 +348,7 @@ export const AttachedFilesButton: FunctionComponent<Props> = observer(
           dragCounter.current = 0
         }
       },
-      [appState.files, appState.features.hasFiles, attachFileToNote, currentTab],
+      [appState.files, appState.features.hasFiles, attachFileToNote, currentTab, application],
     )
 
     useEffect(() => {
@@ -345,7 +363,7 @@ export const AttachedFilesButton: FunctionComponent<Props> = observer(
         window.removeEventListener('dragover', handleDrag)
         window.removeEventListener('drop', handleDrop)
       }
-    }, [handleDragIn, handleDrop])
+    }, [handleDragIn, handleDrop, handleDrag, handleDragOut])
 
     return (
       <div ref={containerRef}>

app/assets/javascripts/Components/ChallengeModal/ChallengeModal.tsx

@@ -90,7 +90,7 @@ export const ChallengeModal: FunctionComponent<Props> = ({
     const valuesToProcess: ChallengeValue[] = []
     for (const inputValue of Object.values(validatedValues)) {
       const rawValue = inputValue.value
-      const value = new ChallengeValue(inputValue.prompt, rawValue)
+      const value = { prompt: inputValue.prompt, value: rawValue }
       valuesToProcess.push(value)
     }
     const processingPrompts = valuesToProcess.map((v) => v.prompt)

app/assets/javascripts/Components/Footer/index.tsx

@@ -76,7 +76,7 @@ export class Footer extends PureComponent<Props, State> {
 
   override componentDidMount(): void {
     super.componentDidMount()
-    this.application.getStatusManager().onStatusChange((message) => {
+    this.application.status.addEventObserver((_event, message) => {
       this.setState({
         arbitraryStatusMessage: message,
       })
@@ -124,7 +124,7 @@ export class Footer extends PureComponent<Props, State> {
   }
 
   override onAppStateEvent(eventName: AppStateEvent, data: any) {
-    const statusService = this.application.getStatusManager()
+    const statusService = this.application.status
     switch (eventName) {
       case AppStateEvent.EditorFocused:
         if (data.eventSource === EventSource.UserInteraction) {
@@ -172,7 +172,7 @@ export class Footer extends PureComponent<Props, State> {
         break
       case ApplicationEvent.CompletedFullSync:
         if (!this.completedInitialSync) {
-          this.application.getStatusManager().setMessage('')
+          this.application.status.setMessage('')
           this.completedInitialSync = true
         }
         if (!this.didCheckForOffline) {
@@ -202,7 +202,7 @@ export class Footer extends PureComponent<Props, State> {
         break
       case ApplicationEvent.WillSync:
         if (!this.completedInitialSync) {
-          this.application.getStatusManager().setMessage('Syncing…')
+          this.application.status.setMessage('Syncing…')
         }
         break
     }
@@ -213,7 +213,7 @@ export class Footer extends PureComponent<Props, State> {
   }
 
   updateSyncStatus() {
-    const statusManager = this.application.getStatusManager()
+    const statusManager = this.application.status
     const syncStatus = this.application.sync.getSyncStatus()
     const stats = syncStatus.getStats()
     if (syncStatus.hasError()) {
@@ -243,7 +243,7 @@ export class Footer extends PureComponent<Props, State> {
   }
 
   updateLocalDataStatus() {
-    const statusManager = this.application.getStatusManager()
+    const statusManager = this.application.status
     const syncStatus = this.application.sync.getSyncStatus()
     const stats = syncStatus.getStats()
     const encryption = this.application.isEncryptionAvailable()