Update app.py

app.py

@@ -2,18 +2,18 @@
 # -*- coding: utf-8 -*-
 
 import os
-from flask import Flask, request, Response, render_template_string, jsonify, redirect, url_for, make_response
+import io
+from flask import Flask, request, Response, render_template_string, jsonify, session
 import hmac
 import hashlib
 import json
-from urllib.parse import unquote, parse_qs, quote
+from urllib.parse import unquote, parse_qs
 import time
 from datetime import datetime
 import logging
-import threading
 from huggingface_hub import HfApi, hf_hub_download, list_repo_files
 from huggingface_hub.utils import RepositoryNotFoundError, EntryNotFoundError
-import io
+from werkzeug.utils import secure_filename
 
 # --- Configuration ---
 BOT_TOKEN = os.getenv("BOT_TOKEN", "6750208873:AAE2hvPlJ99dBdhGa_Brre0IIpUdOvXxHt4")
@@ -21,44 +21,39 @@ HOST = '0.0.0.0'
 PORT = 7860
 
 # Hugging Face Settings
-REPO_ID = "Eluza133/Z1e1u"
-HF_UPLOAD_FOLDER = "uploads" # Base folder for user uploads within the HF repo
+REPO_ID = os.getenv("HF_REPO_ID", "Eluza133/Z1e1u")
+HF_UPLOAD_FOLDER = "uploads" # Base folder within the HF repo
 HF_TOKEN_WRITE = os.getenv("HF_TOKEN_WRITE") # Token with write access
-HF_TOKEN_READ = os.getenv("HF_TOKEN_READ") # Token with read access (can be same as write)
+HF_TOKEN_READ = os.getenv("HF_TOKEN_READ", HF_TOKEN_WRITE) # Read token (can be same as write)
 
 app = Flask(__name__)
 logging.basicConfig(level=logging.INFO)
-app.secret_key = os.urandom(24)
+app.secret_key = os.getenv("FLASK_SECRET_KEY", os.urandom(24)) # Use env var or random
 
 # --- Hugging Face API Initialization ---
 hf_api = None
 if HF_TOKEN_WRITE:
     hf_api = HfApi(token=HF_TOKEN_WRITE)
-    logging.info("Hugging Face API initialized with WRITE token.")
+    logging.info(f"Hugging Face API initialized for repo: {REPO_ID} with Write Token.")
 elif HF_TOKEN_READ:
     hf_api = HfApi(token=HF_TOKEN_READ)
-    logging.info("Hugging Face API initialized with READ token (Uploads disabled).")
+    logging.info(f"Hugging Face API initialized for repo: {REPO_ID} with Read-Only Token.")
 else:
-    logging.warning("HF_TOKEN_WRITE and HF_TOKEN_READ not set. Hugging Face operations will fail.")
+    logging.warning("HF_TOKEN_WRITE or HF_TOKEN_READ not set. Hugging Face operations will fail.")
 
 
 # --- Telegram Verification ---
 def verify_telegram_data(init_data_str):
-    if not init_data_str:
-        logging.warning("Verification attempt with empty initData.")
-        return None, False, "Missing initData"
-
     try:
         parsed_data = parse_qs(init_data_str)
         received_hash = parsed_data.pop('hash', [None])[0]
 
         if not received_hash:
-            logging.warning("Verification failed: Hash missing from initData.")
-            return None, False, "Hash missing"
+            logging.warning("Verification failed: Hash missing.")
+            return None, False
 
         data_check_list = []
         for key, value in sorted(parsed_data.items()):
-            # Make sure values are handled correctly, especially if multiple exist (though unlikely for standard fields)
             data_check_list.append(f"{key}={value[0]}")
         data_check_string = "\n".join(data_check_list)
 
@@ -68,40 +63,40 @@ def verify_telegram_data(init_data_str):
         if calculated_hash == received_hash:
             auth_date = int(parsed_data.get('auth_date', [0])[0])
             current_time = int(time.time())
-            # Check if data is reasonably fresh (e.g., within 24 hours)
+            # Allow data up to 24 hours old, adjust as needed
             if current_time - auth_date > 86400:
-                 logging.warning(f"Verification Warning: Telegram InitData is older than 24 hours (Auth Date: {auth_date}, Current: {current_time}). Allowing access.")
-                 # return parsed_data, False, "Data expired" # Uncomment to enforce expiry
-
-            user_data = None
-            if 'user' in parsed_data:
-                try:
-                    user_json_str = unquote(parsed_data['user'][0])
-                    user_data = json.loads(user_json_str)
-                except Exception as e:
-                    logging.error(f"Could not parse user JSON from initData: {e}")
-                    return None, False, "User data parsing failed"
-            else:
-                logging.warning("User data missing in parsed initData.")
-                return None, False, "User data missing"
-
-            if not user_data or 'id' not in user_data:
-                logging.error("Verification failed: User ID missing after parsing.")
-                return None, False, "User ID missing"
-
-            logging.info(f"Verification successful for user ID: {user_data.get('id')}")
-            return user_data, True, "Verified"
+                 logging.warning(f"Verification warning: Telegram InitData is older than 24 hours (Auth Date: {auth_date}, Current: {current_time}).")
+                 # Decide if this should be a failure: return parsed_data, False
+            return parsed_data, True
         else:
-            logging.warning(f"Verification failed: Hash mismatch. User: {parsed_data.get('user')}")
-            return None, False, "Invalid hash"
+            logging.warning(f"Verification failed: Hash mismatch. Calculated: {calculated_hash}, Received: {received_hash}")
+            return parsed_data, False
     except Exception as e:
         logging.error(f"Error verifying Telegram data: {e}", exc_info=True)
-        return None, False, "Internal verification error"
+        return None, False
+
+def get_user_id_from_initdata(init_data_str):
+    parsed_data, is_valid = verify_telegram_data(init_data_str)
+    if not is_valid or not parsed_data or 'user' not in parsed_data:
+        return None
+
+    try:
+        user_json_str = unquote(parsed_data['user'][0])
+        user_info_dict = json.loads(user_json_str)
+        user_id = user_info_dict.get('id')
+        if user_id:
+            return str(user_id) # Return as string
+        else:
+            logging.error("User ID not found in parsed user data.")
+            return None
+    except Exception as e:
+        logging.error(f"Could not parse user JSON or get ID: {e}", exc_info=True)
+        return None
 
-# --- HTML Template ---
+# --- HTML Templates ---
 TEMPLATE = """
 <!DOCTYPE html>
-<html lang="ru">
+<html lang="en">
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no, user-scalable=no, viewport-fit=cover">
@@ -109,613 +104,419 @@ TEMPLATE = """
     <script src="https://telegram.org/js/telegram-web-app.js"></script>
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
     <style>
         :root {
             --tg-theme-bg-color: {{ theme.bg_color | default('#ffffff') }};
             --tg-theme-text-color: {{ theme.text_color | default('#000000') }};
-            --tg-theme-hint-color: {{ theme.hint_color | default('#707579') }};
-            --tg-theme-link-color: {{ theme.link_color | default('#007aff') }};
-            --tg-theme-button-color: {{ theme.button_color | default('#007aff') }};
+            --tg-theme-hint-color: {{ theme.hint_color | default('#999999') }};
+            --tg-theme-link-color: {{ theme.link_color | default('#2481cc') }};
+            --tg-theme-button-color: {{ theme.button_color | default('#2481cc') }};
             --tg-theme-button-text-color: {{ theme.button_text_color | default('#ffffff') }};
-            --tg-theme-secondary-bg-color: {{ theme.secondary_bg_color | default('#f2f2f7') }};
+            --tg-theme-secondary-bg-color: {{ theme.secondary_bg_color | default('#f1f1f1') }};
+            --tg-color-scheme: {{ color_scheme | default('light') }};
+
+            --bg-color: var(--tg-theme-bg-color);
+            --text-color: var(--tg-theme-text-color);
+            --hint-color: var(--tg-theme-hint-color);
+            --button-bg: var(--tg-theme-button-color);
+            --button-text: var(--tg-theme-button-text-color);
+            --secondary-bg: var(--tg-theme-secondary-bg-color);
+            --border-color: var(--tg-theme-hint-color);
+            --link-color: var(--tg-theme-link-color);
+            --error-color: #dc3545;
+            --success-color: #198754;
+            --font-family: 'Inter', sans-serif;
             --border-radius: 12px;
             --padding: 16px;
-            --gap: 12px;
-            --font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
         }
