Add Workspace context

frontend/src/components/Editor.js

@@ -5,10 +5,10 @@ import { EditorView, keymap } from '@codemirror/view';
 import { markdown } from '@codemirror/lang-markdown';
 import { defaultKeymap } from '@codemirror/commands';
 import { oneDark } from '@codemirror/theme-one-dark';
-import { useSettings } from '../contexts/SettingsContext';
+import { useWorkspace } from '../contexts/WorkspaceContext';
 
 const Editor = ({ content, handleContentChange, handleSave, selectedFile }) => {
-  const { settings } = useSettings();
+  const { settings } = useWorkspace();
   const editorRef = useRef();
   const viewRef = useRef();
 

frontend/src/components/FileActions.js

@@ -6,11 +6,11 @@ import {
   IconGitPullRequest,
   IconGitCommit,
 } from '@tabler/icons-react';
-import { useSettings } from '../contexts/SettingsContext';
 import { useModalContext } from '../contexts/ModalContext';
+import { useWorkspace } from '../contexts/WorkspaceContext';
 
 const FileActions = ({ handlePullChanges, selectedFile }) => {
-  const { settings } = useSettings();
+  const { settings } = useWorkspace();
   const {
     setNewFileModalVisible,
     setDeleteFileModalVisible,

frontend/src/components/Layout.js

@@ -1,16 +1,30 @@
 import React from 'react';
-import { AppShell, Container } from '@mantine/core';
+import { AppShell, Container, Loader, Center } from '@mantine/core';
 import Header from './Header';
 import Sidebar from './Sidebar';
 import MainContent from './MainContent';
 import { useFileNavigation } from '../hooks/useFileNavigation';
 import { useFileList } from '../hooks/useFileList';
+import { useWorkspace } from '../contexts/WorkspaceContext';
 
 const Layout = () => {
+  const { currentWorkspace, loading: workspaceLoading } = useWorkspace();
   const { selectedFile, handleFileSelect, handleLinkClick } =
     useFileNavigation();
   const { files, loadFileList } = useFileList();
 
+  if (workspaceLoading) {
+    return (
+      <Center style={{ height: '100vh' }}>
+        <Loader size="xl" />
+      </Center>
+    );
+  }
+
+  if (!currentWorkspace) {
+    return <div>No workspace found. Please create a workspace.</div>;
+  }
+
   return (
     <AppShell header={{ height: 60 }} padding="md">
       <AppShell.Header>
@@ -22,8 +36,8 @@ const Layout = () => {
           p={0}
           style={{
             display: 'flex',
-            height: 'calc(100vh - 60px - 2rem)', // Subtracting header height and vertical padding
-            overflow: 'hidden', // Prevent scrolling in the container
+            height: 'calc(100vh - 60px - 2rem)',
+            overflow: 'hidden',
           }}
         >
           <Sidebar

frontend/src/components/MainContent.js

@@ -10,7 +10,7 @@ import CommitMessageModal from './modals/CommitMessageModal';
 import { useFileContent } from '../hooks/useFileContent';
 import { useFileOperations } from '../hooks/useFileOperations';
 import { useGitOperations } from '../hooks/useGitOperations';
-import { useSettings } from '../contexts/SettingsContext';
+import { useWorkspace } from '../contexts/WorkspaceContext';
 
 const MainContent = ({
   selectedFile,
@@ -19,7 +19,7 @@ const MainContent = ({
   loadFileList,
 }) => {
   const [activeTab, setActiveTab] = useState('source');
-  const { settings } = useSettings();
+  const { settings } = useWorkspace();
   const {
     content,
     hasUnsavedChanges,

frontend/src/components/Settings.js

@@ -1,7 +1,7 @@
 import React, { useReducer, useEffect, useCallback, useRef } from 'react';
 import { Modal, Badge, Button, Group, Title } from '@mantine/core';
 import { notifications } from '@mantine/notifications';
-import { useSettings } from '../contexts/SettingsContext';
+import { useWorkspace } from '../contexts/WorkspaceContext';
 import AppearanceSettings from './settings/AppearanceSettings';
 import EditorSettings from './settings/EditorSettings';
 import GitSettings from './settings/GitSettings';
@@ -50,7 +50,7 @@ function settingsReducer(state, action) {
 }
 
 const Settings = () => {
-  const { settings, updateSettings, colorScheme } = useSettings();
+  const { settings, updateSettings, colorScheme } = useWorkspace();
   const { settingsModalVisible, setSettingsModalVisible } = useModalContext();
   const [state, dispatch] = useReducer(settingsReducer, initialState);
   const isInitialMount = useRef(true);

frontend/src/components/Sidebar.js

@@ -3,10 +3,10 @@ import { Box } from '@mantine/core';
 import FileActions from './FileActions';
 import FileTree from './FileTree';
 import { useGitOperations } from '../hooks/useGitOperations';
-import { useSettings } from '../contexts/SettingsContext';
+import { useWorkspace } from '../contexts/WorkspaceContext';
 
 const Sidebar = ({ selectedFile, handleFileSelect, files, loadFileList }) => {
-  const { settings } = useSettings();
+  const { settings } = useWorkspace();
   const { handlePull } = useGitOperations(settings.gitEnabled);
 
   useEffect(() => {

frontend/src/components/settings/AppearanceSettings.js

@@ -1,9 +1,9 @@
 import React from 'react';
 import { Text, Switch, Group, Box, Title } from '@mantine/core';
-import { useSettings } from '../../contexts/SettingsContext';
+import { useWorkspace } from '../../contexts/WorkspaceContext';
 
 const AppearanceSettings = ({ onThemeChange }) => {
-  const { colorScheme, toggleColorScheme } = useSettings();
+  const { colorScheme, toggleColorScheme } = useWorkspace();
 
   const handleThemeChange = () => {
     toggleColorScheme();