Update app.py

app.py

@@ -1,49 +1,148 @@
-from flask import Flask, render_template_string, request, redirect, url_for, jsonify
+from flask import Flask, render_template_string, request, jsonify, redirect, url_for, flash
 import json
 import os
+import logging
+import threading
+import time
+from datetime import datetime
+from huggingface_hub import HfApi, hf_hub_download
+from huggingface_hub.utils import RepositoryNotFoundError, HfHubHTTPError
+from werkzeug.utils import secure_filename
+from dotenv import load_dotenv
+import uuid
 import hmac
 import hashlib
 import urllib.parse
-from datetime import datetime
 import requests
-import uuid
+
+load_dotenv()
 
 app = Flask(__name__)
-app.secret_key = os.getenv("FLASK_SECRET_KEY", 'your_very_secret_key')
-DATA_FILE = 'telegram_wall_data.json'
+app.secret_key = os.getenv("FLASK_SECRET_KEY", 'tontalent_secret_key_for_flash_messages_only')
+DATA_FILE = 'wall_data.json'
+SYNC_FILES = [DATA_FILE]
+
+REPO_ID = os.getenv("HF_REPO_ID", "Kgshop/tontalent2")
+HF_TOKEN_WRITE = os.getenv("HF_TOKEN_WRITE")
+HF_TOKEN_READ = os.getenv("HF_TOKEN_READ")
 
 TELEGRAM_BOT_TOKEN = os.getenv("TELEGRAM_BOT_TOKEN", "7549355625:AAGYWatM-nUVQirgBiBwoAtWZgzfp3QnQjY")
 
+DOWNLOAD_RETRIES = 3
+DOWNLOAD_DELAY = 5
+
+logging.basicConfig(level=logging.INFO, format='%(asctime)s - %(levelname)s - %(message)s')
+
+def download_db_from_hf(specific_file=None, retries=DOWNLOAD_RETRIES, delay=DOWNLOAD_DELAY):
+    if not HF_TOKEN_READ and not HF_TOKEN_WRITE:
+        logging.warning("HF_TOKEN_READ/HF_TOKEN_WRITE not set. Download might fail for private repos.")
+    token_to_use = HF_TOKEN_READ if HF_TOKEN_READ else HF_TOKEN_WRITE
+    files_to_download = [specific_file] if specific_file else SYNC_FILES
+    logging.info(f"Attempting download for {files_to_download} from {REPO_ID}...")
+    all_successful = True
+    for file_name in files_to_download:
+        success = False
+        for attempt in range(retries + 1):
+            try:
+                logging.info(f"Downloading {file_name} (Attempt {attempt + 1}/{retries + 1})...")
+                local_path = hf_hub_download(
+                    repo_id=REPO_ID, filename=file_name, repo_type="dataset",
+                    token=token_to_use, local_dir=".", local_dir_use_symlinks=False,
+                    force_download=True, resume_download=False
+                )
+                logging.info(f"Successfully downloaded {file_name} to {local_path}.")
+                success = True
+                break
+            except RepositoryNotFoundError:
+                 logging.error(f"Repository {REPO_ID} not found. Download cancelled for all files.")
+                 return False
+            except HfHubHTTPError as e:
+                if e.response.status_code == 404:
+                    logging.warning(f"File {file_name} not found in repo {REPO_ID} (404). Skipping this file.")
+                    if attempt == 0 and not os.path.exists(file_name):
+                        try:
+                            if file_name == DATA_FILE:
+                                with open(file_name, 'w', encoding='utf-8') as f:
+                                    json.dump({'users': {}}, f)
+                                logging.info(f"Created empty local file {file_name} because it was not found on HF.")
+                        except Exception as create_e:
+                            logging.error(f"Failed to create empty local file {file_name}: {create_e}")
+                    success = True
+                    break
+                else:
+                    logging.error(f"HTTP error downloading {file_name} (Attempt {attempt + 1}): {e}. Retrying in {delay}s...")
+            except Exception as e:
+                 logging.error(f"Unexpected error downloading {file_name} (Attempt {attempt + 1}): {e}. Retrying in {delay}s...", exc_info=True)
+            if attempt < retries: time.sleep(delay)
+        if not success:
+            logging.error(f"Failed to download {file_name} after {retries + 1} attempts.")
+            all_successful = False
+    logging.info(f"Download process finished. Overall success: {all_successful}")
+    return all_successful
+
+def upload_db_to_hf(specific_file=None):
+    if not HF_TOKEN_WRITE:
+        logging.warning("HF_TOKEN_WRITE not set. Skipping upload to Hugging Face.")
+        return
+    try:
+        api = HfApi()
+        files_to_upload = [specific_file] if specific_file else SYNC_FILES
+        logging.info(f"Starting upload of {files_to_upload} to HF repo {REPO_ID}...")
+        for file_name in files_to_upload:
+            if os.path.exists(file_name):
+                try:
+                    api.upload_file(
+                        path_or_fileobj=file_name, path_in_repo=file_name, repo_id=REPO_ID,
+                        repo_type="dataset", token=HF_TOKEN_WRITE,
+                        commit_message=f"Sync {file_name} {datetime.now().strftime('%Y-%m-%d %H:%M:%S')}"
+                    )
+                    logging.info(f"File {file_name} successfully uploaded to Hugging Face.")
+                except Exception as e:
+                     logging.error(f"Error uploading file {file_name} to Hugging Face: {e}")
+            else:
+                logging.warning(f"File {file_name} not found locally, skipping upload.")
+        logging.info("Finished uploading files to HF.")
+    except Exception as e:
+        logging.error(f"General error during Hugging Face upload initialization or process: {e}", exc_info=True)
+
+def periodic_backup():
+    backup_interval = 1800
+    logging.info(f"Setting up periodic backup every {backup_interval} seconds.")
+    while True:
+        time.sleep(backup_interval)
+        logging.info("Starting periodic backup...")
+        upload_db_to_hf()
+        logging.info("Periodic backup finished.")
+
 def load_data():
