Update app.py

app.py

@@ -1,3 +1,31 @@
+import gradio as gr
+from PIL import Image, ImageDraw, ImageFont
+import base64
+import io
+import json
+import logging
+import os
+import requests
+import struct
+import numpy as np
+from cryptography.hazmat.primitives import serialization
+from cryptography.hazmat.primitives.asymmetric import rsa, padding
+from cryptography.hazmat.primitives.ciphers.aead import AESGCM
+from cryptography.hazmat.primitives import hashes
+
+logging.basicConfig(level=logging.INFO, format='%(asctime)s - %(name)s - %(levelname)s - %(message)s')
+logger = logging.getLogger(__name__)
+
+CREATOR_ENDPOINTS_JSON_URL = "https://huggingface.co/spaces/broadfield-dev/KeyLock-Auth-Creator/raw/main/endpoints.json"
+BASE_HF_URL = "https://huggingface.co/spaces/"
+CREATOR_SPACE_ID = "broadfield-dev/KeyLock-Auth-Creator"
+SERVER_SPACE_ID = "broadfield-dev/KeyLock-Auth-Server"
+CREATOR_URL = f"{BASE_HF_URL}{CREATOR_SPACE_ID}"
+SERVER_URL = f"{BASE_HF_URL}{SERVER_SPACE_ID}"
+CREATOR_APP_PY_URL = f"{CREATOR_URL}/raw/main/app.py"
+SERVER_APP_PY_URL = f"{SERVER_URL}/raw/main/app.py"
+
+
 def generate_rsa_keys():
     private_key = rsa.generate_private_key(public_exponent=65537, key_size=2048)
     private_pem = private_key.private_bytes(encoding=serialization.Encoding.PEM, format=serialization.PrivateFormat.PKCS8, encryption_algorithm=serialization.NoEncryption()).decode('utf-8')
