Create app.py

Added app.py with secret variables.

app.py

@@ -0,0 +1,116 @@
+import os
+import gradio as gr 
+from groq import Groq
+
+GROQ_API_KEY = os.environ.get("not_your_avg_key_mate")
+client = Groq(api_key=GROQ_API_KEY)
+
+PROMPT_ADVANCE = os.environ.get("prompt_code")
+
+
+FOOTER_TEXT = """
+<footer>
+    <p>If you enjoyed the functionality of the app, please leave a like!<br>
+    Check out more on <a href="https://www.linkedin.com/in/thisrudrapatel/" target="_blank">LinkedIn</a> | 
+    <a href="https://www.thisrudrapatel.com/" target="_blank">Personal Website</a></p>
+</footer>
+"""
+MAIN_PAGE_DISCLAIMER = """
+<p style="font-style: italic; color:#000000; background-color: #d1ecf1; padding: 10px; border-radius: 5px;">
+Disclaimer: This app is designed to generate human-readable explanations for Leetcode solutions.  
+Its primary purpose is to help you revisit your own logic later or understand unfamiliar (a.k.a. alien 👽) code in a clean, structured, and fun way.  
+Please review all outputs before sharing publicly, and treat the explanations as supportive drafts — not final answers.
+</p>
+"""
+
+RAW_MARKDOWN_DISCLAIMER = """
+<p style="font-style: italic; color:#000000; background-color: #d1ecf1; padding: 10px; border-radius: 5px;">
+Heads-up: This is the raw markdown output generated for your Leetcode solution. 
+It's copy-paste ready for platforms like Leetcode Discuss, GitHub, or personal blogs. 
+Feel free to tweak the tone, structure, or formatting to better match your voice or audience.
+</p>
+"""
+
+INSTRUCTIONS = """
+<div style="background-color: #ccccccc; color: #ffffff; padding: 15px; border-radius: 8px; margin-bottom: 15px;">
+    <p><strong>Instructions & a Little Backstory 📖:</strong></p>
+    <p>
+        So here’s the deal — I built this tool just for fun (and for my own sanity). 😅  
+        After solving a DSA problem, the last thing I wanted was to spend 15 more minutes formatting it for Leetcode Discuss. Clean markdown, proper explanation, structure — it adds up.
+    </p>
+    <p>
+        That’s where this app comes in clutch. I just drop my magic spell — a.k.a. my code — into the input box, click a button, and *BOOM*, it generates a beautiful, structured explanation with markdown. Upload-ready, dev-friendly, and cheeky as hell. Isn’t that fun?
+    </p>
+    <p>
+        By default, it follows a format I personally prompt-engineered 🧠 — one that includes sections like <strong>Intuition 💡</strong>, <strong>Approach 🪜</strong>, <strong>Code 👨🏽‍💻</strong>, and more — designed to make your solution stand out and feel human. But hey, you’re free to tweak it however you want! The output is pure markdown, so go wild if needed.
+    </p>
+    <p><strong>How to use:</strong></p>
+    <ul>
+        <li>Paste your Leetcode solution or the problem description into the text box.</li>
+        <li>Click <strong>“Get my Solution Fasttttt”</strong> to view the generated explanation.</li>
+        <li>Need the raw markdown? Switch to the <em>Raw Markdown Output 📝</em> tab to copy it directly.</li>
+        <li>Want an extra (or alternate) approach? Tap <em>“Suggest Alternate Solution 🔁”</em> and let it cook.</li>
+    </ul>
+    <p>
+        This app's just my little productivity sidekick — hope it becomes yours too.  
+        If you vibe with it, feel free to drop a like, or connect on <a href="https://www.linkedin.com/in/thisrudrapatel/" target="_blank">LinkedIn</a>. Let’s grow together.
+    </p>
+</div>
+"""
+
+TITLE = "<h1> Leetcode Solution Explainer </h1>"
+
+def generate_response(message: str, system_prompt: str, temperature: float, max_tokens: int):
+    conversation = [
+        {"role": "system", "content": system_prompt},
+        {"role": "user", "content": message}
+    ]
+
+    response = client.chat.completions.create(
+        model="meta-llama/llama-4-scout-17b-16e-instruct",
+        messages=conversation,
+        temperature=temperature,
+        max_tokens=max_tokens,
+        stream=False
+    )
+
+    return response.choices[0].message.content
+
+def analyze_solution(code, temperature, max_tokens):
+    prompt = f"""
+    {PROMPT_ADVANCE}
+    {code}
+"""
+    markdown_output = generate_response(prompt, "You are an expert Leetcode Solution Writer.", temperature, max_tokens)
+    return markdown_output, markdown_output  # Both rendered and raw
+
+
+# UI Block
+with gr.Blocks(theme="gradio/gsoft") as demo:
+    gr.HTML(TITLE)
+
+    with gr.Tab("Explain My Solution 🚀"):
+        gr.HTML(INSTRUCTIONS)
+        gr.HTML(MAIN_PAGE_DISCLAIMER)
+        code = gr.Textbox(label="Description", lines=5, placeholder="Paste your code or problem here...")
+        analyze_btn = gr.Button("Get my Solution Fasttttt")
+        with gr.Row():
+            output_rendered = gr.Markdown(label="Formatted Markdown")  # Rendered
+        with gr.Accordion("Tweak Zone 🔧", open=True):
+            temperature = gr.Slider(0, 1, 0.1, value=0.5, label="Imagination Dial 🎨 (Temperature)")
+            max_tokens = gr.Slider(50, 1024, step=1, value=1024, label="How Much It’ll Say ✍️ (Tokens)")
+
+    with gr.Tab("Raw Markdown Output 📝"):
+        gr.HTML(RAW_MARKDOWN_DISCLAIMER)
+        raw_markdown_box = gr.Textbox(label="Raw Markdown", lines=20, show_copy_button=True)
+
+    analyze_btn.click(
+        analyze_solution,
+        inputs=[code, temperature, max_tokens],
+        outputs=[output_rendered, raw_markdown_box]
+    )
+
+    gr.HTML(FOOTER_TEXT)
+
+if __name__ == "__main__":
+    demo.launch()