Update app.py

app.py

@@ -18,43 +18,6 @@ import base64
 from datasets import load_dataset
 from PIL import Image 
 
-device = "cuda" if torch.cuda.is_available() else "cpu"
-
-word_list_dataset = load_dataset("EPFL-VILAB/4m-wordlist", data_files="list.txt", use_auth_token=True)
-word_list = word_list_dataset["train"]['text']
-
-bnb_config = BitsAndBytesConfig(
-    load_in_4bit=True,
-    bnb_4bit_use_double_quant=True,
-    bnb_4bit_quant_type="nf4",
-    bnb_4bit_compute_dtype=torch.float16,
-    llm_int8_skip_modules=["lm_head", "embed_tokens"],
-)
-
-processor = AutoProcessor.from_pretrained("HuggingFaceM4/idefics2-8b", size= {"longest_edge": 448, "shortest_edge": 378}, do_image_splitting=False)
-
-vpe_model = AutoModelForVision2Seq.from_pretrained(
-    "HuggingFaceM4/idefics2-8b",
-    torch_dtype=torch.float16,    
-    quantization_config=bnb_config,
-)
-
-vpe_model = PeftModel.from_pretrained(vpe_model, "VPE2").to("cuda")
-
-if torch.cuda.is_available():
-    pipe = StableDiffusionXLPipeline.from_pretrained(
-        "stabilityai/stable-diffusion-xl-base-1.0", 
-        torch_dtype=torch.float16
-    ).to("cuda")
-else: 
-    pipe = DiffusionPipeline.from_pretrained("stabilityai/stable-diffusion-xl-base-1.0", use_safetensors=True)
-    pipe = pipe.to(device)
-
-MAX_SEED = np.iinfo(np.int32).max
-MAX_IMAGE_SIZE = 1024
-
-valid_api = ""
-
 css="""
 #col-container {
     margin: 0 auto;
@@ -74,323 +37,282 @@ css="""
 }
 """
 
-if torch.cuda.is_available():
-    power_device = "GPU"
-else:
-    power_device = "CPU"
-  
-comment_images = [
-    "comment_images/15.png",
-    "test.png",
-    "comment_images/0.png",
-    "comment_images/1.png",
-    "comment_images/2.png",
-    "comment_images/3.png",
-    "comment_images/4.png",
-    "comment_images/5.png",
-    "comment_images/6.png",
-    "comment_images/7.png",
-    "comment_images/8.png",
-    "comment_images/9.png",
-    "comment_images/10.png",
-    "comment_images/11.png",
-    "comment_images/12.png",
-    "comment_images/13.png",
-    "comment_images/14.png",
-    "comment_images/16.png",
-    "comment_images/17.png",
-    "comment_images/18.png",
-    "comment_images/19.png",
-    "comment_images/20.png",
-    "comment_images/21.png",
-    "comment_images/22.png",
-    "comment_images/23.png",
-    "comment_images/24.png",
-    "comment_images/25.png",
-    "comment_images/26.png",
-    "comment_images/27.png",
-    "comment_images/28.png",
-    "comment_images/29.png",
-    "comment_images/30.png",
-    "comment_images/31.png",
-    "comment_images/32.png",
-    "comment_images/33.png",
-    "comment_images/34.png",
-    "comment_images/35.png",
-    "comment_images/36.png",
-    "comment_images/37.png",
-    "comment_images/38.png",
-    "comment_images/39.png",
-    "comment_images/40.png",
-    "comment_images/41.png",
-    "comment_images/42.jpg",
-    "comment_images/43.png",
-    "comment_images/44.png",
-    "comment_images/45.png",
-    "comment_images/46.png",
-    "comment_images/47.png",
-    "comment_images/48.png",
-    "comment_images/49.png",
-    "comment_images/50.png",
-    "comment_images/51.png",
-    "comment_images/52.png",
-    "comment_images/53.png",
-    "comment_images/54.png",
-    "comment_images/55.png"
-]
-
-example_prompts = [
-    "Painting of a lady",
-    "Cityscape during a thunderstorm",
-    "Inside an abondoned train, window view",
-    "A person reaching for stars",
-    "Abandoned robot at the depth of the sea",
-    "Lonely astronaut in abyss",
-    "Human in a frame"
-]
-
-examples = {
-    "A person reaching for stars":[
-        "examples/A person reaching fo_0.png",
-        "examples/A person reaching fo_1.png",
-        "examples/A person reaching fo_2.png",
-        "examples/A person reaching fo_4.png",
-        "examples/A person reaching fo_5.png",
-        "examples/A person reaching fo_6.png",
-        "examples/A person reaching fo_8.png",
-        "examples/A person reaching fo_9.png",
-        "examples/A person reaching fo_10.png",
-    ],
-    "Abandoned robot at the depth of the sea":[
-        "examples/Abandoned robot at t_0.png",
-        "examples/Abandoned robot at t_1.png",
-        "examples/Abandoned robot at t_2.png",
-        "examples/Abandoned robot at t_4.png",
-        "examples/Abandoned robot at t_5.png",
-        "examples/Abandoned robot at t_6.png",
-        "examples/Abandoned robot at t_8.png",
-        "examples/Abandoned robot at t_9.png",
-        "examples/Abandoned robot at t_10.png",
-    ],
-    "Cityscape during a thunderstorm":[
-        "examples/Cityscape during a t_0.png",
-        "examples/Cityscape during a t_1.png",
-        "examples/Cityscape during a t_2.png",
-        "examples/Cityscape during a t_4.png",
-        "examples/Cityscape during a t_5.png",
-        "examples/Cityscape during a t_6.png",
-        "examples/Cityscape during a t_8.png",
-        "examples/Cityscape during a t_9.png",
-        "examples/Cityscape during a t_10.png",
-    ],
-    "Human in a frame":[
-        "examples/Human in a frame_0.png",
-        "examples/Human in a frame_1.png",
-        "examples/Human in a frame_2.png",
-        "examples/Human in a frame_4.png",
-        "examples/Human in a frame_5.png",
-        "examples/Human in a frame_6.png",
-        "examples/Human in a frame_8.png",
-        "examples/Human in a frame_9.png",
-        "examples/Human in a frame_10.png",
-    ],
-    "Inside an abondoned train, window view":[
-        "examples/Inside an abondoned _0.png",
-        "examples/Inside an abondoned _1.png",
-        "examples/Inside an abondoned _2.png",
-        "examples/Inside an abondoned _4.png",
-        "examples/Inside an abondoned _5.png",
-        "examples/Inside an abondoned _6.png",
-        "examples/Inside an abondoned _8.png",
-        "examples/Inside an abondoned _9.png",
-        "examples/Inside an abondoned _10.png",
-    ],
-    "Lonely astronaut in abyss":[
-        "examples/Lonely astronaut in _0.png",
-        "examples/Lonely astronaut in _1.png",
-        "examples/Lonely astronaut in _2.png",
-        "examples/Lonely astronaut in _4.png",
-        "examples/Lonely astronaut in _5.png",
-        "examples/Lonely astronaut in _6.png",
-        "examples/Lonely astronaut in _8.png",
-        "examples/Lonely astronaut in _9.png",
-        "examples/Lonely astronaut in _10.png",
-    ],
-    "Painting of a lady":[
-        "examples/Painting of a lady_0.png",
-        "examples/Painting of a lady_1.png",
-        "examples/Painting of a lady_2.png",
-        "examples/Painting of a lady_4.png",
-        "examples/Painting of a lady_5.png",
-        "examples/Painting of a lady_6.png",
-        "examples/Painting of a lady_8.png",
-        "examples/Painting of a lady_9.png",
-        "examples/Painting of a lady_10.png",
+with gr.Blocks(css=css, title="ViPer Demo", theme=gr.themes.Base()) as demo:
+
+    device = "cuda" if torch.cuda.is_available() else "cpu"
+
+
+    word_list_dataset = load_dataset("EPFL-VILAB/4m-wordlist", data_files="list.txt", use_auth_token=True)
+    word_list = word_list_dataset["train"]['text']
+
+    bnb_config = BitsAndBytesConfig(
+        load_in_4bit=True,
+        bnb_4bit_use_double_quant=True,
+        bnb_4bit_quant_type="nf4",
+        bnb_4bit_compute_dtype=torch.float16,
+        llm_int8_skip_modules=["lm_head", "embed_tokens"],
+    )
+
+    processor = AutoProcessor.from_pretrained("HuggingFaceM4/idefics2-8b", size= {"longest_edge": 448, "shortest_edge": 378}, do_image_splitting=False)
+
+    vpe_model = AutoModelForVision2Seq.from_pretrained(
+        "HuggingFaceM4/idefics2-8b",
+        torch_dtype=torch.float16,    
+        quantization_config=bnb_config,
+    )
+
+    vpe_model = PeftModel.from_pretrained(vpe_model, "VPE2").to("cuda")
+
+    if torch.cuda.is_available():
+        pipe = StableDiffusionXLPipeline.from_pretrained(
+            "stabilityai/stable-diffusion-xl-base-1.0", 
+            torch_dtype=torch.float16
+        ).to("cuda")
+    else: 
+        pipe = DiffusionPipeline.from_pretrained("stabilityai/stable-diffusion-xl-base-1.0", use_safetensors=True)
+        pipe = pipe.to(device)
+
+    MAX_SEED = np.iinfo(np.int32).max
+    MAX_IMAGE_SIZE = 1024
+
+    valid_api = ""
+
+    if torch.cuda.is_available():
+        power_device = "GPU"
+    else:
+        power_device = "CPU"
+
+    mioo = [
+        "comment_images/15.png",
+        "test.png",
+        "comment_images/0.png",
+        "comment_images/1.png",
+        "comment_images/2.png",
+        "comment_images/3.png",
+        "comment_images/4.png",
+        "comment_images/5.png",
+        "comment_images/6.png",
+        "comment_images/7.png",
+        "comment_images/8.png",
+        "comment_images/9.png",
+        "comment_images/10.png",
+        "comment_images/11.png",
+        "comment_images/12.png",
+        "comment_images/13.png",
+        "comment_images/14.png",
+        "comment_images/16.png",
+        "comment_images/17.png",
+        "comment_images/18.png",
+        "comment_images/19.png",
+        "comment_images/20.png",
+        "comment_images/21.png",
+        "comment_images/22.png",
+        "comment_images/23.png",
+        "comment_images/24.png",
+        "comment_images/25.png",
+        "comment_images/26.png",
+        "comment_images/27.png",
+        "comment_images/28.png",
+        "comment_images/29.png",
+        "comment_images/30.png",
+        "comment_images/31.png",
+        "comment_images/32.png",
+        "comment_images/33.png",
+        "comment_images/34.png",
+        "comment_images/35.png",
+        "comment_images/36.png",
+        "comment_images/37.png",
+        "comment_images/38.png",
+        "comment_images/39.png",
+        "comment_images/40.png",
+        "comment_images/41.png",
+        "comment_images/42.jpg",
+        "comment_images/43.png",
+        "comment_images/44.png",
+        "comment_images/45.png",
+        "comment_images/46.png",
+        "comment_images/47.png",
+        "comment_images/48.png",
+        "comment_images/49.png",
+        "comment_images/50.png",
+        "comment_images/51.png",
+        "comment_images/52.png",
+        "comment_images/53.png",
+        "comment_images/54.png",
+        "comment_images/55.png"
     ]
-}
+    
+    comment_images = gr.State(mioo)
+
+    example_prompts = [
+        "Painting of a lady",
+        "Cityscape during a thunderstorm",
+        "Inside an abondoned train, window view",
+        "A person reaching for stars",
+        "Abandoned robot at the depth of the sea",
+        "Lonely astronaut in abyss",
+        "Human in a frame"
+    ]
+
+    examples = {
+        "A person reaching for stars":[
+            "examples/A person reaching fo_0.png",
+            "examples/A person reaching fo_1.png",
+            "examples/A person reaching fo_2.png",
+            "examples/A person reaching fo_4.png",
+            "examples/A person reaching fo_5.png",
+            "examples/A person reaching fo_6.png",
+            "examples/A person reaching fo_8.png",
+            "examples/A person reaching fo_9.png",
+            "examples/A person reaching fo_10.png",
+        ],
+        "Abandoned robot at the depth of the sea":[
+            "examples/Abandoned robot at t_0.png",
+            "examples/Abandoned robot at t_1.png",
+            "examples/Abandoned robot at t_2.png",
+            "examples/Abandoned robot at t_4.png",
+            "examples/Abandoned robot at t_5.png",
+            "examples/Abandoned robot at t_6.png",
+            "examples/Abandoned robot at t_8.png",
+            "examples/Abandoned robot at t_9.png",
+            "examples/Abandoned robot at t_10.png",
+        ],
+        "Cityscape during a thunderstorm":[
+            "examples/Cityscape during a t_0.png",
+            "examples/Cityscape during a t_1.png",
+            "examples/Cityscape during a t_2.png",
+            "examples/Cityscape during a t_4.png",
+            "examples/Cityscape during a t_5.png",
+            "examples/Cityscape during a t_6.png",
+            "examples/Cityscape during a t_8.png",
+            "examples/Cityscape during a t_9.png",
+            "examples/Cityscape during a t_10.png",
+        ],
+        "Human in a frame":[
+            "examples/Human in a frame_0.png",
+            "examples/Human in a frame_1.png",
+            "examples/Human in a frame_2.png",
+            "examples/Human in a frame_4.png",
+            "examples/Human in a frame_5.png",
+            "examples/Human in a frame_6.png",
+            "examples/Human in a frame_8.png",
+            "examples/Human in a frame_9.png",
+            "examples/Human in a frame_10.png",
+        ],
+        "Inside an abondoned train, window view":[
+            "examples/Inside an abondoned _0.png",
+            "examples/Inside an abondoned _1.png",
+            "examples/Inside an abondoned _2.png",
+            "examples/Inside an abondoned _4.png",
+            "examples/Inside an abondoned _5.png",
+            "examples/Inside an abondoned _6.png",
+            "examples/Inside an abondoned _8.png",
+            "examples/Inside an abondoned _9.png",
+            "examples/Inside an abondoned _10.png",
+        ],
+        "Lonely astronaut in abyss":[
+            "examples/Lonely astronaut in _0.png",
+            "examples/Lonely astronaut in _1.png",
+            "examples/Lonely astronaut in _2.png",
+            "examples/Lonely astronaut in _4.png",
+            "examples/Lonely astronaut in _5.png",
+            "examples/Lonely astronaut in _6.png",
+            "examples/Lonely astronaut in _8.png",
+            "examples/Lonely astronaut in _9.png",
+            "examples/Lonely astronaut in _10.png",
+        ],
+        "Painting of a lady":[
+            "examples/Painting of a lady_0.png",
+            "examples/Painting of a lady_1.png",
+            "examples/Painting of a lady_2.png",
+            "examples/Painting of a lady_4.png",
+            "examples/Painting of a lady_5.png",
+            "examples/Painting of a lady_6.png",
+            "examples/Painting of a lady_8.png",
+            "examples/Painting of a lady_9.png",
+            "examples/Painting of a lady_10.png",
+        ]
+    }
 
-comments = {'test.png': "Not sure about the concept, it's too straightforward. Though the boy looks kinda creepy which makes it exciting. the art style is pretty to look at. I like that the colors are muted, but wish they were a bit darker to make it more eerie and add depth.", 'comment_images/0.png': "Hate this with a passion. The colors are too vibrant and don't match at all. I hate these colors in general. The patterns are too abstract and contemporary. a 5-year-old could draw this. pass.", 'comment_images/1.png': "Woah I love the art style. The texture feels like old paper which is oh so beautiful. There are so many details to focus on. I love the expressive lines and how busy the composition is. Even though orange isn't my favorite, the greenish blue color of the water is so gorgeous.", 'comment_images/2.png': "I don't like how monochromatic and muted this one is. but the paperish texture is nice and the details are so intricate.", 'comment_images/3.png': "Oh super pretty! Looks so smooth and wet. Love the details and loose lines too. Feels mystical and magical and eerie. Also dark purples and blues? deep indigo? My fav ever. I'm here for it.", 'comment_images/4.png': "Love the art style. The uncanny vibe and nightmarish horror is so cool. Like its horror but if you squint you can't tell? Love the strange. wish it had more colors though. not a fan of greyscale.", 'comment_images/5.png': 'omg I hate this haha. what the hell. everything about it disgusts me so boring and childish ew.', 'comment_images/6.png': 'yessss. give it to the texture give it to the brushstrokes give it to the style. perfect. just wish the colors were less beige and more bold. I want an active nightmare. but kisses to the surrealism.'}
-comments = dict()
+    comments = {'test.png': "Not sure about the concept, it's too straightforward. Though the boy looks kinda creepy which makes it exciting. the art style is pretty to look at. I like that the colors are muted, but wish they were a bit darker to make it more eerie and add depth.", 'comment_images/0.png': "Hate this with a passion. The colors are too vibrant and don't match at all. I hate these colors in general. The patterns are too abstract and contemporary. a 5-year-old could draw this. pass.", 'comment_images/1.png': "Woah I love the art style. The texture feels like old paper which is oh so beautiful. There are so many details to focus on. I love the expressive lines and how busy the composition is. Even though orange isn't my favorite, the greenish blue color of the water is so gorgeous.", 'comment_images/2.png': "I don't like how monochromatic and muted this one is. but the paperish texture is nice and the details are so intricate.", 'comment_images/3.png': "Oh super pretty! Looks so smooth and wet. Love the details and loose lines too. Feels mystical and magical and eerie. Also dark purples and blues? deep indigo? My fav ever. I'm here for it.", 'comment_images/4.png': "Love the art style. The uncanny vibe and nightmarish horror is so cool. Like its horror but if you squint you can't tell? Love the strange. wish it had more colors though. not a fan of greyscale.", 'comment_images/5.png': 'omg I hate this haha. what the hell. everything about it disgusts me so boring and childish ew.', 'comment_images/6.png': 'yessss. give it to the texture give it to the brushstrokes give it to the style. perfect. just wish the colors were less beige and more bold. I want an active nightmare. but kisses to the surrealism.'}
+    comments = gr.State(dict())
 
-image_index = 0
+    image_index = gr.State(0)
 
-def submit_comment(comment):
-    global comment_images, image_index
-    if comment != "":
-        comments[comment_images[0]] = comment
+    def submit_comment(comment, comments, comment_images, image_index):
+        if comment != "":
+            comments[comment_images[0]] = comment
+            comment_images.append(comment_images[0])
+            comment_images = comment_images[1:]
+            image_index = (image_index + 1) % len(comment_images)
+
+        elif comment_images[0] in comments:
+            comments.pop(comment_images[0], None)
+
+        next_comment = ""
+        if comment_images[0] in comments:
+            next_comment = comments[comment_images[0]]
+
+        clear_botton = gr.Button("Clear comments", interactive=len(comments) != 0)
+
+        print(comments)
+
+        return (gr.Image(value=comment_images[0], label=f"image {image_index+1}/{len(comment_images)}", show_label=True),
+                gr.Text(label="Comment", show_label=False, lines=4, max_lines=5, placeholder="Enter your comment. The more detailed the better.", value=next_comment, container=False),
+                gr.Button(f"Extract visual preference from {len(comments)} comments", interactive=len(comments) >= 5, variant="primary"),
+                clear_botton,
+                comments,
+                comment_images,
+                image_index
+               )
+
+    def next_image(comments, comment_images, image_index):
         comment_images.append(comment_images[0])
         comment_images = comment_images[1:]
+
+        next_comment = ""
+        if comment_images[0] in comments:
+            next_comment = comments[comment_images[0]]
+
         image_index = (image_index + 1) % len(comment_images)
 
-    elif comment_images[0] in comments:
-        comments.pop(comment_images[0], None)
-
-    next_comment = ""
-    if comment_images[0] in comments:
-        next_comment = comments[comment_images[0]]
-
-    clear_botton = gr.Button("Clear comments", interactive=len(comments) != 0)
-        
-    return (gr.Image(value=comment_images[0], label=f"image {image_index+1}/{len(comment_images)}", show_label=True),
-            gr.Text(label="Comment", show_label=False, lines=4, max_lines=5, placeholder="Enter your comment. The more detailed the better.", value=next_comment, container=False),
-            gr.Button(f"Extract visual preference from {len(comments)} comments", interactive=len(comments) != 0, variant="primary"),
-            clear_botton
-           )
-
-def next_image():
-    global comment_images, image_index
-    comment_images.append(comment_images[0])
-    comment_images = comment_images[1:]
-
-    next_comment = ""
-    if comment_images[0] in comments:
-        next_comment = comments[comment_images[0]]
-
-    image_index = (image_index + 1) % len(comment_images)
-        
-    return gr.Image(value=comment_images[0], label=f"image {image_index+1}/{len(comment_images)}", show_label=True), gr.Text(label="Comment", show_label=False, lines=4, max_lines=5, placeholder="Enter your comment. The more detailed the better.", value=next_comment, container=False)
-
-def previous_image():
-    global comment_images, image_index
-    comment_images = comment_images[::-1]
-    comment_images.append(comment_images[0])
-    comment_images = comment_images[1:]
-    comment_images = comment_images[::-1]
-
-    next_comment = ""
-    if comment_images[0] in comments:
-        next_comment = comments[comment_images[0]]
-
-    image_index = (image_index - 1) % len(comment_images)
-        
-    return gr.Image(value=comment_images[0], label=f"image {image_index+1}/{len(comment_images)}", show_label=True), gr.Text(label="Comment", show_label=False, lines=4, max_lines=5, placeholder="Enter your comment. The more detailed the better.", value=next_comment, container=False)
-
-def clear_comments():
-    comments.clear()
-    extract_vp_botton = gr.Button(f"Extract visual preference from {len(comments)} comments", interactive=len(comments) != 0, variant="primary")
-    clear_botton = gr.Button("Clear comments", interactive=len(comments) != 0)
-    return extract_vp_botton, clear_botton
-
-@spaces.GPU(duration=120)
-def extract_vp_from_vpe():
-    global comments
-    if len(comments) < 8:
-        gr.Warning("Fewer than 8 comments may lead to errors.")
-        
-    prompt = """I will provide a set of artworks along with accompanying comments from a person. Analyze these artworks and the comments on them and identify artistic features such as present or mentioned colors, style, composition, mood, medium, texture, brushwork, lighting, shadow effects, perspective, and other noteworthy elements.
-Your task is to extract the artistic features the person likes and dislikes based on both the artworks' features and the person's comments. Focus solely on artistic aspects and refrain from considering subject matter.
-If the person expresses a preference for a specific aspect without clearly stating its category (e.g., appreciating the colors without specifying which colors), identify these specific features from the images directly to make the person's preference understandable without needing to see the artwork.
-Your output should consist of two concise lists of keywords: one listing the specific art features the person likes and another listing the specific features they dislike (specified in keyword format without using sentences).
-Here are the images and their corresponding comments:
-"""
-    messages = [
-        {
-            "role": "user",
-            "content": [
-                {"type": "text", 
-                "text": prompt},
-            ]
-        }
-    ]
-    images = []
-    comment_number = 1
-    for image in comments:
-        comment = comments[image]
-        image = Image.open(image)
-        images.append(image)
-    
-        messages[0]["content"].append(
-            {"type": "image"}
-        )
+        return gr.Image(value=comment_images[0], label=f"image {image_index+1}/{len(comment_images)}", show_label=True), gr.Text(label="Comment", show_label=False, lines=4, max_lines=5, placeholder="Enter your comment. The more detailed the better.", value=next_comment, container=False), comments, comment_images, image_index
 
-        messages[0]["content"].append(
-            {"type": "text", 
-             "text": f"Comment {comment_number}: {comment}"}
-        )
-        comment_number = comment_number + 1
-    
-    prompt = processor.apply_chat_template(messages, add_generation_prompt=True)
-    inputs = processor(text=prompt, images=images, return_tensors="pt")
-    inputs = {k: v.to(device) for k, v in inputs.items()}
-    
-    generated_ids = vpe_model.generate(**inputs, max_new_tokens=2000, repetition_penalty=0.99, do_sample=False)
-    generated_texts = processor.batch_decode(generated_ids, skip_special_tokens=True)[0]
-    
-    if re.match(r"(.|\n)*Assistant: Liked Art Features: (.|\n)*Disliked Art Features: (.|\n)*", generated_texts):
-        positive_vp, negative_vp = re.search('.* \nAssistant: Liked Art Features: (.*)\nDisliked Art Features: (.*)', generated_texts).groups()
-        positive_vp = positive_vp.split(", ")
-        negative_vp = negative_vp.split(", ")
-        common = list(set(positive_vp).intersection(negative_vp))
-
-        for vp in positive_vp:
-            if vp in common:
-                positive_vp.remove(vp)
-
-        for vp in negative_vp:
-            if vp in common:
-                negative_vp.remove(vp)
-
-        positive_vp = ", ".join(positive_vp)
-        negative_vp = ", ".join(negative_vp)
-        gr.Info("Visual preference successfully extracted.")
-    else:
-        positive_vp = ""
-        negative_vp = ""
-        gr.Warning("VP extraction failed: Please comment on more images.")
-        
-    return positive_vp, negative_vp
+    def previous_image(comments, comment_images, image_index):
+        comment_images = comment_images[::-1]
+        comment_images.append(comment_images[0])
+        comment_images = comment_images[1:]
+        comment_images = comment_images[::-1]
 
-def extract_vp():
+        next_comment = ""
+        if comment_images[0] in comments:
+            next_comment = comments[comment_images[0]]
 
-    if valid_api == "":
-        positive_vp, negative_vp = extract_vp_from_vpe()
-        
-    else:
-        client = anthropic.Anthropic(
-            api_key=valid_api,
-        )
+        image_index = (image_index - 1) % len(comment_images)
 
-        prompt = """**Objective:**
-Analyze a set of artworks and accompanying comments from a person to identify artistic features they like and dislike.
-**Steps:**
-1. **Analyze Artworks and Comments:**
-   - Examine each artwork for artistic features such as colors, style, composition, mood, medium, texture, brushwork, lighting, shadow effects, perspective, and other noteworthy elements.
-   - Review the accompanying comments to understand the person's preferences and opinions on these features.
-2. **Identify Preferences:**
-   - Extract artistic features that the person likes and dislikes based on the artworks' features and the comments.
-   - Focus solely on artistic aspects and ignore the subject matter.
-   - Convert the art features mentioned in the comments to well-known synonyms if needed.
-3. **Resolve Ambiguous Preferences:**
-   - If the person expresses a preference without clearly stating its category (e.g., "I like the style" without specifying which style), identify these specific features from the images directly.
-   - Make the person's preference understandable and independednt of the artworks.
-4. **Output Format:**
-   - Create two concise lists of keywords: one for features the person likes and another for features they dislike.
-   - Ensure the lists are in keyword format, divided by commas, without using sentences.
-   - Maintain detail and accuracy for all comments and images.
-**Your Task:**
-Follow the example format and ensure that your output consists of two lists of keywords summarizing the person's preferences based on the artworks and comments provided. Consider all comments and images comprehensively.
-**Example**: example START:
-"""
+        return gr.Image(value=comment_images[0], label=f"image {image_index+1}/{len(comment_images)}", show_label=True), gr.Text(label="Comment", show_label=False, lines=4, max_lines=5, placeholder="Enter your comment. The more detailed the better.", value=next_comment, container=False), comments, comment_images, image_index
+
+    def clear_comments(comments):
+        comments.clear()
+        extract_vp_botton = gr.Button(f"Extract visual preference from {len(comments)} comments", interactive=len(comments) >= 5, variant="primary")
+        clear_botton = gr.Button("Clear comments", interactive=len(comments) != 0)
+        return extract_vp_botton, clear_botton, comments
+
+    @spaces.GPU(duration=120)
+    def extract_vp_from_vpe(comments):
+        if len(comments) < 8:
+            gr.Warning("Fewer than 8 comments may lead to errors.")
+
+        keys =  list(comments.keys())
+        random.shuffle(keys)
+        comments = [(key, comments[key]) for key in keys]
+
+        prompt = """I will provide a set of artworks along with accompanying comments from a person. Analyze these artworks and the comments on them and identify artistic features such as present or mentioned colors, style, composition, mood, medium, texture, brushwork, lighting, shadow effects, perspective, and other noteworthy elements.
+    Your task is to extract the artistic features the person likes and dislikes based on both the artworks' features and the person's comments. Focus solely on artistic aspects and refrain from considering subject matter.
+    If the person expresses a preference for a specific aspect without clearly stating its category (e.g., appreciating the colors without specifying which colors), identify these specific features from the images directly to make the person's preference understandable without needing to see the artwork.
+    Your output should consist of two concise lists of keywords: one listing the specific art features the person likes and another listing the specific features they dislike (specified in keyword format without using sentences).
+    Here are the images and their corresponding comments:
+    """
         messages = [
             {
                 "role": "user",
@@ -404,30 +326,11 @@ Follow the example format and ensure that your output consists of two lists of k
         comment_number = 1
         for image in comments:
             comment = comments[image]
-            if not image.lower().endswith(".jpg"):
-                jpg_image_path = image.replace("png", "jpg")
-                image = Image.open(image)
-                rgb_img = image.convert("RGB")
-                rgb_img.save(jpg_image_path, format="JPEG")
-                with open(jpg_image_path, "rb") as image_file:
-                    image = base64.b64encode(image_file.read()).decode("utf-8")
-            
-            else:
-                with open(image_path, "rb") as image_file:
-                    image = base64.b64encode(image_file.read()).decode("utf-8")
+            image = Image.open(image)
+            images.append(image)
 
             messages[0]["content"].append(
-                {"type": "text",
-                "text": f"Image {comment_number}:"}
-            )
-    
-            messages[0]["content"].append(
-                {"type": "image",
-                "source": {
-                        "type": "base64",
-                        "media_type": "image/jpeg",
-                        "data": image,
-                    },}
+                {"type": "image"}
             )
 
             messages[0]["content"].append(
@@ -436,111 +339,265 @@ Follow the example format and ensure that your output consists of two lists of k
             )
             comment_number = comment_number + 1
 
-        message = client.messages.create(
-            model="claude-3-5-sonnet-20240620",
-            max_tokens=1024,
-            messages=messages
-        )
+        prompt = processor.apply_chat_template(messages, add_generation_prompt=True)
+        inputs = processor(text=prompt, images=images, return_tensors="pt")
+        inputs = {k: v.to(device) for k, v in inputs.items()}
+
+        generated_ids = vpe_model.generate(**inputs, max_new_tokens=2000, repetition_penalty=0.99, do_sample=False)
+        generated_texts = processor.batch_decode(generated_ids, skip_special_tokens=True)[0]
+
+        if re.match(r"(.|\n)*Assistant: Liked Art Features: (.|\n)*Disliked Art Features: (.|\n)*", generated_texts):
+            positive_vp, negative_vp = re.search('.* \nAssistant: Liked Art Features: (.*)\nDisliked Art Features: (.*)', generated_texts).groups()
+            positive_vp = positive_vp.split(", ")
+            negative_vp = negative_vp.split(", ")
+            common = list(set(positive_vp).intersection(negative_vp))
+
+            for vp in positive_vp:
+                if vp in common:
+                    positive_vp.remove(vp)
 
-        generated_text = message.content[0].text
-        if re.match(r"(.|\n)*Like.*:(.|\n)*Dislike.(.|\n)*", generated_texts):
-            positive_vp, negative_vp = re.search('.*Like.*:\n(.*)\n*Dislike.*:\n(.*)', generated_text).groups()
+            for vp in negative_vp:
+                if vp in common:
+                    negative_vp.remove(vp)
+
+            positive_vp = ", ".join(positive_vp)
+            negative_vp = ", ".join(negative_vp)
             gr.Info("Visual preference successfully extracted.")
         else:
             positive_vp = ""
             negative_vp = ""
             gr.Warning("VP extraction failed: Please comment on more images.")
-    
-    return gr.Textbox(label="Liked visual attributes", lines=3, value=positive_vp, interactive=True), gr.Textbox(label="Disliked visual attributes", lines=1, value=negative_vp, interactive=True), gr.Button("Run personalized generation", scale=0, interactive=True, variant="primary")
 
-def api_fn(api):
-    global valid_api
-    client = anthropic.Anthropic(
-        api_key=api,
-    )
-    try:
-        message = client.messages.create(
-            model="claude-3-5-sonnet-20240620",
-            max_tokens=1024,
-            messages=[
-                {"role": "user", "content": "Hello, Claude"}
+        return positive_vp, negative_vp
+
+    def extract_vp(comments):
+
+        if valid_api == "":
+            positive_vp, negative_vp = extract_vp_from_vpe(comments)
+
+        else:
+            client = anthropic.Anthropic(
+                api_key=valid_api,
+            )
+
+            prompt = """**Objective:**
+    Analyze a set of artworks and accompanying comments from a person to identify artistic features they like and dislike.
+    **Steps:**
+    1. **Analyze Artworks and Comments:**
+       - Examine each artwork for artistic features such as colors, style, composition, mood, medium, texture, brushwork, lighting, shadow effects, perspective, and other noteworthy elements.
+       - Review the accompanying comments to understand the person's preferences and opinions on these features.
+    2. **Identify Preferences:**
+       - Extract artistic features that the person likes and dislikes based on the artworks' features and the comments.
+       - Focus solely on artistic aspects and ignore the subject matter.
+       - Convert the art features mentioned in the comments to well-known synonyms if needed.
+    3. **Resolve Ambiguous Preferences:**
+       - If the person expresses a preference without clearly stating its category (e.g., "I like the style" without specifying which style), identify these specific features from the images directly.
+       - Make the person's preference understandable and independednt of the artworks.
+    4. **Output Format:**
+       - Create two concise lists of keywords: one for features the person likes and another for features they dislike.
+       - Ensure the lists are in keyword format, divided by commas, without using sentences.
+       - Maintain detail and accuracy for all comments and images.
+    **Your Task:**
+    Follow the example format and ensure that your output consists of two lists of keywords summarizing the person's preferences based on the artworks and comments provided. Consider all comments and images comprehensively.
+    **Example**: example START:
+    """
+            messages = [
+                {
+                    "role": "user",
+                    "content": [
+                        {"type": "text", 
+                        "text": prompt},
+                    ]
+                }
             ]
+            images = []
+            comment_number = 1
+            for image in comments:
+                comment = comments[image]
+                if not image.lower().endswith(".jpg"):
+                    jpg_image_path = image.replace("png", "jpg")
+                    image = Image.open(image)
+                    rgb_img = image.convert("RGB")
+                    rgb_img.save(jpg_image_path, format="JPEG")
+                    with open(jpg_image_path, "rb") as image_file:
+                        image = base64.b64encode(image_file.read()).decode("utf-8")
+
+                else:
+                    with open(image_path, "rb") as image_file:
+                        image = base64.b64encode(image_file.read()).decode("utf-8")
+
+                messages[0]["content"].append(
+                    {"type": "text",
+                    "text": f"Image {comment_number}:"}
+                )
+
+                messages[0]["content"].append(
+                    {"type": "image",
+                    "source": {
+                            "type": "base64",
+                            "media_type": "image/jpeg",
+                            "data": image,
+                        },}
+                )
+
+                messages[0]["content"].append(
+                    {"type": "text", 
+                     "text": f"Comment {comment_number}: {comment}"}
+                )
+                comment_number = comment_number + 1
+
+            message = client.messages.create(
+                model="claude-3-5-sonnet-20240620",
+                max_tokens=1024,
+                messages=messages
+            )
+
+            generated_text = message.content[0].text
+            if re.match(r"(.|\n)*Like.*:(.|\n)*Dislike.(.|\n)*", generated_texts):
+                positive_vp, negative_vp = re.search('.*Like.*:\n(.*)\n*Dislike.*:\n(.*)', generated_text).groups()
+                gr.Info("Visual preference successfully extracted.")
+            else:
+                positive_vp = ""
+                negative_vp = ""
+                gr.Warning("VP extraction failed: Please comment on more images.")
+
+        return gr.Textbox(label="Liked visual attributes", lines=3, value=positive_vp, interactive=True), gr.Textbox(label="Disliked visual attributes", lines=1, value=negative_vp, interactive=True), gr.Button("Run personalized generation", scale=0, interactive=True, variant="primary"), comments
+
+    def api_fn(api):
+        global valid_api
+        client = anthropic.Anthropic(
+            api_key=api,
         )
-        gr.Info("Valid API")
-        valid_api = api
-
-    except anthropic.AuthenticationError:
-        gr.Warning("Invalid API!")
-        valid_api = ""
-
-    except anthropic.BadRequestError:
-        gr.Warning("Invalid API!")
-        valid_api = ""
-
-    except anthropic.PermissionDeniedError:
-        gr.Warning("Invalid API!")
-        valid_api = ""
-
-    except anthropic.RateLimitError:
-        gr.Warning("Invalid API!")
-        valid_api = ""
-        
-
-def generate_out(prompt, vp_pos, vp_neg, slider, example_prompt, gallery, num_inference_steps, seed, randomize_seed):
-    if vp_pos == "" and vp_neg == "":
-        gr.Warning("Visual preference is empty.", duration=10)
-        
-    return generate(prompt, vp_pos, vp_neg, slider, example_prompt, gallery, num_inference_steps, seed, randomize_seed)
-
-@spaces.GPU(duration=45)
-def generate(prompt, vp_pos, vp_neg, slider, example_prompt, gallery, num_inference_steps, seed, randomize_seed):
-    if vp_pos == "" and vp_neg == "":
-        slider = 0
-
-    for filter in word_list:
-        if re.search(rf"\b{filter}\b", prompt):
-            raise gr.Error("Please try again with a different prompt")
-        if re.search(rf"\b{filter}\b", vp_pos) or re.search(rf"\b{filter}\b", vp_neg):
-            raise gr.Error("Please try again with a different visual preference")
-
-    if vp_pos != "":
-        vp_pos = vp_pos.split(", ")
-        random.shuffle(vp_pos)
-        vp_pos = ", ".join(vp_pos)
-
-    if vp_neg != "":
-        vp_neg = vp_neg.split(", ")
-        random.shuffle(vp_neg)
-        vp_neg = ", ".join(vp_neg)
-
-    if randomize_seed:
-        seed = random.randint(0, MAX_SEED)
-        
-    generator = torch.Generator().manual_seed(seed)
-
-    if prompt is None:
-        promtpt = ""
-    
-    image = pipe(prompt=prompt, 
-                num_inference_steps=num_inference_steps, 
-                vp_pos=vp_pos, 
-                vp_neg=vp_neg, 
-                vp_degree_pos=slider,
-                vp_degree_neg=slider,
-                generator=generator
-    ).images[0]
-
-    global example_prompts, examples
-    if prompt in example_prompts:
-        while example_prompts[0] != prompt:
-            example_prompts.append(example_prompts[0])
-            example_prompts = example_prompts[1:]
+        try:
+            message = client.messages.create(
+                model="claude-3-5-sonnet-20240620",
+                max_tokens=1024,
+                messages=[
+                    {"role": "user", "content": "Hello, Claude"}
+                ]
+            )
+            gr.Info("Valid API")
+            valid_api = api
+
+        except anthropic.AuthenticationError:
+            gr.Warning("Invalid API!")
+            valid_api = ""
+
+        except anthropic.BadRequestError:
+            gr.Warning("Invalid API!")
+            valid_api = ""
+
+        except anthropic.PermissionDeniedError:
+            gr.Warning("Invalid API!")
+            valid_api = ""
+
+        except anthropic.RateLimitError:
+            gr.Warning("Invalid API!")
+            valid_api = ""
+
+
+    def generate_out(prompt, vp_pos, vp_neg, slider, example_prompt, gallery, num_inference_steps, seed, randomize_seed):
+        if vp_pos == "" and vp_neg == "":
+            gr.Warning("Visual preference is empty.", duration=10)
+
+        return generate(prompt, vp_pos, vp_neg, slider, example_prompt, gallery, num_inference_steps, seed, randomize_seed)
+
+    @spaces.GPU(duration=45)
+    def generate(prompt, vp_pos, vp_neg, slider, example_prompt, gallery, num_inference_steps, seed, randomize_seed):
+        if vp_pos == "" and vp_neg == "":
+            slider = 0
+
+        for filter in word_list:
+            if re.search(rf"\b{filter}\b", prompt):
+                raise gr.Error("Please try again with a different prompt")
+            if re.search(rf"\b{filter}\b", vp_pos) or re.search(rf"\b{filter}\b", vp_neg):
+                raise gr.Error("Please try again with a different visual preference")
+
+        if vp_pos != "":
+            vp_pos = vp_pos.split(", ")
+            random.shuffle(vp_pos)
+            vp_pos = ", ".join(vp_pos)
+
+        if vp_neg != "":
+            vp_neg = vp_neg.split(", ")
+            random.shuffle(vp_neg)
+            vp_neg = ", ".join(vp_neg)
+
+        if randomize_seed:
+            seed = random.randint(0, MAX_SEED)
+
+        generator = torch.Generator().manual_seed(seed)
+
+        if prompt is None:
+            promtpt = ""
+
+        image = pipe(prompt=prompt, 
+                    num_inference_steps=num_inference_steps, 
+                    vp_pos=vp_pos, 
+                    vp_neg=vp_neg, 
+                    vp_degree_pos=slider,
+                    vp_degree_neg=slider,
+                    generator=generator
+        ).images[0]
+
+        global example_prompts, examples
+        if prompt in example_prompts:
+            while example_prompts[0] != prompt:
+                example_prompts.append(example_prompts[0])
+                example_prompts = example_prompts[1:]
+
+            example_prompt = gr.Markdown(f"Prompt: {example_prompts[0]}")
+            if len(examples[example_prompts[0]]) == 10:
+                examples[example_prompts[0]] = examples[example_prompts[0]][:-1]
+
+            examples[example_prompts[0]].append(image)
+            gallery = gr.Gallery(
+                value=examples[example_prompts[0]],
+                label="", 
+                show_label=False,
+                columns=[5],
+                rows=[2], 
+                object_fit="contain", 
+                height=500)
+
+        return image, example_prompt, gallery
+
+    def change_vp(extract_vp):
+        return
+
+    def upload_file(files):
+        global mioo
+        file_path = [file.name for file in files][0]
+        comment_images = [file_path] + comment_images
+
+        next_comment = ""
+        return gr.Image(value=mioo[0], label=f"image {0+1}/{len(mioo)}", show_label=True), gr.Text(label="Comment", show_label=False, lines=4, max_lines=5, placeholder="Enter your comment. The more detailed the better.", value=next_comment, container=False)
+
+    def next_prompt():
+        global example_prompts, examples
+        example_prompts.append(example_prompts[0])
+        example_prompts = example_prompts[1:]
 
         example_prompt = gr.Markdown(f"Prompt: {example_prompts[0]}")
-        if len(examples[example_prompts[0]]) == 10:
-            examples[example_prompts[0]] = examples[example_prompts[0]][:-1]
+        gallery = gr.Gallery(
+            value=examples[example_prompts[0]],
+            label="", 
+            show_label=False,
+            columns=[5],
+            rows=[2], 
+            object_fit="contain", 
+            height=500)
+
+        return example_prompt, gallery
 
-        examples[example_prompts[0]].append(image)
+    def previous_prompt():
+        global example_prompts, examples
+        example_prompts = example_prompts[::-1]
+        example_prompts.append(example_prompts[0])
+        example_prompts = example_prompts[1:]
+        example_prompts = example_prompts[::-1]
+
+        example_prompt = gr.Markdown(f"Prompt: {example_prompts[0]}")
         gallery = gr.Gallery(
             value=examples[example_prompts[0]],
             label="", 
@@ -550,56 +607,9 @@ def generate(prompt, vp_pos, vp_neg, slider, example_prompt, gallery, num_infere
             object_fit="contain", 
             height=500)
 
-    return image, example_prompt, gallery
-
-def change_vp(extract_vp):
-    return
-
-def upload_file(files):
-    global comment_images, image_index
-    file_path = [file.name for file in files][0]
-    comment_images = [file_path] + comment_images
-
-    next_comment = ""
-    return gr.Image(value=comment_images[0], label=f"image {image_index+1}/{len(comment_images)}", show_label=True), gr.Text(label="Comment", show_label=False, lines=4, max_lines=5, placeholder="Enter your comment. The more detailed the better.", value=next_comment, container=False)
-
-def next_prompt():
-    global example_prompts, examples
-    example_prompts.append(example_prompts[0])
-    example_prompts = example_prompts[1:]
-
-    example_prompt = gr.Markdown(f"Prompt: {example_prompts[0]}")
-    gallery = gr.Gallery(
-        value=examples[example_prompts[0]],
-        label="", 
-        show_label=False,
-        columns=[5],
-        rows=[2], 
-        object_fit="contain", 
-        height=500)
-
-    return example_prompt, gallery
-
-def previous_prompt():
-    global example_prompts, examples
-    example_prompts = example_prompts[::-1]
-    example_prompts.append(example_prompts[0])
-    example_prompts = example_prompts[1:]
-    example_prompts = example_prompts[::-1]
-
-    example_prompt = gr.Markdown(f"Prompt: {example_prompts[0]}")
-    gallery = gr.Gallery(
-        value=examples[example_prompts[0]],
-        label="", 
-        show_label=False,
-        columns=[5],
-        rows=[2], 
-        object_fit="contain", 
-        height=500)
-
-    return example_prompt, gallery
+        return example_prompt, gallery
 
-with gr.Blocks(css=css, title="ViPer Demo", theme=gr.themes.Base()) as demo:
+    ###############################################
     with gr.Column(elem_id="title-container"):
         gr.Markdown(f"""
                 # **ViPer: Visual Personalization of Generative Models via Individual Preference Learning**