@@ -93,4 +121,76 @@ def send_keylock_wrapper(service_name: str, image: Image.Image, available_endpoi
 def refresh_and_update_all():
     for dropdown_update, status_update, state_update in get_server_list():
         pass
-    return dropdown_update, dropdown_update, status_update, state_update
+    return dropdown_update, dropdown_update, status_update, state_update
+
+theme = gr.themes.Base(
+    primary_hue=gr.themes.colors.blue, secondary_hue=gr.themes.colors.sky, neutral_hue=gr.themes.colors.slate,
+    font=(gr.themes.GoogleFont("Inter"), "system-ui", "sans-serif"),
+).set(
+    body_background_fill="#F1F5F9", panel_background_fill="white", block_background_fill="white",
+    block_border_width="1px", block_shadow="*shadow_drop_lg",
+    button_primary_background_fill="*primary_600", button_primary_background_fill_hover="*primary_700",
+)
+
+with gr.Blocks(theme=theme, title="KeyLock Operations Dashboard") as demo:
+    endpoints_state = gr.State([])
+
+    gr.Markdown("# 🔑 KeyLock Operations Dashboard")
+    gr.Markdown("A centralized dashboard to manage and demonstrate the entire KeyLock ecosystem. Key/Image creation is performed locally, while decryption is handled by a **live, remote API call** to a secure server.")
+
+    with gr.Tabs() as tabs:
+        with gr.TabItem("① Create KeyLock", id=0):
+            gr.Markdown("## Step 1: Create an Encrypted Authentication Image (Local)")
+            gr.Markdown(f"This tool acts as the **Auth Creator**. It fetches a list of available servers from a public [configuration file]({CREATOR_ENDPOINTS_JSON_URL}), then uses the selected server's public key to encrypt your data into a PNG. **This entire creation process happens locally.**")
+            with gr.Row(variant="panel"):
+                with gr.Column(scale=2):
+                    with gr.Row():
+                        creator_service_dropdown = gr.Dropdown(label="Target Server", interactive=True, info="Select the API server to encrypt data for.")
+                        refresh_button = gr.Button("🔄", scale=0, size="sm", tooltip="Refresh Server List from Config File")
+                    creator_secret_input = gr.Textbox(lines=8, label="Secret Data to Encrypt", placeholder="API_KEY: sk-123...\nUSER: demo-user")
+                    creator_button = gr.Button("✨ Create Auth Image", variant="primary")
+                with gr.Column(scale=1):
+                    creator_status = gr.Textbox(label="Status", interactive=False, lines=2)
+                    creator_image_output = gr.Image(label="Generated Encrypted Image", type="pil", show_download_button=True, format="png")
+
+        with gr.TabItem("② Send KeyLock", id=1):
+            gr.Markdown("## Step 2: Decrypt via Live API Call")
+            gr.Markdown("This tool acts as the **Client**. It sends the encrypted image you created in Step 1 to the live, remote **Decoder Server** you select from the same configuration list. The server uses its securely stored private key to decrypt the data and sends the result back.")
+            with gr.Row(variant="panel"):
+                with gr.Column(scale=1):
+                    gr.Markdown("### Configuration")
+                    send_service_dropdown = gr.Dropdown(label="Target Server", interactive=True, info="Select the API server to send the image to.")
+                    gr.Markdown("### Image to Send")
+                    client_image_input = gr.Image(type="pil", label="Upload or Drag Encrypted Image Here", sources=["upload", "clipboard"])
+                    client_button = gr.Button("🔓 Decrypt via Remote Server", variant="primary")
+                with gr.Column(scale=1):
+                    gr.Markdown("### Response from Server")
+                    client_status = gr.Textbox(label="Status", interactive=False, lines=2)
+                    client_json_output = gr.JSON(label="Decrypted Data")
+        
+        with gr.TabItem("ℹ️ Info & Key Generation", id=2):
+            gr.Markdown("## Ecosystem Architecture")
+            gr.Markdown(f"This dashboard uses a public [configuration file]({CREATOR_ENDPOINTS_JSON_URL}) to dynamically discover and interact with live services. It demonstrates a secure, decoupled workflow.")
+            with gr.Row():
+                 with gr.Column():
+                    gr.Markdown(f"### 🏭 Auth Creator Service\n- **Space:** [{CREATOR_SPACE_ID}]({CREATOR_URL})\n- **Role:** Provides an API to encrypt data for various targets defined in its `endpoints.json` file.\n- **Source Code:** [app.py]({CREATOR_APP_PY_URL})")
+                 with gr.Column():
+                    gr.Markdown(f"### 📡 Decoder Server\n- **Space:** [{SERVER_SPACE_ID}]({SERVER_URL})\n- **Role:** The trusted authority. It holds a secret private key and provides a secure API to decrypt images.\n- **Source Code:** [app.py]({SERVER_APP_PY_URL})")
+            
+            with gr.Accordion("🔑 RSA Key Pair Generator", open=False):
+                gr.Markdown("Create a new key pair. In a real scenario, you would add the **Public Key** and the server's **API Endpoint URL** to the `endpoints.json` configuration file, and set the **Private Key** as a secret variable in the corresponding server space.")
+                with gr.Row():
+                    with gr.Column():
+                        output_public_key = gr.Textbox(lines=10, label="Generated Public Key", interactive=False, show_copy_button=True)
+                    with gr.Column():
+                        output_private_key = gr.Textbox(lines=10, label="Generated Private Key", interactive=False, show_copy_button=True)
+                gen_keys_button = gr.Button("⚙️ Generate New 2048-bit Key Pair", variant="secondary")
+
+    gen_keys_button.click(fn=generate_rsa_keys, inputs=None, outputs=[output_private_key, output_public_key])
+    refresh_button.click(fn=refresh_and_update_all, outputs=[creator_service_dropdown, send_service_dropdown, creator_status, endpoints_state])
+    demo.load(fn=refresh_and_update_all, outputs=[creator_service_dropdown, send_service_dropdown, creator_status, endpoints_state])
+    creator_button.click(fn=create_keylock_wrapper, inputs=[creator_service_dropdown, creator_secret_input, endpoints_state], outputs=[creator_image_output, creator_status])
+    client_button.click(fn=send_keylock_wrapper, inputs=[send_service_dropdown, client_image_input, endpoints_state], outputs=[client_json_output, client_status])
+
+if __name__ == "__main__":
+    demo.launch()