Merge pull request #182 from FRONTENDSCHOOL5/feature-181

[리팩토링] ProductUpload 페이지 헤더 변경
FRONTENDSCHOOL5 · Oct 11, 2023 · c429e29 · c429e29
2 parents c0a5d79 + 8ec1348
commit c429e29
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 22 deletions.
diff --git a/src/components/common/Header/Header.jsx b/src/components/common/Header/Header.jsx
@@ -17,20 +17,31 @@ export function HeaderBasicNav({ children, disabled }) {
   //주소가 postupload 일 때만 업로드 버튼 랜더링
   const pathName = window.location.pathname;
   const isPostUpLoad = pathName == '/postupload';
+  const isProductUpLoad = pathName == '/product';
 
   // 뒤로가기 버튼 구현하기;
   return (
     <HeaderDefaultStyle>
       <Arrow />
-      {!isPostUpLoad ? (
+      {(!isPostUpLoad && !isProductUpLoad) ? (
         <MoreIconButton />
       ) : (
         <ButtonShort disabled={disabled}>{children}</ButtonShort>
       )}
+
     </HeaderDefaultStyle>
   );
 }
 
+// export function HeaderUploadNav({ disabled, children }) {
+//     return (
+//         <HeaderDefaultStyle>
+//             <Arrow />
+//             <ButtonShort disabled={disabled}>{children}</ButtonShort>
+//         </HeaderDefaultStyle>
+//     );
+// }
+
 //상단 화살표 스타일
 const arrow = () => {
   return {
@@ -92,15 +103,6 @@ export function HeaderMainNav({ content }) {
   );
 }
 
-export function HeaderUploadNav(props) {
-  const { disabled, content } = props;
-  return (
-    <HeaderDefaultStyle>
-      <Arrow />
-      <ButtonShort disabled={disabled} content={content} />
-    </HeaderDefaultStyle>
-  );
-}
 
 export function HeaderEditdNav({ content, isFormValid, handleSave }) {
   return (

diff --git a/src/components/common/button/Button.jsx b/src/components/common/button/Button.jsx
@@ -48,11 +48,10 @@ const ButtonMiddleStyle = styled.button`
 `;
 
 // 짧은 버튼
-export const ButtonShort = props => {
-  const { disabled, handleSave, content, isFormValid } = props;
+export const ButtonShort = ({disabled, children}) => {
   return (
-    <ButtonShortStyle content={content} disabled={disabled} {...props}>
-      {props.children}
+    <ButtonShortStyle disabled={disabled}>
+      {children}
     </ButtonShortStyle>
   );
 };

diff --git a/src/pages/ProductPage/ProductPage.jsx b/src/pages/ProductPage/ProductPage.jsx
@@ -1,36 +1,30 @@
 import React, { useState, useEffect } from 'react';
-import axios from 'axios';
 import styled from 'styled-components';
 import Input from '../../components/common/Input/Input';
 import { useNavigate } from 'react-router-dom';
 import { useRecoilValue } from 'recoil';
-import BodyGlobal from '../../styles/BodyGlobal';
 import authAtom from '../../atom/authToken';
 
 import FileUploadInput from '../../components/common/Input/FileUploadInput';
-import { HeaderUploadNav } from '../../components/common/Header/Header';
+import { HeaderBasicNav } from '../../components/common/Header/Header';
 import Layout from '../../styles/Layout';
 
 import useFetchToken from "../../Hooks/UseFetchToken";
 export default function ProductPage() {
-  const user = 'nigonego';
   const navigate = useNavigate();
 
   const [itemName, setItemName] = useState('');
   const [price, setPrice] = useState('');
   const [link, setLink] = useState('');
   const [itemImage, setItemImage] = useState('');
 
-  const auth = useRecoilValue(authAtom);
   const { postJoinImage, postProductUpload } = useFetchToken();
 
   const [isFormValid, setIsFormValid] = useState(false);
-  // const [isBtnActive, setIsBtnActive] = useState(Boolean(false));
 
   useEffect(() => {
     if (itemName && price && link && itemImage) {
       setIsFormValid(true);
-      // setIsBtnActive(Boolean(true))
     }
   }, [itemName, price, link, itemImage]);
 
@@ -57,7 +51,7 @@ export default function ProductPage() {
   return (
     <Layout>
       <form onSubmit={handleSubmit}>
-        <HeaderUploadNav content="업로드" isFormValid={isFormValid} />
+        <HeaderBasicNav disabled={!isFormValid}>업로드</HeaderBasicNav>
 
         <ul>
           <li>