functionality changes + aesthetics

app.py

@@ -19,7 +19,7 @@ async def call_openai_api(sn_api_key, prompt: str) -> Dict:
         messages=[
             {
                 "role": "system", 
-                "content": "You are a knowledge graph generator. Generate detailed answers to questions posed about subconcepts and give an educated response as if you were a professor explaining to a student."
+                "content": "You are a knowledge graph generator. Generate detailed answers to questions posed about subconcepts and give an educated response as if you were a professor explaining to a student. Where applicable add in code examples to solidify the concept for the student."
             },
             {
                 "role": "user", 
@@ -67,7 +67,6 @@ def process_concept(sn_api_key, concept, num_subconcepts, progress=gr.Progress()
     # clean up response
     subconcepts = result.strip().split('\n')
     subconcepts = list(set([subconcept.strip() for subconcept in subconcepts]))
-    # print(subconcepts)
     num_total_subconcepts = len(subconcepts)
 
     progress(0.2, "Preparing subconcepts")
@@ -113,7 +112,6 @@ def process_concept(sn_api_key, concept, num_subconcepts, progress=gr.Progress()
             }
         ],
     )
-    print(response)
     intro_summary = response.choices[0].message.content
 
     end_time = time.time()
@@ -138,9 +136,9 @@ def process_concept(sn_api_key, concept, num_subconcepts, progress=gr.Progress()
     new_tabs = []
     new_tab_contents = []
     for i in range(len(subconcept_markdowns)):
-        new_tabs.append(gr.update(label=f"Lesson {i+1}: {subconcepts[i].title()}", visible=True))
+        new_tabs.append(gr.update(label=f"Lesson {i+1}: {subconcepts[i].title()}", visible=True, render=True))
         new_tab_contents.append(gr.Markdown(f"{subconcept_markdowns[i]}"))
-    new_tabs.extend([gr.update(visible=False) for _ in range(MAX_SUBCONCEPTS-len(subconcept_markdowns))])
+    new_tabs.extend([gr.update(visible=False, render=False) for _ in range(MAX_SUBCONCEPTS-len(subconcept_markdowns))])
     new_tab_contents.extend([gr.update(visible=False) for _ in range(MAX_SUBCONCEPTS-len(subconcept_markdowns))])
 
     return "Process complete!", markdown_intro, *new_tabs, *new_tab_contents
@@ -148,28 +146,21 @@ def process_concept(sn_api_key, concept, num_subconcepts, progress=gr.Progress()
 with gr.Blocks() as demo:
     gr.Markdown(
         """
-        <h1 style="text-align: center;">Lesson Plan Generator</h1>
-        <p style="text-align: center; font-size: 20px;">Ever wanted to learn something new? Struggled to break down the concept to more digestible subconcepts? In this demo, we use <a href="https://cloud.sambanova.ai">SambaNova's</a> superfast LLama 3.2 3B and LLama 3.1 8B models to summarize the concept and subconcepts as well as provide a detailed lesson for each of the subconcepts. </p>
-        <p style="text-align: center; font-size: 18px;">To use this, follow the instructions below:</p>
+        # Lesson Plan Generator
+        
+        **Ever wanted to learn something new? Struggled to break down the concept to more digestible subconcepts? In this demo, we use <a href="https://cloud.sambanova.ai">SambaNova's</a> superfast LLama 3.2 3B and LLama 3.1 8B models to summarize the concept and subconcepts as well as provide a detailed lesson for each of the subconcepts.**
+        
+        *To use this, follow the instructions below:*
+
+        1. Navigate to <a href="https://cloud.sambanova.ai">https://cloud.sambanova.ai</a>, login and copy your API Key
+        2. Paste it in the SambaNova API Key box below
+        3. Enter a concept you are interested in (e.g. Variational Autoencoders)
+        4. Choose the number of subconcepts you want to break your lessons into
+        5. Click 'Generate Lesson Plan'
+        6. Wait for a few seconds for multiple LLama 3B and 8B calls to finish
+        7. Read through and enjoy your lesson plans (Navigate to the tabs at the bottom)
         """,
-        elem_id="header"
-    )
-
-    gr.Markdown(
-        """
-        <div style="margin: auto; width: 50%; text-align: left; font-size: 16px">
-            <ol>
-                <li>Navigate to <a href="https://cloud.sambanova.ai">https://cloud.sambanova.ai</a>, login and copy your API Key</li>
-                <li>Paste it in the SambaNova API Key box below</li>
-                <li>Enter a concept you are interested in (e.g. Variational Autoencoders)</li>
-                <li>Choose the number of subconcepts you want to break your lessons into</li>
-                <li>Click 'Generate Lesson Plan'</li>
-                <li>Wait for a few seconds for multiple LLama 3B and 8B calls to finish</li>
-                <li>Read through and enjoy your lesson plans</li>
-            </ol>
-        </div>
-        """,
-        elem_id="instructions"
+        elem_id="header", container=True
     )
     
     with gr.Column():
@@ -182,14 +173,14 @@ with gr.Blocks() as demo:
     
     with gr.Column():
         progress_output = gr.Textbox(label="Progress", interactive=True)
-        lesson_intro = gr.Markdown(label="Lesson Intro") 
+        lesson_intro = gr.Markdown(label="Lesson Intro", container=True) 
 
     tab_contents = []
 
     with gr.Tabs() as tabs:
         for i in range(MAX_SUBCONCEPTS):  # Initial set of tabs
             with gr.Tab(f"Lesson {i+1}", visible=False):
-                exec(f'tab_{i}=gr.Markdown(f"This is content for Lesson {i+1}")')
+                exec(f'tab_{i}=gr.Markdown(f"This is content for Lesson {i+1}", container=True)')
                 exec(f'tab_contents.append(tab_{i})')
             
     generate_btn.click(