refactor(documents): encapsulate panel logic and state into dedicated React contexts

frontend/src/documents/features/folders/useFolderItemLogic.ts

@@ -1,26 +1,34 @@
 import React, { type DragEvent } from 'react';
-import type { DocumentsViewProps } from '../../panel/DocumentsPanel';
 import type { DocumentViewLogic } from '../../logic/useDocumentViewLogic';
+import { useDocumentsCommandContext } from '../../context/DocumentsCommandContext';
+import { useDocumentsViewStateContext } from '../../context/DocumentsViewStateContext';
 
-interface UseFolderItemLogicProps extends DocumentsViewProps {
+interface UseFolderItemLogicProps {
     folder: any;
     viewLogic: DocumentViewLogic;
 }
 
 export const useFolderItemLogic = (props: UseFolderItemLogicProps) => {
+    const { folder, viewLogic } = props;
     const {
-        folder,
-        viewLogic,
         draggedFolderId,
-        onFolderClick,
-        onFolderSelect,
-        onFolderDragOver,
-        onFolderDragLeave,
-        onFolderDrop,
-        onFolderDragStart,
-        onFolderDragEnd,
-        onFolderRename,
-    } = props;
+    } = useDocumentsViewStateContext();
+
+    const {
+        folder: {
+            onClick: onFolderClick,
+            onSelect: onFolderSelect,
+            onRename: onFolderRename,
+            onDrag: {
+                start: onFolderDragStart,
+                end: onFolderDragEnd,
+                over: onFolderDragOver,
+                leave: onFolderDragLeave,
+                drop: onFolderDrop,
+            }
+        }
+
+    } = useDocumentsCommandContext();
 
     const {
         selectedFolderIdsSet,
@@ -92,3 +100,5 @@ export const useFolderItemLogic = (props: UseFolderItemLogicProps) => {
         handlers,
     };
 };
+
+