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/ide-react/components/layout/placeholder/placeholder-editor-and-pdf.tsx

@@ -58,7 +58,7 @@ export default function PlaceholderEditorAndPdf({
                 minSize={250}
                 maxSize={336}
               >
-                <div className="ide-react-placeholder-symbol-palette ">
+                <div className="ide-react-symbol-palette ">
                   Symbol palette placeholder
                 </div>
               </Panel>

services/web/frontend/js/features/ide-react/components/layout/placeholder/placeholder-editor-sidebar.tsx

@@ -10,7 +10,7 @@ export default function PlaceholderEditorSidebar({
   shouldPersistLayout,
 }: PlaceholderEditorSidebarProps) {
   return (
-    <aside className="ide-react-placeholder-editor-sidebar">
+    <aside className="ide-react-editor-sidebar">
       <PanelGroup
         autoSaveId={
           shouldPersistLayout ? 'ide-react-editor-sidebar-layout' : undefined

services/web/frontend/js/features/ide-react/components/layout/placeholder/placeholder-header.tsx

@@ -1,8 +1,6 @@
 import React from 'react'
 import ChatToggleButton from '@/features/editor-navigation-toolbar/components/chat-toggle-button'
-import ShareProjectButton from '@/features/editor-navigation-toolbar/components/share-project-button'
 import HistoryToggleButton from '@/features/editor-navigation-toolbar/components/history-toggle-button'
-import LayoutDropdownButton from '@/features/editor-navigation-toolbar/components/layout-dropdown-button'
 
 type PlaceholderHeaderProps = {
   chatIsOpen: boolean
@@ -17,8 +15,6 @@ export default function PlaceholderHeader({
   historyIsOpen,
   setHistoryIsOpen,
 }: PlaceholderHeaderProps) {
-  function handleOpenShareModal() {}
-
   function toggleChatOpen() {
     setChatIsOpen(!chatIsOpen)
   }
@@ -31,12 +27,10 @@ export default function PlaceholderHeader({
     <header className="toolbar toolbar-header">
       <div className="toolbar-left">Header placeholder</div>
       <div className="toolbar-right">
-        <ShareProjectButton onClick={handleOpenShareModal} />
         <HistoryToggleButton
           historyIsOpen={historyIsOpen}
           onClick={toggleHistoryOpen}
         />
-        <LayoutDropdownButton />
         <ChatToggleButton
           chatIsOpen={chatIsOpen}
           onClick={toggleChatOpen}

services/web/frontend/js/features/ide-react/components/layout/placeholder/placeholder-history.tsx

@@ -15,7 +15,7 @@ export default function PlaceholderHistory({
   const [leftColumnIsOpen, setLeftColumnIsOpen] = useState(true)
 
   const leftColumnContent = (
-    <aside className="ide-react-placeholder-editor-sidebar history-file-tree">
+    <aside className="ide-react-editor-sidebar history-file-tree">
       History file tree placeholder
     </aside>
   )

services/web/frontend/js/features/ide-react/components/layout/two-column-main-content.tsx

@@ -74,7 +74,7 @@ export default function TwoColumnMainContent({
           tooltipWhenClosed={t('tooltip_show_filetree')}
         />
       </HorizontalResizeHandle>
-      <Panel>{rightColumnContent}</Panel>
+      <Panel className="ide-react-panel">{rightColumnContent}</Panel>
     </PanelGroup>
   )
 }