Preview-vs-save flow, interactive recreate checkbox, top status message

app.py

@@ -119,7 +119,7 @@ def lookup_participant(username: str):
 def on_load(profile: gr.OAuthProfile | None):
     """Runs on page load. Drives which panel is shown, pre-fills the form, and — if the user
     already generated a certificate — shows it and reveals the 'Recreate' control."""
-    hidden_cb = gr.update(visible=False, value=False)
+    hidden_cb = gr.update(visible=False, value=False, interactive=True)
 
     if profile is None:
         return (
@@ -130,6 +130,7 @@ def on_load(profile: gr.OAuthProfile | None):
             gr.update(value="", visible=True),  # project
             "",                                  # data_status
             None,                                # certificate_image
+            None,                                # certificate_file
             hidden_cb,                           # recreate_checkbox
             "",                                  # generation_status
         )
@@ -144,7 +145,7 @@ def on_load(profile: gr.OAuthProfile | None):
             gr.update(visible=False),
             gr.update(visible=True),
             "", gr.update(value="", visible=True), "",
-            None, hidden_cb, "",
+            None, None, hidden_cb, "",
         )
 
     name_value = full_name or profile_name
@@ -158,7 +159,7 @@ def on_load(profile: gr.OAuthProfile | None):
         )
         project_update = gr.update(value="", visible=True)
 
-    # Already generated a certificate before? Fetch and show it.
+    # Already generated a certificate before? Fetch and show it, with guidance up top.
     existing = None
     try:
         existing = get_certificate_image_path(username)
@@ -167,21 +168,25 @@ def on_load(profile: gr.OAuthProfile | None):
 
     if existing:
         gen_status = (
-            "📜 You've **already generated** a certificate (shown below). To change it, edit your "
-            "details, tick **Recreate certificate**, and click generate again — this **replaces** "
-            "your existing one (one certificate per participant)."
+            "### 📜 You already have a certificate\n"
+            "It's shown below — **download it** and use it however you like (LinkedIn, socials, etc.).\n\n"
+            "- Want a version with **different details**? Edit your name/project and click "
+            "**Generate my certificate** — that's just a fresh preview to download and **won't change** "
+            "the copy saved in our records.\n"
+            "- Want to **replace** your saved copy? Tick **Recreate certificate** below, then generate. "
+            "There's one certificate per participant, so the new one overwrites the old."
         )
-        cb = gr.update(visible=True, value=False)
+        cb = gr.update(visible=True, value=False, interactive=True)
     else:
         gen_status = ""
-        cb = gr.update(visible=False, value=False)
+        cb = gr.update(visible=False, value=False, interactive=True)
 
     return (
         f"Signed in as **{username}**.",
         gr.update(visible=True),
         gr.update(visible=False),
         name_value, project_update, status,
-        existing, cb, gen_status,
+        existing, existing, cb, gen_status,
     )
 
 
@@ -202,8 +207,9 @@ def generate_linkedin_url(participant_name, project_name):
 # ----------------------------------------------------------------------------- generate
 def create_certificate(participant_name, project_name, recreate,
                        oauth_token: gr.OAuthToken | None, profile: gr.OAuthProfile | None):
+    hide_cb = gr.update(visible=False, interactive=True)
     if profile is None:
-        return None, None, "❌ Please sign in first to generate your certificate.", "", gr.update(visible=False)
+        return None, None, "❌ Please sign in first to generate your certificate.", "", hide_cb
 
     username = profile.username
     state, _, _ = lookup_participant(username)
@@ -211,36 +217,26 @@ def create_certificate(participant_name, project_name, recreate,
         return None, None, (
             "❌ We couldn't find you in the Build Small Hackathon records, so we can't issue a "
             f"certificate. Please reach out on [Discord]({DISCORD_INVITE}) or email {CONTACT_EMAIL}."
-        ), "", gr.update(visible=False)
+        ), "", hide_cb
     if state == "error":
-        return None, None, "❌ Couldn't reach the hackathon records right now. Please try again shortly.", "", gr.update(visible=False)
+        return None, None, "❌ Couldn't reach the hackathon records right now. Please try again shortly.", "", hide_cb
 
-    # If they already have one and didn't ask to recreate, show it instead of duplicating.
+    # Does a saved certificate already exist for this user?
     existing_path = None
     try:
         existing_path = get_certificate_image_path(username)
     except Exception:
         existing_path = None
 
-    if existing_path and not recreate:
-        return (
-            existing_path, existing_path,
-            "ℹ️ You already have a certificate (shown above). To change it, edit your details, tick "
-            "**Recreate certificate**, and click generate again to replace it.",
-            generate_linkedin_url(participant_name or username, project_name or ""),
-            gr.update(visible=True, value=False),
-        )
-
+    # Always render a fresh certificate from the CURRENT field values.
     participant_name = (participant_name or "").strip() or (profile.name or username)
     project_name = (project_name or "").strip()
-
     project_section = (
         PROJECT_SECTION_WITH_NAME.replace("{project_name}", project_name)
         if project_name else PROJECT_SECTION_EMPTY
     )
     html = CERTIFICATE_HTML_TEMPLATE.replace("{participant_name}", participant_name)
     html = html.replace("{project_section}", project_section)
