From 6679881c05fde13ce225b2211a2a38bf1c4da140 Mon Sep 17 00:00:00 2001
From: cyb3rgh05t <cyb3rgh05t_01@proton.me>
Date: Thu, 18 Dec 2025 13:21:59 +0100
Subject: [PATCH 1/5] new ui

updated to latest dockserver release
---
 apps/docker-uploader/Dockerfile               |    4 +
 .../root/app/rclone/rclone.conf               |    3 +
 .../root/app/uploader/function-db.sh          |   28 +-
 .../root/app/uploader/function-gdsa.sh        |   35 +-
 .../root/app/uploader/function.sh             |   69 +-
 .../etc/s6-overlay/s6-rc.d/init-install/run   |  133 +-
 .../root/var/www/html/css/style.css           |   70 -
 .../root/var/www/html/css/styles.css          | 2129 +++++++++++++++++
 .../root/var/www/html/index.html              | 1404 ++++++++++-
 .../root/var/www/html/js/app.js               | 1680 +++++++++++--
 .../root/var/www/html/js/app.js.bak           | 1473 ++++++++++++
 .../root/var/www/html/js/utils.js             |  534 +++++
 .../root/var/www/html/logo.png                |  Bin 0 -> 24095 bytes
 .../root/var/www/html/release.json            |   10 +
 .../var/www/html/srv/api/jobs/completed.php   |  107 +-
 .../srv/api/jobs/completed_today_stats.php    |  103 +
 .../var/www/html/srv/api/jobs/inprogress.php  |   53 +-
 .../root/var/www/html/srv/api/jobs/queue.php  |   70 +
 .../var/www/html/srv/api/jobs/queue_stats.php |   99 +
 .../var/www/html/srv/api/settings/update.php  |  203 ++
 .../www/html/srv/api/system/clean_history.php |   17 +-
 .../www/html/srv/api/system/env_settings.php  |   52 +
 .../var/www/html/srv/api/system/status.php    |  154 +-
 .../www/html/srv/api/system/update_env.php    |  236 ++
 .../var/www/html/srv/api/system/version.php   |   85 +
 .../www/html/srv/entities/StatusResponse.php  |    9 +-
 .../www/html/srv/entities/UploadJobStatus.php |    7 +-
 27 files changed, 8338 insertions(+), 429 deletions(-)
 create mode 100644 apps/docker-uploader/root/app/rclone/rclone.conf
 delete mode 100755 apps/docker-uploader/root/var/www/html/css/style.css
 create mode 100644 apps/docker-uploader/root/var/www/html/css/styles.css
 create mode 100644 apps/docker-uploader/root/var/www/html/js/app.js.bak
 create mode 100644 apps/docker-uploader/root/var/www/html/js/utils.js
 create mode 100644 apps/docker-uploader/root/var/www/html/logo.png
 create mode 100644 apps/docker-uploader/root/var/www/html/release.json
 create mode 100644 apps/docker-uploader/root/var/www/html/srv/api/jobs/completed_today_stats.php
 create mode 100644 apps/docker-uploader/root/var/www/html/srv/api/jobs/queue.php
 create mode 100644 apps/docker-uploader/root/var/www/html/srv/api/jobs/queue_stats.php
 create mode 100644 apps/docker-uploader/root/var/www/html/srv/api/settings/update.php
 create mode 100644 apps/docker-uploader/root/var/www/html/srv/api/system/env_settings.php
 create mode 100644 apps/docker-uploader/root/var/www/html/srv/api/system/update_env.php
 create mode 100644 apps/docker-uploader/root/var/www/html/srv/api/system/version.php

diff --git a/apps/docker-uploader/Dockerfile b/apps/docker-uploader/Dockerfile
index 4771a30562..896da838f1 100644
--- a/apps/docker-uploader/Dockerfile
+++ b/apps/docker-uploader/Dockerfile
@@ -36,5 +36,9 @@ RUN \
 
 COPY ./apps/docker-uploader/root/ /
 
+COPY release.json /var/www/html/release.json
+
+RUN chown abc:abc /var/www/html/release.json && chmod 644 /var/www/html/release.json
+
 ENTRYPOINT /init
 ##EOF
diff --git a/apps/docker-uploader/root/app/rclone/rclone.conf b/apps/docker-uploader/root/app/rclone/rclone.conf
new file mode 100644
index 0000000000..ed9892ba88
--- /dev/null
+++ b/apps/docker-uploader/root/app/rclone/rclone.conf
@@ -0,0 +1,3 @@
+[nfsshare]
+type = alias
+remote = /mnt/storage/
\ No newline at end of file
diff --git a/apps/docker-uploader/root/app/uploader/function-db.sh b/apps/docker-uploader/root/app/uploader/function-db.sh
index f1de667a7e..510b468f46 100755
--- a/apps/docker-uploader/root/app/uploader/function-db.sh
+++ b/apps/docker-uploader/root/app/uploader/function-db.sh
@@ -343,7 +343,30 @@ function rcloneupload() {
    checkerror
    #### ECHO END-PARTS FOR UI READING ####
    $(which find) "${DLFOLDER}/${SETDIR}" -mindepth 1 -type d -empty -delete &>/dev/null
-   sqlite3write "INSERT INTO completed_uploads (drive,filedir,filebase,filesize,gdsa,starttime,endtime,status,error) VALUES ('${DRIVE//\'/\'\'}','${DIR//\'/\'\'}','${FILE//\'/\'\'}','${SIZE}','${REMOTENAME//\'/\'\'}','${STARTZ}','${ENDZ}','${STATUS//\'/\'\'}','${ERROR//\'/\'\'}'); DELETE FROM uploads WHERE filebase = '${FILE//\'/\'\'}';" &>/dev/null
+   
+   # Make sure SIZEBYTES contains the actual size in bytes for storage
+   if [[ -z "${SIZEBYTES}" || "${SIZEBYTES}" == "0" ]]; then
+      # If SIZEBYTES is empty or zero, try to derive it from SIZE
+      if [[ "${SIZE}" =~ ^([0-9.]+)\ ?([KMGT]i?B) ]]; then
+         NUM=${BASH_REMATCH[1]}
+         UNIT=${BASH_REMATCH[2]}
+         case "${UNIT}" in
+            B) SIZEBYTES=$(echo "${NUM}" | awk '{printf "%d", $1}') ;;
+            KB|KiB) SIZEBYTES=$(echo "${NUM}" | awk '{printf "%d", $1 * 1024}') ;;
+            MB|MiB) SIZEBYTES=$(echo "${NUM}" | awk '{printf "%d", $1 * 1024 * 1024}') ;;
+            GB|GiB) SIZEBYTES=$(echo "${NUM}" | awk '{printf "%d", $1 * 1024 * 1024 * 1024}') ;;
+            TB|TiB) SIZEBYTES=$(echo "${NUM}" | awk '{printf "%d", $1 * 1024 * 1024 * 1024 * 1024}') ;;
+            *) SIZEBYTES=0 ;;
+         esac
+      else
+         # Default to zero if we can't parse
+         SIZEBYTES=0
+      fi
+   fi
+   
+   # Insert into completed_uploads with the filesize_bytes field
+   sqlite3write "INSERT INTO completed_uploads (drive,filedir,filebase,filesize,filesize_bytes,gdsa,starttime,endtime,status,error) VALUES (\"${DRIVE}\",\"${DIR}\",\"${FILE}\",\"${SIZE}\",\"${SIZEBYTES}\",\"${REMOTENAME}\",\"${STARTZ}\",\"${ENDZ}\",\"${STATUS}\",\"${ERROR}\"); DELETE FROM uploads WHERE filebase = \"${FILE}\";" &>/dev/null
+   
    #### END OF MOVE ####
    $(which rm) -rf "${LOGFILE}/${FILE}.txt" &>/dev/null
    #### REMOVE CUSTOM RCLONE.CONF ####
@@ -367,14 +390,13 @@ function listfiles() {
       LISTSIZE=$($(which stat) -c %s "${DLFOLDER}/${NAME}" 2>/dev/null)
       LISTTYPE="${NAME##*.}"
       if [[ "${LISTTYPE}" == "mkv" ]] || [[ "${LISTTYPE}" == "mp4" ]] || [[ "${LISTTYPE}" == "avi" ]] || [[ "${LISTTYPE}" == "mov" ]] || [[ "${LISTTYPE}" == "mpeg" ]] || [[ "${LISTTYPE}" == "mpegts" ]] || [[ "${LISTTYPE}" == "ts" ]]; then
-         CHECKMETA=$($(which exiftool) -m -q -q -Title "${DLFOLDER}/${NAME}" 2>/dev/null | $(which grep) -qE '[A-Za-z]' && echo 1 || echo 0)
+         CHECKMETA=$($(which exiftool) -m -q -q -Title "${DLFOLDER}/${NAME}" 2>/dev/null | $(which grep) -qE * && echo 1 || echo 0)
       else
          CHECKMETA="0"
       fi
       if [[ "${STRIPARR_URL}" == "" ]]; then
          STRIPARR_URL="null"
       fi
-      
       if [[ "${STRIPARR_URL}" == "null" ]]; then
          sqlite3write "INSERT OR IGNORE INTO upload_queue (drive,filedir,filebase,filesize,metadata) SELECT '${LISTDRIVE//\'/\'\'}','${LISTDIR//\'/\'\'}','${LISTFILE//\'/\'\'}','${LISTSIZE}','0' WHERE NOT EXISTS (SELECT 1 FROM uploads WHERE filebase = '${LISTFILE//\'/\'\'}');" &>/dev/null
       else
diff --git a/apps/docker-uploader/root/app/uploader/function-gdsa.sh b/apps/docker-uploader/root/app/uploader/function-gdsa.sh
index 35bd7762ea..ecd3a9d726 100755
--- a/apps/docker-uploader/root/app/uploader/function-gdsa.sh
+++ b/apps/docker-uploader/root/app/uploader/function-gdsa.sh
@@ -237,7 +237,7 @@ function replace-used() {
       USEDUPLOAD="0"
    fi
    #### UPDATE USED FILE ####
-   sqlite3write "UPDATE upload_keys SET used = used + ${SIZEBYTES}, time = datetime('now', 'localtime') WHERE active = 1;" &>/dev/null
+   sqlite3write "UPDATE upload_keys SET used = used + \"${SIZEBYTES}\", time = datetime('now', 'localtime') WHERE active = 1;" &>/dev/null
 }
 
 function reset-used() {
@@ -329,7 +329,7 @@ function rcloneupload() {
    #### TOUCH LOG FILE FOR UI READING ####
    touch "${LOGFILE}/${FILE}.txt" &>/dev/null
    #### UPDATE DATABASE ENTRY ####
-   sqlite3write "INSERT OR REPLACE INTO uploads (drive,filedir,filebase,filesize,logfile,gdsa) VALUES ('${DRIVE//\'/\'\'}','${DIR//\'/\'\'}','${FILE//\'/\'\'}','${SIZE}','${LOGFILE}/${FILE//\'/\'\'}.txt','${REMOTENAME//\'/\'\'}');" &>/dev/null
+   sqlite3write "INSERT OR REPLACE INTO uploads (drive,filedir,filebase,filesize,logfile,gdsa) VALUES ('${DRIVE//\'/\'\'}','${DIR//\'/\'\'}','${FILE//\'/\'\'}','${SIZE}','${LOGFILE}/${FILE//\'/\'\'}.txt','${KEYNOTI}${CRYPTED}');" &>/dev/null
    #### READ BWLIMIT ####
    if [[ "${BANDWIDTH_LIMIT}" == "" ]]; then
       BANDWIDTH_LIMIT="null"
@@ -365,7 +365,31 @@ function rcloneupload() {
    checkerror
    #### ECHO END-PARTS FOR UI READING ####
    $(which find) "${DLFOLDER}/${SETDIR}" -mindepth 1 -type d -empty -delete &>/dev/null
-   sqlite3write "INSERT INTO completed_uploads (drive,filedir,filebase,filesize,gdsa,starttime,endtime,status,error) VALUES ('${DRIVE//\'/\'\'}','${DIR//\'/\'\'}','${FILE//\'/\'\'}','${SIZE}','${REMOTENAME//\'/\'\'}','${STARTZ}','${ENDZ}','${STATUS//\'/\'\'}','${ERROR//\'/\'\'}'); DELETE FROM uploads WHERE filebase = '${FILE//\'/\'\'}';" &>/dev/null
+   
+   # Store the original size in bytes for the database
+   # Make sure SIZEBYTES contains the actual size in bytes for storage
+   if [[ -z "${SIZEBYTES}" || "${SIZEBYTES}" == "0" ]]; then
+      # If SIZEBYTES is empty or zero, try to derive it from SIZE
+      if [[ "${SIZE}" =~ ^([0-9.]+)\ ?([KMGT]i?B) ]]; then
+         NUM=${BASH_REMATCH[1]}
+         UNIT=${BASH_REMATCH[2]}
+         case "${UNIT}" in
+            B) SIZEBYTES=$(echo "${NUM}" | awk '{printf "%d", $1}') ;;
+            KB|KiB) SIZEBYTES=$(echo "${NUM}" | awk '{printf "%d", $1 * 1024}') ;;
+            MB|MiB) SIZEBYTES=$(echo "${NUM}" | awk '{printf "%d", $1 * 1024 * 1024}') ;;
+            GB|GiB) SIZEBYTES=$(echo "${NUM}" | awk '{printf "%d", $1 * 1024 * 1024 * 1024}') ;;
+            TB|TiB) SIZEBYTES=$(echo "${NUM}" | awk '{printf "%d", $1 * 1024 * 1024 * 1024 * 1024}') ;;
+            *) SIZEBYTES=0 ;;
+         esac
+      else
+         # Default to zero if we can't parse
+         SIZEBYTES=0
+      fi
+   fi
+   
+   # Insert into completed_uploads with the filesize_bytes field
+   sqlite3write "INSERT INTO completed_uploads (drive,filedir,filebase,filesize,filesize_bytes,gdsa,starttime,endtime,status,error) VALUES ('${DRIVE//\'/\'\'}','${DIR//\'/\'\'}','${FILE//\'/\'\'}','${SIZE}','${SIZEBYTES}','${KEYNOTI}${CRYPTED}','${STARTZ}','${ENDZ}','${STATUS//\'/\'\'}','${ERROR//\'/\'\'}'); DELETE FROM uploads WHERE filebase = '${FILE//\'/\'\'}';" &>/dev/null
+   
    #### END OF MOVE ####
    $(which rm) -rf "${LOGFILE}/${FILE}.txt" &>/dev/null
    #### REMOVE CUSTOM RCLONE.CONF ####
@@ -389,14 +413,13 @@ function listfiles() {
       LISTSIZE=$($(which stat) -c %s "${DLFOLDER}/${NAME}" 2>/dev/null)
       LISTTYPE="${NAME##*.}"
       if [[ "${LISTTYPE}" == "mkv" ]] || [[ "${LISTTYPE}" == "mp4" ]] || [[ "${LISTTYPE}" == "avi" ]] || [[ "${LISTTYPE}" == "mov" ]] || [[ "${LISTTYPE}" == "mpeg" ]] || [[ "${LISTTYPE}" == "mpegts" ]] || [[ "${LISTTYPE}" == "ts" ]]; then
-         CHECKMETA=$($(which exiftool) -m -q -q -Title "${DLFOLDER}/${NAME}" 2>/dev/null | $(which grep) -qE '[A-Za-z]' && echo 1 || echo 0)
+         CHECKMETA=$($(which exiftool) -m -q -q -Title "${DLFOLDER}/${NAME}" 2>/dev/null | $(which grep) -qE * && echo 1 || echo 0)
       else
          CHECKMETA="0"
       fi
       if [[ "${STRIPARR_URL}" == "" ]]; then
          STRIPARR_URL="null"
       fi
-      
       if [[ "${STRIPARR_URL}" == "null" ]]; then
          sqlite3write "INSERT OR IGNORE INTO upload_queue (drive,filedir,filebase,filesize,metadata) SELECT '${LISTDRIVE//\'/\'\'}','${LISTDIR//\'/\'\'}','${LISTFILE//\'/\'\'}','${LISTSIZE}','0' WHERE NOT EXISTS (SELECT 1 FROM uploads WHERE filebase = '${LISTFILE//\'/\'\'}');" &>/dev/null
       else
@@ -545,7 +568,7 @@ function startuploader() {
                fi
             else
                #### WHEN NOT THEN DELETE ENTRY ####
-               sqlite3write "DELETE FROM upload_queue WHERE filebase = '${FILE//\'/\'\'}';" &>/dev/null
+               sqlite3write "DELETE FROM upload_queue WHERE filebase = \"${FILE}\";" &>/dev/null
                $(which sleep) 2
             fi
          #### CLEANUP COMPLETED HISTORY ####
diff --git a/apps/docker-uploader/root/app/uploader/function.sh b/apps/docker-uploader/root/app/uploader/function.sh
index 6b17b77e53..8d6cee5e28 100755
--- a/apps/docker-uploader/root/app/uploader/function.sh
+++ b/apps/docker-uploader/root/app/uploader/function.sh
@@ -48,6 +48,42 @@ function log() {
    $(which echo) -e "${GRAY}[$($(which date) +'%Y/%m/%d %H:%M:%S')]${BLUE} [Uploader]${NC} ${1}"
 }
 
+function update_env_var() {
+   # $1 = variable name (e.g., BANDWIDTH_LIMIT)
+   # $2 = new value (e.g., "30M")
+   local VAR_NAME="$1"
+   local NEW_VALUE="$2"
+   local ENV_FILE="/system/uploader/uploader.env"
+   
+   # Create a temporary file
+   local TEMP_FILE=$(mktemp)
+   
+   # Read line by line, update the specific variable
+   while IFS= read -r line; do
+      if [[ "$line" =~ ^$VAR_NAME= ]]; then
+         # Special handling for string vs numeric/boolean values
+         if [[ "$NEW_VALUE" == "true" || "$NEW_VALUE" == "false" || "$NEW_VALUE" == "null" || "$NEW_VALUE" =~ ^[0-9]+$ ]]; then
+            # Boolean, null, or numeric values don't need quotes
+            echo "${VAR_NAME}=${NEW_VALUE}" >> "$TEMP_FILE"
+         else
+            # String values should be quoted
+            echo "${VAR_NAME}=\"${NEW_VALUE}\"" >> "$TEMP_FILE"
+         fi
+      else
+         echo "$line" >> "$TEMP_FILE"
+      fi
+   done < "$ENV_FILE"
+   
+   # Replace original file
+   mv "$TEMP_FILE" "$ENV_FILE"
+   
+   # Set permissions
+   chmod 755 "$ENV_FILE"
+   chown abc:abc "$ENV_FILE"
+   
+   log "Updated ${VAR_NAME} to ${NEW_VALUE} in environment file"
+}
+
 function refreshVFS() {
    source /system/uploader/uploader.env
    #### SEND VFS REFRESH TO MOUNT ####
@@ -191,6 +227,12 @@ function cleanuplog() {
 
 function rcloneupload() {
    source /system/uploader/uploader.env
+   # Validate BANDWIDTH_LIMIT
+   if [[ "${BANDWIDTH_LIMIT}" != "null" && ! "${BANDWIDTH_LIMIT}" =~ ^[0-9]+[KMG]?$ ]]; then
+      log "Warning: BANDWIDTH_LIMIT format invalid, setting to null"
+      BANDWIDTH_LIMIT="null"
+   fi
+
    FILETYPE="${FILE##*.}"
    SETDIR=$($(which echo) "${DIR}" | $(which cut) -d/ -f-"${FOLDER_DEPTH}")
    SIZE=$($(which echo) "${SIZEBYTES}" | $(which numfmt) --to=iec-i --suffix=B)
@@ -300,6 +342,19 @@ function rcloneupload() {
 
 function listfiles() {
    source /system/uploader/uploader.env
+   
+   # Validate MIN_AGE_UPLOAD
+   if [[ -z "${MIN_AGE_UPLOAD}" || ! "${MIN_AGE_UPLOAD}" =~ ^[0-9]+$ ]]; then
+      MIN_AGE_UPLOAD=1
+      log "Warning: MIN_AGE_UPLOAD was invalid, reset to 1"
+   fi
+   
+   # Validate FOLDER_DEPTH
+   if [[ -z "${FOLDER_DEPTH}" || ! "${FOLDER_DEPTH}" =~ ^[0-9]+$ || "${FOLDER_DEPTH}" -lt 1 ]]; then
+      FOLDER_DEPTH=1
+      log "Warning: FOLDER_DEPTH was invalid, reset to 1"
+   fi
+   
    #### CREATE TEMP_FILE ####
    sqlite3read "SELECT filebase FROM upload_queue UNION ALL SELECT filebase FROM uploads;" > "${TEMPFILES}"
    #### FIND NEW FILES ####
@@ -309,18 +364,22 @@ function listfiles() {
    for NAME in ${FILEBASE[@]}; do
       LISTFILE=$($(which basename) "${NAME}")
       LISTDIR=$($(which dirname) "${NAME}")
-      LISTDRIVE=$($(which echo) "${LISTDIR}" | $(which cut) -d/ -f-"${FOLDER_DEPTH}" | $(which xargs) -I {} $(which basename) {})
+      # Ensure FOLDER_DEPTH is valid
+      if [[ -z "${FOLDER_DEPTH}" || "${FOLDER_DEPTH}" -lt 1 ]]; then
+        FOLDER_DEPTH=1
+        log "Warning: FOLDER_DEPTH was invalid, reset to 1"
+      fi
+      LISTDRIVE=$($(which echo) "${LISTDIR}" | $(which cut) -d/ -f1-"${FOLDER_DEPTH}" | $(which xargs) -I {} $(which basename) {})
       LISTSIZE=$($(which stat) -c %s "${DLFOLDER}/${NAME}" 2>/dev/null)
       LISTTYPE="${NAME##*.}"
       if [[ "${LISTTYPE}" == "mkv" ]] || [[ "${LISTTYPE}" == "mp4" ]] || [[ "${LISTTYPE}" == "avi" ]] || [[ "${LISTTYPE}" == "mov" ]] || [[ "${LISTTYPE}" == "mpeg" ]] || [[ "${LISTTYPE}" == "mpegts" ]] || [[ "${LISTTYPE}" == "ts" ]]; then
-         CHECKMETA=$($(which exiftool) -m -q -q -Title "${DLFOLDER}/${NAME}" 2>/dev/null | $(which grep) -qE '[A-Za-z]' && echo 1 || echo 0)
+         CHECKMETA=$($(which exiftool) -m -q -q -Title "${DLFOLDER}/${NAME}" 2>/dev/null | $(which grep) -qE * && echo 1 || echo 0)
       else
          CHECKMETA="0"
       fi
       if [[ "${STRIPARR_URL}" == "" ]]; then
          STRIPARR_URL="null"
       fi
-      
       if [[ "${STRIPARR_URL}" == "null" ]]; then
          sqlite3write "INSERT OR IGNORE INTO upload_queue (drive,filedir,filebase,filesize,metadata) SELECT '${LISTDRIVE//\'/\'\'}','${LISTDIR//\'/\'\'}','${LISTFILE//\'/\'\'}','${LISTSIZE}','0' WHERE NOT EXISTS (SELECT 1 FROM uploads WHERE filebase = '${LISTFILE//\'/\'\'}');" &>/dev/null
       else
@@ -360,7 +419,7 @@ function checkmeta() {
 function checkspace() {
    source /system/uploader/uploader.env
    #### CHECK DRIVEUSEDSPACE ####
-   if [[ "${DRIVEUSEDSPACE}" =~ ^[0-9][0-9]+([.][0-9]+)?$ ]]; then
+   if [[ "${DRIVEUSEDSPACE}" != "null" && "${DRIVEUSEDSPACE}" =~ ^[0-9][0-9]+([.][0-9]+)?$ ]]; then
       while true; do
         LCT=$($(which df) --output=pcent "${DLFOLDER}" | tr -dc '0-9')
         if [[ "${DRIVEUSEDSPACE}" =~ ^[0-9][0-9]+([.][0-9]+)?$ ]]; then
@@ -477,4 +536,4 @@ function startuploader() {
    done
 }
 
-#### END OF FILE ####
+#### END OF FILE ####
\ No newline at end of file
diff --git a/apps/docker-uploader/root/etc/s6-overlay/s6-rc.d/init-install/run b/apps/docker-uploader/root/etc/s6-overlay/s6-rc.d/init-install/run
index 24b7aebec2..3aa0e1521c 100755
--- a/apps/docker-uploader/root/etc/s6-overlay/s6-rc.d/init-install/run
+++ b/apps/docker-uploader/root/etc/s6-overlay/s6-rc.d/init-install/run
@@ -37,7 +37,80 @@ USEDDIR=/system/uploader/.keys
 JSONOLD=/system/uploader/json
 ARRAY=$($(which ls) -A "${JSONDIR}" | $(which wc) -l)
 
-   $(which cat) >> /etc/apk/repositories << EOF; $(echo)
+# Validate the environment file to ensure we don't lose settings
+function validate_env_file() {
+   local ENV_FILE="/system/uploader/uploader.env"
+   
+   if [ ! -f "$ENV_FILE" ]; then
+      log "Error: $ENV_FILE not found, will create default file"
+      return 1
+   fi
+   
+   # Check for essential variables
+   local MISSING=0
+   local ESSENTIAL_VARS=("PUID" "PGID" "TIMEZONE" "BANDWIDTH_LIMIT" "TRANSFERS" "FOLDER_DEPTH" "MIN_AGE_UPLOAD")
+   
+   for var in "${ESSENTIAL_VARS[@]}"; do
+      if ! grep -q "^${var}=" "$ENV_FILE"; then
+         log "Missing essential variable: $var"
+         MISSING=1
+      fi
+   done
+   
+   # If missing any essential variables, recreate the file
+   if [ "$MISSING" -eq 1 ]; then
+      log "Will recreate env file with missing variables"
+      return 1
+   fi
+   
+   # Check variable format for common issues
+   if grep -q "^BANDWIDTH_LIMIT=[^\"']" "$ENV_FILE"; then
+      log "BANDWIDTH_LIMIT is not properly quoted, fixing"
+      sed -i 's|^BANDWIDTH_LIMIT=\(.*\)|BANDWIDTH_LIMIT=\"\1\"|g' "$ENV_FILE"
+   fi
+   
+   return 0
+}
+
+# Update a single environment variable safely
+function update_env_var() {
+   # $1 = variable name (e.g., BANDWIDTH_LIMIT)
+   # $2 = new value (e.g., "30M")
+   local VAR_NAME="$1"
+   local NEW_VALUE="$2"
+   local ENV_FILE="/system/uploader/uploader.env"
+   
+   # Create a temporary file
+   local TEMP_FILE=$(mktemp)
+   
+   # Read line by line, update the specific variable
+   while IFS= read -r line; do
+      if [[ "$line" =~ ^$VAR_NAME= ]]; then
+         # Special handling for string vs numeric/boolean values
+         if [[ "$NEW_VALUE" == "true" || "$NEW_VALUE" == "false" || "$NEW_VALUE" == "null" || "$NEW_VALUE" =~ ^[0-9]+$ ]]; then
+            # Boolean, null, or numeric values don't need quotes
+            echo "${VAR_NAME}=${NEW_VALUE}" >> "$TEMP_FILE"
+         else
+            # String values should be quoted
+            echo "${VAR_NAME}=\"${NEW_VALUE}\"" >> "$TEMP_FILE"
+         fi
+      else
+         echo "$line" >> "$TEMP_FILE"
+      fi
+   done < "$ENV_FILE"
+   
+   # Replace original file
+   mv "$TEMP_FILE" "$ENV_FILE"
+   
+   # Set permissions
+   chmod 755 "$ENV_FILE"
+   chown abc:abc "$ENV_FILE"
+   
+   log "Updated ${VAR_NAME} to ${NEW_VALUE} in environment file"
+}
+
+# Setup repositories
+$(which cat) >> /etc/apk/repositories << EOF; $(echo)
 http://dl-cdn.alpinelinux.org/alpine/edge/testing
 EOF
 
@@ -51,7 +124,7 @@ log "**** install build packages from requirements ****" && \
    done
 
 log "**** install pip packages ****"
-   pip3 install --no-cache-dir --break-system-packages -U apprise &>/dev/null
+   pip3 install --no-cache-dir -U apprise &>/dev/null
 
 log "**** install rclone ****"
    $(which wget) -qO- https://rclone.org/install.sh | bash &>/dev/null
@@ -83,8 +156,13 @@ $(which cp) -r /app/sample/crypt_multi_tdrive-example.csv /system/uploader/sampl
 $(which cp) -r /app/sample/uncrypt_multi_tdrive-example.csv /system/uploader/sample/uncrypt_multi_tdrive-example.csv
 
 if [[ -f "${ENVA}" ]]; then
-   source "${ENVA}"
+   # Validate the environment file
+   validate_env_file || {
+      log "Creating new environment file due to validation failure"
+      source "${SAMPLE}"
+   }
 else
+   log "Environment file not found, using sample"
    source "${SAMPLE}"
 fi
 
@@ -109,7 +187,10 @@ tubesync/
 EOF
 fi
 
-$(which echo) -e "#-------------------------------------------------------
+# Create the environment file if needed while preserving existing values
+if [[ ! -f "${ENVA}" ]]; then
+   log "Setting up environment variables"
+   $(which echo) -e "#-------------------------------------------------------
 #   UPLOADER ENVIROMENTS
 #-------------------------------------------------------
 ## USER VALUES
@@ -134,29 +215,29 @@ TRANSFERS=${TRANSFERS:-2}
 ## USER - SETTINGS
 DRIVEUSEDSPACE=${DRIVEUSEDSPACE:-null}
 FOLDER_DEPTH=${FOLDER_DEPTH:-1}
-FOLDER_PRIORITY=${FOLDER_PRIORITY:-null}
+FOLDER_PRIORITY=\"${FOLDER_PRIORITY:-null}\"
 MIN_AGE_UPLOAD=${MIN_AGE_UPLOAD:-1}
 
 ## VFS - SETTINGS
 VFS_REFRESH_ENABLE=${VFS_REFRESH_ENABLE:-true}
-MOUNT=${MOUNT:-mount:8554}
+MOUNT=\"${MOUNT:-mount:8554}\"
 
 ## LOG - SETTINGS
 LOG_ENTRY=${LOG_ENTRY:-1000}
 LOG_RETENTION_DAYS=${LOG_RETENTION_DAYS:-null}
 
 ## AUTOSCAN - SETTINGS
-AUTOSCAN_URL=${AUTOSCAN_URL:-null}
-AUTOSCAN_USER=${AUTOSCAN_USER:-null}
-AUTOSCAN_PASS=${AUTOSCAN_PASS:-null}
+AUTOSCAN_URL=\"${AUTOSCAN_URL:-null}\"
+AUTOSCAN_USER=\"${AUTOSCAN_USER:-null}\"
+AUTOSCAN_PASS=\"${AUTOSCAN_PASS:-null}\"
 
 ## NOTIFICATION - SETTINGS
-NOTIFICATION_URL=${NOTIFICATION_URL:-null}
+NOTIFICATION_URL=\"${NOTIFICATION_URL:-null}\"
 NOTIFICATION_LEVEL=${NOTIFICATION_LEVEL:-ALL}
-NOTIFICATION_SERVERNAME=${NOTIFICATION_SERVERNAME:-null}
+NOTIFICATION_SERVERNAME=\"${NOTIFICATION_SERVERNAME:-null}\"
 
 ## STRIPARR - SETTINGS
-STRIPARR_URL=${STRIPARR_URL:-null}
+STRIPARR_URL=\"${STRIPARR_URL:-null}\"
 
 ## LANGUAGE MESSAGES
 LANGUAGE=${LANGUAGE:-en}
@@ -164,6 +245,10 @@ LANGUAGE=${LANGUAGE:-en}
 #-------------------------------------------------------
 #   UPLOADER ENVIROMENTS
 #-------------------------------------------------------" > "${ENVA}"
+   log "Environment file created"
+else
+   log "Using existing environment file"
+fi
 
 if [[ -f "${ENDCONFIG}" ]]; then $(which rm) -f "${ENDCONFIG}"; fi
 if [[ -f "${PAUSE}" ]]; then $(which rm) -f "${PAUSE}"; fi
@@ -184,20 +269,38 @@ if [[ ! -f "${DATABASE}" ]]; then
    sqlite3write "CREATE TABLE upload_keys(time DATETIME DEFAULT (datetime('now','localtime')), key TEXT, used NUMERIC, active INTEGER);" &>/dev/null
    sqlite3write "CREATE TABLE upload_queue(time DATETIME DEFAULT (datetime('now','localtime')), drive TEXT, filedir TEXT, filebase TEXT PRIMARY KEY, filesize TEXT, metadata INTEGER);" &>/dev/null
    sqlite3write "CREATE TABLE uploads(drive TEXT, filedir TEXT, filebase TEXT PRIMARY KEY, filesize TEXT, logfile TEXT, gdsa TEXT);" &>/dev/null
-   sqlite3write "CREATE TABLE completed_uploads(drive TEXT, filedir TEXT, filebase TEXT, filesize TEXT, gdsa TEXT, starttime NUMERIC, endtime NUMERIC, status NUMERIC, error TEXT);" &>/dev/null
+   sqlite3write "CREATE TABLE completed_uploads(drive TEXT, filedir TEXT, filebase TEXT, filesize TEXT, filesize_bytes INTEGER, gdsa TEXT, starttime NUMERIC, endtime NUMERIC, status NUMERIC, error TEXT);" &>/dev/null
    sqlite3write "CREATE INDEX idx_completed_endtime ON completed_uploads (endtime);" &>/dev/null
    sqlite3write "CREATE INDEX idx_queue_time ON upload_queue (time);" &>/dev/null
+   log "Database created with all required tables"
 fi
 
-# UPDATE UPLOADER DATEBASE
+# UPDATE UPLOADER DATEBASE SCHEMA
 sqlite3write "CREATE TABLE IF NOT EXISTS upload_keys(time DATETIME DEFAULT (datetime('now','localtime')), key TEXT, used NUMERIC, active INTEGER);" &>/dev/null
 
+# Check if metadata column exists in upload_queue
 DATABASEMETA=$(sqlite3read "PRAGMA table_info('upload_queue')" 2>/dev/null | $(which grep) -qE "metadata"  && echo true || echo false)
 if [[ "${DATABASEMETA}" == "false" ]]; then
+   log "Adding metadata column to upload_queue table"
    sqlite3write "DROP TABLE upload_queue" &>/dev/null
    sqlite3write "CREATE TABLE upload_queue(time DATETIME DEFAULT (datetime('now','localtime')), drive TEXT, filedir TEXT, filebase TEXT PRIMARY KEY, filesize TEXT, metadata INTEGER);" &>/dev/null
 fi
 
+# Check if filesize_bytes column exists in completed_uploads
+DATABASEBYTES=$(sqlite3read "PRAGMA table_info('completed_uploads')" 2>/dev/null | $(which grep) -qE "filesize_bytes"  && echo true || echo false)
+if [[ "${DATABASEBYTES}" == "false" ]]; then
+   log "Adding filesize_bytes column to completed_uploads table"
+   sqlite3write "ALTER TABLE completed_uploads ADD COLUMN filesize_bytes INTEGER;" &>/dev/null
+   # Update existing records with estimated size in bytes
+   sqlite3write "UPDATE completed_uploads SET filesize_bytes = (CASE 
+      WHEN filesize LIKE '%B' THEN CAST(REPLACE(filesize, 'B', '') AS INTEGER)
+      WHEN filesize LIKE '%KB' OR filesize LIKE '%KiB' THEN CAST(REPLACE(REPLACE(REPLACE(filesize, 'KB', ''), 'KiB', ''), ' ', '') AS FLOAT) * 1024
+      WHEN filesize LIKE '%MB' OR filesize LIKE '%MiB' THEN CAST(REPLACE(REPLACE(REPLACE(filesize, 'MB', ''), 'MiB', ''), ' ', '') AS FLOAT) * 1024 * 1024
+      WHEN filesize LIKE '%GB' OR filesize LIKE '%GiB' THEN CAST(REPLACE(REPLACE(REPLACE(filesize, 'GB', ''), 'GiB', ''), ' ', '') AS FLOAT) * 1024 * 1024 * 1024
+      WHEN filesize LIKE '%TB' OR filesize LIKE '%TiB' THEN CAST(REPLACE(REPLACE(REPLACE(filesize, 'TB', ''), 'TiB', ''), ' ', '') AS FLOAT) * 1024 * 1024 * 1024 * 1024
+      ELSE 0 END);" &>/dev/null
+fi
+
 # UPLOADER KEYS
 CHECKKEYS=$(sqlite3read "SELECT COUNT(*) FROM upload_keys;" 2>/dev/null)
 if [[ "${CHECKKEYS}" -lt "1" && "${CHECKTYPE}" == "drive" ]]; then
@@ -333,4 +436,4 @@ We have take some code from :
 
 ------------------------------"
 
-#### END OF FILE ####
+#### END OF FILE ####
\ No newline at end of file
diff --git a/apps/docker-uploader/root/var/www/html/css/style.css b/apps/docker-uploader/root/var/www/html/css/style.css
deleted file mode 100755
index ab9c8b1d95..0000000000
--- a/apps/docker-uploader/root/var/www/html/css/style.css
+++ /dev/null
@@ -1,70 +0,0 @@
-table {
-    font-size: small;
-}
-
-#uploadsTable > thead > tr > td.tl-w-20 {
-    width:20%;
-}
-
-#info_badges > div {
-    padding: 3px;
-}
-
-#info_badges > div > span.badge {
-    height: 20px;
-    min-width: 24px;
-}
-
-#control > span:hover {
-    opacity:0.8;
-    background-color: Black;
-    cursor: pointer;
-}
-
-span#clnHist {
-    font-size: 10px;
-    padding: 5px;
-}
-span#clnHist:hover {
-    font-size: 10px;
-    text-decoration: underline;
-    cursor: pointer;
-}
-
-@media only screen and (max-width: 800px) {
-    .truncate {
-        width:100%;
-        white-space: nowrap !important;
-        overflow: hidden;
-        text-overflow: ellipsis;
-    }
-    .progress {
-        height: 2px;
-        font-size:0;
-    }
-
-    #uploadsTable > thead > tr > td.tl-w-20 {
-        width: 100%;
-    }
-    /** THANKS: https://elvery.net/demo/responsive-tables/#css-1 **/
-    #no-more-tables table,
-    #no-more-tables thead,
-    #no-more-tables tbody,
-    #no-more-tables th,
-    #no-more-tables td,
-    #no-more-tables tr {
-        display: block;
-    }
-    #no-more-tables thead tr {
-        position: absolute;
-        top: -9999px;
-        left: -9999px;
-    }
-    #no-more-tables tr { border-bottom: 1px solid #ccc; }
-    #no-more-tables td {
-        border: none;
-        position: relative;
-        white-space: normal;
-        text-align:left;
-    }
-}
diff --git a/apps/docker-uploader/root/var/www/html/css/styles.css b/apps/docker-uploader/root/var/www/html/css/styles.css
new file mode 100644
index 0000000000..fd495b4efb
--- /dev/null
+++ b/apps/docker-uploader/root/var/www/html/css/styles.css
@@ -0,0 +1,2129 @@
+/* Modern Docker Uploader Dashboard - Sidebar Layout v5.0 */
+
+:root {
+  /* Base Colors - Default Dark Theme */
+  --bg-primary: radial-gradient(
+    circle,
+    #3a3a3a,
+    #2d2d2d,
+    #202020,
+    #141414,
+    #000000
+  );
+  --bg-secondary: #252525;
+  --bg-tertiary: #3a3a3a;
+  --bg-card: #252525;
+  --text-primary: #ddd;
+  --text-secondary: #ddd;
+  --text-tertiary: #999;
+  --border-color: #3a3a3a;
+
+  /* Theme-specific colors - default dark */
+  --accent-color: rgb(170, 170, 170);
+  --accent-light: rgba(255, 255, 255, 0.45);
+  --accent-dark: #7a7a7a;
+  --accent-transparent: rgba(170, 170, 170, 0.15);
+  --accent-rgb: 170, 170, 170;
+
+  /* Status Colors */
+  --success: #10b981;
+  --warning: #f59e0b;
+  --danger: #ef4444;
+  --info: #3b82f6;
+
+  /* Layout */
+  --sidebar-width: 260px;
+  --topbar-height: 70px;
+
+  /* Spacing */
+  --space-xs: 0.25rem;
+  --space-sm: 0.5rem;
+  --space-md: 1rem;
+  --space-lg: 1.5rem;
+  --space-xl: 2rem;
+  --space-xxl: 3rem;
+
+  /* Transitions */
+  --transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+
+  /* Border Radius */
+  --radius-sm: 6px;
+  --radius-md: 10px;
+  --radius-lg: 16px;
+  --radius-xl: 20px;
+
+  /* Shadows */
+  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.1);
+  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.12);
+  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.15);
+  --shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.2);
+}
+
+/* Theme Variations */
+[data-theme="aquamarine"] {
+  --bg-primary: #0b3161;
+  --bg-secondary: #265c74;
+  --bg-tertiary: #47918a;
+  --bg-card: #265c74;
+  --accent-color: #009688;
+  --accent-light: #36e7d6;
+  --accent-dark: #12afa0;
+  --accent-transparent: rgba(0, 150, 136, 0.15);
+  --accent-rgb: 0, 150, 136;
+}
+
+[data-theme="dark"] {
+  /* Using new dark theme colors */
+  --bg-primary: radial-gradient(
+    circle,
+    #3a3a3a,
+    #2d2d2d,
+    #202020,
+    #141414,
+    #000000
+  );
+  --bg-secondary: #252525;
+  --bg-tertiary: #3a3a3a;
+  --bg-card: #252525;
+  --accent-color: rgb(170, 170, 170);
+  --accent-light: rgba(255, 255, 255, 0.45);
+  --accent-dark: #7a7a7a;
+  --accent-transparent: rgba(170, 170, 170, 0.15);
+  --accent-rgb: 170, 170, 170;
+  --text-primary: #ddd;
+  --text-secondary: #ddd;
+  --text-tertiary: #999;
+  --border-color: #3a3a3a;
+}
+
+[data-theme="organizr"] {
+  --bg-primary: #1f1f1f;
+  --bg-secondary: #2a2a2a;
+  --bg-tertiary: #333333;
+  --bg-card: #2a2a2a;
+  --accent-color: #2cabe3;
+  --accent-light: #3cc5ff;
+  --accent-dark: #298fbc;
+  --accent-transparent: rgba(44, 171, 227, 0.15);
+  --accent-rgb: 44, 171, 227;
+}
+
+[data-theme="nord"] {
+  --bg-primary: #2e3440;
+  --bg-secondary: #3b4252;
+  --bg-tertiary: #434c5e;
+  --bg-card: #3b4252;
+  --accent-color: #88c0d0;
+  --accent-light: #a3d5e0;
+  --accent-dark: #6a9daf;
+  --accent-transparent: rgba(136, 192, 208, 0.15);
+  --accent-rgb: 136, 192, 208;
+}
+
+[data-theme="overseerr"] {
+  --bg-primary: hsl(221, 39%, 11%);
+  --bg-secondary: #1f2937;
+  --bg-tertiary: #374151;
+  --bg-card: #1f2937;
+  --accent-color: #a78bfa;
+  --accent-light: #c4b5fd;
+  --accent-dark: #8b5cf6;
+  --accent-transparent: rgba(167, 139, 250, 0.15);
+  --accent-rgb: 167, 139, 250;
+}
+
+[data-theme="onedark"] {
+  --bg-primary: #282c34;
+  --bg-secondary: #21252b;
+  --bg-tertiary: #2c313a;
+  --bg-card: #21252b;
+  --accent-color: #61afef;
+  --accent-light: #87c5f2;
+  --accent-dark: #528bcc;
+  --accent-transparent: rgba(97, 175, 239, 0.15);
+  --accent-rgb: 97, 175, 239;
+}
+
+[data-theme="hotline"] {
+  --bg-primary: #155fa5;
+  --bg-secondary: #4a5ba5;
+  --bg-tertiary: #5e61ab;
+  --bg-card: #4a5ba5;
+  --accent-color: #f98dc9;
+  --accent-light: #ffb3de;
+  --accent-dark: #e666b3;
+  --accent-transparent: rgba(249, 141, 201, 0.15);
+  --accent-rgb: 249, 141, 201;
+}
+
+[data-theme="maroon"] {
+  --bg-primary: #220a25;
+  --bg-secondary: #3d1a33;
+  --bg-tertiary: #4c2133;
+  --bg-card: #3d1a33;
+  --accent-color: #a21c65;
+  --accent-light: #c72979;
+  --accent-dark: #841652;
+  --accent-transparent: rgba(162, 28, 101, 0.15);
+  --accent-rgb: 162, 28, 101;
+}
+
+[data-theme="dracula"] {
+  --bg-primary: #282a36;
+  --bg-secondary: #1e2029;
+  --bg-tertiary: #44475a;
+  --bg-card: #1e2029;
+  --accent-color: #bd93f9;
+  --accent-light: #d4b5ff;
+  --accent-dark: #a87cd5;
+  --accent-transparent: rgba(189, 147, 249, 0.15);
+  --accent-rgb: 189, 147, 249;
+}
+
+[data-theme="plex"] {
+  --bg-primary: #1a1a1a;
+  --bg-secondary: #282828;
+  --bg-tertiary: #323232;
+  --bg-card: #282828;
+  --accent-color: #e5a00d;
+  --accent-light: #f5b836;
+  --accent-dark: #cc7b19;
+  --accent-transparent: rgba(229, 160, 13, 0.15);
+  --accent-rgb: 229, 160, 13;
+}
+
+[data-theme="space-gray"] {
+  --bg-primary: #253237;
+  --bg-secondary: #2f3d42;
+  --bg-tertiary: #3b4a51;
+  --bg-card: #2f3d42;
+  --accent-color: #81a6b7;
+  --accent-light: #9ebdcc;
+  --accent-dark: #607d8b;
+  --accent-transparent: rgba(129, 166, 183, 0.15);
+  --accent-rgb: 129, 166, 183;
+}
+
+[data-theme="hotpink"] {
+  --bg-primary: #004249;
+  --bg-secondary: #123c5c;
+  --bg-tertiary: #204c80;
+  --bg-card: #123c5c;
+  --accent-color: #fb3f62;
+  --accent-light: #ff6683;
+  --accent-dark: #e12b4f;
+  --accent-transparent: rgba(251, 63, 98, 0.15);
+  --accent-rgb: 251, 63, 98;
+}
+
+/* Reset & Base Styles */
+*,
+*::before,
+*::after {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+body {
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
+    "Helvetica Neue", Arial, sans-serif;
+  background: var(--bg-primary);
+  color: var(--text-primary);
+  line-height: 1.6;
+  overflow-x: hidden;
+  min-height: 100vh;
+}
+
+a {
+  color: var(--accent-color);
+  text-decoration: none;
+  transition: color var(--transition);
+}
+
+a:hover {
+  color: var(--accent-light);
+}
+
+/* Scrollbar Styling */
+::-webkit-scrollbar {
+  width: 8px;
+  height: 8px;
+}
+
+::-webkit-scrollbar-track {
+  background: var(--bg-secondary);
+}
+
+::-webkit-scrollbar-thumb {
+  background: var(--accent-color);
+  border-radius: 4px;
+}
+
+::-webkit-scrollbar-thumb:hover {
+  background: var(--accent-light);
+}
+
+/* Mobile Menu Toggle */
+.mobile-menu-toggle {
+  position: fixed;
+  top: var(--space-md);
+  left: var(--space-md);
+  z-index: 1002;
+  background: var(--bg-card);
+  border: 1px solid var(--border-color);
+  color: var(--text-primary);
+  width: 44px;
+  height: 44px;
+  border-radius: var(--radius-md);
+  display: none;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  transition: all var(--transition);
+  box-shadow: var(--shadow-md);
+}
+
+.mobile-menu-toggle:hover {
+  background: var(--accent-color);
+  border-color: var(--accent-color);
+  transform: scale(1.05);
+}
+
+.mobile-menu-toggle i {
+  font-size: 1.25rem;
+}
+
+/* Sidebar */
+.sidebar {
+  position: fixed;
+  left: 0;
+  top: 0;
+  width: var(--sidebar-width);
+  height: 100vh;
+  background: var(--bg-secondary);
+  border-right: 1px solid var(--border-color);
+  display: flex;
+  flex-direction: column;
+  z-index: 1000;
+  transition: transform var(--transition);
+  box-shadow: var(--shadow-lg);
+}
+
+.sidebar-header {
+  padding: var(--space-xl) var(--space-lg);
+  background: var(--bg-secondary);
+}
+
+.logo {
+  display: flex;
+  align-items: center;
+  gap: var(--space-md);
+}
+
+.logo-image {
+  width: 36px;
+  height: 36px;
+  object-fit: contain;
+}
+
+.logo-text {
+  font-size: 1.5rem;
+  font-weight: 700;
+  letter-spacing: -0.5px;
+}
+
+.version-badge {
+  display: inline-block;
+  background: var(--accent-transparent);
+  color: var(--accent-color);
+  padding: 0.25rem 0.75rem;
+  border-radius: 999px;
+  font-size: 0.75rem;
+  font-weight: 600;
+  border: 1px solid var(--accent-color);
+  margin-top: var(--space-xs);
+}
+
+.sidebar-nav {
+  flex: 1;
+  padding: var(--space-lg) 0;
+  overflow-y: auto;
+}
+
+.nav-item {
+  display: flex;
+  align-items: center;
+  gap: var(--space-md);
+  padding: var(--space-md) var(--space-lg);
+  color: var(--text-secondary);
+  transition: all var(--transition);
+  position: relative;
+  margin: 0 var(--space-sm);
+  border-radius: var(--radius-md);
+}
+
+.nav-item::before {
+  content: "";
+  position: absolute;
+  left: 0;
+  top: 50%;
+  transform: translateY(-50%);
+  width: 4px;
+  height: 0;
+  background: var(--accent-color);
+  border-radius: 0 4px 4px 0;
+  transition: height var(--transition);
+}
+
+.nav-item:hover {
+  color: var(--text-primary);
+  background: rgba(255, 255, 255, 0.05);
+}
+
+.nav-item.active {
+  color: var(--accent-color);
+  background: var(--accent-transparent);
+  font-weight: 600;
+}
+
+.nav-item.active::before {
+  height: 60%;
+}
+
+.nav-item i {
+  font-size: 1.25rem;
+  width: 24px;
+  text-align: center;
+}
+
+.sidebar-footer {
+  padding: var(--space-lg);
+  border-top: 1px solid var(--border-color);
+}
+
+.version-check {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--space-sm);
+  padding: var(--space-md);
+  background: var(--bg-tertiary);
+  border-radius: var(--radius-md);
+  border: 1px solid var(--border-color);
+}
+
+.version-number {
+  font-size: 0.875rem;
+  font-weight: 700;
+  color: var(--text-primary);
+}
+
+.version-status {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.25rem;
+  padding: 0.25rem 0.5rem;
+  border-radius: 4px;
+  font-size: 0.75rem;
+  font-weight: 600;
+  transition: all var(--transition);
+}
+
+.version-status.checking {
+  background: rgba(255, 255, 255, 0.05);
+  color: var(--text-tertiary);
+}
+
+.version-status.up-to-date {
+  background: rgba(16, 185, 129, 0.15);
+  color: #10b981;
+  border: 1px solid rgba(16, 185, 129, 0.3);
+}
+
+.version-status.update-available {
+  background: rgba(245, 158, 11, 0.15);
+  color: #f59e0b;
+  border: 1px solid rgba(245, 158, 11, 0.3);
+  cursor: pointer;
+}
+
+.version-status.update-available:hover {
+  background: rgba(245, 158, 11, 0.25);
+}
+
+.version-status.develop {
+  background: rgba(139, 92, 246, 0.15);
+  color: #8b5cf6;
+  border: 1px solid rgba(139, 92, 246, 0.3);
+}
+
+.theme-toggle-btn {
+  width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--space-sm);
+  padding: var(--space-md);
+  background: var(--bg-tertiary);
+  border: 1px solid var(--border-color);
+  color: var(--text-secondary);
+  border-radius: var(--radius-md);
+  cursor: pointer;
+  transition: all var(--transition);
+  font-size: 0.95rem;
+}
+
+.theme-toggle-btn:hover {
+  background: var(--accent-color);
+  color: white;
+  border-color: var(--accent-color);
+  transform: translateY(-2px);
+  box-shadow: var(--shadow-md);
+}
+
+/* Main Content */
+.main-content {
+  margin-left: var(--sidebar-width);
+  min-height: 100vh;
+  background: var(--bg-primary);
+  transition: margin-left var(--transition);
+}
+
+/* Top Bar */
+.top-bar {
+  height: var(--topbar-height);
+  background: var(--bg-secondary);
+  border-bottom: 1px solid var(--border-color);
+  padding: 0 var(--space-xl);
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  position: sticky;
+  top: 0;
+  z-index: 100;
+  box-shadow: var(--shadow-sm);
+}
+
+.top-bar-left {
+  flex: 1;
+}
+
+.page-title {
+  font-size: 1.75rem;
+  font-weight: 700;
+  margin: 0;
+  letter-spacing: -0.5px;
+}
+
+.top-bar-right {
+  display: flex;
+  align-items: center;
+  gap: var(--space-lg);
+}
+
+/* Theme Dropdown */
+.theme-dropdown {
+  position: relative;
+}
+
+.theme-toggle-btn {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 40px;
+  height: 40px;
+  background: var(--bg-tertiary);
+  border: 1px solid var(--border-color);
+  border-radius: var(--radius-md);
+  color: var(--text-secondary);
+  cursor: pointer;
+  transition: all var(--transition);
+}
+
+.theme-toggle-btn:hover {
+  background: rgba(255, 255, 255, 0.05);
+  border-color: var(--accent-color);
+  color: var(--accent-color);
+  transform: translateY(-1px);
+}
+
+.theme-dropdown-menu {
+  position: absolute;
+  top: calc(100% + 8px);
+  right: 0;
+  background: var(--bg-card);
+  border: 1px solid var(--border-color);
+  border-radius: var(--radius-md);
+  box-shadow: var(--shadow-lg);
+  min-width: 200px;
+  max-height: 400px;
+  overflow-y: auto;
+  opacity: 0;
+  visibility: hidden;
+  transform: translateY(-10px);
+  transition: all 0.2s ease;
+  z-index: 1000;
+}
+
+.theme-dropdown-menu.active {
+  opacity: 1;
+  visibility: visible;
+  transform: translateY(0);
+}
+
+.theme-dropdown-item {
+  display: flex;
+  align-items: center;
+  gap: var(--space-md);
+  padding: var(--space-md) var(--space-lg);
+  cursor: pointer;
+  transition: all var(--transition);
+  position: relative;
+}
+
+.theme-dropdown-item:hover {
+  background: var(--bg-tertiary);
+}
+
+.theme-dropdown-item.active {
+  background: var(--accent-transparent);
+}
+
+.theme-dropdown-item .theme-check {
+  margin-left: auto;
+  color: var(--accent-color);
+  opacity: 0;
+  transition: opacity var(--transition);
+}
+
+.theme-dropdown-item.active .theme-check {
+  opacity: 1;
+}
+
+.theme-dropdown-item span {
+  flex: 1;
+  font-size: 0.9rem;
+  color: var(--text-primary);
+}
+
+.status-indicator {
+  display: flex;
+  align-items: center;
+  gap: var(--space-sm);
+  padding: var(--space-sm) var(--space-md);
+  background: var(--bg-tertiary);
+  border-radius: var(--radius-md);
+  border: 1px solid var(--border-color);
+  cursor: pointer;
+  transition: all var(--transition);
+}
+
+.status-indicator:hover {
+  background: rgba(255, 255, 255, 0.05);
+  border-color: rgba(255, 255, 255, 0.2);
+  transform: translateY(-1px);
+}
+
+.status-dot {
+  width: 10px;
+  height: 10px;
+  border-radius: 50%;
+  background: var(--success);
+  animation: pulse 2s infinite;
+  transition: background var(--transition);
+}
+
+/* Status States */
+.status-indicator.status-active .status-dot {
+  background: #10b981;
+  box-shadow: 0 0 10px rgba(16, 185, 129, 0.5);
+}
+
+.status-indicator.status-paused .status-dot {
+  background: #f59e0b;
+  box-shadow: 0 0 10px rgba(245, 158, 11, 0.5);
+  animation: none;
+}
+
+.status-indicator.status-stopped .status-dot {
+  background: #ef4444;
+  box-shadow: 0 0 10px rgba(239, 68, 68, 0.5);
+  animation: none;
+}
+
+.status-indicator.status-error .status-dot {
+  background: #dc2626;
+  box-shadow: 0 0 10px rgba(220, 38, 38, 0.5);
+  animation: blink 1s infinite;
+}
+
+@keyframes blink {
+  0%,
+  100% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0.2;
+  }
+}
+
+@keyframes pulse {
+  0%,
+  100% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0.5;
+  }
+}
+
+.status-text {
+  font-size: 0.875rem;
+  font-weight: 600;
+  color: var(--text-secondary);
+  transition: color var(--transition);
+}
+
+.status-indicator.status-active .status-text {
+  color: #10b981;
+}
+
+.status-indicator.status-paused .status-text {
+  color: #f59e0b;
+}
+
+.status-indicator.status-stopped .status-text {
+  color: #ef4444;
+}
+
+.status-indicator.status-error .status-text {
+  color: #dc2626;
+}
+
+.icon-btn {
+  width: 44px;
+  height: 44px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: var(--bg-tertiary);
+  border: 1px solid var(--border-color);
+  border-radius: var(--radius-md);
+  color: var(--text-primary);
+  cursor: pointer;
+  transition: all var(--transition);
+}
+
+.icon-btn:hover {
+  background: var(--accent-color);
+  border-color: var(--accent-color);
+  transform: scale(1.05);
+}
+
+/* Content Sections */
+.content-section {
+  display: none;
+  padding: var(--space-xxl);
+  animation: fadeIn 0.3s ease;
+}
+
+.content-section.active {
+  display: block;
+}
+
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+    transform: translateY(10px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+/* Stats Grid */
+.stats-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
+  gap: var(--space-lg);
+  margin-bottom: var(--space-xxl);
+}
+
+.stat-card {
+  background: var(--bg-card);
+  border: 1px solid var(--border-color);
+  border-radius: var(--radius-lg);
+  padding: var(--space-xl);
+  transition: all var(--transition);
+  position: relative;
+  overflow: hidden;
+}
+
+.stat-card::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  height: 4px;
+  background: var(--accent-color);
+}
+
+.stat-card::after {
+  content: "";
+  position: absolute;
+  top: -50%;
+  right: -50%;
+  width: 200%;
+  height: 200%;
+  background: radial-gradient(
+    circle,
+    rgba(255, 255, 255, 0.05) 0%,
+    transparent 70%
+  );
+  pointer-events: none;
+  transition: transform 0.6s ease;
+}
+
+.stat-card:hover::after {
+  transform: translate(-25%, -25%);
+}
+
+/* Stat Card Color Variants */
+.stat-card-orange::before {
+  background: linear-gradient(90deg, #ff9800, #ff5722);
+}
+
+.stat-card-blue::before {
+  background: linear-gradient(90deg, #2196f3, #00bcd4);
+}
+
+.stat-card-purple::before {
+  background: linear-gradient(90deg, #9c27b0, #e91e63);
+}
+
+.stat-card-green::before {
+  background: linear-gradient(90deg, #4caf50, #8bc34a);
+}
+
+.stat-card:hover {
+  transform: translateY(-5px);
+  box-shadow: var(--shadow-lg);
+  border-color: var(--accent-color);
+}
+
+.stat-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: var(--space-md);
+}
+
+.stat-icon {
+  width: 60px;
+  height: 60px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: var(--radius-md);
+  position: relative;
+  overflow: hidden;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
+}
+
+.stat-icon i {
+  font-size: 1.75rem;
+  color: white;
+  position: relative;
+  z-index: 1;
+}
+
+/* Colorful Gradient Icons (Fixed Colors) */
+.gradient-orange {
+  background: linear-gradient(135deg, #ff9800 0%, #ff5722 100%);
+}
+
+.gradient-blue {
+  background: linear-gradient(135deg, #2196f3 0%, #00bcd4 100%);
+}
+
+.gradient-purple {
+  background: linear-gradient(135deg, #9c27b0 0%, #e91e63 100%);
+}
+
+.gradient-green {
+  background: linear-gradient(135deg, #4caf50 0%, #8bc34a 100%);
+}
+
+.gradient-red {
+  background: linear-gradient(135deg, #f44336 0%, #e91e63 100%);
+}
+
+.gradient-indigo {
+  background: linear-gradient(135deg, #3f51b5 0%, #5c6bc0 100%);
+}
+
+.gradient-cyan {
+  background: linear-gradient(135deg, #00bcd4 0%, #26c6da 100%);
+}
+
+/* Stat Badges */
+.stat-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.375rem;
+  padding: 0.375rem 0.75rem;
+  border-radius: 999px;
+  font-size: 0.75rem;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+}
+
+.badge-pulse {
+  background: linear-gradient(135deg, #ff9800, #ff5722);
+  color: white;
+  animation: pulse 2s ease-in-out infinite;
+}
+
+@keyframes pulse {
+  0%,
+  100% {
+    opacity: 1;
+    transform: scale(1);
+  }
+  50% {
+    opacity: 0.9;
+    transform: scale(1.02);
+  }
+}
+
+.badge-info {
+  background: linear-gradient(135deg, #2196f3, #00bcd4);
+  color: white;
+}
+
+.badge-warning {
+  background: linear-gradient(135deg, #ff9800, #ffc107);
+  color: white;
+}
+
+.badge-success {
+  background: linear-gradient(135deg, #4caf50, #8bc34a);
+  color: white;
+}
+
+.badge-live {
+  background: linear-gradient(135deg, #f44336, #e91e63);
+  color: white;
+  margin-left: 0.75rem;
+  animation: pulse 2s ease-in-out infinite;
+}
+
+.badge-live i {
+  animation: blink 1.5s ease-in-out infinite;
+}
+
+@keyframes blink {
+  0%,
+  100% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0.3;
+  }
+}
+
+/* Mini Badges */
+.mini-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.25rem;
+  padding: 0.25rem 0.5rem;
+  border-radius: 999px;
+  font-size: 0.7rem;
+  font-weight: 600;
+  margin-top: 0.5rem;
+}
+
+/* Overview Badges - Enhanced Styling */
+.overview-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.375rem;
+  padding: 0.375rem 0.875rem;
+  border-radius: 999px;
+  font-size: 0.7rem;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.75px;
+  margin-top: 0.5rem;
+  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.25);
+  transition: all 0.3s ease;
+  border: 1.5px solid transparent;
+}
+
+.overview-badge:hover {
+  transform: translateY(-1px);
+  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.35);
+}
+
+.overview-badge i {
+  font-size: 0.75rem;
+}
+
+/* Success Badge with Glow */
+.badge-success-glow {
+  background: linear-gradient(135deg, #10b981 0%, #34d399 100%);
+  color: white;
+  border-color: #10b981;
+  box-shadow: 0 3px 12px rgba(16, 185, 129, 0.4),
+    0 0 20px rgba(16, 185, 129, 0.2);
+  animation: successPulse 3s ease-in-out infinite;
+}
+
+.badge-success-glow:hover {
+  box-shadow: 0 5px 20px rgba(16, 185, 129, 0.5),
+    0 0 30px rgba(16, 185, 129, 0.3);
+}
+
+@keyframes successPulse {
+  0%,
+  100% {
+    box-shadow: 0 3px 12px rgba(16, 185, 129, 0.4),
+      0 0 20px rgba(16, 185, 129, 0.2);
+  }
+  50% {
+    box-shadow: 0 4px 16px rgba(16, 185, 129, 0.5),
+      0 0 25px rgba(16, 185, 129, 0.3);
+  }
+}
+
+/* Info Badge with Glow */
+.badge-info-glow {
+  background: linear-gradient(135deg, #3b82f6 0%, #60a5fa 100%);
+  color: white;
+  border-color: #3b82f6;
+  box-shadow: 0 3px 12px rgba(59, 130, 246, 0.4),
+    0 0 20px rgba(59, 130, 246, 0.2);
+  animation: infoPulse 3s ease-in-out infinite;
+}
+
+.badge-info-glow:hover {
+  box-shadow: 0 5px 20px rgba(59, 130, 246, 0.5),
+    0 0 30px rgba(59, 130, 246, 0.3);
+}
+
+@keyframes infoPulse {
+  0%,
+  100% {
+    box-shadow: 0 3px 12px rgba(59, 130, 246, 0.4),
+      0 0 20px rgba(59, 130, 246, 0.2);
+  }
+  50% {
+    box-shadow: 0 4px 16px rgba(59, 130, 246, 0.5),
+      0 0 25px rgba(59, 130, 246, 0.3);
+  }
+}
+
+/* Warning Badge with Glow */
+.badge-warning-glow {
+  background: linear-gradient(135deg, #f59e0b 0%, #fbbf24 100%);
+  color: white;
+  border-color: #f59e0b;
+  box-shadow: 0 3px 12px rgba(245, 158, 11, 0.4),
+    0 0 20px rgba(245, 158, 11, 0.2);
+  animation: warningPulse 3s ease-in-out infinite;
+}
+
+.badge-warning-glow:hover {
+  box-shadow: 0 5px 20px rgba(245, 158, 11, 0.5),
+    0 0 30px rgba(245, 158, 11, 0.3);
+}
+
+@keyframes warningPulse {
+  0%,
+  100% {
+    box-shadow: 0 3px 12px rgba(245, 158, 11, 0.4),
+      0 0 20px rgba(245, 158, 11, 0.2);
+  }
+  50% {
+    box-shadow: 0 4px 16px rgba(245, 158, 11, 0.5),
+      0 0 25px rgba(245, 158, 11, 0.3);
+  }
+}
+
+.badge-outline-orange {
+  background: rgba(255, 152, 0, 0.1);
+  border: 1px solid #ff9800;
+  color: #ff9800;
+}
+
+.badge-outline-blue {
+  background: rgba(33, 150, 243, 0.1);
+  border: 1px solid #2196f3;
+  color: #2196f3;
+}
+
+.badge-outline-purple {
+  background: rgba(156, 39, 176, 0.1);
+  border: 1px solid #9c27b0;
+  color: #9c27b0;
+}
+
+.badge-outline-green {
+  background: rgba(76, 175, 80, 0.1);
+  border: 1px solid #4caf50;
+  color: #4caf50;
+}
+
+.stat-label {
+  font-size: 0.875rem;
+  text-transform: uppercase;
+  letter-spacing: 1px;
+  color: var(--text-tertiary);
+  font-weight: 600;
+  margin-bottom: var(--space-sm);
+}
+
+.stat-body {
+  margin-bottom: var(--space-md);
+}
+
+.stat-value {
+  font-size: 2.5rem;
+  font-weight: 700;
+  color: var(--text-primary);
+  line-height: 1;
+  margin-bottom: var(--space-sm);
+}
+
+.stat-subtitle {
+  font-size: 0.875rem;
+  color: var(--text-tertiary);
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+}
+
+.stat-subtitle i {
+  color: var(--accent-color);
+  font-size: 0.875rem;
+}
+
+.stat-footer {
+  margin-top: var(--space-lg);
+  padding-top: var(--space-lg);
+  border-top: 1px solid var(--border-color);
+}
+
+.stat-footer-mini {
+  margin-top: var(--space-md);
+}
+
+/* Mini Progress Bar */
+.stat-progress {
+  margin-top: var(--space-md);
+}
+
+.progress-mini {
+  height: 6px;
+  background: rgba(255, 255, 255, 0.05);
+  border-radius: 999px;
+  overflow: hidden;
+}
+
+.progress-bar-mini {
+  height: 100%;
+  border-radius: 999px;
+  transition: width 0.5s ease;
+  box-shadow: 0 0 10px currentColor;
+}
+
+.control-button {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--space-sm);
+  padding: var(--space-sm) var(--space-lg);
+  background: var(--success);
+  color: white;
+  border-radius: var(--radius-md);
+  border: none;
+  font-weight: 600;
+  cursor: pointer;
+  transition: all var(--transition);
+}
+
+.control-button:hover {
+  transform: translateY(-2px);
+  box-shadow: var(--shadow-md);
+}
+
+.control-button.bg-success {
+  background: var(--success);
+}
+
+.control-button.bg-danger {
+  background: var(--danger);
+}
+
+/* Card Styles */
+.card {
+  background: var(--bg-card);
+  border: 1px solid var(--border-color);
+  border-radius: var(--radius-lg);
+  margin-bottom: var(--space-xl);
+  overflow: hidden;
+  transition: all var(--transition);
+}
+
+.card:hover {
+  border-color: rgba(255, 255, 255, 0.15);
+  box-shadow: var(--shadow-md);
+}
+
+.card-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: var(--space-xl);
+  border-bottom: 1px solid var(--border-color);
+  background: rgba(255, 255, 255, 0.02);
+  position: relative;
+}
+
+.card-title {
+  display: flex;
+  align-items: center;
+  gap: var(--space-md);
+  font-size: 1.25rem;
+  font-weight: 700;
+  margin: 0;
+}
+
+.card-title i {
+  width: 40px;
+  height: 40px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: var(--accent-transparent);
+  border-radius: var(--radius-md);
+  color: var(--accent-color);
+  font-size: 1.125rem;
+}
+
+.card-actions {
+  display: flex;
+  align-items: center;
+  gap: var(--space-md);
+}
+
+.card-action-link {
+  font-size: 0.875rem;
+  color: var(--accent-color);
+  text-decoration: none;
+  display: flex;
+  align-items: center;
+  gap: var(--space-xs);
+  transition: all var(--transition);
+  font-weight: 500;
+}
+
+.card-action-link:hover {
+  color: var(--accent-light);
+  gap: var(--space-sm);
+}
+
+.card-body {
+  padding: var(--space-xl);
+}
+
+/* Overview Mini Cards - Horizontal Layout */
+.overview-cards-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
+  gap: var(--space-lg);
+  margin-bottom: var(--space-xxl);
+}
+
+.overview-mini-card {
+  background: var(--bg-card);
+  border: 1px solid var(--border-color);
+  border-radius: var(--radius-md);
+  padding: var(--space-lg) var(--space-xl);
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--space-md);
+  transition: all var(--transition);
+  position: relative;
+  overflow: hidden;
+}
+
+.overview-mini-card::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  height: 2px;
+  background: var(--accent-color);
+  opacity: 0;
+  transition: opacity var(--transition);
+}
+
+.overview-mini-card:hover {
+  transform: translateY(-3px);
+  box-shadow: var(--shadow-lg);
+  border-color: var(--accent-color);
+}
+
+.overview-mini-card:hover::before {
+  opacity: 1;
+}
+
+.overview-mini-content {
+  flex: 1;
+  min-width: 0;
+}
+
+.overview-mini-label {
+  font-size: 0.7rem;
+  text-transform: uppercase;
+  letter-spacing: 1px;
+  color: var(--text-tertiary);
+  font-weight: 600;
+  margin-bottom: 0.5rem;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.overview-mini-value {
+  font-size: 1.5rem;
+  font-weight: 700;
+  color: var(--text-primary);
+  line-height: 1;
+}
+
+/* Colored Values Matching Icon Gradients */
+.value-green {
+  color: #4caf50;
+}
+
+.value-blue {
+  color: #2196f3;
+}
+
+.value-orange {
+  color: #ff9800;
+}
+
+.value-purple {
+  color: #9c27b0;
+}
+
+.value-indigo {
+  color: #5c6bc0;
+}
+
+.value-red {
+  color: #f44336;
+}
+
+.value-cyan {
+  color: #00bcd4;
+}
+
+/* Mini Subtitle for Additional Info */
+.overview-mini-subtitle {
+  font-size: 0.7rem;
+  color: var(--text-tertiary);
+  margin-top: 0.375rem;
+  display: flex;
+  align-items: center;
+  gap: 0.375rem;
+}
+
+.overview-mini-subtitle i {
+  font-size: 0.7rem;
+  color: var(--text-tertiary);
+}
+
+.overview-mini-icon {
+  width: 48px;
+  height: 48px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: var(--radius-md);
+  flex-shrink: 0;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
+}
+
+.overview-mini-icon i {
+  font-size: 1.5rem;
+  color: white;
+}
+
+/* Table Styles */
+.table-responsive {
+  overflow-x: auto;
+  border-radius: var(--radius-md);
+  background: rgba(255, 255, 255, 0.01);
+}
+
+.table {
+  width: 100%;
+  border-collapse: collapse;
+}
+
+.table thead {
+  background: rgba(255, 255, 255, 0.04);
+}
+
+.table th {
+  padding: var(--space-lg) var(--space-md);
+  text-align: left;
+  font-weight: 600;
+  font-size: 0.875rem;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  color: var(--text-tertiary);
+  border-bottom: 2px solid var(--border-color);
+  position: relative;
+  vertical-align: middle;
+}
+
+.table th::after {
+  content: "";
+  position: absolute;
+  bottom: -2px;
+  left: 0;
+  width: 0;
+  height: 2px;
+  background: var(--accent-color);
+  transition: width var(--transition);
+}
+
+.table th:hover::after {
+  width: 100%;
+}
+
+.table td {
+  padding: var(--space-lg) var(--space-md);
+  border-bottom: 1px solid rgba(255, 255, 255, 0.03);
+  vertical-align: middle;
+}
+
+.table tbody tr {
+  transition: all var(--transition);
+}
+
+.table tbody tr:hover {
+  background: rgba(255, 255, 255, 0.05);
+  border-left: 3px solid var(--accent-color);
+}
+
+.no-uploads-message {
+  text-align: center !important;
+  padding: var(--space-xxl) !important;
+  color: var(--text-tertiary);
+  font-style: italic;
+  vertical-align: middle !important;
+}
+
+.active-uploads-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--space-sm);
+  color: white;
+  padding: var(--space-sm) var(--space-lg);
+  border-radius: 999px;
+  font-size: 0.875rem;
+  font-weight: 600;
+  border: 1px solid var(--accent-dark);
+}
+
+#active-count-badge {
+  background: rgba(255, 255, 255, 0.3);
+  color: white;
+  padding: 0.125rem 0.5rem;
+  border-radius: 999px;
+  font-size: 0.75rem;
+  min-width: 20px;
+  text-align: center;
+  font-weight: 700;
+  border: 1px solid var(--accent-dark);
+}
+
+.action-button {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--space-sm);
+  padding: var(--space-sm) var(--space-lg);
+  background: var(--bg-tertiary);
+  color: var(--text-secondary);
+  border-radius: var(--radius-md);
+  border: 1px solid var(--accent-dark);
+  cursor: pointer;
+  transition: all var(--transition);
+  font-size: 0.875rem;
+  font-weight: 600;
+}
+
+.action-button:hover {
+  background: var(--accent-color);
+  color: white;
+  border-color: var(--accent-color);
+  transform: translateY(-2px);
+  box-shadow: var(--shadow-md);
+}
+
+/* Progress Bars */
+.progress-container {
+  width: 100%;
+}
+
+.progress-info {
+  display: flex;
+  justify-content: space-between;
+  margin-bottom: var(--space-xs);
+  font-size: 0.875rem;
+}
+
+.progress-percentage {
+  font-weight: 600;
+  color: var(--accent-color);
+}
+
+.progress {
+  height: 8px;
+  background: rgba(255, 255, 255, 0.05);
+  border-radius: 999px;
+  overflow: hidden;
+}
+
+.progress-bar {
+  height: 100%;
+  background: var(--accent-color);
+  border-radius: 999px;
+  transition: width 0.3s ease;
+}
+
+.progress-bar.bg-success {
+  background: var(--success);
+}
+
+/* Settings Grid */
+.settings-grid {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  gap: var(--space-xl);
+  margin-bottom: var(--space-xl);
+}
+
+.settings-grid .card {
+  transition: all var(--transition);
+  border: 1px solid var(--border-color);
+  background: var(--bg-card);
+  box-shadow: var(--shadow-sm);
+}
+
+.settings-grid .card:hover {
+  transform: translateY(-2px);
+  box-shadow: var(--shadow-md);
+  border-color: rgba(var(--accent-rgb), 0.3);
+}
+
+.settings-grid .card-header {
+  background: var(--bg-secondary);
+  border-bottom: 1px solid var(--border-color);
+  padding: var(--space-lg);
+}
+
+.settings-grid .card-title {
+  font-size: 1.125rem;
+  font-weight: 600;
+  color: var(--text-primary);
+  display: flex;
+  align-items: center;
+  gap: var(--space-md);
+}
+
+.settings-grid .card-title i {
+  font-size: 1rem;
+  color: var(--accent-color);
+}
+
+.settings-grid .card-body {
+  padding: var(--space-lg);
+}
+
+.theme-card {
+  grid-column: 1 / -1;
+}
+
+.settings-form {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-lg);
+}
+
+.unified-settings-form {
+  width: 100%;
+}
+
+.form-group {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-sm);
+  min-height: auto;
+}
+
+.form-group label {
+  font-size: 0.875rem;
+  font-weight: 500;
+  color: var(--text-secondary);
+  text-align: left;
+}
+
+.form-control {
+  padding: var(--space-md);
+  background: var(--bg-tertiary);
+  border: 1px solid var(--border-color);
+  border-radius: var(--radius-md);
+  color: var(--text-primary);
+  font-size: 0.9rem;
+  transition: all var(--transition);
+  width: 100%;
+  max-width: none;
+}
+
+.form-control:focus {
+  outline: none;
+  border-color: var(--accent-color);
+  background: var(--bg-tertiary);
+}
+
+/* Toggle Switch */
+.toggle-switch {
+  position: relative;
+  display: inline-block;
+  width: 48px;
+  height: 24px;
+}
+
+.toggle-switch input {
+  opacity: 0;
+  width: 0;
+  height: 0;
+}
+
+.toggle-slider {
+  position: absolute;
+  cursor: pointer;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: var(--bg-tertiary);
+  border: 1px solid var(--border-color);
+  transition: all 0.3s ease;
+  border-radius: 24px;
+}
+
+.toggle-slider:before {
+  position: absolute;
+  content: "";
+  height: 18px;
+  width: 18px;
+  left: 2px;
+  bottom: 2px;
+  background-color: var(--text-secondary);
+  transition: all 0.3s ease;
+  border-radius: 50%;
+}
+
+.toggle-switch input:checked + .toggle-slider {
+  background-color: var(--accent-color);
+  border-color: var(--accent-color);
+}
+
+.toggle-switch input:checked + .toggle-slider:before {
+  transform: translateX(24px);
+  background-color: white;
+}
+
+.toggle-switch input:focus + .toggle-slider {
+  box-shadow: 0 0 0 3px var(--accent-transparent);
+}
+
+.form-group.toggle-group {
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
+  padding: var(--space-md);
+  min-height: 48px;
+  margin-top: var(--space-md);
+  margin-bottom: var(--space-md);
+  border: 1px solid var(--border-color);
+  border-radius: var(--radius-md);
+  background: var(--bg-secondary);
+  transition: all 0.2s ease;
+}
+
+.form-group.toggle-group label:first-child {
+  margin-bottom: 0;
+}
+
+.settings-save-container {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding: var(--space-xl) 0;
+  margin-top: var(--space-lg);
+  border-top: 1px solid var(--border-color);
+}
+
+.settings-save-top {
+  justify-content: flex-end;
+  margin-top: 0;
+  margin-bottom: var(--space-xl);
+  border-top: none;
+  border-bottom: none;
+  padding-bottom: 0;
+}
+
+.auto-save-indicator {
+  animation: fadeIn 0.3s ease;
+}
+
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+    transform: translateY(-10px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+.btn-save-all {
+  min-width: 200px;
+  font-size: 1rem;
+  padding: var(--space-lg) var(--space-xl);
+}
+
+.btn {
+  padding: var(--space-md) var(--space-xl);
+  background: var(--accent-transparent);
+  color: white;
+  border: 1px solid var(--accent-dark);
+  border-radius: var(--radius-md);
+  font-weight: 500;
+  cursor: pointer;
+  transition: all var(--transition);
+  font-size: 0.9rem;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--space-sm);
+}
+
+.btn:hover {
+  background: var(--accent-color);
+  color: white;
+  border-color: var(--accent-color);
+  transform: translateY(-2px);
+  box-shadow: var(--shadow-md);
+}
+
+.btn:active {
+  transform: translateY(0);
+}
+
+/* Theme Settings */
+.theme-card {
+  grid-column: 1 / -1;
+}
+
+.theme-section {
+  margin-bottom: 0;
+}
+
+.theme-section h3 {
+  font-size: 1.125rem;
+  margin-bottom: var(--space-md);
+  color: var(--text-primary);
+}
+
+.theme-section p {
+  color: var(--text-tertiary);
+  margin-bottom: var(--space-lg);
+  font-size: 0.95rem;
+}
+
+.theme-options {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
+  gap: var(--space-md);
+}
+
+.theme-option {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: var(--space-sm);
+  padding: var(--space-lg);
+  background: var(--bg-tertiary);
+  border: 2px solid transparent;
+  border-radius: var(--radius-md);
+  cursor: pointer;
+  transition: all var(--transition);
+}
+
+.theme-option:hover {
+  transform: translateY(-3px);
+  box-shadow: var(--shadow-md);
+  border-color: rgba(255, 255, 255, 0.1);
+}
+
+.theme-option.active {
+  border-color: var(--accent-color);
+  background: var(--accent-transparent);
+}
+
+.theme-dot {
+  width: 36px;
+  height: 36px;
+  border-radius: 50%;
+  box-shadow: var(--shadow-sm);
+}
+
+.theme-dot.aquamarine {
+  background: #009688;
+}
+.theme-dot.dark {
+  background: #888888;
+}
+.theme-dot.organizr {
+  background: #2cabe3;
+}
+.theme-dot.nord {
+  background: #88c0d0;
+}
+.theme-dot.overseerr {
+  background: #a78bfa;
+}
+.theme-dot.onedark {
+  background: #61afef;
+}
+.theme-dot.hotline {
+  background: #f98dc9;
+}
+.theme-dot.maroon {
+  background: #a21c65;
+}
+.theme-dot.dracula {
+  background: #bd93f9;
+}
+.theme-dot.plex {
+  background: #e5a00d;
+}
+.theme-dot.space-gray {
+  background: #81a6b7;
+}
+.theme-dot.hotpink {
+  background: #fb3f62;
+}
+
+.theme-option span {
+  font-size: 0.875rem;
+  font-weight: 500;
+  color: var(--text-secondary);
+  text-align: center;
+}
+
+/* Footer */
+.footer {
+  padding: var(--space-xl);
+  text-align: center;
+  color: var(--text-tertiary);
+  font-size: 0.875rem;
+  border-top: 1px solid var(--border-color);
+  margin-top: var(--space-xxl);
+}
+
+.footer p {
+  margin-bottom: var(--space-sm);
+}
+
+/* Status Message */
+.status-message {
+  position: fixed;
+  top: 90px;
+  right: var(--space-xl);
+  z-index: 2000;
+  padding: var(--space-lg) var(--space-xl);
+  background: var(--success);
+  color: white;
+  border-radius: var(--radius-md);
+  box-shadow: var(--shadow-lg);
+  display: none;
+  animation: slideInRight 0.3s ease;
+}
+
+@keyframes slideInRight {
+  from {
+    transform: translateX(100%);
+    opacity: 0;
+  }
+  to {
+    transform: translateX(0);
+    opacity: 1;
+  }
+}
+
+.status-message.error {
+  background: var(--danger);
+}
+
+/* Pagination */
+.pagination-container {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding-top: var(--space-lg);
+  margin-top: var(--space-lg);
+  border-top: 1px solid var(--border-color);
+}
+
+.pagination {
+  display: flex;
+  gap: var(--space-xs);
+  list-style: none;
+}
+
+.page-item {
+  list-style: none;
+}
+
+.page-link {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 40px;
+  height: 40px;
+  padding: 0 var(--space-md);
+  background: var(--bg-tertiary);
+  color: var(--text-secondary);
+  border-radius: var(--radius-md);
+  border: 1px solid var(--border-color);
+  transition: all var(--transition);
+  font-weight: 600;
+}
+
+.page-link:hover {
+  background: var(--accent-transparent);
+  color: var(--accent-color);
+  border-color: var(--accent-color);
+}
+
+.page-item.active .page-link {
+  background: var(--accent-color);
+  color: white;
+  border-color: var(--accent-color);
+}
+
+/* Utility Classes */
+.d-none {
+  display: none !important;
+}
+.d-flex {
+  display: flex !important;
+}
+.d-lg-table-cell {
+  display: table-cell !important;
+}
+.text-center {
+  text-align: center !important;
+}
+.text-end {
+  text-align: right !important;
+}
+.truncate {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+/* Responsive Design */
+@media (max-width: 1024px) {
+  .stats-grid {
+    grid-template-columns: repeat(2, 1fr);
+  }
+
+  .settings-grid {
+    grid-template-columns: 1fr;
+  }
+}
+
+@media (max-width: 768px) {
+  .mobile-menu-toggle {
+    display: flex;
+  }
+
+  .sidebar {
+    transform: translateX(-100%);
+  }
+
+  .sidebar.active {
+    transform: translateX(0);
+  }
+
+  body.sidebar-open {
+    overflow: hidden;
+  }
+
+  body.sidebar-open::before {
+    content: "";
+    position: fixed;
+    inset: 0;
+    background: rgba(0, 0, 0, 0.5);
+    z-index: 999;
+  }
+
+  .main-content {
+    margin-left: 0;
+  }
+
+  .top-bar {
+    padding: 0 var(--space-lg);
+  }
+
+  .page-title {
+    font-size: 1.5rem;
+  }
+
+  .content-section {
+    padding: var(--space-lg);
+  }
+
+  .stats-grid {
+    grid-template-columns: 1fr;
+  }
+
+  .overview-cards-grid {
+    grid-template-columns: repeat(2, 1fr);
+  }
+
+  .overview-mini-card {
+    padding: var(--space-md) var(--space-lg);
+  }
+
+  .overview-mini-value {
+    font-size: 1.5rem;
+  }
+
+  .overview-mini-icon {
+    width: 40px;
+    height: 40px;
+  }
+
+  .overview-mini-icon i {
+    font-size: 1.25rem;
+  }
+
+  .theme-options {
+    grid-template-columns: repeat(3, 1fr);
+  }
+}
+
+@media (max-width: 480px) {
+  .top-bar {
+    padding: 0 var(--space-md);
+  }
+
+  .page-title {
+    font-size: 1.25rem;
+  }
+
+  .content-section {
+    padding: var(--space-md);
+  }
+
+  .stat-card {
+    padding: var(--space-lg);
+  }
+
+  .stat-value {
+    font-size: 2rem;
+  }
+
+  .card-header,
+  .card-body {
+    padding: var(--space-lg);
+  }
+
+  .theme-options {
+    grid-template-columns: repeat(2, 1fr);
+  }
+}
+
+/* Animations */
+.fa-spin-pulse {
+  animation: spin 2s linear infinite;
+}
+
+@keyframes spin {
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+}
+
+/* Time indicators */
+.time-remaining {
+  font-family: "Courier New", monospace;
+  font-weight: 600;
+  display: inline-block;
+  margin-right: var(--space-sm);
+}
+
+.upload-speed {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--space-xs);
+  padding: 0.25rem 0.75rem;
+  background: var(--accent-transparent);
+  color: var(--accent-color);
+  border-radius: 999px;
+  font-size: 0.75rem;
+  font-weight: 600;
+  border: 1px solid var(--accent-color);
+}
+
+.toggle-time-format {
+  cursor: pointer;
+  color: var(--text-tertiary);
+  margin-left: var(--space-sm);
+  transition: color var(--transition);
+}
+
+.toggle-time-format:hover {
+  color: var(--accent-color);
+}
+
+/* Table specific */
+.table-danger {
+  background: rgba(239, 68, 68, 0.1) !important;
+  border-left: 3px solid var(--danger);
+}
diff --git a/apps/docker-uploader/root/var/www/html/index.html b/apps/docker-uploader/root/var/www/html/index.html
index 96ba3dfeec..d91ea6c696 100755
--- a/apps/docker-uploader/root/var/www/html/index.html
+++ b/apps/docker-uploader/root/var/www/html/index.html
@@ -1,126 +1,1306 @@
 <!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
+<html lang="en" data-theme="dark">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
     <title>Uploader Dashboard</title>
-    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootswatch@5.2.3/dist/slate/bootstrap.min.css"/>
-    <link rel="stylesheet" href="css/style.css"/>
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css" integrity="sha512-z3gLpd7yknf1YoNbCzqRKc4qyor8gaKU1qmn+CShxbuBusANI9QpRohGBreCFkKxLhei6S9CQXFEbbKuqLg0DA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
-    <link rel="shortcut icon" type="image/x-icon" href="/favicon.ico">
-</head>
-<body>
-<div class="container py-3">
-    <header>
-        <div class="d-flex flex-column flex-md-row align-items-center pb-3 mb-4 border-bottom">
-            <a href="/" class="d-flex align-items-center text-light text-decoration-none">
-                <span class="fs-4">Uploader Dashboard</span>
+    <link
+      rel="stylesheet"
+      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css"
+      integrity="sha512-z3gLpd7yknf1YoNbCzqRKc4qyor8gaKU1qmn+CShxbuBusANI9QpRohGBreCFkKxLhei6S9CQXFEbbKuqLg0DA=="
+      crossorigin="anonymous"
+      referrerpolicy="no-referrer"
+    />
+    <link rel="shortcut icon" type="image/x-icon" href="/favicon.ico" />
+    <link rel="stylesheet" href="css/styles.css?v=4.2.8" />
+  </head>
+  <body>
+    <!-- Mobile Menu Toggle -->
+    <button
+      class="mobile-menu-toggle"
+      id="mobile-menu-toggle"
+      aria-label="Toggle menu"
+    >
+      <i class="fas fa-bars"></i>
+    </button>
+
+    <!-- Sidebar Navigation -->
+    <aside class="sidebar" id="sidebar">
+      <div class="sidebar-header">
+        <div class="logo">
+          <img src="logo.png" alt="Uploader Logo" class="logo-image" />
+          <span class="logo-text">Uploader</span>
+        </div>
+      </div>
+
+      <nav class="sidebar-nav">
+        <a href="#dashboard" class="nav-item active" data-section="dashboard">
+          <i class="fas fa-home"></i>
+          <span>Dashboard</span>
+        </a>
+        <a href="#uploads" class="nav-item" data-section="uploads">
+          <i class="fas fa-upload"></i>
+          <span>Active Uploads</span>
+        </a>
+        <a href="#queue" class="nav-item" data-section="queue">
+          <i class="fas fa-list"></i>
+          <span>Queue</span>
+        </a>
+        <a href="#history" class="nav-item" data-section="history">
+          <i class="fas fa-history"></i>
+          <span>History</span>
+        </a>
+        <a href="#settings" class="nav-item" data-section="settings">
+          <i class="fas fa-cog"></i>
+          <span>Settings</span>
+        </a>
+        <a href="#about" class="nav-item" data-section="about">
+          <i class="fas fa-info-circle"></i>
+          <span>About</span>
+        </a>
+      </nav>
+
+      <div class="sidebar-footer">
+        <div class="version-check">
+          <span class="version-number" id="app-version">loading...</span>
+          <span class="version-status" id="version-status">
+            <i class="fas fa-circle-notch fa-spin"></i>
+          </span>
+        </div>
+      </div>
+    </aside>
+
+    <!-- Main Content Area -->
+    <main class="main-content">
+      <!-- Top Bar -->
+      <header class="top-bar">
+        <div class="top-bar-left"></div>
+        <div class="top-bar-right">
+          <div id="control">
+            <button
+              class="control-button bg-success"
+              aria-label="Pause uploads"
+            >
+              <i class="fa-solid fa-pause"></i>
+              <span>Pause</span>
+            </button>
+          </div>
+          <div class="status-indicator" id="status-indicator">
+            <span class="status-dot"></span>
+            <span class="status-text">Active</span>
+          </div>
+          <div class="theme-dropdown">
+            <button
+              class="theme-toggle-btn"
+              id="theme-toggle-btn"
+              aria-label="Change theme"
+            >
+              <i class="fas fa-palette"></i>
+            </button>
+            <div class="theme-dropdown-menu" id="theme-dropdown-menu">
+              <div class="theme-dropdown-item" data-theme="dark">
+                <div class="theme-dot dark"></div>
+                <span>Dark</span>
+                <i class="fas fa-check theme-check"></i>
+              </div>
+              <div class="theme-dropdown-item" data-theme="aquamarine">
+                <div class="theme-dot aquamarine"></div>
+                <span>Aquamarine</span>
+                <i class="fas fa-check theme-check"></i>
+              </div>
+              <div class="theme-dropdown-item" data-theme="organizr">
+                <div class="theme-dot organizr"></div>
+                <span>Organizr</span>
+                <i class="fas fa-check theme-check"></i>
+              </div>
+              <div class="theme-dropdown-item" data-theme="nord">
+                <div class="theme-dot nord"></div>
+                <span>Nord</span>
+                <i class="fas fa-check theme-check"></i>
+              </div>
+              <div class="theme-dropdown-item" data-theme="overseerr">
+                <div class="theme-dot overseerr"></div>
+                <span>Overseerr</span>
+                <i class="fas fa-check theme-check"></i>
+              </div>
+              <div class="theme-dropdown-item" data-theme="onedark">
+                <div class="theme-dot onedark"></div>
+                <span>OneDark</span>
+                <i class="fas fa-check theme-check"></i>
+              </div>
+              <div class="theme-dropdown-item" data-theme="hotline">
+                <div class="theme-dot hotline"></div>
+                <span>Hotline</span>
+                <i class="fas fa-check theme-check"></i>
+              </div>
+              <div class="theme-dropdown-item" data-theme="maroon">
+                <div class="theme-dot maroon"></div>
+                <span>Maroon</span>
+                <i class="fas fa-check theme-check"></i>
+              </div>
+              <div class="theme-dropdown-item" data-theme="dracula">
+                <div class="theme-dot dracula"></div>
+                <span>Dracula</span>
+                <i class="fas fa-check theme-check"></i>
+              </div>
+              <div class="theme-dropdown-item" data-theme="plex">
+                <div class="theme-dot plex"></div>
+                <span>Plex</span>
+                <i class="fas fa-check theme-check"></i>
+              </div>
+              <div class="theme-dropdown-item" data-theme="space-gray">
+                <div class="theme-dot space-gray"></div>
+                <span>Space Gray</span>
+                <i class="fas fa-check theme-check"></i>
+              </div>
+              <div class="theme-dropdown-item" data-theme="hotpink">
+                <div class="theme-dot hotpink"></div>
+                <span>Hot Pink</span>
+                <i class="fas fa-check theme-check"></i>
+              </div>
+            </div>
+          </div>
+        </div>
+      </header>
+
+      <!-- Dashboard Section -->
+      <section class="content-section active" id="dashboard-section">
+        <!-- System Overview Cards -->
+        <div class="overview-cards-grid">
+          <div class="overview-mini-card" id="system-status-card">
+            <div class="overview-mini-content">
+              <div class="overview-mini-label">System Status</div>
+              <div class="overview-mini-value" id="system-status-mini">
+                Operational
+              </div>
+            </div>
+            <div class="overview-mini-icon" id="system-status-icon">
+              <i class="fas fa-check-circle"></i>
+            </div>
+          </div>
+
+          <div class="overview-mini-card">
+            <div class="overview-mini-content">
+              <div class="overview-mini-label">Uptime</div>
+              <div class="overview-mini-value value-cyan" id="system-uptime">
+                Loading...
+              </div>
+            </div>
+            <div class="overview-mini-icon gradient-cyan">
+              <i class="fas fa-clock"></i>
+            </div>
+          </div>
+
+          <div class="overview-mini-card">
+            <div class="overview-mini-content">
+              <div class="overview-mini-label">Storage Used</div>
+              <div class="overview-mini-value value-orange" id="storage-used">
+                Loading...
+              </div>
+            </div>
+            <div class="overview-mini-icon gradient-orange">
+              <i class="fas fa-hdd"></i>
+            </div>
+          </div>
+
+          <div class="overview-mini-card">
+            <div class="overview-mini-content">
+              <div class="overview-mini-label">Upload Rate</div>
+              <div class="overview-mini-value value-indigo" id="current-rate">
+                0.00 MB/s
+              </div>
+              <div class="overview-mini-subtitle" id="rate-limit">
+                <i class="fas fa-gauge-high"></i> Limit: 30 MB/s per transfer
+              </div>
+            </div>
+            <div class="overview-mini-icon gradient-indigo">
+              <i class="fas fa-tachometer-alt"></i>
+            </div>
+          </div>
+
+          <div class="overview-mini-card">
+            <div class="overview-mini-content">
+              <div class="overview-mini-label">Active Transfers</div>
+              <div class="overview-mini-value value-purple" id="active-count">
+                0
+              </div>
+              <div class="overview-mini-subtitle" id="active-max">
+                <i class="fas fa-layer-group"></i> Max: 2
+              </div>
+            </div>
+            <div class="overview-mini-icon gradient-purple">
+              <i class="fas fa-exchange-alt"></i>
+            </div>
+          </div>
+
+          <div class="overview-mini-card">
+            <div class="overview-mini-content">
+              <div class="overview-mini-label">Files in Queue</div>
+              <div class="overview-mini-value value-blue" id="queue-count">
+                0
+              </div>
+              <div class="overview-mini-subtitle" id="queue-total">
+                <i class="fas fa-weight-hanging"></i> Total: 0 GB
+              </div>
+            </div>
+            <div class="overview-mini-icon gradient-blue">
+              <i class="fas fa-list"></i>
+            </div>
+          </div>
+
+          <div class="overview-mini-card">
+            <div class="overview-mini-content">
+              <div class="overview-mini-label">Completed Today</div>
+              <div class="overview-mini-value value-green" id="completed-count">
+                0
+              </div>
+              <div class="overview-mini-subtitle" id="completed-total">
+                <i class="fas fa-chart-line"></i> Total: 0 GB
+              </div>
+            </div>
+            <div class="overview-mini-icon gradient-green">
+              <i class="fas fa-check-circle"></i>
+            </div>
+          </div>
+        </div>
+
+        <!-- Dashboard Tables -->
+
+        <!-- Latest Active Uploads Table -->
+        <div class="card">
+          <div class="card-header">
+            <div class="card-title">
+              <i class="fas fa-upload"></i>
+              Active Uploads
+            </div>
+            <a href="#uploads" class="card-action-link" data-section="uploads">
+              View All <i class="fas fa-arrow-right"></i>
+            </a>
+          </div>
+          <div class="card-body">
+            <div class="table-responsive">
+              <table class="table" id="dashboard-active-table">
+                <thead>
+                  <tr>
+                    <th>Filename</th>
+                    <th>Folder</th>
+                    <th>Directory</th>
+                    <th>Key</th>
+                    <th>Progress</th>
+                    <th>Filesize</th>
+                    <th>Time Left</th>
+                    <th>Speed</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  <tr>
+                    <td colspan="8" class="text-center">
+                      <i class="fas fa-circle-notch fa-spin"></i> Loading...
+                    </td>
+                  </tr>
+                </tbody>
+              </table>
+            </div>
+          </div>
+        </div>
+
+        <!-- Latest Queue Table -->
+        <div class="card">
+          <div class="card-header">
+            <div class="card-title">
+              <i class="fas fa-list"></i>
+              Latest Queue
+            </div>
+            <a href="#queue" class="card-action-link" data-section="queue">
+              View All <i class="fas fa-arrow-right"></i>
             </a>
-            <div id="info_badges" class="d-inline-flex mt-2 mt-md-0 ms-md-auto">
-                <div id="download_rate">
-                    <span class="badge bg-light text-dark">0</span>
+          </div>
+          <div class="card-body">
+            <div class="table-responsive">
+              <table class="table" id="dashboard-queue-table">
+                <thead>
+                  <tr>
+                    <th>#</th>
+                    <th>Filename</th>
+                    <th>Folder</th>
+                    <th>Directory</th>
+                    <th>Filesize</th>
+                    <th>Added</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  <tr>
+                    <td colspan="6" class="text-center">
+                      <i class="fas fa-circle-notch fa-spin"></i> Loading...
+                    </td>
+                  </tr>
+                </tbody>
+              </table>
+            </div>
+          </div>
+        </div>
+
+        <!-- Latest History Table -->
+        <div class="card">
+          <div class="card-header">
+            <div class="card-title">
+              <i class="fas fa-history"></i>
+              Recent History
+            </div>
+            <a href="#history" class="card-action-link" data-section="history">
+              View All <i class="fas fa-arrow-right"></i>
+            </a>
+          </div>
+          <div class="card-body">
+            <div class="table-responsive">
+              <table class="table" id="dashboard-history-table">
+                <thead>
+                  <tr>
+                    <th>Filename</th>
+                    <th>Folder</th>
+                    <th>Directory</th>
+                    <th>Key</th>
+                    <th>Filesize</th>
+                    <th>Time spent</th>
+                    <th>Uploaded</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  <tr>
+                    <td colspan="7" class="text-center">
+                      <i class="fas fa-circle-notch fa-spin"></i> Loading...
+                    </td>
+                  </tr>
+                </tbody>
+              </table>
+            </div>
+          </div>
+        </div>
+      </section>
+
+      <!-- Active Uploads Section -->
+      <section class="content-section" id="uploads-section">
+        <div class="card uploads-card">
+          <div class="card-header">
+            <div class="card-title">
+              <i class="fas fa-upload"></i>
+              Active Uploads
+            </div>
+            <div class="card-actions">
+              <span class="active-uploads-badge">
+                <i class="fas fa-arrow-up"></i>
+                <span id="active-count-badge">0</span> active
+              </span>
+            </div>
+          </div>
+          <div class="card-body">
+            <div class="table-responsive" id="no-more-tables">
+              <table id="uploadsTable" class="table">
+                <thead>
+                  <tr>
+                    <th scope="col" data-title="Filename">Filename</th>
+                    <th
+                      scope="col"
+                      data-title="Folder"
+                      class="d-none d-lg-table-cell"
+                    >
+                      Folder
+                    </th>
+                    <th
+                      scope="col"
+                      data-title="Directory"
+                      class="d-none d-lg-table-cell"
+                    >
+                      Directory
+                    </th>
+                    <th
+                      scope="col"
+                      data-title="Key"
+                      class="d-none d-lg-table-cell"
+                    >
+                      Key
+                    </th>
+                    <th scope="col" data-title="Progress">Progress</th>
+                    <th
+                      scope="col"
+                      data-title="Filesize"
+                      class="d-none d-lg-table-cell"
+                    >
+                      Filesize
+                    </th>
+                    <th scope="col" data-title="Time Left">Time Left</th>
+                    <th scope="col" data-title="Speed">Speed</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  <tr>
+                    <td colspan="8" class="no-uploads-message text-center">
+                      No uploads in progress
+                    </td>
+                  </tr>
+                </tbody>
+              </table>
+            </div>
+          </div>
+        </div>
+
+        <template id="upload-row-template">
+          <tr>
+            <td data-title="Filename" class="truncate file-name">
+              filename.mkv
+            </td>
+            <td data-title="Folder" class="d-none d-lg-table-cell folder-name">
+              movies
+            </td>
+            <td
+              data-title="Directory"
+              class="d-none d-lg-table-cell truncate directory-name"
+            >
+              path/to/file
+            </td>
+            <td data-title="Key" class="d-none d-lg-table-cell key-name">
+              GDSA1
+            </td>
+            <td data-title="Progress">
+              <div class="progress-container">
+                <div class="progress-info">
+                  <span class="progress-percentage">45%</span>
                 </div>
-                <div id="control">
-                    <span class="badge bg-success text-dark"><i class="fa-solid fa-play"></i></span>
+                <div class="progress">
+                  <div
+                    class="progress-bar bg-success"
+                    role="progressbar"
+                    style="width: 45%"
+                    aria-valuenow="45"
+                    aria-valuemin="0"
+                    aria-valuemax="100"
+                  ></div>
                 </div>
+              </div>
+            </td>
+            <td data-title="Filesize" class="d-none d-lg-table-cell file-size">
+              4.7 GB
+            </td>
+            <td data-title="Time Left">
+              <span class="time-remaining">3m 24s</span>
+            </td>
+            <td data-title="Speed">
+              <span class="upload-speed"
+                ><i class="fas fa-tachometer-alt"></i> 24MB/s</span
+              >
+            </td>
+          </tr>
+        </template>
+      </section>
+
+      <!-- Queue Section -->
+      <section class="content-section" id="queue-section">
+        <div class="card">
+          <div class="card-header">
+            <div class="card-title">
+              <i class="fas fa-list"></i>
+              Upload Queue
             </div>
+            <div class="card-actions">
+              <span class="active-uploads-badge">
+                <i class="fas fa-inbox"></i>
+                <span id="queue-count-badge">0</span> in queue
+              </span>
+            </div>
+          </div>
+          <div class="card-body">
+            <div class="table-responsive">
+              <table id="queueTable" class="table">
+                <thead>
+                  <tr>
+                    <th scope="col" data-title="#">#</th>
+                    <th scope="col" data-title="Filename">Filename</th>
+                    <th
+                      scope="col"
+                      data-title="Folder"
+                      class="d-none d-lg-table-cell"
+                    >
+                      Folder
+                    </th>
+                    <th
+                      scope="col"
+                      data-title="Directory"
+                      class="d-none d-lg-table-cell"
+                    >
+                      Directory
+                    </th>
+                    <th
+                      scope="col"
+                      data-title="Filesize"
+                      class="d-none d-lg-table-cell"
+                    >
+                      Filesize
+                    </th>
+                    <th scope="col" data-title="Added">Added</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  <tr>
+                    <td colspan="6" class="no-uploads-message text-center">
+                      No files in queue
+                    </td>
+                  </tr>
+                </tbody>
+              </table>
+            </div>
+          </div>
         </div>
-    </header>
-
-    <main>
-        <div class="row">
-            <div class="pricing-header p-3 pb-md-4 mx-auto text-start">
-                <p class="h5 fw-normal">In Progress</p>
-            </div>
-            <div class="col col-12">
-                <div class="table-responsive" id="no-more-tables">
-                    <table id="uploadsTable" class="table table-sm">
-                        <thead class="table-primary">
-                        <tr>
-                            <td>Filename</td>
-                            <td class="d-none d-lg-table-cell">Folder</td>
-                            <td class="d-none d-lg-table-cell">Key</td>
-                            <td>Progress bar</td>
-                            <td class="d-none d-lg-table-cell">Filesize</td>
-                            <td class="tl-w-20 text-end">Time Left</td>
-                        </tr>
-                        </thead>
-                        <tbody>
-                        <tr>
-                            <td class="text-muted" colspan="6">No entries found.</td>
-                        </tr>
-                        </tbody>
-                    </table>
-                </div>
+      </section>
+      <section class="content-section" id="history-section">
+        <div class="card">
+          <div class="card-header">
+            <div class="card-title">
+              <i class="fas fa-check-circle"></i>
+              Completed Uploads
+            </div>
+            <div class="card-actions">
+              <span id="clnHist" class="action-button">
+                <i class="fas fa-trash-alt"></i>
+                Clear History
+              </span>
             </div>
+          </div>
+          <div class="card-body">
+            <input
+              type="checkbox"
+              style="display: none"
+              id="prettyEndTime"
+              name="prettyEndTime"
+            />
+            <div class="table-responsive">
+              <table id="completedTable" class="table">
+                <thead>
+                  <tr>
+                    <th scope="col" data-title="Filename">Filename</th>
+                    <th scope="col" data-title="Folder">Folder</th>
+                    <th scope="col" data-title="Directory">Directory</th>
+                    <th scope="col" data-title="Key">Key</th>
+                    <th scope="col" data-title="Filesize">Filesize</th>
+                    <th scope="col" data-title="Time spent">Time spent</th>
+                    <th scope="col" data-title="Uploaded">
+                      Uploaded
+                      <i
+                        class="fa-solid fa-hourglass-end toggle-time-format"
+                        title="Toggle time format"
+                        aria-label="Toggle time format"
+                        onclick="$('#prettyEndTime').click();"
+                      ></i>
+                    </th>
+                  </tr>
+                </thead>
+                <tbody>
+                  <tr>
+                    <td colspan="7" class="no-uploads-message text-center">
+                      No completed uploads
+                    </td>
+                  </tr>
+                </tbody>
+                <tfoot>
+                  <tr>
+                    <td colspan="6">
+                      <div class="pagination-container">
+                        <div id="page"></div>
+                        <nav aria-label="Page size selection">
+                          <ul id="pageSize" class="pagination pagination-sm">
+                            <li class="page-item">
+                              <a
+                                class="page-link"
+                                href="#"
+                                aria-label="Show 5 items per page"
+                                >5</a
+                              >
+                            </li>
+                            <li class="page-item active">
+                              <a
+                                class="page-link"
+                                href="#"
+                                aria-label="Show 10 items per page"
+                                >10</a
+                              >
+                            </li>
+                            <li class="page-item">
+                              <a
+                                class="page-link"
+                                href="#"
+                                aria-label="Show 25 items per page"
+                                >25</a
+                              >
+                            </li>
+                            <li class="page-item">
+                              <a
+                                class="page-link"
+                                href="#"
+                                aria-label="Show 50 items per page"
+                                >50</a
+                              >
+                            </li>
+                          </ul>
+                        </nav>
+                      </div>
+                    </td>
+                  </tr>
+                </tfoot>
+              </table>
+            </div>
+          </div>
         </div>
-        <div class="row">
-            <div class="p-3 pb-md-4 mx-auto text-start d-inline-flex justify-content-between">
-                <span class="h5 fw-normal">Completed</span>
-            </div>
-            <div class="col col-12">
-                <div class="table-responsive">
-                    <input type="checkbox" style="display:none" id="prettyEndTime" name="prettyEndTime" />
-                    <table id="completedTable" class="table table-sm">
-                        <thead class="table-primary table-sm">
-                        <tr>
-                            <td>Filename</td>
-                            <td>Folder</td>
-                            <td>Key</td>
-                            <td>Filesize</td>
-                            <td>Time spent</td>
-                            <td>Uploaded <i class="fa-solid fa-hourglass-end" style="cursor: pointer" onclick="$('#prettyEndTime').click();"></i></td>
-                        </tr>
-                        </thead>
-                        <tbody>
-                        <tr><td class="text-muted" colspan="6">No entries found.</td></tr>
-                        </tbody>
-                        <tfoot>
-                        <tr>
-                            <td colspan="6">
-                                <div class="w-100 d-inline-flex justify-content-between">
-                                <div id="page"></div>
-                                <span id="clnHist">Clear History</span>
-                                <nav aria-label="Page navigation">
-                                    <ul id="pageSize" class="pagination pagination-sm" style="float:right">
-                                        <li class="page-item"><a class="page-link" href="#">5</a></li>
-                                        <li class="page-item active"><a class="page-link" href="#">10</a></li>
-                                        <li class="page-item"><a class="page-link" href="#">25</a></li>
-                                        <li class="page-item"><a class="page-link" href="#">50</a></li>
-                                    </ul>
-                                </nav>
-                                </div>
-                            </td>
-                        </tr>
-                        </tr>
-                        </tfoot>
-                    </table>
+      </section>
+
+      <!-- Settings Section -->
+      <section class="content-section" id="settings-section">
+        <form class="unified-settings-form" id="unified-settings-form">
+          <!-- Save Button at Top -->
+          <div class="settings-save-container settings-save-top">
+            <button type="submit" class="btn btn-save-all">
+              <i class="fas fa-save"></i>
+              Save All Settings
+            </button>
+            <span
+              class="auto-save-indicator"
+              style="
+                margin-left: 1rem;
+                color: var(--text-secondary);
+                display: none;
+              "
+            >
+              <i class="fas fa-check-circle"></i> Auto-saved
+            </span>
+          </div>
+          <div class="settings-grid">
+            <!-- Transfer Settings -->
+            <div class="card">
+              <div class="card-header">
+                <div class="card-title">
+                  <i class="fas fa-exchange-alt"></i>
+                  Transfer Settings
+                </div>
+              </div>
+              <div class="card-body">
+                <div class="form-group">
+                  <label for="bandwidth_limit">Bandwidth Limit (MB/s)</label>
+                  <input
+                    type="text"
+                    id="bandwidth_limit"
+                    name="bandwidth_limit"
+                    class="form-control"
+                    value="30"
+                  />
                 </div>
+                <div class="form-group">
+                  <label for="transfers">Max Transfers</label>
+                  <input
+                    type="number"
+                    id="transfers"
+                    name="transfers"
+                    class="form-control"
+                    value="2"
+                    min="1"
+                    max="10"
+                  />
+                </div>
+                <div class="form-group">
+                  <label for="min_age_upload">Min Age Upload (minutes)</label>
+                  <input
+                    type="number"
+                    id="min_age_upload"
+                    name="min_age_upload"
+                    class="form-control"
+                    value="0"
+                    min="0"
+                  />
+                </div>
+                <div class="form-group">
+                  <label for="folder_depth">Folder Depth</label>
+                  <input
+                    type="number"
+                    id="folder_depth"
+                    name="folder_depth"
+                    class="form-control"
+                    value="1"
+                    min="1"
+                  />
+                </div>
+              </div>
             </div>
+
+            <!-- Notification Settings -->
+            <div class="card">
+              <div class="card-header">
+                <div class="card-title">
+                  <i class="fas fa-bell"></i>
+                  Notifications
+                </div>
+              </div>
+              <div class="card-body">
+                <div class="form-group">
+                  <label for="notification_level">Notification Level</label>
+                  <select
+                    id="notification_level"
+                    name="notification_level"
+                    class="form-control"
+                  >
+                    <option value="ALL" selected>ALL</option>
+                    <option value="ERROR">ERROR</option>
+                    <option value="NONE">NONE</option>
+                  </select>
+                </div>
+                <div class="form-group">
+                  <label for="notification_servername">Server Name</label>
+                  <input
+                    type="text"
+                    id="notification_servername"
+                    name="notification_servername"
+                    class="form-control"
+                    value="Drive-Upload"
+                  />
+                </div>
+                <div class="form-group">
+                  <label for="notification_url">Notification URL</label>
+                  <input
+                    type="text"
+                    id="notification_url"
+                    name="notification_url"
+                    class="form-control"
+                    placeholder="discord://webhook-url"
+                  />
+                </div>
+              </div>
+            </div>
+
+            <!-- System Settings -->
+            <div class="card">
+              <div class="card-header">
+                <div class="card-title">
+                  <i class="fas fa-cogs"></i>
+                  System
+                </div>
+              </div>
+              <div class="card-body">
+                <div class="form-group">
+                  <label for="log_level">Log Level</label>
+                  <select id="log_level" name="log_level" class="form-control">
+                    <option value="INFO" selected>INFO</option>
+                    <option value="DEBUG">DEBUG</option>
+                    <option value="WARNING">WARNING</option>
+                    <option value="ERROR">ERROR</option>
+                  </select>
+                </div>
+                <div class="form-group">
+                  <label for="log_entry">Log Entry Count</label>
+                  <input
+                    type="number"
+                    id="log_entry"
+                    name="log_entry"
+                    class="form-control"
+                    value="1000"
+                    min="100"
+                  />
+                </div>
+                <div class="form-group toggle-group">
+                  <label for="vfs_refresh_enable">VFS Refresh</label>
+                  <label class="toggle-switch">
+                    <input
+                      type="checkbox"
+                      id="vfs_refresh_enable"
+                      name="vfs_refresh_enable"
+                      checked
+                    />
+                    <span class="toggle-slider"></span>
+                  </label>
+                </div>
+                <div class="form-group">
+                  <label for="language">Language</label>
+                  <select id="language" name="language" class="form-control">
+                    <option value="en" selected>English</option>
+                    <option value="de">German</option>
+                  </select>
+                </div>
+              </div>
+            </div>
+
+            <!-- AutoScan Settings -->
+            <div class="card">
+              <div class="card-header">
+                <div class="card-title">
+                  <i class="fas fa-search"></i>
+                  AutoScan
+                </div>
+              </div>
+              <div class="card-body">
+                <div class="form-group">
+                  <label for="autoscan_url">AutoScan URL</label>
+                  <input
+                    type="text"
+                    id="autoscan_url"
+                    name="autoscan_url"
+                    class="form-control"
+                    placeholder="http://autoscan:3030"
+                  />
+                </div>
+                <div class="form-group">
+                  <label for="autoscan_user">AutoScan Username</label>
+                  <input
+                    type="text"
+                    id="autoscan_user"
+                    name="autoscan_user"
+                    class="form-control"
+                    placeholder="username (leave empty for none)"
+                  />
+                </div>
+                <div class="form-group">
+                  <label for="autoscan_pass">AutoScan Password</label>
+                  <input
+                    type="password"
+                    id="autoscan_pass"
+                    name="autoscan_pass"
+                    class="form-control"
+                    placeholder="password (leave empty for none)"
+                  />
+                </div>
+              </div>
+            </div>
+
+            <!-- Security Settings -->
+            <div class="card">
+              <div class="card-header">
+                <div class="card-title">
+                  <i class="fas fa-shield-alt"></i>
+                  Security
+                </div>
+              </div>
+              <div class="card-body">
+                <div class="form-group">
+                  <label for="hashpassword">Hash Password</label>
+                  <select
+                    id="hashpassword"
+                    name="hashpassword"
+                    class="form-control"
+                  >
+                    <option value="hashed" selected>Hashed</option>
+                    <option value="plain">Plain</option>
+                  </select>
+                </div>
+                <div class="form-group">
+                  <label for="gdsa_name">GDSA Name</label>
+                  <input
+                    type="text"
+                    id="gdsa_name"
+                    name="gdsa_name"
+                    class="form-control"
+                    value="encrypt"
+                  />
+                </div>
+                <div class="form-group">
+                  <label for="db_name">DB Name</label>
+                  <input
+                    type="text"
+                    id="db_name"
+                    name="db_name"
+                    class="form-control"
+                    value="encrypt"
+                  />
+                </div>
+                <div class="form-group toggle-group">
+                  <label for="db_team">DB Team</label>
+                  <label class="toggle-switch">
+                    <input
+                      type="checkbox"
+                      id="db_team"
+                      name="db_team"
+                      checked
+                    />
+                    <span class="toggle-slider"></span>
+                  </label>
+                </div>
+              </div>
+            </div>
+          </div>
+        </form>
+      </section>
+
+      <!-- About Section -->
+      <section class="content-section" id="about-section">
+        <div class="card">
+          <div class="card-header">
+            <div class="card-title">
+              <i class="fas fa-info-circle"></i>
+              About Docker Uploader
+            </div>
+          </div>
+          <div class="card-body">
+            <div style="max-width: 800px; margin: 0 auto">
+              <div style="text-align: center; margin-bottom: 2rem">
+                <img
+                  src="logo.png"
+                  alt="Docker Uploader Logo"
+                  style="width: 120px; height: 120px; margin-bottom: 1rem"
+                />
+                <h2 style="font-size: 2rem; margin-bottom: 0.5rem">
+                  Docker Uploader
+                </h2>
+                <p
+                  style="color: var(--accent-color); font-weight: 600"
+                  id="about-version"
+                >
+                  Version 5.0.0
+                </p>
+              </div>
+
+              <div style="margin-bottom: 2rem">
+                <h3
+                  style="
+                    font-size: 1.25rem;
+                    margin-bottom: 1rem;
+                    color: var(--accent-color);
+                  "
+                >
+                  Description
+                </h3>
+                <p style="line-height: 1.8; color: var(--text-secondary)">
+                  Docker Uploader is a powerful and efficient file upload
+                  management system designed to run in Docker containers. It
+                  provides a modern web interface for monitoring and controlling
+                  file uploads with features like bandwidth management,
+                  concurrent transfer control, and real-time progress tracking.
+                </p>
+              </div>
+
+              <div style="margin-bottom: 2rem">
+                <h3
+                  style="
+                    font-size: 1.25rem;
+                    margin-bottom: 1rem;
+                    color: var(--accent-color);
+                  "
+                >
+                  Key Features
+                </h3>
+                <ul
+                  style="
+                    line-height: 2;
+                    color: var(--text-secondary);
+                    list-style-position: inside;
+                  "
+                >
+                  <li>Real-time upload monitoring and progress tracking</li>
+                  <li>Bandwidth limiting and transfer management</li>
+                  <li>Multiple concurrent upload support</li>
+                  <li>Complete upload history with statistics</li>
+                  <li>Pause and resume functionality</li>
+                  <li>17 beautiful theme options</li>
+                  <li>Responsive design for mobile and desktop</li>
+                  <li>Docker containerized deployment</li>
+                </ul>
+              </div>
+
+              <div style="margin-bottom: 2rem">
+                <h3
+                  style="
+                    font-size: 1.25rem;
+                    margin-bottom: 1rem;
+                    color: var(--accent-color);
+                  "
+                >
+                  Technology Stack
+                </h3>
+                <div
+                  style="
+                    display: grid;
+                    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
+                    gap: 1rem;
+                  "
+                >
+                  <div
+                    style="
+                      padding: 1rem;
+                      background: var(--bg-tertiary);
+                      border-radius: var(--radius-md);
+                      text-align: center;
+                    "
+                  >
+                    <i
+                      class="fab fa-docker"
+                      style="
+                        font-size: 2rem;
+                        color: var(--accent-color);
+                        margin-bottom: 0.5rem;
+                      "
+                    ></i>
+                    <p style="font-weight: 600">Docker</p>
+                  </div>
+                  <div
+                    style="
+                      padding: 1rem;
+                      background: var(--bg-tertiary);
+                      border-radius: var(--radius-md);
+                      text-align: center;
+                    "
+                  >
+                    <i
+                      class="fab fa-php"
+                      style="
+                        font-size: 2rem;
+                        color: var(--accent-color);
+                        margin-bottom: 0.5rem;
+                      "
+                    ></i>
+                    <p style="font-weight: 600">PHP</p>
+                  </div>
+                  <div
+                    style="
+                      padding: 1rem;
+                      background: var(--bg-tertiary);
+                      border-radius: var(--radius-md);
+                      text-align: center;
+                    "
+                  >
+                    <i
+                      class="fab fa-js"
+                      style="
+                        font-size: 2rem;
+                        color: var(--accent-color);
+                        margin-bottom: 0.5rem;
+                      "
+                    ></i>
+                    <p style="font-weight: 600">JavaScript</p>
+                  </div>
+                  <div
+                    style="
+                      padding: 1rem;
+                      background: var(--bg-tertiary);
+                      border-radius: var(--radius-md);
+                      text-align: center;
+                    "
+                  >
+                    <i
+                      class="fab fa-html5"
+                      style="
+                        font-size: 2rem;
+                        color: var(--accent-color);
+                        margin-bottom: 0.5rem;
+                      "
+                    ></i>
+                    <p style="font-weight: 600">HTML5/CSS3</p>
+                  </div>
+                </div>
+              </div>
+
+              <div style="margin-bottom: 2rem">
+                <h3
+                  style="
+                    font-size: 1.25rem;
+                    margin-bottom: 1rem;
+                    color: var(--accent-color);
+                  "
+                >
+                  Links & Resources
+                </h3>
+                <div style="display: flex; gap: 1rem; flex-wrap: wrap">
+                  <a
+                    href="https://github.com/dockserver"
+                    target="_blank"
+                    class="action-button"
+                    style="text-decoration: none"
+                  >
+                    <i class="fab fa-github"></i>
+                    GitHub Repository
+                  </a>
+                  <a
+                    href="https://dockserver.io"
+                    target="_blank"
+                    class="action-button"
+                    style="text-decoration: none"
+                  >
+                    <i class="fas fa-globe"></i>
+                    Official Website
+                  </a>
+                  <a
+                    href="https://github.com/dockserver/docker-uploader/issues"
+                    target="_blank"
+                    class="action-button"
+                    style="text-decoration: none"
+                  >
+                    <i class="fas fa-bug"></i>
+                    Report Issue
+                  </a>
+                  <a
+                    href="https://github.com/cyb3rgh05t/docker-uploader/blob/main/CHANGELOG.md"
+                    target="_blank"
+                    class="action-button"
+                    style="text-decoration: none"
+                  >
+                    <i class="fas fa-list-ul"></i>
+                    Changelog
+                  </a>
+                </div>
+              </div>
+
+              <div
+                style="
+                  text-align: center;
+                  padding-top: 2rem;
+                  border-top: 1px solid var(--border-color);
+                "
+              >
+                <p style="color: var(--text-secondary); margin-bottom: 1rem">
+                  <i class="fa-brands fa-github"></i>
+                  <a
+                    href="https://github.com/dockserver"
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    style="color: var(--accent-color)"
+                  >
+                    dockserver GitHub
+                  </a>
+                  |
+                  <i class="fa-brands fa-wikipedia-w"></i>
+                  <a
+                    href="https://dockserver.io"
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    style="color: var(--accent-color)"
+                  >
+                    dockserver wiki
+                  </a>
+                </p>
+                <p style="color: var(--text-tertiary); font-size: 0.875rem">
+                  Copyrights <sup>&copy; &trade;</sup> 2021<span
+                    id="copyright-year-range"
+                  ></span>
+                  <script>
+                    (function () {
+                      var yearSpan = document.getElementById(
+                        "copyright-year-range"
+                      );
+                      if (yearSpan) {
+                        yearSpan.textContent = " - " + new Date().getFullYear();
+                      }
+                    })();
+                  </script>
+                  Developed with
+                  <i
+                    class="fas fa-heart"
+                    style="color: var(--accent-color)"
+                  ></i>
+                  by dockserver.io
+                </p>
+              </div>
+            </div>
+          </div>
         </div>
-        <div class="inb">
-          <center>
-            <p>GitHub : <i class="fa-brands fa-github"></i><a href="https://github.com/dockserver" ­target="_blank"­ rel=”noopener noreferrer”> dockserver GitHub</a></p>
-            <p>Docs : <i class="fa-brands fa-wikipedia-w"></i><a href="https://dockserver.io" ­target="_blank"­ rel=”noopener noreferrer”> dockserver wiki</a></p>
-            <p>Copyrights <sup>&copy; &trade;</sup> - 2021 <script>new Date().getFullYear()>2000&&document.write(" - "+new Date().getFullYear());</script> Developed with <i class="fas fa-heart" style="color: red;"></i> by dockserver.io</p>
-          </center>
-        </div>
+      </section>
     </main>
-</div>
-
-<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.10.2/dist/umd/popper.min.js"
-        integrity="sha384-7+zCNj/IqJ95wo16oMtfsKbZ9ccEh31eOz1HGyDuCQ6wgnyJNSYdrPa03rtR1zdB"
-        crossorigin="anonymous">
-</script>
-<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.min.js"
-        integrity="sha384-QJHtvGhmr9XOIpI6YVutG+2QOK9T+ZnN4kzFN1RtK3zEFEIsxhlmWl5/YESvpZ13"
-        crossorigin="anonymous">
-</script>
-<script src="https://code.jquery.com/jquery-3.6.0.min.js"
-        integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
-        crossorigin="anonymous">
-</script>
-<script src="js/ui/pagination.js"></script>
-<script src="js/app.js"></script>
-</body>
+
+    <!-- Status Message -->
+    <div
+      class="status-message"
+      id="status-message"
+      role="alert"
+      aria-live="polite"
+    ></div>
+
+    <!-- Scripts -->
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
+    <script src="js/ui/pagination.js?v=4.2.8"></script>
+    <script src="js/utils.js?v=4.2.8"></script>
+    <script src="js/app.js?v=4.2.8"></script>
+
+    <script>
+      $(document).ready(function () {
+        // Mobile menu toggle
+        $("#mobile-menu-toggle").on("click", function () {
+          $("#sidebar").toggleClass("active");
+          $("body").toggleClass("sidebar-open");
+        });
+
+        // Sidebar navigation
+        $(".nav-item").on("click", function (e) {
+          e.preventDefault();
+          const section = $(this).data("section");
+
+          // Update active nav item
+          $(".nav-item").removeClass("active");
+          $(this).addClass("active");
+
+          // Show corresponding section
+          $(".content-section").removeClass("active");
+          $(`#${section}-section`).addClass("active");
+
+          // Update page title
+          const title = $(this).find("span").text();
+          $("#page-title").text(title);
+
+          // Close mobile menu
+          $("#sidebar").removeClass("active");
+          $("body").removeClass("sidebar-open");
+        });
+
+        // Dashboard "View All" links
+        $(".card-action-link").on("click", function (e) {
+          e.preventDefault();
+          const section = $(this).data("section");
+          $(`.nav-item[data-section='${section}']`).click();
+        });
+
+        // Theme dropdown toggle
+        $("#theme-toggle-btn").on("click", function (e) {
+          e.stopPropagation();
+          $("#theme-dropdown-menu").toggleClass("active");
+        });
+
+        // Close dropdown when clicking outside
+        $(document).on("click", function (e) {
+          if (!$(e.target).closest(".theme-dropdown").length) {
+            $("#theme-dropdown-menu").removeClass("active");
+          }
+        });
+
+        // Theme switching from dropdown
+        $(".theme-dropdown-item").on("click", function () {
+          const theme = $(this).data("theme");
+          console.log("Applying theme:", theme);
+
+          document.documentElement.setAttribute("data-theme", theme);
+          document.body.setAttribute("data-theme", theme);
+
+          $(".theme-dropdown-item").removeClass("active");
+          $(this).addClass("active");
+
+          try {
+            localStorage.setItem("uploader_theme", JSON.stringify(theme));
+          } catch (error) {
+            console.error("Failed to save theme:", error);
+          }
+
+          // Close dropdown
+          $("#theme-dropdown-menu").removeClass("active");
+        });
+
+        // Load saved theme
+        try {
+          const savedTheme = localStorage.getItem("uploader_theme");
+          if (savedTheme) {
+            const theme = JSON.parse(savedTheme);
+            console.log("Loading saved theme:", theme);
+
+            document.documentElement.setAttribute("data-theme", theme);
+            document.body.setAttribute("data-theme", theme);
+
+            $(`.theme-dropdown-item[data-theme="${theme}"]`).addClass("active");
+          } else {
+            // Set default dark theme as active
+            $(`.theme-dropdown-item[data-theme="dark"]`).addClass("active");
+          }
+        } catch (error) {
+          console.error("Error loading theme:", error);
+          $(`.theme-dropdown-item[data-theme="dark"]`).addClass("active");
+        }
+      });
+    </script>
+  </body>
 </html>
diff --git a/apps/docker-uploader/root/var/www/html/js/app.js b/apps/docker-uploader/root/var/www/html/js/app.js
index bab065811e..415515816f 100755
--- a/apps/docker-uploader/root/var/www/html/js/app.js
+++ b/apps/docker-uploader/root/var/www/html/js/app.js
@@ -1,160 +1,1572 @@
+/**
+ * Main application JavaScript for the Uploader Dashboard
+ *
+ * Note: Common utility functions have been moved to utils.js
+ * This file now focuses on application-specific functionality
+ */
+
+// Store global data
+const uploaderApp = {
+  activePage: 1,
+  pageSize: 10,
+  completedTodayCount: 0,
+  completedTodaySize: 0,
+  // Store env settings loaded from the API
+  envSettings: {},
+  // Interval IDs for periodic updates
+  intervals: {
+    inProgress: null,
+    completed: null,
+    stats: null,
+    queue: null,
+  },
+};
+
+// Update the document ready function to hide the upload history chart
 $(document).ready(function () {
-    function handleInProgressJobs() {
-        $.getJSON("srv/api/jobs/inprogress.php", function (json) {
-            inProgressTableBody = $('#uploadsTable > tbody');
+  // Hide the upload history card as it's not needed
+  $(".card:has(#upload-history-chart)").hide();
 
-            totalDownloadRate = 0;
-            downloadRateType = null;
+  // Initialize the app
+  initializeApp();
 
-            inProgressTableBody.empty();
-            if (json.jobs === null || json.jobs.length === 0) {
-                inProgressTableBody.append('<tr><td class="text-muted" colspan="6">No entries found.</td></tr>');
-                return;
-            }
-            $.each(json.jobs, function (job, data) {
-                inProgressTableBody.append(`<tr><td class="truncate">${data.file_name}</td><td class="d-none d-lg-table-cell">${data.drive}</td><td class="d-none d-lg-table-cell">${data.gdsa}</td>
-                        <td>
-                            <div class="progress">
-                                <div class="progress-bar bg-secondary bg-gradient text-light" role="progressbar"
-                                     style="width: ${data.upload_percentage};" aria-valuenow="${data.upload_percentage}" aria-valuemin="0" aria-valuemax="100">${data.upload_percentage}
-                                </div>
-                            </div>
-                        </td>
-                        <td class="d-none d-lg-table-cell">${data.file_size}</td><td class="text-end">${data.upload_remainingtime} (with ${data.upload_speed})</td></tr>`)
-
-                if (data.upload_speed != null) {
-                    var rateMatches = data.upload_speed.match(/([0-9+\.]+)([MKG])/);
-                    totalDownloadRate += Number(rateMatches[1]);
-                }
-            });
-
-            $('#download_rate').empty();
-            totalDownloadRate = totalDownloadRate.toFixed(2);
-            if (totalDownloadRate < 5) {
-                $('#download_rate').append(`<span class="badge bg-danger text-dark">${totalDownloadRate}</span>`)
-            } else if (totalDownloadRate < 10) {
-                $('#download_rate').append(`<span class="badge bg-warning text-dark">${totalDownloadRate}</span>`)
-            } else {
-                $('#download_rate').append(`<span class="badge bg-success text-dark">${totalDownloadRate}</span>`)
-            }
+  // Load current theme from localStorage or use default
+  initializeTheme();
+
+  // Setup event listeners
+  setupEventListeners();
+
+  // Start periodic updates
+  startPeriodicUpdates();
+
+  // Toggle prettyEndTime checkbox to use relative time by default
+  if ($("#prettyEndTime").is(":checked")) {
+    $("#prettyEndTime").prop("checked", false);
+  }
+});
+
+/**
+ * Initialize the application
+ */
+function initializeApp() {
+  // Load environment settings
+  loadEnvSettings();
+  loadAppVersion();
+  // Initial data fetching
+  handleInProgressJobs();
+  handleCompletedJobList();
+  handleQueueList();
+  checkStatus();
+  updateRealTimeStats();
+  // Load dashboard recent activity
+  loadDashboardActivity();
+}
+
+/**
+ * Load the application version
+ */
+function loadAppVersion() {
+  let currentVersion = null;
+
+  // Try dedicated API endpoint first
+  fetch("srv/api/system/version.php")
+    .then((response) => response.json())
+    .then((data) => {
+      if (data && data.version) {
+        currentVersion = data.version;
+        document.getElementById("app-version").textContent = "v" + data.version;
+        console.log("Version loaded from API:", data.version);
+        checkGitHubVersion(currentVersion);
+      }
+    })
+    .catch((error) => {
+      console.log("API version fetch failed, trying direct file");
+
+      // Fallback to direct file access
+      fetch("release.json")
+        .then((response) => response.json())
+        .then((data) => {
+          if (data && data.newversion) {
+            currentVersion = data.newversion;
+            document.getElementById("app-version").textContent =
+              "v" + data.newversion;
+            console.log("Version loaded from file:", data.newversion);
+            checkGitHubVersion(currentVersion);
+          } else {
+            throw new Error("Invalid release.json format");
+          }
+        })
+        .catch((fallbackError) => {
+          console.error("Version fetch failed:", fallbackError);
+          // Set a hardcoded version as last resort
+          currentVersion = "5.0.0";
+          document.getElementById("app-version").textContent =
+            "v" + currentVersion;
+          checkGitHubVersion(currentVersion);
         });
+    });
+}
+
+/**
+ * Check GitHub for latest release version
+ */
+function checkGitHubVersion(currentVersion) {
+  const $statusBadge = $("#version-status");
+
+  fetch(
+    "https://api.github.com/repos/cyb3rgh05t/docker-uploader/releases/latest"
+  )
+    .then((response) => response.json())
+    .then((data) => {
+      if (data && data.tag_name) {
+        const latestVersion = data.tag_name.replace(/^v/, "");
+        const current = currentVersion.replace(/^v/, "");
+
+        console.log(
+          "Current version:",
+          current,
+          "Latest version:",
+          latestVersion
+        );
+
+        const versionComparison = compareVersions(current, latestVersion);
+
+        if (versionComparison < 0) {
+          // Update available
+          $statusBadge.html('<i class="fas fa-arrow-up"></i> Update Available');
+          $statusBadge
+            .removeClass("up-to-date checking develop")
+            .addClass("update-available");
+          $statusBadge.attr("title", `New version ${latestVersion} available`);
+        } else if (versionComparison > 0) {
+          // Development version (ahead of latest release)
+          $statusBadge.html('<i class="fas fa-code-branch"></i> Develop');
+          $statusBadge
+            .removeClass("update-available checking up-to-date")
+            .addClass("develop");
+          $statusBadge.attr(
+            "title",
+            `Development build (ahead of v${latestVersion})`
+          );
+        } else {
+          // Up to date
+          $statusBadge.html('<i class="fas fa-check"></i> Up to Date');
+          $statusBadge
+            .removeClass("update-available checking develop")
+            .addClass("up-to-date");
+          $statusBadge.attr("title", "You are running the latest version");
+        }
+      } else {
+        throw new Error("Invalid GitHub response");
+      }
+    })
+    .catch((error) => {
+      console.error("Failed to check GitHub version:", error);
+      $statusBadge.html('<i class="fas fa-question"></i> Unknown');
+      $statusBadge.removeClass("update-available checking up-to-date");
+      $statusBadge.attr("title", "Unable to check for updates");
+    });
+}
+
+/**
+ * Compare two semantic version strings
+ * Returns: -1 if v1 < v2, 0 if equal, 1 if v1 > v2
+ */
+function compareVersions(v1, v2) {
+  const parts1 = v1.split(".").map(Number);
+  const parts2 = v2.split(".").map(Number);
+
+  for (let i = 0; i < Math.max(parts1.length, parts2.length); i++) {
+    const part1 = parts1[i] || 0;
+    const part2 = parts2[i] || 0;
+
+    if (part1 < part2) return -1;
+    if (part1 > part2) return 1;
+  }
+
+  return 0;
+}
+
+/**
+ * Set up all event listeners
+ */
+function setupEventListeners() {
+  // Sidebar toggle
+  $("#sidebar-toggle").on("click", function () {
+    $("#sidebar").addClass("active");
+    $("#overlay").addClass("active");
+  });
+
+  $("#sidebar-close, #overlay").on("click", function () {
+    $("#sidebar").removeClass("active");
+    $("#overlay").removeClass("active");
+  });
+
+  setupSettingsModal();
+
+  // Theme selection - uses function from utils.js
+  setupThemeEventListeners();
+
+  // Sidebar accordion toggles
+  $(".sidebar-section-header").on("click", function () {
+    const targetId = $(this).data("target");
+    const $content = $("#" + targetId);
+    // Use a more specific selector to target only the chevron icon
+    const $chevronIcon = $(this).find("i.fa-chevron-up, i.fa-chevron-down");
+
+    if ($content.hasClass("active")) {
+      $content.removeClass("active");
+      $chevronIcon.removeClass("fa-chevron-up").addClass("fa-chevron-down");
+      $(this).attr("aria-expanded", "false");
+    } else {
+      $content.addClass("active");
+      $chevronIcon.removeClass("fa-chevron-down").addClass("fa-chevron-up");
+      $(this).attr("aria-expanded", "true");
     }
+  });
 
-    function handleCompletedJobList() {
-        completedTableBody = $('#completedTable > tbody');
-        $('#page').pagination({
-            dataSource: 'srv/api/jobs/completed.php',
-            locator: 'jobs',
-            ulClassName: 'pagination pagination-sm',
-            totalNumberLocator: function (response) {
-                return response.total_count;
-            },
-            pageSize: $('#pageSize > li.page-item.active > a').text() ?? 10,
-            beforePaging: function (e) {
-                // function allows us to en-/disable the refresh if page != 1
-                if (!isNaN(e) && e === 1) {
-                    if (window.completedInterval === undefined) {
-                        window.completedInterval = setInterval(handleCompletedJobList, 5000)
-                    }
-                } else {
-                    clearInterval(window.completedInterval)
-                    window.completedInterval = null;
-                }
-            },
-            callback: function (data, pagination) {
-                $('#page').find('ul').children('li').addClass("page-item");
-                $('#page').find('ul').children('li').children('a').addClass("page-link");
-
-                jobs = data;
-
-                completedTableBody.empty();
-                if (jobs === null || jobs.length === 0) {
-                    completedTableBody.append('<tr><td class="text-muted" colspan="6">No entries found.</td></tr>');
-                    $('#clnHist').hide();
-                    return;
-                }
-                $('#clnHist').show();
-                $.each(jobs, function (job, data) {
-                    var endTime = $('#prettyEndTime').is(':checked') ? data.time_end : data.time_end_clean
-                    var failClass = ' class="table-danger"'
-                    if(data.successful === true) {
-                        failClass = '';
-                    }
-                    completedTableBody.append(`<tr${failClass}><td>${data.file_name}</td><td>${data.drive}</td><td>${data.gdsa}</td><td>${data.file_size}</td><td>${data.time_elapsed ?? 'n/a'}</td><td>${endTime}</td></tr>`);
-                });
-            }
-        })
+  // Form submissions - with improved handling
+  setupFormSubmissions();
+
+  // Setup pause control
+  setupPauseControl();
+
+  // Clear history button
+  $("#clnHist").on("click", function () {
+    $.ajax({
+      type: "POST",
+      url: "srv/api/system/clean_history.php",
+      success: function () {
+        handleCompletedJobList();
+        showStatusMessage("Upload history cleared successfully");
+      },
+      error: function () {
+        showStatusMessage("Failed to clear upload history", true);
+      },
+    });
+  });
+
+  // Toggle time format
+  $("#prettyEndTime").on("click", function () {
+    handleCompletedJobList();
+  });
+
+  // Page size selection
+  $("#pageSize > li.page-item").on("click", function () {
+    $("#pageSize > li.page-item.active").removeClass("active");
+    $(this).addClass("active");
+    uploaderApp.pageSize = parseInt($(this).find("a").text());
+    saveUserSetting("pageSize", uploaderApp.pageSize);
+    handleCompletedJobList();
+  });
+
+  // Chart time range selector
+  $("#chart-timerange").on("change", function () {
+    const timeRange = $(this).val();
+    createMockUploadChart("upload-history-chart", timeRange);
+    saveUserSetting("chartTimeRange", timeRange);
+  });
+}
+
+/**
+ * Settings Modal and Tabbed Interface Functionality
+ */
+function setupSettingsModal() {
+  // Modal open/close
+  $("#settings-toggle").on("click", function () {
+    $("#settings-modal").addClass("active");
+    $("#modal-overlay").addClass("active");
+  });
+
+  $("#modal-close, #modal-overlay").on("click", function () {
+    $("#settings-modal").removeClass("active");
+    $("#modal-overlay").removeClass("active");
+  });
+
+  // Close modal when clicking outside of it
+  $(document).on("click", function (event) {
+    if (
+      $("#settings-modal").hasClass("active") &&
+      !$(event.target).closest(".modal-content").length &&
+      !$(event.target).closest("#settings-toggle").length
+    ) {
+      $("#settings-modal").removeClass("active");
+      $("#modal-overlay").removeClass("active");
     }
+  });
 
-    function checkStatus() {
-        $.getJSON("srv/api/system/status.php", function (json) {
-            if(json === undefined || json.status === "UNKNOWN") {
-                console.log("unable to check status");
-                return
-            }
-            alignPauseControl(json.status);
+  // Prevent closing when clicking inside modal content
+  $(".modal-content").on("click", function (event) {
+    event.stopPropagation();
+  });
+
+  // Tab switching
+  $(".tab-button").on("click", function () {
+    const targetId = $(this).data("target");
+
+    // Update active state for buttons
+    $(".tab-button").removeClass("active");
+    $(this).addClass("active");
+
+    // Update active state for content
+    $(".tab-content").removeClass("active");
+    $("#" + targetId).addClass("active");
+  });
+
+  // Submit handling for forms in tabs
+  $(".tab-content form").on("submit", function (e) {
+    e.preventDefault();
+
+    // Get form ID to determine which settings to update
+    const formId = $(this).attr("id");
+
+    // Serialize form data
+    const formData = {};
+    const formArray = $(this).serializeArray();
+
+    // Convert form data to a simple object
+    formArray.forEach((item) => {
+      // Convert form field names to uppercase as the backend expects them that way
+      formData[item.name.toUpperCase()] = item.value;
+    });
+
+    // Update environment file with new settings
+    updateEnvSettings(formId, formData);
+  });
+}
+
+/**
+ * Special handling for form submissions
+ */
+function setupFormSubmissions() {
+  let autoSaveTimeout = null;
 
+  function collectFormData($form) {
+    const formData = {};
+    $form.find("input, select, textarea").each(function () {
+      const $input = $(this);
+      const name = $input.attr("name");
+      if (name) {
+        if ($input.is(":checkbox")) {
+          formData[name.toUpperCase()] = $input.is(":checked")
+            ? "true"
+            : "false";
+        } else {
+          formData[name.toUpperCase()] = $input.val();
+        }
+      }
+    });
+    return formData;
+  }
+
+  function showAutoSaveIndicator() {
+    const $indicator = $(".auto-save-indicator");
+    $indicator.fadeIn(300);
+    setTimeout(() => {
+      $indicator.fadeOut(300);
+    }, 2000);
+  }
+
+  $("#unified-settings-form").on(
+    "change",
+    "input, select, textarea",
+    function () {
+      const $form = $("#unified-settings-form");
+      if (autoSaveTimeout) clearTimeout(autoSaveTimeout);
+      autoSaveTimeout = setTimeout(() => {
+        const formData = collectFormData($form);
+        console.log("Auto-saving settings:", formData);
+        $.ajax({
+          url: "srv/api/system/update_env.php",
+          method: "POST",
+          data: JSON.stringify(formData),
+          contentType: "application/json",
+          success: function (response) {
+            console.log("Auto-save successful:", response);
+            showAutoSaveIndicator();
+          },
+          error: function (xhr, status, error) {
+            console.error("Auto-save failed:", error);
+          },
         });
+      }, 1000);
     }
+  );
+
+  $("#unified-settings-form").on("submit", function (e) {
+    e.preventDefault();
+    const $form = $(this);
+    const formData = collectFormData($form);
+    console.log("Submitting unified settings:", formData);
+    updateEnvSettings("unified-settings-form", formData);
+  });
+}
+
+/**
+ * Start all periodic update intervals
+ */
+function startPeriodicUpdates() {
+  // Clear any existing intervals
+  stopPeriodicUpdates();
+
+  // Set new intervals
+  uploaderApp.intervals.inProgress = setInterval(handleInProgressJobs, 1000);
+  uploaderApp.intervals.queue = setInterval(handleQueueList, 5000);
+  uploaderApp.intervals.stats = setInterval(updateRealTimeStats, 2000);
+  uploaderApp.intervals.status = setInterval(checkStatus, 30000);
+  uploaderApp.intervals.dashboard = setInterval(loadDashboardActivity, 5000);
+}
 
-    function alignPauseControl(status) {
-        var control = $('#control > span > i');
-        if(status === "STARTED") {
-            control.removeClass('fa-pause');
-            control.addClass('fa-play');
-            $('#control > span').removeClass('bg-danger');
-            $('#control > span').addClass('bg-success');
-        } else if (status === "STOPPED") {
-            control.removeClass('fa-play');
-            control.addClass('fa-pause');
-            $('#control > span').removeClass('bg-success');
-            $('#control > span').addClass('bg-danger');
+/**
+ * Stop all periodic update intervals
+ */
+function stopPeriodicUpdates() {
+  Object.values(uploaderApp.intervals).forEach((interval) => {
+    if (interval) clearInterval(interval);
+  });
+}
+
+/**
+ * Handle in-progress uploads display
+ */
+function handleInProgressJobs() {
+  $.getJSON("srv/api/jobs/inprogress.php", function (json) {
+    const $tableBody = $("#uploadsTable > tbody");
+    let totalUploadRate = 0;
+
+    $tableBody.empty();
+
+    if (!json.jobs || json.jobs.length === 0) {
+      $tableBody.append(
+        '<tr><td colspan="8" class="no-uploads-message text-center">No uploads in progress</td></tr>'
+      );
+      $("#download_rate").text("0.00");
+      $("#current-rate").text("0.00 MB/s");
+      $("#active-count-badge").text("0");
+      return;
+    }
+
+    // Process and display each job
+    $.each(json.jobs, function (index, data) {
+      // Parse upload speed
+      let uploadRateNumeric = 0;
+      if (data.upload_speed) {
+        const rateMatches = data.upload_speed.match(/([0-9+\.]+)([MKG])/);
+        if (rateMatches) {
+          let rate = Number(rateMatches[1]);
+          // Convert to MB/s for consistent measurement
+          if (rateMatches[2] === "K") {
+            rate = rate / 1024;
+          } else if (rateMatches[2] === "G") {
+            rate = rate * 1024;
+          }
+          totalUploadRate += rate;
+          uploadRateNumeric = rate;
         }
+      }
+
+      // Calculate progress bar class based on percentage
+      let progressClass = "bg-secondary";
+      const progress = parseFloat(data.upload_percentage);
+
+      if (progress < 30) {
+        progressClass = "bg-danger";
+      } else if (progress < 70) {
+        progressClass = "bg-warning";
+      } else {
+        progressClass = "bg-success";
+      }
+
+      // Create a new row based on the template
+      const template = document.getElementById("upload-row-template");
+      if (!template) {
+        console.error("Upload row template not found");
+        return;
+      }
+
+      // Clone the template content
+      const rowNode = template.content.cloneNode(true);
+
+      // Fill in the data
+      rowNode.querySelector(".file-name").textContent = data.file_name;
+      rowNode.querySelector(".folder-name").textContent = data.drive;
+      // Remove folder prefix from directory path
+      let directory = data.file_directory || "N/A";
+      if (data.drive && directory.startsWith(data.drive + "/")) {
+        directory = directory.substring(data.drive.length + 1);
+      }
+      rowNode.querySelector(".directory-name").textContent = directory;
+      rowNode.querySelector(".key-name").textContent = data.gdsa;
+      rowNode.querySelector(".progress-percentage").textContent =
+        data.upload_percentage;
+      rowNode.querySelector(".progress-bar").style.width =
+        data.upload_percentage;
+      rowNode
+        .querySelector(".progress-bar")
+        .classList.remove(
+          "bg-success",
+          "bg-warning",
+          "bg-danger",
+          "bg-secondary"
+        );
+      rowNode.querySelector(".progress-bar").classList.add(progressClass);
+      rowNode
+        .querySelector(".progress-bar")
+        .setAttribute("aria-valuenow", progress);
+      rowNode.querySelector(".file-size").textContent = data.file_size;
+
+      // Format the time remaining and speed
+      const timeRemainingEl = rowNode.querySelector(".time-remaining");
+      const uploadSpeedEl = rowNode.querySelector(".upload-speed");
+
+      timeRemainingEl.textContent = data.upload_remainingtime;
+      uploadSpeedEl.textContent = data.upload_speed;
+
+      // Add a color class based on upload speed
+      if (uploadRateNumeric < 5) {
+        uploadSpeedEl.classList.add("speed-low");
+      } else if (uploadRateNumeric < 20) {
+        uploadSpeedEl.classList.add("speed-medium");
+      } else {
+        uploadSpeedEl.classList.add("speed-high");
+      }
+
+      // Append the row to the table
+      $tableBody.append(rowNode);
+    });
+
+    // Update the upload rate display
+    totalUploadRate = totalUploadRate.toFixed(2);
+    $("#current-rate").text(`${totalUploadRate} MB/s`);
+    $("#overview-rate").text(`${totalUploadRate} MB/s`);
+    $("#active-count-badge").text(json.jobs.length);
+
+    // Store the rate for other functions to access
+    uploaderApp.currentUploadRate = totalUploadRate;
+
+    // Color-code the upload rate based on speed (if element exists)
+    if ($("#download_rate").length > 0) {
+      if (totalUploadRate < 5) {
+        $("#download_rate")
+          .removeClass("bg-success bg-warning")
+          .addClass("bg-danger");
+      } else if (totalUploadRate < 10) {
+        $("#download_rate")
+          .removeClass("bg-success bg-danger")
+          .addClass("bg-warning");
+      } else {
+        $("#download_rate")
+          .removeClass("bg-warning bg-danger")
+          .addClass("bg-success");
+      }
     }
+  });
+}
 
-    //Register listener on pagesize
-    $('#pageSize > li.page-item').click(function () {
-        t = jQuery(this);
-        $('#pageSize > li.page-item.active').removeClass('active');
-        t.addClass('active');
-        handleCompletedJobList();
+// Update handleCompletedJobList to use relative date by default
+function handleCompletedJobList() {
+  const $completedTableBody = $("#completedTable > tbody");
+
+  // Get previously saved page size or use default
+  const savedPageSize = getUserSetting("pageSize", 10);
+
+  // Find and activate the correct page size button
+  $("#pageSize > li.page-item").removeClass("active");
+  $(`#pageSize > li.page-item:contains("${savedPageSize}")`).addClass("active");
+
+  // Initialize pagination
+  $("#page").pagination({
+    dataSource: "srv/api/jobs/completed.php",
+    locator: "jobs",
+    ulClassName: "pagination pagination-sm",
+    totalNumberLocator: function (response) {
+      return response.total_count;
+    },
+    pageSize: savedPageSize,
+    beforePaging: function (pageNumber) {
+      // Save current page
+      uploaderApp.activePage = pageNumber;
+
+      // Only enable auto-refresh for the first page
+      if (pageNumber === 1) {
+        if (!uploaderApp.intervals.completed) {
+          uploaderApp.intervals.completed = setInterval(
+            handleCompletedJobList,
+            5000
+          );
+        }
+      } else {
+        clearInterval(uploaderApp.intervals.completed);
+        uploaderApp.intervals.completed = null;
+      }
+    },
+    afterPaging: function () {
+      // After page changes, fetch complete upload stats for today
+      fetchCompletedTodayStats();
+    },
+    callback: function (data, pagination) {
+      // Add Bootstrap classes to pagination links
+      $("#page").find("ul").children("li").addClass("page-item");
+      $("#page").find("ul").children("li").children("a").addClass("page-link");
+
+      $completedTableBody.empty();
+
+      if (!data || data.length === 0) {
+        $completedTableBody.append(
+          '<tr><td colspan="7" class="no-uploads-message text-center">No completed uploads</td></tr>'
+        );
+        $("#clnHist").hide();
+        return;
+      }
+
+      $("#clnHist").show();
+
+      // Process and display each completed job
+      // Note: We've flipped the display format - now we show relative time by default
+      $.each(data, function (index, job) {
+        // Use time_end_clean (relative time) by default, only switch if prettyEndTime is checked
+        const endTime = $("#prettyEndTime").is(":checked")
+          ? job.time_end
+          : job.time_end_clean;
+        const rowClass = job.successful === true ? "" : "table-danger";
+        // Remove folder prefix from directory path
+        let directory = job.file_directory || "N/A";
+        if (job.drive && directory.startsWith(job.drive + "/")) {
+          directory = directory.substring(job.drive.length + 1);
+        }
+
+        const row = $("<tr>").addClass(rowClass);
+        row.append(
+          $("<td>")
+            .attr("data-title", "Filename")
+            .addClass("truncate")
+            .text(job.file_name)
+        );
+        row.append($("<td>").attr("data-title", "Folder").text(job.drive));
+        row.append(
+          $("<td>")
+            .attr("data-title", "Directory")
+            .addClass("truncate")
+            .text(directory)
+        );
+        row.append($("<td>").attr("data-title", "Key").text(job.gdsa));
+        row.append(
+          $("<td>").attr("data-title", "Filesize").text(job.file_size)
+        );
+        row.append(
+          $("<td>")
+            .attr("data-title", "Time spent")
+            .text(job.time_elapsed || "n/a")
+        );
+        row.append($("<td>").attr("data-title", "Uploaded").text(endTime));
+
+        $completedTableBody.append(row);
+      });
+
+      // Fetch all completed uploads for today
+      fetchCompletedTodayStats();
+    },
+  });
+}
+
+/**
+ * Fetch statistics for all uploads completed today
+ */
+function fetchCompletedTodayStats() {
+  $.getJSON("srv/api/jobs/completed_today_stats.php", function (data) {
+    if (data && data.count !== undefined) {
+      uploaderApp.completedTodayCount = data.count;
+      uploaderApp.completedTodaySize = data.total_size || 0;
+
+      // Update the stats display
+      $("#completed-count").text(data.count);
+      $("#completed-total").text(`Total: ${formatFileSize(data.total_size)}`);
+    }
+  }).fail(function () {
+    // If the API doesn't exist yet, fall back to counting visible rows
+    // This is a temporary solution until the API endpoint is implemented
+    calculateCompletedTodayStats();
+  });
+}
+
+/**
+ * Calculate statistics for today's completed uploads from visible table rows
+ * This is a fallback method used until the API endpoint is implemented
+ */
+function calculateCompletedTodayStats() {
+  let completedToday = 0;
+  let totalSize = 0;
+
+  // Process visible completed uploads
+  $("#completedTable tbody tr")
+    .not(':contains("No completed")')
+    .each(function () {
+      const uploadedText = $(this).find("td:eq(5)").text();
+      const sizeText = $(this).find("td:eq(3)").text();
+
+      // Check if this upload happened today
+      if (
+        uploadedText.includes("ago") ||
+        uploadedText.includes(new Date().toLocaleDateString())
+      ) {
+        completedToday++;
+
+        // Parse the file size
+        const size = parseFileSize(sizeText);
+        totalSize += size;
+      }
+    });
+
+  // Update the stats
+  $("#completed-count").text(completedToday);
+  $("#completed-total").text(`Total: ${formatFileSize(totalSize)}`);
+
+  // Save to app state
+  uploaderApp.completedTodayCount = completedToday;
+  uploaderApp.completedTodaySize = totalSize;
+}
+
+/**
+ * Handle queue list display
+ */
+function handleQueueList() {
+  $.getJSON("srv/api/jobs/queue.php", function (json) {
+    const $tableBody = $("#queueTable > tbody");
+    $tableBody.empty();
+
+    if (!json.success || !json.files || json.files.length === 0) {
+      $tableBody.append(
+        '<tr><td colspan="6" class="no-uploads-message text-center">No files in queue</td></tr>'
+      );
+      $("#queue-count-badge").text("0");
+      return;
+    }
+
+    // Update badge count
+    $("#queue-count-badge").text(json.files.length);
+
+    // Process and display each queued file
+    $.each(json.files, function (index, file) {
+      const row = $("<tr>");
+
+      // Position number
+      row.append($("<td>").text(index + 1));
+
+      // Filename
+      row.append($("<td>").addClass("truncate").text(file.filename));
+
+      // Folder (hidden on mobile)
+      row.append(
+        $("<td>")
+          .addClass("d-none d-lg-table-cell")
+          .text(file.drive || "N/A")
+      );
+
+      // Directory (hidden on mobile) - remove folder prefix
+      let directory = file.filedir || "/";
+      if (file.drive && directory.startsWith(file.drive + "/")) {
+        directory = directory.substring(file.drive.length + 1);
+      }
+      row.append(
+        $("<td>").addClass("d-none d-lg-table-cell truncate").text(directory)
+      );
+
+      // Filesize (hidden on mobile) - format the size
+      const formattedSize = formatFileSize(parseFileSize(file.filesize));
+      row.append(
+        $("<td>").addClass("d-none d-lg-table-cell").text(formattedSize)
+      );
+
+      // Added time
+      const addedTime = file.created_at
+        ? formatRelativeTime(file.created_at)
+        : "Unknown";
+      row.append($("<td>").text(addedTime));
+
+      $tableBody.append(row);
+    });
+  }).fail(function (jqXHR, textStatus, errorThrown) {
+    console.error("Failed to fetch queue list:", textStatus, errorThrown);
+    const $tableBody = $("#queueTable > tbody");
+    $tableBody.empty();
+    $tableBody.append(
+      '<tr><td colspan="6" class="no-uploads-message text-center">Error loading queue</td></tr>'
+    );
+  });
+}
+
+// Enhanced status check function
+function checkStatus() {
+  console.log("Checking uploader status");
+
+  $.getJSON("srv/api/system/status.php")
+    .done(function (json) {
+      console.log("Status response:", json);
+
+      if (json === undefined || json.status === "UNKNOWN") {
+        console.warn("Unable to check status");
+        updateStatusIndicator("error", "Unknown");
+        return;
+      }
+
+      // Update pause control button
+      alignPauseControl(json.status, false);
+
+      // Update status indicator
+      if (json.status === "STARTED") {
+        updateStatusIndicator("active", "Active");
+      } else if (json.status === "STOPPED") {
+        updateStatusIndicator("paused", "Paused");
+      } else {
+        updateStatusIndicator("stopped", "Stopped");
+      }
     })
+    .fail(function (jqXHR, textStatus, errorThrown) {
+      console.error("Failed to check status:", textStatus, errorThrown);
+      updateStatusIndicator("error", "Error");
+    });
+}
 
-    $('#prettyEndTime').click(function () {
-        handleCompletedJobList();
+// Play/Pause button handler
+function alignPauseControl(status, fromUserAction = false) {
+  console.log("Aligning pause control to status:", status);
+
+  const $control = $("#control > button");
+  const $icon = $control.find("i");
+  const $text = $control.find("span");
+
+  if (status === "STARTED") {
+    // If uploader is RUNNING, show PAUSE icon (so user can pause it)
+    $icon.removeClass("fa-play").addClass("fa-pause");
+    $text.text("Pause");
+    $control.removeClass("bg-danger").addClass("bg-success");
+    $control.attr("aria-label", "Pause uploads");
+
+    if (fromUserAction) {
+      showStatusMessage("Uploader is running");
+      updateStatusIndicator("active", "Active");
+    }
+  } else if (status === "STOPPED") {
+    // If uploader is STOPPED, show PLAY icon (so user can resume it)
+    $icon.removeClass("fa-pause").addClass("fa-play");
+    $text.text("Resume");
+    $control.removeClass("bg-success").addClass("bg-danger");
+    $control.attr("aria-label", "Resume uploads");
+
+    if (fromUserAction) {
+      showStatusMessage("Uploader is paused");
+      updateStatusIndicator("paused", "Paused");
+    }
+  }
+}
+
+/**
+ * Update the status indicator badge
+ * @param {string} state - One of: 'active', 'paused', 'stopped', 'error'
+ * @param {string} text - Text to display
+ */
+function updateStatusIndicator(state, text) {
+  const $indicator = $("#status-indicator");
+  const $statusText = $indicator.find(".status-text");
+
+  // Remove all status classes
+  $indicator.removeClass(
+    "status-active status-paused status-stopped status-error"
+  );
+
+  // Add the new status class
+  $indicator.addClass(`status-${state}`);
+
+  // Update text
+  $statusText.text(text);
+
+  console.log(`Status indicator updated: ${state} - ${text}`);
+}
+
+/**
+ * Update the pause/play control based on service status
+ */
+function setupPauseControl() {
+  // Pause/Resume button click handler
+  $("#control > button").on("click", function () {
+    console.log("Pause/play button clicked");
+
+    // Determine action based on current state
+    const $icon = $(this).find("i");
+
+    // If we see pause icon, clicking means we want to pause
+    // If we see play icon, clicking means we want to resume
+    const action = $icon.hasClass("fa-pause") ? "pause" : "continue";
+
+    console.log("Icon class:", $icon.attr("class"), "Action:", action);
+
+    // Visual feedback while processing
+    const $button = $(this);
+    $button.css("opacity", "0.5").css("pointer-events", "none");
+
+    // Send request to API
+    $.ajax({
+      type: "POST",
+      url: "srv/api/system/status.php",
+      data: { action: action },
+      dataType: "json",
+      success: function (data) {
+        console.log("Status update response:", data);
+        if (data && data.status) {
+          alignPauseControl(data.status, true);
+        } else {
+          console.error("Invalid response from status API");
+        }
+      },
+      error: function (xhr, status, error) {
+        console.error("Failed to update status:", error);
+        console.log("Response:", xhr.responseText);
+        showStatusMessage(
+          "Failed to update status. Check console for details.",
+          true
+        );
+      },
+      complete: function () {
+        // Reset button appearance
+        $button.css("opacity", "1").css("pointer-events", "auto");
+      },
     });
+  });
+
+  // Status indicator click handler - triggers pause/resume
+  $("#status-indicator").on("click", function () {
+    console.log("Status indicator clicked - triggering pause/resume");
+    $("#control > button").click();
+  });
+}
 
-    //Play/Pause
-    $('#control > span').click(function(){
-        var action = "continue"
-        if($('#control > span > i').hasClass('fa-play')) {
-            action = "pause"
+// Update the updateRealTimeStats function
+function updateRealTimeStats() {
+  // Get current upload rate from the app state or current-rate element
+  const currentRate =
+    uploaderApp.currentUploadRate || parseFloat($("#current-rate").text()) || 0;
+  const currentRateStr =
+    typeof currentRate === "number" ? currentRate.toFixed(2) : currentRate;
+
+  // Update rate progress bar
+  const bandwidthLimit = parseFloat(
+    uploaderApp.envSettings.BANDWIDTH_LIMIT ||
+      $("#bandwidth_limit").val() ||
+      "30"
+  );
+  const rateValue = parseFloat(currentRateStr);
+  const ratePercentage = Math.min((rateValue / bandwidthLimit) * 100, 100);
+  $("#rate-progress .progress-bar-mini").css("width", ratePercentage + "%");
+
+  // Get active uploads count
+  const activeUploads =
+    $("#uploadsTable tbody tr").not(':contains("No uploads")').length || 0;
+  $("#active-count").text(activeUploads);
+
+  // Update active count badge
+  $("#active-count-badge").text(activeUploads);
+
+  // Update overview cards
+  $("#overview-active").text(activeUploads);
+
+  // Update queue stats separately - don't use active uploads count
+  updateQueueStats();
+
+  // Set the current max active transfers
+  const maxTransfers =
+    uploaderApp.envSettings.TRANSFERS || $("#transfers").val() || "2";
+  $("#active-max").text(`Max: ${maxTransfers}`);
+
+  // Set the bandwidth limit
+  $("#rate-limit").html(
+    `<i class="fas fa-gauge-high"></i> Limit: ${bandwidthLimit} MB/s per transfer`
+  );
+
+  // Update system overview
+  updateSystemOverview();
+}
+
+/**
+ * Update system overview card with uptime and storage info
+ */
+function updateSystemOverview() {
+  // Update uptime and storage with a single API call
+  fetch("srv/api/system/status.php")
+    .then((response) => response.json())
+    .then((data) => {
+      console.log("System overview data:", data);
+
+      if (data) {
+        // Update uptime
+        if (data.uptime) {
+          $("#system-uptime").text(data.uptime);
         }
 
-        $.ajax({
-            type: "POST",
-            url: "srv/api/system/status.php",
-            data: {
-                action:  action
-            },
-            success: function(data) {
-                alignPauseControl(data.status);
+        // Update storage
+        if (data.storage) {
+          $("#storage-used").text(data.storage);
+        }
+
+        // Update system status with dynamic styling
+        if (data.status) {
+          const $statusValue = $("#system-status-mini");
+          const $statusIcon = $("#system-status-icon");
+          const $statusIconI = $statusIcon.find("i");
+
+          // Check if there are active uploads
+          const activeUploads =
+            $("#uploadsTable tbody tr").not(':contains("No uploads")').length ||
+            0;
+
+          // Remove all color classes
+          $statusValue.removeClass(
+            "value-green value-red value-orange value-blue"
+          );
+          $statusIcon.removeClass(
+            "gradient-green gradient-red gradient-orange gradient-blue"
+          );
+
+          if (data.status === "STARTED") {
+            if (activeUploads > 0) {
+              // Uploading state - green with arrow-up icon
+              $statusValue.text("Uploading").addClass("value-green");
+              $statusIcon.addClass("gradient-green");
+              $statusIconI
+                .removeClass("fa-times-circle fa-pause-circle fa-check-circle")
+                .addClass("fa-arrow-up");
+            } else {
+              // Online but idle - green with check-circle icon
+              $statusValue.text("Online").addClass("value-green");
+              $statusIcon.addClass("gradient-green");
+              $statusIconI
+                .removeClass("fa-times-circle fa-pause-circle fa-arrow-up")
+                .addClass("fa-check-circle");
             }
-        });
+          } else if (data.status === "STOPPED") {
+            $statusValue.text("Stopped").addClass("value-orange");
+            $statusIcon.addClass("gradient-orange");
+            $statusIconI
+              .removeClass("fa-check-circle fa-times-circle fa-arrow-up")
+              .addClass("fa-pause-circle");
+          } else {
+            $statusValue.text("Offline").addClass("value-red");
+            $statusIcon.addClass("gradient-red");
+            $statusIconI
+              .removeClass("fa-check-circle fa-pause-circle fa-arrow-up")
+              .addClass("fa-times-circle");
+          }
+        }
+      }
+    })
+    .catch((error) => {
+      console.error("Failed to fetch system overview:", error);
+
+      // On error, show red error state
+      const $statusValue = $("#system-status-mini");
+      const $statusIcon = $("#system-status-icon");
+      const $statusIconI = $statusIcon.find("i");
+
+      $statusValue
+        .removeClass("value-green value-orange")
+        .addClass("value-red")
+        .text("Error");
+      $statusIcon
+        .removeClass("gradient-green gradient-orange")
+        .addClass("gradient-red");
+      $statusIconI
+        .removeClass("fa-check-circle fa-pause-circle")
+        .addClass("fa-times-circle");
+
+      $("#system-uptime").text("Error");
+      $("#storage-used").text("Error");
     });
+}
 
-    $('#clnHist').click(function(){
-        $.ajax({
-            type: "POST",
-            url: "srv/api/system/clean_history.php",
-        });
-        handleCompletedJobList();
+/**
+ * Load environment settings from the server
+ */
+function loadEnvSettings() {
+  // First try the new API endpoint
+  $.getJSON("srv/api/settings/update.php")
+    .done(function (data) {
+      if (data && data.success && data.settings) {
+        uploaderApp.envSettings = data.settings;
+
+        // Populate form fields with loaded settings
+        populateFormFields(data.settings);
+
+        // Update UI elements that depend on settings
+        updateUIFromSettings(data.settings);
+      } else {
+        console.warn(
+          "New settings API returned invalid data, falling back to legacy endpoint"
+        );
+        loadEnvSettingsLegacy();
+      }
+    })
+    .fail(function () {
+      console.warn(
+        "New settings API not available, falling back to legacy endpoint"
+      );
+      loadEnvSettingsLegacy();
     });
+}
 
-    //Initialize handling of "completed jobs"
-    handleCompletedJobList();
-    handleInProgressJobs();
-    checkStatus();
-    setInterval(handleInProgressJobs, 1000);
-    setInterval(checkStatus, 30000);
-});
+/**
+ * Legacy method to load environment settings
+ * This will be used if the new API is not available
+ */
+function loadEnvSettingsLegacy() {
+  $.getJSON("srv/api/system/env_settings.php")
+    .done(function (data) {
+      if (data && typeof data === "object") {
+        uploaderApp.envSettings = data;
+
+        // Populate form fields with loaded settings
+        populateFormFields(data);
+
+        // Update UI elements that depend on settings
+        updateUIFromSettings(data);
+      } else {
+        console.warn("Failed to load environment settings from legacy API");
+      }
+    })
+    .fail(function () {
+      console.warn("Failed to load environment settings from any API");
+
+      // Use default values for essential settings
+      const defaultSettings = {
+        TRANSFERS: 2,
+        BANDWIDTH_LIMIT: "30M",
+        FOLDER_DEPTH: 1,
+        MIN_AGE_UPLOAD: 1,
+      };
+
+      uploaderApp.envSettings = defaultSettings;
+      populateFormFields(defaultSettings);
+      updateUIFromSettings(defaultSettings);
+    });
+}
+
+/**
+ * Populate form fields with settings
+ * @param {Object} settings - Settings object
+ */
+function populateFormFields(settings) {
+  Object.entries(settings).forEach(([key, value]) => {
+    // Try to find the form field (case insensitive)
+    const $field = $(`[name="${key}"], [name="${key.toLowerCase()}"]`);
+
+    if ($field.length) {
+      if ($field.is("select")) {
+        $field.val(value.toString());
+      } else if ($field.is(":checkbox")) {
+        $field.prop("checked", value === true || value === "true");
+      } else {
+        $field.val(value);
+      }
+    }
+  });
+}
+
+/**
+ * Update UI elements based on loaded settings
+ * @param {Object} settings - Settings object
+ */
+function updateUIFromSettings(settings) {
+  // Update max transfers display
+  if (settings.TRANSFERS || settings.transfers) {
+    const transfers = settings.TRANSFERS || settings.transfers;
+    $("#active-max").text(`Max: ${transfers}`);
+  }
+
+  // Update bandwidth limit display
+  if (settings.BANDWIDTH_LIMIT || settings.bandwidth_limit) {
+    const bwLimit = settings.BANDWIDTH_LIMIT || settings.bandwidth_limit;
+    // Remove quotes if present
+    const cleanBwLimit = bwLimit.replace(/"/g, "");
+    $("#rate-limit").text(`Limit per Transfer: ${cleanBwLimit}`);
+  }
+}
+
+/**
+ * Update environment settings
+ * @param {string} formId - Form ID that was submitted
+ * @param {Object} settings - Settings to update
+ */
+function updateEnvSettings(formId, settings) {
+  console.log("Updating settings:", settings);
+
+  // Create a loading indicator
+  const $form = $(`#${formId}`);
+  const $submitBtn = $form.find('button[type="submit"]');
+  const originalText = $submitBtn.text();
+  $submitBtn.prop("disabled", true).text("Saving...");
+
+  // Add a safety timeout to restore button state even if AJAX fails
+  const resetTimeout = setTimeout(() => {
+    $submitBtn.prop("disabled", false).text(originalText);
+    console.log("Button state restored by safety timeout");
+  }, 8000);
+
+  // Special handling for BANDWIDTH_LIMIT
+  if (
+    settings.BANDWIDTH_LIMIT !== undefined &&
+    settings.BANDWIDTH_LIMIT !== "null" &&
+    settings.BANDWIDTH_LIMIT !== "" &&
+    !/[KMG]$/i.test(settings.BANDWIDTH_LIMIT)
+  ) {
+    // Append 'M' if no unit is specified
+    settings.BANDWIDTH_LIMIT = settings.BANDWIDTH_LIMIT + "M";
+    console.log("Added M suffix to bandwidth limit:", settings.BANDWIDTH_LIMIT);
+  }
+
+  // Make actual API call to update env settings
+  $.ajax({
+    url: "srv/api/system/update_env.php",
+    type: "POST",
+    data: JSON.stringify(settings),
+    contentType: "application/json",
+    dataType: "json",
+    success: function (response) {
+      console.log("API response:", response);
+
+      if (response.success) {
+        showStatusMessage("Settings updated successfully!");
+
+        // Update local settings
+        Object.assign(uploaderApp.envSettings, settings);
+
+        // Update UI based on form ID
+        switch (formId) {
+          case "transfer-form":
+            // Update transfer settings UI
+            $("#active-max").text(`Max: ${settings.TRANSFERS || "2"}`);
+            $("#rate-limit").text(
+              `Limit per Transfer: ${settings.BANDWIDTH_LIMIT || "30M"}`
+            );
+            break;
+
+          case "system-form":
+            // Update system settings UI if needed
+            break;
+
+          case "notification-form":
+            // Update notification settings UI if needed
+            break;
+
+          case "autoscan-form":
+            // Update autoscan settings UI if needed
+            break;
+
+          case "security-form":
+            // Update security settings UI if needed
+            break;
+        }
+      } else {
+        // Try legacy API if new one fails
+        updateEnvSettingsLegacy(
+          formId,
+          settings,
+          $submitBtn,
+          originalText,
+          function (success) {
+            if (!success) {
+              showStatusMessage(
+                "Failed to update settings: " +
+                  (response.message || "Unknown error"),
+                true
+              );
+            }
+          }
+        );
+      }
+    },
+    error: function (xhr, status, error) {
+      console.error("Failed to use new settings API:", status, error);
+      // Try legacy API as fallback
+      updateEnvSettingsLegacy(
+        formId,
+        settings,
+        $submitBtn,
+        originalText,
+        function (success) {
+          if (!success) {
+            showStatusMessage("Failed to communicate with the server", true);
+            console.error("Response:", xhr.responseText);
+          }
+        }
+      );
+    },
+    complete: function () {
+      // Clear the safety timeout
+      clearTimeout(resetTimeout);
+      // Restore button state
+      $submitBtn.prop("disabled", false).text(originalText);
+      console.log("Button state restored in complete callback");
+    },
+  });
+}
+
+/**
+ * Legacy method to update environment settings
+ * @param {string} formId - Form ID
+ * @param {Object} settings - Settings object
+ * @param {jQuery} $submitBtn - Submit button jQuery object
+ * @param {string} originalText - Original button text
+ * @param {Function} callback - Callback function
+ */
+function updateEnvSettingsLegacy(
+  formId,
+  settings,
+  $submitBtn,
+  originalText,
+  callback
+) {
+  // Convert settings keys to lowercase for legacy API
+  const legacySettings = {};
+  Object.keys(settings).forEach((key) => {
+    legacySettings[key.toLowerCase()] = settings[key];
+  });
+
+  $.ajax({
+    url: "srv/api/system/update_env.php",
+    type: "POST",
+    data: JSON.stringify(legacySettings),
+    contentType: "application/json",
+    dataType: "json",
+    success: function (response) {
+      if (response.success) {
+        showStatusMessage("Settings updated successfully!");
+
+        // Update local settings
+        Object.assign(uploaderApp.envSettings, settings);
+
+        // Update UI based on form ID
+        switch (formId) {
+          case "transfer-form":
+            $("#active-max").text(`Max: ${legacySettings.transfers || "2"}`);
+            $("#rate-limit").text(
+              `Limit per Transfer: ${legacySettings.bandwidth_limit || "30M"}`
+            );
+            break;
+        }
+
+        if (callback) callback(true);
+      } else {
+        if (callback) callback(false);
+      }
+    },
+    error: function () {
+      if (callback) callback(false);
+    },
+    complete: function () {
+      // Also restore button state in legacy handler
+      if ($submitBtn && originalText) {
+        $submitBtn.prop("disabled", false).text(originalText);
+        console.log("Button state restored in legacy complete callback");
+      }
+    },
+  });
+}
+
+function updateQueueStats() {
+  $.getJSON("srv/api/jobs/queue_stats.php", function (data) {
+    if (data && typeof data === "object") {
+      // Update the queue count
+      const queueCount = data.count || 0;
+      $("#queue-count").text(queueCount);
+      $("#overview-queue").text(queueCount);
+
+      // Format the total size nicely
+      const totalSize = formatFileSize(data.total_size || 0);
+      $("#queue-total").text(`Total: ${totalSize}`);
+    }
+  }).fail(function () {
+    // Fallback if API doesn't exist yet
+    console.log("Queue stats API not available, using fallback method");
+    estimateQueueStats();
+  });
+}
+
+// Fallback method to estimate queue stats until API is available
+function estimateQueueStats() {
+  // Use the uploads table as a fallback
+  $.getJSON("srv/api/jobs/inprogress.php", function (data) {
+    const queueCount = data.jobs ? data.jobs.length : 0;
+    $("#queue-count").text(queueCount);
+    $("#overview-queue").text(queueCount);
+
+    let totalSize = 0;
+    if (data.jobs && data.jobs.length > 0) {
+      data.jobs.forEach(function (job) {
+        totalSize += parseFileSize(job.file_size);
+      });
+    }
+
+    $("#queue-total").text(`Total: ${formatFileSize(totalSize)}`);
+  });
+}
+
+/**
+ * Load dashboard activity sections
+ */
+function loadDashboardActivity() {
+  loadDashboardQueue();
+  loadDashboardActive();
+  loadDashboardHistory();
+}
+
+/**
+ * Load latest queue items for dashboard
+ */
+function loadDashboardQueue() {
+  $.getJSON("srv/api/jobs/queue.php", function (data) {
+    const $tbody = $("#dashboard-queue-table tbody");
+    $tbody.empty();
+
+    if (!data.files || data.files.length === 0) {
+      $tbody.append(
+        '<tr><td colspan="6" class="text-center">No files in queue</td></tr>'
+      );
+      return;
+    }
+
+    // Show only latest 5 items
+    const files = data.files.slice(0, 5);
+    files.forEach(function (file, index) {
+      const size = formatFileSize(parseFileSize(file.filesize));
+      // Remove folder prefix from directory path
+      let directory = file.filedir || "/";
+      if (file.drive && directory.startsWith(file.drive + "/")) {
+        directory = directory.substring(file.drive.length + 1);
+      }
+      // Format the added time properly
+      const time = file.created_at
+        ? formatRelativeTime(file.created_at)
+        : "N/A";
+      const $row = $(`
+        <tr>
+          <td>${index + 1}</td>
+          <td class="truncate">${escapeHtml(file.filename)}</td>
+          <td>${escapeHtml(file.drive || "N/A")}</td>
+          <td class="truncate">${escapeHtml(directory)}</td>
+          <td>${size}</td>
+          <td>${time}</td>
+        </tr>
+      `);
+      $tbody.append($row);
+    });
+  }).fail(function () {
+    $("#dashboard-queue-table tbody").html(
+      '<tr><td colspan="6" class="text-center">Failed to load queue</td></tr>'
+    );
+  });
+}
+
+/**
+ * Load latest active uploads for dashboard
+ */
+function loadDashboardActive() {
+  $.getJSON("srv/api/jobs/inprogress.php", function (data) {
+    const $tbody = $("#dashboard-active-table tbody");
+    $tbody.empty();
+
+    if (!data.jobs || data.jobs.length === 0) {
+      $tbody.append(
+        '<tr><td colspan="8" class="text-center">No active uploads</td></tr>'
+      );
+      return;
+    }
+
+    // Show only latest 5 items
+    const jobs = data.jobs.slice(0, 5);
+    jobs.forEach(function (job) {
+      const size = job.file_size || "N/A";
+      const progress = parseInt(job.upload_percentage) || 0;
+      const speed = job.upload_speed || "0 MB/s";
+      const timeLeft = job.upload_remainingtime || "N/A";
+      // Remove folder prefix from directory path
+      let directory = job.file_directory || "N/A";
+      if (job.drive && directory.startsWith(job.drive + "/")) {
+        directory = directory.substring(job.drive.length + 1);
+      }
+
+      const $row = $(`
+        <tr>
+          <td class="truncate">${escapeHtml(
+            job.file_name || job.job_name || "Unknown"
+          )}</td>
+          <td>${escapeHtml(job.drive || "N/A")}</td>
+          <td class="truncate">${escapeHtml(directory)}</td>
+          <td>${escapeHtml(job.gdsa || "N/A")}</td>
+          <td>
+            <div class="progress-container">
+              <div class="progress-info">
+                <span class="progress-percentage">${progress}%</span>
+              </div>
+              <div class="progress">
+                <div class="progress-bar bg-success" style="width: ${progress}%"></div>
+              </div>
+            </div>
+          </td>
+          <td>${size}</td>
+          <td>${timeLeft}</td>
+          <td>${speed}</td>
+        </tr>
+      `);
+      $tbody.append($row);
+    });
+  }).fail(function () {
+    $("#dashboard-active-table tbody").html(
+      '<tr><td colspan="8" class="text-center">Failed to load active uploads</td></tr>'
+    );
+  });
+}
+
+/**
+ * Load latest history for dashboard
+ */
+function loadDashboardHistory() {
+  $.getJSON("srv/api/jobs/completed.php?page=1", function (data) {
+    const $tbody = $("#dashboard-history-table tbody");
+    $tbody.empty();
+
+    if (!data.jobs || data.jobs.length === 0) {
+      $tbody.append(
+        '<tr><td colspan="7" class="text-center">No upload history</td></tr>'
+      );
+      return;
+    }
+
+    // Show only latest 5 items
+    const jobs = data.jobs.slice(0, 5);
+    jobs.forEach(function (job) {
+      const size = job.file_size || "N/A";
+      const timeSpent = job.time_elapsed || "N/A";
+      const uploaded = job.time_end_clean || "N/A";
+      // Remove folder prefix from directory path
+      let directory = job.file_directory || "N/A";
+      if (job.drive && directory.startsWith(job.drive + "/")) {
+        directory = directory.substring(job.drive.length + 1);
+      }
+
+      const $row = $(`
+        <tr>
+          <td class="truncate">${escapeHtml(job.file_name || "")}</td>
+          <td>${escapeHtml(job.drive || "N/A")}</td>
+          <td class="truncate">${escapeHtml(directory)}</td>
+          <td>${escapeHtml(job.gdsa || "N/A")}</td>
+          <td>${size}</td>
+          <td>${timeSpent}</td>
+          <td>${uploaded}</td>
+        </tr>
+      `);
+      $tbody.append($row);
+    });
+  }).fail(function () {
+    $("#dashboard-history-table tbody").html(
+      '<tr><td colspan="7" class="text-center">Failed to load history</td></tr>'
+    );
+  });
+}
diff --git a/apps/docker-uploader/root/var/www/html/js/app.js.bak b/apps/docker-uploader/root/var/www/html/js/app.js.bak
new file mode 100644
index 0000000000..531dc2956e
--- /dev/null
+++ b/apps/docker-uploader/root/var/www/html/js/app.js.bak
@@ -0,0 +1,1473 @@
+/**
+ * Main application JavaScript for the Uploader Dashboard
+ *
+ * Note: Common utility functions have been moved to utils.js
+ * This file now focuses on application-specific functionality
+ */
+
+// Store global data
+const uploaderApp = {
+  activePage: 1,
+  pageSize: 10,
+  completedTodayCount: 0,
+  completedTodaySize: 0,
+  // Store env settings loaded from the API
+  envSettings: {},
+  // Interval IDs for periodic updates
+  intervals: {
+    inProgress: null,
+    completed: null,
+    stats: null,
+    queue: null,
+  },
+};
+
+// Update the document ready function to hide the upload history chart
+$(document).ready(function () {
+  // Hide the upload history card as it's not needed
+  $(".card:has(#upload-history-chart)").hide();
+
+  // Initialize the app
+  initializeApp();
+
+  // Load current theme from localStorage or use default
+  initializeTheme();
+
+  // Setup event listeners
+  setupEventListeners();
+
+  // Start periodic updates
+  startPeriodicUpdates();
+
+  // Toggle prettyEndTime checkbox to use relative time by default
+  if ($("#prettyEndTime").is(":checked")) {
+    $("#prettyEndTime").prop("checked", false);
+  }
+});
+
+/**
+ * Initialize the application
+ */
+function initializeApp() {
+  // Load environment settings
+  loadEnvSettings();
+  loadAppVersion();
+  // Initial data fetching
+  handleInProgressJobs();
+  handleCompletedJobList();
+  handleQueueList();
+  checkStatus();
+  updateRealTimeStats();
+  // Load dashboard recent activity
+  loadDashboardActivity();
+}
+
+/**
+ * Load the application version
+ */
+function loadAppVersion() {
+  let currentVersion = null;
+
+  // Try dedicated API endpoint first
+  fetch("srv/api/system/version.php")
+    .then((response) => response.json())
+    .then((data) => {
+      if (data && data.version) {
+        currentVersion = data.version;
+        document.getElementById("app-version").textContent = "v" + data.version;
+        console.log("Version loaded from API:", data.version);
+        checkGitHubVersion(currentVersion);
+      }
+    })
+    .catch((error) => {
+      console.log("API version fetch failed, trying direct file");
+
+      // Fallback to direct file access
+      fetch("release.json")
+        .then((response) => response.json())
+        .then((data) => {
+          if (data && data.newversion) {
+            currentVersion = data.newversion;
+            document.getElementById("app-version").textContent =
+              "v" + data.newversion;
+            console.log("Version loaded from file:", data.newversion);
+            checkGitHubVersion(currentVersion);
+          } else {
+            throw new Error("Invalid release.json format");
+          }
+        })
+        .catch((fallbackError) => {
+          console.error("Version fetch failed:", fallbackError);
+          // Set a hardcoded version as last resort
+          currentVersion = "5.0.0";
+          document.getElementById("app-version").textContent =
+            "v" + currentVersion;
+          checkGitHubVersion(currentVersion);
+        });
+    });
+}
+
+/**
+ * Check GitHub for latest release version
+ */
+function checkGitHubVersion(currentVersion) {
+  const $statusBadge = $("#version-status");
+
+  fetch(
+    "https://api.github.com/repos/cyb3rgh05t/docker-uploader/releases/latest"
+  )
+    .then((response) => response.json())
+    .then((data) => {
+      if (data && data.tag_name) {
+        const latestVersion = data.tag_name.replace(/^v/, "");
+        const current = currentVersion.replace(/^v/, "");
+
+        console.log(
+          "Current version:",
+          current,
+          "Latest version:",
+          latestVersion
+        );
+
+        const versionComparison = compareVersions(current, latestVersion);
+
+        if (versionComparison < 0) {
+          // Update available
+          $statusBadge.html('<i class="fas fa-arrow-up"></i> Update Available');
+          $statusBadge
+            .removeClass("up-to-date checking develop")
+            .addClass("update-available");
+          $statusBadge.attr("title", `New version ${latestVersion} available`);
+        } else if (versionComparison > 0) {
+          // Development version (ahead of latest release)
+          $statusBadge.html('<i class="fas fa-code-branch"></i> Develop');
+          $statusBadge
+            .removeClass("update-available checking up-to-date")
+            .addClass("develop");
+          $statusBadge.attr(
+            "title",
+            `Development build (ahead of v${latestVersion})`
+          );
+        } else {
+          // Up to date
+          $statusBadge.html('<i class="fas fa-check"></i> Up to Date');
+          $statusBadge
+            .removeClass("update-available checking develop")
+            .addClass("up-to-date");
+          $statusBadge.attr("title", "You are running the latest version");
+        }
+      } else {
+        throw new Error("Invalid GitHub response");
+      }
+    })
+    .catch((error) => {
+      console.error("Failed to check GitHub version:", error);
+      $statusBadge.html('<i class="fas fa-question"></i> Unknown');
+      $statusBadge.removeClass("update-available checking up-to-date");
+      $statusBadge.attr("title", "Unable to check for updates");
+    });
+}
+
+/**
+ * Compare two semantic version strings
+ * Returns: -1 if v1 < v2, 0 if equal, 1 if v1 > v2
+ */
+function compareVersions(v1, v2) {
+  const parts1 = v1.split(".").map(Number);
+  const parts2 = v2.split(".").map(Number);
+
+  for (let i = 0; i < Math.max(parts1.length, parts2.length); i++) {
+    const part1 = parts1[i] || 0;
+    const part2 = parts2[i] || 0;
+
+    if (part1 < part2) return -1;
+    if (part1 > part2) return 1;
+  }
+
+  return 0;
+}
+
+/**
+ * Set up all event listeners
+ */
+function setupEventListeners() {
+  // Sidebar toggle
+  $("#sidebar-toggle").on("click", function () {
+    $("#sidebar").addClass("active");
+    $("#overlay").addClass("active");
+  });
+
+  $("#sidebar-close, #overlay").on("click", function () {
+    $("#sidebar").removeClass("active");
+    $("#overlay").removeClass("active");
+  });
+
+  setupSettingsModal();
+
+  // Theme selection - uses function from utils.js
+  setupThemeEventListeners();
+
+  // Sidebar accordion toggles
+  $(".sidebar-section-header").on("click", function () {
+    const targetId = $(this).data("target");
+    const $content = $("#" + targetId);
+    // Use a more specific selector to target only the chevron icon
+    const $chevronIcon = $(this).find("i.fa-chevron-up, i.fa-chevron-down");
+
+    if ($content.hasClass("active")) {
+      $content.removeClass("active");
+      $chevronIcon.removeClass("fa-chevron-up").addClass("fa-chevron-down");
+      $(this).attr("aria-expanded", "false");
+    } else {
+      $content.addClass("active");
+      $chevronIcon.removeClass("fa-chevron-down").addClass("fa-chevron-up");
+      $(this).attr("aria-expanded", "true");
+    }
+  });
+
+  // Form submissions - with improved handling
+  setupFormSubmissions();
+
+  // Setup pause control
+  setupPauseControl();
+
+  // Clear history button
+  $("#clnHist").on("click", function () {
+    $.ajax({
+      type: "POST",
+      url: "srv/api/system/clean_history.php",
+      success: function () {
+        handleCompletedJobList();
+        showStatusMessage("Upload history cleared successfully");
+      },
+      error: function () {
+        showStatusMessage("Failed to clear upload history", true);
+      },
+    });
+  });
+
+  // Toggle time format
+  $("#prettyEndTime").on("click", function () {
+    handleCompletedJobList();
+  });
+
+  // Page size selection
+  $("#pageSize > li.page-item").on("click", function () {
+    $("#pageSize > li.page-item.active").removeClass("active");
+    $(this).addClass("active");
+    uploaderApp.pageSize = parseInt($(this).find("a").text());
+    saveUserSetting("pageSize", uploaderApp.pageSize);
+    handleCompletedJobList();
+  });
+
+  // Chart time range selector
+  $("#chart-timerange").on("change", function () {
+    const timeRange = $(this).val();
+    createMockUploadChart("upload-history-chart", timeRange);
+    saveUserSetting("chartTimeRange", timeRange);
+  });
+}
+
+/**
+ * Settings Modal and Tabbed Interface Functionality
+ */
+function setupSettingsModal() {
+  // Modal open/close
+  $("#settings-toggle").on("click", function () {
+    $("#settings-modal").addClass("active");
+    $("#modal-overlay").addClass("active");
+  });
+
+  $("#modal-close, #modal-overlay").on("click", function () {
+    $("#settings-modal").removeClass("active");
+    $("#modal-overlay").removeClass("active");
+  });
+
+  // Close modal when clicking outside of it
+  $(document).on("click", function (event) {
+    if (
+      $("#settings-modal").hasClass("active") &&
+      !$(event.target).closest(".modal-content").length &&
+      !$(event.target).closest("#settings-toggle").length
+    ) {
+      $("#settings-modal").removeClass("active");
+      $("#modal-overlay").removeClass("active");
+    }
+  });
+
+  // Prevent closing when clicking inside modal content
+  $(".modal-content").on("click", function (event) {
+    event.stopPropagation();
+  });
+
+  // Tab switching
+  $(".tab-button").on("click", function () {
+    const targetId = $(this).data("target");
+
+    // Update active state for buttons
+    $(".tab-button").removeClass("active");
+    $(this).addClass("active");
+
+    // Update active state for content
+    $(".tab-content").removeClass("active");
+    $("#" + targetId).addClass("active");
+  });
+
+  // Submit handling for forms in tabs
+  $(".tab-content form").on("submit", function (e) {
+    e.preventDefault();
+
+    // Get form ID to determine which settings to update
+    const formId = $(this).attr("id");
+
+    // Serialize form data
+    const formData = {};
+    const formArray = $(this).serializeArray();
+
+    // Convert form data to a simple object
+    formArray.forEach((item) => {
+      // Convert form field names to uppercase as the backend expects them that way
+      formData[item.name.toUpperCase()] = item.value;
+    });
+
+    // Update environment file with new settings
+    updateEnvSettings(formId, formData);
+  });
+}
+
+/**
+ * Special handling for form submissions
+ */
+function setupFormSubmissions() {
+  // Unified settings form submission
+  $("#unified-settings-form").on("submit", function (e) {
+    e.preventDefault();
+
+    const formData = {};
+    const $form = $(this);
+
+    // Get all form inputs including checkboxes
+    $form.find("input, select, textarea").each(function () {
+      const $input = $(this);
+      const name = $input.attr("name");
+
+      if (name) {
+        if ($input.is(":checkbox")) {
+          // For toggle switches, convert to "true"/"false" strings
+          formData[name.toUpperCase()] = $input.is(":checked")
+            ? "true"
+            : "false";
+        } else {
+          formData[name.toUpperCase()] = $input.val();
+        }
+      }
+    });
+
+    console.log("Submitting unified settings:", formData);
+
+    // Update environment file with all settings at once
+    updateEnvSettings("unified-settings-form", formData);
+  });
+}
+
+/**
+ * Start all periodic update intervals
+ */
+function startPeriodicUpdates() {
+  // Clear any existing intervals
+  stopPeriodicUpdates();
+
+  // Set new intervals
+  uploaderApp.intervals.inProgress = setInterval(handleInProgressJobs, 1000);
+  uploaderApp.intervals.queue = setInterval(handleQueueList, 5000);
+  uploaderApp.intervals.stats = setInterval(updateRealTimeStats, 2000);
+  uploaderApp.intervals.status = setInterval(checkStatus, 30000);
+  uploaderApp.intervals.dashboard = setInterval(loadDashboardActivity, 5000);
+}
+
+/**
+ * Stop all periodic update intervals
+ */
+function stopPeriodicUpdates() {
+  Object.values(uploaderApp.intervals).forEach((interval) => {
+    if (interval) clearInterval(interval);
+  });
+}
+
+/**
+ * Handle in-progress uploads display
+ */
+function handleInProgressJobs() {
+  $.getJSON("srv/api/jobs/inprogress.php", function (json) {
+    const $tableBody = $("#uploadsTable > tbody");
+    let totalUploadRate = 0;
+
+    $tableBody.empty();
+
+    if (!json.jobs || json.jobs.length === 0) {
+      $tableBody.append(
+        '<tr><td colspan="7" class="no-uploads-message text-center">No uploads in progress</td></tr>'
+      );
+      $("#download_rate").text("0.00");
+      $("#current-rate").text("0.00 MB/s");
+      $("#active-count-badge").text("0");
+      return;
+    }
+
+    // Process and display each job
+    $.each(json.jobs, function (index, data) {
+      // Parse upload speed
+      let uploadRateNumeric = 0;
+      if (data.upload_speed) {
+        const rateMatches = data.upload_speed.match(/([0-9+\.]+)([MKG])/);
+        if (rateMatches) {
+          let rate = Number(rateMatches[1]);
+          // Convert to MB/s for consistent measurement
+          if (rateMatches[2] === "K") {
+            rate = rate / 1024;
+          } else if (rateMatches[2] === "G") {
+            rate = rate * 1024;
+          }
+          totalUploadRate += rate;
+          uploadRateNumeric = rate;
+        }
+      }
+
+      // Calculate progress bar class based on percentage
+      let progressClass = "bg-secondary";
+      const progress = parseFloat(data.upload_percentage);
+
+      if (progress < 30) {
+        progressClass = "bg-danger";
+      } else if (progress < 70) {
+        progressClass = "bg-warning";
+      } else {
+        progressClass = "bg-success";
+      }
+
+      // Create a new row based on the template
+      const template = document.getElementById("upload-row-template");
+      if (!template) {
+        console.error("Upload row template not found");
+        return;
+      }
+
+      // Clone the template content
+      const rowNode = template.content.cloneNode(true);
+
+      // Fill in the data
+      rowNode.querySelector(".file-name").textContent = data.file_name;
+      rowNode.querySelector(".folder-name").textContent = data.drive;
+      rowNode.querySelector(".key-name").textContent = data.gdsa;
+      rowNode.querySelector(".progress-percentage").textContent =
+        data.upload_percentage;
+      rowNode.querySelector(".progress-bar").style.width =
+        data.upload_percentage;
+      rowNode
+        .querySelector(".progress-bar")
+        .classList.remove(
+          "bg-success",
+          "bg-warning",
+          "bg-danger",
+          "bg-secondary"
+        );
+      rowNode.querySelector(".progress-bar").classList.add(progressClass);
+      rowNode
+        .querySelector(".progress-bar")
+        .setAttribute("aria-valuenow", progress);
+      rowNode.querySelector(".file-size").textContent = data.file_size;
+
+      // Format the time remaining and speed
+      const timeRemainingEl = rowNode.querySelector(".time-remaining");
+      const uploadSpeedEl = rowNode.querySelector(".upload-speed");
+
+      timeRemainingEl.textContent = data.upload_remainingtime;
+      uploadSpeedEl.innerHTML = `<i class="fas fa-tachometer-alt"></i> ${data.upload_speed}`;
+
+      // Add a color class based on upload speed
+      if (uploadRateNumeric < 5) {
+        uploadSpeedEl.classList.add("speed-low");
+      } else if (uploadRateNumeric < 20) {
+        uploadSpeedEl.classList.add("speed-medium");
+      } else {
+        uploadSpeedEl.classList.add("speed-high");
+      }
+
+      // Append the row to the table
+      $tableBody.append(rowNode);
+    });
+
+    // Update the upload rate display
+    totalUploadRate = totalUploadRate.toFixed(2);
+    $("#download_rate").text(totalUploadRate);
+    $("#current-rate").text(`${totalUploadRate} MB/s`);
+    $("#active-count-badge").text(json.jobs.length);
+
+    // Color-code the upload rate based on speed
+    if (totalUploadRate < 5) {
+      $("#download_rate")
+        .removeClass("bg-success bg-warning")
+        .addClass("bg-danger");
+    } else if (totalUploadRate < 10) {
+      $("#download_rate")
+        .removeClass("bg-success bg-danger")
+        .addClass("bg-warning");
+    } else {
+      $("#download_rate")
+        .removeClass("bg-warning bg-danger")
+        .addClass("bg-success");
+    }
+  });
+}
+
+// Update handleCompletedJobList to use relative date by default
+function handleCompletedJobList() {
+  const $completedTableBody = $("#completedTable > tbody");
+
+  // Get previously saved page size or use default
+  const savedPageSize = getUserSetting("pageSize", 10);
+
+  // Find and activate the correct page size button
+  $("#pageSize > li.page-item").removeClass("active");
+  $(`#pageSize > li.page-item:contains("${savedPageSize}")`).addClass("active");
+
+  // Initialize pagination
+  $("#page").pagination({
+    dataSource: "srv/api/jobs/completed.php",
+    locator: "jobs",
+    ulClassName: "pagination pagination-sm",
+    totalNumberLocator: function (response) {
+      return response.total_count;
+    },
+    pageSize: savedPageSize,
+    beforePaging: function (pageNumber) {
+      // Save current page
+      uploaderApp.activePage = pageNumber;
+
+      // Only enable auto-refresh for the first page
+      if (pageNumber === 1) {
+        if (!uploaderApp.intervals.completed) {
+          uploaderApp.intervals.completed = setInterval(
+            handleCompletedJobList,
+            5000
+          );
+        }
+      } else {
+        clearInterval(uploaderApp.intervals.completed);
+        uploaderApp.intervals.completed = null;
+      }
+    },
+    afterPaging: function () {
+      // After page changes, fetch complete upload stats for today
+      fetchCompletedTodayStats();
+    },
+    callback: function (data, pagination) {
+      // Add Bootstrap classes to pagination links
+      $("#page").find("ul").children("li").addClass("page-item");
+      $("#page").find("ul").children("li").children("a").addClass("page-link");
+
+      $completedTableBody.empty();
+
+      if (!data || data.length === 0) {
+        $completedTableBody.append(
+          '<tr><td colspan="6" class="no-uploads-message text-center">No completed uploads</td></tr>'
+        );
+        $("#clnHist").hide();
+        return;
+      }
+
+      $("#clnHist").show();
+
+      // Process and display each completed job
+      // Note: We've flipped the display format - now we show relative time by default
+      $.each(data, function (index, job) {
+        // Use time_end_clean (relative time) by default, only switch if prettyEndTime is checked
+        const endTime = $("#prettyEndTime").is(":checked")
+          ? job.time_end
+          : job.time_end_clean;
+        const rowClass = job.successful === true ? "" : "table-danger";
+
+        const row = $("<tr>").addClass(rowClass);
+        row.append(
+          $("<td>")
+            .attr("data-title", "Filename")
+            .addClass("truncate")
+            .text(job.file_name)
+        );
+        row.append($("<td>").attr("data-title", "Folder").text(job.drive));
+        row.append($("<td>").attr("data-title", "Key").text(job.gdsa));
+        row.append(
+          $("<td>").attr("data-title", "Filesize").text(job.file_size)
+        );
+        row.append(
+          $("<td>")
+            .attr("data-title", "Time spent")
+            .text(job.time_elapsed || "n/a")
+        );
+        row.append($("<td>").attr("data-title", "Uploaded").text(endTime));
+
+        $completedTableBody.append(row);
+      });
+
+      // Fetch all completed uploads for today
+      fetchCompletedTodayStats();
+    },
+  });
+}
+
+/**
+ * Fetch statistics for all uploads completed today
+ */
+function fetchCompletedTodayStats() {
+  $.getJSON("srv/api/jobs/completed_today_stats.php", function (data) {
+    if (data && data.count !== undefined) {
+      uploaderApp.completedTodayCount = data.count;
+      uploaderApp.completedTodaySize = data.total_size || 0;
+
+      // Update the stats display
+      $("#completed-count").text(data.count);
+      $("#completed-total").text(`Total: ${formatFileSize(data.total_size)}`);
+    }
+  }).fail(function () {
+    // If the API doesn't exist yet, fall back to counting visible rows
+    // This is a temporary solution until the API endpoint is implemented
+    calculateCompletedTodayStats();
+  });
+}
+
+/**
+ * Calculate statistics for today's completed uploads from visible table rows
+ * This is a fallback method used until the API endpoint is implemented
+ */
+function calculateCompletedTodayStats() {
+  let completedToday = 0;
+  let totalSize = 0;
+
+  // Process visible completed uploads
+  $("#completedTable tbody tr")
+    .not(':contains("No completed")')
+    .each(function () {
+      const uploadedText = $(this).find("td:eq(5)").text();
+      const sizeText = $(this).find("td:eq(3)").text();
+
+      // Check if this upload happened today
+      if (
+        uploadedText.includes("ago") ||
+        uploadedText.includes(new Date().toLocaleDateString())
+      ) {
+        completedToday++;
+
+        // Parse the file size
+        const size = parseFileSize(sizeText);
+        totalSize += size;
+      }
+    });
+
+  // Update the stats
+  $("#completed-count").text(completedToday);
+  $("#completed-total").text(`Total: ${formatFileSize(totalSize)}`);
+
+  // Save to app state
+  uploaderApp.completedTodayCount = completedToday;
+  uploaderApp.completedTodaySize = totalSize;
+}
+
+/**
+ * Handle queue list display
+ */
+function handleQueueList() {
+  $.getJSON("srv/api/jobs/queue.php", function (json) {
+    const $tableBody = $("#queueTable > tbody");
+    $tableBody.empty();
+
+    if (!json.success || !json.files || json.files.length === 0) {
+      $tableBody.append(
+        '<tr><td colspan="6" class="no-uploads-message text-center">No files in queue</td></tr>'
+      );
+      $("#queue-count-badge").text("0");
+      return;
+    }
+
+    // Update badge count
+    $("#queue-count-badge").text(json.files.length);
+
+    // Process and display each queued file
+    $.each(json.files, function (index, file) {
+      const row = $("<tr>");
+
+      // Position number
+      row.append($("<td>").text(index + 1));
+
+      // Filename
+      row.append($("<td>").addClass("truncate").text(file.filename));
+
+      // Folder (hidden on mobile)
+      row.append(
+        $("<td>")
+          .addClass("d-none d-lg-table-cell")
+          .text(file.drive || "N/A")
+      );
+
+      // Directory (hidden on mobile)
+      row.append(
+        $("<td>")
+          .addClass("d-none d-lg-table-cell truncate")
+          .text(file.filedir || "/")
+      );
+
+      // Filesize (hidden on mobile)
+      row.append(
+        $("<td>")
+          .addClass("d-none d-lg-table-cell")
+          .text(file.filesize || "N/A")
+      );
+
+      // Added time
+      const addedTime = file.created_at
+        ? formatRelativeTime(file.created_at)
+        : "Unknown";
+      row.append($("<td>").text(addedTime));
+
+      $tableBody.append(row);
+    });
+  }).fail(function (jqXHR, textStatus, errorThrown) {
+    console.error("Failed to fetch queue list:", textStatus, errorThrown);
+    const $tableBody = $("#queueTable > tbody");
+    $tableBody.empty();
+    $tableBody.append(
+      '<tr><td colspan="6" class="no-uploads-message text-center">Error loading queue</td></tr>'
+    );
+  });
+}
+
+// Enhanced status check function
+function checkStatus() {
+  console.log("Checking uploader status");
+
+  $.getJSON("srv/api/system/status.php")
+    .done(function (json) {
+      console.log("Status response:", json);
+
+      if (json === undefined || json.status === "UNKNOWN") {
+        console.warn("Unable to check status");
+        updateStatusIndicator("error", "Unknown");
+        return;
+      }
+
+      // Update pause control button
+      alignPauseControl(json.status, false);
+
+      // Update status indicator
+      if (json.status === "STARTED") {
+        updateStatusIndicator("active", "Active");
+      } else if (json.status === "STOPPED") {
+        updateStatusIndicator("paused", "Paused");
+      } else {
+        updateStatusIndicator("stopped", "Stopped");
+      }
+    })
+    .fail(function (jqXHR, textStatus, errorThrown) {
+      console.error("Failed to check status:", textStatus, errorThrown);
+      updateStatusIndicator("error", "Error");
+    });
+}
+
+// Play/Pause button handler
+function alignPauseControl(status, fromUserAction = false) {
+  console.log("Aligning pause control to status:", status);
+
+  const $control = $("#control > button");
+  const $icon = $control.find("i");
+  const $text = $control.find("span");
+
+  if (status === "STARTED") {
+    // If uploader is RUNNING, show PAUSE icon (so user can pause it)
+    $icon.removeClass("fa-play").addClass("fa-pause");
+    $text.text("Pause");
+    $control.removeClass("bg-danger").addClass("bg-success");
+    $control.attr("aria-label", "Pause uploads");
+
+    if (fromUserAction) {
+      showStatusMessage("Uploader is running");
+      updateStatusIndicator("active", "Active");
+    }
+  } else if (status === "STOPPED") {
+    // If uploader is STOPPED, show PLAY icon (so user can resume it)
+    $icon.removeClass("fa-pause").addClass("fa-play");
+    $text.text("Resume");
+    $control.removeClass("bg-success").addClass("bg-danger");
+    $control.attr("aria-label", "Resume uploads");
+
+    if (fromUserAction) {
+      showStatusMessage("Uploader is paused");
+      updateStatusIndicator("paused", "Paused");
+    }
+  }
+}
+
+/**
+ * Update the status indicator badge
+ * @param {string} state - One of: 'active', 'paused', 'stopped', 'error'
+ * @param {string} text - Text to display
+ */
+function updateStatusIndicator(state, text) {
+  const $indicator = $("#status-indicator");
+  const $statusText = $indicator.find(".status-text");
+
+  // Remove all status classes
+  $indicator.removeClass(
+    "status-active status-paused status-stopped status-error"
+  );
+
+  // Add the new status class
+  $indicator.addClass(`status-${state}`);
+
+  // Update text
+  $statusText.text(text);
+
+  console.log(`Status indicator updated: ${state} - ${text}`);
+}
+
+/**
+ * Update the pause/play control based on service status
+ */
+function setupPauseControl() {
+  // Pause/Resume button click handler
+  $("#control > button").on("click", function () {
+    console.log("Pause/play button clicked");
+
+    // Determine action based on current state
+    const $icon = $(this).find("i");
+
+    // If we see pause icon, clicking means we want to pause
+    // If we see play icon, clicking means we want to resume
+    const action = $icon.hasClass("fa-pause") ? "pause" : "continue";
+
+    console.log("Icon class:", $icon.attr("class"), "Action:", action);
+
+    // Visual feedback while processing
+    const $button = $(this);
+    $button.css("opacity", "0.5").css("pointer-events", "none");
+
+    // Send request to API
+    $.ajax({
+      type: "POST",
+      url: "srv/api/system/status.php",
+      data: { action: action },
+      dataType: "json",
+      success: function (data) {
+        console.log("Status update response:", data);
+        if (data && data.status) {
+          alignPauseControl(data.status, true);
+        } else {
+          console.error("Invalid response from status API");
+        }
+      },
+      error: function (xhr, status, error) {
+        console.error("Failed to update status:", error);
+        console.log("Response:", xhr.responseText);
+        showStatusMessage(
+          "Failed to update status. Check console for details.",
+          true
+        );
+      },
+      complete: function () {
+        // Reset button appearance
+        $button.css("opacity", "1").css("pointer-events", "auto");
+      },
+    });
+  });
+
+  // Status indicator click handler - triggers pause/resume
+  $("#status-indicator").on("click", function () {
+    console.log("Status indicator clicked - triggering pause/resume");
+    $("#control > button").click();
+  });
+}
+
+// Update the updateRealTimeStats function
+function updateRealTimeStats() {
+  // Get current upload rate
+  const currentRate = $("#download_rate").text() || "0.00";
+  $("#current-rate").text(`${currentRate} MB/s`);
+
+  // Update rate progress bar
+  const bandwidthLimit = parseFloat(
+    uploaderApp.envSettings.BANDWIDTH_LIMIT ||
+      $("#bandwidth_limit").val() ||
+      "30"
+  );
+  const rateValue = parseFloat(currentRate);
+  const ratePercentage = Math.min((rateValue / bandwidthLimit) * 100, 100);
+  $("#rate-progress .progress-bar-mini").css("width", ratePercentage + "%");
+
+  // Get active uploads count
+  const activeUploads =
+    $("#uploadsTable tbody tr").not(':contains("No uploads")').length || 0;
+  $("#active-count").text(activeUploads);
+
+  // Update active count badge
+  $("#active-count-badge").text(activeUploads);
+
+  // Update overview cards
+  $("#overview-active").text(activeUploads);
+  $("#overview-rate").text(`${currentRate} MB/s`);
+
+  // Update queue stats separately - don't use active uploads count
+  updateQueueStats();
+
+  // Set the current max active transfers
+  const maxTransfers =
+    uploaderApp.envSettings.TRANSFERS || $("#transfers").val() || "2";
+  $("#active-max").text(`Max: ${maxTransfers}`);
+
+  // Set the bandwidth limit
+  $("#rate-limit").html(
+    `<i class="fas fa-gauge-high"></i> Limit: ${bandwidthLimit} MB/s per transfer`
+  );
+
+  // Update system overview
+  updateSystemOverview();
+}
+
+/**
+ * Update system overview card with uptime and storage info
+ */
+function updateSystemOverview() {
+  // Update uptime and storage with a single API call
+  fetch("srv/api/system/status.php")
+    .then((response) => response.json())
+    .then((data) => {
+      console.log("System overview data:", data);
+
+      if (data) {
+        // Update uptime
+        if (data.uptime) {
+          $("#system-uptime").text(data.uptime);
+        }
+
+        // Update storage
+        if (data.storage) {
+          $("#storage-used").text(data.storage);
+        }
+
+        // Update system status with dynamic styling
+        if (data.status) {
+          const $statusValue = $("#system-status-mini");
+          const $statusIcon = $("#system-status-icon");
+          const $statusIconI = $statusIcon.find("i");
+
+          // Remove all color classes
+          $statusValue.removeClass("value-green value-red value-orange");
+          $statusIcon.removeClass(
+            "gradient-green gradient-red gradient-orange"
+          );
+
+          if (data.status === "STARTED") {
+            $statusValue.text("Online").addClass("value-green");
+            $statusIcon.addClass("gradient-green");
+            $statusIconI
+              .removeClass("fa-times-circle fa-pause-circle")
+              .addClass("fa-check-circle");
+          } else if (data.status === "STOPPED") {
+            $statusValue.text("Stopped").addClass("value-orange");
+            $statusIcon.addClass("gradient-orange");
+            $statusIconI
+              .removeClass("fa-check-circle fa-times-circle")
+              .addClass("fa-pause-circle");
+          } else {
+            $statusValue.text("Offline").addClass("value-red");
+            $statusIcon.addClass("gradient-red");
+            $statusIconI
+              .removeClass("fa-check-circle fa-pause-circle")
+              .addClass("fa-times-circle");
+          }
+        }
+      }
+    })
+    .catch((error) => {
+      console.error("Failed to fetch system overview:", error);
+
+      // On error, show red error state
+      const $statusValue = $("#system-status-mini");
+      const $statusIcon = $("#system-status-icon");
+      const $statusIconI = $statusIcon.find("i");
+
+      $statusValue
+        .removeClass("value-green value-orange")
+        .addClass("value-red")
+        .text("Error");
+      $statusIcon
+        .removeClass("gradient-green gradient-orange")
+        .addClass("gradient-red");
+      $statusIconI
+        .removeClass("fa-check-circle fa-pause-circle")
+        .addClass("fa-times-circle");
+
+      $("#system-uptime").text("Error");
+      $("#storage-used").text("Error");
+    });
+}
+
+/**
+ * Load environment settings from the server
+ */
+function loadEnvSettings() {
+  // First try the new API endpoint
+  $.getJSON("srv/api/settings/update.php")
+    .done(function (data) {
+      if (data && data.success && data.settings) {
+        uploaderApp.envSettings = data.settings;
+
+        // Populate form fields with loaded settings
+        populateFormFields(data.settings);
+
+        // Update UI elements that depend on settings
+        updateUIFromSettings(data.settings);
+      } else {
+        console.warn(
+          "New settings API returned invalid data, falling back to legacy endpoint"
+        );
+        loadEnvSettingsLegacy();
+      }
+    })
+    .fail(function () {
+      console.warn(
+        "New settings API not available, falling back to legacy endpoint"
+      );
+      loadEnvSettingsLegacy();
+    });
+}
+
+/**
+ * Legacy method to load environment settings
+ * This will be used if the new API is not available
+ */
+function loadEnvSettingsLegacy() {
+  $.getJSON("srv/api/system/env_settings.php")
+    .done(function (data) {
+      if (data && typeof data === "object") {
+        uploaderApp.envSettings = data;
+
+        // Populate form fields with loaded settings
+        populateFormFields(data);
+
+        // Update UI elements that depend on settings
+        updateUIFromSettings(data);
+      } else {
+        console.warn("Failed to load environment settings from legacy API");
+      }
+    })
+    .fail(function () {
+      console.warn("Failed to load environment settings from any API");
+
+      // Use default values for essential settings
+      const defaultSettings = {
+        TRANSFERS: 2,
+        BANDWIDTH_LIMIT: "30M",
+        FOLDER_DEPTH: 1,
+        MIN_AGE_UPLOAD: 1,
+      };
+
+      uploaderApp.envSettings = defaultSettings;
+      populateFormFields(defaultSettings);
+      updateUIFromSettings(defaultSettings);
+    });
+}
+
+/**
+ * Populate form fields with settings
+ * @param {Object} settings - Settings object
+ */
+function populateFormFields(settings) {
+  Object.entries(settings).forEach(([key, value]) => {
+    // Try to find the form field (case insensitive)
+    const $field = $(`[name="${key}"], [name="${key.toLowerCase()}"]`);
+
+    if ($field.length) {
+      if ($field.is("select")) {
+        $field.val(value.toString());
+      } else if ($field.is(":checkbox")) {
+        $field.prop("checked", value === true || value === "true");
+      } else {
+        $field.val(value);
+      }
+    }
+  });
+}
+
+/**
+ * Update UI elements based on loaded settings
+ * @param {Object} settings - Settings object
+ */
+function updateUIFromSettings(settings) {
+  // Update max transfers display
+  if (settings.TRANSFERS || settings.transfers) {
+    const transfers = settings.TRANSFERS || settings.transfers;
+    $("#active-max").text(`Max: ${transfers}`);
+  }
+
+  // Update bandwidth limit display
+  if (settings.BANDWIDTH_LIMIT || settings.bandwidth_limit) {
+    const bwLimit = settings.BANDWIDTH_LIMIT || settings.bandwidth_limit;
+    // Remove quotes if present
+    const cleanBwLimit = bwLimit.replace(/"/g, "");
+    $("#rate-limit").text(`Limit per Transfer: ${cleanBwLimit}`);
+  }
+}
+
+/**
+ * Update environment settings
+ * @param {string} formId - Form ID that was submitted
+ * @param {Object} settings - Settings to update
+ */
+function updateEnvSettings(formId, settings) {
+  console.log("Updating settings:", settings);
+
+  // Create a loading indicator
+  const $form = $(`#${formId}`);
+  const $submitBtn = $form.find('button[type="submit"]');
+  const originalText = $submitBtn.text();
+  $submitBtn.prop("disabled", true).text("Saving...");
+
+  // Add a safety timeout to restore button state even if AJAX fails
+  const resetTimeout = setTimeout(() => {
+    $submitBtn.prop("disabled", false).text(originalText);
+    console.log("Button state restored by safety timeout");
+  }, 8000);
+
+  // Special handling for BANDWIDTH_LIMIT
+  if (
+    settings.BANDWIDTH_LIMIT !== undefined &&
+    settings.BANDWIDTH_LIMIT !== "null" &&
+    settings.BANDWIDTH_LIMIT !== "" &&
+    !/[KMG]$/i.test(settings.BANDWIDTH_LIMIT)
+  ) {
+    // Append 'M' if no unit is specified
+    settings.BANDWIDTH_LIMIT = settings.BANDWIDTH_LIMIT + "M";
+    console.log("Added M suffix to bandwidth limit:", settings.BANDWIDTH_LIMIT);
+  }
+
+  // Make actual API call to update env settings
+  $.ajax({
+    url: "srv/api/system/update_env.php",
+    type: "POST",
+    data: JSON.stringify(settings),
+    contentType: "application/json",
+    dataType: "json",
+    success: function (response) {
+      console.log("API response:", response);
+
+      if (response.success) {
+        showStatusMessage("Settings updated successfully!");
+
+        // Update local settings
+        Object.assign(uploaderApp.envSettings, settings);
+
+        // Update UI based on form ID
+        switch (formId) {
+          case "transfer-form":
+            // Update transfer settings UI
+            $("#active-max").text(`Max: ${settings.TRANSFERS || "2"}`);
+            $("#rate-limit").text(
+              `Limit per Transfer: ${settings.BANDWIDTH_LIMIT || "30M"}`
+            );
+            break;
+
+          case "system-form":
+            // Update system settings UI if needed
+            break;
+
+          case "notification-form":
+            // Update notification settings UI if needed
+            break;
+
+          case "autoscan-form":
+            // Update autoscan settings UI if needed
+            break;
+
+          case "security-form":
+            // Update security settings UI if needed
+            break;
+        }
+      } else {
+        // Try legacy API if new one fails
+        updateEnvSettingsLegacy(
+          formId,
+          settings,
+          $submitBtn,
+          originalText,
+          function (success) {
+            if (!success) {
+              showStatusMessage(
+                "Failed to update settings: " +
+                  (response.message || "Unknown error"),
+                true
+              );
+            }
+          }
+        );
+      }
+    },
+    error: function (xhr, status, error) {
+      console.error("Failed to use new settings API:", status, error);
+      // Try legacy API as fallback
+      updateEnvSettingsLegacy(
+        formId,
+        settings,
+        $submitBtn,
+        originalText,
+        function (success) {
+          if (!success) {
+            showStatusMessage("Failed to communicate with the server", true);
+            console.error("Response:", xhr.responseText);
+          }
+        }
+      );
+    },
+    complete: function () {
+      // Clear the safety timeout
+      clearTimeout(resetTimeout);
+      // Restore button state
+      $submitBtn.prop("disabled", false).text(originalText);
+      console.log("Button state restored in complete callback");
+    },
+  });
+}
+
+/**
+ * Legacy method to update environment settings
+ * @param {string} formId - Form ID
+ * @param {Object} settings - Settings object
+ * @param {jQuery} $submitBtn - Submit button jQuery object
+ * @param {string} originalText - Original button text
+ * @param {Function} callback - Callback function
+ */
+function updateEnvSettingsLegacy(
+  formId,
+  settings,
+  $submitBtn,
+  originalText,
+  callback
+) {
+  // Convert settings keys to lowercase for legacy API
+  const legacySettings = {};
+  Object.keys(settings).forEach((key) => {
+    legacySettings[key.toLowerCase()] = settings[key];
+  });
+
+  $.ajax({
+    url: "srv/api/system/update_env.php",
+    type: "POST",
+    data: JSON.stringify(legacySettings),
+    contentType: "application/json",
+    dataType: "json",
+    success: function (response) {
+      if (response.success) {
+        showStatusMessage("Settings updated successfully!");
+
+        // Update local settings
+        Object.assign(uploaderApp.envSettings, settings);
+
+        // Update UI based on form ID
+        switch (formId) {
+          case "transfer-form":
+            $("#active-max").text(`Max: ${legacySettings.transfers || "2"}`);
+            $("#rate-limit").text(
+              `Limit per Transfer: ${legacySettings.bandwidth_limit || "30M"}`
+            );
+            break;
+        }
+
+        if (callback) callback(true);
+      } else {
+        if (callback) callback(false);
+      }
+    },
+    error: function () {
+      if (callback) callback(false);
+    },
+    complete: function () {
+      // Also restore button state in legacy handler
+      if ($submitBtn && originalText) {
+        $submitBtn.prop("disabled", false).text(originalText);
+        console.log("Button state restored in legacy complete callback");
+      }
+    },
+  });
+}
+
+function updateQueueStats() {
+  $.getJSON("srv/api/jobs/queue_stats.php", function (data) {
+    if (data && typeof data === "object") {
+      // Update the queue count
+      const queueCount = data.count || 0;
+      $("#queue-count").text(queueCount);
+      $("#overview-queue").text(queueCount);
+
+      // Format the total size nicely
+      const totalSize = formatFileSize(data.total_size || 0);
+      $("#queue-total").text(`Total: ${totalSize}`);
+    }
+  }).fail(function () {
+    // Fallback if API doesn't exist yet
+    console.log("Queue stats API not available, using fallback method");
+    estimateQueueStats();
+  });
+}
+
+// Fallback method to estimate queue stats until API is available
+function estimateQueueStats() {
+  // Use the uploads table as a fallback
+  $.getJSON("srv/api/jobs/inprogress.php", function (data) {
+    const queueCount = data.jobs ? data.jobs.length : 0;
+    $("#queue-count").text(queueCount);
+    $("#overview-queue").text(queueCount);
+
+    let totalSize = 0;
+    if (data.jobs && data.jobs.length > 0) {
+      data.jobs.forEach(function (job) {
+        totalSize += parseFileSize(job.file_size);
+      });
+    }
+
+    $("#queue-total").text(`Total: ${formatFileSize(totalSize)}`);
+  });
+}
+
+/**
+ * Load dashboard activity sections
+ */
+function loadDashboardActivity() {
+  loadDashboardQueue();
+  loadDashboardActive();
+  loadDashboardHistory();
+}
+
+/**
+ * Load latest queue items for dashboard
+ */
+function loadDashboardQueue() {
+  $.getJSON("srv/api/jobs/queue.php", function (data) {
+    const $tbody = $("#dashboard-queue-table tbody");
+    $tbody.empty();
+
+    if (!data.files || data.files.length === 0) {
+      $tbody.append(
+        '<tr><td colspan="5" class="text-center">No files in queue</td></tr>'
+      );
+      return;
+    }
+
+    // Show only latest 5 items
+    const files = data.files.slice(0, 5);
+    files.forEach(function (file) {
+      const size = formatFileSize(parseFileSize(file.filesize));
+      const time = formatRelativeTime(file.created_at);
+      const $row = $(`
+        <tr>
+          <td class="truncate">${escapeHtml(file.filename)}</td>
+          <td>${escapeHtml(file.drive || "N/A")}</td>
+          <td class="truncate">${escapeHtml(file.filedir || "")}</td>
+          <td>${size}</td>
+          <td>${time}</td>
+        </tr>
+      `);
+      $tbody.append($row);
+    });
+  }).fail(function () {
+    $("#dashboard-queue-table tbody").html(
+      '<tr><td colspan="5" class="text-center">Failed to load queue</td></tr>'
+    );
+  });
+}
+
+/**
+ * Load latest active uploads for dashboard
+ */
+function loadDashboardActive() {
+  $.getJSON("srv/api/jobs/inprogress.php", function (data) {
+    const $tbody = $("#dashboard-active-table tbody");
+    $tbody.empty();
+
+    if (!data.jobs || data.jobs.length === 0) {
+      $tbody.append(
+        '<tr><td colspan="6" class="text-center">No active uploads</td></tr>'
+      );
+      return;
+    }
+
+    // Show only latest 5 items
+    const jobs = data.jobs.slice(0, 5);
+    jobs.forEach(function (job) {
+      const size = formatFileSize(parseFileSize(job.file_size));
+      const progress = parseInt(job.upload_percentage) || 0;
+      const speed = job.upload_speed || "0 MB/s";
+
+      const $row = $(`
+        <tr>
+          <td class="truncate">${escapeHtml(
+            job.file_name || job.job_name || "Unknown"
+          )}</td>
+          <td>${escapeHtml(job.drive || "N/A")}</td>
+          <td class="truncate">${escapeHtml(job.file_directory || "N/A")}</td>
+          <td>
+            <div class="progress-container">
+              <div class="progress-info">
+                <span class="progress-percentage">${progress}%</span>
+              </div>
+              <div class="progress">
+                <div class="progress-bar bg-success" style="width: ${progress}%"></div>
+              </div>
+            </div>
+          </td>
+          <td>${size}</td>
+          <td>${speed}</td>
+        </tr>
+      `);
+      $tbody.append($row);
+    });
+  }).fail(function () {
+    $("#dashboard-active-table tbody").html(
+      '<tr><td colspan="6" class="text-center">Failed to load active uploads</td></tr>'
+    );
+  });
+}
+
+/**
+ * Load latest history for dashboard
+ */
+function loadDashboardHistory() {
+  $.getJSON("srv/api/jobs/completed.php?page=1", function (data) {
+    const $tbody = $("#dashboard-history-table tbody");
+    $tbody.empty();
+
+    if (!data.jobs || data.jobs.length === 0) {
+      $tbody.append(
+        '<tr><td colspan="4" class="text-center">No upload history</td></tr>'
+      );
+      return;
+    }
+
+    // Show only latest 5 items
+    const jobs = data.jobs.slice(0, 5);
+    jobs.forEach(function (job) {
+      const size = job.file_size || "N/A";
+      const time = job.time_end_clean || "N/A";
+
+      const $row = $(`
+        <tr>
+          <td class="truncate">${escapeHtml(job.file_name || "")}</td>
+          <td>${escapeHtml(job.drive || "N/A")}</td>
+          <td>${size}</td>
+          <td>${time}</td>
+        </tr>
+      `);
+      $tbody.append($row);
+    });
+  }).fail(function () {
+    $("#dashboard-history-table tbody").html(
+      '<tr><td colspan="4" class="text-center">Failed to load history</td></tr>'
+    );
+  });
+}
diff --git a/apps/docker-uploader/root/var/www/html/js/utils.js b/apps/docker-uploader/root/var/www/html/js/utils.js
new file mode 100644
index 0000000000..90e8af5792
--- /dev/null
+++ b/apps/docker-uploader/root/var/www/html/js/utils.js
@@ -0,0 +1,534 @@
+/**
+ * Utility functions for the Uploader Dashboard
+ */
+
+/**
+ * Format file size to appropriate unit (Bytes, KB, MB, GB, TB)
+ * @param {number} bytes - Size in bytes
+ * @param {number} decimals - Number of decimal places to display
+ * @returns {string} Formatted size with unit
+ */
+function formatFileSize(bytes, decimals = 2) {
+  if (bytes === 0) return "0 Bytes";
+
+  const k = 1024;
+  const dm = decimals < 0 ? 0 : decimals;
+  const sizes = ["Bytes", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];
+
+  const i = Math.floor(Math.log(bytes) / Math.log(k));
+
+  return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + " " + sizes[i];
+}
+
+/**
+ * Parse file size string to bytes
+ * @param {string} sizeStr - Size string (e.g. "2.5 GB", "500 MB")
+ * @returns {number} Size in bytes
+ */
+function parseFileSize(sizeStr) {
+  if (!sizeStr) return 0;
+
+  // Extract numeric part and unit
+  const match = sizeStr.match(/^([\d.]+)\s*([KMGT]?B?)$/i);
+  if (!match) return 0;
+
+  const num = parseFloat(match[1]);
+  const unit = match[2].toUpperCase();
+
+  // Convert based on unit
+  const multipliers = {
+    B: 1,
+    KB: 1024,
+    MB: 1024 ** 2,
+    GB: 1024 ** 3,
+    TB: 1024 ** 4,
+    // Handle short forms
+    K: 1024,
+    M: 1024 ** 2,
+    G: 1024 ** 3,
+    T: 1024 ** 4,
+  };
+
+  return num * (multipliers[unit] || 1);
+}
+
+/**
+ * Format a timestamp to a human-readable relative time (e.g., "2 hours ago")
+ * @param {number} timestamp - Unix timestamp
+ * @returns {string} Relative time string
+ */
+function formatRelativeTime(timestamp) {
+  const now = Math.floor(Date.now() / 1000);
+  const diff = now - timestamp;
+
+  // Time intervals in seconds
+  const intervals = [
+    { label: "year", seconds: 31536000 },
+    { label: "month", seconds: 2592000 },
+    { label: "week", seconds: 604800 },
+    { label: "day", seconds: 86400 },
+    { label: "hour", seconds: 3600 },
+    { label: "minute", seconds: 60 },
+    { label: "second", seconds: 1 },
+  ];
+
+  for (const interval of intervals) {
+    const count = Math.floor(diff / interval.seconds);
+    if (count >= 1) {
+      return `${count} ${interval.label}${count !== 1 ? "s" : ""} ago`;
+    }
+  }
+
+  return "just now";
+}
+
+/**
+ * Format a timestamp to a date/time string
+ * @param {number} timestamp - Unix timestamp
+ * @returns {string} Formatted date string
+ */
+function formatDateTime(timestamp) {
+  const date = new Date(timestamp * 1000);
+  return date.toLocaleString();
+}
+
+/**
+ * Check if a date is today
+ * @param {Date|number|string} dateInput - Date to check
+ * @returns {boolean} True if the date is today
+ */
+function isToday(dateInput) {
+  const date = dateInput instanceof Date ? dateInput : new Date(dateInput);
+  const today = new Date();
+
+  return (
+    date.getDate() === today.getDate() &&
+    date.getMonth() === today.getMonth() &&
+    date.getFullYear() === today.getFullYear()
+  );
+}
+
+/**
+ * Fetch data with error handling
+ * @param {string} url - URL to fetch
+ * @param {Object} options - Fetch options
+ * @returns {Promise<any>} Response data
+ */
+async function fetchWithErrorHandling(url, options = {}) {
+  try {
+    const response = await fetch(url, options);
+
+    if (!response.ok) {
+      throw new Error(`HTTP error ${response.status}`);
+    }
+
+    return await response.json();
+  } catch (error) {
+    console.error("Fetch error:", error);
+    showStatusMessage(`Failed to fetch data: ${error.message}`, true);
+    throw error;
+  }
+}
+
+/**
+ * Show a status message
+ * @param {string} message - Message to display
+ * @param {boolean} isError - Whether this is an error message
+ */
+function showStatusMessage(message, isError = false) {
+  const statusMessage = document.getElementById("status-message");
+  if (!statusMessage) {
+    console.error("Status message element not found");
+    console.log(message);
+    return;
+  }
+
+  statusMessage.textContent = message;
+
+  if (isError) {
+    statusMessage.classList.add("error");
+  } else {
+    statusMessage.classList.remove("error");
+  }
+
+  statusMessage.style.display = "block";
+
+  // Hide after 3 seconds
+  setTimeout(() => {
+    statusMessage.style.display = "none";
+  }, 3000);
+}
+
+/**
+ * Debounce function to limit the rate at which a function can fire
+ * @param {Function} func - Function to debounce
+ * @param {number} wait - Wait time in milliseconds
+ * @returns {Function} Debounced function
+ */
+function debounce(func, wait) {
+  let timeout;
+
+  return function executedFunction(...args) {
+    const later = () => {
+      clearTimeout(timeout);
+      func(...args);
+    };
+
+    clearTimeout(timeout);
+    timeout = setTimeout(later, wait);
+  };
+}
+
+/**
+ * Get query parameters from URL
+ * @returns {Object} Object containing query parameters
+ */
+function getQueryParams() {
+  const params = {};
+  const searchParams = new URLSearchParams(window.location.search);
+
+  for (const [key, value] of searchParams.entries()) {
+    params[key] = value;
+  }
+
+  return params;
+}
+
+/**
+ * Save a user setting to localStorage
+ * @param {string} key - Setting key
+ * @param {any} value - Setting value
+ */
+function saveUserSetting(key, value) {
+  try {
+    localStorage.setItem(`uploader_${key}`, JSON.stringify(value));
+  } catch (error) {
+    console.error("Failed to save setting:", error);
+  }
+}
+
+/**
+ * Get a user setting from localStorage
+ * @param {string} key - Setting key
+ * @param {any} defaultValue - Default value if setting doesn't exist
+ * @returns {any} Setting value
+ */
+function getUserSetting(key, defaultValue) {
+  try {
+    const value = localStorage.getItem(`uploader_${key}`);
+    return value !== null ? JSON.parse(value) : defaultValue;
+  } catch (error) {
+    console.error("Failed to retrieve setting:", error);
+    return defaultValue;
+  }
+}
+
+/**
+ * Creates a mock Chart.js chart for the upload history if Chart.js is loaded
+ * @param {string} chartId - ID of the canvas element
+ * @param {string} timeRange - Time range to display (day, week, month)
+ */
+function createMockUploadChart(chartId, timeRange = "week") {
+  if (!window.Chart) {
+    console.warn("Chart.js not loaded, skipping chart creation");
+    return;
+  }
+
+  const ctx = document.getElementById(chartId);
+  if (!ctx) return;
+
+  // Clean up any existing chart
+  if (window.uploadChart) {
+    window.uploadChart.destroy();
+  }
+
+  // Generate mock data based on timeRange
+  const labels = [];
+  const uploadData = [];
+  const completedData = [];
+
+  const today = new Date();
+  let days = 7;
+
+  switch (timeRange) {
+    case "day":
+      days = 1;
+      // Generate hourly data for the last 24 hours
+      for (let i = 0; i < 24; i++) {
+        const hour = new Date(today);
+        hour.setHours(today.getHours() - 23 + i);
+        labels.push(
+          hour.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" })
+        );
+        uploadData.push(Math.floor(Math.random() * 5) + 1); // 1-5 GB/hour
+        completedData.push(Math.floor(Math.random() * 4) + 1); // 1-4 files/hour
+      }
+      break;
+
+    case "month":
+      days = 30;
+      // Generate daily data for the last 30 days
+      for (let i = 0; i < days; i++) {
+        const day = new Date(today);
+        day.setDate(today.getDate() - (days - 1) + i);
+        labels.push(
+          day.toLocaleDateString([], { month: "short", day: "numeric" })
+        );
+        uploadData.push(Math.floor(Math.random() * 20) + 5); // 5-25 GB/day
+        completedData.push(Math.floor(Math.random() * 15) + 5); // 5-20 files/day
+      }
+      break;
+
+    case "week":
+    default:
+      // Generate daily data for the last 7 days
+      for (let i = 0; i < days; i++) {
+        const day = new Date(today);
+        day.setDate(today.getDate() - (days - 1) + i);
+        labels.push(day.toLocaleDateString([], { weekday: "short" }));
+        uploadData.push(Math.floor(Math.random() * 15) + 3); // 3-18 GB/day
+        completedData.push(Math.floor(Math.random() * 10) + 2); // 2-12 files/day
+      }
+      break;
+  }
+
+  // Create chart
+  window.uploadChart = new Chart(ctx, {
+    type: "bar",
+    data: {
+      labels: labels,
+      datasets: [
+        {
+          label: "Upload Volume (GB)",
+          data: uploadData,
+          backgroundColor: getComputedStyle(
+            document.documentElement
+          ).getPropertyValue("--accent-transparent"),
+          borderColor: getComputedStyle(
+            document.documentElement
+          ).getPropertyValue("--accent-color"),
+          borderWidth: 1,
+          yAxisID: "y",
+        },
+        {
+          label: "Files Completed",
+          data: completedData,
+          type: "line",
+          backgroundColor: "rgba(75, 192, 192, 0.2)",
+          borderColor: "rgba(75, 192, 192, 1)",
+          borderWidth: 2,
+          pointRadius: 3,
+          pointBackgroundColor: "rgba(75, 192, 192, 1)",
+          yAxisID: "y1",
+        },
+      ],
+    },
+    options: {
+      responsive: true,
+      maintainAspectRatio: false,
+      scales: {
+        y: {
+          beginAtZero: true,
+          title: {
+            display: true,
+            text: "Upload Volume (GB)",
+          },
+          grid: {
+            color: "rgba(255, 255, 255, 0.1)",
+          },
+          ticks: {
+            color: "rgba(255, 255, 255, 0.7)",
+          },
+        },
+        y1: {
+          beginAtZero: true,
+          position: "right",
+          title: {
+            display: true,
+            text: "Files Completed",
+          },
+          grid: {
+            drawOnChartArea: false,
+          },
+          ticks: {
+            color: "rgba(75, 192, 192, 0.7)",
+          },
+        },
+        x: {
+          grid: {
+            color: "rgba(255, 255, 255, 0.1)",
+          },
+          ticks: {
+            color: "rgba(255, 255, 255, 0.7)",
+          },
+        },
+      },
+      plugins: {
+        legend: {
+          labels: {
+            color: "rgba(255, 255, 255, 0.7)",
+          },
+        },
+        tooltip: {
+          mode: "index",
+          intersect: false,
+        },
+      },
+    },
+  });
+}
+
+/**
+ * Update the theme colors for the chart
+ */
+function updateChartThemeColors() {
+  if (!window.uploadChart) return;
+
+  const accentColor = getComputedStyle(document.documentElement)
+    .getPropertyValue("--accent-color")
+    .trim();
+  const accentTransparent = getComputedStyle(document.documentElement)
+    .getPropertyValue("--accent-transparent")
+    .trim();
+
+  window.uploadChart.data.datasets[0].borderColor = accentColor;
+  window.uploadChart.data.datasets[0].backgroundColor = accentTransparent;
+  window.uploadChart.update();
+}
+
+/**
+ * Set the theme for the application
+ * @param {string} theme - Theme name
+ */
+function setTheme(theme) {
+  console.log("Applying theme:", theme);
+
+  // Apply theme attributes
+  document.documentElement.setAttribute("data-theme", theme);
+  document.body.setAttribute("data-theme", theme);
+
+  updateThemeBackground(theme);
+
+  // Update active visual state
+  const themeOptions = document.querySelectorAll(".theme-option");
+  themeOptions.forEach((option) => {
+    if (option.dataset.theme === theme) {
+      option.classList.add("active");
+    } else {
+      option.classList.remove("active");
+    }
+  });
+
+  updateChartThemeColors();
+
+  // Save theme in a single place
+  saveUserSetting("theme", theme);
+}
+
+// Alternative jQuery implementation
+// $(".theme-option").removeClass("active");
+// $(`.theme-option[data-theme="${theme}"]`).addClass("active");
+
+// Update chart colors when theme changes
+
+/**
+ * Ensure theme backgrounds apply correctly
+ * @param {string} theme - Theme name
+ */
+function updateThemeBackground(theme) {
+  const themesWithBackgrounds = [
+    "overseerr",
+    "hotline",
+    "maroon",
+    "plex",
+    "aquamarine",
+    "dark",
+    "nord",
+    "dracula",
+    "space-gray",
+    "hotpink",
+  ];
+
+  // Clear any existing background properties
+  document.body.style.background = "";
+  document.body.style.backgroundImage = "none";
+  document.body.style.backgroundColor = "";
+
+  // Apply the theme data attribute which will activate the CSS rules
+  document.documentElement.setAttribute("data-theme", theme);
+  document.body.setAttribute("data-theme", theme);
+
+  // For themes with custom backgrounds, we need to ensure they get applied
+  if (themesWithBackgrounds.includes(theme)) {
+    // Force a repaint to ensure background styles apply correctly
+    void document.body.offsetWidth;
+  }
+}
+
+/**
+ * Initialize theme on page load
+ */
+function initializeTheme() {
+  console.log("Initializing theme...");
+
+  // Try both storage methods for backward compatibility
+  let savedTheme;
+
+  try {
+    // First try direct localStorage (used in index.html)
+    const directTheme = localStorage.getItem("uploader_theme");
+    if (directTheme) {
+      savedTheme = JSON.parse(directTheme);
+    } else {
+      // Fallback to getUserSetting method
+      savedTheme = getUserSetting("theme", "dark");
+    }
+  } catch (error) {
+    console.warn("Error loading theme, using default:", error);
+    savedTheme = "dark";
+  }
+
+  setTheme(savedTheme);
+  saveUserSetting("theme", savedTheme);
+}
+
+/**
+ * Setup event listeners for theme switching
+ */
+function setupThemeEventListeners() {
+  // Theme selection using event delegation for better performance
+  document.addEventListener("click", function (e) {
+    const themeOption = e.target.closest(".theme-option");
+    if (themeOption) {
+      const theme = themeOption.dataset.theme;
+      setTheme(theme);
+      saveUserSetting("theme", theme);
+    }
+  });
+
+  // Alternative jQuery implementation
+  // $(".theme-option").on("click", function () {
+  //   const theme = $(this).data("theme");
+  //   setTheme(theme);
+  //   saveUserSetting("theme", theme);
+  // });
+}
+
+/**
+ * Escape HTML special characters to prevent XSS
+ * @param {string} text - Text to escape
+ * @returns {string} Escaped text
+ */
+function escapeHtml(text) {
+  if (!text) return "";
+  const map = {
+    "&": "&amp;",
+    "<": "&lt;",
+    ">": "&gt;",
+    '"': "&quot;",
+    "'": "&#039;",
+  };
+  return String(text).replace(/[&<>"']/g, function (m) {
+    return map[m];
+  });
+}
diff --git a/apps/docker-uploader/root/var/www/html/logo.png b/apps/docker-uploader/root/var/www/html/logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..45624629bb626e15df0ba98fd92bb2447761df61
GIT binary patch
literal 24095
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

literal 0
HcmV?d00001

diff --git a/apps/docker-uploader/root/var/www/html/release.json b/apps/docker-uploader/root/var/www/html/release.json
new file mode 100644
index 0000000000..95159a2072
--- /dev/null
+++ b/apps/docker-uploader/root/var/www/html/release.json
@@ -0,0 +1,10 @@
+{
+  "appname": "docker-uploader",
+  "apppic": "./images/docker-uploader.png",
+  "appfolder": "./",
+  "newversion": "5.0.0",
+  "baseimage": "ghcr.io/linuxserver/baseimage-alpine",
+  "baseversion": "3.18-bd2a5b02-ls10",
+  "body": "Upgrading docker-uploader to ",
+  "user": "dockserver image update[bot]"
+}
diff --git a/apps/docker-uploader/root/var/www/html/srv/api/jobs/completed.php b/apps/docker-uploader/root/var/www/html/srv/api/jobs/completed.php
index 73c465ff09..d214f13fa2 100755
--- a/apps/docker-uploader/root/var/www/html/srv/api/jobs/completed.php
+++ b/apps/docker-uploader/root/var/www/html/srv/api/jobs/completed.php
@@ -8,60 +8,71 @@ function processJsonFiles()
 {
     $response = new ApiResponse();
     $response->jobs = [];
-    $db = new SQLite3(DATABASE, SQLITE3_OPEN_READONLY);
-    $pagination_query = "";
-    $count_result = $db->query("SELECT count(*) as COUNT FROM completed_uploads");
-    //Check GET parameter..
-    $total_records = $count_result->fetchArray()['COUNT'];
-    $response->total_count = $total_records; // Save total completed job count to let frontend calculate pagination
-    if (isset($_GET["pageNumber"]) && isset($_GET["pageSize"])
-        && is_numeric($_GET["pageNumber"]) && is_numeric($_GET["pageSize"]) && $total_records >= 5) {
-        $current_page = intval($_GET["pageNumber"]);
-        $page_size = intval($_GET["pageSize"]);
-        $total_pages = ceil($total_records / $page_size);
-        // Validate parameters and default them if necessary
-        if ($current_page > $total_pages) {
-            $current_page = $total_pages;
-        }
-        if ($current_page < 1) {
-            $current_page = 1;
-        }
-        if ($page_size > 50 || $page_size < 1) {
-            $page_size = 10;
-        }
 
-        // Slice the data
-        $offset = ($current_page - 1) * $page_size;
-        $pagination_query .= " LIMIT $page_size OFFSET $offset ";
-    }
+    try {
+        $db = new SQLite3(DATABASE, SQLITE3_OPEN_READONLY);
+        $db->busyTimeout(5000); // Wait up to 5 seconds if database is locked
+        $pagination_query = "";
+        $count_result = $db->query("SELECT count(*) as COUNT FROM completed_uploads");
+        //Check GET parameter..
+        $total_records = $count_result->fetchArray()['COUNT'];
+        $response->total_count = $total_records; // Save total completed job count to let frontend calculate pagination
+        if (
+            isset($_GET["pageNumber"]) && isset($_GET["pageSize"])
+            && is_numeric($_GET["pageNumber"]) && is_numeric($_GET["pageSize"]) && $total_records >= 5
+        ) {
+            $current_page = intval($_GET["pageNumber"]);
+            $page_size = intval($_GET["pageSize"]);
+            $total_pages = ceil($total_records / $page_size);
+            // Validate parameters and default them if necessary
+            if ($current_page > $total_pages) {
+                $current_page = $total_pages;
+            }
+            if ($current_page < 1) {
+                $current_page = 1;
+            }
+            if ($page_size > 50 || $page_size < 1) {
+                $page_size = 10;
+            }
 
-    $results = $db->query("SELECT drive, filedir, filebase, filesize, gdsa, starttime, endtime, status
+            // Slice the data
+            $offset = ($current_page - 1) * $page_size;
+            $pagination_query .= " LIMIT $page_size OFFSET $offset ";
+        }
+
+        $results = $db->query("SELECT drive, filedir, filebase, filesize, gdsa, starttime, endtime, status
        FROM completed_uploads ORDER BY endtime DESC " . $pagination_query);
-    while ($row = $results->fetchArray()) {
-        try {
-            $jobStatus = new UploadJobStatus();
-            $jobStatus->job_last_update_timestamp = $row['endtime'];
-            $jobStatus->job_name = $row['filebase'];
-            $jobStatus->drive = $row['drive'];
-            $jobStatus->gdsa = $row['gdsa'];
-            $jobStatus->file_directory = $row['filedir'];
-            $jobStatus->file_name = $row['filebase'];
-            $jobStatus->file_size = $row['filesize'];
+        while ($row = $results->fetchArray()) {
+            try {
+                $jobStatus = new UploadJobStatus();
+                $jobStatus->job_last_update_timestamp = $row['endtime'];
+                $jobStatus->job_name = $row['filebase'];
+                $jobStatus->drive = $row['drive'];
+                $jobStatus->gdsa = $row['gdsa'];
+                $jobStatus->file_directory = $row['filedir'];
+                $jobStatus->file_name = $row['filebase'];
+                $jobStatus->file_size = $row['filesize'];
 
-            $jobStatus->time_end = date('d.m.y H:i:s', $row['endtime']);
-            $jobStatus->time_end_clean = secs_to_str(time() - $row['endtime']) . ' ago';
-            $jobStatus->time_start = $row['starttime'];
-            $jobStatus->time_elapsed = secs_to_str($row['endtime'] - $row['starttime']);
-            $jobStatus->successful = $row['status'] === 1;
-            $response->jobs[] = $jobStatus;
-        } catch (Exception $e) {
-            //TODO: Error handling.. logfile?
+                $jobStatus->time_end = date('d.m.y H:i:s', $row['endtime']);
+                $jobStatus->time_end_clean = secs_to_str(time() - $row['endtime']) . ' ago';
+                $jobStatus->time_start = $row['starttime'];
+                $jobStatus->time_elapsed = secs_to_str($row['endtime'] - $row['starttime']);
+                $jobStatus->successful = $row['status'] === 1;
+                $response->jobs[] = $jobStatus;
+            } catch (Exception $e) {
+                //TODO: Error handling.. logfile?
+            }
         }
-    }
 
-    $db?->close();
-    unset($db);
-    return json_encode($response);
+        $db?->close();
+        unset($db);
+        return json_encode($response);
+    } catch (Exception $e) {
+        // Return empty response on database error
+        error_log("Database error in completed.php: " . $e->getMessage());
+        $response->total_count = 0;
+        return json_encode($response);
+    }
 }
 
 /** actual logic */
diff --git a/apps/docker-uploader/root/var/www/html/srv/api/jobs/completed_today_stats.php b/apps/docker-uploader/root/var/www/html/srv/api/jobs/completed_today_stats.php
new file mode 100644
index 0000000000..922c375b0f
--- /dev/null
+++ b/apps/docker-uploader/root/var/www/html/srv/api/jobs/completed_today_stats.php
@@ -0,0 +1,103 @@
+<?php
+include_once('../../../settings.php');
+include_once('../../utility.php');
+
+header('Content-Type: application/json; charset=utf-8');
+
+/**
+ * Get statistics for all uploads completed today
+ */
+function getCompletedTodayStats()
+{
+    $response = array(
+        'count' => 0,
+        'total_size' => 0
+    );
+
+    try {
+        $db = new SQLite3(DATABASE, SQLITE3_OPEN_READONLY);
+        $db->busyTimeout(5000); // Wait up to 5 seconds if database is locked
+
+        // Get start of today timestamp
+        $startOfToday = strtotime('today midnight');
+
+        // Count uploads completed today
+        $countQuery = "SELECT COUNT(*) as count FROM completed_uploads WHERE endtime >= $startOfToday";
+        $countResult = $db->query($countQuery);
+        $response['count'] = $countResult->fetchArray()['count'];
+
+        // First try to get total size in bytes from filesize_bytes column
+        $sizeQuery = "SELECT SUM(filesize_bytes) as total_bytes FROM completed_uploads WHERE endtime >= $startOfToday AND filesize_bytes > 0";
+        $sizeResult = $db->query($sizeQuery);
+        $totalBytes = $sizeResult->fetchArray()['total_bytes'];
+
+        // If filesize_bytes returns null or 0, fall back to calculating from filesize string
+        if (!$totalBytes) {
+            $fallbackQuery = "SELECT filesize FROM completed_uploads WHERE endtime >= $startOfToday";
+            $fallbackResult = $db->query($fallbackQuery);
+            $totalBytes = 0;
+
+            while ($row = $fallbackResult->fetchArray()) {
+                $totalBytes += convertSizeToBytes($row['filesize']);
+            }
+        }
+
+        $response['total_size'] = $totalBytes ?: 0;
+
+        $db->close();
+        unset($db);
+
+        return json_encode($response);
+    } catch (Exception $e) {
+        // Return default response on database error
+        error_log("Database error in completed_today_stats.php: " . $e->getMessage());
+        return json_encode($response);
+    }
+}
+
+/**
+ * Convert a file size string to bytes
+ * @param string $sizeStr File size string (e.g. "2.5 GiB", "500 MiB") or numeric string
+ * @return int Size in bytes
+ */
+function convertSizeToBytes($sizeStr)
+{
+    if (empty($sizeStr)) {
+        return 0;
+    }
+
+    // If it's already a number (or a numeric string), return it directly
+    if (is_numeric($sizeStr)) {
+        return (int)$sizeStr;
+    }
+
+    // Extract numeric part and unit for formatted strings
+    if (preg_match('/^([0-9.]+)\s*([KMGT]i?B?)$/i', $sizeStr, $matches)) {
+        $num = (float) $matches[1];
+        $unit = strtoupper($matches[2]);
+
+        // Convert based on unit
+        switch ($unit) {
+            case 'B':
+                return (int) $num;
+            case 'KB':
+            case 'KIB':
+                return (int) ($num * 1024);
+            case 'MB':
+            case 'MIB':
+                return (int) ($num * 1024 * 1024);
+            case 'GB':
+            case 'GIB':
+                return (int) ($num * 1024 * 1024 * 1024);
+            case 'TB':
+            case 'TIB':
+                return (int) ($num * 1024 * 1024 * 1024 * 1024);
+            default:
+                return 0;
+        }
+    }
+
+    return 0;
+}
+
+echo getCompletedTodayStats();
diff --git a/apps/docker-uploader/root/var/www/html/srv/api/jobs/inprogress.php b/apps/docker-uploader/root/var/www/html/srv/api/jobs/inprogress.php
index 10d90a13e5..92908e72a9 100755
--- a/apps/docker-uploader/root/var/www/html/srv/api/jobs/inprogress.php
+++ b/apps/docker-uploader/root/var/www/html/srv/api/jobs/inprogress.php
@@ -8,33 +8,42 @@ function processJsonFiles()
 {
     $response = new ApiResponse();
     $response->jobs = [];
-    $db = new SQLite3(DATABASE, SQLITE3_OPEN_READONLY);
-    $results = $db->query("SELECT drive, filedir, filebase, filesize, gdsa, logfile FROM uploads");
-    while ($row = $results->fetchArray()) {
-        try {
-            $jobStatus = new UploadJobStatus();
-            $jobStatus->job_name = $row['filebase'];
-            $jobStatus->drive = $row['drive'];
-            $jobStatus->gdsa = $row['gdsa'];
-            $jobStatus->file_directory = $row['filedir'];
-            $jobStatus->file_name = $row['filebase'];
-            $jobStatus->file_size = $row['filesize'];
 
-            //Parse rclone logfile
-            if ($row['logfile'] != null) {
-                mapLogFileInformation($row['logfile'], $jobStatus);
-                $response->jobs[] = $jobStatus;
+    try {
+        $db = new SQLite3(DATABASE, SQLITE3_OPEN_READONLY);
+        $db->busyTimeout(5000); // Wait up to 5 seconds if database is locked
+        $results = $db->query("SELECT drive, filedir, filebase, filesize, gdsa, logfile FROM uploads");
+        while ($row = $results->fetchArray()) {
+            try {
+                $jobStatus = new UploadJobStatus();
+                $jobStatus->job_name = $row['filebase'];
+                $jobStatus->drive = $row['drive'];
+                $jobStatus->gdsa = $row['gdsa'];
+                $jobStatus->file_directory = $row['filedir'];
+                $jobStatus->file_name = $row['filebase'];
+                $jobStatus->file_size = $row['filesize'];
+
+                //Parse rclone logfile
+                if ($row['logfile'] != null) {
+                    mapLogFileInformation($row['logfile'], $jobStatus);
+                    $response->jobs[] = $jobStatus;
+                }
+            } catch (Exception $e) {
+                //TODO: Error handling
             }
-        } catch (Exception $e) {
-            //TODO: Error handling
         }
-    }
 
-    $response->total_count = isset($response->jobs) ? count($response->jobs) : 0;
+        $response->total_count = isset($response->jobs) ? count($response->jobs) : 0;
 
-    $db?->close();
-    unset($db);
-    return json_encode($response);
+        $db?->close();
+        unset($db);
+        return json_encode($response);
+    } catch (Exception $e) {
+        // Return empty response on database error
+        error_log("Database error in inprogress.php: " . $e->getMessage());
+        $response->total_count = 0;
+        return json_encode($response);
+    }
 }
 
 function mapLogFileInformation($logfile, UploadJobStatus $jobStatus): UploadJobStatus
diff --git a/apps/docker-uploader/root/var/www/html/srv/api/jobs/queue.php b/apps/docker-uploader/root/var/www/html/srv/api/jobs/queue.php
new file mode 100644
index 0000000000..d7dce6f91f
--- /dev/null
+++ b/apps/docker-uploader/root/var/www/html/srv/api/jobs/queue.php
@@ -0,0 +1,70 @@
+<?php
+
+/**
+ * API endpoint for getting files in the upload queue
+ * File: srv/api/jobs/queue.php
+ */
+
+include_once('../../../settings.php');
+include_once('../../utility.php');
+
+header('Content-Type: application/json; charset=utf-8');
+
+/**
+ * Get list of files in the upload queue
+ */
+function getQueueFiles()
+{
+    $response = array(
+        'success' => true,
+        'files' => array()
+    );
+
+    try {
+        // Check if database file exists
+        if (!file_exists(DATABASE)) {
+            $response['success'] = false;
+            $response['error'] = 'Database file not found';
+            return json_encode($response);
+        }
+
+        $db = new SQLite3(DATABASE, SQLITE3_OPEN_READONLY);
+        $db->busyTimeout(5000); // Wait up to 5 seconds if database is locked
+
+        // Get all files from the queue ordered by time (oldest first)
+        $query = "SELECT time, drive, filedir, filebase, filesize, metadata FROM upload_queue ORDER BY time ASC";
+        $result = $db->query($query);
+
+        if ($result === false) {
+            $response['success'] = false;
+            $response['error'] = $db->lastErrorMsg();
+            $db->close();
+            return json_encode($response);
+        }
+
+        while ($row = $result->fetchArray(SQLITE3_ASSOC)) {
+            // Convert SQLite datetime to Unix timestamp
+            $timestamp = !empty($row['time']) ? strtotime($row['time']) : time();
+
+            $response['files'][] = array(
+                'filename' => $row['filebase'],
+                'filesize' => $row['filesize'],
+                'drive' => $row['drive'],
+                'filedir' => $row['filedir'],
+                'metadata' => $row['metadata'],
+                'created_at' => $timestamp
+            );
+        }
+
+        $db->close();
+        unset($db);
+    } catch (Exception $e) {
+        $response['success'] = false;
+        $response['error'] = $e->getMessage();
+    }
+
+    return json_encode($response);
+}
+
+// Return the queue files
+echo getQueueFiles();
diff --git a/apps/docker-uploader/root/var/www/html/srv/api/jobs/queue_stats.php b/apps/docker-uploader/root/var/www/html/srv/api/jobs/queue_stats.php
new file mode 100644
index 0000000000..9067529ef5
--- /dev/null
+++ b/apps/docker-uploader/root/var/www/html/srv/api/jobs/queue_stats.php
@@ -0,0 +1,99 @@
+<?php
+
+/**
+ * API endpoint for getting queue statistics
+ * File: srv/api/jobs/queue_stats.php
+ */
+
+include_once('../../../settings.php');
+include_once('../../utility.php');
+
+header('Content-Type: application/json; charset=utf-8');
+
+/**
+ * Get statistics for files in the upload queue
+ */
+function getQueueStats()
+{
+    $response = array(
+        'count' => 0,
+        'total_size' => 0
+    );
+
+    try {
+        $db = new SQLite3(DATABASE, SQLITE3_OPEN_READONLY);
+        $db->busyTimeout(5000); // Wait up to 5 seconds if database is locked
+
+        // Count files in the queue
+        $countQuery = "SELECT COUNT(*) as count FROM upload_queue";
+        $countResult = $db->query($countQuery);
+        $response['count'] = $countResult->fetchArray()['count'];
+
+        // Calculate total size of files in the queue
+        $filesResult = $db->query("SELECT filesize FROM upload_queue");
+        $totalBytes = 0;
+
+        while ($row = $filesResult->fetchArray()) {
+            $sizeStr = $row['filesize'];
+            $totalBytes += convertSizeToBytes($sizeStr);
+        }
+
+        $response['total_size'] = $totalBytes;
+
+        $db->close();
+        unset($db);
+
+        return json_encode($response);
+    } catch (Exception $e) {
+        // Return default response on database error
+        error_log("Database error in queue_stats.php: " . $e->getMessage());
+        return json_encode($response);
+    }
+}
+
+/**
+ * Convert a file size string to bytes
+ * @param string $sizeStr File size string (e.g. "2.5 GiB", "500 MiB") or numeric string
+ * @return int Size in bytes
+ */
+function convertSizeToBytes($sizeStr)
+{
+    if (empty($sizeStr)) {
+        return 0;
+    }
+
+    // If it's already a number (or a numeric string), return it directly
+    if (is_numeric($sizeStr)) {
+        return (int)$sizeStr;
+    }
+
+    // Extract numeric part and unit for formatted strings
+    if (preg_match('/^([0-9.]+)\s*([KMGT]i?B?)$/i', $sizeStr, $matches)) {
+        $num = (float) $matches[1];
+        $unit = strtoupper($matches[2]);
+
+        // Convert based on unit
+        switch ($unit) {
+            case 'B':
+                return (int) $num;
+            case 'KB':
+            case 'KIB':
+                return (int) ($num * 1024);
+            case 'MB':
+            case 'MIB':
+                return (int) ($num * 1024 * 1024);
+            case 'GB':
+            case 'GIB':
+                return (int) ($num * 1024 * 1024 * 1024);
+            case 'TB':
+            case 'TIB':
+                return (int) ($num * 1024 * 1024 * 1024 * 1024);
+            default:
+                return 0;
+        }
+    }
+
+    return 0;
+}
+
+echo getQueueStats();
diff --git a/apps/docker-uploader/root/var/www/html/srv/api/settings/update.php b/apps/docker-uploader/root/var/www/html/srv/api/settings/update.php
new file mode 100644
index 0000000000..7cdc6089f7
--- /dev/null
+++ b/apps/docker-uploader/root/var/www/html/srv/api/settings/update.php
@@ -0,0 +1,203 @@
+<?php
+include_once('../../../settings.php');
+
+function updateEnvFile($settings)
+{
+    $envFile = '/system/uploader/uploader.env';
+
+    // Read the current file
+    $lines = file($envFile, FILE_IGNORE_NEW_LINES);
+    if (!$lines) {
+        return ['success' => false, 'message' => 'Could not read env file'];
+    }
+
+    // Create backup
+    $backupFile = $envFile . '.bak_' . date('YmdHis');
+    if (!copy($envFile, $backupFile)) {
+        return ['success' => false, 'message' => 'Could not create backup of env file'];
+    }
+
+    // Update the values
+    foreach ($settings as $key => $value) {
+        $found = false;
+        foreach ($lines as &$line) {
+            if (preg_match('/^' . $key . '=/', $line)) {
+                // Properly format the value
+                if ($value === 'true' || $value === 'false' || $value === 'null' || is_numeric($value)) {
+                    // Boolean, null, or numeric values don't need quotes
+                    $line = $key . '=' . $value;
+                } else {
+                    // String values should be quoted
+                    $line = $key . '="' . $value . '"';
+                }
+                $found = true;
+                break;
+            }
+        }
+
+        // If key wasn't found, add it to appropriate section
+        if (!$found) {
+            // Determine which section to add it to
+            $sectionFound = false;
+
+            // Common settings categories
+            $sections = [
+                'USER VALUES' => ['PUID', 'PGID', 'TIMEZONE'],
+                'CRITICAL SETUP FOR CRYPT USER' => ['HASHPASSWORD', 'GDSA_NAME', 'DB_NAME', 'DB_TEAM'],
+                'RCLONE - SETTINGS' => ['BANDWIDTH_LIMIT', 'GOOGLE_IP', 'PROXY', 'LOG_LEVEL', 'DLFOLDER', 'TRANSFERS'],
+                'USER - SETTINGS' => ['DRIVEUSEDSPACE', 'FOLDER_DEPTH', 'FOLDER_PRIORITY', 'MIN_AGE_UPLOAD'],
+                'VFS - SETTINGS' => ['VFS_REFRESH_ENABLE', 'MOUNT'],
+                'LOG - SETTINGS' => ['LOG_ENTRY', 'LOG_RETENTION_DAYS'],
+                'AUTOSCAN - SETTINGS' => ['AUTOSCAN_URL', 'AUTOSCAN_USER', 'AUTOSCAN_PASS'],
+                'NOTIFICATION - SETTINGS' => ['NOTIFICATION_URL', 'NOTIFICATION_LEVEL', 'NOTIFICATION_SERVERNAME'],
+                'STRIPARR - SETTINGS' => ['STRIPARR_URL'],
+                'LANGUAGE MESSAGES' => ['LANGUAGE']
+            ];
+
+            // Find which section this key belongs to
+            $targetSection = null;
+            foreach ($sections as $section => $keys) {
+                if (in_array($key, $keys)) {
+                    $targetSection = $section;
+                    break;
+                }
+            }
+
+            // Default to USER - SETTINGS if no matching section found
+            if ($targetSection === null) {
+                $targetSection = 'USER - SETTINGS';
+            }
+
+            // Find the section in the file
+            for ($i = 0; $i < count($lines); $i++) {
+                if (strpos($lines[$i], '## ' . $targetSection) !== false) {
+                    // Find the end of the section
+                    $j = $i + 1;
+                    while ($j < count($lines) && !preg_match('/^##\s+/', $lines[$j])) {
+                        $j++;
+                    }
+
+                    // Format the value
+                    $valueFormatted = $value;
+                    if ($value !== 'true' && $value !== 'false' && $value !== 'null' && !is_numeric($value)) {
+                        $valueFormatted = '"' . $value . '"';
+                    }
+
+                    // Insert the new key-value at the end of the section
+                    array_splice($lines, $j, 0, $key . '=' . $valueFormatted);
+                    $sectionFound = true;
+                    break;
+                }
+            }
+
+            // If section not found, add it at the end before the footer
+            if (!$sectionFound) {
+                // Find the footer
+                $footerIdx = array_search('#-------------------------------------------------------', $lines);
+                if ($footerIdx !== false) {
+                    $valueFormatted = $value;
+                    if ($value !== 'true' && $value !== 'false' && $value !== 'null' && !is_numeric($value)) {
+                        $valueFormatted = '"' . $value . '"';
+                    }
+
+                    array_splice($lines, $footerIdx, 0, [
+                        '',
+                        '## CUSTOM - SETTINGS',
+                        $key . '=' . $valueFormatted
+                    ]);
+                }
+            }
+        }
+    }
+
+    // Write the file back
+    if (file_put_contents($envFile, implode("\n", $lines)) === false) {
+        // Restore backup on failure
+        copy($backupFile, $envFile);
+        return ['success' => false, 'message' => 'Could not write env file'];
+    }
+
+    // Set proper permissions
+    chmod($envFile, 0755);
+    chown($envFile, 'abc');
+    chgrp($envFile, 'abc');
+
+    // Remove backups older than 7 days
+    $oldBackups = glob($envFile . '.bak_*');
+    foreach ($oldBackups as $backup) {
+        if (filemtime($backup) < time() - 7 * 24 * 60 * 60) {
+            unlink($backup);
+        }
+    }
+
+    return ['success' => true, 'message' => 'Settings updated successfully'];
+}
+
+function readEnvFile()
+{
+    $envFile = '/system/uploader/uploader.env';
+    $settings = [];
+
+    // Check if file exists
+    if (!file_exists($envFile)) {
+        return ['success' => false, 'message' => 'Environment file not found'];
+    }
+
+    // Read file
+    $lines = file($envFile, FILE_IGNORE_NEW_LINES);
+    foreach ($lines as $line) {
+        // Skip comments and empty lines
+        if (empty($line) || $line[0] == '#' || strpos($line, '=') === false) {
+            continue;
+        }
+
+        // Parse key=value
+        list($key, $value) = explode('=', $line, 2);
+        $key = trim($key);
+        $value = trim($value);
+
+        // Remove quotes if present
+        if (preg_match('/^"(.*)"$/', $value, $matches)) {
+            $value = $matches[1];
+        }
+
+        // Convert special values
+        if ($value === 'true') {
+            $value = true;
+        } elseif ($value === 'false') {
+            $value = false;
+        } elseif ($value === 'null') {
+            $value = null;
+        } elseif (is_numeric($value)) {
+            $value = $value + 0; // Convert to number
+        }
+
+        $settings[$key] = $value;
+    }
+
+    return ['success' => true, 'settings' => $settings];
+}
+
+// Handle requests
+header('Content-Type: application/json');
+$method = $_SERVER['REQUEST_METHOD'];
+
+switch ($method) {
+    case 'GET':
+        echo json_encode(readEnvFile());
+        break;
+
+    case 'POST':
+        $settings = json_decode(file_get_contents('php://input'), true);
+        if ($settings) {
+            echo json_encode(updateEnvFile($settings));
+        } else {
+            echo json_encode(['success' => false, 'message' => 'Invalid JSON data']);
+        }
+        break;
+
+    default:
+        header('HTTP/1.1 405 Method Not Allowed');
+        echo json_encode(['success' => false, 'message' => 'Method not allowed']);
+        break;
+}
diff --git a/apps/docker-uploader/root/var/www/html/srv/api/system/clean_history.php b/apps/docker-uploader/root/var/www/html/srv/api/system/clean_history.php
index a67ec554be..6b59c84fd5 100644
--- a/apps/docker-uploader/root/var/www/html/srv/api/system/clean_history.php
+++ b/apps/docker-uploader/root/var/www/html/srv/api/system/clean_history.php
@@ -1,8 +1,15 @@
 <?php
 include_once('../../../settings.php');
 
-
-$db = new SQLite3(DATABASE);
-$count_result = $db->exec('DELETE FROM completed_uploads');
-$db->close();
-unset($db);
\ No newline at end of file
+try {
+    $db = new SQLite3(DATABASE);
+    $db->busyTimeout(5000); // Wait up to 5 seconds if database is locked
+    $count_result = $db->exec('DELETE FROM completed_uploads');
+    $db->close();
+    unset($db);
+} catch (Exception $e) {
+    error_log("Database error in clean_history.php: " . $e->getMessage());
+    http_response_code(500);
+    echo json_encode(['success' => false, 'error' => 'Database error']);
+    exit;
+}
diff --git a/apps/docker-uploader/root/var/www/html/srv/api/system/env_settings.php b/apps/docker-uploader/root/var/www/html/srv/api/system/env_settings.php
new file mode 100644
index 0000000000..8959f3d98a
--- /dev/null
+++ b/apps/docker-uploader/root/var/www/html/srv/api/system/env_settings.php
@@ -0,0 +1,52 @@
+<?php
+include_once('../../../settings.php');
+
+header('Content-Type: application/json; charset=utf-8');
+
+/**
+ * Get environment settings from the uploader.env file
+ */
+function getEnvSettings()
+{
+    $envFile = '/system/uploader/uploader.env';
+    $settings = array();
+
+    if (!file_exists($envFile)) {
+        return json_encode($settings);
+    }
+
+    $lines = file($envFile, FILE_IGNORE_NEW_LINES | FILE_SKIP_EMPTY_LINES);
+
+    foreach ($lines as $line) {
+        // Skip comments and section headers
+        if (strpos($line, '#') === 0 || strpos($line, '##') === 0 || strpos($line, '----') === 0) {
+            continue;
+        }
+
+        // Parse variable assignments
+        if (preg_match('/([A-Za-z0-9_]+)=(.*)/', $line, $matches)) {
+            $key = strtolower($matches[1]);
+            $value = trim($matches[2]);
+
+            // Remove quotes and default values
+            $value = preg_replace('/^["\'](.*)["\']$/', '$1', $value);
+            $value = preg_replace('/\${([^:}]+):-([^}]+)}/', '$2', $value);
+            $value = preg_replace('/\${([^}]+)}/', '', $value);
+
+            // Convert value type if necessary
+            if ($value === 'true' || $value === 'false') {
+                $value = $value === 'true';
+            } elseif (is_numeric($value)) {
+                $value = strpos($value, '.') !== false ? (float) $value : (int) $value;
+            } elseif ($value === 'null') {
+                $value = null;
+            }
+
+            $settings[$key] = $value;
+        }
+    }
+
+    return json_encode($settings);
+}
+
+echo getEnvSettings();
diff --git a/apps/docker-uploader/root/var/www/html/srv/api/system/status.php b/apps/docker-uploader/root/var/www/html/srv/api/system/status.php
index 2c6f02b61e..227527e717 100644
--- a/apps/docker-uploader/root/var/www/html/srv/api/system/status.php
+++ b/apps/docker-uploader/root/var/www/html/srv/api/system/status.php
@@ -7,17 +7,140 @@ function checkStatus()
 {
     $response = new StatusResponse();
     $response->status = file_exists(PAUSE_FILE) ? StatusResponse::STATUS_STOPPED : StatusResponse::STATUS_STARTED;
+
+    // Get container uptime (not host system uptime)
+    if (strtoupper(substr(PHP_OS, 0, 3)) === 'WIN') {
+        // Windows - fallback to basic info
+        $response->uptime = "Running";
+    } else {
+        // Linux/Unix - Get the uptime of PID 1 (container's main process)
+        $stat = @file_get_contents('/proc/1/stat');
+        if ($stat) {
+            // Extract start time from /proc/1/stat
+            $parts = explode(' ', $stat);
+            $startTimeJiffies = isset($parts[21]) ? (float)$parts[21] : 0;
+
+            // Get system clock ticks per second
+            $clockTicks = 100; // Sensible default for many Linux systems
+            $clkTckOutput = @shell_exec('getconf CLK_TCK 2>/dev/null');
+            if ($clkTckOutput !== null) {
+                $clkTckOutput = trim($clkTckOutput);
+                if (is_numeric($clkTckOutput) && (float)$clkTckOutput > 0) {
+                    $clockTicks = (float)$clkTckOutput;
+                }
+            }
+
+            // Get system uptime
+            $uptimeData = @file_get_contents('/proc/uptime');
+            if ($uptimeData && $startTimeJiffies > 0) {
+                $uptimeParts = explode(' ', trim($uptimeData));
+                $systemUptime = (float)$uptimeParts[0];
+
+                // Calculate process start time in seconds
+                $processStartTime = $startTimeJiffies / $clockTicks;
+
+                // Calculate how long the process has been running
+                $processUptime = $systemUptime - $processStartTime;
+
+                // Format the uptime
+                $days = floor($processUptime / 86400);
+                $hours = floor(($processUptime % 86400) / 3600);
+                $minutes = floor(($processUptime % 3600) / 60);
+
+                $uptimeParts = [];
+                if ($days > 0) $uptimeParts[] = "$days day" . ($days > 1 ? 's' : '');
+                if ($hours > 0) $uptimeParts[] = "$hours hour" . ($hours > 1 ? 's' : '');
+                if ($minutes > 0) $uptimeParts[] = "$minutes minute" . ($minutes > 1 ? 's' : '');
+
+                $response->uptime = !empty($uptimeParts) ? implode(', ', $uptimeParts) : 'Just started';
+            } else {
+                $response->uptime = "N/A";
+            }
+        } else {
+            $response->uptime = "N/A";
+        }
+    }
+
+    // Get storage information
+    $possiblePaths = [
+        '/mnt/downloads',
+        '/data/downloads',
+        '/config/downloads',
+        '/downloads',
+        dirname(__DIR__, 4) . '/data/downloads',
+        __DIR__,
+        '/'
+    ];
+
+    $storage = "N/A";
+    foreach ($possiblePaths as $uploadPath) {
+        if (is_dir($uploadPath) && is_readable($uploadPath)) {
+            $total = @disk_total_space($uploadPath);
+            $free = @disk_free_space($uploadPath);
+
+            if ($total !== false && $free !== false && $total > 0) {
+                $used = $total - $free;
+
+                // Use GB for smaller values, TB for larger
+                if ($total < 1024 ** 4) {
+                    $usedGB = round($used / (1024 ** 3), 2);
+                    $totalGB = round($total / (1024 ** 3), 2);
+                    $storage = "$usedGB GB / $totalGB GB";
+                } else {
+                    $usedTB = round($used / (1024 ** 4), 2);
+                    $totalTB = round($total / (1024 ** 4), 2);
+                    $storage = "$usedTB TB / $totalTB TB";
+                }
+                break;
+            }
+        }
+    }
+
+    $response->storage = $storage;
+
     return json_encode($response);
 }
 
 function updateStatus($action)
 {
+    // Enable error logging
+    error_log("Status update requested: Action=$action");
+
     if ($action === 'pause') {
-        $pfile = fopen(PAUSE_FILE, 'w');
-        fwrite($pfile, '');
-        fclose($pfile);
-    } else {
-        unlink(PAUSE_FILE);
+        // Create pause file to pause uploads
+        error_log("Creating pause file: " . PAUSE_FILE);
+        $result = file_put_contents(PAUSE_FILE, '');
+        if ($result === false) {
+            error_log("Failed to create pause file. Check permissions.");
+            // Try to fix permissions
+            $dir = dirname(PAUSE_FILE);
+            if (!is_dir($dir)) {
+                mkdir($dir, 0777, true);
+                error_log("Created directory: $dir");
+            }
+            chmod($dir, 0777);
+            error_log("Set directory permissions: $dir");
+
+            // Try again
+            $result = file_put_contents(PAUSE_FILE, '');
+            error_log("Second attempt to create pause file: " . ($result !== false ? "success" : "failed"));
+        }
+    } else if ($action === 'continue') {
+        // Remove pause file to resume uploads
+        error_log("Removing pause file: " . PAUSE_FILE);
+        if (file_exists(PAUSE_FILE)) {
+            $result = unlink(PAUSE_FILE);
+            error_log("Unlink result: " . ($result ? "success" : "failed"));
+            if (!$result) {
+                error_log("Failed to remove pause file. Error: " . error_get_last()['message']);
+                // Try to fix permissions
+                chmod(PAUSE_FILE, 0666);
+                $result = unlink(PAUSE_FILE);
+                error_log("Second attempt: " . ($result ? "success" : "failed"));
+            }
+        } else {
+            error_log("Pause file doesn't exist, nothing to remove.");
+        }
     }
 }
 
@@ -26,6 +149,25 @@ function updateStatus($action)
 
 $method = filter_input(\INPUT_SERVER, 'REQUEST_METHOD', \FILTER_SANITIZE_SPECIAL_CHARS);
 if ($method === 'POST') {
-    updateStatus($_POST["action"]);
+    // Get the action from POST data
+    if (isset($_POST["action"])) {
+        $action = $_POST["action"];
+        error_log("Received POST with action: $action");
+        updateStatus($action);
+    } else {
+        // Try to get data from JSON input if POST array is empty
+        $input = file_get_contents('php://input');
+        error_log("Received raw input: $input");
+
+        if (!empty($input)) {
+            $data = json_decode($input, true);
+            if (isset($data['action'])) {
+                $action = $data['action'];
+                error_log("Parsed action from JSON: $action");
+                updateStatus($action);
+            }
+        }
+    }
 }
+
 echo checkStatus();
diff --git a/apps/docker-uploader/root/var/www/html/srv/api/system/update_env.php b/apps/docker-uploader/root/var/www/html/srv/api/system/update_env.php
new file mode 100644
index 0000000000..4f4d979075
--- /dev/null
+++ b/apps/docker-uploader/root/var/www/html/srv/api/system/update_env.php
@@ -0,0 +1,236 @@
+<?php
+include_once('../../../settings.php');
+
+header('Content-Type: application/json; charset=utf-8');
+
+/**
+ * Update environment settings in the uploader.env file
+ */
+function updateEnvSettings()
+{
+    // Enable error logging for debugging
+    ini_set('display_errors', 1);
+    ini_set('log_errors', 1);
+    error_log("update_env.php called");
+
+    // Check request method
+    if ($_SERVER['REQUEST_METHOD'] !== 'POST') {
+        error_log("Invalid request method: " . $_SERVER['REQUEST_METHOD']);
+        return json_encode(array(
+            'success' => false,
+            'message' => 'Invalid request method. Only POST is allowed.'
+        ));
+    }
+
+    // Get the request data
+    $rawInput = file_get_contents('php://input');
+    error_log("Raw input received: " . $rawInput);
+
+    $data = json_decode($rawInput, true);
+
+    if (!$data || !is_array($data)) {
+        error_log("Invalid data format received");
+
+        // Try to get regular POST data if JSON parsing failed
+        if (!empty($_POST)) {
+            $data = $_POST;
+            error_log("Using standard POST data instead: " . print_r($data, true));
+        } else {
+            return json_encode(array(
+                'success' => false,
+                'message' => 'Invalid request data.',
+                'received' => $rawInput
+            ));
+        }
+    }
+
+    error_log("Processing data: " . print_r($data, true));
+
+    // Use the full path defined in the Docker container
+    $envFile = '/system/uploader/uploader.env';
+
+    // Check if file exists and is writable
+    if (!file_exists($envFile)) {
+        error_log("Environment file not found: $envFile");
+        return json_encode(array(
+            'success' => false,
+            'message' => 'Environment file not found.',
+            'path' => $envFile
+        ));
+    }
+
+    // Check permissions
+    $filePerms = substr(sprintf('%o', fileperms($envFile)), -4);
+    error_log("File permissions: $filePerms");
+
+    if (!is_writable($envFile)) {
+        error_log("Environment file is not writable: $envFile");
+
+        // Try to fix permissions
+        $chmodResult = chmod($envFile, 0666);
+        error_log("Attempted to fix permissions: " . ($chmodResult ? "success" : "failed"));
+
+        if (!is_writable($envFile)) {
+            return json_encode(array(
+                'success' => false,
+                'message' => 'Environment file is not writable.',
+                'permissions' => $filePerms
+            ));
+        }
+    }
+
+    // Create a backup before modifying
+    $backupFile = $envFile . '.bak.' . date('YmdHis');
+    if (!copy($envFile, $backupFile)) {
+        error_log("Failed to create backup file");
+        return json_encode(array(
+            'success' => false,
+            'message' => 'Failed to create backup file.'
+        ));
+    }
+
+    // Read the current env file
+    $lines = file($envFile, FILE_IGNORE_NEW_LINES);
+    if ($lines === false) {
+        error_log("Failed to read environment file");
+        return json_encode(array(
+            'success' => false,
+            'message' => 'Failed to read environment file.'
+        ));
+    }
+
+    error_log("Read " . count($lines) . " lines from environment file");
+    $updated = false;
+
+    // Process input data - special handling for certain fields
+    foreach ($data as $key => &$value) {
+        // Skip empty or invalid keys
+        if (empty($key) || !is_string($key)) {
+            continue;
+        }
+
+        // Remove any dangerous characters
+        $key = preg_replace('/[^A-Za-z0-9_]/', '', $key);
+
+        // Special handling for BANDWIDTH_LIMIT
+        if ($key === 'BANDWIDTH_LIMIT' && !empty($value) && $value !== 'null' && !preg_match('/[KMG]$/i', $value)) {
+            // Append 'M' if no unit is specified
+            $value = $value . 'M';
+            error_log("Added M suffix to bandwidth limit: $value");
+        }
+
+        error_log("Processed setting: $key=$value");
+    }
+    // Important: unset the reference to avoid issues
+    unset($value);
+
+    // Update the env file with new values
+    foreach ($lines as $i => $line) {
+        foreach ($data as $key => $value) {
+            // Match the exact key at the start of the line
+            $upperKey = strtoupper($key);
+            $pattern = '/^' . preg_quote($upperKey, '/') . '=/';
+
+            if (preg_match($pattern, $line)) {
+                $oldLine = $lines[$i];
+
+                // Check if the value needs quotes
+                if ($value === 'true' || $value === 'false' || $value === 'null' || is_numeric($value)) {
+                    $formattedValue = $value;
+                } else {
+                    // If the value already has quotes, keep them
+                    if (preg_match('/^".*"$/', $value) || preg_match("/^'.*'$/", $value)) {
+                        $formattedValue = $value;
+                    } else {
+                        $formattedValue = '"' . $value . '"';
+                    }
+                }
+
+                $lines[$i] = $upperKey . '=' . $formattedValue;
+
+                error_log("Updated line: '$oldLine' to '{$lines[$i]}'");
+                $updated = true;
+
+                // Remove from data array to keep track of what's been processed
+                unset($data[$key]);
+            }
+        }
+    }
+
+    // Add any settings that weren't found (new settings)
+    if (!empty($data)) {
+        error_log("Adding new settings: " . print_r($data, true));
+
+        // Find the end section marker
+        $endMarkerPattern = '/^#-+$/';
+        $endIndex = null;
+
+        foreach ($lines as $i => $line) {
+            if (preg_match($endMarkerPattern, $line) && $i > count($lines) / 2) {
+                $endIndex = $i;
+                break;
+            }
+        }
+
+        if ($endIndex !== null) {
+            $insertIndex = $endIndex;
+
+            // Find the appropriate section to add the setting
+            foreach ($data as $key => $value) {
+                // Convert key to uppercase for env file
+                $upperKey = strtoupper($key);
+
+                // Check if the value needs quotes
+                if ($value === 'true' || $value === 'false' || $value === 'null' || is_numeric($value)) {
+                    $formattedValue = $value;
+                } else {
+                    if (preg_match('/^".*"$/', $value) || preg_match("/^'.*'$/", $value)) {
+                        $formattedValue = $value;
+                    } else {
+                        $formattedValue = '"' . $value . '"';
+                    }
+                }
+
+                $newLine = "$upperKey=$formattedValue";
+
+                error_log("Inserting new line at $insertIndex: $newLine");
+
+                // Insert the new line before the end section
+                array_splice($lines, $insertIndex, 0, $newLine);
+                $insertIndex++;
+                $updated = true;
+            }
+        } else {
+            error_log("Could not find end marker in env file");
+        }
+    }
+
+    if (!$updated) {
+        error_log("No settings were updated");
+        return json_encode(array(
+            'success' => false,
+            'message' => 'No settings were updated.'
+        ));
+    }
+
+    error_log("Writing " . count($lines) . " lines back to file");
+
+    // Write the updated content back to the file
+    $result = file_put_contents($envFile, implode("\n", $lines));
+    if ($result === false) {
+        error_log("Failed to write to environment file");
+        return json_encode(array(
+            'success' => false,
+            'message' => 'Failed to write to environment file.'
+        ));
+    }
+
+    error_log("Successfully wrote $result bytes to environment file");
+    return json_encode(array(
+        'success' => true,
+        'message' => 'Settings updated successfully.',
+        'bytes_written' => $result
+    ));
+}
+
+echo updateEnvSettings();
diff --git a/apps/docker-uploader/root/var/www/html/srv/api/system/version.php b/apps/docker-uploader/root/var/www/html/srv/api/system/version.php
new file mode 100644
index 0000000000..0db3ee3a84
--- /dev/null
+++ b/apps/docker-uploader/root/var/www/html/srv/api/system/version.php
@@ -0,0 +1,85 @@
+<?php
+// File: /var/www/html/srv/api/system/version.php
+header('Content-Type: application/json');
+
+// Enable error reporting for debugging
+ini_set('display_errors', 1);
+error_log('Version API called');
+
+// Try multiple possible locations for release.json
+$possible_paths = [
+    '/app/release.json',           // Main app directory
+    '../../../release.json',       // Relative to this file
+    '/release.json',               // Root directory
+    '/var/www/html/release.json',   // Web root
+    '/system/release.json',        // System directory
+    __DIR__ . '/../../../release.json', // Absolute path based on this file
+    __DIR__ . '/../../../../release.json', // One level up
+    dirname(__DIR__, 3) . '/release.json' // Another way to go up 3 directories
+];
+
+$version = '0.0.0'; // Default version
+$found_path = 'None found';
+$debug_info = [];
+
+foreach ($possible_paths as $path) {
+    $debug_info[$path] = file_exists($path) ? "Exists" : "Not found";
+
+    if (file_exists($path)) {
+        $content = file_get_contents($path);
+        if ($content !== false) {
+            $debug_info[$path] .= " - Content length: " . strlen($content);
+
+            try {
+                $json = json_decode($content, true);
+                if (json_last_error() === JSON_ERROR_NONE) {
+                    $debug_info[$path] .= " - Valid JSON";
+                    if (isset($json['newversion'])) {
+                        $version = $json['newversion'];
+                        $found_path = $path;
+                        $debug_info[$path] .= " - Found version: " . $version;
+                        break;
+                    } else {
+                        $debug_info[$path] .= " - No 'newversion' field found";
+                        $debug_info[$path] .= " - Available keys: " . implode(', ', array_keys($json));
+                    }
+                } else {
+                    $debug_info[$path] .= " - Invalid JSON: " . json_last_error_msg();
+                }
+            } catch (Exception $e) {
+                $debug_info[$path] .= " - Exception: " . $e->getMessage();
+            }
+        } else {
+            $debug_info[$path] .= " - Couldn't read file";
+        }
+    }
+}
+
+// Try file_get_contents on a known file to verify permissions
+$test_file = '/var/www/html/index.html';
+$can_read_test = file_exists($test_file) ? "Yes" : "No";
+$test_content = file_exists($test_file) ? (file_get_contents($test_file) !== false ? "Can read" : "Cannot read") : "N/A";
+
+// Let's also print information about the current script
+$current_script = [
+    'script_path' => __FILE__,
+    'script_dir' => __DIR__,
+    'parent_dir' => dirname(__DIR__),
+    'cwd' => getcwd(),
+    'file_perms' => function_exists('posix_getpwuid') ? posix_getpwuid(posix_geteuid())['name'] : 'Unknown user'
+];
+
+// Return comprehensive debug information
+echo json_encode([
+    'version' => $version,
+    'success' => true,
+    'found_path' => $found_path,
+    'paths_checked' => $debug_info,
+    'test_file_exists' => $can_read_test,
+    'test_file_readable' => $test_content,
+    'script_info' => $current_script
+]);
+
+// Also log this information to the error log
+error_log('Version API result: ' . $version . ' from path: ' . $found_path);
+error_log('Debug paths: ' . json_encode($debug_info));
diff --git a/apps/docker-uploader/root/var/www/html/srv/entities/StatusResponse.php b/apps/docker-uploader/root/var/www/html/srv/entities/StatusResponse.php
index 1e41c19607..df08d805f5 100644
--- a/apps/docker-uploader/root/var/www/html/srv/entities/StatusResponse.php
+++ b/apps/docker-uploader/root/var/www/html/srv/entities/StatusResponse.php
@@ -3,12 +3,17 @@
 class StatusResponse
 {
     public $status;
+    public $uptime;
+    public $storage;
 
     public const STATUS_UNKNOWN = 'UNKNOWN';
     public const STATUS_STARTED = 'STARTED';
     public const STATUS_STOPPED = 'STOPPED';
 
-    public function __construct(){
+    public function __construct()
+    {
         $status = StatusResponse::STATUS_UNKNOWN;
+        $uptime = null;
+        $storage = null;
     }
-}
\ No newline at end of file
+}
diff --git a/apps/docker-uploader/root/var/www/html/srv/entities/UploadJobStatus.php b/apps/docker-uploader/root/var/www/html/srv/entities/UploadJobStatus.php
index d3f7f47972..bf27f34dce 100755
--- a/apps/docker-uploader/root/var/www/html/srv/entities/UploadJobStatus.php
+++ b/apps/docker-uploader/root/var/www/html/srv/entities/UploadJobStatus.php
@@ -2,6 +2,9 @@
 
 class UploadJobStatus
 {
+    public $job_name;
+    public $job_last_update_timestamp;
+    public $drive;
     public $file_directory;
     public $file_name;
     public $file_size;
@@ -11,5 +14,7 @@ class UploadJobStatus
     public $gdsa;
     public $time_start;
     public $time_end;
+    public $time_end_clean;
     public $time_elapsed;
-}
\ No newline at end of file
+    public $successful;
+}

From 67ace939cd59bef918b51081648f97037dd429d2 Mon Sep 17 00:00:00 2001
From: cyb3rgh05t <cyb3rgh05t_01@proton.me>
Date: Thu, 18 Dec 2025 14:12:49 +0100
Subject: [PATCH 2/5] code fixes

apprise install fix
removed rclone.conf
improved functions scripts
---
 .../root/app/rclone/rclone.conf               |  3 ---
 .../root/app/uploader/function-db.sh          | 22 +++++++++++++++++--
 .../root/app/uploader/function-gdsa.sh        | 22 +++++++++++++++++--
 .../etc/s6-overlay/s6-rc.d/init-install/run   |  2 +-
 4 files changed, 41 insertions(+), 8 deletions(-)
 delete mode 100644 apps/docker-uploader/root/app/rclone/rclone.conf

diff --git a/apps/docker-uploader/root/app/rclone/rclone.conf b/apps/docker-uploader/root/app/rclone/rclone.conf
deleted file mode 100644
index ed9892ba88..0000000000
--- a/apps/docker-uploader/root/app/rclone/rclone.conf
+++ /dev/null
@@ -1,3 +0,0 @@
-[nfsshare]
-type = alias
-remote = /mnt/storage/
\ No newline at end of file
diff --git a/apps/docker-uploader/root/app/uploader/function-db.sh b/apps/docker-uploader/root/app/uploader/function-db.sh
index 510b468f46..12d37da7df 100755
--- a/apps/docker-uploader/root/app/uploader/function-db.sh
+++ b/apps/docker-uploader/root/app/uploader/function-db.sh
@@ -377,6 +377,19 @@ function rcloneupload() {
 
 function listfiles() {
    source /system/uploader/uploader.env
+   
+   # Validate MIN_AGE_UPLOAD
+   if [[ -z "${MIN_AGE_UPLOAD}" || ! "${MIN_AGE_UPLOAD}" =~ ^[0-9]+$ ]]; then
+      MIN_AGE_UPLOAD=1
+      log "Warning: MIN_AGE_UPLOAD was invalid, reset to 1"
+   fi
+   
+   # Validate FOLDER_DEPTH
+   if [[ -z "${FOLDER_DEPTH}" || ! "${FOLDER_DEPTH}" =~ ^[0-9]+$ || "${FOLDER_DEPTH}" -lt 1 ]]; then
+      FOLDER_DEPTH=1
+      log "Warning: FOLDER_DEPTH was invalid, reset to 1"
+   fi
+   
    #### CREATE TEMP_FILE ####
    sqlite3read "SELECT filebase FROM upload_queue UNION ALL SELECT filebase FROM uploads;" > "${TEMPFILES}"
    #### FIND NEW FILES ####
@@ -386,7 +399,12 @@ function listfiles() {
    for NAME in ${FILEBASE[@]}; do
       LISTFILE=$($(which basename) "${NAME}")
       LISTDIR=$($(which dirname) "${NAME}")
-      LISTDRIVE=$($(which echo) "${LISTDIR}" | $(which cut) -d/ -f-"${FOLDER_DEPTH}" | $(which xargs) -I {} $(which basename) {})
+      # Ensure FOLDER_DEPTH is valid
+      if [[ -z "${FOLDER_DEPTH}" || "${FOLDER_DEPTH}" -lt 1 ]]; then
+        FOLDER_DEPTH=1
+        log "Warning: FOLDER_DEPTH was invalid, reset to 1"
+      fi
+      LISTDRIVE=$($(which echo) "${LISTDIR}" | $(which cut) -d/ -f1-"${FOLDER_DEPTH}" | $(which xargs) -I {} $(which basename) {})
       LISTSIZE=$($(which stat) -c %s "${DLFOLDER}/${NAME}" 2>/dev/null)
       LISTTYPE="${NAME##*.}"
       if [[ "${LISTTYPE}" == "mkv" ]] || [[ "${LISTTYPE}" == "mp4" ]] || [[ "${LISTTYPE}" == "avi" ]] || [[ "${LISTTYPE}" == "mov" ]] || [[ "${LISTTYPE}" == "mpeg" ]] || [[ "${LISTTYPE}" == "mpegts" ]] || [[ "${LISTTYPE}" == "ts" ]]; then
@@ -436,7 +454,7 @@ function checkmeta() {
 function checkspace() {
    source /system/uploader/uploader.env
    #### CHECK DRIVEUSEDSPACE ####
-   if [[ "${DRIVEUSEDSPACE}" =~ ^[0-9][0-9]+([.][0-9]+)?$ ]]; then
+   if [[ "${DRIVEUSEDSPACE}" != "null" && "${DRIVEUSEDSPACE}" =~ ^[0-9][0-9]+([.][0-9]+)?$ ]]; then
       while true; do
         LCT=$($(which df) --output=pcent "${DLFOLDER}" | tr -dc '0-9')
         if [[ "${DRIVEUSEDSPACE}" =~ ^[0-9][0-9]+([.][0-9]+)?$ ]]; then
diff --git a/apps/docker-uploader/root/app/uploader/function-gdsa.sh b/apps/docker-uploader/root/app/uploader/function-gdsa.sh
index ecd3a9d726..b1549897cd 100755
--- a/apps/docker-uploader/root/app/uploader/function-gdsa.sh
+++ b/apps/docker-uploader/root/app/uploader/function-gdsa.sh
@@ -400,6 +400,19 @@ function rcloneupload() {
 
 function listfiles() {
    source /system/uploader/uploader.env
+   
+   # Validate MIN_AGE_UPLOAD
+   if [[ -z "${MIN_AGE_UPLOAD}" || ! "${MIN_AGE_UPLOAD}" =~ ^[0-9]+$ ]]; then
+      MIN_AGE_UPLOAD=1
+      log "Warning: MIN_AGE_UPLOAD was invalid, reset to 1"
+   fi
+   
+   # Validate FOLDER_DEPTH
+   if [[ -z "${FOLDER_DEPTH}" || ! "${FOLDER_DEPTH}" =~ ^[0-9]+$ || "${FOLDER_DEPTH}" -lt 1 ]]; then
+      FOLDER_DEPTH=1
+      log "Warning: FOLDER_DEPTH was invalid, reset to 1"
+   fi
+   
    #### CREATE TEMP_FILE ####
    sqlite3read "SELECT filebase FROM upload_queue UNION ALL SELECT filebase FROM uploads;" > "${TEMPFILES}"
    #### FIND NEW FILES ####
@@ -409,7 +422,12 @@ function listfiles() {
    for NAME in ${FILEBASE[@]}; do
       LISTFILE=$($(which basename) "${NAME}")
       LISTDIR=$($(which dirname) "${NAME}")
-      LISTDRIVE=$($(which echo) "${LISTDIR}" | $(which cut) -d/ -f-"${FOLDER_DEPTH}" | $(which xargs) -I {} $(which basename) {})
+      # Ensure FOLDER_DEPTH is valid
+      if [[ -z "${FOLDER_DEPTH}" || "${FOLDER_DEPTH}" -lt 1 ]]; then
+        FOLDER_DEPTH=1
+        log "Warning: FOLDER_DEPTH was invalid, reset to 1"
+      fi
+      LISTDRIVE=$($(which echo) "${LISTDIR}" | $(which cut) -d/ -f1-"${FOLDER_DEPTH}" | $(which xargs) -I {} $(which basename) {})
       LISTSIZE=$($(which stat) -c %s "${DLFOLDER}/${NAME}" 2>/dev/null)
       LISTTYPE="${NAME##*.}"
       if [[ "${LISTTYPE}" == "mkv" ]] || [[ "${LISTTYPE}" == "mp4" ]] || [[ "${LISTTYPE}" == "avi" ]] || [[ "${LISTTYPE}" == "mov" ]] || [[ "${LISTTYPE}" == "mpeg" ]] || [[ "${LISTTYPE}" == "mpegts" ]] || [[ "${LISTTYPE}" == "ts" ]]; then
@@ -459,7 +477,7 @@ function checkmeta() {
 function checkspace() {
    source /system/uploader/uploader.env
    #### CHECK DRIVEUSEDSPACE ####
-   if [[ "${DRIVEUSEDSPACE}" =~ ^[0-9][0-9]+([.][0-9]+)?$ ]]; then
+   if [[ "${DRIVEUSEDSPACE}" != "null" && "${DRIVEUSEDSPACE}" =~ ^[0-9][0-9]+([.][0-9]+)?$ ]]; then
       while true; do
         LCT=$($(which df) --output=pcent "${DLFOLDER}" | tr -dc '0-9')
         if [[ "${DRIVEUSEDSPACE}" =~ ^[0-9][0-9]+([.][0-9]+)?$ ]]; then
diff --git a/apps/docker-uploader/root/etc/s6-overlay/s6-rc.d/init-install/run b/apps/docker-uploader/root/etc/s6-overlay/s6-rc.d/init-install/run
index 3aa0e1521c..7a0b4a432a 100755
--- a/apps/docker-uploader/root/etc/s6-overlay/s6-rc.d/init-install/run
+++ b/apps/docker-uploader/root/etc/s6-overlay/s6-rc.d/init-install/run
@@ -124,7 +124,7 @@ log "**** install build packages from requirements ****" && \
    done
 
 log "**** install pip packages ****"
-   pip3 install --no-cache-dir -U apprise &>/dev/null
+   pip3 install --break-system-packages --no-cache-dir -U apprise &>/dev/null
 
 log "**** install rclone ****"
    $(which wget) -qO- https://rclone.org/install.sh | bash &>/dev/null

From b3d86f11bf686d72154e07cc78f070ff65ced26d Mon Sep 17 00:00:00 2001
From: cyb3rgh05t <cyb3rgh05t_01@proton.me>
Date: Thu, 18 Dec 2025 14:56:20 +0100
Subject: [PATCH 3/5] Update function-gdsa.sh

---
 apps/docker-uploader/root/app/uploader/function-gdsa.sh | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/docker-uploader/root/app/uploader/function-gdsa.sh b/apps/docker-uploader/root/app/uploader/function-gdsa.sh
index b1549897cd..f3a32c7ef5 100755
--- a/apps/docker-uploader/root/app/uploader/function-gdsa.sh
+++ b/apps/docker-uploader/root/app/uploader/function-gdsa.sh
@@ -329,7 +329,7 @@ function rcloneupload() {
    #### TOUCH LOG FILE FOR UI READING ####
    touch "${LOGFILE}/${FILE}.txt" &>/dev/null
    #### UPDATE DATABASE ENTRY ####
-   sqlite3write "INSERT OR REPLACE INTO uploads (drive,filedir,filebase,filesize,logfile,gdsa) VALUES ('${DRIVE//\'/\'\'}','${DIR//\'/\'\'}','${FILE//\'/\'\'}','${SIZE}','${LOGFILE}/${FILE//\'/\'\'}.txt','${KEYNOTI}${CRYPTED}');" &>/dev/null
+   sqlite3write "INSERT OR REPLACE INTO uploads (drive,filedir,filebase,filesize,logfile,gdsa) VALUES ('${DRIVE//\'/\'\'}','${DIR//\'/\'\'}','${FILE//\'/\'\'}','${SIZE}','${LOGFILE}/${FILE//\'/\'\'}.txt','${REMOTENAME//\'/\'\'}');" &>/dev/null
    #### READ BWLIMIT ####
    if [[ "${BANDWIDTH_LIMIT}" == "" ]]; then
       BANDWIDTH_LIMIT="null"

From 0e1a1c7507970985c80a26596f9b26a185a826a9 Mon Sep 17 00:00:00 2001
From: cyb3rgh05t <cyb3rgh05t_01@proton.me>
Date: Thu, 18 Dec 2025 15:27:52 +0100
Subject: [PATCH 4/5] sql fix?

---
 apps/docker-uploader/root/app/uploader/function-db.sh   | 2 +-
 apps/docker-uploader/root/app/uploader/function-gdsa.sh | 2 +-
 apps/docker-uploader/root/app/uploader/function.sh      | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/apps/docker-uploader/root/app/uploader/function-db.sh b/apps/docker-uploader/root/app/uploader/function-db.sh
index 12d37da7df..3ec9eba75f 100755
--- a/apps/docker-uploader/root/app/uploader/function-db.sh
+++ b/apps/docker-uploader/root/app/uploader/function-db.sh
@@ -365,7 +365,7 @@ function rcloneupload() {
    fi
    
    # Insert into completed_uploads with the filesize_bytes field
-   sqlite3write "INSERT INTO completed_uploads (drive,filedir,filebase,filesize,filesize_bytes,gdsa,starttime,endtime,status,error) VALUES (\"${DRIVE}\",\"${DIR}\",\"${FILE}\",\"${SIZE}\",\"${SIZEBYTES}\",\"${REMOTENAME}\",\"${STARTZ}\",\"${ENDZ}\",\"${STATUS}\",\"${ERROR}\"); DELETE FROM uploads WHERE filebase = \"${FILE}\";" &>/dev/null
+   sqlite3write "INSERT INTO completed_uploads (drive,filedir,filebase,filesize,filesize_bytes,gdsa,starttime,endtime,status,error) VALUES ('${DRIVE//\'/\\''}','${DIR//\'/\\''}','${FILE//\'/\\''}','${SIZE//\'/\\''}','${SIZEBYTES}','${REMOTENAME//\'/\\''}','${STARTZ}','${ENDZ}','${STATUS//\'/\\''}','${ERROR//\'/\\''}'); DELETE FROM uploads WHERE filebase = '${FILE//\'/\\''}';" &>/dev/null
    
    #### END OF MOVE ####
    $(which rm) -rf "${LOGFILE}/${FILE}.txt" &>/dev/null
diff --git a/apps/docker-uploader/root/app/uploader/function-gdsa.sh b/apps/docker-uploader/root/app/uploader/function-gdsa.sh
index f3a32c7ef5..e26e06ddbe 100755
--- a/apps/docker-uploader/root/app/uploader/function-gdsa.sh
+++ b/apps/docker-uploader/root/app/uploader/function-gdsa.sh
@@ -388,7 +388,7 @@ function rcloneupload() {
    fi
    
    # Insert into completed_uploads with the filesize_bytes field
-   sqlite3write "INSERT INTO completed_uploads (drive,filedir,filebase,filesize,filesize_bytes,gdsa,starttime,endtime,status,error) VALUES ('${DRIVE//\'/\'\'}','${DIR//\'/\'\'}','${FILE//\'/\'\'}','${SIZE}','${SIZEBYTES}','${KEYNOTI}${CRYPTED}','${STARTZ}','${ENDZ}','${STATUS//\'/\'\'}','${ERROR//\'/\'\'}'); DELETE FROM uploads WHERE filebase = '${FILE//\'/\'\'}';" &>/dev/null
+   sqlite3write "INSERT INTO completed_uploads (drive,filedir,filebase,filesize,filesize_bytes,gdsa,starttime,endtime,status,error) VALUES ('${DRIVE//\'/\\''}','${DIR//\'/\\''}','${FILE//\'/\\''}','${SIZE//\'/\\''}','${SIZEBYTES}','${KEYNOTI//\'/\\''}${CRYPTED//\'/\\''}','${STARTZ}','${ENDZ}','${STATUS//\'/\\''}','${ERROR//\'/\\''}'); DELETE FROM uploads WHERE filebase = '${FILE//\'/\\''}';" &>/dev/null
    
    #### END OF MOVE ####
    $(which rm) -rf "${LOGFILE}/${FILE}.txt" &>/dev/null
diff --git a/apps/docker-uploader/root/app/uploader/function.sh b/apps/docker-uploader/root/app/uploader/function.sh
index 8d6cee5e28..d8b8b54899 100755
--- a/apps/docker-uploader/root/app/uploader/function.sh
+++ b/apps/docker-uploader/root/app/uploader/function.sh
@@ -331,7 +331,7 @@ function rcloneupload() {
    checkerror
    #### ECHO END-PARTS FOR UI READING ####
    $(which find) "${DLFOLDER}/${SETDIR}" -mindepth 1 -type d -empty -delete &>/dev/null
-   sqlite3write "INSERT INTO completed_uploads (drive,filedir,filebase,filesize,gdsa,starttime,endtime,status,error) VALUES ('${DRIVE//\'/\'\'}','${DIR//\'/\'\'}','${FILE//\'/\'\'}','${SIZE}','${REMOTENAME//\'/\'\'}','${STARTZ}','${ENDZ}','${STATUS//\'/\'\'}','${ERROR//\'/\'\'}'); DELETE FROM uploads WHERE filebase = '${FILE//\'/\'\'}';" &>/dev/null
+   sqlite3write "INSERT INTO completed_uploads (drive,filedir,filebase,filesize,gdsa,starttime,endtime,status,error) VALUES ('${DRIVE//\'/\\''}','${DIR//\'/\\''}','${FILE//\'/\\''}','${SIZE//\'/\\''}','${REMOTENAME//\'/\\''}','${STARTZ}','${ENDZ}','${STATUS//\'/\\''}','${ERROR//\'/\\''}'); DELETE FROM uploads WHERE filebase = '${FILE//\'/\\''}';" &>/dev/null
    #### END OF MOVE ####
    $(which rm) -rf "${LOGFILE}/${FILE}.txt" &>/dev/null
    #### REMOVE CUSTOM RCLONE.CONF ####

From da79ad66956c5da180e900953b6d7cf221ca3d93 Mon Sep 17 00:00:00 2001
From: cyb3rgh05t <cyb3rgh05t_01@proton.me>
Date: Sat, 27 Dec 2025 11:21:35 +0100
Subject: [PATCH 5/5] new uploader UI

---
 .../root/app/uploader/function-db.sh          |  96 ++--
 .../root/app/uploader/function-gdsa.sh        |  65 ++-
 .../root/app/uploader/function.sh             |  64 ++-
 .../root/var/www/html/css/styles.css          | 309 +++++++++++-
 .../root/var/www/html/index.html              | 446 ++++++++++++------
 .../root/var/www/html/js/app.js               | 201 +++++++-
 .../root/var/www/html/js/utils.js             |  69 ++-
 .../root/var/www/html/release.json            |  10 -
 .../root/var/www/html/srv/api/jobs/failed.php |  83 ++++
 .../www/html/srv/api/jobs/failed_count.php    |  38 ++
 .../var/www/html/srv/api/settings/update.php  |   9 +-
 .../www/html/srv/api/system/update_env.php    |   6 +
 .../www/html/srv/entities/UploadJobStatus.php |   1 +
 13 files changed, 1172 insertions(+), 225 deletions(-)
 delete mode 100644 apps/docker-uploader/root/var/www/html/release.json
 create mode 100644 apps/docker-uploader/root/var/www/html/srv/api/jobs/failed.php
 create mode 100644 apps/docker-uploader/root/var/www/html/srv/api/jobs/failed_count.php

diff --git a/apps/docker-uploader/root/app/uploader/function-db.sh b/apps/docker-uploader/root/app/uploader/function-db.sh
index 3ec9eba75f..900ffe8b28 100755
--- a/apps/docker-uploader/root/app/uploader/function-db.sh
+++ b/apps/docker-uploader/root/app/uploader/function-db.sh
@@ -77,36 +77,78 @@ function autoscan() {
                if [[ "${AUTOSCAN_USER}" == "null" ]]; then
                   $(which curl) -sfG -X POST --data-urlencode "dir=${SUNION}/${DIR}" "${AUTOSCAN_URL}/triggers/manual"
                else
-                  $(which curl) -sfG -X POST -u "${AUTOSCAN_USER}:${AUTOSCAN_PASS}" --data-urlencode "dir=${SUNION}/${DIR}" "${AUTOSCAN_URL}/triggers/manual"
+         #### Fill available transfer slots in this cycle ####
+         LOGGED_CAPACITY=false
+         CAPACITY_FLAG="/tmp/uploader_capacity_logged"
+         while true; do
+            ACTIVETRANSFERS=$(sqlite3read "SELECT COUNT(*) FROM uploads;" 2>/dev/null)
+            source /system/uploader/uploader.env
+            if [[ "${TRANSFERS}" != +([0-9.]) ]] || [ "${TRANSFERS}" -gt "99" ] || [ "${TRANSFERS}" -eq "0" ]; then
+               TRANSFERS="1"
+            fi
+            if [[ "${ACTIVETRANSFERS}" -ge "${TRANSFERS}" ]]; then
+               if [[ ! -f "${CAPACITY_FLAG}" ]]; then
+                  log "Capacity reached: ${ACTIVETRANSFERS}/${TRANSFERS}. Waiting for slots."
+                  : > "${CAPACITY_FLAG}"
                fi
+               $(which sleep) 2
+               break
             fi
-      fi
-   fi
-}
 
-function notification() {
-   source /system/uploader/uploader.env
-   #### CHECK NOTIFICATION TYPE ####
-   if [[ "${NOTIFYTYPE}" == "" ]]; then
-     NOTIFYTYPE="info"
-   fi
-   #### CHECK NOTIFICATON SERVERNAME ####
-   if [[ "${NOTIFICATION_SERVERNAME}" == "null" ]]; then
-     NOTIFICATION_NAME="Docker"
-   else
-     NOTIFICATION_NAME="${NOTIFICATION_SERVERNAME}"
-   fi
-   #### SEND NOTIFICATION ####
-   if [[ "${NOTIFICATION_URL}" != "null" ]]; then
-      log "${MSG}" && apprise --notification-type="${NOTIFYTYPE}" --title="Uploader - ${NOTIFICATION_NAME}" --body="${MSGAPP}" "${NOTIFICATION_URL}/?format=markdown"
-   else
-      log "${MSG}"
-   fi
+            # Capacity available again; clear flag so future capacity states can log once
+            [ -f "${CAPACITY_FLAG}" ] && $(which rm) -f "${CAPACITY_FLAG}" 2>/dev/null
+
+            FILE=$(sqlite3read "SELECT filebase FROM upload_queue WHERE metadata = 0 ${SEARCHSTRING} LIMIT 1;" 2>/dev/null)
+            if [[ -z "${FILE}" ]]; then
+               log "Queue empty while filling slots. No files to start."
+               break
+            fi
+            DIR=$(sqlite3read "SELECT filedir FROM upload_queue WHERE filebase = '${FILE//\'/\'\'}';" 2>/dev/null)
+            DRIVE=$(sqlite3read "SELECT drive FROM upload_queue WHERE filebase = '${FILE//\'/\'\'}';" 2>/dev/null)
+            SIZEBYTES=$(sqlite3read "SELECT filesize FROM upload_queue WHERE filebase = '${FILE//\'/\'\'}';" 2>/dev/null)
+
+            #### TO CHECK IS IT A FILE OR NOT ####
+            if [[ -f "${DLFOLDER}/${DIR}/${FILE}" ]]; then
+               #### REPULL SOURCE FILE FOR LIVE EDITS ####
+               source /system/uploader/uploader.env
+               #### RUN TRANSFERS CHECK ####
+               transfercheck
+               #### UPLOAD FUNCTIONS STARTUP ####
+               if [[ "${TRANSFERS}" -eq "1" ]]; then 
+                  #### SINGLE UPLOAD ####
+                  log "Starting upload (single mode): ${DRIVE}/${DIR}/${FILE}"
+                  rcloneupload
+               else
+                  #### DEMONISED UPLOAD ####
+                  log "Starting upload in background: ${DRIVE}/${DIR}/${FILE} (active ${ACTIVETRANSFERS}/${TRANSFERS})"
+                  rcloneupload &
+               fi
+            else
+               #### WHEN NOT THEN DELETE ENTRY ####
+               log "File missing, removing from queue: ${DRIVE}/${DIR}/${FILE}"
+               FULLPATH="${DLFOLDER}/${DIR}/${FILE}"
+               DBINFO=$(sqlite3read "SELECT drive||'|'||filedir FROM upload_queue WHERE filebase = '${FILE//\'/\'\'}' LIMIT 1;" 2>/dev/null)
+               log "Debug: missing-check fullpath='${FULLPATH}' (DLFOLDER='${DLFOLDER}', DIR='${DIR}', FILE='${FILE}', DB='${DBINFO}')"
+               sqlite3write "DELETE FROM upload_queue WHERE filebase = '${FILE//\'/\'\'}';" &>/dev/null
+               # Skip to next file in queue
+               continue
+            fi
+
+            #### Recompute remaining queue count ####
+            CHECKFILES=$(sqlite3read "SELECT COUNT(*) FROM upload_queue WHERE metadata = 0;")
+            if [[ "${CHECKFILES}" -lt "1" ]]; then
+               log "Finished filling slots; queue now empty."
+               break
+            fi
+         done
+
+         #### CLEANUP COMPLETED HISTORY ####
+         cleanuplog
 }
 
 function checkerror() {
    source /system/uploader/uploader.env
-   CHECKERROR=$($(which tail) -n 25 "${LOGFILE}/${FILE}.txt" | $(which grep) -E -wi "Failed|ERROR|Source doesn't exist or is a directory and destination is a file|The filename or extension is too long|file name too long|Filename too long")
+   CHECKERROR=$($(which tail) -n 25 "${LOGFILE}/${FILE}.txt" | $(which grep) -v "preAllocate" | $(which grep) -E -wi "Failed|ERROR|Source doesn't exist or is a directory and destination is a file|The filename or extension is too long|file name too long|Filename too long")
    DATEDIFF="$(( ${ENDZ} - ${STARTZ} ))"
    HOUR="$(( ${DATEDIFF} / 3600 ))"
    MINUTE="$(( (${DATEDIFF} % 3600) / 60 ))"
@@ -126,7 +168,7 @@ function checkerror() {
    #### CHECK ERROR ON UPLOAD ####
    if [[ "${CHECKERROR}" != "" ]]; then
       STATUS="0"
-      ERROR=$($(which tail) -n 25 "${LOGFILE}/${FILE}.txt" | $(which grep) -E -wi "Failed|ERROR|Source doesn't exist or is a directory and destination is a file|The filename or extension is too long|file name too long|Filename too long" | $(which head) -n 1 | $(which tr) -d '"')
+      ERROR=$($(which tail) -n 25 "${LOGFILE}/${FILE}.txt" | $(which grep) -v "preAllocate" | $(which grep) -E -wi "Failed|ERROR|Source doesn't exist or is a directory and destination is a file|The filename or extension is too long|file name too long|Filename too long" | $(which head) -n 1 | $(which tr) -d '"')
       NOTIFYTYPE="failure"
       if [[ "${NOTIFICATION_LEVEL}" == "ALL" ]] || [[ ${NOTIFICATION_LEVEL} == "ERROR" ]]; then
          MSG="-> ❌ Upload failed ${FILE} with Error ${ERROR} <-"
@@ -328,7 +370,7 @@ function rcloneupload() {
    $(which rclone) moveto "${DLFOLDER}/${DIR}/${FILE}" "${REMOTENAME}:/${DIR}/${FILE}" \
       --config="${CONFIG}" \
       --stats=1s --checkers=4 \
-      --dropbox-chunk-size=128M --use-mmap \
+      --dropbox-chunk-size=128M \
       --log-level="${LOG_LEVEL}" \
       --user-agent="${USERAGENT}" ${BWLIMIT} \
       --log-file="${LOGFILE}/${FILE}.txt" \
@@ -365,7 +407,7 @@ function rcloneupload() {
    fi
    
    # Insert into completed_uploads with the filesize_bytes field
-   sqlite3write "INSERT INTO completed_uploads (drive,filedir,filebase,filesize,filesize_bytes,gdsa,starttime,endtime,status,error) VALUES ('${DRIVE//\'/\\''}','${DIR//\'/\\''}','${FILE//\'/\\''}','${SIZE//\'/\\''}','${SIZEBYTES}','${REMOTENAME//\'/\\''}','${STARTZ}','${ENDZ}','${STATUS//\'/\\''}','${ERROR//\'/\\''}'); DELETE FROM uploads WHERE filebase = '${FILE//\'/\\''}';" &>/dev/null
+   sqlite3write "INSERT INTO completed_uploads (drive,filedir,filebase,filesize,filesize_bytes,gdsa,starttime,endtime,status,error) VALUES ('${DRIVE//\'/\'\'}','${DIR//\'/\'\'}','${FILE//\'/\'\'}','${SIZE}','${SIZEBYTES}','${REMOTENAME//\'/\'\'}','${STARTZ}','${ENDZ}','${STATUS//\'/\'\'}','${ERROR//\'/\'\'}'); DELETE FROM uploads WHERE filebase = '${FILE//\'/\'\'}';" &>/dev/null
    
    #### END OF MOVE ####
    $(which rm) -rf "${LOGFILE}/${FILE}.txt" &>/dev/null
@@ -408,7 +450,7 @@ function listfiles() {
       LISTSIZE=$($(which stat) -c %s "${DLFOLDER}/${NAME}" 2>/dev/null)
       LISTTYPE="${NAME##*.}"
       if [[ "${LISTTYPE}" == "mkv" ]] || [[ "${LISTTYPE}" == "mp4" ]] || [[ "${LISTTYPE}" == "avi" ]] || [[ "${LISTTYPE}" == "mov" ]] || [[ "${LISTTYPE}" == "mpeg" ]] || [[ "${LISTTYPE}" == "mpegts" ]] || [[ "${LISTTYPE}" == "ts" ]]; then
-         CHECKMETA=$($(which exiftool) -m -q -q -Title "${DLFOLDER}/${NAME}" 2>/dev/null | $(which grep) -qE * && echo 1 || echo 0)
+         CHECKMETA=$($(which exiftool) -m -q -q -Title "${DLFOLDER}/${NAME}" 2>/dev/null | $(which grep) -qE '[A-Za-z]' && echo 1 || echo 0)
       else
          CHECKMETA="0"
       fi
diff --git a/apps/docker-uploader/root/app/uploader/function-gdsa.sh b/apps/docker-uploader/root/app/uploader/function-gdsa.sh
index e26e06ddbe..2c85614940 100755
--- a/apps/docker-uploader/root/app/uploader/function-gdsa.sh
+++ b/apps/docker-uploader/root/app/uploader/function-gdsa.sh
@@ -106,7 +106,7 @@ function notification() {
 
 function checkerror() {
    source /system/uploader/uploader.env
-   CHECKERROR=$($(which tail) -n 25 "${LOGFILE}/${FILE}.txt" | $(which grep) -E -wi "Failed|ERROR|Source doesn't exist or is a directory and destination is a file|The filename or extension is too long|file name too long|Filename too long")
+   CHECKERROR=$($(which tail) -n 25 "${LOGFILE}/${FILE}.txt" | $(which grep) -v "preAllocate" | $(which grep) -E -wi "Failed|ERROR|Source doesn't exist or is a directory and destination is a file|The filename or extension is too long|file name too long|Filename too long")
    DATEDIFF="$(( ${ENDZ} - ${STARTZ} ))"
    HOUR="$(( ${DATEDIFF} / 3600 ))"
    MINUTE="$(( (${DATEDIFF} % 3600) / 60 ))"
@@ -126,7 +126,7 @@ function checkerror() {
    #### CHECK ERROR ON UPLOAD ####
    if [[ "${CHECKERROR}" != "" ]]; then
       STATUS="0"
-      ERROR=$($(which tail) -n 25 "${LOGFILE}/${FILE}.txt" | $(which grep) -E -wi "Failed|ERROR|Source doesn't exist or is a directory and destination is a file|The filename or extension is too long|file name too long|Filename too long" | $(which head) -n 1 | $(which tr) -d '"')
+      ERROR=$($(which tail) -n 25 "${LOGFILE}/${FILE}.txt" | $(which grep) -v "preAllocate" | $(which grep) -E -wi "Failed|ERROR|Source doesn't exist or is a directory and destination is a file|The filename or extension is too long|file name too long|Filename too long" | $(which head) -n 1 | $(which tr) -d '"')
       NOTIFYTYPE="failure"
       if [[ "${NOTIFICATION_LEVEL}" == "ALL" ]] || [[ ${NOTIFICATION_LEVEL} == "ERROR" ]]; then
          MSG="-> ❌ Upload failed ${FILE} with Error ${ERROR} <-"
@@ -350,7 +350,7 @@ function rcloneupload() {
    $(which rclone) moveto "${DLFOLDER}/${DIR}/${FILE}" "${REMOTENAME}:/${DIR}/${FILE}" \
       --config="${CONFIG}" \
       --stats=1s --checkers=4 \
-      --drive-chunk-size=32M --use-mmap \
+      --drive-chunk-size=32M \
       --log-level="${LOG_LEVEL}" \
       --user-agent="${USERAGENT}" ${BWLIMIT} \
       --log-file="${LOGFILE}/${FILE}.txt" \
@@ -388,7 +388,7 @@ function rcloneupload() {
    fi
    
    # Insert into completed_uploads with the filesize_bytes field
-   sqlite3write "INSERT INTO completed_uploads (drive,filedir,filebase,filesize,filesize_bytes,gdsa,starttime,endtime,status,error) VALUES ('${DRIVE//\'/\\''}','${DIR//\'/\\''}','${FILE//\'/\\''}','${SIZE//\'/\\''}','${SIZEBYTES}','${KEYNOTI//\'/\\''}${CRYPTED//\'/\\''}','${STARTZ}','${ENDZ}','${STATUS//\'/\\''}','${ERROR//\'/\\''}'); DELETE FROM uploads WHERE filebase = '${FILE//\'/\\''}';" &>/dev/null
+   sqlite3write "INSERT INTO completed_uploads (drive,filedir,filebase,filesize,filesize_bytes,gdsa,starttime,endtime,status,error) VALUES ('${DRIVE//\'/\'\'}','${DIR//\'/\'\'}','${FILE//\'/\'\'}','${SIZE}','${SIZEBYTES}','${KEYNOTI//\'/\'\'}${CRYPTED//\'/\'\'}','${STARTZ}','${ENDZ}','${STATUS//\'/\'\'}','${ERROR//\'/\'\'}'); DELETE FROM uploads WHERE filebase = '${FILE//\'/\'\'}';" &>/dev/null
    
    #### END OF MOVE ####
    $(which rm) -rf "${LOGFILE}/${FILE}.txt" &>/dev/null
@@ -431,7 +431,7 @@ function listfiles() {
       LISTSIZE=$($(which stat) -c %s "${DLFOLDER}/${NAME}" 2>/dev/null)
       LISTTYPE="${NAME##*.}"
       if [[ "${LISTTYPE}" == "mkv" ]] || [[ "${LISTTYPE}" == "mp4" ]] || [[ "${LISTTYPE}" == "avi" ]] || [[ "${LISTTYPE}" == "mov" ]] || [[ "${LISTTYPE}" == "mpeg" ]] || [[ "${LISTTYPE}" == "mpegts" ]] || [[ "${LISTTYPE}" == "ts" ]]; then
-         CHECKMETA=$($(which exiftool) -m -q -q -Title "${DLFOLDER}/${NAME}" 2>/dev/null | $(which grep) -qE * && echo 1 || echo 0)
+         CHECKMETA=$($(which exiftool) -m -q -q -Title "${DLFOLDER}/${NAME}" 2>/dev/null | $(which grep) -qE '[A-Za-z]' && echo 1 || echo 0)
       else
          CHECKMETA="0"
       fi
@@ -562,10 +562,37 @@ function startuploader() {
          else
             SEARCHSTRING="ORDER BY time"
          fi
-         FILE=$(sqlite3read "SELECT filebase FROM upload_queue WHERE metadata = 0 ${SEARCHSTRING} LIMIT 1;" 2>/dev/null)
-         DIR=$(sqlite3read "SELECT filedir FROM upload_queue WHERE filebase = '${FILE//\'/\'\'}';" 2>/dev/null)
-         DRIVE=$(sqlite3read "SELECT drive FROM upload_queue WHERE filebase = '${FILE//\'/\'\'}';" 2>/dev/null)
-         SIZEBYTES=$(sqlite3read "SELECT filesize FROM upload_queue WHERE filebase = '${FILE//\'/\'\'}';" 2>/dev/null)
+
+         #### Fill available transfer slots in this cycle ####
+         LOGGED_CAPACITY=false
+         CAPACITY_FLAG="/tmp/uploader_capacity_logged"
+         while true; do
+            ACTIVETRANSFERS=$(sqlite3read "SELECT COUNT(*) FROM uploads;" 2>/dev/null)
+            source /system/uploader/uploader.env
+            if [[ "${TRANSFERS}" != +([0-9.]) ]] || [ "${TRANSFERS}" -gt "99" ] || [ "${TRANSFERS}" -eq "0" ]; then
+               TRANSFERS="1"
+            fi
+            if [[ "${ACTIVETRANSFERS}" -ge "${TRANSFERS}" ]]; then
+               if [[ ! -f "${CAPACITY_FLAG}" ]]; then
+                  log "Capacity reached: ${ACTIVETRANSFERS}/${TRANSFERS}. Waiting for slots."
+                  : > "${CAPACITY_FLAG}"
+               fi
+               $(which sleep) 2
+               break
+            fi
+
+            # Capacity available again; clear flag so future capacity states can log once
+            [ -f "${CAPACITY_FLAG}" ] && $(which rm) -f "${CAPACITY_FLAG}" 2>/dev/null
+
+            FILE=$(sqlite3read "SELECT filebase FROM upload_queue WHERE metadata = 0 ${SEARCHSTRING} LIMIT 1;" 2>/dev/null)
+            if [[ -z "${FILE}" ]]; then
+               log "Queue empty while filling slots. No files to start."
+               break
+            fi
+            DIR=$(sqlite3read "SELECT filedir FROM upload_queue WHERE filebase = '${FILE//\'/\'\'}';" 2>/dev/null)
+            DRIVE=$(sqlite3read "SELECT drive FROM upload_queue WHERE filebase = '${FILE//\'/\'\'}';" 2>/dev/null)
+            SIZEBYTES=$(sqlite3read "SELECT filesize FROM upload_queue WHERE filebase = '${FILE//\'/\'\'}';" 2>/dev/null)
+
             #### TO CHECK IS IT A FILE OR NOT ####
             if [[ -f "${DLFOLDER}/${DIR}/${FILE}" ]]; then
                #### REPULL SOURCE FILE FOR LIVE EDITS ####
@@ -579,16 +606,32 @@ function startuploader() {
                #### UPLOAD FUNCTIONS STARTUP ####
                if [[ "${TRANSFERS}" -eq "1" ]]; then 
                   #### SINGLE UPLOAD ####
+                  log "Starting upload (single mode): ${DRIVE}/${DIR}/${FILE}"
                   rcloneupload
                else
                   #### DEMONISED UPLOAD ####
+                  log "Starting upload in background: ${DRIVE}/${DIR}/${FILE} (active ${ACTIVETRANSFERS}/${TRANSFERS})"
                   rcloneupload &
                fi
             else
                #### WHEN NOT THEN DELETE ENTRY ####
-               sqlite3write "DELETE FROM upload_queue WHERE filebase = \"${FILE}\";" &>/dev/null
-               $(which sleep) 2
+               log "File missing, removing from queue: ${DRIVE}/${DIR}/${FILE}"
+               FULLPATH="${DLFOLDER}/${DIR}/${FILE}"
+               DBINFO=$(sqlite3read "SELECT drive||'|'||filedir FROM upload_queue WHERE filebase = '${FILE//\'/\'\'}' LIMIT 1;" 2>/dev/null)
+               log "Debug: missing-check fullpath='${FULLPATH}' (DLFOLDER='${DLFOLDER}', DIR='${DIR}', FILE='${FILE}', DB='${DBINFO}')"
+               sqlite3write "DELETE FROM upload_queue WHERE filebase = '${FILE//\'/\'\'}';" &>/dev/null
+               # Skip to next file in queue
+               continue
             fi
+
+            #### Recompute remaining queue count ####
+            CHECKFILES=$(sqlite3read "SELECT COUNT(*) FROM upload_queue WHERE metadata = 0;")
+            if [[ "${CHECKFILES}" -lt "1" ]]; then
+               log "Finished filling slots; queue now empty."
+               break
+            fi
+         done
+
          #### CLEANUP COMPLETED HISTORY ####
          cleanuplog
       else
diff --git a/apps/docker-uploader/root/app/uploader/function.sh b/apps/docker-uploader/root/app/uploader/function.sh
index d8b8b54899..14af9bd794 100755
--- a/apps/docker-uploader/root/app/uploader/function.sh
+++ b/apps/docker-uploader/root/app/uploader/function.sh
@@ -142,7 +142,7 @@ function notification() {
 
 function checkerror() {
    source /system/uploader/uploader.env
-   CHECKERROR=$($(which tail) -n 25 "${LOGFILE}/${FILE}.txt" | $(which grep) -E -wi "Failed|ERROR|Source doesn't exist or is a directory and destination is a file|The filename or extension is too long|file name too long|Filename too long")
+   CHECKERROR=$($(which tail) -n 25 "${LOGFILE}/${FILE}.txt" | $(which grep) -v "preAllocate" | $(which grep) -E -wi "Failed|ERROR|Source doesn't exist or is a directory and destination is a file|The filename or extension is too long|file name too long|Filename too long")
    DATEDIFF="$(( ${ENDZ} - ${STARTZ} ))"
    HOUR="$(( ${DATEDIFF} / 3600 ))"
    MINUTE="$(( (${DATEDIFF} % 3600) / 60 ))"
@@ -162,7 +162,7 @@ function checkerror() {
    #### CHECK ERROR ON UPLOAD ####
    if [[ "${CHECKERROR}" != "" ]]; then
       STATUS="0"
-      ERROR=$($(which tail) -n 25 "${LOGFILE}/${FILE}.txt" | $(which grep) -E -wi "Failed|ERROR|Source doesn't exist or is a directory and destination is a file|The filename or extension is too long|file name too long|Filename too long" | $(which head) -n 1 | $(which tr) -d '"')
+      ERROR=$($(which tail) -n 25 "${LOGFILE}/${FILE}.txt" | $(which grep) -v "preAllocate" | $(which grep) -E -wi "Failed|ERROR|Source doesn't exist or is a directory and destination is a file|The filename or extension is too long|file name too long|Filename too long" | $(which head) -n 1 | $(which tr) -d '"')
       NOTIFYTYPE="failure"
       if [[ "${NOTIFICATION_LEVEL}" == "ALL" ]] || [[ ${NOTIFICATION_LEVEL} == "ERROR" ]]; then
          MSG="-> ❌ Upload failed ${FILE} with Error ${ERROR} <-"
@@ -316,7 +316,7 @@ function rcloneupload() {
    $(which rclone) moveto "${DLFOLDER}/${DIR}/${FILE}" "${REMOTENAME}:/${DIR}/${FILE}" \
       --config="${CONFIG}" \
       --stats=1s --checkers=4 \
-      --drive-chunk-size=32M --use-mmap \
+      --drive-chunk-size=32M \
       --log-level="${LOG_LEVEL}" \
       --user-agent="${USERAGENT}" ${BWLIMIT} \
       --log-file="${LOGFILE}/${FILE}.txt" \
@@ -331,7 +331,7 @@ function rcloneupload() {
    checkerror
    #### ECHO END-PARTS FOR UI READING ####
    $(which find) "${DLFOLDER}/${SETDIR}" -mindepth 1 -type d -empty -delete &>/dev/null
-   sqlite3write "INSERT INTO completed_uploads (drive,filedir,filebase,filesize,gdsa,starttime,endtime,status,error) VALUES ('${DRIVE//\'/\\''}','${DIR//\'/\\''}','${FILE//\'/\\''}','${SIZE//\'/\\''}','${REMOTENAME//\'/\\''}','${STARTZ}','${ENDZ}','${STATUS//\'/\\''}','${ERROR//\'/\\''}'); DELETE FROM uploads WHERE filebase = '${FILE//\'/\\''}';" &>/dev/null
+   sqlite3write "INSERT INTO completed_uploads (drive,filedir,filebase,filesize,gdsa,starttime,endtime,status,error) VALUES ('${DRIVE//\'/\'\'}','${DIR//\'/\'\'}','${FILE//\'/\'\'}','${SIZE}','${REMOTENAME//\'/\'\'}','${STARTZ}','${ENDZ}','${STATUS//\'/\'\'}','${ERROR//\'/\'\'}'); DELETE FROM uploads WHERE filebase = '${FILE//\'/\'\'}';" &>/dev/null
    #### END OF MOVE ####
    $(which rm) -rf "${LOGFILE}/${FILE}.txt" &>/dev/null
    #### REMOVE CUSTOM RCLONE.CONF ####
@@ -373,7 +373,7 @@ function listfiles() {
       LISTSIZE=$($(which stat) -c %s "${DLFOLDER}/${NAME}" 2>/dev/null)
       LISTTYPE="${NAME##*.}"
       if [[ "${LISTTYPE}" == "mkv" ]] || [[ "${LISTTYPE}" == "mp4" ]] || [[ "${LISTTYPE}" == "avi" ]] || [[ "${LISTTYPE}" == "mov" ]] || [[ "${LISTTYPE}" == "mpeg" ]] || [[ "${LISTTYPE}" == "mpegts" ]] || [[ "${LISTTYPE}" == "ts" ]]; then
-         CHECKMETA=$($(which exiftool) -m -q -q -Title "${DLFOLDER}/${NAME}" 2>/dev/null | $(which grep) -qE * && echo 1 || echo 0)
+         CHECKMETA=$($(which exiftool) -m -q -q -Title "${DLFOLDER}/${NAME}" 2>/dev/null | $(which grep) -qE '[A-Za-z]' && echo 1 || echo 0)
       else
          CHECKMETA="0"
       fi
@@ -504,10 +504,37 @@ function startuploader() {
          else
             SEARCHSTRING="ORDER BY time"
          fi
-         FILE=$(sqlite3read "SELECT filebase FROM upload_queue WHERE metadata = 0 ${SEARCHSTRING} LIMIT 1;" 2>/dev/null)
-         DIR=$(sqlite3read "SELECT filedir FROM upload_queue WHERE filebase = '${FILE//\'/\'\'}';" 2>/dev/null)
-         DRIVE=$(sqlite3read "SELECT drive FROM upload_queue WHERE filebase = '${FILE//\'/\'\'}';" 2>/dev/null)
-         SIZEBYTES=$(sqlite3read "SELECT filesize FROM upload_queue WHERE filebase = '${FILE//\'/\'\'}';" 2>/dev/null)
+
+         #### Fill available transfer slots in this cycle ####
+         LOGGED_CAPACITY=false
+         CAPACITY_FLAG="/tmp/uploader_capacity_logged"
+         while true; do
+            ACTIVETRANSFERS=$(sqlite3read "SELECT COUNT(*) FROM uploads;" 2>/dev/null)
+            source /system/uploader/uploader.env
+            if [[ "${TRANSFERS}" != +([0-9.]) ]] || [ "${TRANSFERS}" -gt "99" ] || [ "${TRANSFERS}" -eq "0" ]; then
+               TRANSFERS="1"
+            fi
+            if [[ "${ACTIVETRANSFERS}" -ge "${TRANSFERS}" ]]; then
+               if [[ ! -f "${CAPACITY_FLAG}" ]]; then
+                  log "Capacity reached: ${ACTIVETRANSFERS}/${TRANSFERS}. Waiting for slots."
+                  : > "${CAPACITY_FLAG}"
+               fi
+               $(which sleep) 2
+               break
+            fi
+
+            # Capacity available again; clear flag so future capacity states can log once
+            [ -f "${CAPACITY_FLAG}" ] && $(which rm) -f "${CAPACITY_FLAG}" 2>/dev/null
+
+            FILE=$(sqlite3read "SELECT filebase FROM upload_queue WHERE metadata = 0 ${SEARCHSTRING} LIMIT 1;" 2>/dev/null)
+            if [[ -z "${FILE}" ]]; then
+               log "Queue empty while filling slots. No files to start."
+               break
+            fi
+            DIR=$(sqlite3read "SELECT filedir FROM upload_queue WHERE filebase = '${FILE//\'/\'\'}';" 2>/dev/null)
+            DRIVE=$(sqlite3read "SELECT drive FROM upload_queue WHERE filebase = '${FILE//\'/\'\'}';" 2>/dev/null)
+            SIZEBYTES=$(sqlite3read "SELECT filesize FROM upload_queue WHERE filebase = '${FILE//\'/\'\'}';" 2>/dev/null)
+
             #### TO CHECK IS IT A FILE OR NOT ####
             if [[ -f "${DLFOLDER}/${DIR}/${FILE}" ]]; then
                #### REPULL SOURCE FILE FOR LIVE EDITS ####
@@ -517,16 +544,33 @@ function startuploader() {
                #### UPLOAD FUNCTIONS STARTUP ####
                if [[ "${TRANSFERS}" -eq "1" ]]; then 
                   #### SINGLE UPLOAD ####
+                  log "Starting upload (single mode): ${DRIVE}/${DIR}/${FILE}"
                   rcloneupload
                else
                   #### DEMONISED UPLOAD ####
+                  log "Starting upload in background: ${DRIVE}/${DIR}/${FILE} (active ${ACTIVETRANSFERS}/${TRANSFERS})"
                   rcloneupload &
                fi
             else
                #### WHEN NOT THEN DELETE ENTRY ####
+               log "File missing, removing from queue: ${DRIVE}/${DIR}/${FILE}"
+               # Debug details to diagnose path composition issues
+               FULLPATH="${DLFOLDER}/${DIR}/${FILE}"
+               DBINFO=$(sqlite3read "SELECT drive||'|'||filedir FROM upload_queue WHERE filebase = '${FILE//\'/\'\'}' LIMIT 1;" 2>/dev/null)
+               log "Debug: missing-check fullpath='${FULLPATH}' (DLFOLDER='${DLFOLDER}', DIR='${DIR}', FILE='${FILE}', DB='${DBINFO}')"
                sqlite3write "DELETE FROM upload_queue WHERE filebase = '${FILE//\'/\'\'}';" &>/dev/null
-               $(which sleep) 2
+               # Skip to next file in queue
+               continue
             fi
+
+            #### Recompute remaining queue count ####
+            CHECKFILES=$(sqlite3read "SELECT COUNT(*) FROM upload_queue WHERE metadata = 0;")
+            if [[ "${CHECKFILES}" -lt "1" ]]; then
+               log "Finished filling slots; queue now empty."
+               break
+            fi
+         done
+
          #### CLEANUP COMPLETED HISTORY ####
          cleanuplog
       else
diff --git a/apps/docker-uploader/root/var/www/html/css/styles.css b/apps/docker-uploader/root/var/www/html/css/styles.css
index fd495b4efb..9fac87bf5a 100644
--- a/apps/docker-uploader/root/var/www/html/css/styles.css
+++ b/apps/docker-uploader/root/var/www/html/css/styles.css
@@ -363,6 +363,28 @@ a:hover {
   border-radius: var(--radius-md);
 }
 
+.nav-badge {
+  margin-left: auto;
+  font-size: 0.75rem;
+  padding: 0.25rem 0.5rem;
+  border-radius: 12px;
+  background: rgba(239, 68, 68, 0.2);
+  color: #ef4444;
+  white-space: nowrap;
+  display: inline-flex;
+  align-items: center;
+  gap: 0.25rem;
+}
+
+.nav-badge.failed-badge {
+  background: rgba(239, 68, 68, 0.2);
+  color: #ef4444;
+}
+
+.nav-badge i {
+  font-size: 0.65rem;
+}
+
 .nav-item::before {
   content: "";
   position: absolute;
@@ -607,6 +629,81 @@ a:hover {
   color: var(--text-primary);
 }
 
+/* Settings Styled Select (reuses theme dropdown menu layout) */
+.settings-dropdown {
+  position: relative;
+  width: 100%;
+}
+
+.settings-select-btn {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  width: 100%;
+  height: 44px;
+  background: var(--bg-tertiary);
+  border: 1px solid var(--border-color);
+  border-radius: var(--radius-md);
+  color: var(--text-secondary);
+  cursor: pointer;
+  padding: 0 var(--space-md);
+  transition: all var(--transition);
+}
+
+.settings-select-btn:hover {
+  background: rgba(255, 255, 255, 0.05);
+  border-color: var(--accent-color);
+  color: var(--accent-color);
+  transform: translateY(-1px);
+}
+
+.settings-select-btn .selected-text {
+  font-size: 0.95rem;
+  color: var(--text-primary);
+}
+
+.settings-dropdown-menu {
+  position: absolute;
+  top: calc(100% + 6px);
+  left: 0;
+  right: 0;
+  background: var(--bg-card);
+  border: 1px solid var(--border-color);
+  border-radius: var(--radius-md);
+  box-shadow: var(--shadow-lg);
+  min-width: 100%;
+  max-height: 280px;
+  overflow-y: auto;
+  opacity: 0;
+  visibility: hidden;
+  transform: translateY(-8px);
+  transition: all 0.2s ease;
+  z-index: 1000;
+}
+
+.settings-dropdown-menu.active {
+  opacity: 1;
+  visibility: visible;
+  transform: translateY(0);
+}
+
+.settings-dropdown-item {
+  display: flex;
+  align-items: center;
+  gap: var(--space-md);
+  padding: var(--space-md) var(--space-lg);
+  cursor: pointer;
+  transition: all var(--transition);
+}
+
+.settings-dropdown-item:hover {
+  background: var(--bg-tertiary);
+}
+
+.settings-dropdown-item.active {
+  background: var(--accent-transparent);
+}
+
 .status-indicator {
   display: flex;
   align-items: center;
@@ -1450,15 +1547,15 @@ a:hover {
 }
 
 #active-count-badge {
-  background: rgba(255, 255, 255, 0.3);
-  color: white;
-  padding: 0.125rem 0.5rem;
-  border-radius: 999px;
-  font-size: 0.75rem;
-  min-width: 20px;
-  text-align: center;
+  background: transparent;
+  color: inherit;
+  padding: 0;
+  border-radius: 0;
+  font-size: 0.85rem;
+  min-width: 0;
+  text-align: inherit;
   font-weight: 700;
-  border: 1px solid var(--accent-dark);
+  border: none;
 }
 
 .action-button {
@@ -1532,6 +1629,7 @@ a:hover {
   border: 1px solid var(--border-color);
   background: var(--bg-card);
   box-shadow: var(--shadow-sm);
+  overflow: visible; /* allow custom dropdown menus to extend outside the card */
 }
 
 .settings-grid .card:hover {
@@ -1581,10 +1679,15 @@ a:hover {
 .form-group {
   display: flex;
   flex-direction: column;
-  gap: var(--space-sm);
+  gap: var(--space-md);
   min-height: auto;
 }
 
+/* Extra spacing between stacked form groups (space between previous input and next label) */
+.form-group + .form-group {
+  margin-top: var(--space-xl);
+}
+
 .form-group label {
   font-size: 0.875rem;
   font-weight: 500;
@@ -1714,6 +1817,126 @@ a:hover {
   }
 }
 
+/* Toast Notifications */
+.toast-container {
+  position: fixed;
+  top: 100px;
+  right: 20px;
+  z-index: 10000;
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-md);
+  max-width: 350px;
+}
+
+.toast {
+  display: flex;
+  align-items: center;
+  gap: var(--space-md);
+  padding: var(--space-lg);
+  background: var(--bg-card);
+  border: 1px solid var(--border-color);
+  border-radius: var(--radius-md);
+  box-shadow: var(--shadow-lg);
+  animation: slideInRight 0.3s ease-out;
+  min-width: 300px;
+  position: relative;
+  opacity: 0.7;
+}
+
+.toast.toast-success {
+  border-left: 4px solid var(--success);
+}
+
+.toast.toast-error {
+  border-left: 4px solid var(--danger);
+}
+
+.toast.toast-info {
+  border-left: 4px solid var(--info);
+}
+
+.toast.toast-warning {
+  border-left: 4px solid var(--warning);
+}
+
+.toast-icon {
+  font-size: 1.25rem;
+  flex-shrink: 0;
+}
+
+.toast-success .toast-icon {
+  color: var(--success);
+}
+
+.toast-error .toast-icon {
+  color: var(--danger);
+}
+
+.toast-info .toast-icon {
+  color: var(--info);
+}
+
+.toast-warning .toast-icon {
+  color: var(--warning);
+}
+
+.toast-content {
+  flex: 1;
+}
+
+.toast-title {
+  font-weight: 600;
+  color: var(--text-primary);
+  margin-bottom: 0.25rem;
+}
+
+.toast-message {
+  font-size: 0.875rem;
+  color: var(--text-secondary);
+}
+
+.toast-close {
+  background: none;
+  border: none;
+  color: var(--text-tertiary);
+  cursor: pointer;
+  padding: 0.25rem;
+  font-size: 1rem;
+  opacity: 0.6;
+  transition: opacity var(--transition);
+}
+
+.toast-close:hover {
+  opacity: 1;
+}
+
+@keyframes slideInRight {
+  from {
+    opacity: 0;
+    transform: translateX(100%);
+  }
+  to {
+    opacity: 1;
+    transform: translateX(0);
+  }
+}
+
+@keyframes slideOutRight {
+  from {
+    opacity: 1;
+    transform: translateX(0);
+  }
+  to {
+    opacity: 0;
+    transform: translateX(100%);
+  }
+}
+
+.toast.removing {
+  animation: slideOutRight 0.3s ease-out forwards;
+}
+
 .btn-save-all {
   min-width: 200px;
   font-size: 1rem;
@@ -1895,6 +2118,16 @@ a:hover {
 }
 
 /* Pagination */
+.pagination-card {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  background: var(--bg-card);
+  border-top: 1px solid var(--border-color);
+  padding: var(--space-md) var(--space-lg);
+  border-radius: 0 0 var(--radius-lg) var(--radius-lg);
+}
+
 .pagination-container {
   display: flex;
   align-items: center;
@@ -1904,6 +2137,13 @@ a:hover {
   border-top: 1px solid var(--border-color);
 }
 
+.pagination-container.pagination-standalone {
+  padding-top: 0;
+  margin-top: 0;
+  border-top: 0;
+  width: 100%;
+}
+
 .pagination {
   display: flex;
   gap: var(--space-xs);
@@ -2106,9 +2346,56 @@ a:hover {
   background: var(--accent-transparent);
   color: var(--accent-color);
   border-radius: 999px;
-  font-size: 0.75rem;
+}
+
+/* Filter Buttons */
+.filter-buttons {
+  display: flex;
+  gap: var(--space-sm);
+  align-items: center;
+}
+
+.filter-btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.5rem;
+  padding: 0.5rem 1rem;
+  background: var(--bg-tertiary);
+  color: var(--text-secondary);
+  border: 1px solid var(--border-color);
+  border-radius: var(--radius-sm);
+  cursor: pointer;
+  font-size: 0.9rem;
+  transition: all var(--transition);
+}
+
+.filter-btn:hover {
+  background: var(--accent-transparent);
+  color: var(--accent-color);
+  border-color: var(--accent-color);
+}
+
+.filter-btn.active {
+  background: var(--accent-color);
+  color: var(--bg-primary);
+  border-color: var(--accent-color);
   font-weight: 600;
-  border: 1px solid var(--accent-color);
+}
+
+.filter-btn i {
+  font-size: 0.85rem;
+}
+
+/* Error indicators in tables */
+.table-danger {
+  background-color: rgba(239, 68, 68, 0.1);
+}
+
+.table td.has-error {
+  cursor: help;
+  text-decoration: underline;
+  text-decoration-style: dotted;
+  text-decoration-color: #ef4444;
 }
 
 .toggle-time-format {
diff --git a/apps/docker-uploader/root/var/www/html/index.html b/apps/docker-uploader/root/var/www/html/index.html
index d91ea6c696..dc7ebab446 100755
--- a/apps/docker-uploader/root/var/www/html/index.html
+++ b/apps/docker-uploader/root/var/www/html/index.html
@@ -12,7 +12,7 @@
       referrerpolicy="no-referrer"
     />
     <link rel="shortcut icon" type="image/x-icon" href="/favicon.ico" />
-    <link rel="stylesheet" href="css/styles.css?v=4.2.8" />
+    <link rel="stylesheet" href="css/styles.css?v=5.3.23.7" />
   </head>
   <body>
     <!-- Mobile Menu Toggle -->
@@ -49,6 +49,14 @@
         <a href="#history" class="nav-item" data-section="history">
           <i class="fas fa-history"></i>
           <span>History</span>
+          <span
+            class="nav-badge failed-badge"
+            id="failed-count-badge"
+            style="display: none"
+          >
+            <i class="fas fa-exclamation-circle"></i>
+            <span id="failed-badge-count">0</span>
+          </span>
         </a>
         <a href="#settings" class="nav-item" data-section="settings">
           <i class="fas fa-cog"></i>
@@ -559,6 +567,29 @@
               Completed Uploads
             </div>
             <div class="card-actions">
+              <div class="filter-buttons" style="margin-right: 15px">
+                <button
+                  class="filter-btn active"
+                  data-filter="all"
+                  id="filter-all"
+                >
+                  <i class="fas fa-list"></i> All
+                </button>
+                <button
+                  class="filter-btn"
+                  data-filter="success"
+                  id="filter-success"
+                >
+                  <i class="fas fa-check"></i> Successful
+                </button>
+                <button
+                  class="filter-btn"
+                  data-filter="failed"
+                  id="filter-failed"
+                >
+                  <i class="fas fa-exclamation-circle"></i> Failed
+                </button>
+              </div>
               <span id="clnHist" class="action-button">
                 <i class="fas fa-trash-alt"></i>
                 Clear History
@@ -600,54 +631,50 @@
                     </td>
                   </tr>
                 </tbody>
-                <tfoot>
-                  <tr>
-                    <td colspan="6">
-                      <div class="pagination-container">
-                        <div id="page"></div>
-                        <nav aria-label="Page size selection">
-                          <ul id="pageSize" class="pagination pagination-sm">
-                            <li class="page-item">
-                              <a
-                                class="page-link"
-                                href="#"
-                                aria-label="Show 5 items per page"
-                                >5</a
-                              >
-                            </li>
-                            <li class="page-item active">
-                              <a
-                                class="page-link"
-                                href="#"
-                                aria-label="Show 10 items per page"
-                                >10</a
-                              >
-                            </li>
-                            <li class="page-item">
-                              <a
-                                class="page-link"
-                                href="#"
-                                aria-label="Show 25 items per page"
-                                >25</a
-                              >
-                            </li>
-                            <li class="page-item">
-                              <a
-                                class="page-link"
-                                href="#"
-                                aria-label="Show 50 items per page"
-                                >50</a
-                              >
-                            </li>
-                          </ul>
-                        </nav>
-                      </div>
-                    </td>
-                  </tr>
-                </tfoot>
               </table>
             </div>
           </div>
+          <div class="card-footer pagination-card">
+            <div class="pagination-container pagination-standalone">
+              <div id="page"></div>
+              <nav aria-label="Page size selection">
+                <ul id="pageSize" class="pagination pagination-sm">
+                  <li class="page-item">
+                    <a
+                      class="page-link"
+                      href="#"
+                      aria-label="Show 5 items per page"
+                      >5</a
+                    >
+                  </li>
+                  <li class="page-item active">
+                    <a
+                      class="page-link"
+                      href="#"
+                      aria-label="Show 10 items per page"
+                      >10</a
+                    >
+                  </li>
+                  <li class="page-item">
+                    <a
+                      class="page-link"
+                      href="#"
+                      aria-label="Show 25 items per page"
+                      >25</a
+                    >
+                  </li>
+                  <li class="page-item">
+                    <a
+                      class="page-link"
+                      href="#"
+                      aria-label="Show 50 items per page"
+                      >50</a
+                    >
+                  </li>
+                </ul>
+              </nav>
+            </div>
+          </div>
         </div>
       </section>
 
@@ -672,35 +699,97 @@
             </span>
           </div>
           <div class="settings-grid">
-            <!-- Transfer Settings -->
+            <!-- System Settings -->
             <div class="card">
               <div class="card-header">
                 <div class="card-title">
-                  <i class="fas fa-exchange-alt"></i>
-                  Transfer Settings
+                  <i class="fas fa-cogs"></i>
+                  System Settings
                 </div>
               </div>
               <div class="card-body">
                 <div class="form-group">
-                  <label for="bandwidth_limit">Bandwidth Limit (MB/s)</label>
+                  <label for="puid">PUID</label>
+                  <input
+                    type="number"
+                    id="puid"
+                    name="puid"
+                    class="form-control"
+                    placeholder="1000"
+                    min="0"
+                  />
+                </div>
+                <div class="form-group">
+                  <label for="pgid">PGID</label>
+                  <input
+                    type="number"
+                    id="pgid"
+                    name="pgid"
+                    class="form-control"
+                    placeholder="1000"
+                    min="0"
+                  />
+                </div>
+                <div class="form-group">
+                  <label for="timezone">Timezone</label>
                   <input
                     type="text"
-                    id="bandwidth_limit"
-                    name="bandwidth_limit"
+                    id="timezone"
+                    name="timezone"
                     class="form-control"
-                    value="30"
+                    placeholder="UTC or Region/City"
+                  />
+                </div>
+                <div class="form-group">
+                  <label for="language">Language</label>
+                  <select id="language" name="language" class="form-control">
+                    <option value="en" selected>English</option>
+                    <option value="de">German</option>
+                  </select>
+                </div>
+              </div>
+            </div>
+
+            <!-- User Settings -->
+            <div class="card">
+              <div class="card-header">
+                <div class="card-title">
+                  <i class="fas fa-user-cog"></i>
+                  User Settings
+                </div>
+              </div>
+              <div class="card-body">
+                <div class="form-group">
+                  <label for="driveusedspace">Drive Used Space</label>
+                  <input
+                    type="text"
+                    id="driveusedspace"
+                    name="driveusedspace"
+                    class="form-control"
+                    placeholder="null or e.g. 500GB"
                   />
                 </div>
                 <div class="form-group">
-                  <label for="transfers">Max Transfers</label>
+                  <label for="folder_depth">Folder Depth</label>
                   <input
                     type="number"
-                    id="transfers"
-                    name="transfers"
+                    id="folder_depth"
+                    name="folder_depth"
                     class="form-control"
-                    value="2"
+                    value="1"
                     min="1"
-                    max="10"
+                  />
+                </div>
+                <div class="form-group">
+                  <label for="folder_priority"
+                    >Folder Priority (comma-separated drives)</label
+                  >
+                  <input
+                    type="text"
+                    id="folder_priority"
+                    name="folder_priority"
+                    class="form-control"
+                    placeholder="driveA,driveB,driveC or null"
                   />
                 </div>
                 <div class="form-group">
@@ -714,70 +803,156 @@
                     min="0"
                   />
                 </div>
+              </div>
+            </div>
+
+            <!-- Rclone Settings -->
+            <div class="card">
+              <div class="card-header">
+                <div class="card-title">
+                  <i class="fas fa-hdd"></i>
+                  Rclone Settings
+                </div>
+              </div>
+              <div class="card-body">
+                <div class="form-group">
+                  <label for="bandwidth_limit">Bandwidth Limit (MB/s)</label>
+                  <input
+                    type="text"
+                    id="bandwidth_limit"
+                    name="bandwidth_limit"
+                    class="form-control"
+                    value="30"
+                  />
+                </div>
                 <div class="form-group">
-                  <label for="folder_depth">Folder Depth</label>
+                  <label for="transfers">Transfers</label>
                   <input
                     type="number"
-                    id="folder_depth"
-                    name="folder_depth"
+                    id="transfers"
+                    name="transfers"
                     class="form-control"
-                    value="1"
+                    value="2"
                     min="1"
+                    max="10"
+                  />
+                </div>
+                <div class="form-group">
+                  <label for="google_ip">Google IP</label>
+                  <input
+                    type="text"
+                    id="google_ip"
+                    name="google_ip"
+                    class="form-control"
+                    placeholder="142.250.74.78"
+                  />
+                </div>
+                <div class="form-group">
+                  <label for="proxy">Proxy</label>
+                  <input
+                    type="text"
+                    id="proxy"
+                    name="proxy"
+                    class="form-control"
+                    placeholder="http://user:pass@host:port or null"
+                  />
+                </div>
+                <div class="form-group">
+                  <label for="dlfolder">Download Folder</label>
+                  <input
+                    type="text"
+                    id="dlfolder"
+                    name="dlfolder"
+                    class="form-control"
+                    placeholder="/mnt/downloads"
+                  />
+                </div>
+                <div class="form-group toggle-group">
+                  <label for="vfs_refresh_enable">VFS Refresh</label>
+                  <label class="toggle-switch">
+                    <input
+                      type="checkbox"
+                      id="vfs_refresh_enable"
+                      name="vfs_refresh_enable"
+                      checked
+                    />
+                    <span class="toggle-slider"></span>
+                  </label>
+                </div>
+                <div class="form-group">
+                  <label for="mount">Mount Target</label>
+                  <input
+                    type="text"
+                    id="mount"
+                    name="mount"
+                    class="form-control"
+                    placeholder="mount:8554"
                   />
                 </div>
               </div>
             </div>
 
-            <!-- Notification Settings -->
+            <!-- Encryption Settings -->
             <div class="card">
               <div class="card-header">
                 <div class="card-title">
-                  <i class="fas fa-bell"></i>
-                  Notifications
+                  <i class="fas fa-shield-alt"></i>
+                  Encryption Settings
                 </div>
               </div>
               <div class="card-body">
                 <div class="form-group">
-                  <label for="notification_level">Notification Level</label>
+                  <label for="hashpassword">Hash Password (Google)</label>
                   <select
-                    id="notification_level"
-                    name="notification_level"
+                    id="hashpassword"
+                    name="hashpassword"
                     class="form-control"
                   >
-                    <option value="ALL" selected>ALL</option>
-                    <option value="ERROR">ERROR</option>
-                    <option value="NONE">NONE</option>
+                    <option value="hashed" selected>Hashed</option>
+                    <option value="plain">Plain</option>
                   </select>
                 </div>
                 <div class="form-group">
-                  <label for="notification_servername">Server Name</label>
+                  <label for="gdsa_name">GDSA Name (Google)</label>
                   <input
                     type="text"
-                    id="notification_servername"
-                    name="notification_servername"
+                    id="gdsa_name"
+                    name="gdsa_name"
                     class="form-control"
-                    value="Drive-Upload"
+                    value="encrypt"
                   />
                 </div>
                 <div class="form-group">
-                  <label for="notification_url">Notification URL</label>
+                  <label for="db_name">DB Name (Dropbox)</label>
                   <input
                     type="text"
-                    id="notification_url"
-                    name="notification_url"
+                    id="db_name"
+                    name="db_name"
                     class="form-control"
-                    placeholder="discord://webhook-url"
+                    value="encrypt"
                   />
                 </div>
+                <div class="form-group toggle-group">
+                  <label for="db_team">DB Team (Dropbox)</label>
+                  <label class="toggle-switch">
+                    <input
+                      type="checkbox"
+                      id="db_team"
+                      name="db_team"
+                      checked
+                    />
+                    <span class="toggle-slider"></span>
+                  </label>
+                </div>
               </div>
             </div>
 
-            <!-- System Settings -->
+            <!-- Log Settings -->
             <div class="card">
               <div class="card-header">
                 <div class="card-title">
-                  <i class="fas fa-cogs"></i>
-                  System
+                  <i class="fas fa-clipboard-list"></i>
+                  Log Settings
                 </div>
               </div>
               <div class="card-body">
@@ -801,24 +976,16 @@
                     min="100"
                   />
                 </div>
-                <div class="form-group toggle-group">
-                  <label for="vfs_refresh_enable">VFS Refresh</label>
-                  <label class="toggle-switch">
-                    <input
-                      type="checkbox"
-                      id="vfs_refresh_enable"
-                      name="vfs_refresh_enable"
-                      checked
-                    />
-                    <span class="toggle-slider"></span>
-                  </label>
-                </div>
                 <div class="form-group">
-                  <label for="language">Language</label>
-                  <select id="language" name="language" class="form-control">
-                    <option value="en" selected>English</option>
-                    <option value="de">German</option>
-                  </select>
+                  <label for="log_retention_days">Log Retention (days)</label>
+                  <input
+                    type="number"
+                    id="log_retention_days"
+                    name="log_retention_days"
+                    class="form-control"
+                    placeholder="null or number"
+                    min="0"
+                  />
                 </div>
               </div>
             </div>
@@ -828,7 +995,7 @@
               <div class="card-header">
                 <div class="card-title">
                   <i class="fas fa-search"></i>
-                  AutoScan
+                  AutoScan Settings
                 </div>
               </div>
               <div class="card-body">
@@ -865,58 +1032,69 @@
               </div>
             </div>
 
-            <!-- Security Settings -->
+            <!-- Striparr Settings -->
             <div class="card">
               <div class="card-header">
                 <div class="card-title">
-                  <i class="fas fa-shield-alt"></i>
-                  Security
+                  <i class="fas fa-cut"></i>
+                  Striparr Settings
                 </div>
               </div>
               <div class="card-body">
                 <div class="form-group">
-                  <label for="hashpassword">Hash Password</label>
-                  <select
-                    id="hashpassword"
-                    name="hashpassword"
+                  <label for="striparr_url">Striparr URL</label>
+                  <input
+                    type="text"
+                    id="striparr_url"
+                    name="striparr_url"
                     class="form-control"
-                  >
-                    <option value="hashed" selected>Hashed</option>
-                    <option value="plain">Plain</option>
-                  </select>
+                    placeholder="http://striparr:xxxx or null"
+                  />
                 </div>
+              </div>
+            </div>
+
+            <!-- Notification Settings -->
+            <div class="card">
+              <div class="card-header">
+                <div class="card-title">
+                  <i class="fas fa-bell"></i>
+                  Notification Settings
+                </div>
+              </div>
+              <div class="card-body">
                 <div class="form-group">
-                  <label for="gdsa_name">GDSA Name</label>
+                  <label for="notification_url">Notification URL</label>
                   <input
                     type="text"
-                    id="gdsa_name"
-                    name="gdsa_name"
+                    id="notification_url"
+                    name="notification_url"
                     class="form-control"
-                    value="encrypt"
+                    placeholder="discord://webhook-url"
                   />
                 </div>
                 <div class="form-group">
-                  <label for="db_name">DB Name</label>
+                  <label for="notification_level">Notification Level</label>
+                  <select
+                    id="notification_level"
+                    name="notification_level"
+                    class="form-control"
+                  >
+                    <option value="ALL" selected>ALL</option>
+                    <option value="ERROR">ERROR</option>
+                    <option value="NONE">NONE</option>
+                  </select>
+                </div>
+                <div class="form-group">
+                  <label for="notification_servername">Server Name</label>
                   <input
                     type="text"
-                    id="db_name"
-                    name="db_name"
+                    id="notification_servername"
+                    name="notification_servername"
                     class="form-control"
-                    value="encrypt"
+                    value="Drive-Upload"
                   />
                 </div>
-                <div class="form-group toggle-group">
-                  <label for="db_team">DB Team</label>
-                  <label class="toggle-switch">
-                    <input
-                      type="checkbox"
-                      id="db_team"
-                      name="db_team"
-                      checked
-                    />
-                    <span class="toggle-slider"></span>
-                  </label>
-                </div>
               </div>
             </div>
           </div>
@@ -1206,9 +1384,9 @@ <h2 style="font-size: 2rem; margin-bottom: 0.5rem">
 
     <!-- Scripts -->
     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
-    <script src="js/ui/pagination.js?v=4.2.8"></script>
-    <script src="js/utils.js?v=4.2.8"></script>
-    <script src="js/app.js?v=4.2.8"></script>
+    <script src="js/ui/pagination.js?v=5.3.23.7"></script>
+    <script src="js/utils.js?v=5.3.23.7"></script>
+    <script src="js/app.js?v=5.3.23.7"></script>
 
     <script>
       $(document).ready(function () {
diff --git a/apps/docker-uploader/root/var/www/html/js/app.js b/apps/docker-uploader/root/var/www/html/js/app.js
index 415515816f..913407f5fb 100755
--- a/apps/docker-uploader/root/var/www/html/js/app.js
+++ b/apps/docker-uploader/root/var/www/html/js/app.js
@@ -13,12 +13,15 @@ const uploaderApp = {
   completedTodaySize: 0,
   // Store env settings loaded from the API
   envSettings: {},
+  // Current filter in history section
+  historyFilter: "all",
   // Interval IDs for periodic updates
   intervals: {
     inProgress: null,
     completed: null,
     stats: null,
     queue: null,
+    failedCount: null,
   },
 };
 
@@ -36,6 +39,9 @@ $(document).ready(function () {
   // Setup event listeners
   setupEventListeners();
 
+  // Initialize styled selects in settings
+  initStyledSelects();
+
   // Start periodic updates
   startPeriodicUpdates();
 
@@ -60,6 +66,8 @@ function initializeApp() {
   updateRealTimeStats();
   // Load dashboard recent activity
   loadDashboardActivity();
+  // Load failed uploads count
+  updateFailedCount();
 }
 
 /**
@@ -187,6 +195,30 @@ function compareVersions(v1, v2) {
   return 0;
 }
 
+/**
+ * Update failed uploads count badge
+ */
+function updateFailedCount() {
+  fetch("srv/api/jobs/failed_count.php")
+    .then((response) => response.json())
+    .then((data) => {
+      const count = data.count || 0;
+      const $badge = $("#failed-count-badge");
+      const $badgeCount = $("#failed-badge-count");
+
+      $badgeCount.text(count);
+
+      if (count > 0) {
+        $badge.show();
+      } else {
+        $badge.hide();
+      }
+    })
+    .catch((error) => {
+      console.error("Failed to fetch failed uploads count:", error);
+    });
+}
+
 /**
  * Set up all event listeners
  */
@@ -238,10 +270,10 @@ function setupEventListeners() {
       url: "srv/api/system/clean_history.php",
       success: function () {
         handleCompletedJobList();
-        showStatusMessage("Upload history cleared successfully");
+        showToast("Upload history cleared successfully", "success", 2500);
       },
       error: function () {
-        showStatusMessage("Failed to clear upload history", true);
+        showToast("Failed to clear upload history", "error", 3000);
       },
     });
   });
@@ -260,6 +292,14 @@ function setupEventListeners() {
     handleCompletedJobList();
   });
 
+  // History filter buttons
+  $(".filter-btn").on("click", function () {
+    $(".filter-btn").removeClass("active");
+    $(this).addClass("active");
+    uploaderApp.historyFilter = $(this).data("filter");
+    handleCompletedJobList();
+  });
+
   // Chart time range selector
   $("#chart-timerange").on("change", function () {
     const timeRange = $(this).val();
@@ -360,11 +400,7 @@ function setupFormSubmissions() {
   }
 
   function showAutoSaveIndicator() {
-    const $indicator = $(".auto-save-indicator");
-    $indicator.fadeIn(300);
-    setTimeout(() => {
-      $indicator.fadeOut(300);
-    }, 2000);
+    showToast("Settings auto-saved successfully", "success", 2500);
   }
 
   $("#unified-settings-form").on(
@@ -402,6 +438,81 @@ function setupFormSubmissions() {
   });
 }
 
+/**
+ * Initialize styled selects in the settings form using a dropdown
+ * layout similar to the theme selector. Keeps the original select hidden
+ * and syncs value changes to trigger auto-save.
+ */
+function initStyledSelects() {
+  const $form = $("#unified-settings-form");
+  if ($form.length === 0) return;
+
+  // Enhance each select with a styled dropdown
+  $form.find(".form-group select").each(function () {
+    const $select = $(this);
+    if ($select.data("styled")) return; // avoid double init
+
+    // Build dropdown structure
+    const currentText = $select.find("option:selected").text();
+    const $dropdown = $(`
+      <div class="settings-dropdown">
+        <button type="button" class="settings-select-btn" aria-haspopup="listbox" aria-expanded="false">
+          <span class="selected-text"></span>
+          <i class="fas fa-chevron-down"></i>
+        </button>
+        <div class="settings-dropdown-menu" role="listbox"></div>
+      </div>
+    `);
+
+    $dropdown.find(".selected-text").text(currentText);
+
+    const $menu = $dropdown.find(".settings-dropdown-menu");
+    $select.find("option").each(function () {
+      const value = $(this).attr("value");
+      const label = $(this).text();
+      const isSelected = $(this).is(":selected");
+      const $item = $(
+        `<div class="settings-dropdown-item" role="option" data-value="${value}">${label}</div>`
+      );
+      if (isSelected) $item.addClass("active");
+      $menu.append($item);
+    });
+
+    // Hide original select and insert dropdown after it
+    $select.hide().after($dropdown);
+    $select.data("styled", true);
+
+    // Toggle menu
+    const $btn = $dropdown.find(".settings-select-btn");
+    $btn.on("click", function (e) {
+      e.stopPropagation();
+      const expanded = $(this).attr("aria-expanded") === "true";
+      $(this).attr("aria-expanded", expanded ? "false" : "true");
+      $menu.toggleClass("active", !expanded);
+    });
+
+    // Close when clicking outside
+    $(document).on("click", function () {
+      $menu.removeClass("active");
+      $btn.attr("aria-expanded", "false");
+    });
+
+    // Select item
+    $menu.on("click", ".settings-dropdown-item", function (e) {
+      e.stopPropagation();
+      const value = $(this).data("value");
+      const label = $(this).text();
+      $menu.find(".settings-dropdown-item").removeClass("active");
+      $(this).addClass("active");
+      $dropdown.find(".selected-text").text(label);
+      $menu.removeClass("active");
+      $btn.attr("aria-expanded", "false");
+      // Update original select and trigger change for auto-save
+      $select.val(value).trigger("change");
+    });
+  });
+}
+
 /**
  * Start all periodic update intervals
  */
@@ -574,9 +685,15 @@ function handleCompletedJobList() {
   $("#pageSize > li.page-item").removeClass("active");
   $(`#pageSize > li.page-item:contains("${savedPageSize}")`).addClass("active");
 
+  // Determine which API endpoint to use based on filter
+  let apiEndpoint = "srv/api/jobs/completed.php";
+  if (uploaderApp.historyFilter === "failed") {
+    apiEndpoint = "srv/api/jobs/failed.php";
+  }
+
   // Initialize pagination
   $("#page").pagination({
-    dataSource: "srv/api/jobs/completed.php",
+    dataSource: apiEndpoint,
     locator: "jobs",
     ulClassName: "pagination pagination-sm",
     totalNumberLocator: function (response) {
@@ -603,6 +720,8 @@ function handleCompletedJobList() {
     afterPaging: function () {
       // After page changes, fetch complete upload stats for today
       fetchCompletedTodayStats();
+      // Also update failed count
+      updateFailedCount();
     },
     callback: function (data, pagination) {
       // Add Bootstrap classes to pagination links
@@ -612,8 +731,12 @@ function handleCompletedJobList() {
       $completedTableBody.empty();
 
       if (!data || data.length === 0) {
+        const message =
+          uploaderApp.historyFilter === "failed"
+            ? "No failed uploads"
+            : "No completed uploads";
         $completedTableBody.append(
-          '<tr><td colspan="7" class="no-uploads-message text-center">No completed uploads</td></tr>'
+          `<tr><td colspan="7" class="no-uploads-message text-center">${message}</td></tr>`
         );
         $("#clnHist").hide();
         return;
@@ -658,7 +781,15 @@ function handleCompletedJobList() {
             .attr("data-title", "Time spent")
             .text(job.time_elapsed || "n/a")
         );
-        row.append($("<td>").attr("data-title", "Uploaded").text(endTime));
+
+        // Show error message in tooltip for failed uploads
+        let uploadedCell = $("<td>")
+          .attr("data-title", "Uploaded")
+          .text(endTime);
+        if (!job.successful && job.error_message) {
+          uploadedCell.attr("title", job.error_message).addClass("has-error");
+        }
+        row.append(uploadedCell);
 
         $completedTableBody.append(row);
       });
@@ -843,7 +974,7 @@ function alignPauseControl(status, fromUserAction = false) {
     $control.attr("aria-label", "Pause uploads");
 
     if (fromUserAction) {
-      showStatusMessage("Uploader is running");
+      showToast("Uploader is running", "success");
       updateStatusIndicator("active", "Active");
     }
   } else if (status === "STOPPED") {
@@ -854,7 +985,7 @@ function alignPauseControl(status, fromUserAction = false) {
     $control.attr("aria-label", "Resume uploads");
 
     if (fromUserAction) {
-      showStatusMessage("Uploader is paused");
+      showToast("Uploader is paused", "warning");
       updateStatusIndicator("paused", "Paused");
     }
   }
@@ -921,9 +1052,9 @@ function setupPauseControl() {
       error: function (xhr, status, error) {
         console.error("Failed to update status:", error);
         console.log("Response:", xhr.responseText);
-        showStatusMessage(
+        showToast(
           "Failed to update status. Check console for details.",
-          true
+          "error"
         );
       },
       complete: function () {
@@ -1160,10 +1291,24 @@ function populateFormFields(settings) {
     if ($field.length) {
       if ($field.is("select")) {
         $field.val(value.toString());
+        // If this select is styled, sync the visible dropdown text and active item
+        const $dropdown = $field.next(".settings-dropdown");
+        if ($dropdown.length) {
+          const label = $field.find(`option[value="${value}"]`).text() || value;
+          $dropdown.find(".selected-text").text(label);
+          const $menu = $dropdown.find(".settings-dropdown-menu");
+          $menu.find(".settings-dropdown-item").removeClass("active");
+          $menu
+            .find(`.settings-dropdown-item[data-value="${value}"]`)
+            .addClass("active");
+        }
       } else if ($field.is(":checkbox")) {
         $field.prop("checked", value === true || value === "true");
       } else {
-        $field.val(value);
+        // Strip quotes from string values like "null"
+        const cleanVal =
+          typeof value === "string" ? value.replace(/"/g, "") : value;
+        $field.val(cleanVal);
       }
     }
   });
@@ -1187,6 +1332,22 @@ function updateUIFromSettings(settings) {
     const cleanBwLimit = bwLimit.replace(/"/g, "");
     $("#rate-limit").text(`Limit per Transfer: ${cleanBwLimit}`);
   }
+
+  // Refresh styled selects to reflect updated values
+  $("#unified-settings-form select").each(function () {
+    const $select = $(this);
+    const $dropdown = $select.next(".settings-dropdown");
+    if ($dropdown.length) {
+      const value = $select.val();
+      const label = $select.find(`option[value="${value}"]`).text() || value;
+      $dropdown.find(".selected-text").text(label);
+      const $menu = $dropdown.find(".settings-dropdown-menu");
+      $menu.find(".settings-dropdown-item").removeClass("active");
+      $menu
+        .find(`.settings-dropdown-item[data-value="${value}"]`)
+        .addClass("active");
+    }
+  });
 }
 
 /**
@@ -1232,7 +1393,7 @@ function updateEnvSettings(formId, settings) {
       console.log("API response:", response);
 
       if (response.success) {
-        showStatusMessage("Settings updated successfully!");
+        showToast("Settings updated successfully!", "success");
 
         // Update local settings
         Object.assign(uploaderApp.envSettings, settings);
@@ -1272,10 +1433,10 @@ function updateEnvSettings(formId, settings) {
           originalText,
           function (success) {
             if (!success) {
-              showStatusMessage(
+              showToast(
                 "Failed to update settings: " +
                   (response.message || "Unknown error"),
-                true
+                "error"
               );
             }
           }
@@ -1292,7 +1453,7 @@ function updateEnvSettings(formId, settings) {
         originalText,
         function (success) {
           if (!success) {
-            showStatusMessage("Failed to communicate with the server", true);
+            showToast("Failed to communicate with the server", "error", 3000);
             console.error("Response:", xhr.responseText);
           }
         }
@@ -1337,7 +1498,7 @@ function updateEnvSettingsLegacy(
     dataType: "json",
     success: function (response) {
       if (response.success) {
-        showStatusMessage("Settings updated successfully!");
+        showToast("Settings updated successfully!", "success");
 
         // Update local settings
         Object.assign(uploaderApp.envSettings, settings);
diff --git a/apps/docker-uploader/root/var/www/html/js/utils.js b/apps/docker-uploader/root/var/www/html/js/utils.js
index 90e8af5792..a014699ab6 100644
--- a/apps/docker-uploader/root/var/www/html/js/utils.js
+++ b/apps/docker-uploader/root/var/www/html/js/utils.js
@@ -125,7 +125,7 @@ async function fetchWithErrorHandling(url, options = {}) {
     return await response.json();
   } catch (error) {
     console.error("Fetch error:", error);
-    showStatusMessage(`Failed to fetch data: ${error.message}`, true);
+    showToast(`Failed to fetch data: ${error.message}`, "error");
     throw error;
   }
 }
@@ -194,6 +194,73 @@ function getQueryParams() {
   return params;
 }
 
+/**
+ * Show a toast notification
+ * @param {string} message - Message to display
+ * @param {string} type - Type of toast (success, error, info, warning)
+ * @param {number} duration - Duration in milliseconds (default: 3000)
+ */
+function showToast(message, type = "info", duration = 3000) {
+  // Create toast container if it doesn't exist
+  let container = document.querySelector(".toast-container");
+  if (!container) {
+    container = document.createElement("div");
+    container.className = "toast-container";
+    document.body.appendChild(container);
+  }
+
+  // Create toast element
+  const toast = document.createElement("div");
+  toast.className = `toast toast-${type}`;
+
+  // Set icon based on type
+  const icons = {
+    success: "fa-check-circle",
+    error: "fa-exclamation-circle",
+    info: "fa-info-circle",
+    warning: "fa-exclamation-triangle",
+  };
+
+  toast.innerHTML = `
+    <div class="toast-icon">
+      <i class="fas ${icons[type] || icons.info}"></i>
+    </div>
+    <div class="toast-content">
+      <div class="toast-message">${message}</div>
+    </div>
+    <button class="toast-close" aria-label="Close">
+      <i class="fas fa-times"></i>
+    </button>
+  `;
+
+  // Add to container
+  container.appendChild(toast);
+
+  // Close button handler
+  const closeBtn = toast.querySelector(".toast-close");
+  closeBtn.addEventListener("click", () => {
+    removeToast(toast);
+  });
+
+  // Auto-remove after duration
+  setTimeout(() => {
+    removeToast(toast);
+  }, duration);
+}
+
+/**
+ * Remove a toast notification
+ * @param {HTMLElement} toast - Toast element to remove
+ */
+function removeToast(toast) {
+  toast.classList.add("removing");
+  setTimeout(() => {
+    if (toast.parentNode) {
+      toast.parentNode.removeChild(toast);
+    }
+  }, 300);
+}
+
 /**
  * Save a user setting to localStorage
  * @param {string} key - Setting key
diff --git a/apps/docker-uploader/root/var/www/html/release.json b/apps/docker-uploader/root/var/www/html/release.json
deleted file mode 100644
index 95159a2072..0000000000
--- a/apps/docker-uploader/root/var/www/html/release.json
+++ /dev/null
@@ -1,10 +0,0 @@
-{
-  "appname": "docker-uploader",
-  "apppic": "./images/docker-uploader.png",
-  "appfolder": "./",
-  "newversion": "5.0.0",
-  "baseimage": "ghcr.io/linuxserver/baseimage-alpine",
-  "baseversion": "3.18-bd2a5b02-ls10",
-  "body": "Upgrading docker-uploader to ",
-  "user": "dockserver image update[bot]"
-}
diff --git a/apps/docker-uploader/root/var/www/html/srv/api/jobs/failed.php b/apps/docker-uploader/root/var/www/html/srv/api/jobs/failed.php
new file mode 100644
index 0000000000..ea06bbc326
--- /dev/null
+++ b/apps/docker-uploader/root/var/www/html/srv/api/jobs/failed.php
@@ -0,0 +1,83 @@
+<?php
+include_once('../../../settings.php');
+include_once('../../entities/ApiResponse.php');
+include_once('../../entities/UploadJobStatus.php');
+include_once('../../utility.php');
+
+function getFailedUploads()
+{
+    $response = new ApiResponse();
+    $response->jobs = [];
+
+    try {
+        $db = new SQLite3(DATABASE, SQLITE3_OPEN_READONLY);
+        $db->busyTimeout(5000); // Wait up to 5 seconds if database is locked
+
+        $pagination_query = "";
+        $count_result = $db->query("SELECT count(*) as COUNT FROM completed_uploads WHERE status = 0");
+        $total_records = $count_result->fetchArray()['COUNT'];
+        $response->total_count = $total_records;
+
+        // Handle pagination
+        if (
+            isset($_GET["pageNumber"]) && isset($_GET["pageSize"])
+            && is_numeric($_GET["pageNumber"]) && is_numeric($_GET["pageSize"]) && $total_records >= 5
+        ) {
+            $current_page = intval($_GET["pageNumber"]);
+            $page_size = intval($_GET["pageSize"]);
+            $total_pages = ceil($total_records / $page_size);
+
+            if ($current_page > $total_pages) {
+                $current_page = $total_pages;
+            }
+            if ($current_page < 1) {
+                $current_page = 1;
+            }
+            if ($page_size > 50 || $page_size < 1) {
+                $page_size = 10;
+            }
+
+            $offset = ($current_page - 1) * $page_size;
+            $pagination_query .= " LIMIT $page_size OFFSET $offset ";
+        }
+
+        $results = $db->query("SELECT drive, filedir, filebase, filesize, gdsa, starttime, endtime, status, error
+                               FROM completed_uploads 
+                               WHERE status = 0 
+                               ORDER BY endtime DESC " . $pagination_query);
+
+        while ($row = $results->fetchArray()) {
+            try {
+                $jobStatus = new UploadJobStatus();
+                $jobStatus->job_last_update_timestamp = $row['endtime'];
+                $jobStatus->job_name = $row['filebase'];
+                $jobStatus->drive = $row['drive'];
+                $jobStatus->gdsa = $row['gdsa'];
+                $jobStatus->file_directory = $row['filedir'];
+                $jobStatus->file_name = $row['filebase'];
+                $jobStatus->file_size = $row['filesize'];
+                $jobStatus->time_end = date('d.m.y H:i:s', $row['endtime']);
+                $jobStatus->time_end_clean = secs_to_str(time() - $row['endtime']) . ' ago';
+                $jobStatus->time_start = $row['starttime'];
+                $jobStatus->time_elapsed = secs_to_str($row['endtime'] - $row['starttime']);
+                $jobStatus->successful = false; // Always false for failed uploads
+                $jobStatus->error_message = $row['error']; // Include error message
+                $response->jobs[] = $jobStatus;
+            } catch (Exception $e) {
+                //TODO: Error handling.. logfile?
+            }
+        }
+
+        $db?->close();
+        unset($db);
+        return json_encode($response);
+    } catch (Exception $e) {
+        error_log("Database error in failed.php: " . $e->getMessage());
+        $response->total_count = 0;
+        return json_encode($response);
+    }
+}
+
+/** actual logic */
+header('Content-Type: application/json; charset=utf-8');
+echo getFailedUploads();
diff --git a/apps/docker-uploader/root/var/www/html/srv/api/jobs/failed_count.php b/apps/docker-uploader/root/var/www/html/srv/api/jobs/failed_count.php
new file mode 100644
index 0000000000..b0495b2335
--- /dev/null
+++ b/apps/docker-uploader/root/var/www/html/srv/api/jobs/failed_count.php
@@ -0,0 +1,38 @@
+<?php
+include_once('../../../settings.php');
+
+function getFailedCount()
+{
+    $response = array(
+        'count' => 0
+    );
+
+    try {
+        if (!file_exists(DATABASE)) {
+            $response['error'] = 'Database file not found';
+            return json_encode($response);
+        }
+
+        $db = new SQLite3(DATABASE, SQLITE3_OPEN_READONLY);
+        $db->busyTimeout(5000);
+
+        try {
+            $result = $db->querySingle("SELECT count(*) as COUNT FROM completed_uploads WHERE status = 0", true);
+            if ($result && is_array($result)) {
+                $response['count'] = (int)$result['COUNT'];
+            }
+        } catch (Exception $e) {
+            $response['error'] = $db->lastErrorMsg();
+        }
+
+        $db?->close();
+    } catch (Exception $e) {
+        $response['error'] = $e->getMessage();
+    }
+
+    return json_encode($response);
+}
+
+/** actual logic */
+header('Content-Type: application/json; charset=utf-8');
+echo getFailedCount();
diff --git a/apps/docker-uploader/root/var/www/html/srv/api/settings/update.php b/apps/docker-uploader/root/var/www/html/srv/api/settings/update.php
index 7cdc6089f7..a103901a42 100644
--- a/apps/docker-uploader/root/var/www/html/srv/api/settings/update.php
+++ b/apps/docker-uploader/root/var/www/html/srv/api/settings/update.php
@@ -19,6 +19,11 @@ function updateEnvFile($settings)
 
     // Update the values
     foreach ($settings as $key => $value) {
+        // Normalize PROXY to explicit empty quotes when blank/null-ish
+        if ($key === 'PROXY' && ($value === 'null' || $value === null || $value === '')) {
+            $value = '""';
+        }
+
         $found = false;
         foreach ($lines as &$line) {
             if (preg_match('/^' . $key . '=/', $line)) {
@@ -79,7 +84,9 @@ function updateEnvFile($settings)
 
                     // Format the value
                     $valueFormatted = $value;
-                    if ($value !== 'true' && $value !== 'false' && $value !== 'null' && !is_numeric($value)) {
+                    if ($value === '""') {
+                        $valueFormatted = '""';
+                    } elseif ($value !== 'true' && $value !== 'false' && $value !== 'null' && !is_numeric($value)) {
                         $valueFormatted = '"' . $value . '"';
                     }
 
diff --git a/apps/docker-uploader/root/var/www/html/srv/api/system/update_env.php b/apps/docker-uploader/root/var/www/html/srv/api/system/update_env.php
index 4f4d979075..cefe257553 100644
--- a/apps/docker-uploader/root/var/www/html/srv/api/system/update_env.php
+++ b/apps/docker-uploader/root/var/www/html/srv/api/system/update_env.php
@@ -119,6 +119,12 @@ function updateEnvSettings()
             error_log("Added M suffix to bandwidth limit: $value");
         }
 
+        // Ensure PROXY is stored as an empty quoted string when blank or null-ish
+        if ($key === 'PROXY' && ($value === 'null' || $value === null || $value === '')) {
+            $value = '""';
+            error_log("Normalized PROXY value to explicit empty quotes");
+        }
+
         error_log("Processed setting: $key=$value");
     }
     // Important: unset the reference to avoid issues
diff --git a/apps/docker-uploader/root/var/www/html/srv/entities/UploadJobStatus.php b/apps/docker-uploader/root/var/www/html/srv/entities/UploadJobStatus.php
index bf27f34dce..619bf4c3d6 100755
--- a/apps/docker-uploader/root/var/www/html/srv/entities/UploadJobStatus.php
+++ b/apps/docker-uploader/root/var/www/html/srv/entities/UploadJobStatus.php
@@ -17,4 +17,5 @@ class UploadJobStatus
     public $time_end_clean;
     public $time_elapsed;
     public $successful;
+    public $error_message;
 }