-    if not os.path.exists(DATA_FILE):
-        return {'users': {}, 'walls': {}}
+    default_data = {'users': {}}
     try:
-        with open(DATA_FILE, 'r', encoding='utf-8') as f:
-            return json.load(f)
+        with open(DATA_FILE, 'r', encoding='utf-8') as file:
+            data = json.load(file)
+        if not isinstance(data.get('users'), dict):
+            logging.warning(f"Data in {DATA_FILE} is not in the correct format. Resetting.")
+            return default_data
+        return data
     except (FileNotFoundError, json.JSONDecodeError):
-        return {'users': {}, 'walls': {}}
+        if download_db_from_hf(specific_file=DATA_FILE):
+            try:
+                with open(DATA_FILE, 'r', encoding='utf-8') as file:
+                    data = json.load(file)
+                if not isinstance(data.get('users'), dict):
+                    logging.warning(f"Downloaded data in {DATA_FILE} is not correct. Resetting.")
+                    return default_data
+                return data
+            except (FileNotFoundError, json.JSONDecodeError):
+                return default_data
+        return default_data
 
 def save_data(data):
-    with open(DATA_FILE, 'w', encoding='utf-8') as f:
-        json.dump(data, f, ensure_ascii=False, indent=4)
-
-def send_telegram_notification(chat_id, message_text):
-    if not TELEGRAM_BOT_TOKEN or not chat_id:
-        print(f"Skipping notification for chat_id {chat_id}: Bot token or chat_id missing.")
-        return
-    url = f"https://api.telegram.org/bot{TELEGRAM_BOT_TOKEN}/sendMessage"
-    payload = {
-        'chat_id': chat_id,
-        'text': message_text,
-        'parse_mode': 'HTML'
-    }
     try:
-        response = requests.post(url, json=payload)
-        response.raise_for_status()
-        print(f"Notification sent to {chat_id}. Response: {response.json()}")
-    except requests.exceptions.RequestException as e:
-        print(f"Failed to send notification to {chat_id}: {e}")
-
+        with open(DATA_FILE, 'w', encoding='utf-8') as file:
+            json.dump(data, file, ensure_ascii=False, indent=4)
+        upload_db_to_hf(specific_file=DATA_FILE)
+    except Exception as e:
+        logging.error(f"Error saving data: {e}", exc_info=True)
 
 def verify_telegram_auth_data(auth_data_str, bot_token):
     if not auth_data_str:
@@ -73,16 +172,27 @@ def verify_telegram_auth_data(auth_data_str, bot_token):
             return False, None
     return False, None
 
-def get_authenticated_user(request_headers):
-    auth_data_str = request_headers.get('X-Telegram-Auth')
-    if not auth_data_str:
-        return None
-    is_valid, user_data = verify_telegram_auth_data(auth_data_str, TELEGRAM_BOT_TOKEN)
-    if is_valid and user_data:
-        return user_data
-    return None
+def send_telegram_notification(chat_id, message_text):
+    if not TELEGRAM_BOT_TOKEN:
+        logging.warning("TELEGRAM_BOT_TOKEN not set, cannot send notification.")
+        return
+
+    url = f"https://api.telegram.org/bot{TELEGRAM_BOT_TOKEN}/sendMessage"
+    payload = {
+        'chat_id': chat_id,
+        'text': message_text,
+        'parse_mode': 'HTML'
+    }
+    try:
+        response = requests.post(url, json=payload)
+        response_json = response.json()
+        if not response_json.get('ok'):
+            logging.error(f"Failed to send Telegram notification: {response_json.get('description')}")
+    except Exception as e:
+        logging.error(f"Exception while sending Telegram notification: {e}")
+
 
