Merge pull request #38 from christianlouis/dropbox-token-wizard

Implement Dropbox integration with OAuth and error handling

app/api.py

@@ -644,4 +644,297 @@ async def get_onedrive_full_config(request: Request):
             "message": str(e)
         }
 
+@router.post("/dropbox/exchange-token")
+@require_login
+async def exchange_dropbox_token(
+    request: Request,
+    client_id: str = Form(...),
+    client_secret: str = Form(...),
+    redirect_uri: str = Form(...),
+    code: str = Form(...),
+    folder_path: str = Form(None)
+):
+    """
+    Exchange an authorization code for a refresh token from Dropbox.
+    This is done on the server to avoid exposing client secret in the browser.
+    """
+    try:
+        logger.info("Starting Dropbox token exchange process")
+        
+        # Prepare the token request
+        token_url = "https://api.dropboxapi.com/oauth2/token"
+        
+        payload = {
+            'client_id': client_id,
+            'client_secret': client_secret,
+            'code': code,
+            'redirect_uri': redirect_uri,
+            'grant_type': 'authorization_code'
+        }
+        
+        # Log request details (excluding secret)
+        safe_payload = payload.copy()
+        safe_payload['client_secret'] = '[REDACTED]' 
+        safe_payload['code'] = f"{code[:5]}...{code[-5:]}" if len(code) > 10 else '[REDACTED]'
+        logger.info(f"Token exchange request payload: {safe_payload}")
+        
+        # Make the token request
+        logger.info("Sending POST request to Dropbox for token exchange")
+        response = requests.post(token_url, data=payload)
+        
+        # Check if the request was successful
+        logger.info(f"Token exchange response status: {response.status_code}")
+        
+        if response.status_code != 200:
+            # Log the error response for debugging
+            try:
+                error_json = response.json()
+                logger.error(f"Token exchange failed with status {response.status_code}: {error_json}")
+                error_detail = error_json
+            except Exception as json_err:
+                logger.error(f"Failed to parse error response as JSON: {str(json_err)}")
+                logger.error(f"Raw response content: {response.content[:500]}")  # Limit log size
+                error_detail = {"error": "Unknown error", "raw_content_snippet": str(response.content[:100])}
+            
+            raise HTTPException(
+                status_code=status.HTTP_400_BAD_REQUEST,
+                detail=f"Token exchange failed: {error_detail}"
+            )
+            
+        # Return the token response
+        token_data = response.json()
+        
+        # Validate the token response
+        if "refresh_token" not in token_data:
+            logger.error(f"Dropbox returned success but no refresh token found in response: {token_data.keys()}")
+            raise HTTPException(
+                status_code=status.HTTP_502_BAD_GATEWAY,
+                detail="Dropbox OAuth server returned success but no refresh token was included"
+            )
+        
+        # Calculate token length for logging
+        refresh_token_length = len(token_data.get("refresh_token", ""))
+        access_token_length = len(token_data.get("access_token", ""))
+        
+        logger.info(f"Successfully exchanged authorization code for Dropbox tokens. "
+                   f"Refresh token length: {refresh_token_length}, "
+                   f"Access token length: {access_token_length}")
+        
+        # Return just what's needed by the frontend
+        return {
+            "refresh_token": token_data["refresh_token"],
+            "access_token": token_data["access_token"],
+            "expires_in": token_data.get("expires_in", 14400)
+        }
+        
+    except HTTPException:
+        # Re-raise HTTP exceptions as they already have appropriate status codes
+        raise
+    except Exception as e:
+        logger.exception(f"Unexpected error during Dropbox token exchange: {str(e)}")
+        raise HTTPException(
+            status_code=status.HTTP_500_INTERNAL_SERVER_ERROR,
+            detail=f"Failed to exchange token: {str(e)}"
+        )
+
+@router.post("/dropbox/update-settings")
+@require_login
+async def update_dropbox_settings(
+    request: Request,
+    app_key: str = Form(None),
+    app_secret: str = Form(None),
+    refresh_token: str = Form(...),
+    folder_path: str = Form(None)
+):
+    """
+    Update Dropbox settings in memory
+    """
+    try:
+        logger.info("Updating Dropbox settings in memory")
+        
+        # Update settings in memory
+        if refresh_token:
+            settings.dropbox_refresh_token = refresh_token
+            logger.info("Updated DROPBOX_REFRESH_TOKEN in memory")
+            
+        if app_key:
+            settings.dropbox_app_key = app_key
+            logger.info("Updated DROPBOX_APP_KEY in memory")
+            
+        if app_secret:
+            settings.dropbox_app_secret = app_secret
+            logger.info("Updated DROPBOX_APP_SECRET in memory")
+            
+        if folder_path:
+            settings.dropbox_folder = folder_path
+            logger.info("Updated DROPBOX_FOLDER in memory")
+        
+        # Test token validity would be here, but we'll skip it for now
+        
+        return {
+            "status": "success",
+            "message": "Dropbox settings have been updated in memory"
+        }
+        
+    except Exception as e:
+        logger.exception(f"Unexpected error updating Dropbox settings: {str(e)}")
+        raise HTTPException(
+            status_code=status.HTTP_500_INTERNAL_SERVER_ERROR,
+            detail=f"Failed to update Dropbox settings: {str(e)}"
+        )
+
+@router.get("/dropbox/test-token")
+@require_login
+async def test_dropbox_token(request: Request):
+    """
+    Test if the configured Dropbox refresh token is valid.
+    """
+    try:
+        from app.tasks.upload_to_dropbox import get_dropbox_client
+        
+        logger.info("Testing Dropbox token validity")
+        if not settings.dropbox_refresh_token:
+            logger.warning("No Dropbox refresh token configured")
+            return {
+                "status": "error", 
+                "message": "No Dropbox refresh token is configured"
+            }
+        
+        # Check if app key and app secret are configured
+        if not settings.dropbox_app_key or not settings.dropbox_app_secret:
+            logger.warning("Dropbox app key or app secret is missing")
+            return {
+                "status": "error",
+                "message": "Dropbox app key or app secret is missing",
+                "missing_config": True
+            }
+        
+        # Try to get a client using the configured refresh token
+        try:
+            dbx = get_dropbox_client()
+            # Test connection by getting account info
+            account = dbx.users_get_current_account()
+            logger.info(f"Successfully connected to Dropbox as {account.name.display_name}")
+            
+            return {
+                "status": "success",
+                "message": f"Token is valid! Connected as {account.name.display_name}",
+                "account": account.name.display_name,
+                "email": account.email
+            }
+        except Exception as e:
+            error_msg = str(e)
+            logger.error(f"Dropbox token test failed: {error_msg}")
+            
+            # Determine if this is an authentication error
+            is_auth_error = "auth" in error_msg.lower() or "invalid" in error_msg.lower()
+            
+            return {
+                "status": "error",
+                "message": f"Token validation failed: {error_msg}",
+                "is_auth_error": is_auth_error,
+                "needs_reauth": is_auth_error
+            }
+    
+    except Exception as e:
+        logger.exception("Unexpected error testing Dropbox token")
+        return {
+            "status": "error",
+            "message": f"Unexpected error: {str(e)}"
+        }
+
+@router.post("/dropbox/save-settings")
+@require_login
+async def save_dropbox_settings(
+    request: Request,
+    app_key: str = Form(None),
+    app_secret: str = Form(None),
+    refresh_token: str = Form(...),
+    folder_path: str = Form(None)
+):
+    """
+    Save Dropbox settings to the .env file
+    """
+    try:
+        # Get the path to the .env file
+        env_path = os.path.join(os.path.dirname(os.path.dirname(os.path.dirname(__file__))), ".env")
+        
+        if not os.path.exists(env_path):
+            logger.error(f".env file not found at {env_path}")
+            raise HTTPException(
+                status_code=status.HTTP_500_INTERNAL_SERVER_ERROR,
+                detail="Could not find .env file to update"
+            )
+            
+        logger.info(f"Updating Dropbox settings in {env_path}")
+        
+        # Read the current .env file
+        with open(env_path, "r") as f:
+            env_lines = f.readlines()
+            
+        # Define settings to update
+        dropbox_settings = {
+            "DROPBOX_REFRESH_TOKEN": refresh_token,
+        }
+        
+        # Only update these if provided
+        if app_key:
+            dropbox_settings["DROPBOX_APP_KEY"] = app_key
+        if app_secret:
+            dropbox_settings["DROPBOX_APP_SECRET"] = app_secret
+        if folder_path:
+            dropbox_settings["DROPBOX_FOLDER"] = folder_path
+            
+        # Process each line and update or add settings
+        updated = set()
+        new_env_lines = []
+        for line in env_lines:
+            line = line.rstrip()
+            is_updated = False
+            for key, value in dropbox_settings.items():
+                if line.startswith(f"{key}=") or line.startswith(f"# {key}="):
+                    if line.startswith("# "):  # Uncomment if commented out
+                        line = line[2:]
+                    new_env_lines.append(f"{key}={value}")
+                    updated.add(key)
+                    is_updated = True
+                    break
+            if not is_updated:
+                new_env_lines.append(line)
+                
+        # Add any settings that weren't updated (they weren't in the file)
+        for key, value in dropbox_settings.items():
+            if key not in updated:
+                new_env_lines.append(f"{key}={value}")
+                
+        # Write the updated .env file
+        with open(env_path, "w") as f:
+            f.write("\n".join(new_env_lines) + "\n")
+            
+        # Update the settings in memory
+        if refresh_token:
+            settings.dropbox_refresh_token = refresh_token
+        if app_key:
+            settings.dropbox_app_key = app_key
+        if app_secret:
+            settings.dropbox_app_secret = app_secret
+        if folder_path:
+            settings.dropbox_folder = folder_path
+            
+        logger.info("Successfully updated Dropbox settings")
+        
+        return {
+            "status": "success",
+            "message": "Dropbox settings have been saved"
+        }
+        
+    except HTTPException:
+        raise
+    except Exception as e:
+        logger.exception(f"Unexpected error saving Dropbox settings: {str(e)}")
+        raise HTTPException(
+            status_code=status.HTTP_500_INTERNAL_SERVER_ERROR,
+            detail=f"Failed to save Dropbox settings: {str(e)}"
+        )
+
 

app/frontend.py

@@ -70,6 +70,7 @@ async def status_dashboard(request: Request):
         {
             "request": request, 
             "providers": providers,
+            "app_version": settings.version,  # Add app version to the context
             "debug_enabled": getattr(settings, 'debug', False),
             "last_check": datetime.now().strftime("%Y-%m-%d %H:%M:%S")
         }
@@ -159,3 +160,60 @@ async def onedrive_callback(request: Request, code: str = None, error: str = Non
         }
     )
 
