refactor: 미사용 코드 수정, 홈으로 가기 안내 모달 연결

Author: sikkzz

public/assets/img/img-grahic-receipt.png

@@ -1,13 +1,8 @@
 import styles from "@/components/Home/Home.module.scss";
-import HomeNavigateConfirmModal from "@/components/HomeNavigateConfirmModal/HomeNavigateConfirmModal";
 import IconButton from "@/components/ui/IconButton/IconButton";
 import Text from "@/components/ui/Text/Text";
 
-import { useOverlay } from "@/hooks/common/useOverlay";
-
 const Home = () => {
-  const { isOpen, handleClose, handleOpen } = useOverlay();
-
   return (
     <div className={styles.Home}>
       <div className={styles.HomeTitle}>
@@ -22,11 +17,9 @@ const Home = () => {
         <img src="/assets/img/img-graphic-logo.png" alt="mainLogo" />
       </div>
       <div className={styles.HomeBottom}>
-        <IconButton text="갤러리" iconName="gallery" onClick={handleOpen} />
+        <IconButton text="갤러리" iconName="gallery" />
         <IconButton text="카메라" iconName="camera" />
       </div>
-
-      <HomeNavigateConfirmModal isOpen={isOpen} handleClose={handleClose} />
     </div>
   );
 };

public/assets/img/img-style-trust-cute.png

@@ -1,13 +1,14 @@
 .ReceiptResult {
   padding: 1.25rem;
-
+  padding-bottom: 2.5rem;
   height: calc(100vh - 2.75rem);
   overflow: hidden;
   position: relative;
   display: flex;
   flex-direction: column;
   background: var(--color-bg-gradient);
   justify-content: space-between;
+
   &::before {
     content: "";
     background: url("/src/assets/svg/img-graphic-main.svg") center no-repeat;

src/components/Home/Home.tsx

@@ -2,14 +2,19 @@ import { useEffect } from "react";
 
 import confetti from "canvas-confetti";
 
+import HomeNavigateConfirmModal from "@/components/HomeNavigateConfirmModal/HomeNavigateConfirmModal";
 import styles from "@/components/ReceiptResult/ReceiptResult.module.scss";
 import Button from "@/components/ui/Button/Button";
 import IconButton from "@/components/ui/IconButton/IconButton";
 import Text from "@/components/ui/Text/Text";
 
+import { useOverlay } from "@/hooks/common/useOverlay";
+
 import type { Options as ConfettiOptions } from "canvas-confetti";
 
 const ReceiptResult = () => {
+  const { isOpen, handleClose, handleOpen } = useOverlay();
+
   const handleConfetti = () => {
     const setting: ConfettiOptions = {
       particleCount: 100,
@@ -32,7 +37,7 @@ const ReceiptResult = () => {
     <div className={styles.ReceiptResult}>
       <div className={styles.Top}>
         <div className={styles.ReceiptImage}>
-          <img src="/src/assets/img/img-style-cute-circle.png" alt="mainLogo" />
+          <img src="/assets/img/img-style-cute-circle.png" alt="mainLogo" />
         </div>
         <div className={styles.TitleBox}>
           <Text variant="titleM" color="gradient" as="h1" truncated>
@@ -51,8 +56,10 @@ const ReceiptResult = () => {
       </div>
       <div className={styles.Bottom}>
         <Button text="다시생성" variant="secondary" />
-        <Button text="홈으로 가기" />
+        <Button text="홈으로 가기" onClick={handleOpen} />
       </div>
+
+      <HomeNavigateConfirmModal isOpen={isOpen} handleClose={handleClose} />
     </div>
   );
 };

src/components/ReceiptEdit/ReceiptEdit.module.css

@@ -1,10 +1,15 @@
+import Navbar from "@/components/common/Navbar/Navbar";
 import ReceiptResult from "@/components/ReceiptResult/ReceiptResult";
-// import ArrowNavbar from "@/components/ui/ArrowNavbar/ArrowNavbar";
+import Icon from "@/components/ui/Icon/Icon";
 
 export default function ReceiptResultPage() {
   return (
     <>
-      {/* <ArrowNavbar /> */}
+      <Navbar>
+        <Navbar.LeftButton>
+          <Icon name="leftArrow" />
+        </Navbar.LeftButton>
+      </Navbar>
       <ReceiptResult />
     </>
   );