-INDEX_TEMPLATE = """
+WALL_TEMPLATE = '''
 <!DOCTYPE html>
 <html lang="en">
 <head>
@@ -99,306 +209,514 @@ INDEX_TEMPLATE = """
             --tg-theme-button-color: #007aff;
             --tg-theme-button-text-color: #ffffff;
             --tg-theme-secondary-bg-color: #f0f0f0;
+            --tg-theme-header-bg-color: #efeff4;
+            --tg-theme-section-bg-color: #ffffff;
+        }
+        body {
+            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+            margin: 0;
+            padding: 0;
+            background-color: var(--tg-theme-bg-color);
+            color: var(--tg-theme-text-color);
+            overscroll-behavior-y: none;
+        }
+        .app-container { display: flex; flex-direction: column; min-height: 100vh; }
+        .header {
+            background-color: var(--tg-theme-header-bg-color);
+            padding: 12px 15px;
+            text-align: center;
+            font-weight: 600;
+            font-size: 17px;
+            border-bottom: 0.5px solid var(--tg-theme-secondary-bg-color);
+            position: sticky;
+            top: 0;
+            z-index: 100;
+        }
+        .tabs { display: flex; background-color: var(--tg-theme-secondary-bg-color); padding: 5px; }
+        .tab-button {
+            flex: 1; padding: 12px 10px; text-align: center; cursor: pointer;
+            background: none; border: none; color: var(--tg-theme-hint-color);
+            font-size: 15px; font-weight: 500; border-bottom: 2.5px solid transparent;
+            transition: color 0.2s ease, border-bottom-color 0.2s ease;
+            -webkit-tap-highlight-color: transparent;
+        }
+        .tab-button.active { color: var(--tg-theme-link-color); border-bottom-color: var(--tg-theme-link-color); }
+        .content { flex-grow: 1; padding: 15px; }
+        .loading, .empty-state { text-align: center; padding: 50px 15px; color: var(--tg-theme-hint-color); font-size: 16px; }
+        
+        .post-form {
+            background-color: var(--tg-theme-section-bg-color);
+            padding: 15px;
+            border-radius: 10px;
+            margin-bottom: 20px;
+        }
+        .post-form textarea {
+            width: 100%;
+            padding: 12px;
+            border: 1px solid var(--tg-theme-secondary-bg-color);
+            border-radius: 8px;
+            font-size: 16px;
+            background-color: var(--tg-theme-bg-color);
+            color: var(--tg-theme-text-color);
+            box-sizing: border-box;
+            min-height: 80px;
+            resize: vertical;
+        }
+        .post-form .form-actions {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            margin-top: 10px;
+        }
+        .post-form .file-inputs label {
+             color: var(--tg-theme-link-color);
+             cursor: pointer;
+             margin-right: 15px;
+             font-size: 14px;
+        }
+        .post-form .file-inputs input { display: none; }
+
+        .post-form button {
+            background-color: var(--tg-theme-button-color);
+            color: var(--tg-theme-button-text-color);
+            border: none;
+            padding: 10px 20px;
+            border-radius: 8px;
+            font-size: 15px;
+            font-weight: 500;
+            cursor: pointer;
+        }
+        
+        .post-card {
+            background-color: var(--tg-theme-section-bg-color);
+            padding: 15px;
+            border-radius: 10px;
+            margin-bottom: 15px;
+            box-shadow: 0 2px 8px rgba(0,0,0,0.06);
+        }
+        .post-card .post-header {
+            display: flex;
+            align-items: center;
+            margin-bottom: 10px;
+        }
+        .post-card .post-header img {
+            width: 36px;
+            height: 36px;
+            border-radius: 50%;
+            margin-right: 10px;
+            background-color: var(--tg-theme-secondary-bg-color);
+        }
+        .post-card .post-header-info {
+            display: flex;
+            flex-direction: column;
+        }
+        .post-card .post-header .author { font-weight: 600; color: var(--tg-theme-text-color); }
+        .post-card .post-header .timestamp { font-size: 13px; color: var(--tg-theme-hint-color); }
+        .post-card .post-content {
+            font-size: 15px;
+            line-height: 1.5;
+            white-space: pre-wrap;
+            word-wrap: break-word;
         }