+@router.get("/dropbox-setup")
+@require_login
+async def dropbox_setup_page(request: Request):
+    """
+    Setup page for the Dropbox integration.
+    Shows configuration status and setup instructions.
+    """
+    # Check Dropbox configuration
+    is_configured = bool(settings.dropbox_app_key and 
+                         settings.dropbox_app_secret and 
+                         settings.dropbox_refresh_token)
+    
+    return templates.TemplateResponse(
+        "dropbox.html",
+        {
+            "request": request,
+            "is_configured": is_configured,
+            "app_key_value": settings.dropbox_app_key or "",
+            "app_secret_value": settings.dropbox_app_secret if settings.dropbox_app_secret else "",
+            "refresh_token_value": settings.dropbox_refresh_token if settings.dropbox_refresh_token else "",
+            "folder_path": settings.dropbox_folder or "/Documents/Uploads"  # Default folder path
+        }
+    )
+
+@router.get("/dropbox-callback")
+@require_login
+async def dropbox_callback(request: Request, code: str = None, error: str = None):
+    """
+    Callback endpoint for Dropbox OAuth flow.
+    Automatically exchanges the code for a token and saves it to the configuration.
+    """
+    if error:
+        return templates.TemplateResponse(
+            "dropbox_callback_error.html",
+            {"request": request, "error": error}
+        )
+    
+    if not code:
+        return templates.TemplateResponse(
+            "dropbox_callback_error.html",
+            {"request": request, "error": "No authorization code received from Dropbox"}
+        )
+    
+    # Display the processing page with automatic token exchange
+    # Note: We provide empty strings for app_key_value and app_secret_value
+    # to prevent overriding what's in sessionStorage
+    return templates.TemplateResponse(
+        "dropbox_callback.html",
+        {
+            "request": request, 
+            "code": code,
+            "app_key_value": "",  # The callback will prioritize sessionStorage values
+            "app_secret_value": "",  # The callback will prioritize sessionStorage values
+            "folder_path": ""  # The callback will prioritize sessionStorage values
+        }
+    )
+

app/tasks/process_document.py

@@ -26,7 +26,7 @@ def process_document(original_local_file: str):
       2. If not found, insert a new DB row and continue with the pipeline:
          - Copy file to /workdir/tmp
          - Check for embedded text. If present, run local GPT extraction
-         - Otherwise, queue Textract-based OCR
+         - Otherwise, queue Azure Document Intelligence processing
     """
 
     if not os.path.exists(original_local_file):

app/tasks/refine_text_with_gpt.py

@@ -30,5 +30,5 @@ def refine_text_with_gpt(filename: str, raw_text: str):
     from app.tasks.extract_metadata_with_gpt import extract_metadata_with_gpt
     extract_metadata_with_gpt.delay(filename, cleaned_text)
 
-    return {"s3_file": filename, "cleaned_text": cleaned_text}
+    return {"filename": filename, "cleaned_text": cleaned_text}
 

app/tasks/upload_to_dropbox.py

@@ -56,6 +56,49 @@ def get_dropbox_access_token():
         logger.error(error_msg)
         raise Exception(error_msg)
 
+def get_dropbox_client():
+    """
+    Create and return an authenticated Dropbox client using the configured refresh token.
+    
+    Returns:
+        dropbox.Dropbox: Authenticated Dropbox client instance
+    
+    Raises:
+        ValueError: If required Dropbox configuration is missing
+        AuthError: If authentication with Dropbox fails
+    """
+    app_key = settings.dropbox_app_key
+    app_secret = settings.dropbox_app_secret
+    refresh_token = settings.dropbox_refresh_token
+    
+    # Validate configuration
+    if not app_key or not app_secret:
+        raise ValueError("Dropbox app key or app secret is not configured")
+    
+    if not refresh_token:
+        raise ValueError("Dropbox refresh token is not configured")
+    
+    # Create a Dropbox client with refresh token
+    try:
+        dbx = dropbox.Dropbox(
+            app_key=app_key,
+            app_secret=app_secret,
+            oauth2_refresh_token=refresh_token
+        )
+        
+        # Test the connection
+        dbx.users_get_current_account()
+        logger.info("Successfully authenticated with Dropbox")
+        return dbx
+    
+    except AuthError as auth_error:
+        logger.error(f"Dropbox authentication failed: {str(auth_error)}")
+        raise
+    
+    except Exception as e:
+        logger.error(f"Error creating Dropbox client: {str(e)}")
+        raise
+
 @celery.task(base=BaseTaskWithRetry)
 def upload_to_dropbox(file_path: str):
     """
@@ -76,12 +119,8 @@ def upload_to_dropbox(file_path: str):
     filename = os.path.basename(file_path)
     
     try:
-        # Get access token from refresh token
+        # Get the Dropbox client
-        access_token = get_dropbox_access_token()
+        dbx = get_dropbox_client()
-        if not access_token:
-            return {"status": "Failed", "reason": "Could not obtain access token"}
-            
-        dbx = dropbox.Dropbox(access_token)
         
         # Calculate remote path based on local file structure
         remote_base = settings.dropbox_folder or ""

app/utils/config_validator.py

@@ -137,123 +137,226 @@ def validate_storage_configs():
     
     return issues
 
