✨ Feat: 버튼 클릭 시 새로고침

sprint6-part2 · May 9, 2024 · 756d9e1 · 756d9e1
1 parent b29e2c9
commit 756d9e1
Show file tree

Hide file tree

Showing 5 changed files with 14 additions and 10 deletions.
diff --git a/src/components/LoadingError/index.jsx b/src/components/LoadingError/index.jsx
@@ -5,23 +5,25 @@ import PropTypes from 'prop-types';
 import style from './styles.module.scss';
 
 /**
- * @param {string} errorMessage
+ * @param {string} errorMessage 에러메시지 문구
  */
 const LoadingError = ({ errorMessage }) => {
+  const handleRefresh = () => {
+    window.location.reload();
+  };
+
   return (
     <div className={style.error}>
-      <Logo />
+      {/* <Logo /> */}
       <h3>문제가 발생했습니다</h3>
       <p>{errorMessage}</p>
-      <div className={style.button}>
-        <CustomButton rounded btnText="페이지 새로고침" />
-      </div>
+      <CustomButton rounded btnText="페이지 새로고침" onClick={handleRefresh} />
     </div>
   );
 };
 
 LoadingError.propTypes = {
-  errorMessage: PropTypes.string,
+  errorMessage: PropTypes.string.isRequired,
 };
 
 export default LoadingError;
diff --git a/src/components/LoadingError/styles.module.scss b/src/components/LoadingError/styles.module.scss
@@ -9,12 +9,12 @@
   white-space: pre-wrap;
 
   h3 {
-    margin-top: 40px;
+    // margin-top: 45px;
     @include font-base($color-brand-orange, 600, 18px, 26px);
   }
 
   p {
-    margin-bottom: 10px;
+    margin-bottom: 15px;
     @include font-base($color-white, 600, 14px, 26px);
   }
 

diff --git a/src/pages/ListPage/Donation/index.jsx b/src/pages/ListPage/Donation/index.jsx
@@ -9,7 +9,6 @@ const Donation = () => {
   return (
     <section className={style.container}>
       <h2 className={style.title}>후원을 기다리는 조공</h2>
-      {/* <LoadingError errorMessage="후원 목록을 가져오지 못했습니다. 다시 시도해주세요" /> */}
       <Carousel customSettings={carouselSettings}>
         {testData.list.map((item) => {
           return <Card item={item} key={item.id} />;

diff --git a/src/pages/ListPage/MonthlyChart/index.jsx b/src/pages/ListPage/MonthlyChart/index.jsx
@@ -44,7 +44,7 @@ const MonthlyChart = () => {
         name: '추가 버튼 눌렀구나',
         totalVotes: 1000,
         profilePicture:
-        'https://sprint-fe-project.s3.ap-northeast-2.amazonaws.com/Fandom-K/idol/1714613892649/ive1.jpeg',
+          'https://sprint-fe-project.s3.ap-northeast-2.amazonaws.com/Fandom-K/idol/1714613892649/ive1.jpeg',
       },
     ];
     setIdolList(newArr);

diff --git a/src/pages/TestPage/index.jsx b/src/pages/TestPage/index.jsx
@@ -107,6 +107,9 @@ const TestPage = () => {
       </div>
       <div>
         <LoadingError errorMessage="후원 목록을 가져오지 못했습니다. 다시 시도해주세요" />
+        <LoadingError
+          errorMessage={`이렇게 작성하면 줄바꿈이 됩니다.\n다시 시도해주세요`}
+        />
       </div>
     </div>
   );
-Original file line number
+Diff line change
@@ Expand Up / @@ -107,6 +107,9 @@ const TestPage = () => { @@
           </div>
           <div>
             <LoadingError errorMessage="후원 목록을 가져오지 못했습니다. 다시 시도해주세요" />
+            <LoadingError
+              errorMessage={`이렇게 작성하면 줄바꿈이 됩니다.\n다시 시도해주세요`}
+            />
           </div>
         </div>
       );
@@ Expand Down @@