+
+        [data-theme="dark"] {
+             --bg-color: #121212;
+             --text-color: #ffffff;
+             --hint-color: #aaaaaa;
+             --link-color: #62bcf9;
+             --button-bg: #31a5f5;
+             --button-text: #ffffff;
+             --secondary-bg: #1e1e1e;
+             --border-color: #333333;
+        }
+
         * { box-sizing: border-box; margin: 0; padding: 0; }
         html {
-            background-color: var(--tg-theme-bg-color);
-            color-scheme: {{ 'dark' if theme.bg_color and theme.bg_color|lower != '#ffffff' and theme.bg_color|lower != '#fff' else 'light' }};
+            background-color: var(--bg-color);
+            color-scheme: var(--tg-color-scheme);
         }
         body {
             font-family: var(--font-family);
-            background-color: var(--tg-theme-bg-color);
-            color: var(--tg-theme-text-color);
+            background-color: var(--bg-color);
+            color: var(--text-color);
             padding: var(--padding);
             overscroll-behavior-y: none;
-            -webkit-font-smoothing: antialiased;
-            -moz-osx-font-smoothing: grayscale;
-            visibility: hidden;
+            line-height: 1.6;
+            visibility: hidden; /* Hide until ready */
             min-height: 100vh;
-            display: flex;
-            flex-direction: column;
         }
         .container {
             max-width: 700px;
-            width: 100%;
             margin: 0 auto;
-            flex-grow: 1;
             display: flex;
             flex-direction: column;
+            gap: calc(var(--padding) * 1.5);
         }