@@ -638,7 +648,7 @@ with gr.Blocks(css=css, title="ViPer Demo", theme=gr.themes.Base()) as demo:
                     value="I adore the blue and greenish-blue palette, blue Dianne, and dark colors of this image. I also appreciate the Hergé inspiration in this artwork. However, I would have preferred a more complex and adventurous concept rather than a simple landscape. I wish it was more surreal and creepy.",
                 )
     
-            comment_image = gr.Image(value=comment_images[0], label=f"image {image_index+1}/{len(comment_images)}", show_label=True)
+            comment_image = gr.Image(value=mioo[0], label=f"image {0+1}/{len(mioo)}", show_label=True)
                       
             comment = gr.Text(
                 label="Comment",
@@ -658,7 +668,7 @@ with gr.Blocks(css=css, title="ViPer Demo", theme=gr.themes.Base()) as demo:
 
             with gr.Row():
                 upload_button = gr.UploadButton("Click to upload images 📤", file_types=["image"], file_count="multiple")
-                clear_botton = gr.Button("Clear comments 🗑", interactive=len(comments) != 0)
+                clear_botton = gr.Button("Clear comments 🗑", interactive=False)
 
             with gr.Accordion("Enter Claude API (optional)", open=False):
                 gr.Markdown("By default, we extract visual preferences from user comments using a fine-tuned HuggingFaceM4/idefics2-8b model. Optionally, you can experiment with using claude-3-5-sonnet for visual preference extraction by entering your API key below.")
@@ -671,7 +681,7 @@ with gr.Blocks(css=css, title="ViPer Demo", theme=gr.themes.Base()) as demo:
                     
                     api_button = gr.Button("Enter", scale=0)
     
-            extract_vp_botton = gr.Button(f"Extract visual preference from {len(comments)} comments", interactive=len(comments) != 0, variant="primary")
+            extract_vp_botton = gr.Button(f"Extract visual preference from {0} comments", interactive=False, variant="primary")
 
         with gr.Column(elem_id="gen-container"):
             positive_extracted_vp = gr.Textbox(
@@ -746,26 +756,26 @@ with gr.Blocks(css=css, title="ViPer Demo", theme=gr.themes.Base()) as demo:
             
     submit_comment_button.click(
         fn = submit_comment,
-        inputs = [comment],
-        outputs = [comment_image, comment, extract_vp_botton, clear_botton]
+        inputs = [comment, comments, comment_images, image_index],
+        outputs = [comment_image, comment, extract_vp_botton, clear_botton, comments, comment_images, image_index]
     )
 
     previous_image_botton.click(
         fn = previous_image,
-        inputs = [],
-        outputs = [comment_image, comment]
+        inputs = [comments, comment_images, image_index],
+        outputs = [comment_image, comment, comments, comment_images, image_index]
     )
 
     next_image_botton.click( 
         fn = next_image,
-        inputs = [],
-        outputs = [comment_image, comment]
+        inputs = [comments, comment_images, image_index],
+        outputs = [comment_image, comment, comments, comment_images, image_index]
     )
 
     extract_vp_botton.click(
         fn = extract_vp,
-        inputs = [],
-        outputs = [positive_extracted_vp, negative_extracted_vp, run_button]
+        inputs = [comments],
+        outputs = [positive_extracted_vp, negative_extracted_vp, run_button, comments]
     )
 
     api_button.click(
@@ -794,14 +804,8 @@ with gr.Blocks(css=css, title="ViPer Demo", theme=gr.themes.Base()) as demo:
 
     clear_botton.click(
         fn = clear_comments,
-        inputs = [],
-        outputs = [extract_vp_botton, clear_botton]
-    )
-
-    upload_button.upload(
-        upload_file, 
-        upload_button, 
-        [comment_image, comment]
+        inputs = [comments],
+        outputs = [extract_vp_botton, clear_botton, comments]
     )
 
     next_prompt_button.click(
@@ -816,4 +820,10 @@ with gr.Blocks(css=css, title="ViPer Demo", theme=gr.themes.Base()) as demo:
         outputs = [example_prompt, gallery]
     )
 
+    upload_button.upload(
+        upload_file, 
+        upload_button, 
+        [comment_image, comment]
+    )
+
 demo.launch(share=True)