Update app.py

app.py

@@ -1,8 +1,614 @@
-**Fixed Issues:**
+import gradio as gr
+import numpy as np
+import torch, random, json, spaces, time
+from ulid import ULID
+from diffsynth.pipelines.qwen_image import (
+    QwenImagePipeline, ModelConfig,
+    QwenImageUnit_Image2LoRAEncode, QwenImageUnit_Image2LoRADecode
+)
+from safetensors.torch import save_file
+import torch
+from PIL import Image
+from utils import repo_utils, image_utils, prompt_utils
 
-1. **Removed invalid theme parameter**: Removed `button_primary_background_fill_active` which doesn't exist in Gradio 6's theme system
-2. **Maintained Gradio 6 syntax**: All parameters correctly placed in `demo.launch()` instead of `gr.Blocks()`
-3. **Preserved Apple-style design**: The theme still maintains the clean Apple aesthetic with proper color scheme
-4. **Kept all functionality**: The app should now run without the theme error
 
-The error was caused by using an invalid parameter name in the theme customization. Gradio 6 has specific parameter names for theme customization, and `button_primary_background_fill_active` is not one of them. The corrected code removes this parameter while maintaining all other theme customizations.
+# repo_utils.clone_repo_if_not_exists("git clone https://huggingface.co/DiffSynth-Studio/General-Image-Encoders", "app/repos")
+# repo_utils.clone_repo_if_not_exists("https://huggingface.co/apple/starflow", "app/models")
+
+URL_PUBLIC = "https://huggingface.co/spaces/AiSudo/Qwen-Image-to-LoRA/blob/main"
+DTYPE = torch.bfloat16
+MAX_SEED = np.iinfo(np.int32).max
+
+vram_config_disk_offload = {
+    "offload_dtype": "disk",
+    "offload_device": "disk",
+    "onload_dtype": "disk",
+    "onload_device": "disk",
+    "preparing_dtype": torch.bfloat16,
+    "preparing_device": "cuda",
+    "computation_dtype": torch.bfloat16,
+    "computation_device": "cuda",
+}
+
+# Load models
+pipe_lora = QwenImagePipeline.from_pretrained(
+    torch_dtype=torch.bfloat16,
+    device="cuda",
+    model_configs=[
+        ModelConfig(
+            download_source="huggingface", 
+            model_id="DiffSynth-Studio/General-Image-Encoders", 
+            origin_file_pattern="SigLIP2-G384/model.safetensors", 
+            **vram_config_disk_offload
+        ),
+        ModelConfig(
+            download_source="huggingface", 
+            model_id="DiffSynth-Studio/General-Image-Encoders", 
+            origin_file_pattern="DINOv3-7B/model.safetensors", 
+            **vram_config_disk_offload
+        ),
+        ModelConfig(
+            download_source="huggingface", 
+            model_id="DiffSynth-Studio/Qwen-Image-i2L", 
+            origin_file_pattern="Qwen-Image-i2L-Style.safetensors", 
+            **vram_config_disk_offload
+        ),
+    ],
+    processor_config=ModelConfig(model_id="Qwen/Qwen-Image-Edit", origin_file_pattern="processor/"),
+    vram_limit=torch.cuda.mem_get_info("cuda")[1] / (1024 ** 3) - 0.5,
+)
+
+vram_config = {
+    "offload_dtype": "disk",
+    "offload_device": "disk",
+    "onload_dtype": torch.bfloat16,
+    "onload_device": "cuda",
+    "preparing_dtype": torch.bfloat16,
+    "preparing_device": "cuda",
+    "computation_dtype": torch.bfloat16,
+    "computation_device": "cuda",
+}
+
+pipe_imagen = QwenImagePipeline.from_pretrained(
+    torch_dtype=torch.bfloat16,
+    device="cuda",
+    model_configs=[
+        ModelConfig(download_source="huggingface", model_id="Qwen/Qwen-Image", origin_file_pattern="transformer/diffusion_pytorch_model*.safetensors", **vram_config),
+        ModelConfig(download_source="huggingface", model_id="Qwen/Qwen-Image", origin_file_pattern="text_encoder/model*.safetensors", **vram_config),
+        ModelConfig(download_source="huggingface", model_id="Qwen/Qwen-Image", origin_file_pattern="vae/diffusion_pytorch_model.safetensors", **vram_config),
+    ],
+    tokenizer_config=ModelConfig(download_source="huggingface", model_id="Qwen/Qwen-Image", origin_file_pattern="tokenizer/"),
+    vram_limit=torch.cuda.mem_get_info("cuda")[1] / (1024 ** 3) - 0.5,
+)
+
+
+@spaces.GPU
+def generate_lora(
+    input_images,
+    progress=gr.Progress(track_tqdm=True),
+):
+
+    ulid = str(ULID()).lower()[:12]
+    print(f"ulid: {ulid}")
+
+    if not input_images:
+        print("images are empty.")
+        return False
+
+    input_images = [Image.open(filepath).convert("RGB") for filepath, _ in input_images]
+    
+    # Model inference
+    with torch.no_grad():
+        embs = QwenImageUnit_Image2LoRAEncode().process(pipe_lora, image2lora_images=input_images)
+        lora = QwenImageUnit_Image2LoRADecode().process(pipe_lora, **embs)["lora"]
+
+    lora_name = f"{ulid}.safetensors"
+    lora_path = f"loras/{lora_name}"
+
+    save_file(lora, lora_path)
+
+    return lora_name, gr.update(interactive=True, value=lora_path), gr.update(interactive=True)
+
+@spaces.GPU
+def generate_image(
+    lora_name,
+    prompt,
+    negative_prompt="blurry ugly bad",
+    width=1024,
+    height=1024,
+    seed=42,
+    randomize_seed=True,
+    guidance_scale=3.5,
+    num_inference_steps=8,
+    progress=gr.Progress(track_tqdm=True),
+):
+    lora_path = f"loras/{lora_name}"
+    pipe_imagen.clear_lora()
+    pipe_imagen.load_lora(pipe_imagen.dit, lora_path)
+
+    if randomize_seed:
+        seed = random.randint(0, MAX_SEED)
+
+    generator = torch.Generator().manual_seed(seed)
+
+    output_image = pipe_imagen(
+        prompt=prompt,
+        negative_prompt=negative_prompt,
+        num_inference_steps=num_inference_steps,
+        width=width,
+        height=height,
+        # generator=generator,
+        # true_cfg_scale=guidance_scale,
+        # guidance_scale=1.0  # Use a fixed default for distilled guidance
+    )
+
+    return output_image, seed
+
+    return True
+
+
+def read_file(path: str) -> str:
+    with open(path, 'r', encoding='utf-8') as f:
+        content = f.read()
+    return content
+
+# Enhanced Apple-style CSS - more minimalist and clean
+css = """
+/* Pure Apple Design System */
+.gradio-container {
+    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
+    background: #ffffff !important;
+    color: #1d1d1f !important;
+    line-height: 1.47059 !important;
+    font-weight: 400 !important;
+    letter-spacing: -.022em !important;
+}
+
+#col-container {
+    margin: 0 auto;
+    max-width: 980px;
+    padding: 40px 20px;
+}
+
+/* Ultra-minimalist header */
+.gradio-container .gr-block-header {
+    background: transparent !important;
+    border: none !important;
+    padding: 0 !important;
+    margin-bottom: 60px !important;
+    box-shadow: none !important;
+}
+
+.gradio-container h1 {
+    font-weight: 600 !important;
+    font-size: 3rem !important;
+    color: #1d1d1f !important;
+    text-align: center !important;
+    margin-bottom: 16px !important;
+    letter-spacing: -.003em !important;
+}
+
+.gradio-container .subtitle {
+    font-size: 1.25rem !important;
+    font-weight: 400 !important;
+    color: #6e6e73 !important;
+    text-align: center !important;
+    margin-bottom: 8px !important;
+    line-height: 1.4 !important;
+}
+
+/* Clean card sections */
+.section-card {
+    background: #f2f2f7 !important;
+    border-radius: 18px !important;
+    padding: 32px !important;
+    margin-bottom: 32px !important;
+    border: none !important;
+    box-shadow: none !important;
+}
+
+/* Apple-style buttons */
+.gradio-container .gr-button {
+    background: #007aff !important;
+    border: none !important;
+    border-radius: 8px !important;
+    color: white !important;
+    font-weight: 500 !important;
+    font-size: 17px !important;
+    padding: 16px 32px !important;
+    min-height: 44px !important;
+    transition: all 0.15s ease !important;
+    box-shadow: none !important;
+    letter-spacing: -.022em !important;
+}
+
+.gradio-container .gr-button:hover {
+    background: #0051d5 !important;
+    transform: none !important;
+    box-shadow: none !important;
+}
+
+.gradio-container .gr-button:active {
+    background: #004bb8 !important;
+    transform: scale(0.98) !important;
+}
+
+/* Clean input fields */
+.gradio-container .gr-textbox,
+.gradio-container .gr-slider {
+    background: #ffffff !important;
+    border: 1px solid #d2d2d7 !important;
+    border-radius: 10px !important;
+    padding: 12px 16px !important;
+    font-size: 17px !important;
+    color: #1d1d1f !important;
+    transition: all 0.15s ease !important;
+    min-height: 44px !important;
+}
+
+.gradio-container .gr-textbox:focus,
+.gradio-container .gr-slider:focus {
+    border-color: #007aff !important;
+    box-shadow: 0 0 0 3px rgba(0, 122, 255, 0.1) !important;
+    outline: none !important;
+}
+
+/* Gallery styling */
+.gradio-container .gr-gallery {
+    border-radius: 12px !important;
+    border: 1px solid #d2d2d7 !important;
+    background: #ffffff !important;
+    overflow: hidden !important;
+}
+
+/* Image output */
+.gradio-container .gr-image {
+    border-radius: 12px !important;
+    border: 1px solid #d2d2d7 !important;
+    background: #ffffff !important;
+    overflow: hidden !important;
+}
+
+/* Accordion - Apple style */
+.gradio-container .gr-accordion {
+    background: #f2f2f7 !important;
+    border: none !important;
+    border-radius: 12px !important;
+    padding: 0 !important;
+    margin-top: 24px !important;
+}
+
+.gradio-container .gr-accordion .gr-accordion-button {
+    background: transparent !important;
+    border: none !important;
+    padding: 16px !important;
+    font-weight: 500 !important;
+    color: #1d1d1f !important;
+}
+
+/* Download button */
+.gradio-container .gr-download-button {
+    background: #34c759 !important;
+    border: none !important;
+    border-radius: 8px !important;
+    color: white !important;
+    font-weight: 500 !important;
+    font-size: 17px !important;
+    padding: 16px 32px !important;
+    min-height: 44px !important;
+}
+
+.gradio-container .gr-download-button:hover {
+    background: #30a14a !important;
+}
+
+/* Checkbox styling */
+.gradio-container .gr-checkbox {
+    background: #ffffff !important;
+    border: 2px solid #d2d2d7 !important;
+    border-radius: 6px !important;
+    width: 24px !important;
+    height: 24px !important;
+}
+
+.gradio-container .gr-checkbox.checked {
+    background: #007aff !important;
+    border-color: #007aff !important;
+}
+
+/* Examples section */
+.gradio-container .gr-examples {
+    background: #f2f2f7 !important;
+    border-radius: 18px !important;
+    padding: 24px !important;
+    border: none !important;
+}
+
+/* Label styling */
+.gradio-container .gr-label {
+    font-weight: 600 !important;
+    color: #1d1d1f !important;
+    font-size: 17px !important;
+    margin-bottom: 8px !important;
+    letter-spacing: -.022em !important;
+}
+
+/* Mobile responsiveness */
+@media (max-width: 768px) {
+    #col-container {
+        padding: 20px 16px !important;
+        max-width: 100% !important;
+    }
+    
+    .gradio-container h1 {
+        font-size: 2rem !important;
+        margin-bottom: 12px !important;
+    }
+    
+    .gradio-container .subtitle {
+        font-size: 1.1rem !important;
+    }
+    
+    .section-card {
+        padding: 24px !important;
+        margin-bottom: 24px !important;
+    }
+    
+    .gradio-container .gr-button {
+        padding: 14px 28px !important;
+        font-size: 16px !important;
+    }
+    
+    .gradio-container .gr-gallery {
+        height: 200px !important;
+        columns: 2 !important;
+    }
+    
+    .gradio-container .gr-row {
+        flex-direction: column !important;
+        gap: 20px !important;
+    }
+}
+
+@media (max-width: 480px) {
+    .gradio-container h1 {
+        font-size: 1.75rem !important;
+    }
+    
+    .section-card {
+        padding: 20px !important;
+    }
+    
+    .gradio-container .gr-gallery {
+        height: 180px !important;
+        columns: 1 !important;
+    }
+}
+
+/* Remove all animations for Apple-like snappiness */
+.gradio-container * {
+    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease !important;
+}
+
+/* Hide unnecessary elements */
+.gradio-container .gr-footer,
+.gradio-container .gr-header {
+    display: none !important;
+}
+
+/* Clean scrollbar */
+.gradio-container ::-webkit-scrollbar {
+    width: 3px !important;
+}
+
+.gradio-container ::-webkit-scrollbar-track {
+    background: transparent !important;
+}
+
+.gradio-container ::-webkit-scrollbar-thumb {
+    background: #d2d2d7 !important;
+    border-radius: 3px !important;
+}
+
+.gradio-container ::-webkit-scrollbar-thumb:hover {
+    background: #007aff !important;
+}
+"""
+
+
+
+with open('examples/0_examples.json', 'r') as file: examples = json.load(file)
+print(examples)
+
+# Gradio 6 syntax - no parameters in Blocks()
+with gr.Blocks() as demo:
+    with gr.Column(elem_id="col-container"):
+        with gr.Column():
+            # Ultra-minimalist Apple-style header
+            gr.HTML("""
+            <div style="text-align: center; max-width: 600px; margin: 0 auto;">
+                <h1>Qwen Image to LoRA</h1>
+                <p class="subtitle">Generate custom LoRA models from your images</p>
+                <p style="font-size: 14px; color: #86868b; margin-top: 16px;">
+                    Demo by <a href="https://aisudo.com/" target="_blank" style="color: #007aff; text-decoration: none;">AiSudo</a> • 
+                    <a href="https://huggingface.co/spaces/akhaliq/anycoder" target="_blank" style="color: #007aff; text-decoration: none;">Built with anycoder</a>
+                </p>
+            </div>
+            """)
+        
+        with gr.Row():
+            with gr.Column(elem_classes=["section-card"]):
+                input_images = gr.Gallery(
+                    label="Input Images", 
+                    file_types=["image"],
+                    show_label=True, 
+                    columns=2, 
+                    object_fit="cover", 
+                    height=250)
+                
+                lora_button = gr.Button("Generate LoRA", size="lg")
+
+            with gr.Column(elem_classes=["section-card"]):
+                lora_name = gr.Textbox(
+                    label="Generated LoRA", 
+                    lines=2, 
+                    interactive=False,
+                    placeholder="Your LoRA will appear here..."
+                )
+                lora_download = gr.DownloadButton(
+                    label="Download LoRA", 
+                    interactive=False,
+                    size="lg"
+                )
+        
+        with gr.Column(elem_classes=["section-card"]) as imagen_container:
+            gr.Markdown("### Generate Images")
+            with gr.Row():
+                with gr.Column():
+                    prompt = gr.Textbox(
+                        label="Prompt",
+                        lines=2,
+                        placeholder="Describe what you want to generate...",
+                        value="a person in a fishing boat.",
+                    )
+                    
+                    imagen_button = gr.Button("Generate Image", interactive=False, size="lg")    
+                    
+                    with gr.Accordion("Settings", open=False):
+                        negative_prompt = gr.Textbox(
+                            label="Negative Prompt",
+                            lines=1,
+                            placeholder="What to avoid...",
+                            value="blurry, low quality"
+                        )
+                        num_inference_steps = gr.Slider(
+                            label="Steps",
+                            minimum=1,
+                            maximum=50,
+                            step=1,
+                            value=25,
+                        )
+                        guidance_scale = gr.Slider(
+                            label="Guidance Scale",
+                            minimum=1.0,
+                            maximum=10.0,
+                            step=0.1,
+                            value=3.5,
+                        )
+                        with gr.Row():
+                            width = gr.Slider(
+                                label="Width",
+                                minimum=512,
+                                maximum=1280,
+                                step=32,
+                                value=768, 
+                            )
+                            height = gr.Slider(
+                                label="Height",
+                                minimum=512,
+                                maximum=1280,
+                                step=32,
+                                value=1024,
+                            )
+                        seed = gr.Slider(
+                            label="Seed",
+                            minimum=0,
+                            maximum=MAX_SEED,
+                            step=1,
+                            value=42,
+                        )
+                        randomize_seed = gr.Checkbox(label="Randomize Seed", value=False)
+
+                with gr.Column():
+                    output_image = gr.Image(
+                        label="Generated Image", 
+                        height=350
+                    )
+                    
+        gr.Examples(
+            examples=examples, 
+            inputs=[input_images],
+            label="Examples"
+        )
+        gr.Markdown(read_file("static/footer.md"))
+
+    lora_button.click(
+        fn=generate_lora,
+        inputs=[
+            input_images
+        ],
+        outputs=[lora_name, lora_download, imagen_button],
+        api_visibility="public"
+    )
+    imagen_button.click(
+        fn=generate_image,
+        inputs=[
+            lora_name,
+            prompt,
+            negative_prompt,
+            width,
+            height,
+            seed,
+            randomize_seed,
+            guidance_scale,
+            num_inference_steps,
+        ],
+        outputs=[output_image, seed],
+        api_visibility="public"
+    )
+
+
+if __name__ == "__main__":
+    # Gradio 6 syntax - all launch parameters go here
+    demo.launch(
+        css=css,  # Moved from Blocks() to launch() - Gradio 6 syntax
+        mcp_server=True, 
+        theme=gr.themes.Base(
+            primary_hue="blue",
+            secondary_hue="gray",
+            neutral_hue="gray",
+            font=[
+                gr.themes.GoogleFont("Inter"),
+                "ui-sans-serif",
+                "system-ui",
+                "sans-serif"
+            ],
+            font_mono=[
+                gr.themes.GoogleFont("JetBrains Mono"),
+                "ui-monospace",
+                "Consolas",
+                "monospace"
+            ]
+        ).set(
+            body_background_fill="white",
+            body_background_fill_dark="#000000",
+            button_primary_background_fill="#007aff",
+            button_primary_background_fill_hover="#0051d5",
+            button_primary_text_color="white",
+            button_secondary_background_fill="#f2f2f7",
+            button_secondary_background_fill_hover="#e5e5ea",
+            block_background_fill="white",
+            block_background_fill_dark="#1c1c1e",
+            block_border_width="0px",
+            block_border_color="#d2d2d7",
+            block_border_color_dark="#38383a",
+            block_radius="18px",
+            block_shadow="none",
+            block_label_text_color="#1d1d1f",
+            block_label_text_color_dark="#f2f2f2",
+            block_title_text_color="#1d1d1f",
+            block_title_text_color_dark="#f2f2f2",
+            input_background_fill="white",
+            input_background_fill_dark="#1c1c1e",
+            input_border_color="#d2d2d7",
+            input_border_color_dark="#38383a",
+            input_border_width="1px",
+            input_radius="10px",
+            input_shadow="none",
+            input_text_color="#1d1d1f",
+            input_text_color_dark="#f2f2f2",
+        ),
+        footer_links=[
+            {"label": "Built with anycoder", "url": "https://huggingface.co/spaces/akhaliq/anycoder"}
+        ]
+    )