Set up and run eslint and prettier

frontend/src/components/MainContent.js

@@ -1,5 +1,15 @@
 import React, { useState } from 'react';
-import { Grid, Breadcrumbs, Tabs, Dot, useTheme, useToasts, Modal, Input, Button } from '@geist-ui/core';
+import {
+  Grid,
+  Breadcrumbs,
+  Tabs,
+  Dot,
+  useTheme,
+  useToasts,
+  Modal,
+  Input,
+  Button,
+} from '@geist-ui/core';
 import { Code, Eye } from '@geist-ui/icons';
 import Editor from './Editor';
 import FileTree from './FileTree';
@@ -29,7 +39,10 @@ const MainContent = ({
       await pullLatestChanges();
       setToast({ text: 'Successfully pulled latest changes', type: 'success' });
     } catch (error) {
-      setToast({ text: 'Failed to pull changes: ' + error.message, type: 'error' });
+      setToast({
+        text: 'Failed to pull changes: ' + error.message,
+        type: 'error',
+      });
     }
   };
 
@@ -38,11 +51,17 @@ const MainContent = ({
       const message = prompt('Enter commit message:');
       if (message) {
         await commitAndPush(message);
-        setToast({ text: 'Changes committed and pushed successfully', type: 'success' });
+        setToast({
+          text: 'Changes committed and pushed successfully',
+          type: 'success',
+        });
         await pullLatestChanges(); // Pull changes after successful push
       }
     } catch (error) {
-      setToast({ text: 'Failed to commit and push changes: ' + error.message, type: 'error' });
+      setToast({
+        text: 'Failed to commit and push changes: ' + error.message,
+        type: 'error',
+      });
     }
   };
 
@@ -58,7 +77,10 @@ const MainContent = ({
         await pullLatestChanges(); // Refresh file list
         onFileSelect(newFileName); // Select the new file
       } catch (error) {
-        setToast({ text: 'Failed to create new file: ' + error.message, type: 'error' });
+        setToast({
+          text: 'Failed to create new file: ' + error.message,
+          type: 'error',
+        });
       }
     }
     setNewFileModalVisible(false);
@@ -67,7 +89,9 @@ const MainContent = ({
 
   const handleDeleteFile = async () => {
     if (selectedFile) {
-      const confirmDelete = window.confirm(`Are you sure you want to delete "${selectedFile}"?`);
+      const confirmDelete = window.confirm(
+        `Are you sure you want to delete "${selectedFile}"?`
+      );
       if (confirmDelete) {
         try {
           await deleteFile(selectedFile);
@@ -75,7 +99,10 @@ const MainContent = ({
           await pullLatestChanges(); // Refresh file list
           onFileSelect(null); // Deselect the file
         } catch (error) {
-          setToast({ text: 'Failed to delete file: ' + error.message, type: 'error' });
+          setToast({
+            text: 'Failed to delete file: ' + error.message,
+            type: 'error',
+          });
         }
       }
     }
@@ -91,7 +118,9 @@ const MainContent = ({
             <Breadcrumbs.Item key={index}>{part}</Breadcrumbs.Item>
           ))}
         </Breadcrumbs>
-        {hasUnsavedChanges && <Dot type="warning" className="unsaved-indicator" />}
+        {hasUnsavedChanges && (
+          <Dot type="warning" className="unsaved-indicator" />
+        )}
       </div>
     );
   };
@@ -101,9 +130,9 @@ const MainContent = ({
       <Grid.Container gap={1} height="calc(100vh - 64px)">
         <Grid xs={24} sm={6} md={5} lg={4} height="100%" className="sidebar">
           <div className="file-tree-container">
-            <FileTree 
-              files={files} 
-              onFileSelect={onFileSelect} 
+            <FileTree
+              files={files}
+              onFileSelect={onFileSelect}
               selectedFile={selectedFile}
               gitEnabled={settings.gitEnabled}
               gitAutoCommit={settings.gitAutoCommit}
@@ -114,7 +143,14 @@ const MainContent = ({
             />
           </div>
         </Grid>
-        <Grid xs={24} sm={18} md={19} lg={20} height="100%" className="main-content">
+        <Grid
+          xs={24}
+          sm={18}
+          md={19}
+          lg={20}
+          height="100%"
+          className="main-content"
+        >
           <div className="content-header">
             {renderBreadcrumbs()}
             <Tabs value={activeTab} onChange={setActiveTab}>
@@ -124,9 +160,9 @@ const MainContent = ({
           </div>
           <div className="content-body">
             {activeTab === 'source' ? (
-              <Editor 
-                content={content} 
-                onChange={onContentChange} 
+              <Editor
+                content={content}
+                onChange={onContentChange}
                 onSave={onSave}
                 filePath={selectedFile}
                 themeType={themeType}
@@ -137,21 +173,26 @@ const MainContent = ({
           </div>
         </Grid>
       </Grid.Container>
-      <Modal visible={newFileModalVisible} onClose={() => setNewFileModalVisible(false)}>
+      <Modal
+        visible={newFileModalVisible}
+        onClose={() => setNewFileModalVisible(false)}
+      >
         <Modal.Title>Create New File</Modal.Title>
         <Modal.Content>
-          <Input 
-            width="100%" 
+          <Input
+            width="100%"
             placeholder="Enter file name"
             value={newFileName}
             onChange={(e) => setNewFileName(e.target.value)}
           />
         </Modal.Content>
-        <Modal.Action passive onClick={() => setNewFileModalVisible(false)}>Cancel</Modal.Action>
+        <Modal.Action passive onClick={() => setNewFileModalVisible(false)}>
+          Cancel
+        </Modal.Action>
         <Modal.Action onClick={handleNewFileSubmit}>Create</Modal.Action>
       </Modal>
     </>
   );
 };
 
-export default MainContent;
+export default MainContent;