feat(FE): 이미지 클릭 시 코드 + 리뷰 모달이 올라오는 기능 추가 (#354)

client/src/components/commons/ProgressiveImage/ProgressiveImage.tsx

@@ -1,6 +1,9 @@
-import React from "react";
+import React, { useCallback, useContext } from "react";
 
 import useImageIntersect from "@/hooks/useImageIntersect";
+import useCommonModalStore from "@/store/useCommonModalStore";
+import ReviewModal from "@/components/main/Modal/ReviewModal/ReviewModal";
+import { PostContext } from "@/components/main/PostScroll/Post/Post";
 
 interface ProgressiveImageProps {
   className: string;
@@ -20,12 +23,19 @@ const ProgressiveImage = ({
   alt,
 }: ProgressiveImageProps): JSX.Element => {
   const { observeImage } = useImageIntersect();
+  const { id: postId, code, language } = useContext(PostContext);
+  const [openModal] = useCommonModalStore((state) => [state.openModal]);
+
+  const handleOpenReviewModal = useCallback(() => {
+    openModal(<ReviewModal postId={postId} code={code} language={language} />);
+  }, [openModal]);
 
   return (
     <img
       ref={observeImage}
       className={`progressive-image ${className}`}
       src={placeholder}
+      onClick={handleOpenReviewModal}
       data-lazysrc={src}
       width={width}
       height={height}

client/src/components/main/PostScroll/Post/PostImageSlider/PostImageSlider.scss

@@ -8,6 +8,7 @@
   &--image {
     width: inherit;
     height: inherit;
+    cursor: pointer;
     object-fit: cover; // 가로-세로 비율 맞춰서 꽉 차게
   }
 }