Merge pull request #15474 from overleaf/td-ide-page-file-and-multiple-view

React IDE page: implement file views and file delete handling

GitOrigin-RevId: 491cad7b147e55bc4a250da387916c7e2dff14ae

services/web/frontend/js/features/file-tree/components/file-tree-root.jsx

@@ -29,6 +29,7 @@ const FileTreeRoot = React.memo(function FileTreeRoot({
   setStartedFreeTrial,
   onSelect,
   onInit,
+  onDelete,
   isConnected,
 }) {
   const { _id: projectId } = useProjectContext(projectContextPropTypes)
@@ -52,7 +53,7 @@ const FileTreeRoot = React.memo(function FileTreeRoot({
       <FileTreeToolbar />
       <FileTreeContextMenu />
       <FileTreeInner>
-        <FileTreeRootFolder />
+        <FileTreeRootFolder onDelete={onDelete} />
       </FileTreeInner>
       <FileTreeModalDelete />
       <FileTreeModalCreateFile />
@@ -62,8 +63,8 @@ const FileTreeRoot = React.memo(function FileTreeRoot({
   )
 })
 
-function FileTreeRootFolder() {
-  useFileTreeSocketListener()
+function FileTreeRootFolder({ onDelete }) {
+  useFileTreeSocketListener(onDelete)
   const { fileTreeData } = useFileTreeData()
 
   const { isOver, dropRef } = useDroppable(fileTreeData._id)
@@ -93,9 +94,14 @@ function FileTreeRootFolder() {
   )
 }
 
+FileTreeRootFolder.propTypes = {
+  onDelete: PropTypes.func,
+}
+
 FileTreeRoot.propTypes = {
   onSelect: PropTypes.func.isRequired,
   onInit: PropTypes.func.isRequired,
+  onDelete: PropTypes.func,
   isConnected: PropTypes.bool.isRequired,
   setRefProviderEnabled: PropTypes.func.isRequired,
   setStartedFreeTrial: PropTypes.func.isRequired,