-        .header {
-            display: flex;
-            justify-content: space-between;
-            align-items: center;
-            margin-bottom: calc(var(--padding) * 1.5);
-            padding-bottom: var(--padding);
-            border-bottom: 1px solid var(--tg-theme-secondary-bg-color);
-        }
-        .header h1 {
+        h1 {
+            text-align: center;
             font-size: 1.8em;
             font-weight: 700;
-            color: var(--tg-theme-text-color);
+            color: var(--link-color);
+            margin-bottom: var(--padding);
         }
-        .user-info {
-            font-size: 0.9em;
-            color: var(--tg-theme-hint-color);
-            text-align: right;
+        .upload-section, .files-section {
+            background-color: var(--secondary-bg);
+            border-radius: var(--border-radius);
+            padding: var(--padding);
+            border: 1px solid var(--border-color);
         }
-        .upload-section {
+        h2 {
+            font-size: 1.3em;
+            font-weight: 600;
             margin-bottom: var(--padding);
-            padding: var(--padding);
-            background-color: var(--tg-theme-secondary-bg-color);
-            border-radius: var(--border-radius);
+            border-bottom: 1px solid var(--border-color);
+            padding-bottom: 8px;
         }
-        .upload-section label {
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            padding: 12px 20px;
-            background-color: var(--tg-theme-button-color);
-            color: var(--tg-theme-button-text-color);
+        .file-input-wrapper {
+            position: relative;
+            overflow: hidden;
+            display: inline-block;
+            border: 2px dashed var(--hint-color);
             border-radius: var(--border-radius);
-            cursor: pointer;
-            font-weight: 500;
-            transition: background-color 0.2s ease;
+            padding: var(--padding);
             text-align: center;
+            cursor: pointer;
+            transition: border-color 0.3s ease;
+            width: 100%;
+            margin-bottom: var(--padding);
         }
-        .upload-section label:hover {
-            filter: brightness(1.1);
+        .file-input-wrapper:hover {
+            border-color: var(--link-color);
         }
-        .upload-section input[type="file"] { display: none; }
-        .upload-section .progress-area {
-            margin-top: var(--gap);
-            display: none; /* Hidden initially */
+        .file-input-wrapper input[type=file] {
+            position: absolute;
+            left: 0; top: 0; opacity: 0;
+            width: 100%; height: 100%;
+            cursor: pointer;
         }
-        .upload-section .progress-bar {
-            width: 100%;
-            height: 10px;
-            background-color: #e0e0e0;
-            border-radius: 5px;
-            overflow: hidden;
+        .file-input-label {
+            color: var(--hint-color);
+            font-weight: 500;
         }
-        .upload-section .progress-bar-inner {
-            height: 100%;
-            width: 0%;
-            background-color: var(--tg-theme-link-color);
-            transition: width 0.3s ease;
+        .file-input-label span {
+            display: block;
+            font-size: 1.5em;
+            margin-bottom: 8px;
         }
-        .upload-section .progress-text {
+        #file-list-preview {
             font-size: 0.9em;
-            color: var(--tg-theme-hint-color);
-            text-align: center;
-            margin-top: 5px;
+            color: var(--text-color);
+            margin-top: 10px;
+            max-height: 100px;
+            overflow-y: auto;
+            text-align: left;
+        }
+        #file-list-preview div {
+             padding: 2px 0;
+             white-space: nowrap;
+             overflow: hidden;
+             text-overflow: ellipsis;
+        }
+        .btn {
+            display: block; width: 100%;
+            padding: 12px var(--padding); border-radius: var(--border-radius);
+            background: var(--button-bg); color: var(--button-text);
+            text-decoration: none; font-weight: 600;
+            border: none; cursor: pointer;
+            transition: background-color 0.2s ease;
+            font-size: 1em; text-align: center;
         }
-
-        .file-list-section {
-            margin-top: var(--padding);
-            flex-grow: 1;
+        .btn:hover {
+            opacity: 0.9;
         }
-        .file-list-section h2 {
-            font-size: 1.3em;
-            font-weight: 600;
-            margin-bottom: var(--gap);
-            color: var(--tg-theme-text-color);
+        .btn:disabled {
+            background-color: var(--hint-color);
+            cursor: not-allowed;
+        }
+        #status-message {
+            margin-top: var(--padding);
+            padding: 10px;
+            border-radius: var(--border-radius);
+            text-align: center;
+            font-weight: 500;
+            display: none; /* Hidden by default */
         }
-        #file-list {
+        #status-message.success { background-color: var(--success-color); color: white; }
+        #status-message.error { background-color: var(--error-color); color: white; }
+        #status-message.loading { background-color: var(--secondary-bg); color: var(--text-color); border: 1px solid var(--border-color); }
+
+        .file-list-container {
             list-style: none;
             padding: 0;
-            display: flex;
-            flex-direction: column;
-            gap: var(--gap);
         }
-        #file-list li {
+        .file-item {
             display: flex;
-            align-items: center;
-            padding: var(--padding);
-            background-color: var(--tg-theme-secondary-bg-color);
-            border-radius: var(--border-radius);
             justify-content: space-between;
-            word-break: break-all;
-        }
-         #file-list li .file-info {
-            display: flex;
             align-items: center;
-            gap: 10px;
-            flex-grow: 1;
-            min-width: 0; /* Prevent overflow */
+            padding: 10px;
+            border-bottom: 1px solid var(--border-color);
+            transition: background-color 0.2s ease;
         }
-        #file-list li .file-icon {
-            font-size: 1.4em;
-            color: var(--tg-theme-hint-color);
-            min-width: 25px;
-            text-align: center;
+        .file-item:last-child { border-bottom: none; }
+        .file-item:hover { background-color: rgba(128, 128, 128, 0.1); }
+        .file-name {
+            flex-grow: 1;
+            margin-right: 15px;
+            word-break: break-all; /* Wrap long names */
         }
-        #file-list li .file-name {
-            font-weight: 500;
-            color: var(--tg-theme-text-color);
+        .file-link {
+            color: var(--link-color);
             text-decoration: none;
+            font-weight: 500;
             white-space: nowrap;
-            overflow: hidden;
-            text-overflow: ellipsis;
         }
-         #file-list li .file-name:hover {
-             color: var(--tg-theme-link-color);
-             text-decoration: underline;
-         }
-         #file-list li .file-actions button {
-             background: none;
-             border: none;
-             color: var(--tg-theme-link-color);
-             cursor: pointer;
-             font-size: 1.1em;
-             margin-left: 10px;
-             padding: 5px;
-         }
-         #file-list li .file-actions button:hover {
-             opacity: 0.7;
-         }
-
-        #loading-indicator, #error-message, #no-files-message {
+        .file-link:hover { text-decoration: underline; }
+        .loading-files, .no-files {
             text-align: center;
+            color: var(--hint-color);
             padding: var(--padding);
-            color: var(--tg-theme-hint-color);
-            font-size: 1.1em;
-            display: none; /* Hidden initially */
-        }
-         #error-message {
-            color: #dc3545; /* Standard error color */
-            background-color: rgba(220, 53, 69, 0.1);
-            border: 1px solid rgba(220, 53, 69, 0.2);
-            border-radius: var(--border-radius);
-         }
-         /* Modal for media */
-        .media-modal {
-            display: none; position: fixed; z-index: 1001;
-            left: 0; top: 0; width: 100%; height: 100%;
-            overflow: auto; background-color: rgba(0,0,0,0.8);
-            backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px);
-            animation: fadeIn 0.3s ease-out;
-        }
-        @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
-        .media-modal-content {
-            margin: auto; display: block;
-            max-width: 90%; max-height: 85%;
-            position: absolute; top: 50%; left: 50%;
-            transform: translate(-50%, -50%);
-        }
-         .media-modal img, .media-modal video {
-            display: block; width: auto; height: auto;
-            max-width: 100%; max-height: 100%;
-            margin: 0 auto;
-            border-radius: var(--border-radius);
-         }
-        .media-modal-close {
-            position: absolute; top: 15px; right: 35px;
-            color: #f1f1f1; font-size: 40px; font-weight: bold;
-            transition: 0.3s; cursor: pointer;
-        }
-        .media-modal-close:hover, .media-modal-close:focus { color: #bbb; text-decoration: none; }
-
-         /* Footer */
-         .footer {
-             text-align: center;
-             margin-top: calc(var(--padding) * 2);
-             padding-top: var(--padding);
-             border-top: 1px solid var(--tg-theme-secondary-bg-color);
-             font-size: 0.85em;
-             color: var(--tg-theme-hint-color);
-         }
-
+            font-style: italic;
+        }
+        .loader {
+             border: 4px solid var(--secondary-bg); border-radius: 50%; border-top: 4px solid var(--link-color);
+             width: 20px; height: 20px; animation: spin 1s linear infinite; display: inline-block; margin-left: 10px; vertical-align: middle;
+        }
+        @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
     </style>
 </head>
 <body>
     <div class="container">
-        <div class="header">
-            <h1>☁️ Zeus Cloud</h1>
-            <div class="user-info" id="user-info-greeting">Загрузка...</div>
-        </div>
-
-        <div class="upload-section">
-            <label for="file-upload">
-                📤 Выбрать файлы (до 20 шт.)
-            </label>
-            <input type="file" id="file-upload" multiple accept="*/*">
-            <div class="progress-area" id="progress-area">
-                <div class="progress-bar">
-                    <div class="progress-bar-inner" id="progress-bar-inner"></div>
-                </div>
-                <div class="progress-text" id="progress-text"></div>
-            </div>
-        </div>
-
-        <div class="file-list-section">
-            <h2>Мои файлы</h2>
-            <div id="loading-indicator">Загрузка списка файлов...</div>
-            <div id="error-message"></div>
-            <ul id="file-list"></ul>
-            <div id="no-files-message">У вас пока нет загруженных файлов.</div>
-        </div>
-
-         <div class="footer">
-            Powered by Hugging Face & Telegram
-         </div>
-
-    </div>
+        <h1>☁️ Zeus Cloud</h1>
+
+        <section class="upload-section">
+            <h2>Upload Files</h2>
+            <div class="file-input-wrapper">
+                <input type="file" id="fileInput" multiple accept="*/*">
+                <label for="fileInput" class="file-input-label">
+                    <span>📤</span>
+                    Click or Drag & Drop<br>
+                    (Max 20 files)
+                 </label>
+             </div>
+             <div id="file-list-preview">No files selected.</div>
+             <button id="uploadButton" class="btn" disabled>Upload</button>
+             <div id="status-message"></div>
+        </section>
+
+        <section class="files-section">
+            <h2>My Files</h2>
+            <ul class="file-list-container" id="myFilesList">
+                <li class="loading-files">Loading files...</li>
+            </ul>
+        </section>
 
-    <!-- The Modal -->
-    <div id="mediaModal" class="media-modal">
-      <span class="media-modal-close" id="media-modal-close-btn">×</span>
-      <div id="media-modal-content-container">
-           </div>
     </div>
 
-
     <script>
         const tg = window.Telegram.WebApp;
-        const fileInput = document.getElementById('file-upload');
-        const fileList = document.getElementById('file-list');
-        const loadingIndicator = document.getElementById('loading-indicator');
-        const errorMessage = document.getElementById('error-message');
-        const noFilesMessage = document.getElementById('no-files-message');
-        const progressArea = document.getElementById('progress-area');
-        const progressBarInner = document.getElementById('progress-bar-inner');
-        const progressText = document.getElementById('progress-text');
-        const userInfoGreeting = document.getElementById('user-info-greeting');
-        const mediaModal = document.getElementById('mediaModal');
-        const mediaModalContentContainer = document.getElementById('media-modal-content-container');
-        const mediaModalCloseBtn = document.getElementById('media-modal-close-btn');
-
-
+        const fileInput = document.getElementById('fileInput');
+        const uploadButton = document.getElementById('uploadButton');
+        const statusMessage = document.getElementById('status-message');
+        const myFilesList = document.getElementById('myFilesList');
+        const fileListPreview = document.getElementById('fileList-preview');
         let currentUserId = null;
         let currentInitData = null;
-        const HF_REPO_ID = "{{ repo_id }}";
-        const HF_UPLOAD_FOLDER_JS = "{{ upload_folder }}";
-        const MAX_FILES_UPLOAD = 20;
 
         function applyTheme(themeParams) {
             const root = document.documentElement;
-            const isDark = themeParams.bg_color && themeParams.bg_color.toLowerCase() !== '#ffffff' && themeParams.bg_color.toLowerCase() !== '#fff';
-            root.style.setProperty('--tg-theme-bg-color', themeParams.bg_color || (isDark ? '#1c1c1d' : '#ffffff'));
-            root.style.setProperty('--tg-theme-text-color', themeParams.text_color || (isDark ? '#ffffff' : '#000000'));
-            root.style.setProperty('--tg-theme-hint-color', themeParams.hint_color || (isDark ? '#999999' : '#707579'));
-            root.style.setProperty('--tg-theme-link-color', themeParams.link_color || '#007aff');
-            root.style.setProperty('--tg-theme-button-color', themeParams.button_color || '#007aff');
-            root.style.setProperty('--tg-theme-button-text-color', themeParams.button_text_color || '#ffffff');
-            root.style.setProperty('--tg-theme-secondary-bg-color', themeParams.secondary_bg_color || (isDark ? '#2c2c2e' : '#f2f2f7'));
-            root.style.setProperty('color-scheme', isDark ? 'dark' : 'light');
-        }
-
-        function showMessage(element, message) {
-            element.textContent = message;
-            element.style.display = 'block';
-        }
-
-        function hideMessage(element) {
-            element.style.display = 'none';
-        }
-
-        function getFileIcon(filename) {
-            const extension = filename.split('.').pop().toLowerCase();
-            if (['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp', 'svg'].includes(extension)) return '🖼️';
-            if (['mp4', 'avi', 'mov', 'wmv', 'mkv', 'webm'].includes(extension)) return '🎬';
-            if (['mp3', 'wav', 'ogg', 'aac', 'flac'].includes(extension)) return '🎵';
-            if (['pdf'].includes(extension)) return '📄';
-            if (['doc', 'docx', 'odt'].includes(extension)) return '📝';
-            if (['xls', 'xlsx', 'ods'].includes(extension)) return '📊';
-            if (['ppt', 'pptx', 'odp'].includes(extension)) return '📽️';
-            if (['zip', 'rar', '7z', 'tar', 'gz'].includes(extension)) return '📦';
-            if (['txt', 'md', 'log'].includes(extension)) return '📜';
-            if (['html', 'css', 'js', 'py', 'java', 'c', 'cpp'].includes(extension)) return '💻';
-            return '📁'; // Default icon
-        }
-
-         function isViewableMedia(filename) {
-            const extension = filename.split('.').pop().toLowerCase();
-            return ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp', 'svg', 'mp4', 'webm', 'ogg'].includes(extension); // Add video/audio types TWA can reasonably play
-        }
-
-         function getMediaType(filename) {
-             const extension = filename.split('.').pop().toLowerCase();
-             if (['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp', 'svg'].includes(extension)) return 'image';
-             if (['mp4', 'webm', 'ogg'].includes(extension)) return 'video';
-             // Add audio later if needed
-             return null;
-         }
-
+            const colorScheme = themeParams.color_scheme || 'light';
+            root.dataset.theme = colorScheme;
+            root.style.setProperty('--tg-theme-bg-color', themeParams.bg_color || (colorScheme === 'dark' ? '#121212' : '#ffffff'));
+            root.style.setProperty('--tg-theme-text-color', themeParams.text_color || (colorScheme === 'dark' ? '#ffffff' : '#000000'));
+            root.style.setProperty('--tg-theme-hint-color', themeParams.hint_color || (colorScheme === 'dark' ? '#aaaaaa' : '#999999'));
+            root.style.setProperty('--tg-theme-link-color', themeParams.link_color || (colorScheme === 'dark' ? '#62bcf9' : '#2481cc'));
+            root.style.setProperty('--tg-theme-button-color', themeParams.button_color || (colorScheme === 'dark' ? '#31a5f5' : '#2481cc'));
+            root.style.setProperty('--tg-theme-button-text-color', themeParams.button_text_color || (colorScheme === 'dark' ? '#ffffff' : '#ffffff'));
+            root.style.setProperty('--tg-theme-secondary-bg-color', themeParams.secondary_bg_color || (colorScheme === 'dark' ? '#1e1e1e' : '#f1f1f1'));
+            root.style.setProperty('--tg-color-scheme', colorScheme);
+        }
+
+        function showStatus(message, type = 'loading', duration = null) {
+            statusMessage.textContent = message;
+            statusMessage.className = type; // 'success', 'error', 'loading'
+            statusMessage.style.display = 'block';
+
+             // Add loader only for loading type
+             const loader = statusMessage.querySelector('.loader');
+             if (type === 'loading' && !loader) {
+                 const loaderSpan = document.createElement('span');
+                 loaderSpan.className = 'loader';
+                 statusMessage.appendChild(loaderSpan);
+             } else if (type !== 'loading' && loader) {
+                 loader.remove();
+             }
 
-        function displayFiles(files) {
-            fileList.innerHTML = ''; // Clear existing list
-            hideMessage(loadingIndicator);
-            hideMessage(errorMessage);
 
-            if (!files || files.length === 0) {
-                showMessage(noFilesMessage, 'У вас пока нет загруженных файлов.');
-                return;
+            if (duration) {
+                setTimeout(() => {
+                    statusMessage.style.display = 'none';
+                }, duration);
             }
+        }
 
-            hideMessage(noFilesMessage);
-
-            files.sort().forEach(filePath => {
-                // filePath is like "uploads/USER_ID/filename.ext"
-                const filename = filePath.split('/').pop();
-                const li = document.createElement('li');
-
-                const fileInfoDiv = document.createElement('div');
-                fileInfoDiv.className = 'file-info';
-
-                const iconSpan = document.createElement('span');
-                iconSpan.className = 'file-icon';
-                iconSpan.textContent = getFileIcon(filename);
-
-                const link = document.createElement('a');
-                link.className = 'file-name';
-                // Construct the direct download URL
-                const downloadUrl = `https://huggingface.co/datasets/${HF_REPO_ID}/resolve/main/${filePath}`;
-                link.href = downloadUrl;
-                link.textContent = filename;
-                link.target = '_blank'; // Open in new tab by default
-
-                fileInfoDiv.appendChild(iconSpan);
-                fileInfoDiv.appendChild(link);
-                li.appendChild(fileInfoDiv);
-
-                const actionsDiv = document.createElement('div');
-                actionsDiv.className = 'file-actions';
-
-                if (isViewableMedia(filename)) {
-                    const viewButton = document.createElement('button');
-                    viewButton.innerHTML = '👁️'; // Eye icon
-                    viewButton.title = 'Предпросмотр';
-                    viewButton.onclick = (e) => {
-                        e.preventDefault(); // Prevent default link navigation
-                        openMediaModal(downloadUrl, getMediaType(filename));
-                    };
-                    actionsDiv.appendChild(viewButton);
-                }
-
-                // Add download button explicitly if needed, though the link itself works
-                // const downloadButton = document.createElement('button');
-                // downloadButton.innerHTML = '💾'; // Save icon
-                // downloadButton.title = 'Скачать';
-                // downloadButton.onclick = () => window.open(downloadUrl, '_blank');
-                // actionsDiv.appendChild(downloadButton);
-
-                 // Add delete button
-                const deleteButton = document.createElement('button');
-                deleteButton.innerHTML = '🗑️'; // Trash icon
-                deleteButton.title = 'Удалить';
-                deleteButton.onclick = () => confirmDeleteFile(filePath, filename, li);
-                actionsDiv.appendChild(deleteButton);
-
-
-                li.appendChild(actionsDiv);
-                fileList.appendChild(li);
-            });
+        function hideStatus() {
+             statusMessage.style.display = 'none';
         }
 
-        function fetchFiles() {
-            if (!currentInitData || !currentUserId) {
-                showMessage(errorMessage, 'Ошибка: Не удалось получить данные пользователя.');
+        async function fetchFiles() {
+            if (!currentInitData) {
+                console.error("Cannot fetch files: initData not available.");
+                myFilesList.innerHTML = '<li class="no-files">Error: Could not verify user.</li>';
                 return;
             }
-            showMessage(loadingIndicator, 'Загрузка списка файлов...');
-            hideMessage(errorMessage);
-            hideMessage(noFilesMessage);
-            fileList.innerHTML = '';
-
-            fetch('/list_files', {
-                method: 'POST',
-                headers: { 'Content-Type': 'application/json' },
-                body: JSON.stringify({ initData: currentInitData })
-            })
-            .then(response => {
+            myFilesList.innerHTML = '<li class="loading-files">Loading files...</li>';
+
+            try {
+                const response = await fetch('/list_files', {
+                    method: 'GET',
+                    headers: {
+                        'X-Telegram-Init-Data': currentInitData,
+                        'Accept': 'application/json'
+                    }
+                });
+
                 if (!response.ok) {
-                    return response.json().then(err => { throw new Error(err.message || `HTTP error ${response.status}`) });
+                    const errorData = await response.json().catch(() => ({ message: `HTTP error! status: ${response.status}` }));
+                    throw new Error(errorData.message || `Failed to fetch files (${response.status})`);
                 }
-                return response.json();
-            })
-            .then(data => {
+
+                const data = await response.json();
+
                 if (data.status === 'ok') {
                     displayFiles(data.files);
                 } else {
-                    throw new Error(data.message || 'Не удалось загрузить файлы.');
+                    throw new Error(data.message || 'Failed to list files from server.');
                 }
-            })
-            .catch(error => {
+            } catch (error) {
                 console.error('Error fetching files:', error);
-                hideMessage(loadingIndicator);
-                showMessage(errorMessage, `Ошибка загрузки списка: ${error.message}`);
-            });
+                myFilesList.innerHTML = `<li class="no-files">Error loading files: ${error.message}</li>`;
+            }
         }
 
-        function uploadFiles(files) {
-            if (!HF_TOKEN_WRITE) {
-                 showMessage(errorMessage, "Загрузка невозможна: отсутствует токен записи на сервере.");
-                 tg.showAlert("Загрузка временно недоступна.");
-                 return;
-            }
-            if (!currentInitData) {
-                showMessage(errorMessage, 'Ошибка: Не удалось получить данные для аутентификации.');
-                return;
-            }
-            if (files.length === 0) return;
-            if (files.length > MAX_FILES_UPLOAD) {
-                tg.showAlert(`Можно загрузить не более ${MAX_FILES_UPLOAD} файлов за раз.`);
+        function displayFiles(files) {
+            myFilesList.innerHTML = ''; // Clear previous list
+            if (!files || files.length === 0) {
+                myFilesList.innerHTML = '<li class="no-files">No files uploaded yet.</li>';
                 return;
             }
 
-            const formData = new FormData();
-            for (let i = 0; i < files.length; i++) {
-                formData.append('files', files[i]);
-            }
-            formData.append('initData', currentInitData);
-
-            progressArea.style.display = 'block';
-            progressBarInner.style.width = '0%';
-            progressText.textContent = `Загрузка ${files.length} файла(ов)... 0%`;
-
-            const xhr = new XMLHttpRequest();
-            xhr.open('POST', '/upload', true);
-
-            xhr.upload.onprogress = function(event) {
-                if (event.lengthComputable) {
-                    const percentComplete = Math.round((event.loaded / event.total) * 100);
-                    progressBarInner.style.width = percentComplete + '%';
-                    progressText.textContent = `Загрузка ${files.length} файла(ов)... ${percentComplete}%`;
-                }
-            };
-
-            xhr.onload = function() {
-                progressText.textContent = 'Обработка...';
-                setTimeout(() => { // Give a small delay for visual feedback
-                    progressArea.style.display = 'none';
-                     try {
-                         const response = JSON.parse(xhr.responseText);
-                         if (xhr.status === 200 && response.status === 'ok') {
-                             tg.showAlert(response.message || `${files.length} файл(ов) успешно загружено!`);
-                             fetchFiles(); // Refresh the list
-                         } else {
-                             const errorMsg = response.message || `Ошибка сервера (${xhr.status})`;
-                             showMessage(errorMessage, `Ошибка загрузки: ${errorMsg}`);
-                             tg.showAlert(`Ошибка загрузки: ${errorMsg}`);
-                         }
-                     } catch (e) {
-                         showMessage(errorMessage, `Ошибка обработки ответа сервера: ${xhr.responseText}`);
-                         tg.showAlert('Произошла ошибка при загрузке.');
-                     }
-                }, 300);
-            };
-
-            xhr.onerror = function() {
-                progressArea.style.display = 'none';
-                const errorMsg = 'Ошибка сети или сервер недоступен.';
-                showMessage(errorMessage, errorMsg);
-                tg.showAlert(errorMsg);
-            };
-
-            xhr.send(formData);
-        }
-
-        function openMediaModal(url, type) {
-             mediaModalContentContainer.innerHTML = ''; // Clear previous content
-             let mediaElement;
-             if (type === 'image') {
-                 mediaElement = document.createElement('img');
-                 mediaElement.src = url;
-                 mediaElement.alt = 'Предпросмотр изображения';
-             } else if (type === 'video') {
-                 mediaElement = document.createElement('video');
-                 mediaElement.src = url;
-                 mediaElement.controls = true;
-                 mediaElement.autoplay = false; // Consider autoplay settings
-                 mediaElement.alt = 'Предпросмотр видео';
-             } else {
-                 console.error("Unsupported media type for modal:", type);
-                 return;
-             }
-             mediaElement.className = 'media-modal-content';
-             mediaModalContentContainer.appendChild(mediaElement);
-             mediaModal.style.display = "block";
-             if (tg.HapticFeedback) tg.HapticFeedback.impactOccurred('light');
-         }
+            files.sort().forEach(fileInfo => { // Sort alphabetically by path
+                const li = document.createElement('li');
+                li.className = 'file-item';
+
+                const fileNameSpan = document.createElement('span');
+                fileNameSpan.className = 'file-name';
+                // Display only the filename part
+                fileNameSpan.textContent = fileInfo.name.split('/').pop();
+
+                const fileLink = document.createElement('a');
+                fileLink.className = 'file-link';
+                fileLink.href = fileInfo.url;
+                fileLink.textContent = 'Open';
+                fileLink.target = '_blank'; // Open in new tab
+
+                li.appendChild(fileNameSpan);
+                li.appendChild(fileLink);
+                myFilesList.appendChild(li);
+            });
+        }
 
-         function closeMediaModal() {
-             mediaModal.style.display = "none";
-             // Important: Stop video/audio playback if any
-             const video = mediaModalContentContainer.querySelector('video');
-             if (video) {
-                 video.pause();
-                 video.src = ''; // Release resources
-             }
-             mediaModalContentContainer.innerHTML = ''; // Clear content
+        function handleFileSelection() {
+            const files = fileInput.files;
+            if (files.length === 0) {
+                 fileListPreview.textContent = 'No files selected.';
+                 uploadButton.disabled = true;
+            } else if (files.length > 20) {
+                 fileListPreview.textContent = `Error: Too many files selected (${files.length}). Maximum is 20.`;
+                 uploadButton.disabled = true;
+                 tg.HapticFeedback.notificationOccurred('error');
+            } else {
+                 let previewHTML = `Selected ${files.length} file(s):<div>`;
+                 for (let i = 0; i < files.length; i++) {
+                     previewHTML += `<div>${files[i].name} (${(files[i].size / 1024 / 1024).toFixed(2)} MB)</div>`;
+                 }
+                 previewHTML += '</div>';
+                 fileListPreview.innerHTML = previewHTML;
+                 uploadButton.disabled = false;
+            }
          }
 
-        function confirmDeleteFile(filePath, filename, listItemElement) {
-             tg.showConfirm(`Вы уверены, что хотите удалить файл "${filename}"? Это действие необратимо.`, (confirmed) => {
-                if (confirmed) {
-                     deleteFile(filePath, listItemElement);
-                 }
-             });
-        }
 
-        function deleteFile(filePath, listItemElement) {
-             if (!currentInitData) {
-                 tg.showAlert('Ошибка: Не удалось выполнить аутентификацию для удаления.');
-                 return;
-             }
-            if (!HF_TOKEN_WRITE) {
-                 tg.showAlert('Ошибка: Удаление файлов недоступно (требуется разрешение на запись).');
-                 return;
+        async function handleUpload() {
+            const files = fileInput.files;
+            if (files.length === 0 || files.length > 20 || !currentInitData) {
+                showStatus('Invalid selection or missing user data.', 'error', 3000);
+                return;
             }
 
-             // Show visual indication of deletion in progress
-             listItemElement.style.opacity = '0.5';
-             const deleteButton = listItemElement.querySelector('.file-actions button[title="Удалить"]');
-             if (deleteButton) deleteButton.disabled = true;
+            uploadButton.disabled = true;
+            showStatus('Uploading...', 'loading');
+            tg.MainButton.showProgress();
+            tg.MainButton.setParams({ text: "UPLOADING...", is_active: false });
 
 
-             fetch('/delete_file', {
-                 method: 'POST',
-                 headers: { 'Content-Type': 'application/json' },
-                 body: JSON.stringify({ initData: currentInitData, filePath: filePath })
-             })
-             .then(response => {
-                 if (!response.ok) {
-                     return response.json().then(err => { throw new Error(err.message || `HTTP error ${response.status}`) });
-                 }
-                 return response.json();
-             })
-             .then(data => {
-                 if (data.status === 'ok') {
-                     tg.showAlert(data.message || `Файл "${filePath.split('/').pop()}" удален.`);
-                      listItemElement.remove(); // Remove from list immediately
-                       // Check if the list is now empty
-                       if (fileList.children.length === 0) {
-                           showMessage(noFilesMessage, 'У вас пока нет загр��женных файлов.');
-                       }
-                 } else {
-                     throw new Error(data.message || 'Не удалось удалить файл.');
-                 }
-             })
-             .catch(error => {
-                 console.error('Error deleting file:', error);
-                 tg.showAlert(`Ошибка удаления: ${error.message}`);
-                 // Restore visual state on error
-                 listItemElement.style.opacity = '1';
-                 if (deleteButton) deleteButton.disabled = false;
-             });
-         }
+            const formData = new FormData();
+            for (let i = 0; i < files.length; i++) {
+                formData.append('files', files[i]);
+            }
+            // Send initData in header for verification
+            // formData.append('initData', currentInitData); // Avoid sending in body if using header
+
+            try {
+                const response = await fetch('/upload', {
+                    method: 'POST',
+                    headers: {
+                        'X-Telegram-Init-Data': currentInitData // Send initData securely in header
+                    },
+                    body: formData,
+                });
+
+                const data = await response.json();
+
+                if (response.ok && data.status === 'ok') {
+                    showStatus(`Successfully uploaded ${data.uploaded_count} file(s)!`, 'success', 3000);
+                    fileInput.value = ''; // Clear the input
+                    handleFileSelection(); // Update preview and button state
+                    await fetchFiles(); // Refresh the file list
+                    tg.HapticFeedback.notificationOccurred('success');
+                } else {
+                    throw new Error(data.message || `Upload failed (${response.status})`);
+                }
+            } catch (error) {
+                console.error('Upload error:', error);
+                showStatus(`Upload Error: ${error.message}`, 'error', 5000);
+                tg.HapticFeedback.notificationOccurred('error');
+            } finally {
+                uploadButton.disabled = false; // Re-enable after success/error, unless no files selected
+                handleFileSelection(); // Ensure button state is correct based on selection
+                tg.MainButton.hideProgress();
+                tg.MainButton.setParams({ text: "UPLOAD COMPLETE", is_active: true }); // Or revert to original text
+                // Maybe hide main button after completion? tg.MainButton.hide();
+                setTimeout(() => tg.MainButton.setParams({text: "UPLOAD", is_active: true }), 2000); // Revert button text
+            }
+        }
 
-        // --- Initialization ---
         function setupTelegram() {
              if (!tg || !tg.initData) {
                  console.error("Telegram WebApp script not loaded or initData is missing.");
-                 document.body.style.backgroundColor = '#f8d7da'; // Error background
-                 document.body.innerHTML = '<div style="padding: 20px; color: #721c24;">Ошибка: Не удалось инициализировать приложение Telegram. Попробуйте перезапустить.</div>';
+                 document.body.innerHTML = '<p style="color: red; text-align: center; padding-top: 50px;">Error: Could not initialize Telegram Mini App interface. Please try reopening.</p>';
                  document.body.style.visibility = 'visible';
                  return;
              }
@@ -723,68 +524,63 @@ TEMPLATE = """
             tg.ready();
             tg.expand();
 
-            currentInitData = tg.initData; // Store for later use in requests
-
             applyTheme(tg.themeParams);
             tg.onEvent('themeChanged', () => applyTheme(tg.themeParams));
 
-            // Get user info for greeting and ID
-            const user = tg.initDataUnsafe?.user;
-            if (user && user.id) {
-                currentUserId = user.id;
-                const name = user.first_name || user.username || 'Пользователь';
-                userInfoGreeting.textContent = `Привет, ${name}! 👋`;
-                 // Enable upload button only if write token is potentially present
-                 if (!HF_TOKEN_WRITE) {
-                     const uploadLabel = document.querySelector('.upload-section label');
-                     uploadLabel.style.backgroundColor = 'var(--tg-theme-hint-color)';
-                     uploadLabel.style.cursor = 'not-allowed';
-                     uploadLabel.title = 'Загрузка недоступна (нет прав на запись)';
-                     fileInput.disabled = true;
+            currentInitData = tg.initData;
+
+            // Send initData for initial verification (optional, can rely on upload/list requests)
+            fetch('/verify', {
+                 method: 'POST',
+                 headers: { 'Content-Type': 'application/json', 'Accept': 'application/json' },
+                 body: JSON.stringify({ initData: currentInitData }),
+             })
+             .then(response => response.json())
+             .then(data => {
+                 if (data.status === 'ok' && data.verified && data.user_id) {
+                     currentUserId = data.user_id;
+                     console.log('Initial verification successful. User ID:', currentUserId);
+                     fetchFiles(); // Fetch files now that we potentially have the user ID context
+                 } else {
+                     console.warn('Initial verification failed or user ID missing:', data.message);
+                     // Handle case where initial verify fails - maybe show error?
+                      myFilesList.innerHTML = `<li class="no-files">Error: Could not verify your Telegram account. ${data.message || ''}</li>`;
                  }
-            } else {
-                showMessage(errorMessage, 'Ошибка: Не удалось определить пользователя Telegram.');
-                userInfoGreeting.textContent = 'Ошибка ID';
-                // Disable functionality if no user ID
-                fileInput.disabled = true;
-                return; // Stop further execution like fetching files
-            }
+             })
+             .catch(error => {
+                 console.error('Error during initial verification:', error);
+                  myFilesList.innerHTML = `<li class="no-files">Error verifying account: ${error.message}</li>`;
+             });
 
-            // Fetch initial file list
-            fetchFiles();
 
-            // Event listeners
-            fileInput.addEventListener('change', (event) => {
-                uploadFiles(event.target.files);
-                // Clear the input after selection to allow re-uploading the same file
-                event.target.value = null;
-            });
+            fileInput.addEventListener('change', handleFileSelection);
+            uploadButton.addEventListener('click', handleUpload);
 
-             // Modal listeners
-            mediaModalCloseBtn.addEventListener('click', closeMediaModal);
-            mediaModal.addEventListener('click', (event) => {
-                 // Close if clicked outside the content area
-                 if (event.target === mediaModal) {
-                     closeMediaModal();
-                 }
-             });
+            // Configure Main Button (Optional)
+            // tg.MainButton.setText("Upload Selected");
+            // tg.MainButton.onClick(handleUpload); // Trigger upload via main button
+            // fileInput.addEventListener('change', () => {
+            //     if (fileInput.files.length > 0 && fileInput.files.length <= 20) {
+            //         tg.MainButton.show().enable();
+            //     } else {
+            //         tg.MainButton.hide(); // Or disable: tg.MainButton.disable();
+            //     }
+            // });
 
 
             document.body.style.visibility = 'visible';
-        }
+         }
 
-        // --- Run ---
         if (window.Telegram && window.Telegram.WebApp) {
             setupTelegram();
         } else {
             console.warn("Telegram WebApp script not immediately available, waiting for window.onload");
             window.addEventListener('load', setupTelegram);
-             // Fallback timeout
+             // Fallback if load event doesn't fire or script fails
              setTimeout(() => {
-                 if (document.body.style.visibility !== 'visible' && (!window.Telegram || !window.Telegram.WebApp)) {
+                 if (document.body.style.visibility !== 'visible') {
                       console.error("Telegram WebApp script fallback timeout triggered.");
-                      document.body.style.backgroundColor = '#f8d7da';
-                      document.body.innerHTML = '<div style="padding: 20px; color: #721c24;">Ошибка загрузки интерфейса Telegram. Проверьте соединение или попробуйте позже.</div>';
+                      document.body.innerHTML = '<p style="color: red; text-align: center; padding-top: 50px;">Error: Failed to load Telegram interface components.</p>';
                       document.body.style.visibility = 'visible';
                   }
              }, 3500);
@@ -798,186 +594,155 @@ TEMPLATE = """
 # --- Flask Routes ---
 @app.route('/')
 def index():
-    theme_params = {} # Let JS handle theme application after tg.ready()
-    # Pass essential config to JS template
-    return render_template_string(
-        TEMPLATE,
-        theme=theme_params,
-        repo_id=REPO_ID,
-        upload_folder=HF_UPLOAD_FOLDER
-    )
-
-@app.route('/list_files', methods=['POST'])
-def list_files_route():
-    req_data = request.get_json()
-    init_data_str = req_data.get('initData')
-
-    user_data, is_valid, message = verify_telegram_data(init_data_str)
-
-    if not is_valid or not user_data:
-        return jsonify({"status": "error", "message": f"Аутентификация не удалась: {message}"}), 403
-
-    user_id = user_data.get('id')
-    if not user_id:
-         return jsonify({"status": "error", "message": "Не удалось определить ID пользователя."}), 403
-
-    if not hf_api:
-         return jsonify({"status": "error", "message": "Hugging Face API не настроен на сервере."}), 500
-
-    user_folder_path = f"{HF_UPLOAD_FOLDER}/{user_id}"
+    theme_params_json = request.args.get('themeParams', '{}')
     try:
-        logging.info(f"Listing files for user {user_id} in repo {REPO_ID} path {user_folder_path}/")
-        # Use allow_patterns to list only files directly within the user's folder
-        repo_files = list_repo_files(
-            repo_id=REPO_ID,
-            repo_type="dataset",
-            token=HF_TOKEN_READ or HF_TOKEN_WRITE, # Use read or write token
-            paths=[user_folder_path], # Specify the directory
-            recursive=False # List only top-level files in the user dir
-        )
-        # The result includes the full path, which is what we want
-        user_files = [f for f in repo_files if f.startswith(user_folder_path + '/')]
+        theme_params = json.loads(theme_params_json)
+    except json.JSONDecodeError:
+        theme_params = {}
+    color_scheme = request.args.get('colorScheme', 'light')
+    return render_template_string(TEMPLATE, theme=theme_params, color_scheme=color_scheme)
+
+@app.route('/verify', methods=['POST'])
+def verify_route():
+    try:
+        req_data = request.get_json()
+        init_data_str = req_data.get('initData')
+        if not init_data_str:
+            return jsonify({"status": "error", "verified": False, "message": "Missing initData"}), 400
 
-        logging.info(f"Found {len(user_files)} files for user {user_id}.")
-        return jsonify({"status": "ok", "files": user_files})
+        user_id = get_user_id_from_initdata(init_data_str)
 
-    except EntryNotFoundError:
-         logging.info(f"User folder '{user_folder_path}' not found for user {user_id}. Returning empty list.")
-         return jsonify({"status": "ok", "files": []}) # Folder doesn't exist yet = no files
-    except RepositoryNotFoundError:
-         logging.error(f"Hugging Face repository '{REPO_ID}' not found.")
-         return jsonify({"status": "error", "message": f"Ошибка сервера: Репозиторий '{REPO_ID}' не найден."}), 500
-    except Exception as e:
-        logging.exception(f"Error listing files for user {user_id} from Hugging Face:")
-        return jsonify({"status": "error", "message": f"Ошибка сервера при получении списка файлов: {str(e)}"}), 500
+        if user_id:
+            return jsonify({"status": "ok", "verified": True, "user_id": user_id}), 200
+        else:
+            logging.warning(f"Verification failed for initData: {init_data_str[:50]}...")
+            return jsonify({"status": "error", "verified": False, "message": "Invalid or unverifiable data"}), 403
 
+    except Exception as e:
+        logging.exception("Error in /verify endpoint")
+        return jsonify({"status": "error", "verified": False, "message": "Internal server error"}), 500
 
 @app.route('/upload', methods=['POST'])
-def upload_file_route():
-    if not HF_TOKEN_WRITE:
-        return jsonify({"status": "error", "message": "Загрузка не разрешена: отсутствует токен записи."}), 403
-    if not hf_api:
-        return jsonify({"status": "error", "message": "Hugging Face API не настроен для записи."}), 500
-
-    init_data_str = request.form.get('initData')
-    user_data, is_valid, message = verify_telegram_data(init_data_str)
+def upload_files():
+    if not hf_api or not HF_TOKEN_WRITE:
+        return jsonify({"status": "error", "message": "Server configuration error: Hugging Face write access not available."}), 503
 
-    if not is_valid or not user_data:
-        return jsonify({"status": "error", "message": f"Аутентификация не удалась: {message}"}), 403
+    init_data_str = request.headers.get('X-Telegram-Init-Data')
+    if not init_data_str:
+        return jsonify({"status": "error", "message": "Authentication required (Missing InitData Header)."}), 401
 
-    user_id = user_data.get('id')
+    user_id = get_user_id_from_initdata(init_data_str)
     if not user_id:
-         return jsonify({"status": "error", "message": "Не удалось определить ID пользователя."}), 403
-
-    uploaded_files = request.files.getlist('files')
-    if not uploaded_files:
-        return jsonify({"status": "error", "message": "Файлы не найдены в запросе."}), 400
+        return jsonify({"status": "error", "message": "Authentication failed (Invalid InitData)."}), 403
 
-    if len(uploaded_files) > 20:
-         return jsonify({"status": "error", "message": "Слишком много файлов. Максимум: 20."}), 400
+    files = request.files.getlist('files')
+    if not files:
+        return jsonify({"status": "error", "message": "No files provided in the request."}), 400
+    if len(files) > 20:
+         return jsonify({"status": "error", "message": "Too many files. Maximum is 20."}), 400
 
+    uploaded_count = 0
+    errors = []
     user_folder_path = f"{HF_UPLOAD_FOLDER}/{user_id}"
-    upload_success_count = 0
-    upload_errors = []
-
-    for file in uploaded_files:
-        if file.filename == '':
-            logging.warning(f"Skipping empty filename upload for user {user_id}.")
-            continue
-
-        # Sanitize filename potentially? For now, use original.
-        filename = file.filename
-        path_in_repo = f"{user_folder_path}/{filename}"
-
-        try:
-            # Check if file already exists to prevent accidental overwrite?
-            # Or just let upload_file handle it (it overwrites by default)
-            logging.info(f"Uploading '{filename}' for user {user_id} to {REPO_ID}/{path_in_repo}")
-
-            # Use a file-like object directly
-            file_content = file.read() # Read content into memory
-            file_obj = io.BytesIO(file_content)
-
-            hf_api.upload_file(
-                path_or_fileobj=file_obj,
-                path_in_repo=path_in_repo,
-                repo_id=REPO_ID,
-                repo_type="dataset",
-                token=HF_TOKEN_WRITE, # Explicitly use write token
-                commit_message=f"User {user_id} uploaded {filename}"
-                # create_pr=False # Direct commit is usually desired here
-            )
-            upload_success_count += 1
-            logging.info(f"Successfully uploaded '{filename}' for user {user_id}.")
-
-        except Exception as e:
-            logging.exception(f"Error uploading file '{filename}' for user {user_id} to Hugging Face:")
-            upload_errors.append(f"{filename}: {str(e)}")
-
-    if not upload_errors and upload_success_count > 0:
-        return jsonify({"status": "ok", "message": f"{upload_success_count} файл(ов) успешно загружено."})
-    elif upload_success_count > 0:
-         return jsonify({
-            "status": "partial_error",
-            "message": f"{upload_success_count} файл(ов) загружено. Ошибки: {'; '.join(upload_errors)}",
-            "errors": upload_errors
-         }), 207 # Multi-Status
-    else:
-         return jsonify({
-             "status": "error",
-             "message": f"Не удалось загрузить файлы. Ошибки: {'; '.join(upload_errors)}",
-             "errors": upload_errors
-         }), 500
 
+    for file in files:
+        if file and file.filename:
+            filename = secure_filename(file.filename)
+            path_in_repo = f"{user_folder_path}/{filename}"
+            logging.info(f"Attempting to upload '{filename}' for user {user_id} to {REPO_ID}/{path_in_repo}")
+
+            try:
+                # Read file content into memory for upload
+                file_content = file.read()
+                file_like_object = io.BytesIO(file_content)
+
+                hf_api.upload_file(
+                    path_or_fileobj=file_like_object,
+                    path_in_repo=path_in_repo,
+                    repo_id=REPO_ID,
+                    repo_type="dataset",
+                    commit_message=f"Upload {filename} by user {user_id}"
+                    # token=HF_TOKEN_WRITE is implicitly used by hf_api instance
+                )
+                uploaded_count += 1
+                logging.info(f"Successfully uploaded '{filename}' for user {user_id}.")
+            except Exception as e:
+                error_msg = f"Failed to upload {filename}: {str(e)}"
+                logging.error(error_msg, exc_info=True)
+                errors.append(error_msg)
+        else:
+             errors.append("Received an empty file part.")
 
-@app.route('/delete_file', methods=['POST'])
-def delete_file_route():
-    if not HF_TOKEN_WRITE:
-        return jsonify({"status": "error", "message": "Удаление не разрешено: отсутствует токен записи."}), 403
-    if not hf_api:
-        return jsonify({"status": "error", "message": "Hugging Face API не настроен для записи."}), 500
 
-    req_data = request.get_json()
-    init_data_str = req_data.get('initData')
-    file_path_to_delete = req_data.get('filePath') # e.g., "uploads/USER_ID/filename.ext"
+    if errors:
+        if uploaded_count > 0:
+            return jsonify({
+                "status": "partial_error",
+                "message": f"Uploaded {uploaded_count} file(s) with errors on others.",
+                "errors": errors,
+                "uploaded_count": uploaded_count
+            }), 207 # Multi-Status
+        else:
+            return jsonify({
+                "status": "error",
+                "message": "Failed to upload any files.",
+                "errors": errors,
+                "uploaded_count": 0
+            }), 500
+    else:
+        return jsonify({"status": "ok", "message": f"Successfully uploaded {uploaded_count} files.", "uploaded_count": uploaded_count}), 200
 
-    if not file_path_to_delete:
-        return jsonify({"status": "error", "message": "Не указан путь к файлу для удаления."}), 400
 
-    user_data, is_valid, message = verify_telegram_data(init_data_str)
+@app.route('/list_files', methods=['GET'])
+def list_user_files():
+    if not hf_api:
+         return jsonify({"status": "error", "message": "Server configuration error: Hugging Face access not available."}), 503
 
-    if not is_valid or not user_data:
-        return jsonify({"status": "error", "message": f"Аутентификация не удалась: {message}"}), 403
+    init_data_str = request.headers.get('X-Telegram-Init-Data')
+    if not init_data_str:
+        return jsonify({"status": "error", "message": "Authentication required (Missing InitData Header)."}), 401
 
-    user_id = user_data.get('id')
+    user_id = get_user_id_from_initdata(init_data_str)
     if not user_id:
-         return jsonify({"status": "error", "message": "Не удалось определить ID пользователя."}), 403
+        return jsonify({"status": "error", "message": "Authentication failed (Invalid InitData)."}), 403
 
-    # Security Check: Ensure the file path belongs to the authenticated user
-    expected_prefix = f"{HF_UPLOAD_FOLDER}/{user_id}/"
-    if not file_path_to_delete.startswith(expected_prefix):
-        logging.warning(f"User {user_id} attempted to delete unauthorized path: {file_path_to_delete}")
-        return jsonify({"status": "error", "message": "Ошибка доступа к файлу."}), 403
+    user_folder_path = f"{HF_UPLOAD_FOLDER}/{user_id}"
+    logging.info(f"Listing files for user {user_id} in path: {user_folder_path}")
 
     try:
-        logging.info(f"Attempting to delete file '{file_path_to_delete}' for user {user_id} from repo {REPO_ID}")
-        hf_api.delete_file(
-            path_in_repo=file_path_to_delete,
+        # Use list_repo_files which is efficient for listing
+        repo_files = list_repo_files(
             repo_id=REPO_ID,
             repo_type="dataset",
-            token=HF_TOKEN_WRITE,
-            commit_message=f"User {user_id} deleted {file_path_to_delete.split('/')[-1]}"
+            token=HF_TOKEN_READ or HF_TOKEN_WRITE, # Use read or write token
+            paths=[user_folder_path] # Specify the directory to list
         )
-        logging.info(f"Successfully deleted '{file_path_to_delete}' for user {user_id}.")
-        return jsonify({"status": "ok", "message": "Файл успешно удален."})
+
+        # Filter out potential directory markers if any, though list_repo_files usually doesn't return them for subdirs
+        user_files_info = []
+        base_url = f"https://huggingface.co/datasets/{REPO_ID}/resolve/main"
+
+        for file_path in repo_files:
+             # Ensure we only list files directly under the user's folder
+             if file_path.startswith(user_folder_path + "/") and file_path != user_folder_path + "/":
+                file_info = {
+                    "name": file_path, # Full path from repo root
+                    "url": f"{base_url}/{file_path}"
+                }
+                user_files_info.append(file_info)
+
+        logging.info(f"Found {len(user_files_info)} file(s) for user {user_id}.")
+        return jsonify({"status": "ok", "files": user_files_info})
 
     except EntryNotFoundError:
-        logging.warning(f"File '{file_path_to_delete}' not found for deletion by user {user_id}.")
-        # Could argue whether this is an error or success (file is gone)
-        return jsonify({"status": "error", "message": "Файл не найден на сервере."}), 404
+         logging.info(f"No files found or directory does not exist for user {user_id} at path {user_folder_path}.")
+         return jsonify({"status": "ok", "files": []}) # Return empty list if user folder doesn't exist yet
+    except RepositoryNotFoundError:
+         logging.error(f"Repository '{REPO_ID}' not found.")
+         return jsonify({"status": "error", "message": "Server configuration error: Target repository not found."}), 500
     except Exception as e:
-        logging.exception(f"Error deleting file '{file_path_to_delete}' for user {user_id} from Hugging Face:")
-        return jsonify({"status": "error", "message": f"Ошибка сервера при удалении файла: {str(e)}"}), 500
+        logging.error(f"Error listing files for user {user_id}: {e}", exc_info=True)
+        return jsonify({"status": "error", "message": "Internal server error while listing files."}), 500
 
 
 # --- App Initialization ---
@@ -987,24 +752,30 @@ if __name__ == '__main__':
     print("---")
     print(f"Flask server starting on http://{HOST}:{PORT}")
     print(f"Using Bot Token ID: {BOT_TOKEN.split(':')[0]}")
-    print(f"Hugging Face Repo: {REPO_ID}")
-    print(f"HF Upload Folder: {HF_UPLOAD_FOLDER}")
-    if not hf_api:
+    print(f"Target Hugging Face Repo: {REPO_ID}")
+    print(f"Upload Base Folder: {HF_UPLOAD_FOLDER}")
+    if not HF_TOKEN_WRITE and not HF_TOKEN_READ:
          print("---")
-         print("--- WARNING: HUGGING FACE API NOT INITIALIZED ---")
-         print("--- Set HF_TOKEN_READ and/or HF_TOKEN_WRITE environment variables.")
-         print("--- File listing requires READ, Upload/Delete require WRITE.")
+         print("--- CRITICAL WARNING: NO HUGGING FACE TOKEN SET ---")
+         print("--- File operations WILL FAIL. Set HF_TOKEN_WRITE or HF_TOKEN_READ environment variables.")
          print("---")
     elif not HF_TOKEN_WRITE:
          print("---")
          print("--- WARNING: HF_TOKEN_WRITE NOT SET ---")
-         print("--- File uploads and deletions will be disabled.")
+         print("--- File uploads will be disabled. Read-only mode.")
          print("---")
     else:
-         print("--- Hugging Face WRITE token found. Uploads/Deletes enabled.")
+         print("--- Hugging Face Write Token found. Uploads enabled.")
+
+    if not app.secret_key or app.secret_key == b'default_secret':
+        print("---")
+        print("--- WARNING: Using default or insecure FLASK_SECRET_KEY ---")
+        print("--- Set a strong FLASK_SECRET_KEY environment variable for production.")
+        print("---")
 
     print("--- Server Ready ---")
-    # Use a production server like Waitress or Gunicorn instead of app.run() for deployment
+    # For production, use a proper WSGI server like Gunicorn or Waitress
+    # Example using waitress:
     # from waitress import serve
     # serve(app, host=HOST, port=PORT)
-    app.run(host=HOST, port=PORT, debug=False) # debug=False recommended for production
+    app.run(host=HOST, port=PORT, debug=False) # debug=False is crucial for production