+def mask_sensitive_value(value):
+    """Helper function to mask sensitive values consistently"""
+    if not value:
+        return "Not set"
+    
+    if isinstance(value, str):
+        if len(value) > 10:
+            visible_start = max(1, len(value) // 3)
+            visible_end = max(1, len(value) // 4)
+            return f"{value[:visible_start]}{'*' * (len(value) - visible_start - visible_end)}{value[-visible_end:]}"
+        else:
+            return f"{value[:2]}{'*' * (len(value) - 4)}{value[-2:]}" if len(value) > 4 else "****"
+    elif not isinstance(value, (bool, int, float)):
+        return "**Configured Value**"
+    return str(value)
+
 def get_provider_status():
     """Returns status information for all configured providers"""
     providers = {}
     
-    # Check Dropbox configuration
+    # Add Dropbox configuration - alphabetically ordered providers
     providers["Dropbox"] = {
         "name": "Dropbox", 
-        "configured": bool(getattr(settings, 'dropbox_refresh_token', None)),
+        "icon": "dropbox",
+        "configured": bool(getattr(settings, 'dropbox_app_key', None) and
+                          getattr(settings, 'dropbox_app_secret', None) and
+                          getattr(settings, 'dropbox_refresh_token', None)),
         "enabled": True,
+        "description": "Upload files to Dropbox cloud storage",
         "details": {
-            "folder": getattr(settings, 'dropbox_folder', 'Not set')
+            "folder": getattr(settings, 'dropbox_folder', 'Not set'),
+            "app_key": getattr(settings, 'dropbox_app_key', 'Not set'),
+            "app_secret": mask_sensitive_value(getattr(settings, 'dropbox_app_secret', None)),
+            "refresh_token": mask_sensitive_value(getattr(settings, 'dropbox_refresh_token', None))
         }
     }
     
-    # Check Paperless configuration
+    # Add Email configuration
-    providers["Paperless-ngx"] = {
+    providers["Email"] = {
-        "name": "Paperless-ngx", 
+        "name": "Email", 
-        "configured": bool(getattr(settings, 'paperless_host', None) and 
+        "icon": "mail",
-                         getattr(settings, 'paperless_ngx_api_token', None)),
+        "configured": bool(getattr(settings, 'email_host', None) and 
+                         getattr(settings, 'email_default_recipient', None)),
         "enabled": True,
+        "description": "Send documents via email",
         "details": {
-            "host": getattr(settings, 'paperless_host', 'Not set')
+            "host": getattr(settings, 'email_host', 'Not set'),
-        }
+            "port": getattr(settings, 'email_port', 'Not set'),
-    }
+            "username": getattr(settings, 'email_username', 'Not set'),
-    
+            "password": mask_sensitive_value(getattr(settings, 'email_password', None)),
-    # Check NextCloud configuration
+            "use_tls": getattr(settings, 'email_use_tls', 'Not set'),
-    providers["NextCloud"] = {
+            "sender": getattr(settings, 'email_sender', 'Not set'),
-        "name": "NextCloud", 
+            "default_recipient": getattr(settings, 'email_default_recipient', 'Not set')
-        "configured": bool(getattr(settings, 'nextcloud_upload_url', None) and 
-                          getattr(settings, 'nextcloud_username', None) and 
-                          getattr(settings, 'nextcloud_password', None)),
-        "enabled": True,
-        "details": {
-            "url": getattr(settings, 'nextcloud_upload_url', 'Not set'),
-            "folder": getattr(settings, 'nextcloud_folder', 'Not set')
-        }
-    }
-    
-    # Check SFTP configuration
-    providers["SFTP Storage"] = {
-        "name": "SFTP Storage", 
-        "configured": bool(getattr(settings, 'sftp_host', None) and 
-                          getattr(settings, 'sftp_username', None) and 
-                          (getattr(settings, 'sftp_password', None) or 
-                           getattr(settings, 'sftp_private_key', None))),
-        "enabled": True,
-        "details": {
-            "host": getattr(settings, 'sftp_host', 'Not set'),
-            "folder": getattr(settings, 'sftp_folder', 'Not set')
-        }
-    }
-    
-    # Check S3 configuration
-    providers["S3 Storage"] = {
-        "name": "S3 Storage", 
-        "configured": bool(getattr(settings, 's3_bucket_name', None) and 
-                          getattr(settings, 'aws_access_key_id', None) and 
-                          getattr(settings, 'aws_secret_access_key', None)),
-        "enabled": True,
-        "details": {
-            "bucket": getattr(settings, 's3_bucket_name', 'Not set'),
-            "region": getattr(settings, 'aws_region', 'Not set')
-        }
-    }
-    
-    # Check Google Drive configuration
-    providers["Google Drive"] = {
-        "name": "Google Drive", 
-        "configured": bool(getattr(settings, 'google_drive_credentials_json', None) and 
-                          getattr(settings, 'google_drive_folder_id', None)),
-        "enabled": True,
-        "details": {
-            "folder_id": getattr(settings, 'google_drive_folder_id', 'Not set'),
-            "delegate": getattr(settings, 'google_drive_delegate_to', 'Not set')
-        }
-    }
-    
-    # Check OneDrive configuration
-    providers["OneDrive"] = {
-        "name": "OneDrive", 
-        "configured": bool(getattr(settings, 'onedrive_client_id', None) and 
-                          getattr(settings, 'onedrive_client_secret', None) and 
-                          getattr(settings, 'onedrive_refresh_token', None)),
-        "enabled": True,
-        "details": {
-            "folder": getattr(settings, 'onedrive_folder_path', 'Not set')
-        }
-    }
-
-    # Check WebDAV configuration
-    providers["WebDAV"] = {
-        "name": "WebDAV", 
-        "configured": bool(getattr(settings, 'webdav_url', None) and 
-                          getattr(settings, 'webdav_username', None) and 
-                          getattr(settings, 'webdav_password', None)),
-        "enabled": True,
-        "details": {
-            "url": getattr(settings, 'webdav_url', 'Not set'),
-            "folder": getattr(settings, 'webdav_folder', 'Not set')
         }
     }
     
     # Add FTP configuration to providers
     providers["FTP Storage"] = {
         "name": "FTP Storage",
+        "icon": "ftp",
         "configured": bool(getattr(settings, 'ftp_host', None) and
                           getattr(settings, 'ftp_username', None) and
                           getattr(settings, 'ftp_password', None)),
         "enabled": True,
+        "description": "Upload files to FTP server",
         "details": {
             "host": getattr(settings, 'ftp_host', 'Not set'),
+            "port": getattr(settings, 'ftp_port', 'Not set'),
+            "username": getattr(settings, 'ftp_username', 'Not set'),
+            "password": mask_sensitive_value(getattr(settings, 'ftp_password', None)),
             "folder": getattr(settings, 'ftp_folder', 'Not set'),
             "tls": getattr(settings, 'ftp_use_tls', True),
             "allow_plaintext": getattr(settings, 'ftp_allow_plaintext', True)
         }
     }
     
+    # Check Google Drive configuration
+    providers["Google Drive"] = {
+        "name": "Google Drive", 
+        "icon": "google",
+        "configured": bool(getattr(settings, 'google_drive_credentials_json', None) and 
+                          getattr(settings, 'google_drive_folder_id', None)),
+        "enabled": True,
+        "description": "Store documents in Google Drive",
+        "details": {
+            "credentials_json": mask_sensitive_value(getattr(settings, 'google_drive_credentials_json', None)),
+            "folder_id": getattr(settings, 'google_drive_folder_id', 'Not set'),
+            "delegate": getattr(settings, 'google_drive_delegate_to', 'Not set')
+        }
+    }
+    
+    # Check NextCloud configuration
+    nextcloud_url = getattr(settings, 'nextcloud_upload_url', 'Not set')
+    # Extract base URL from WebDAV URL (remove the /remote.php part and everything after it)
+    if nextcloud_url != 'Not set' and '/remote.php' in nextcloud_url:
+        nextcloud_base_url = nextcloud_url.split('/remote.php')[0]
+    else:
+        nextcloud_base_url = nextcloud_url
+        
+    providers["NextCloud"] = {
+        "name": "NextCloud", 
+        "icon": "cloud",
+        "configured": bool(getattr(settings, 'nextcloud_upload_url', None) and 
+                          getattr(settings, 'nextcloud_username', None) and 
+                          getattr(settings, 'nextcloud_password', None)),
+        "enabled": True,
+        "description": "Store documents in NextCloud",
+        "details": {
+            "url": getattr(settings, 'nextcloud_upload_url', 'Not set'),
+            "base_url": nextcloud_base_url,
+            "username": getattr(settings, 'nextcloud_username', 'Not set'),
+            "password": mask_sensitive_value(getattr(settings, 'nextcloud_password', None)),
+            "folder": getattr(settings, 'nextcloud_folder', 'Not set')
+        }
+    }
+    
+    # Check OneDrive configuration
+    providers["OneDrive"] = {
+        "name": "OneDrive", 
+        "icon": "microsoft",
+        "configured": bool(getattr(settings, 'onedrive_client_id', None) and 
+                          getattr(settings, 'onedrive_client_secret', None) and 
+                          getattr(settings, 'onedrive_refresh_token', None)),
+        "enabled": True,
+        "description": "Store documents in Microsoft OneDrive",
+        "details": {
+            "client_id": getattr(settings, 'onedrive_client_id', 'Not set'),
+            "client_secret": mask_sensitive_value(getattr(settings, 'onedrive_client_secret', None)),
+            "tenant_id": getattr(settings, 'onedrive_tenant_id', 'Not set'),
+            "refresh_token": mask_sensitive_value(getattr(settings, 'onedrive_refresh_token', None)),
+            "folder": getattr(settings, 'onedrive_folder_path', 'Not set')
+        }
+    }
+    
+    # Check Paperless configuration
+    providers["Paperless-ngx"] = {
+        "name": "Paperless-ngx", 
+        "icon": "file-text",
+        "configured": bool(getattr(settings, 'paperless_host', None) and 
+                         getattr(settings, 'paperless_ngx_api_token', None)),
+        "enabled": True,
+        "description": "Document management system for digital archives",
+        "details": {
+            "host": getattr(settings, 'paperless_host', 'Not set'),
+            "api_token": mask_sensitive_value(getattr(settings, 'paperless_ngx_api_token', None))
+        }
+    }
+    
+    # Check S3 configuration
+    providers["S3 Storage"] = {
+        "name": "S3 Storage",
+        "icon": "database",
+        "configured": bool(getattr(settings, 's3_bucket_name', None) and 
+                          getattr(settings, 'aws_access_key_id', None) and 
+                          getattr(settings, 'aws_secret_access_key', None)),
+        "enabled": True,
+        "description": "Store documents in S3-compatible object storage",
+        "details": {
+            "bucket": getattr(settings, 's3_bucket_name', 'Not set'),
+            "region": getattr(settings, 'aws_region', 'Not set'),
+            "access_key_id": getattr(settings, 'aws_access_key_id', 'Not set'),
+            "secret_access_key": mask_sensitive_value(getattr(settings, 'aws_secret_access_key', None)),
+            "folder_prefix": getattr(settings, 's3_folder_prefix', 'Not set'),
+            "storage_class": getattr(settings, 's3_storage_class', 'Not set'),
+            "acl": getattr(settings, 's3_acl', 'Not set')
+        }
+    }
+    
+    # Check SFTP configuration
+    providers["SFTP Storage"] = {
+        "name": "SFTP Storage", 
+        "icon": "server",
+        "configured": bool(getattr(settings, 'sftp_host', None) and 
+                          getattr(settings, 'sftp_username', None) and 
+                          (getattr(settings, 'sftp_password', None) or 
+                           getattr(settings, 'sftp_private_key', None))),
+        "enabled": True,
+        "description": "Upload files to SFTP server",
+        "details": {
+            "host": getattr(settings, 'sftp_host', 'Not set'),
+            "port": getattr(settings, 'sftp_port', 'Not set'),
+            "username": getattr(settings, 'sftp_username', 'Not set'),
+            "password": mask_sensitive_value(getattr(settings, 'sftp_password', None)),
+            "private_key": getattr(settings, 'sftp_private_key', 'Not set'),
+            "private_key_passphrase": mask_sensitive_value(getattr(settings, 'sftp_private_key_passphrase', None)),
+            "folder": getattr(settings, 'sftp_folder', 'Not set')
+        }
+    }
+
+    # Add Uptime Kuma configuration
+    providers["Uptime Kuma"] = {
+        "name": "Uptime Kuma",
+        "icon": "activity",
+        "configured": bool(getattr(settings, 'uptime_kuma_url', None)),
+        "enabled": True,
+        "description": "Server monitoring and status page",
+        "details": {
+            "url": getattr(settings, 'uptime_kuma_url', 'Not set'),
+            "ping_interval": getattr(settings, 'uptime_kuma_ping_interval', 'Not set')
+        }
+    }
+
+    # Check WebDAV configuration
+    providers["WebDAV"] = {
+        "name": "WebDAV", 
+        "icon": "globe",
+        "configured": bool(getattr(settings, 'webdav_url', None) and 
+                          getattr(settings, 'webdav_username', None) and 
+                          getattr(settings, 'webdav_password', None)),
+        "enabled": True,
+        "description": "Store documents on WebDAV servers",
+        "details": {
+            "url": getattr(settings, 'webdav_url', 'Not set'),
+            "username": getattr(settings, 'webdav_username', 'Not set'),
+            "password": mask_sensitive_value(getattr(settings, 'webdav_password', None)),
+            "folder": getattr(settings, 'webdav_folder', 'Not set'),
+            "verify_ssl": getattr(settings, 'webdav_verify_ssl', 'Not set')
+        }
+    }
+    
     return providers
 
 def dump_all_settings():
@@ -265,7 +368,12 @@ def dump_all_settings():
             # Mask sensitive values in logs
             if key.lower().find('password') >= 0 or key.lower().find('secret') >= 0 or key.lower().find('token') >= 0 or key.lower().find('key') >= 0:
                 if value:
-                    value = "********" 
+                    if isinstance(value, str) and len(value) > 10:
+                        visible_start = max(1, len(value) // 3)
+                        visible_end = max(1, len(value) // 4)
+                        value = f"{value[:visible_start]}{'*' * (len(value) - visible_start - visible_end)}{value[-visible_end:]}"
+                    else:
+                        value = f"{value[:2]}{'*' * (len(value) - 4)}{value[-2:]}" if isinstance(value, str) and len(value) > 4 else "****"
             logger.info(f"{key}: {value}")
     logger.info("--- END OF SETTINGS DUMP ---")
 
@@ -434,17 +542,26 @@ def get_settings_for_display(show_values=False):
                 # List of patterns that indicate sensitive values
                 sensitive_patterns = [
                     'password', 'secret', 'token', 'api_key', 'private_key',
-                    'credentials', 'access_key', 'auth'
+                    'credentials', 'access_key', 'ai_key'
                 ]
                 
                 # Check if this is a sensitive value that should be masked
-                is_sensitive = any(pattern in key.lower() for pattern in sensitive_patterns)
+                is_sensitive = any(
+                    pattern in key.lower() for pattern in sensitive_patterns
+                )
+                
+                # Special handling for "auth" to avoid matching prefixes like "authentik"
+                if not is_sensitive and "auth" in key.lower():
+                    # Only mark as sensitive if "auth" is a standalone word or at the end
+                    # This avoids matching "authentik" as sensitive
+                    parts = key.lower().split('_')
+                    is_sensitive = any(part == "auth" for part in parts) or key.lower().endswith("auth")
                 
                 # Mask sensitive values regardless of debug mode
                 # Other values are only hidden if debug mode is off AND show_values is False
                 if (is_sensitive or not show_values) and value:
                     if is_sensitive:
-                        value = "********" 
+                        value = mask_sensitive_value(value)
                 
                 # Check if the setting is configured (has a non-None value)
                 # For boolean settings, consider them configured even if False

frontend/templates/base.html

@@ -36,34 +36,6 @@
           <a href="/upload" class="text-gray-700 hover:text-gray-900">Upload</a>
           <a href="/files" class="text-gray-700 hover:text-gray-900">Files</a>
           <a href="/status" class="text-gray-700 hover:text-gray-900">Status</a>
-          
-          <!-- Integrations Dropdown -->
-          <div class="relative inline-block text-left" x-data="{ open: false }">
-            <button @click="open = !open" class="text-gray-700 hover:text-gray-900 inline-flex items-center">
-              Integrations
-              <svg class="ml-1 h-5 w-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
-                <path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd" />
-              </svg>
-            </button>
-
-            <div 
-              x-show="open" 
-              @click.away="open = false"
-              class="origin-top-right absolute right-0 mt-2 w-48 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none"
-              x-transition:enter="transition ease-out duration-100"
-              x-transition:enter-start="transform opacity-0 scale-95"
-              x-transition:enter-end="transform opacity-100 scale-100"
-              x-transition:leave="transition ease-in duration-75"
-              x-transition:leave-start="transform opacity-100 scale-100"
-              x-transition:leave-end="transform opacity-0 scale-95"
-            >
-              <div class="py-1">
-                <a href="/onedrive-setup" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900">OneDrive Setup</a>
-                <!-- Add other integration setup links here -->
-              </div>
-            </div>
-          </div>
-
           <a href="/about" class="text-gray-700 hover:text-gray-900">About</a>
           
           <!-- Dynamic Auth Section -->

frontend/templates/dropbox.html

@@ -0,0 +1,406 @@
+{% extends "base.html" %}
+{% block title %}Dropbox Setup{% endblock %}
+
+{% block content %}
+<div class="container mx-auto px-4 py-8">
+  <div class="mb-8">
+    <h1 class="text-3xl font-bold mb-2">Dropbox Integration Setup</h1>
+    <p class="text-gray-600 mb-4">
+      Configure the Dropbox integration for DocuNova using our setup wizard.
+    </p>
+    
+    <div class="bg-blue-100 border-l-4 border-blue-500 text-blue-700 p-4 my-4" role="alert">
+      <p class="font-bold">Current Status:</p>
+      <p>Dropbox integration is 
+        {% if is_configured %}
+          <span class="text-green-700 font-semibold">configured</span>.
+        {% else %}
+          <span class="text-red-700 font-semibold">not configured</span>.
+        {% endif %}
+      </p>
+      {% if folder_path %}
+      <p class="mt-2"><strong>Target folder:</strong> {{ folder_path }}</p>
+      {% endif %}
+    </div>
+    
+    <div class="bg-yellow-50 border-l-4 border-yellow-400 p-4 my-4">
+      <div class="flex">
+        <div class="flex-shrink-0">
+          <svg class="h-5 w-5 text-yellow-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
+            <path fill-rule="evenodd" d="M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z" clip-rule="evenodd" />
+          </svg>
+        </div>
+        <div class="ml-3">
+          <p class="text-sm text-yellow-700">
+            <strong>Note:</strong> You need to create a Dropbox app and obtain API credentials. The setup wizard will guide you through this process.
+          </p>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <div class="bg-white shadow-md rounded-lg p-6 mb-8">
+    <h2 class="text-2xl font-semibold mb-4">Quick Setup Guide</h2>
+    
+    <div class="mb-6">
+      <h3 class="text-xl font-medium mb-4">Step 1: Create a Dropbox App</h3>
+      <ol class="list-decimal ml-6 space-y-3">
+        <li>Go to the <a href="https://www.dropbox.com/developers/apps" target="_blank" class="text-blue-600 hover:underline">Dropbox Developer Apps Console</a></li>
+        <li>Click "Create app"</li>
+        <li>Select "Scoped access" for API</li>
+        <li>Choose "Full Dropbox" access (or "App folder" for more restricted access)</li>
+        <li>Give your app a name (e.g., "DocuNova")</li>
+        <li>Click "Create app"</li>
+      </ol>
+    </div>
+
+    <div class="mb-6">
+      <h3 class="text-xl font-medium mb-4">Step 2: Configure App Permissions</h3>
+      <ol class="list-decimal ml-6 space-y-3">
+        <li>In your app's settings page, go to the "Permissions" tab</li>
+        <li>Enable the following permissions:
+          <ul class="list-disc ml-6 mt-1">
+            <li><code class="bg-gray-100 p-1">files.content.write</code> (to upload files)</li>
+            <li><code class="bg-gray-100 p-1">files.content.read</code> (if you need to read file content)</li>
+          </ul>
+        </li>
+        <li>Click "Submit" to save changes</li>
+      </ol>
+    </div>
+
+    <div class="mb-6">
+      <h3 class="text-xl font-medium mb-4">Step 3: Set OAuth 2 Redirect URI</h3>
+      <ol class="list-decimal ml-6 space-y-3">
+        <li>In your app's settings page, go to the "OAuth 2" section</li>
+        <li>Add a redirect URI: <code class="bg-gray-100 p-1">{{ request.url.scheme }}://{{ request.url.netloc }}/dropbox-callback</code></li>
+        <li>Click "Add" to save the redirect URI</li>
+      </ol>
+    </div>
+  </div>
+
+  <div class="bg-white shadow-md rounded-lg p-6 mb-8">
+    <h2 class="text-2xl font-semibold mb-4">Complete Setup with Wizard</h2>
+    
+    <div class="space-y-4">
+      <div>
+        <label for="app-key" class="block text-sm font-medium text-gray-700">App Key</label>
+        <input type="text" id="app-key" class="mt-1 block w-full border border-gray-300 rounded-md shadow-sm py-2 px-3 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm" placeholder="Enter your Dropbox app key" value="{{ app_key_value }}">
+      </div>
+      
+      <div>
+        <label for="app-secret" class="block text-sm font-medium text-gray-700">App Secret</label>
+        <input type="password" id="app-secret" class="mt-1 block w-full border border-gray-300 rounded-md shadow-sm py-2 px-3 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm" placeholder="Enter your Dropbox app secret" value="{{ app_secret_value }}">
+      </div>
+      
+      <div>
+        <label for="folder-path" class="block text-sm font-medium text-gray-700">Folder Path (Optional)</label>
+        <input type="text" id="folder-path" class="mt-1 block w-full border border-gray-300 rounded-md shadow-sm py-2 px-3 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm" placeholder="/Documents/Uploads" value="{{ folder_path }}">
+        <p class="text-xs text-gray-500 mt-1">Enter the folder path where files should be uploaded (e.g., /Documents/Uploads)</p>
+      </div>
+      
+      <div>
+        <button id="start-auth-flow" class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500">
+          Start Authentication Flow
+        </button>
+      </div>
+      
+      <!-- Token validation and status -->
+      <div id="token-status" class="mt-6 {{ 'hidden' if not is_configured else '' }}">
+        <div class="rounded-md {{ 'bg-green-50' if is_configured else 'bg-yellow-50' }} p-4">
+          <div class="flex">
+            <div class="flex-shrink-0">
+              {% if is_configured %}
+              <svg class="h-5 w-5 text-green-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
+                <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd" />
+              </svg>
+              {% else %}
+              <svg class="h-5 w-5 text-yellow-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
+                <path fill-rule="evenodd" d="M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z" clip-rule="evenodd" />
+              </svg>
+              {% endif %}
+            </div>
+            <div class="ml-3">
+              <p class="text-sm font-medium {{ 'text-green-800' if is_configured else 'text-yellow-800' }}">
+                {% if is_configured %}
+                  Dropbox integration is properly configured! Your refresh token is valid.
+                {% else %}
+                  Dropbox integration is not completely configured or token may be invalid.
+                {% endif %}
+              </p>
+            </div>
+          </div>
+        </div>
+        
+        <div class="mt-4 flex space-x-3">
+          <button id="test-token" class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
+            Test Token
+          </button>
+          <button id="refresh-token-btn" class="inline-flex items-center px-4 py-2 border border-gray-300 text-sm font-medium rounded-md shadow-sm text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
+            Refresh Token
+          </button>
+        </div>
+        
+        <!-- Configuration for Worker Nodes section -->
+        <div class="mt-6 p-4 bg-gray-100 rounded-md">
+          <h3 class="font-medium text-lg mb-2">Configuration for Worker Nodes</h3>
+          <p class="text-sm text-gray-600 mb-3">
+            Copy these environment variables to configure all worker nodes:
+          </p>
+          
+          <div class="relative">
+            <pre id="env-vars" class="bg-gray-800 text-green-400 text-sm p-3 rounded overflow-x-auto"><code>DROPBOX_APP_KEY={{ app_key_value }}
+DROPBOX_APP_SECRET={{ app_secret_value|default('YOUR_APP_SECRET', true) }}
+DROPBOX_REFRESH_TOKEN={{ refresh_token_value|default('YOUR_REFRESH_TOKEN', true) }}
+DROPBOX_FOLDER={{ folder_path|default('/Documents/Uploads', true) }}</code></pre>
+            
+            <button id="copy-env-vars" class="absolute top-2 right-2 bg-gray-700 hover:bg-gray-600 text-white text-xs py-1 px-2 rounded">
+              Copy
+            </button>
+          </div>
+          
+          <p class="text-xs text-gray-500 mt-2">
+            Add these variables to your .env file or environment configuration.
+          </p>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <div class="bg-white shadow-md rounded-lg p-6 mb-8">
+    <div class="flex items-start">
+      <div class="flex-shrink-0">
+        <svg class="h-6 w-6 text-blue-400" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
+        </svg>
+      </div>
+      <div class="ml-3">
+        <h3 class="text-lg font-medium">Need More Information?</h3>
+        <p class="mt-1 text-sm text-gray-600">
+          For detailed instructions and troubleshooting, refer to the
+          <a href="/docs/DropboxSetup.md" target="_blank" class="text-blue-600 hover:underline">Dropbox Setup Documentation</a>.
+        </p>
+      </div>
+    </div>
+  </div>
+
+  <div class="mt-8">
+    <a href="/status" class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500">
+      Back to Status
+    </a>
+  </div>
+  
+  <!-- Result Modal -->
+  <div id="resultModal" class="fixed inset-0 bg-gray-600 bg-opacity-50 hidden overflow-y-auto h-full w-full z-50" aria-modal="true" role="dialog">
+    <div class="relative top-20 mx-auto p-5 border w-11/12 md:w-1/2 lg:w-1/3 shadow-lg rounded-md bg-white">
+      <div class="mt-3 text-center">
+        <div id="modalIcon" class="mx-auto flex items-center justify-center h-12 w-12 rounded-full bg-green-100 mb-4">
+          <!-- Icon will be injected by JS -->
+        </div>
+        <h3 id="modalTitle" class="text-lg leading-6 font-medium text-gray-900">Success</h3>
+        <div class="mt-2 px-7 py-3">
+          <p id="modalMessage" class="text-sm text-gray-500">
+            Operation completed successfully.
+          </p>
+        </div>
+        <div class="items-center px-4 py-3">
+          <button id="modalClose" class="px-4 py-2 bg-blue-500 text-white text-base font-medium rounded-md w-full shadow-sm hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-300">
+            Close
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+{% endblock %}
+
+{% block scripts %}
+<script>
+document.addEventListener('DOMContentLoaded', function() {
+  // Elements
+  const startAuthFlowBtn = document.getElementById('start-auth-flow');
+  const testTokenBtn = document.getElementById('test-token');
+  const refreshTokenBtn = document.getElementById('refresh-token-btn');
+  const tokenStatus = document.getElementById('token-status');
+  const appSecretInput = document.getElementById('app-secret');
+  
+  // Modal elements
+  const resultModal = document.getElementById('resultModal');
+  const modalTitle = document.getElementById('modalTitle');
+  const modalMessage = document.getElementById('modalMessage');
+  const modalIcon = document.getElementById('modalIcon');
+  const modalClose = document.getElementById('modalClose');
+  
+  // Modal functions
+  function showModal(status, title, message) {
+    modalTitle.textContent = title;
+    modalMessage.textContent = message;
+    
+    // Set the appropriate icon
+    if (status === 'success') {
+      modalIcon.innerHTML = `
+        <svg class="h-6 w-6 text-green-600" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+        </svg>
+      `;
+      modalIcon.className = 'mx-auto flex items-center justify-center h-12 w-12 rounded-full bg-green-100 mb-4';
+    } else {
+      modalIcon.innerHTML = `
+        <svg class="h-6 w-6 text-red-600" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+        </svg>
+      `;
+      modalIcon.className = 'mx-auto flex items-center justify-center h-12 w-12 rounded-full bg-red-100 mb-4';
+    }
+    
+    resultModal.classList.remove('hidden');
+  }
+  
+  function hideModal() {
+    resultModal.classList.add('hidden');
+  }
+  
+  // Close modal when clicking the close button
+  modalClose.addEventListener('click', hideModal);
+  
+  // Close modal when clicking outside of it
+  resultModal.addEventListener('click', function(e) {
+    if (e.target === resultModal) {
+      hideModal();
+    }
+  });
+  
+  // Start Authentication Flow button click
+  startAuthFlowBtn.addEventListener('click', function() {
+    const appKey = document.getElementById('app-key').value.trim();
+    const appSecret = appSecretInput.value.trim();
+    const folderPath = document.getElementById('folder-path').value.trim();
+    const redirectUri = window.location.origin + "/dropbox-callback";
+
+    if (!appKey) {
+      showModal('error', 'Validation Error', 'Please enter your App Key');
+      return;
+    }
+    
+    if (!appSecret) {
+      showModal('error', 'Validation Error', 'Please enter your App Secret');
+      return;
+    }
+
+    // Save app key, app secret and folder path to session storage temporarily
+    sessionStorage.setItem('dropbox_app_key', appKey);
+    sessionStorage.setItem('dropbox_app_secret', appSecret);
+    if (folderPath) {
+      sessionStorage.setItem('dropbox_folder_path', folderPath);
+    }
+
+    // Generate the authorization URL
+    const authUrl = `https://www.dropbox.com/oauth2/authorize?client_id=${encodeURIComponent(appKey)}&response_type=code&token_access_type=offline&redirect_uri=${encodeURIComponent(redirectUri)}`;
+    
+    // Redirect the user to the Dropbox login page
+    window.location.href = authUrl;
+  });
+
+  // Test Token button click
+  if (testTokenBtn) {
+    testTokenBtn.addEventListener('click', function() {
+      testTokenBtn.innerHTML = '<span class="animate-spin inline-block mr-2">⟳</span> Testing...';
+      testTokenBtn.disabled = true;
+      
+      fetch('/api/dropbox/test-token')
+        .then(response => response.json())
+        .then(data => {
+          if (data.status === 'success') {
+            showModal('success', 'Token Valid', `${data.message} ${data.account ? 'as ' + data.account : ''}`);
+          } else {
+            if (data.message && data.message.includes('invalid_grant') || data.needs_reauth) {
+              showModal('error', 'Token Invalid', 'Your Dropbox token has expired or is invalid. Please obtain a new token.');
+              // Give option to start new auth flow
+              modalClose.textContent = "Get New Token";
+              modalClose.addEventListener('click', function onGetNewToken() {
+                startAuthFlowBtn.click();
+                // Remove this special event handler after use
+                modalClose.removeEventListener('click', onGetNewToken);
+                modalClose.textContent = "Close";
+              }, { once: true });
+            } else {
+              showModal('error', 'Token Test Failed', data.message);
+            }
+          }
+        })
+        .catch(error => {
+          showModal('error', 'Connection Error', 'Error testing token: ' + error.message);
+        })
+        .finally(() => {
+          testTokenBtn.innerHTML = 'Test Token';
+          testTokenBtn.disabled = false;
+        });
+    });
+  }
+  
+  // Refresh Token button click
+  if (refreshTokenBtn) {
+    refreshTokenBtn.addEventListener('click', function() {
+      showModal('info', 'Confirm', 'This will start a new authentication flow to obtain a fresh token from Dropbox. Continue?');
+      modalClose.textContent = "Cancel";
+      
+      // Add a confirm button
+      const confirmBtn = document.createElement('button');
+      confirmBtn.className = 'ml-2 px-4 py-2 bg-green-500 text-white text-base font-medium rounded-md shadow-sm hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-green-300';
+      confirmBtn.textContent = 'Continue';
+      confirmBtn.addEventListener('click', function() {
+        hideModal();
+        startAuthFlowBtn.click();
+      });
+      
+      // Add to modal
+      modalClose.parentNode.appendChild(confirmBtn);
+      
+      // Make sure to remove the confirm button when modal is closed
+      const removeConfirmBtn = function() {
+        if (confirmBtn.parentNode) {
+          confirmBtn.parentNode.removeChild(confirmBtn);
+        }
+        modalClose.textContent = "Close";
+        modalClose.removeEventListener('click', removeConfirmBtn);
+      };
+      
+      modalClose.addEventListener('click', removeConfirmBtn, { once: true });
+    });
+  }
+  
+  // Copy Environment Variables Button
+  const copyEnvVarsBtn = document.getElementById('copy-env-vars');
+  if (copyEnvVarsBtn) {
+    copyEnvVarsBtn.addEventListener('click', function() {
+      const envVarsText = document.getElementById('env-vars').textContent;
+      navigator.clipboard.writeText(envVarsText)
+        .then(() => {
+          const originalText = copyEnvVarsBtn.textContent;
+          copyEnvVarsBtn.textContent = 'Copied!';
+          copyEnvVarsBtn.classList.add('bg-green-700');
+          setTimeout(() => {
+            copyEnvVarsBtn.textContent = originalText;
+            copyEnvVarsBtn.classList.remove('bg-green-700');
+          }, 2000);
+        })
+        .catch(err => {
+          console.error('Failed to copy: ', err);
+          showModal('error', 'Copy Failed', 'Failed to copy text to clipboard');
+        });
+    });
+  }
+  
+  // Try to retrieve app secret from session storage (if coming back from auth)
+  if (appSecretInput && !appSecretInput.value && sessionStorage.getItem('dropbox_app_secret')) {
+    appSecretInput.value = sessionStorage.getItem('dropbox_app_secret');
+    // Clear it after use
+    sessionStorage.removeItem('dropbox_app_secret');
+  }
+  
+  // If token is not configured but we have an app key, show the token status section
+  if (document.getElementById('app-key').value && !tokenStatus.classList.contains('hidden')) {
+    tokenStatus.classList.remove('hidden');
+  }
+});
+</script>
+{% endblock %}

frontend/templates/dropbox_callback.html

@@ -0,0 +1,227 @@
+{% extends "base.html" %}
+{% block title %}Dropbox Authorization Processing{% endblock %}
+
+{% block content %}
+<div class="container mx-auto px-4 py-8">
+  <div class="bg-white shadow-md rounded-lg p-6">
+    <div class="text-center mb-6">
+      <svg xmlns="http://www.w3.org/2000/svg" class="mx-auto h-12 w-12 text-blue-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15" />
+      </svg>
+      <h2 class="text-2xl font-bold mt-4">Processing Authorization</h2>
+      <p class="text-gray-600 mt-2">Please wait while we complete the Dropbox authorization process...</p>
+    </div>
+    
+    <div class="flex justify-center my-6">
+      <div class="animate-spin rounded-full h-12 w-12 border-b-2 border-blue-500"></div>
+    </div>
+    
+    <div id="processing-message" class="text-center text-gray-700">
+      <p>Exchanging authorization code for refresh token...</p>
+    </div>
+    
+    <div id="error-container" class="hidden mt-6">
+      <div class="bg-red-50 border-l-4 border-red-400 p-4">
+        <div class="flex">
+          <div class="flex-shrink-0">
+            <svg class="h-5 w-5 text-red-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
+              <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z" clip-rule="evenodd" />
+            </svg>
+          </div>
+          <div class="ml-3">
+            <h3 class="text-sm font-medium text-red-800">Error details:</h3>
+            <div class="mt-2 text-sm text-red-700" id="error-message">
+              <!-- Error message will be inserted here -->
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="mt-4">
+        <a href="/dropbox-setup" class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500">
+          Return to Setup
+        </a>
+      </div>
+    </div>
+    
+    <div id="success-container" class="hidden mt-6">
+      <div class="rounded-md bg-green-50 p-4">
+        <div class="flex">
+          <div class="flex-shrink-0">
+            <svg class="h-5 w-5 text-green-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
+              <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd" />
+            </svg>
+          </div>
+          <div class="ml-3">
+            <p class="text-sm font-medium text-green-800">
+              Dropbox authorization successful! Your refresh token has been saved.
+            </p>
+          </div>
+        </div>
+      </div>
+      
+      <div class="mt-6 p-4 bg-gray-100 rounded-md">
+        <h3 class="font-medium text-lg mb-2">Configuration for Worker Nodes</h3>
+        <p class="text-sm text-gray-600 mb-3">
+          Copy these environment variables to configure all worker nodes:
+        </p>
+        
+        <div class="relative">
+          <pre id="env-vars" class="bg-gray-800 text-green-400 text-sm p-3 rounded overflow-x-auto"><code></code></pre>
+          
+          <button id="copy-env-vars" class="absolute top-2 right-2 bg-gray-700 hover:bg-gray-600 text-white text-xs py-1 px-2 rounded">
+            Copy
+          </button>
+        </div>
+        
+        <p class="text-xs text-gray-500 mt-2">
+          Add these variables to your .env file or environment configuration.
+        </p>
+      </div>
+      
+      <div class="mt-4 text-center">
+        <a href="/status" class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500">
+          Go to Status Page
+        </a>
+      </div>
+    </div>
+  </div>
+</div>
+{% endblock %}
+
+{% block scripts %}
+<script>
+document.addEventListener('DOMContentLoaded', function() {
+  const code = "{{ code }}";
+  
+  // Get credentials from session storage (these take precedence over server-provided values)
+  const appKey = sessionStorage.getItem('dropbox_app_key') || "{{ app_key_value }}";
+  const appSecret = sessionStorage.getItem('dropbox_app_secret') || "{{ app_secret_value }}";
+  const folderPath = sessionStorage.getItem('dropbox_folder_path') || "{{ folder_path }}" || '/Documents/Uploads';
+  
+  const redirectUri = window.location.origin + "/dropbox-callback";
+  
+  // Automatically exchange the code for a refresh token
+  if (code) {
+    if (!appKey || !appSecret) {
+      showError("Missing App Key or App Secret. Please go back to the setup page and try again.");
+      return;
+    }
+    
+    exchangeCode(code, appKey, appSecret, redirectUri);
+  } else {
+    showError("No authorization code was found in the URL");
+  }
+  
+  function exchangeCode(code, appKey, appSecret, redirectUri) {
+    const formData = new FormData();
+    formData.append('client_id', appKey);
+    formData.append('client_secret', appSecret);
+    formData.append('redirect_uri', redirectUri);
+    formData.append('code', code);
+    formData.append('folder_path', folderPath);
+    
+    document.getElementById('processing-message').innerHTML = 
+      '<p>Exchanging authorization code for refresh token...</p>';
+    
+    fetch('/api/dropbox/exchange-token', {
+      method: 'POST',
+      body: formData
+    })
+    .then(response => {
+      if (!response.ok) {
+        return response.json().then(err => {
+          throw new Error(err.detail || 'Failed to exchange token');
+        });
+      }
+      return response.json();
+    })
+    .then(data => {
+      if (data.refresh_token) {
+        // Update settings in memory
+        const updateFormData = new FormData();
+        updateFormData.append('refresh_token', data.refresh_token);
+        
+        // Use the app key and app secret from session storage
+        if (appKey) updateFormData.append('app_key', appKey);
+        if (appSecret) updateFormData.append('app_secret', appSecret);
+        if (folderPath) updateFormData.append('folder_path', folderPath);
+        
+        document.getElementById('processing-message').innerHTML = 
+          '<p>Updating system settings with new token...</p>';
+        
+        return fetch('/api/dropbox/update-settings', {
+          method: 'POST',
+          body: updateFormData
+        }).then(response => {
+          if (!response.ok) {
+            return response.json().then(err => {
+              throw new Error('Token received but failed to update settings: ' + (err.detail || 'Unknown error'));
+            });
+          }
+          return response.json();
+        }).then(() => {
+          // Show the success message and environment variables
+          showSuccess(data.refresh_token, appKey, appSecret, folderPath);
+          // In 10 seconds, redirect to status page (giving time to copy)
+          setTimeout(() => {
+            window.location.href = '/status';
+          }, 10000);
+          
+          // Clean up session storage
+          sessionStorage.removeItem('dropbox_app_key');
+          sessionStorage.removeItem('dropbox_app_secret');
+          sessionStorage.removeItem('dropbox_folder_path');
+        });
+      } else {
+        throw new Error('No refresh token was received from the server');
+      }
+    })
+    .catch(error => {
+      showError(error.message);
+    });
+  }
+  
+  function showError(message) {
+    document.getElementById('processing-message').classList.add('hidden');
+    document.getElementById('error-container').classList.remove('hidden');
+    document.getElementById('error-message').innerText = message;
+  }
+  
+  function showSuccess(refreshToken, appKey, appSecret, folderPath) {
+    document.getElementById('processing-message').classList.add('hidden');
+    document.getElementById('success-container').classList.remove('hidden');
+    
+    // Update the environment variables pre block with the new token
+    const envVarsCode = document.querySelector('#env-vars code');
+    if (envVarsCode) {
+      envVarsCode.textContent = `DROPBOX_APP_KEY=${appKey}
+DROPBOX_APP_SECRET=${appSecret}
+DROPBOX_REFRESH_TOKEN=${refreshToken}
+DROPBOX_FOLDER=${folderPath || '/Documents/Uploads'}`;
+    }
+    
+    // Add copy functionality
+    const copyEnvVarsBtn = document.getElementById('copy-env-vars');
+    if (copyEnvVarsBtn) {
+      copyEnvVarsBtn.addEventListener('click', function() {
+        const envVarsText = document.getElementById('env-vars').textContent;
+        navigator.clipboard.writeText(envVarsText)
+          .then(() => {
+            const originalText = copyEnvVarsBtn.textContent;
+            copyEnvVarsBtn.textContent = 'Copied!';
+            copyEnvVarsBtn.classList.add('bg-green-700');
+            setTimeout(() => {
+              copyEnvVarsBtn.textContent = originalText;
+              copyEnvVarsBtn.classList.remove('bg-green-700');
+            }, 2000);
+          })
+          .catch(err => {
+            console.error('Failed to copy: ', err);
+            alert('Failed to copy text to clipboard');
+          });
+      });
+    }
+  }
+});
+</script>
+{% endblock %}

frontend/templates/dropbox_callback_error.html

@@ -0,0 +1,40 @@
+{% extends "base.html" %}
+{% block title %}Dropbox Authorization Error{% endblock %}
+
+{% block content %}
+<div class="container mx-auto px-4 py-8">
+  <div class="bg-white shadow-md rounded-lg p-6">
+    <div class="text-center mb-6">
+      <svg xmlns="http://www.w3.org/2000/svg" class="mx-auto h-12 w-12 text-red-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
+      </svg>
+      <h2 class="text-2xl font-bold mt-4">Authorization Failed</h2>
+      <p class="text-gray-600 mt-2">Sorry, we couldn't complete the Dropbox authorization.</p>
+    </div>
+    
+    <div class="mb-6">
+      <div class="bg-red-50 border-l-4 border-red-400 p-4">
+        <div class="flex">
+          <div class="flex-shrink-0">
+            <svg class="h-5 w-5 text-red-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
+              <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z" clip-rule="evenodd" />
+            </svg>
+          </div>
+          <div class="ml-3">
+            <h3 class="text-sm font-medium text-red-800">Error details:</h3>
+            <div class="mt-2 text-sm text-red-700">
+              <p>{{ error }}</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    
+    <div class="mt-6">
+      <a href="/dropbox-setup" class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500">
+        Return to Setup
+      </a>
+    </div>
+  </div>
+</div>
+{% endblock %}

frontend/templates/onedrive.html

@@ -112,6 +112,12 @@
         <p class="text-xs text-gray-500 mt-1">Use "common" for personal accounts or your organization's Tenant ID for corporate accounts</p>
       </div>
       
+      <div>
+        <label for="folder-path" class="block text-sm font-medium text-gray-700">Folder Path (Optional)</label>
+        <input type="text" id="folder-path" class="mt-1 block w-full border border-gray-300 rounded-md shadow-sm py-2 px-3 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm" placeholder="Documents/Uploads" value="{{ folder_path }}">
+        <p class="text-xs text-gray-500 mt-1">Enter the folder path where files should be uploaded (e.g., Documents/Uploads)</p>
+      </div>
+      
       <div>
         <button id="start-auth-flow" class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500">
           Start Authentication Flow
@@ -203,6 +209,28 @@ ONEDRIVE_FOLDER_PATH={{ folder_path|default('Documents/Uploads', true) }}</code>
       Back to Status
     </a>
   </div>
+  
+  <!-- Result Modal -->
+  <div id="resultModal" class="fixed inset-0 bg-gray-600 bg-opacity-50 hidden overflow-y-auto h-full w-full z-50" aria-modal="true" role="dialog">
+    <div class="relative top-20 mx-auto p-5 border w-11/12 md:w-1/2 lg:w-1/3 shadow-lg rounded-md bg-white">
+      <div class="mt-3 text-center">
+        <div id="modalIcon" class="mx-auto flex items-center justify-center h-12 w-12 rounded-full bg-green-100 mb-4">
+          <!-- Icon will be injected by JS -->
+        </div>
+        <h3 id="modalTitle" class="text-lg leading-6 font-medium text-gray-900">Success</h3>
+        <div class="mt-2 px-7 py-3">
+          <p id="modalMessage" class="text-sm text-gray-500">
+            Operation completed successfully.
+          </p>
+        </div>
+        <div class="items-center px-4 py-3">
+          <button id="modalClose" class="px-4 py-2 bg-blue-500 text-white text-base font-medium rounded-md w-full shadow-sm hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-300">
+            Close
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
 </div>
 {% endblock %}
 
@@ -216,25 +244,78 @@ document.addEventListener('DOMContentLoaded', function() {
   const tokenStatus = document.getElementById('token-status');
   const clientSecretInput = document.getElementById('client-secret');
   
+  // Modal elements
+  const resultModal = document.getElementById('resultModal');
+  const modalTitle = document.getElementById('modalTitle');
+  const modalMessage = document.getElementById('modalMessage');
+  const modalIcon = document.getElementById('modalIcon');
+  const modalClose = document.getElementById('modalClose');
+  
+  // Modal functions
+  function showModal(status, title, message) {
+    modalTitle.textContent = title;
+    modalMessage.textContent = message;
+    
+    // Set the appropriate icon
+    if (status === 'success') {
+      modalIcon.innerHTML = `
+        <svg class="h-6 w-6 text-green-600" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+        </svg>
+      `;
+      modalIcon.className = 'mx-auto flex items-center justify-center h-12 w-12 rounded-full bg-green-100 mb-4';
+    } else {
+      modalIcon.innerHTML = `
+        <svg class="h-6 w-6 text-red-600" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+        </svg>
+      `;
+      modalIcon.className = 'mx-auto flex items-center justify-center h-12 w-12 rounded-full bg-red-100 mb-4';
+    }
+    
+    resultModal.classList.remove('hidden');
+  }
+  
+  function hideModal() {
+    resultModal.classList.add('hidden');
+  }
+  
+  // Close modal when clicking the close button
+  modalClose.addEventListener('click', hideModal);
+  
+  // Close modal when clicking outside of it
+  resultModal.addEventListener('click', function(e) {
+    if (e.target === resultModal) {
+      hideModal();
+    }
+  });
+  
   // Start Authentication Flow button click
   startAuthFlowBtn.addEventListener('click', function() {
     const clientId = document.getElementById('client-id').value.trim();
     const clientSecret = clientSecretInput.value.trim();
     const redirectUri = window.location.origin + "/onedrive-callback";
     const tenantId = document.getElementById('tenant-id').value.trim() || 'common';
+    const folderPath = document.getElementById('folder-path') ? document.getElementById('folder-path').value.trim() : '';
 
     if (!clientId) {
-      alert('Please enter your Client ID');
+      showModal('error', 'Validation Error', 'Please enter your Client ID');
       return;
     }
     
     if (!clientSecret) {
-      alert('Please enter your Client Secret');
+      showModal('error', 'Validation Error', 'Please enter your Client Secret');
       return;
     }
 
-    // Save client secret to session storage temporarily
+    // Save all entered values to session storage temporarily
+    sessionStorage.setItem('onedrive_client_id', clientId);
     sessionStorage.setItem('onedrive_client_secret', clientSecret);
+    sessionStorage.setItem('onedrive_tenant_id', tenantId);
+    
+    if (folderPath) {
+      sessionStorage.setItem('onedrive_folder_path', folderPath);
+    }
 
     // Generate the authorization URL with .default scope
     const authUrl = `https://login.microsoftonline.com/${tenantId}/oauth2/v2.0/authorize?client_id=${encodeURIComponent(clientId)}&response_type=code&redirect_uri=${encodeURIComponent(redirectUri)}&response_mode=query&scope=${encodeURIComponent('https://graph.microsoft.com/.default offline_access')}&prompt=consent`;
@@ -253,19 +334,25 @@ document.addEventListener('DOMContentLoaded', function() {
         .then(response => response.json())
         .then(data => {
           if (data.status === 'success') {
-            alert('Token is valid! Successfully connected to OneDrive.');
+            showModal('success', 'Token Valid', 'Successfully connected to OneDrive!');
           } else {
             if (data.message && data.message.includes('invalid_grant')) {
-              if (confirm('Your OneDrive token has expired or is invalid. Would you like to obtain a new token now?')) {
+              showModal('error', 'Token Invalid', 'Your OneDrive token has expired or is invalid. Please obtain a new token.');
+              // Give option to start new auth flow
+              modalClose.textContent = "Get New Token";
+              modalClose.addEventListener('click', function onGetNewToken() {
                 startAuthFlowBtn.click();
-              }
+                // Remove this special event handler after use
+                modalClose.removeEventListener('click', onGetNewToken);
+                modalClose.textContent = "Close";
+              }, { once: true });
             } else {
-              alert('Token validation failed: ' + data.message);
+              showModal('error', 'Token Test Failed', data.message);
             }
           }
         })
         .catch(error => {
-          alert('Error testing token: ' + error.message);
+          showModal('error', 'Connection Error', 'Error testing token: ' + error.message);
         })
         .finally(() => {
           testTokenBtn.innerHTML = 'Test Token';
@@ -277,9 +364,31 @@ document.addEventListener('DOMContentLoaded', function() {
   // Refresh Token button click
   if (refreshTokenBtn) {
     refreshTokenBtn.addEventListener('click', function() {
-      if (confirm('This will start a new authentication flow to obtain a fresh token from Microsoft. Continue?')) {
+      showModal('info', 'Confirm', 'This will start a new authentication flow to obtain a fresh token from Microsoft. Continue?');
+      modalClose.textContent = "Cancel";
+      
+      // Add a confirm button
+      const confirmBtn = document.createElement('button');
+      confirmBtn.className = 'ml-2 px-4 py-2 bg-green-500 text-white text-base font-medium rounded-md shadow-sm hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-green-300';
+      confirmBtn.textContent = 'Continue';
+      confirmBtn.addEventListener('click', function() {
+        hideModal();
         startAuthFlowBtn.click();
-      }
+      });
+      
+      // Add to modal
+      modalClose.parentNode.appendChild(confirmBtn);
+      
+      // Make sure to remove the confirm button when modal is closed
+      const removeConfirmBtn = function() {
+        if (confirmBtn.parentNode) {
+          confirmBtn.parentNode.removeChild(confirmBtn);
+        }
+        modalClose.textContent = "Close";
+        modalClose.removeEventListener('click', removeConfirmBtn);
+      };
+      
+      modalClose.addEventListener('click', removeConfirmBtn, { once: true });
     });
   }
   
@@ -300,16 +409,32 @@ document.addEventListener('DOMContentLoaded', function() {
         })
         .catch(err => {
           console.error('Failed to copy: ', err);
-          alert('Failed to copy text to clipboard');
+          showModal('error', 'Copy Failed', 'Failed to copy text to clipboard');
         });
     });
   }
   
-  // Try to retrieve client secret from session storage (if coming back from auth)
+  // Try to retrieve values from session storage (if coming back from auth or browser refresh)
   if (clientSecretInput && !clientSecretInput.value && sessionStorage.getItem('onedrive_client_secret')) {
     clientSecretInput.value = sessionStorage.getItem('onedrive_client_secret');
-    // Clear it after use
+  }
-    sessionStorage.removeItem('onedrive_client_secret');
+  
+  // Also check for client ID in session storage
+  const clientIdInput = document.getElementById('client-id');
+  if (clientIdInput && !clientIdInput.value && sessionStorage.getItem('onedrive_client_id')) {
+    clientIdInput.value = sessionStorage.getItem('onedrive_client_id');
+  }
+  
+  // Check for tenant ID in session storage
+  const tenantIdInput = document.getElementById('tenant-id');
+  if (tenantIdInput && !tenantIdInput.value && sessionStorage.getItem('onedrive_tenant_id')) {
+    tenantIdInput.value = sessionStorage.getItem('onedrive_tenant_id');
+  }
+  
+  // Check for folder path in session storage
+  const folderPathInput = document.getElementById('folder-path');
+  if (folderPathInput && !folderPathInput.value && sessionStorage.getItem('onedrive_folder_path')) {
+    folderPathInput.value = sessionStorage.getItem('onedrive_folder_path');
   }
   
   // If token is not configured but we have a client ID, show the token status section

frontend/templates/onedrive_callback.html

@@ -92,24 +92,34 @@
 <script>
 document.addEventListener('DOMContentLoaded', function() {
   const code = "{{ code }}";
-  const clientId = "{{ client_id_value }}";
+  
+  // Get credentials from session storage (these take precedence over server-provided values)
+  const clientId = sessionStorage.getItem('onedrive_client_id') || "{{ client_id_value }}";
+  const clientSecret = sessionStorage.getItem('onedrive_client_secret') || "{{ client_secret_value }}";
+  const tenantId = sessionStorage.getItem('onedrive_tenant_id') || "{{ tenant_id }}" || "common";
+  const folderPath = sessionStorage.getItem('onedrive_folder_path') || "";
+  
   const redirectUri = window.location.origin + "/onedrive-callback";
-  const tenantId = "{{ tenant_id }}";
   
   // Automatically exchange the code for a refresh token
   if (code) {
-    exchangeCode(code, clientId, redirectUri, tenantId);
+    if (!clientId || !clientSecret) {
+      showError("Missing Client ID or Client Secret. Please go back to the setup page and try again.");
+      return;
+    }
+    
+    exchangeCode(code, clientId, clientSecret, redirectUri, tenantId, folderPath);
   } else {
     showError("No authorization code was found in the URL");
   }
   
-  function exchangeCode(code, clientId, redirectUri, tenantId) {
+  function exchangeCode(code, clientId, clientSecret, redirectUri, tenantId, folderPath) {
     const formData = new FormData();
     formData.append('client_id', clientId);
-    formData.append('client_secret', "{{ client_secret_value }}");  // Use the pre-configured secret
+    formData.append('client_secret', clientSecret);
     formData.append('redirect_uri', redirectUri);
     formData.append('code', code);
-    formData.append('tenant_id', tenantId || 'common');
+    formData.append('tenant_id', tenantId);
     
     // Show more details in processing message
     document.getElementById('processing-message').innerHTML = 
@@ -134,9 +144,14 @@ document.addEventListener('DOMContentLoaded', function() {
         const updateFormData = new FormData();
         updateFormData.append('refresh_token', data.refresh_token);
         
-        // Use the existing clientId and tenantId if they were provided
+        // Use the values from session storage
-        if (clientId) updateFormData.append('client_id', clientId);
+        updateFormData.append('client_id', clientId);
-        if (tenantId) updateFormData.append('tenant_id', tenantId);
+        updateFormData.append('client_secret', clientSecret);
+        updateFormData.append('tenant_id', tenantId);
+        
+        if (folderPath) {
+          updateFormData.append('folder_path', folderPath);
+        }
         
         document.getElementById('processing-message').innerHTML = 
           '<p>Updating system settings with new token...</p>';
@@ -153,11 +168,18 @@ document.addEventListener('DOMContentLoaded', function() {
           return response.json();
         }).then(() => {
           // Show the success message and environment variables
-          showSuccess(data.refresh_token, clientId, tenantId);
+          showSuccess(data.refresh_token, clientId, clientSecret, tenantId, folderPath);
+          
           // In 10 seconds, redirect to status page (giving more time to copy)
           setTimeout(() => {
             window.location.href = '/status';
           }, 10000);
+          
+          // Clean up session storage
+          sessionStorage.removeItem('onedrive_client_id');
+          sessionStorage.removeItem('onedrive_client_secret');
+          sessionStorage.removeItem('onedrive_tenant_id');
+          sessionStorage.removeItem('onedrive_folder_path');
         });
       } else {
         throw new Error('No refresh token was received from the server');
@@ -174,7 +196,7 @@ document.addEventListener('DOMContentLoaded', function() {
     document.getElementById('error-message').innerText = message;
   }
   
-  function showSuccess(refreshToken, clientId, tenantId) {
+  function showSuccess(refreshToken, clientId, clientSecret, tenantId, folderPath) {
     document.getElementById('processing-message').classList.add('hidden');
     document.getElementById('success-container').classList.remove('hidden');
     
@@ -182,10 +204,10 @@ document.addEventListener('DOMContentLoaded', function() {
     const envVarsCode = document.querySelector('#env-vars code');
     if (envVarsCode) {
       envVarsCode.textContent = `ONEDRIVE_CLIENT_ID=${clientId}
-ONEDRIVE_CLIENT_SECRET={{ client_secret_value }}
+ONEDRIVE_CLIENT_SECRET=${clientSecret}
 ONEDRIVE_TENANT_ID=${tenantId || 'common'}
 ONEDRIVE_REFRESH_TOKEN=${refreshToken}
-ONEDRIVE_FOLDER_PATH=Documents/Uploads`;
+ONEDRIVE_FOLDER_PATH=${folderPath || 'Documents/Uploads'}`;
     }
     
     // Add copy functionality

frontend/templates/status_dashboard.html

@@ -9,6 +9,7 @@
       This dashboard shows the status of all configured integrations and targets.
     </p>
     <div class="bg-blue-100 border-l-4 border-blue-500 text-blue-700 p-4 my-4" role="alert">
+      <p><strong>App Version:</strong> {{ app_version }}</p>
       <p><strong>Debug Mode:</strong> {{ "Enabled" if debug_enabled else "Disabled" }}</p>
       {% if last_check %}
       <p><strong>Last Check:</strong> {{ last_check }}</p>
@@ -69,7 +70,17 @@
           <div class="px-4 py-5 sm:p-6">
             <p class="text-sm text-gray-500">{{ provider.description }}</p>
             
-            {% if provider.url and provider.configured %}
+            <!-- NextCloud or link to provider URL -->
+            {% if provider.configured and name == "NextCloud" %}
+              {% if provider.details and provider.details.url %}
+                {% set nextcloud_base_url = provider.details.url.split('/remote.php')[0] %}
+                <div class="mt-3">
+                  <a href="{{ nextcloud_base_url }}" target="_blank" class="text-sm text-blue-600 hover:text-blue-800">
+                    {{ nextcloud_base_url|truncate(30) }} <span aria-hidden="true">&rarr;</span>
+                  </a>
+                </div>
+              {% endif %}
+            {% elif provider.url and provider.configured %}
               <div class="mt-3">
                 <a href="{{ provider.url }}" target="_blank" class="text-sm text-blue-600 hover:text-blue-800">
                   {{ provider.url|truncate(30) }} <span aria-hidden="true">&rarr;</span>
@@ -77,22 +88,93 @@
               </div>
             {% endif %}
             
-            <div class="mt-4">
+            <div class="mt-4 flex items-center justify-between">
-              {% if provider.configured %}
+              <div>
-                <span class="inline-flex items-center px-2.5 py-0.5 rounded-md text-sm font-medium bg-green-100 text-green-800">
+                {% if provider.configured %}
-                  <svg class="-ml-0.5 mr-1.5 h-2 w-2 text-green-400" fill="currentColor" viewBox="0 0 8 8">
+                  <span class="inline-flex items-center px-2.5 py-0.5 rounded-md text-sm font-medium bg-green-100 text-green-800">
-                    <circle cx="4" cy="4" r="3" />
+                    <svg class="-ml-0.5 mr-1.5 h-2 w-2 text-green-400" fill="currentColor" viewBox="0 0 8 8">
-                  </svg>
+                      <circle cx="4" cy="4" r="3" />
-                  Active
+                    </svg>
-                </span>
+                    Active
-              {% else %}
+                  </span>
-                <span class="inline-flex items-center px-2.5 py-0.5 rounded-md text-sm font-medium bg-gray-100 text-gray-800">
+                {% else %}
-                  <svg class="-ml-0.5 mr-1.5 h-2 w-2 text-gray-400" fill="currentColor" viewBox="0 0 8 8">
+                  <span class="inline-flex items-center px-2.5 py-0.5 rounded-md text-sm font-medium bg-gray-100 text-gray-800">
-                    <circle cx="4" cy="4" r="3" />
+                    <svg class="-ml-0.5 mr-1.5 h-2 w-2 text-gray-400" fill="currentColor" viewBox="0 0 8 8">
-                  </svg>
+                      <circle cx="4" cy="4" r="3" />
-                  Inactive
+                    </svg>
-                </span>
+                    Inactive
-              {% endif %}
+                  </span>
+                {% endif %}
+              </div>
+              
+              <!-- Action buttons -->
+              <div class="flex space-x-2">
+                {% if provider.configured and provider.details %}
+                  <button 
+                    class="view-details-btn inline-flex items-center px-2.5 py-1.5 border border-gray-300 text-xs font-medium rounded text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"
+                    data-provider="{{ name }}"
+                    data-details="{{ provider.details|tojson|forceescape }}">
+                    View Details
+                  </button>
+                {% endif %}
+                
+                {% if name == "Dropbox" %}
+                  {% if provider.configured %}
+                    <button 
+                      class="test-provider-btn inline-flex items-center px-2.5 py-1.5 border border-gray-300 text-xs font-medium rounded text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"
+                      data-provider="dropbox">
+                      Test Connection
+                    </button>
+                    <a href="/dropbox-setup" class="inline-flex items-center px-2.5 py-1.5 border border-transparent text-xs font-medium rounded text-indigo-700 bg-indigo-100 hover:bg-indigo-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
+                      <svg xmlns="http://www.w3.org/2000/svg" class="h-3 w-3 mr-1" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z" />
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" />
+                      </svg>
+                      Manage
+                    </a>
+                  {% else %}
+                    <a href="/dropbox-setup" class="inline-flex items-center px-2.5 py-1.5 border border-transparent text-xs font-medium rounded text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
+                      Configure Now
+                    </a>
+                  {% endif %}
+                {% elif name == "OneDrive" %}
+                  {% if provider.configured %}
+                    <button 
+                      class="test-provider-btn inline-flex items-center px-2.5 py-1.5 border border-gray-300 text-xs font-medium rounded text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"
+                      data-provider="onedrive">
+                      Test Connection
+                    </button>
+                    <a href="/onedrive-setup" class="inline-flex items-center px-2.5 py-1.5 border border-transparent text-xs font-medium rounded text-indigo-700 bg-indigo-100 hover:bg-indigo-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
+                      <svg xmlns="http://www.w3.org/2000/svg" class="h-3 w-3 mr-1" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z" />
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" />
+                      </svg>
+                      Manage
+                    </a>
+                  {% else %}
+                    <a href="/onedrive-setup" class="inline-flex items-center px-2.5 py-1.5 border border-transparent text-xs font-medium rounded text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
+                      Configure Now
+                    </a>
+                  {% endif %}
+                {% elif provider.configured and name == "Paperless-ngx" %}
+                  <a href="{{ provider.details.host }}" target="_blank" class="inline-flex items-center px-2.5 py-1.5 border border-gray-300 text-xs font-medium rounded text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
+                    <svg xmlns="http://www.w3.org/2000/svg" class="h-3 w-3 mr-1" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                      <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14" />
+                    </svg>
+                    Open
+                  </a>
+                {% elif provider.configured and name == "NextCloud" %}
+                  {% if provider.details and provider.details.url %}
+                    {% set nextcloud_base_url = provider.details.url.split('/remote.php')[0] %}
+                    <a href="{{ nextcloud_base_url }}" target="_blank" class="inline-flex items-center px-2.5 py-1.5 border border-gray-300 text-xs font-medium rounded text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
+                      <svg xmlns="http://www.w3.org/2000/svg" class="h-3 w-3 mr-1" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14" />
+                      </svg>
+                      Open
+                    </a>
+                  {% endif %}
+                {% endif %}
+              </div>
             </div>
           </div>
         </div>
@@ -112,5 +194,256 @@
       </a>
     </div>
   </div>
+  
+  <!-- Result Modal -->
+  <div id="resultModal" class="fixed inset-0 bg-gray-600 bg-opacity-50 hidden overflow-y-auto h-full w-full z-50" aria-modal="true" role="dialog">
+    <div class="relative top-20 mx-auto p-5 border w-11/12 md:w-1/2 lg:w-1/3 shadow-lg rounded-md bg-white">
+      <div class="mt-3 text-center">
+        <div id="modalIcon" class="mx-auto flex items-center justify-center h-12 w-12 rounded-full bg-green-100 mb-4">
+          <!-- Icon will be injected by JS -->
+        </div>
+        <h3 id="modalTitle" class="text-lg leading-6 font-medium text-gray-900">Success</h3>
+        <div class="mt-2 px-7 py-3">
+          <p id="modalMessage" class="text-sm text-gray-500">
+            Operation completed successfully.
+          </p>
+        </div>
+        <div class="items-center px-4 py-3">
+          <button id="modalClose" class="px-4 py-2 bg-blue-500 text-white text-base font-medium rounded-md w-full shadow-sm hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-300">
+            Close
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+  
+  <!-- Details Modal -->
+  <div id="detailsModal" class="fixed inset-0 bg-gray-600 bg-opacity-50 hidden overflow-y-auto h-full w-full z-50" aria-modal="true" role="dialog">
+    <div class="relative top-20 mx-auto p-5 border w-11/12 md:w-2/3 lg:w-1/2 shadow-lg rounded-md bg-white">
+      <div class="absolute top-0 right-0 pt-4 pr-4">
+        <button type="button" id="closeDetailsModal" class="text-gray-400 hover:text-gray-500">
+          <span class="sr-only">Close</span>
+          <svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+          </svg>
+        </button>
+      </div>
+      <div class="mt-3">
+        <h3 id="detailsModalTitle" class="text-lg leading-6 font-medium text-gray-900 mb-4">Provider Details</h3>
+        <div class="mt-4">
+          <dl class="grid grid-cols-1 gap-x-4 gap-y-6 sm:grid-cols-2">
+            <div id="detailsContent" class="col-span-2">
+              <!-- Details will be populated by JavaScript -->
+            </div>
+          </dl>
+        </div>
+        <div class="mt-6 flex justify-end">
+          <button type="button" id="closeDetailsBtn" class="px-4 py-2 bg-indigo-600 text-white text-sm font-medium rounded-md shadow-sm hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-600">
+            Close
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
 </div>
 {% endblock %}
+
+{% block scripts %}
+<script>
+document.addEventListener('DOMContentLoaded', function() {
+  // Modal elements
+  const resultModal = document.getElementById('resultModal');
+  const modalTitle = document.getElementById('modalTitle');
+  const modalMessage = document.getElementById('modalMessage');
+  const modalIcon = document.getElementById('modalIcon');
+  const modalClose = document.getElementById('modalClose');
+  
+  // Details Modal elements
+  const detailsModal = document.getElementById('detailsModal');
+  const detailsModalTitle = document.getElementById('detailsModalTitle');
+  const detailsContent = document.getElementById('detailsContent');
+  const closeDetailsModal = document.getElementById('closeDetailsModal');
+  const closeDetailsBtn = document.getElementById('closeDetailsBtn');
+  
+  // Modal functions
+  function showModal(status, title, message) {
+    modalTitle.textContent = title;
+    modalMessage.textContent = message;
+    
+    // Set the appropriate icon
+    if (status === 'success') {
+      modalIcon.innerHTML = `
+        <svg class="h-6 w-6 text-green-600" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+        </svg>
+      `;
+      modalIcon.className = 'mx-auto flex items-center justify-center h-12 w-12 rounded-full bg-green-100 mb-4';
+    } else {
+      modalIcon.innerHTML = `
+        <svg class="h-6 w-6 text-red-600" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+        </svg>
+      `;
+      modalIcon.className = 'mx-auto flex items-center justify-center h-12 w-12 rounded-full bg-red-100 mb-4';
+    }
+    
+    resultModal.classList.remove('hidden');
+  }
+  
+  function hideModal() {
+    resultModal.classList.add('hidden');
+  }
+  
+  function showDetailsModal(providerName, details) {
+    detailsModalTitle.textContent = providerName + ' Configuration Details';
+    
+    // Clear previous content
+    detailsContent.innerHTML = '';
+    
+    // Create and populate the details list
+    if (details && Object.keys(details).length > 0) {
+      const table = document.createElement('table');
+      table.className = 'min-w-full divide-y divide-gray-200';
+      
+      const thead = document.createElement('thead');
+      thead.className = 'bg-gray-50';
+      thead.innerHTML = `
+        <tr>
+          <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Setting</th>
+          <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Value</th>
+        </tr>
+      `;
+      
+      const tbody = document.createElement('tbody');
+      tbody.className = 'bg-white divide-y divide-gray-200';
+      
+      let count = 0;
+      for (const [key, value] of Object.entries(details)) {
+        const row = document.createElement('tr');
+        row.className = count % 2 === 0 ? 'bg-white' : 'bg-gray-50';
+        
+        const keyCell = document.createElement('td');
+        keyCell.className = 'px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900';
+        keyCell.textContent = key.charAt(0).toUpperCase() + key.slice(1).replace(/_/g, ' ');
+        
+        const valueCell = document.createElement('td');
+        valueCell.className = 'px-6 py-4 whitespace-nowrap text-sm text-gray-500';
+        
+        // Check if value contains sensitive information that should be masked
+        const sensitiveKeys = ['token', 'password', 'secret', 'key', 'credentials'];
+        const isSensitive = sensitiveKeys.some(sKey => key.toLowerCase().includes(sKey));
+        
+        if (isSensitive && value !== 'Not set' && value !== '') {
+          valueCell.textContent = value.slice(4) + '********' + value.slice(-4);
+          // For better readability, we can also use HTML to mask the middle part of the string
+          valueCell.innerHTML = value.slice(0, 4) + '<span class="text-gray-400">********</span>' + value.slice(-4); 
+        } else {
+          valueCell.textContent = value;
+        }
+        
+        row.appendChild(keyCell);
+        row.appendChild(valueCell);
+        tbody.appendChild(row);
+        count++;
+      }
+      
+      table.appendChild(thead);
+      table.appendChild(tbody);
+      detailsContent.appendChild(table);
+    } else {
+      detailsContent.innerHTML = '<p class="text-sm text-gray-500">No details available</p>';
+    }
+    
+    detailsModal.classList.remove('hidden');
+  }
+  
+  function hideDetailsModal() {
+    detailsModal.classList.add('hidden');
+  }
+  
+  // Close modal when clicking the close button
+  modalClose.addEventListener('click', hideModal);
+  
+  // Close modal when clicking outside of it
+  resultModal.addEventListener('click', function(e) {
+    if (e.target === resultModal) {
+      hideModal();
+    }
+  });
+  
+  // Close details modal
+  closeDetailsModal.addEventListener('click', hideDetailsModal);
+  closeDetailsBtn.addEventListener('click', hideDetailsModal);
+  
+  // Close details modal when clicking outside
+  detailsModal.addEventListener('click', function(e) {
+    if (e.target === detailsModal) {
+      hideDetailsModal();
+    }
+  });
+  
+  // View Details button handlers
+  const detailsButtons = document.querySelectorAll('.view-details-btn');
+  detailsButtons.forEach(button => {
+    button.addEventListener('click', function() {
+      const providerName = this.getAttribute('data-provider');
+      let detailsData = {};
+      
+      try {
+        detailsData = JSON.parse(this.getAttribute('data-details'));
+      } catch (e) {
+        console.error('Error parsing details data:', e);
+      }
+      
+      showDetailsModal(providerName, detailsData);
+    });
+  });
+  
+  // Test provider connections
+  const testButtons = document.querySelectorAll('.test-provider-btn');
+  testButtons.forEach(button => {
+    button.addEventListener('click', function() {
+      const provider = this.getAttribute('data-provider');
+      const originalText = this.textContent;
+      
+      this.innerHTML = '<svg class="animate-spin -ml-1 mr-2 h-4 w-4 text-indigo-700" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle><path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path></svg> Testing...';
+      this.disabled = true;
+      
+      let endpoint = '';
+      if (provider === 'dropbox') {
+        endpoint = '/api/dropbox/test-token';
+      } else if (provider === 'onedrive') {
+        endpoint = '/api/onedrive/test-token';
+      }
+      
+      fetch(endpoint)
+        .then(response => response.json())
+        .then(data => {
+          if (data.status === 'success') {
+            showModal('success', 'Connection Test Successful', `${data.message} ${data.account ? 'as ' + data.account : ''}`);
+          } else {
+            if (data.needs_reauth) {
+              showModal('error', 'Authentication Required', 'Your token has expired or is invalid. Please reconfigure this connection.');
+              // Add option to go to config page
+              modalClose.textContent = "Configure Now";
+              modalClose.addEventListener('click', function redirectToConfig() {
+                window.location.href = `/${provider}-setup`;
+                modalClose.removeEventListener('click', redirectToConfig);
+              }, { once: true });
+            } else {
+              showModal('error', 'Connection Test Failed', data.message);
+            }
+          }
+        })
+        .catch(error => {
+          showModal('error', 'Connection Error', 'Error testing connection: ' + error.message);
+        })
+        .finally(() => {
+          this.textContent = originalText;
+          this.disabled = false;
+        });
+    });
+  });
+});
+</script>
+{% endblock %}

requirements.txt

@@ -8,7 +8,7 @@ openai  # GPT integration for metadata extraction
 pymupdf  # PDF processing, text extraction, and detection (imported as 'fitz')
 PyPDF2  # PDF processing for page counting
 requests  # HTTP client
-dropbox  # Dropbox integration
+dropbox>=11.36.0  # Dropbox integration
 azure-ai-documentintelligence  # Azure OCR service
 authlib  # Authentication
 python-dotenv  # Environment variables