fix: stop stopPropagation on Media Imag

Signed-off-by: Innei <i@innei.in>
RSSNext · Aug 1, 2024 · a92f96b · a92f96b
1 parent a931e85
commit a92f96b
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 8 deletions.
diff --git a/src/renderer/src/components/ui/media.tsx b/src/renderer/src/components/ui/media.tsx
@@ -70,7 +70,6 @@ const MediaImpl: FC<MediaProps> = ({
   const previewMedia = usePreviewMedia()
   const handleClick = useEventCallback((e: React.MouseEvent) => {
     if (popper && src) {
-      e.stopPropagation()
       previewMedia(
         [
           {

diff --git a/src/renderer/src/components/ui/media/swipe-media.tsx b/src/renderer/src/components/ui/media/swipe-media.tsx
@@ -82,7 +82,10 @@ export function SwipeMedia({
                     height: 600,
                   }}
                   disableContextMenu
-                  onClick={() => onPreview?.(uniqMedia, i)}
+                  onClick={(e) => {
+                    e.stopPropagation()
+                    onPreview?.(uniqMedia, i)
+                  }}
                 />
               </SwiperSlide>
             ))}
@@ -105,7 +108,10 @@ export function SwipeMedia({
       ) : uniqMedia?.length >= 1 ?
           (
             <Media
-              onClick={() => onPreview?.(uniqMedia)}
+              onClick={(e) => {
+                e.stopPropagation()
+                onPreview?.(uniqMedia)
+              }}
               className="size-full rounded-none object-cover sm:transition-transform sm:duration-300 sm:ease-in-out sm:group-hover:scale-105"
               alt="cover"
               src={uniqMedia[0].url}

diff --git a/src/renderer/src/modules/entry-column/social-media-item.tsx b/src/renderer/src/modules/entry-column/social-media-item.tsx
@@ -87,8 +87,8 @@ export const SocialMediaItem: EntryListItemFC = ({
                 height: 224,
               }}
               onClick={(e) => {
-                previewMedia(mediaList, i)
                 e.stopPropagation()
+                previewMedia(mediaList, i)
               }}
             />
           ))}
@@ -119,14 +119,15 @@ const ActionBar = ({ entryId }: { entryId: string }) => {
   return (
     <div className="flex origin-right scale-90 items-center gap-1">
       {items
-        .filter((item) => !item.disabled && (item.key !== "read" && item.key !== "unread"))
+        .filter(
+          (item) =>
+            !item.disabled && item.key !== "read" && item.key !== "unread",
+        )
         .map((item) => (
           <ActionButton
             icon={
               item.icon ? (
-                <Slot className="size-4">
-                  {item.icon}
-                </Slot>
+                <Slot className="size-4">{item.icon}</Slot>
               ) : (
                 <i className={item.className} />
               )