Feature/V2/Compress (#3982)

# Description of Changes

- Added the compression tool
- Slightly adjusted the padding on split, compress and the parent
sidebar component so things aren't so smushed
- Future work will be to allow multi-select on files and to add further
styling to the toolstep / sidebar component

---

## Checklist

### General

- [ ] I have read the [Contribution
Guidelines](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/CONTRIBUTING.md)
- [ ] I have read the [Stirling-PDF Developer
Guide](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/DeveloperGuide.md)
(if applicable)
- [ ] I have read the [How to add new languages to
Stirling-PDF](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/HowToAddNewLanguage.md)
(if applicable)
- [ ] I have performed a self-review of my own code
- [ ] My changes generate no new warnings

### Documentation

- [ ] I have updated relevant docs on [Stirling-PDF's doc
repo](https://github.com/Stirling-Tools/Stirling-Tools.github.io/blob/main/docs/)
(if functionality has heavily changed)
- [ ] I have read the section [Add New Translation
Tags](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/HowToAddNewLanguage.md#add-new-translation-tags)
(for new translation tags only)

### UI Changes (if applicable)

- [ ] Screenshots or videos demonstrating the UI changes are attached
(e.g., as comments or direct attachments in the PR)

### Testing (if applicable)

- [ ] I have tested my changes locally. Refer to the [Testing
Guide](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/DeveloperGuide.md#6-testing)
for more details.

---------

Co-authored-by: Ethan <[email protected]>
Co-authored-by: Anthony Stirling <[email protected]>

frontend/src/pages/HomePage.tsx

@@ -100,7 +100,7 @@ export default function HomePage() {
         className={`h-screen flex flex-col overflow-hidden bg-[var(--bg-surface)] border-r border-[var(--border-subtle)] transition-all duration-300 ease-out ${isRainbowMode ? rainbowStyles.rainbowPaper : ''}`}
         style={{
           width: sidebarsVisible && !readerMode ? '14vw' : '0',
-          padding: sidebarsVisible && !readerMode ? '1rem' : '0'
+          padding: sidebarsVisible && !readerMode ? '0.5rem' : '0'
         }}
       >
           <div
@@ -137,7 +137,7 @@ export default function HomePage() {
                 </div>
 
                 {/* Tool title */}
-                <div className="mb-4">
+                <div className="mb-4" style={{ marginLeft: '0.5rem' }}>
                   <h2 className="text-lg font-semibold">{selectedTool?.name}</h2>
                 </div>
 
@@ -219,6 +219,11 @@ export default function HomePage() {
                       setCurrentView('split');
                       setLeftPanelView('toolContent');
                       sessionStorage.removeItem('previousMode');
+                    } else if (previousMode === 'compress') {
+                      selectTool('compress');
+                      setCurrentView('compress');
+                      setLeftPanelView('toolContent');
+                      sessionStorage.removeItem('previousMode');
                     } else {
                       setCurrentView('fileEditor');
                     }
@@ -251,7 +256,17 @@ export default function HomePage() {
             ) : currentView === "split" ? (
               <FileEditor
                 toolMode={true}
-                multiSelect={false}
+                multiSelect={false} 
+                showUpload={true}
+                showBulkActions={true}
+                onFileSelect={(files) => {
+                  setToolSelectedFiles(files);
+                }}
+              />
+            ) : currentView === "compress" ? (
+              <FileEditor
+                toolMode={true}
+                multiSelect={false} // TODO: make this work with multiple files
                 showUpload={true}
                 showBulkActions={true}
                 onFileSelect={(files) => {