refactor: Restructure files and folders to better mimic feature-based architecture

src/components/main-content/view/MainContent.tsx

@@ -0,0 +1,181 @@
+import React, { useEffect } from 'react';
+
+import ChatInterface from '../../chat/view/ChatInterface';
+import FileTree from '../../FileTree';
+import StandaloneShell from '../../StandaloneShell';
+import GitPanel from '../../GitPanel';
+import ErrorBoundary from '../../ErrorBoundary';
+
+import MainContentHeader from './subcomponents/MainContentHeader';
+import MainContentStateView from './subcomponents/MainContentStateView';
+import EditorSidebar from './subcomponents/EditorSidebar';
+import TaskMasterPanel from './subcomponents/TaskMasterPanel';
+import type { MainContentProps } from '../types/types';
+
+import { useTaskMaster } from '../../../contexts/TaskMasterContext';
+import { useTasksSettings } from '../../../contexts/TasksSettingsContext';
+import { useUiPreferences } from '../../../hooks/useUiPreferences';
+import { useEditorSidebar } from '../hooks/useEditorSidebar';
+import type { Project } from '../../../types/app';
+
+const AnyStandaloneShell = StandaloneShell as any;
+const AnyGitPanel = GitPanel as any;
+
+type TaskMasterContextValue = {
+  currentProject?: Project | null;
+  setCurrentProject?: ((project: Project) => void) | null;
+};
+
+type TasksSettingsContextValue = {
+  tasksEnabled: boolean;
+  isTaskMasterInstalled: boolean | null;
+  isTaskMasterReady: boolean | null;
+};
+
+function MainContent({
+  selectedProject,
+  selectedSession,
+  activeTab,
+  setActiveTab,
+  ws,
+  sendMessage,
+  latestMessage,
+  isMobile,
+  onMenuClick,
+  isLoading,
+  onInputFocusChange,
+  onSessionActive,
+  onSessionInactive,
+  onSessionProcessing,
+  onSessionNotProcessing,
+  processingSessions,
+  onReplaceTemporarySession,
+  onNavigateToSession,
+  onShowSettings,
+  externalMessageUpdate,
+}: MainContentProps) {
+  const { preferences } = useUiPreferences();
+  const { autoExpandTools, showRawParameters, showThinking, autoScrollToBottom, sendByCtrlEnter } = preferences;
+
+  const { currentProject, setCurrentProject } = useTaskMaster() as TaskMasterContextValue;
+  const { tasksEnabled, isTaskMasterInstalled } = useTasksSettings() as TasksSettingsContextValue;
+
+  const shouldShowTasksTab = Boolean(tasksEnabled && isTaskMasterInstalled);
+
+  const {
+    editingFile,
+    editorWidth,
+    editorExpanded,
+    resizeHandleRef,
+    handleFileOpen,
+    handleCloseEditor,
+    handleToggleEditorExpand,
+    handleResizeStart,
+  } = useEditorSidebar({
+    selectedProject,
+    isMobile,
+  });
+
+  useEffect(() => {
+    if (selectedProject && selectedProject !== currentProject) {
+      setCurrentProject?.(selectedProject);
+    }
+  }, [selectedProject, currentProject, setCurrentProject]);
+
+  useEffect(() => {
+    if (!shouldShowTasksTab && activeTab === 'tasks') {
+      setActiveTab('chat');
+    }
+  }, [shouldShowTasksTab, activeTab, setActiveTab]);
+
+  if (isLoading) {
+    return <MainContentStateView mode="loading" isMobile={isMobile} onMenuClick={onMenuClick} />;
+  }
+
+  if (!selectedProject) {
+    return <MainContentStateView mode="empty" isMobile={isMobile} onMenuClick={onMenuClick} />;
+  }
+
+  return (
+    <div className="h-full flex flex-col">
+      <MainContentHeader
+        activeTab={activeTab}
+        setActiveTab={setActiveTab}
+        selectedProject={selectedProject}
+        selectedSession={selectedSession}
+        shouldShowTasksTab={shouldShowTasksTab}
+        isMobile={isMobile}
+        onMenuClick={onMenuClick}
+      />
+
+      <div className="flex-1 flex min-h-0 overflow-hidden">
+        <div className={`flex-1 flex flex-col min-h-0 overflow-hidden ${editorExpanded ? 'hidden' : ''}`}>
+          <div className={`h-full ${activeTab === 'chat' ? 'block' : 'hidden'}`}>
+            <ErrorBoundary showDetails>
+              <ChatInterface
+                selectedProject={selectedProject}
+                selectedSession={selectedSession}
+                ws={ws}
+                sendMessage={sendMessage}
+                latestMessage={latestMessage}
+                onFileOpen={handleFileOpen}
+                onInputFocusChange={onInputFocusChange}
+                onSessionActive={onSessionActive}
+                onSessionInactive={onSessionInactive}
+                onSessionProcessing={onSessionProcessing}
+                onSessionNotProcessing={onSessionNotProcessing}
+                processingSessions={processingSessions}
+                onReplaceTemporarySession={onReplaceTemporarySession}
+                onNavigateToSession={onNavigateToSession}
+                onShowSettings={onShowSettings}
+                autoExpandTools={autoExpandTools}
+                showRawParameters={showRawParameters}
+                showThinking={showThinking}
+                autoScrollToBottom={autoScrollToBottom}
+                sendByCtrlEnter={sendByCtrlEnter}
+                externalMessageUpdate={externalMessageUpdate}
+                onShowAllTasks={tasksEnabled ? () => setActiveTab('tasks') : null}
+              />
+            </ErrorBoundary>
+          </div>
+
+          {activeTab === 'files' && (
+            <div className="h-full overflow-hidden">
+              <FileTree selectedProject={selectedProject} />
+            </div>
+          )}
+
+          {activeTab === 'shell' && (
+            <div className="h-full w-full overflow-hidden">
+              <AnyStandaloneShell project={selectedProject} session={selectedSession} showHeader={false} />
+            </div>
+          )}
+
+          {activeTab === 'git' && (
+            <div className="h-full overflow-hidden">
+              <AnyGitPanel selectedProject={selectedProject} isMobile={isMobile} onFileOpen={handleFileOpen} />
+            </div>
+          )}
+
+          {shouldShowTasksTab && <TaskMasterPanel isVisible={activeTab === 'tasks'} />}
+
+          <div className={`h-full overflow-hidden ${activeTab === 'preview' ? 'block' : 'hidden'}`} />
+        </div>
+
+        <EditorSidebar
+          editingFile={editingFile}
+          isMobile={isMobile}
+          editorExpanded={editorExpanded}
+          editorWidth={editorWidth}
+          resizeHandleRef={resizeHandleRef}
+          onResizeStart={handleResizeStart}
+          onCloseEditor={handleCloseEditor}
+          onToggleEditorExpand={handleToggleEditorExpand}
+          projectPath={selectedProject.path}
+        />
+      </div>
+    </div>
+  );
+}
+
+export default React.memo(MainContent);