-
     with tempfile.NamedTemporaryFile(mode="w", delete=False, suffix=".html", encoding="utf-8") as f:
         f.write(html)
         html_path = f.name
@@ -249,22 +245,41 @@ def create_certificate(participant_name, project_name, recreate,
         client = get_gradio_client()
         image_path = client.predict(html_file=handle_file(html_path), api_name="/predict")[0]
     except Exception as e:
-        return None, None, f"❌ Error generating certificate image: {e}", "", gr.update(visible=bool(existing_path))
-
-    # Save (or replace) in the private gallery dataset
-    try:
-        cert_image = Image.open(image_path)
-        ok, msg = upload_user_certificate(cert_image, username, overwrite=bool(existing_path))
-        if existing_path:
-            save_note = "🔁 This replaces your previous certificate in our records."
-        else:
-            save_note = msg if ok else f"(generated — gallery note: {msg})"
-    except Exception as e:
-        save_note = f"(generated — gallery save skipped: {e})"
+        return None, None, f"❌ Error generating certificate image: {e}", "", gr.update(visible=bool(existing_path), interactive=True)
 
+    show_cb = gr.update(visible=True, value=False, interactive=True)
     linkedin_url = generate_linkedin_url(participant_name, project_name)
-    status = f"🎉 Your certificate is ready, {participant_name}! {save_note}"
-    return image_path, image_path, status, linkedin_url, gr.update(visible=True, value=False)
+
+    # Decide what happens to the SAVED copy in the dataset.
+    if existing_path is None:
+        # First time — save it.
+        try:
+            ok, msg = upload_user_certificate(Image.open(image_path), username, overwrite=False)
+            note = ("🎉 Your certificate is ready and has been **saved to our records**. Download it "
+                    "below — you can edit your details and regenerate anytime.") if ok else \
+                   f"⚠️ Certificate generated, but saving hit an issue: {msg}"
+        except Exception as e:
+            note = f"⚠️ Certificate generated, but saving was skipped: {e}"
+        return image_path, image_path, note, linkedin_url, show_cb
+
+    if recreate:
+        # Replace the saved copy.
+        try:
+            ok, msg = upload_user_certificate(Image.open(image_path), username, overwrite=True)
+            note = ("🔁 **Done — your new certificate has replaced the previous one saved in our "
+                    "records.** Download the updated copy below.") if ok else \
+                   f"⚠️ Generated, but replacing the saved copy hit an issue: {msg}"
+        except Exception as e:
+            note = f"⚠️ Generated, but replacing the saved copy was skipped: {e}"
+        return image_path, image_path, note, linkedin_url, show_cb
+
+    # Existing copy + recreate NOT ticked → fresh preview only, dataset untouched.
+    note = (
+        "👀 **Here's a new preview with your latest details** — download it below. "
+        "Your **saved** certificate in our records is **unchanged**. "
+        "To make this version the official one, tick **Recreate certificate** above and generate again."
+    )
+    return image_path, image_path, note, linkedin_url, show_cb
 
 
 def render_linkedin_button(url):
@@ -352,6 +367,8 @@ with gr.Blocks(title="Build Small — Certificate Generator") as demo:
     with gr.Column(visible=False) as main_interface:
         gr.HTML('<div class="bs-section">Your details</div>')
         data_status = gr.Markdown("")
+        # status / "you already have a certificate" notice — kept at the TOP, above the form
+        generation_status = gr.Markdown("")
         gr.Markdown(
             "✏️ **These details were auto-filled from the Build Small Hackathon records — "
             "you can edit both your name and your project/Space name** below before generating "
@@ -366,7 +383,8 @@ with gr.Blocks(title="Build Small — Certificate Generator") as demo:
             info="Auto-filled from your Build Small submission. Edit it, or leave blank for a certificate without a project.",
         )
         recreate_checkbox = gr.Checkbox(
-            label="Recreate certificate (replaces my existing one)", value=False, visible=False,
+            label="Recreate certificate — replace the copy saved in our records",
+            value=False, visible=False, interactive=True,
         )
         with gr.Row(elem_classes=["bs-generate"]):
             generate_btn = gr.Button("Generate my certificate", variant="primary", size="lg")
@@ -374,7 +392,6 @@ with gr.Blocks(title="Build Small — Certificate Generator") as demo:
         gr.HTML('<div class="bs-section">Your certificate</div>')
         certificate_image = gr.Image(label="Preview", type="filepath", interactive=False)
         certificate_file = gr.File(label="Download (PNG)", interactive=False)
-        generation_status = gr.Markdown("")
 
         gr.HTML('<div class="bs-section">Share</div>')
         linkedin_html = gr.HTML(render_linkedin_button(""))
@@ -385,7 +402,7 @@ with gr.Blocks(title="Build Small — Certificate Generator") as demo:
         fn=on_load,
         inputs=None,
         outputs=[login_status, main_interface, contact_box, participant_name, project_name,
-                 data_status, certificate_image, recreate_checkbox, generation_status],
+                 data_status, certificate_image, certificate_file, recreate_checkbox, generation_status],
     )
 
     generate_btn.click(