From 3385f1457d5d0d7c37b8e227cd6d58a247fea3c2 Mon Sep 17 00:00:00 2001
From: jhynsoo <jhynsoo@gmail.com>
Date: Thu, 9 Nov 2023 16:09:16 +0900
Subject: [PATCH] style: Change post detail page layout

---
 src/components/Graph/ProductPriceGraph.jsx |  2 +-
 src/pages/PostDetail/index.jsx             | 35 ++++------------------
 2 files changed, 6 insertions(+), 31 deletions(-)

diff --git a/src/components/Graph/ProductPriceGraph.jsx b/src/components/Graph/ProductPriceGraph.jsx
index 9a32c80..d53d38b 100644
--- a/src/components/Graph/ProductPriceGraph.jsx
+++ b/src/components/Graph/ProductPriceGraph.jsx
@@ -80,7 +80,7 @@ const ProductPriceGraph = ({ id }) => {
         ></Line>
       </S.GraphArea>
       <S.Text>
-        최근 6개월간 최저 <span>{minPriceString}원</span>
+        최근 6개월간 최저가 <span>{minPriceString}원</span>
       </S.Text>
     </S.ProductPriceGraph>
   );
diff --git a/src/pages/PostDetail/index.jsx b/src/pages/PostDetail/index.jsx
index 6027552..a98a805 100644
--- a/src/pages/PostDetail/index.jsx
+++ b/src/pages/PostDetail/index.jsx
@@ -11,20 +11,9 @@ import ProductPriceGraph from '../../components/Graph/ProductPriceGraph';
 import { SubTitle } from '../../styles/Common.styles';
 import ButtonArea from '../../components/ButtonArea';
 import Button from '../../components/Button';
-import Spacer from '../../components/Spacer';
 import { useOverlay } from '@toss/use-overlay';
-import { Dialog, Slide } from '@mui/material';
-import React, { Suspense } from 'react';
-
-const Transition = React.forwardRef(function Transition(props, ref) {
-  return (
-    <Slide
-      direction="up"
-      ref={ref}
-      {...props}
-    />
-  );
-});
+import { Suspense } from 'react';
+import CustomDialog from '../../components/CustomDialog';
 
 const PostDetail = () => {
   const overlay = useOverlay();
@@ -32,29 +21,15 @@ const PostDetail = () => {
   const { data } = usePost(id);
   const openOverlay = () => {
     overlay.open(({ isOpen, close }) => (
-      <Dialog
+      <CustomDialog
         open={isOpen}
         onClose={close}
-        TransitionComponent={Transition}
-        PaperProps={{
-          style: {
-            padding: '8px 24px 24px 24px',
-            borderRadius: '20px',
-          },
-        }}
-        slotProps={{
-          backdrop: {
-            style: {
-              backdropFilter: 'blur(5px)',
-            },
-          },
-        }}
+        title={'최근 거래 가격'}
       >
-        <SubTitle>최근 거래 가격</SubTitle>
         <Suspense fallback={<></>}>
           <ProductPriceGraph id={data.product.id} />
         </Suspense>
-      </Dialog>
+      </CustomDialog>
     ));
   };