From c0411ef4a866a063fb6407ded9d25fc32a541f8b Mon Sep 17 00:00:00 2001
From: Sakamoto Shiina <68018796+ShiinaSakamoto@users.noreply.github.com>
Date: Wed, 14 Aug 2024 13:55:56 +0900
Subject: [PATCH] [Update/bugfix] About VRCT: Poster showcase worlds. Fix
 clickable range to expand. And replace the link "Twitter" to "X".

---
 .../PosterShowcaseWorldsContents.jsx          | 24 ++++++++++---------
 1 file changed, 13 insertions(+), 11 deletions(-)

diff --git a/src-ui/app/config_page/setting_section/setting_box/about_vrct/poster_showcase_contents/poster_showcase_worlds_contents/PosterShowcaseWorldsContents.jsx b/src-ui/app/config_page/setting_section/setting_box/about_vrct/poster_showcase_contents/poster_showcase_worlds_contents/PosterShowcaseWorldsContents.jsx
index c088040f..e18b27e3 100644
--- a/src-ui/app/config_page/setting_section/setting_box/about_vrct/poster_showcase_contents/poster_showcase_worlds_contents/PosterShowcaseWorldsContents.jsx
+++ b/src-ui/app/config_page/setting_section/setting_box/about_vrct/poster_showcase_contents/poster_showcase_worlds_contents/PosterShowcaseWorldsContents.jsx
@@ -26,26 +26,28 @@ export const PosterShowcaseWorldsContents = () => {
         <div className={styles.container}>
             <div className={styles.poster_showcase_world_container}>
                 {target_poster_showcase_world_images.map((poster, index) => {
-                    let content = (
+                    const class_names = clsx(styles.poster_showcase_world_wrapper, {
+                        [styles.clickable]: (poster.x_post_num !== null)
+                    });
+
+                    const content = (
                         <div className={styles.poster_showcase_world_img} >
                             <img style={ {height: "100%", width: "100%", "objectFit": "contain" }} src={poster.img} />
                         </div>
                     );
                     if (poster.x_post_num !== null) {
-                        content = (
-                            <a href={`https://twitter.com/Shiina_12siy/status/${poster.x_post_num}`} target="_blank" rel="noreferrer" >
+                        return (
+                            <a href={`https://x.com/Shiina_12siy/status/${poster.x_post_num}`} target="_blank" rel="noreferrer"  className={class_names} key={index}>
                                 {content}
                             </a>
                         );
+                    } else {
+                        return (
+                            <div className={class_names} key={index}>
+                                {content}
+                            </div>
+                        );
                     }
-                    const class_names = clsx(styles.poster_showcase_world_wrapper, {
-                        [styles.clickable]: (poster.x_post_num !== null)
-                    });
-                    return (
-                        <div className={class_names} key={index}>
-                            {content}
-                        </div>
-                    );
                 })}
             </div>
             <PosterShowcaseWorldsPagination page_length={chunked_poster_showcase_world_images.length}/>