-        body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; margin: 0; padding: 0; background-color: var(--tg-theme-bg-color); color: var(--tg-theme-text-color); }
-        .container { padding: 15px; }
-        .header { text-align: center; font-size: 20px; font-weight: 600; padding: 10px 0; border-bottom: 1px solid var(--tg-theme-secondary-bg-color); }
-        .nav { display: flex; justify-content: space-around; padding: 10px; background-color: var(--tg-theme-secondary-bg-color); }
-        .nav a { text-decoration: none; color: var(--tg-theme-link-color); font-weight: 500; }
-        .post-form textarea { width: 100%; box-sizing: border-box; padding: 10px; border-radius: 8px; border: 1px solid var(--tg-theme-hint-color); min-height: 80px; font-size: 16px; margin-top: 15px; }
-        .post-form button { width: 100%; padding: 12px; background-color: var(--tg-theme-button-color); color: var(--tg-theme-button-text-color); border: none; border-radius: 8px; font-size: 16px; font-weight: 600; cursor: pointer; margin-top: 10px; }
-        .wall-post { background-color: var(--tg-theme-secondary-bg-color); padding: 12px; margin: 15px 0; border-radius: 8px; }
-        .post-author { font-weight: 600; color: var(--tg-theme-text-color); }
-        .post-author a { color: var(--tg-theme-link-color); text-decoration: none; }
-        .post-content { margin: 8px 0; white-space: pre-wrap; word-wrap: break-word; }
-        .post-timestamp { font-size: 12px; color: var(--tg-theme-hint-color); text-align: right; }
-        .user-list-item { padding: 10px; border-bottom: 1px solid var(--tg-theme-secondary-bg-color); }
-        .user-list-item a { text-decoration: none; color: var(--tg-theme-text-color); font-size: 16px; }
+        .post-card .post-media { margin-top: 10px; }
+        .post-card .post-media img, .post-card .post-media video { max-width: 100%; border-radius: 8px; }
+        .post-card .post-media a { color: var(--tg-theme-link-color); }
+        
+        .user-list-item {
+            display: flex;
+            align-items: center;
+            padding: 12px 0;
+            border-bottom: 1px solid var(--tg-theme-secondary-bg-color);
+            cursor: pointer;
+        }
+        .user-list-item:last-child { border-bottom: none; }
+        .user-list-item img {
+            width: 45px;
+            height: 45px;
+            border-radius: 50%;
+            margin-right: 12px;
+            background-color: var(--tg-theme-secondary-bg-color);
+        }
+        .user-list-item .user-info span { font-size: 16px; font-weight: 500; }
+        .user-list-item .user-info p { margin: 2px 0 0 0; font-size: 14px; color: var(--tg-theme-hint-color); }
     </style>
 </head>
 <body>
-    <div id="view-container"></div>
+    <div class="app-container">
+        <div class="header" id="appHeader">My Wall</div>
+        <div class="tabs">
+            <button class="tab-button active" id="myWallTab">My Wall</button>
+            <button class="tab-button" id="usersTab">Users</button>
+        </div>
+        <div class="content" id="mainContent">
+            <div class="loading">Loading...</div>
+        </div>
+    </div>
 
     <script>
         const tg = window.Telegram.WebApp;
+        let currentUser = null;
+        let currentView = 'my_wall'; 
+        let viewingUserId = null;
+
+        const mainContent = document.getElementById('mainContent');
+        const appHeader = document.getElementById('appHeader');
+        const myWallTab = document.getElementById('myWallTab');
+        const usersTab = document.getElementById('usersTab');
 
         function applyThemeParams() {
-            document.documentElement.style.setProperty('--tg-theme-bg-color', tg.themeParams.bg_color || '#ffffff');
-            document.documentElement.style.setProperty('--tg-theme-text-color', tg.themeParams.text_color || '#000000');
-            document.documentElement.style.setProperty('--tg-theme-hint-color', tg.themeParams.hint_color || '#999999');
-            document.documentElement.style.setProperty('--tg-theme-link-color', tg.themeParams.link_color || '#007aff');
-            document.documentElement.style.setProperty('--tg-theme-button-color', tg.themeParams.button_color || '#007aff');
-            document.documentElement.style.setProperty('--tg-theme-button-text-color', tg.themeParams.button_text_color || '#ffffff');
-            document.documentElement.style.setProperty('--tg-theme-secondary-bg-color', tg.themeParams.secondary_bg_color || '#f0f0f0');
+            const root = document.documentElement.style;
+            Object.keys(tg.themeParams).forEach(key => {
+                const cssVar = `--tg-theme-${key.replace(/_/g, '-')}`;
+                root.setProperty(cssVar, tg.themeParams[key]);
+            });
         }
 
         async function apiCall(endpoint, method = 'GET', body = null) {
-            const headers = { 'Content-Type': 'application/json', 'X-Telegram-Auth': tg.initData };
+            const headers = { 'Content-Type': 'application/json' };
+            if (tg.initData) headers['X-Telegram-Auth'] = tg.initData;
+            
             const options = { method, headers };
             if (body) options.body = JSON.stringify(body);
+
             const response = await fetch(endpoint, options);
             if (!response.ok) {
-                const errorData = await response.json().catch(() => ({ error: 'API Error' }));
-                throw new Error(errorData.error);
+                const errorData = await response.json().catch(() => ({ error: 'Request failed' }));
+                throw new Error(errorData.error || `HTTP error ${response.status}`);
             }
             return response.json();
         }
 
