clean background images when resetting

Author: AnthonyGress

backend/src/routes/system.route.ts

@@ -80,3 +80,21 @@ systemRoute.post('/upload', upload.single('file'), (req: Request, res: Response,
         next(error);
     }
 });
+
+// Clean up background images (removes all files at root level in uploads directory)
+systemRoute.post('/clean-background', (req: Request, res: Response) => {
+    try {
+        // Remove all files in the root of uploads directory
+        removeExistingFiles();
+
+        res.status(StatusCodes.OK).json({
+            message: 'Background images cleaned successfully'
+        });
+    } catch (error) {
+        console.error('Error cleaning background images:', error);
+        res.status(StatusCodes.INTERNAL_SERVER_ERROR).json({
+            message: 'Error cleaning background images',
+            error: (error as Error).message
+        });
+    }
+});

backend/src/utils/utils.ts

@@ -13,6 +13,12 @@ export const removeExistingFiles = (exceptFileName?: string) => {
             }
 
             const filePath = path.join(UPLOAD_DIRECTORY, file);
+
+            // Skip directories
+            if (fs.statSync(filePath).isDirectory()) {
+                return;
+            }
+
             fs.unlinkSync(filePath);
         });
     } catch (error) {

frontend/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lab-dash-frontend",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "private": true,
   "scripts": {
     "dev": "vite --host",

frontend/src/api/dash-api.ts

@@ -314,6 +314,16 @@ export class DashApi {
         }
     }
 
+    public static async cleanBackgroundImages(): Promise<boolean> {
+        try {
+            await axios.post(`${BACKEND_URL}/api/system/clean-background`);
+            return true;
+        } catch (error) {
+            console.error('Failed to clean background images:', error);
+            return false;
+        }
+    }
+
     public static async uploadAppIcon(file: File): Promise<Icon | null> {
         try {
             const formData = new FormData();

frontend/src/components/forms/SettingsForm.tsx

@@ -326,13 +326,17 @@ export const SettingsForm = () => {
     const resetBackground = async () => {
         PopupManager.deleteConfirmation({
             title: 'Reset Background',
-            text: 'This will restore the default background.',
+            text: 'This will restore the default background and remove all uploaded background images.',
             confirmText: 'Yes, Reset',
             confirmAction: async () => {
                 try {
+                    // First clean up all background images in the root directory
+                    await DashApi.cleanBackgroundImages();
+
+                    // Then update the config to use the default background
                     await updateConfig({ backgroundImage: '' });
-                    PopupManager.success('Background has been reset');
 
+                    PopupManager.success('Background has been reset');
                 } catch (error) {
                     PopupManager.failure('Failed to reset background. Please try again.');
                     console.error('Error resetting background:', error);

package.json

@@ -1,6 +1,6 @@
 {
   "name": "lab-dash",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "description": "This is an open-source user interface designed to manage your server and homelab",
   "main": "index.js",
   "scripts": {