Update app.py

app.py

@@ -20,12 +20,13 @@ Welcome to LKSF! This app serves as your creative partner in fashion design, off
 st.sidebar.title("Navigation")
 app_mode = st.sidebar.selectbox(
     "Choose a Feature",
-    ["Home", "Sketch to 3D Design", "Trend Forecaster", "Virtual Try-On", "Personalized Stylist"]
+    ["Home", "Sketch to 3D Design", "Trend Forecaster", "Virtual Try-On", "Personalized Stylist"],
+    key="navigation_selectbox"  # Unique key for the sidebar selectbox
 )
 
 # Home Page
 if app_mode == "Home":
-    st.image("https://via.placeholder.com/1200x400.png?text=Fashion+Banner", use_column_width=True)
+    st.image("https://via.placeholder.com/1200x400.png?text=Fashion+Banner", use_container_width=True)
     st.write("""
     **LKSF** is an AI-powered platform designed to revolutionize the fashion industry. 
     Explore the features in the sidebar to get started!
@@ -34,16 +35,16 @@ if app_mode == "Home":
 # Sketch to 3D Design Feature
 elif app_mode == "Sketch to 3D Design":
     st.header("Sketch to 3D Design")
-    uploaded_file = st.file_uploader("Upload your fashion sketch (PNG or JPG)", type=["png", "jpg"])
+    uploaded_file = st.file_uploader("Upload your fashion sketch (PNG or JPG)", type=["png", "jpg"], key="sketch_uploader")
     
     if uploaded_file is not None:
         image = Image.open(uploaded_file)
-        st.image(image, caption="Uploaded Sketch", use_column_width=True)
+        st.image(image, caption="Uploaded Sketch", use_container_width=True)
         
-        if st.button("Convert to 3D"):
+        if st.button("Convert to 3D", key="convert_to_3d_button"):
             # Placeholder for AI model to convert sketch to 3D
             st.write("**3D Design Preview**")
-            st.image("https://via.placeholder.com/600x400.png?text=3D+Design+Placeholder", caption="3D Design", use_column_width=True)
+            st.image("https://via.placeholder.com/600x400.png?text=3D+Design+Placeholder", caption="3D Design", use_container_width=True)
             st.success("Your 3D design is ready!")
 
 # Trend Forecaster Feature
@@ -63,33 +64,33 @@ elif app_mode == "Trend Forecaster":
     st.write("**Current Trends by Region**")
     st.dataframe(trend_df)
     
-    if st.button("Generate Trend Report"):
+    if st.button("Generate Trend Report", key="trend_report_button"):
         # Placeholder for AI trend analysis
         st.write("**Trend Forecast for Next Season**")
-        st.image("https://via.placeholder.com/600x400.png?text=Trend+Forecast+Placeholder", caption="Trend Forecast", use_column_width=True)
+        st.image("https://via.placeholder.com/600x400.png?text=Trend+Forecast+Placeholder", caption="Trend Forecast", use_container_width=True)
 
 # Virtual Try-On Feature
 elif app_mode == "Virtual Try-On":
     st.header("Virtual Try-On")
     st.write("Try on outfits virtually using augmented reality!")
     
-    uploaded_image = st.file_uploader("Upload your photo (PNG or JPG)", type=["png", "jpg"])
-    outfit_image = st.file_uploader("Upload outfit image (PNG or JPG)", type=["png", "jpg"])
+    uploaded_image = st.file_uploader("Upload your photo (PNG or JPG)", type=["png", "jpg"], key="user_photo_uploader")
+    outfit_image = st.file_uploader("Upload outfit image (PNG or JPG)", type=["png", "jpg"], key="outfit_uploader")
     
     if uploaded_image is not None and outfit_image is not None:
         user_image = Image.open(uploaded_image)
         outfit = Image.open(outfit_image)
         
         st.write("**Your Photo**")
-        st.image(user_image, use_column_width=True)
+        st.image(user_image, use_container_width=True)
         
         st.write("**Outfit to Try On**")
-        st.image(outfit, use_column_width=True)
+        st.image(outfit, use_container_width=True)
         
-        if st.button("Try On Outfit"):
+        if st.button("Try On Outfit", key="try_on_button"):
             # Placeholder for AR-based virtual try-on
             st.write("**Virtual Try-On Result**")
-            st.image("https://via.placeholder.com/600x400.png?text=Virtual+Try-On+Placeholder", caption="Virtual Try-On", use_column_width=True)
+            st.image("https://via.placeholder.com/600x400.png?text=Virtual+Try-On+Placeholder", caption="Virtual Try-On", use_container_width=True)
 
 # Personalized Stylist Feature
 elif app_mode == "Personalized Stylist":
@@ -97,46 +98,46 @@ elif app_mode == "Personalized Stylist":
     st.write("Get outfit recommendations tailored to your style, body type, and preferences.")
     
     # User Inputs
-    gender = st.selectbox("Select Gender", ["Male", "Female", "Non-Binary"])
-    body_type = st.selectbox("Select Body Type", ["Hourglass", "Rectangle", "Pear", "Apple", "Inverted Triangle"])
-    color_preference = st.multiselect("Select Preferred Colors", ["Red", "Blue", "Green", "Black", "White", "Yellow"])
-    occasion = st.selectbox("Select Occasion", ["Casual", "Formal", "Work", "Party", "Sports"])
+    gender = st.selectbox("Select Gender", ["Male", "Female", "Non-Binary"], key="gender_selectbox")
+    body_type = st.selectbox("Select Body Type", ["Hourglass", "Rectangle", "Pear", "Apple", "Inverted Triangle"], key="body_type_selectbox")
+    color_preference = st.multiselect("Select Preferred Colors", ["Red", "Blue", "Green", "Black", "White", "Yellow"], key="color_preference_multiselect")
+    occasion = st.selectbox("Select Occasion", ["Casual", "Formal", "Work", "Party", "Sports"], key="occasion_selectbox")
     
-    if st.button("Get Styling Recommendations"):
+    if st.button("Get Styling Recommendations", key="styling_recommendations_button"):
         # Placeholder for AI-based styling recommendations
         st.write("**Recommended Outfits**")
-        st.image("https://via.placeholder.com/600x400.png?text=Outfit+Recommendation+Placeholder", caption="Outfit Recommendation", use_column_width=True)
+        st.image("https://via.placeholder.com/600x400.png?text=Outfit+Recommendation+Placeholder", caption="Outfit Recommendation", use_container_width=True)
         st.write("**Styling Tips**")
         st.write("- Pair this outfit with neutral-colored accessories.")
         st.write("- Add a statement necklace for a formal look.")
 
 # Additional Features (Optional)
 st.sidebar.header("Additional Features")
-if st.sidebar.checkbox("Show Hairstyle Recommendations"):
+if st.sidebar.checkbox("Show Hairstyle Recommendations", key="hairstyle_checkbox"):
     st.header("Hairstyle Recommendations")
-    face_shape = st.selectbox("Select Your Face Shape", ["Oval", "Round", "Square", "Heart"])
-    if st.button("Get Hairstyle Suggestions"):
+    face_shape = st.selectbox("Select Your Face Shape", ["Oval", "Round", "Square", "Heart"], key="face_shape_selectbox_1")
+    if st.button("Get Hairstyle Suggestions", key="hairstyle_button"):
         # Placeholder for AI-based hairstyle recommendations
         st.write("**Recommended Hairstyles**")
-        st.image("https://via.placeholder.com/600x400.png?text=Hairstyle+Recommendation+Placeholder", caption="Hairstyle Recommendation", use_column_width=True)
+        st.image("https://via.placeholder.com/600x400.png?text=Hairstyle+Recommendation+Placeholder", caption="Hairstyle Recommendation", use_container_width=True)
 
-if st.sidebar.checkbox("Show Glasses Frame Suggestions"):
+if st.sidebar.checkbox("Show Glasses Frame Suggestions", key="glasses_checkbox"):
     st.header("Glasses Frame Suggestions")
-    face_shape = st.selectbox("Select Your Face Shape", ["Oval", "Round", "Square", "Heart"])
-    if st.button("Get Glasses Frame Suggestions"):
+    face_shape = st.selectbox("Select Your Face Shape", ["Oval", "Round", "Square", "Heart"], key="face_shape_selectbox_2")
+    if st.button("Get Glasses Frame Suggestions", key="glasses_button"):
         # Placeholder for AI-based glasses frame recommendations
         st.write("**Recommended Glasses Frames**")
-        st.image("https://via.placeholder.com/600x400.png?text=Glasses+Frame+Recommendation+Placeholder", caption="Glasses Frame Recommendation", use_column_width=True)
+        st.image("https://via.placeholder.com/600x400.png?text=Glasses+Frame+Recommendation+Placeholder", caption="Glasses Frame Recommendation", use_container_width=True)
 
-if st.sidebar.checkbox("Show Skin Tone Analysis"):
+if st.sidebar.checkbox("Show Skin Tone Analysis", key="skin_tone_checkbox"):
     st.header("Skin Tone Analysis")
-    uploaded_photo = st.file_uploader("Upload a photo for skin tone analysis", type=["png", "jpg"])
+    uploaded_photo = st.file_uploader("Upload a photo for skin tone analysis", type=["png", "jpg"], key="skin_tone_uploader")
     if uploaded_photo is not None:
         photo = Image.open(uploaded_photo)
-        st.image(photo, caption="Uploaded Photo", use_column_width=True)
-        if st.button("Analyze Skin Tone"):
+        st.image(photo, caption="Uploaded Photo", use_container_width=True)
+        if st.button("Analyze Skin Tone", key="skin_tone_button"):
             # Placeholder for AI-based skin tone analysis
             st.write("**Skin Tone Analysis Result**")
             st.write("Your skin tone is: **Warm**")
             st.write("**Recommended Colors**")
-            st.image("https://via.placeholder.com/600x400.png?text=Color+Recommendation+Placeholder", caption="Color Recommendation", use_column_width=True)
+            st.image("https://via.placeholder.com/600x400.png?text=Color+Recommendation+Placeholder", caption="Color Recommendation", use_container_width=True)