-        function renderWall(data) {
-            const { wall_owner, posts, current_user } = data;
-            let html = `
-                <div class="header">${wall_owner.first_name}'s Wall</div>
-                <div class="nav">
-                    <a href="#" onclick="showMyWall()">My Wall</a>
-                    <a href="#" onclick="showUserList()">Users</a>
+        function renderPostForm(wallOwnerId) {
+            return `
+                <div class="post-form">
+                    <textarea id="postText" placeholder="Write something on the wall..."></textarea>
+                    <div class="form-actions">
+                        <div class="file-inputs">
+                            <label for="photo-upload">Photo</label>
+                            <input type="file" id="photo-upload" accept="image/*" disabled>
+                            <label for="video-upload">Video</label>
+                            <input type="file" id="video-upload" accept="video/*" disabled>
+                            <label for="doc-upload">File</label>
+                            <input type="file" id="doc-upload" disabled>
+                        </div>
+                        <button onclick="submitPost('${wallOwnerId}')">Post</button>
+                    </div>
+                    <p style="font-size:12px; color:var(--tg-theme-hint-color); margin-top:8px;">File uploads are not yet implemented.</p>
                 </div>
-                <div class="container">
             `;
-            if (current_user.id !== wall_owner.id) {
-                 html += `
-                    <div class="post-form">
-                        <form onsubmit="handlePostSubmit(event, '${wall_owner.id}')">
-                            <textarea name="content" placeholder="Write something on ${wall_owner.first_name}'s wall..."></textarea>
-                            <button type="submit">Post</button>
-                        </form>
-                    </div>
-                 `;
-            } else {
-                 html += `
-                    <div class="post-form">
-                        <form onsubmit="handlePostSubmit(event, '${wall_owner.id}')">
-                            <textarea name="content" placeholder="What's on your mind?"></textarea>
-                            <button type="submit">Post</button>
-                        </form>
-                    </div>
-                 `;
-            }
-
-            if (posts && posts.length > 0) {
-                posts.forEach(post => {
-                    html += `
-                        <div class="wall-post">
-                            <div class="post-author">
-                                <a href="#" onclick="showUserWall('${post.author_id}')">${post.author_name}</a>
-                            </div>
-                            <div class="post-content">${post.content}</div>
-                            <div class="post-timestamp">${new Date(post.timestamp).toLocaleString()}</div>
-                        </div>
-                    `;
-                });
-            } else {
-                html += '<p>This wall is empty.</p>';
-            }
-
-            html += '</div>';
-            document.getElementById('view-container').innerHTML = html;
         }
 
-        function renderUserList(users) {
-            let html = `
-                <div class="header">Users</div>
-                <div class="nav">
-                    <a href="#" onclick="showMyWall()">My Wall</a>
-                    <a href="#" onclick="showUserList()">Users</a>
+        function renderPostCard(post) {
+            const authorUsername = post.author_username ? `@${post.author_username}` : 'Anonymous';
+            const postDate = new Date(post.timestamp).toLocaleString();
+            return `
+                <div class="post-card">
+                    <div class="post-header">
+                        <img src="${post.author_photo_url || ''}" alt="Avatar">
+                        <div class="post-header-info">
+                            <span class="author">${post.author_first_name || 'User'}</span>
+                            <span class="timestamp">${authorUsername} • ${postDate}</span>
+                        </div>
+                    </div>
+                    <div class="post-content">${post.text}</div>
                 </div>
-                <div class="container">
             `;
-            users.forEach(user => {
-                html += `
-                    <div class="user-list-item">
-                        <a href="#" onclick="showUserWall('${user.id}')">${user.first_name} ${user.last_name || ''} (@${user.username || '...'})</a>
-                    </div>
-                `;
-            });
-            html += '</div>';
-            document.getElementById('view-container').innerHTML = html;
+        }
+        
+        function renderWallView(wallOwnerId, wallOwnerName, posts) {
+            let wallHtml = renderPostForm(wallOwnerId);
+            if (posts && posts.length > 0) {
+                wallHtml += posts.map(renderPostCard).join('');
+            } else {
+                wallHtml += `<div class="empty-state">This wall is empty. Be the first to post!</div>`;
+            }
+            mainContent.innerHTML = wallHtml;
         }
 
-        async function handlePostSubmit(event, wallOwnerId) {
-            event.preventDefault();
-            const content = event.target.elements.content.value;
-            if (!content.trim()) return;
+        async function loadMyWall() {
+            if (!currentUser) return;
+            currentView = 'my_wall';
+            viewingUserId = null;
+            appHeader.textContent = 'My Wall';
+            myWallTab.classList.add('active');
+            usersTab.classList.remove('active');
+            mainContent.innerHTML = '<div class="loading">Loading your wall...</div>';
+            tg.BackButton.hide();
             
             try {
-                await apiCall('/api/post', 'POST', { content: content, wall_owner_id: wallOwnerId });
-                event.target.elements.content.value = '';
-                showUserWall(wallOwnerId);
+                const wallData = await apiCall(`/api/wall/${currentUser.id}`);
+                renderWallView(currentUser.id, 'My', wallData.posts);
             } catch (error) {
-                tg.showAlert('Failed to post message: ' + error.message);
+                tg.showAlert(`Error loading your wall: ${error.message}`);
+                mainContent.innerHTML = `<div class="empty-state">Could not load your wall.</div>`;
             }
         }
         
-        async function showMyWall() {
+        async function loadUsersList() {
+            currentView = 'users_list';
+            viewingUserId = null;
+            appHeader.textContent = 'Users';
+            myWallTab.classList.remove('active');
+            usersTab.classList.add('active');
+            mainContent.innerHTML = '<div class="loading">Loading users...</div>';
+
+            tg.BackButton.show();
+            tg.BackButton.onClick(loadMyWall);
+
             try {
-                const data = await apiCall('/api/wall/me');
-                renderWall(data);
+                const users = await apiCall('/api/users');
+                if (users.length <= 1) { // Only current user exists
+                     mainContent.innerHTML = `<div class="empty-state">No other users have joined yet.</div>`;
+                } else {
+                    mainContent.innerHTML = users
+                        .filter(user => String(user.id) !== String(currentUser.id))
+                        .map(user => `
+                        <div class="user-list-item" onclick="loadUserWall('${user.id}')">
+                            <img src="${user.photo_url || ''}" alt="Avatar">
+                            <div class="user-info">
+                                <span>${user.first_name || ''} ${user.last_name || ''}</span>
+                                <p>${user.username ? `@${user.username}` : `ID: ${user.id}`}</p>
+                            </div>
+                        </div>
+                    `).join('');
+                }
             } catch (error) {
-                tg.showAlert('Could not load your wall: ' + error.message);
+                tg.showAlert(`Error loading users: ${error.message}`);
+                mainContent.innerHTML = `<div class="empty-state">Could not load users.</div>`;
             }
         }
 
-        async function showUserWall(userId) {
+        async function loadUserWall(userId) {
+            if (!userId) return;
+            currentView = 'user_wall';
+            viewingUserId = userId;
+            mainContent.innerHTML = '<div class="loading">Loading wall...</div>';
+            
+            tg.BackButton.show();
+            tg.BackButton.onClick(loadUsersList);
+
             try {
-                const data = await apiCall(`/api/wall/${userId}`);
-                renderWall(data);
+                const wallData = await apiCall(`/api/wall/${userId}`);
+                const wallOwner = wallData.owner;
+                const ownerName = wallOwner.first_name || `User ${wallOwner.id}`;
+                appHeader.textContent = `${ownerName}'s Wall`;
+                renderWallView(userId, ownerName, wallData.posts);
             } catch (error) {
-                tg.showAlert('Could not load user wall: ' + error.message);
+                tg.showAlert(`Error loading wall: ${error.message}`);
+                mainContent.innerHTML = `<div class="empty-state">Could not load this wall.</div>`;
             }
         }
         
-        async function showUserList() {
-             try {
-                const users = await apiCall('/api/users');
-                renderUserList(users);
+        async function submitPost(wallOwnerId) {
+            const postTextArea = document.getElementById('postText');
+            const text = postTextArea.value.trim();
+
+            if (!text) {
+                tg.showAlert('Please write something before posting.');
+                return;
+            }
+
+            tg.MainButton.showProgress();
+            tg.HapticFeedback.impactOccurred('light');
+
+            try {
+                const newPost = await apiCall(`/api/wall/${wallOwnerId}/posts`, 'POST', { text });
+                tg.HapticFeedback.notificationOccurred('success');
+                postTextArea.value = '';
+                
+                if (currentView === 'my_wall') {
+                    loadMyWall();
+                } else if (currentView === 'user_wall') {
+                    loadUserWall(wallOwnerId);
+                }
             } catch (error) {
-                tg.showAlert('Could not load user list: ' + error.message);
+                tg.HapticFeedback.notificationOccurred('error');
+                tg.showAlert(`Failed to post: ${error.message}`);
+            } finally {
+                tg.MainButton.hideProgress();
             }
         }
 
         async function init() {
             tg.ready();
-            tg.expand();
             applyThemeParams();
+            tg.expand();
+            tg.enableClosingConfirmation();
+
             tg.onEvent('themeChanged', applyThemeParams);
             
+            myWallTab.addEventListener('click', () => {
+                if (currentView !== 'my_wall') loadMyWall();
+            });
+            usersTab.addEventListener('click', () => {
+                if (currentView !== 'users_list') loadUsersList();
+            });
+
             try {
-                await apiCall('/api/auth', 'POST');
-                showMyWall();
+                const authResponse = await apiCall('/api/auth_user', 'POST', { init_data: tg.initData });
+                currentUser = authResponse.user;
+                if (!currentUser) throw new Error("Authentication failed, user data not received.");
+                
+                loadMyWall();
             } catch (error) {
-                document.getElementById('view-container').innerHTML = '<div class="container"><p>Authentication failed. Please reload the app.</p></div>';
+                console.error("Auth error:", error);
+                mainContent.innerHTML = `<div class="empty-state">Error: Could not authenticate with server. Please try reloading.</div>`;
+                tg.showAlert(error.message);
             }
         }
 
-        window.onload = init;
+        init();
     </script>
 </body>
 </html>
-"""
+'''
 
 @app.route('/')
-def index():
-    return render_template_string(INDEX_TEMPLATE)
+def main_app_view():
+    return render_template_string(WALL_TEMPLATE)
 
-@app.route('/api/auth', methods=['POST'])
+@app.route('/api/auth_user', methods=['POST'])
 def auth_user():
-    user_data = get_authenticated_user(request.headers)
-    if not user_data:
-        return jsonify({"error": "Invalid Telegram data"}), 403
+    auth_data_str = request.headers.get('X-Telegram-Auth') or request.json.get('init_data')
+    if not auth_data_str:
+        return jsonify({"error": "Authentication data not provided"}), 401
 
-    user_id_str = str(user_data['id'])
-    data = load_data()
+    is_valid, user_data_from_auth = verify_telegram_auth_data(auth_data_str, TELEGRAM_BOT_TOKEN)
 
-    if user_id_str not in data['users']:
-        data['users'][user_id_str] = {
-            'id': user_id_str,
-            'first_name': user_data.get('first_name'),
-            'last_name': user_data.get('last_name'),
-            'username': user_data.get('username'),
-            'chat_id': user_data.get('id'),
-            'first_seen': datetime.utcnow().isoformat()
-        }
-        data['walls'][user_id_str] = []
+    if not is_valid or not user_data_from_auth:
+        return jsonify({"error": "Invalid authentication data"}), 403
 
-    data['users'][user_id_str]['last_seen'] = datetime.utcnow().isoformat()
-    save_data(data)
+    data = load_data()
+    users = data.get('users', {})
+    user_id_str = str(user_data_from_auth.get('id'))
+
+    if user_id_str not in users:
+        users[user_id_str] = {
+            'id': user_data_from_auth.get('id'),
+            'first_name': user_data_from_auth.get('first_name'),
+            'last_name': user_data_from_auth.get('last_name'),
+            'username': user_data_from_auth.get('username'),
+            'photo_url': user_data_from_auth.get('photo_url'),
+            'first_seen': datetime.now().isoformat(),
+            'wall_posts': []
+        }
     
-    return jsonify(data['users'][user_id_str]), 200
-
-@app.route('/api/wall/me', methods=['GET'])
-def get_my_wall():
-    current_user = get_authenticated_user(request.headers)
-    if not current_user:
-        return jsonify({"error": "Authentication required"}), 401
+    users[user_id_str]['last_seen'] = datetime.now().isoformat()
+    if user_data_from_auth.get('photo_url'):
+        users[user_id_str]['photo_url'] = user_data_from_auth.get('photo_url')
     
-    user_id_str = str(current_user['id'])
-    data = load_data()
+    data['users'] = users
+    save_data(data)
     
-    wall_owner = data['users'].get(user_id_str)
-    posts = sorted(data['walls'].get(user_id_str, []), key=lambda p: p['timestamp'], reverse=True)
-
-    return jsonify({
-        "wall_owner": wall_owner,
-        "posts": posts,
-        "current_user": current_user
-    })
+    return jsonify({"message": "User authenticated", "user": users[user_id_str]}), 200
 
-@app.route('/api/wall/<user_id>', methods=['GET'])
-def get_user_wall(user_id):
-    current_user = get_authenticated_user(request.headers)
-    if not current_user:
-        return jsonify({"error": "Authentication required"}), 401
-
-    data = load_data()
-    if user_id not in data['users']:
-        return jsonify({"error": "User not found"}), 404
-
-    wall_owner = data['users'][user_id]
-    posts = sorted(data['walls'].get(user_id, []), key=lambda p: p['timestamp'], reverse=True)
-
-    return jsonify({
-        "wall_owner": wall_owner,
-        "posts": posts,
-        "current_user": current_user
-    })
+def get_authenticated_user(request_headers):
+    auth_data_str = request_headers.get('X-Telegram-Auth')
+    if not auth_data_str: return None
+    is_valid, user_data_from_auth = verify_telegram_auth_data(auth_data_str, TELEGRAM_BOT_TOKEN)
+    if is_valid and user_data_from_auth:
+        return user_data_from_auth
+    return None
 
 @app.route('/api/users', methods=['GET'])
 def get_users():
-    current_user = get_authenticated_user(request.headers)
-    if not current_user:
-        return jsonify({"error": "Authentication required"}), 401
+    user = get_authenticated_user(request.headers)
+    if not user: return jsonify({"error": "Authentication required"}), 401
     
     data = load_data()
-    users = list(data['users'].values())
-    return jsonify(users)
+    users_list = [
+        {
+            'id': u.get('id'), 
+            'first_name': u.get('first_name'), 
+            'last_name': u.get('last_name'), 
+            'username': u.get('username'),
+            'photo_url': u.get('photo_url')
+        } 
+        for u in data.get('users', {}).values()
+    ]
+    return jsonify(users_list), 200
+
+@app.route('/api/wall/<wall_owner_id>', methods=['GET'])
+def get_wall(wall_owner_id):
+    user = get_authenticated_user(request.headers)
+    if not user: return jsonify({"error": "Authentication required"}), 401
 
-@app.route('/api/post', methods=['POST'])
-def create_post():
-    author = get_authenticated_user(request.headers)
-    if not author:
-        return jsonify({"error": "Authentication required"}), 401
+    data = load_data()
+    owner_data = data.get('users', {}).get(wall_owner_id)
+
+    if not owner_data:
+        return jsonify({"error": "Wall owner not found"}), 404
+        
+    owner_info = {
+        'id': owner_data.get('id'),
+        'first_name': owner_data.get('first_name'),
+        'username': owner_data.get('username')
+    }
     
-    req_data = request.json
-    content = req_data.get('content')
-    wall_owner_id = str(req_data.get('wall_owner_id'))
+    posts = sorted(owner_data.get('wall_posts', []), key=lambda x: x['timestamp'], reverse=True)
+    
+    return jsonify({"owner": owner_info, "posts": posts}), 200
 
-    if not content or not wall_owner_id:
-        return jsonify({"error": "Missing content or wall owner ID"}), 400
+@app.route('/api/wall/<wall_owner_id>/posts', methods=['POST'])
+def create_post(wall_owner_id):
+    author = get_authenticated_user(request.headers)
+    if not author: return jsonify({"error": "Authentication required"}), 401
 
-    data = load_data()
+    req_data = request.json
+    post_text = req_data.get('text')
+    if not post_text:
+        return jsonify({"error": "Post text cannot be empty"}), 400
 
-    if wall_owner_id not in data['users']:
+    data = load_data()
+    wall_owner = data.get('users', {}).get(wall_owner_id)
+    if not wall_owner:
         return jsonify({"error": "Wall owner not found"}), 404
-        
-    author_id_str = str(author['id'])
-    author_info = data['users'].get(author_id_str, {})
-    author_name = author_info.get('first_name', 'Unknown User')
+
+    author_id_str = str(author.get('id'))
+    author_full_info = data.get('users', {}).get(author_id_str, {})
 
     new_post = {
-        "id": str(uuid.uuid4()),
-        "author_id": author_id_str,
-        "author_name": author_name,
-        "content": content,
-        "timestamp": datetime.utcnow().isoformat()
+        "post_id": str(uuid.uuid4()),
+        "author_id": author.get('id'),
+        "author_first_name": author.get('first_name'),
+        "author_username": author.get('username'),
+        "author_photo_url": author_full_info.get('photo_url'),
+        "text": post_text,
+        "timestamp": datetime.now().isoformat(),
     }
-
-    if wall_owner_id not in data['walls']:
-        data['walls'][wall_owner_id] = []
     
-    data['walls'][wall_owner_id].append(new_post)
+    if 'wall_posts' not in wall_owner:
+        wall_owner['wall_posts'] = []
+    
+    wall_owner['wall_posts'].append(new_post)
     save_data(data)
     
-    wall_owner = data['users'].get(wall_owner_id)
-    if wall_owner and str(wall_owner['id']) != author_id_str:
-        wall_owner_chat_id = wall_owner.get('chat_id')
-        notification_message = (
-            f"<b>New message on your wall!</b>\n"
-            f"From: {author_name}\n"
-            f"Message: {content}"
-        )
-        send_telegram_notification(wall_owner_chat_id, notification_message)
+    if str(wall_owner_id) != str(author.get('id')):
+        author_name = author.get('first_name', 'Someone')
+        author_link = f"@{author.get('username')}" if author.get('username') else f"A user (ID: {author.get('id')})"
+        message = f"<b>New post on your wall!</b>\n\n{author_name} ({author_link}) wrote:\n<i>{post_text}</i>"
+        send_telegram_notification(wall_owner_id, message)
 
     return jsonify(new_post), 201
 
 if __name__ == '__main__':
+    logging.info("Application starting up...")
+    initial_download_success = download_db_from_hf()
+    if initial_download_success:
+        logging.info("Initial data sync from Hugging Face was successful.")
+    else:
+        logging.warning("Initial data sync from Hugging Face failed. Starting with local or empty data.")
+    
+    load_data()
+
+    if HF_TOKEN_WRITE:
+        backup_thread = threading.Thread(target=periodic_backup, daemon=True)
+        backup_thread.start()
+        logging.info("Periodic backup thread started.")
+    else:
+        logging.warning("Periodic backup will NOT run (HF_TOKEN_WRITE not set).")
+
     port = int(os.environ.get('PORT', 7860))
-    app.run(debug=True, host='0.0.0.0', port=port)
+    logging.info(f"Starting Flask app on host 0.0.0.0 and port {port}")
+    app.run(debug=False, host='0.0.0.0', port=port)