feat: file drop handling for super notes (#1990)

packages/web/src/javascripts/Controllers/Abstract/AbstractViewController.ts

@@ -1,11 +1,14 @@
 import { CrossControllerEvent } from '../CrossControllerEvent'
-import { InternalEventBus, InternalEventPublishStrategy } from '@standardnotes/snjs'
+import { InternalEventBus, InternalEventPublishStrategy, removeFromArray } from '@standardnotes/snjs'
 import { WebApplication } from '../../Application/Application'
 import { Disposer } from '@/Types/Disposer'
 
-export abstract class AbstractViewController {
+type ControllerEventObserver<Event = void, EventData = void> = (event: Event, data: EventData) => void
+
+export abstract class AbstractViewController<Event = void, EventData = void> {
   dealloced = false
   protected disposers: Disposer[] = []
+  private eventObservers: ControllerEventObserver<Event, EventData>[] = []
 
   constructor(public application: WebApplication, protected eventBus: InternalEventBus) {}
 
@@ -23,5 +26,19 @@ export abstract class AbstractViewController {
     }
 
     ;(this.disposers as unknown) = undefined
+
+    this.eventObservers.length = 0
+  }
+
+  addEventObserver(observer: ControllerEventObserver<Event, EventData>): () => void {
+    this.eventObservers.push(observer)
+
+    return () => {
+      removeFromArray(this.eventObservers, observer)
+    }
+  }
+
+  notifyEvent(event: Event, data: EventData): void {
+    this.eventObservers.forEach((observer) => observer(event, data))
   }
 }

packages/web/src/javascripts/Controllers/FilesController.ts

@@ -34,7 +34,17 @@ const NonMutatingFileActions = [PopoverFileItemActionType.DownloadFile, PopoverF
 
 type FileContextMenuLocation = { x: number; y: number }
 
-export class FilesController extends AbstractViewController {
+export type FilesControllerEventData = {
+  [FilesControllerEvent.FileUploadedToNote]: {
+    uuid: string
+  }
+}
+
+export enum FilesControllerEvent {
+  FileUploadedToNote,
+}
+
+export class FilesController extends AbstractViewController<FilesControllerEvent, FilesControllerEventData> {
   allFiles: FileItem[] = []
   attachedFiles: FileItem[] = []
   showFileContextMenu = false
@@ -388,6 +398,10 @@ export class FilesController extends AbstractViewController {
           type: ToastType.Success,
           message: `Uploaded file "${uploadedFile.name}"`,
         })
+
+        this.notifyEvent(FilesControllerEvent.FileUploadedToNote, {
+          [FilesControllerEvent.FileUploadedToNote]: { uuid: uploadedFile.uuid },
+        })
       }
 
       return uploadedFiles

packages/web/src/javascripts/Controllers/FilesControllerProvider.tsx

@@ -0,0 +1,35 @@
+import { ReactNode, createContext, useContext, memo } from 'react'
+import { observer } from 'mobx-react-lite'
+import { FilesController } from '@/Controllers/FilesController'
+
+const FilesControllerContext = createContext<FilesController | undefined>(undefined)
+
+export const useFilesController = () => {
+  const value = useContext(FilesControllerContext)
+
+  if (!value) {
+    throw new Error('Component must be a child of <FilesControllerProvider />')
+  }
+
+  return value
+}
+
+type ChildrenProps = {
+  children: ReactNode
+}
+
+type ProviderProps = {
+  controller: FilesController
+} & ChildrenProps
+
+const MemoizedChildren = memo(({ children }: ChildrenProps) => <>{children}</>)
+
+const FilesControllerProvider = ({ controller, children }: ProviderProps) => {
+  return (
+    <FilesControllerContext.Provider value={controller}>
+      <MemoizedChildren children={children} />
+    </FilesControllerContext.Provider>
+  )
+}
+
+export default observer(FilesControllerProvider)

packages/web/src/javascripts/Controllers/LinkingControllerProvider.tsx

@@ -0,0 +1,35 @@
+import { ReactNode, createContext, useContext, memo } from 'react'
+import { observer } from 'mobx-react-lite'
+import { LinkingController } from '@/Controllers/LinkingController'
+
+const LinkingControllerContext = createContext<LinkingController | undefined>(undefined)
+
+export const useLinkingController = () => {
+  const value = useContext(LinkingControllerContext)
+
+  if (!value) {
+    throw new Error('Component must be a child of <LinkingControllerProvider />')
+  }
+
+  return value
+}
+
+type ChildrenProps = {
+  children: ReactNode
+}
+
+type ProviderProps = {
+  controller: LinkingController
+} & ChildrenProps
+
+const MemoizedChildren = memo(({ children }: ChildrenProps) => <>{children}</>)
+
+const LinkingControllerProvider = ({ controller, children }: ProviderProps) => {
+  return (
+    <LinkingControllerContext.Provider value={controller}>
+      <MemoizedChildren children={children} />
+    </LinkingControllerContext.Provider>
+  )
+}
+
+export default observer(LinkingControllerProvider)