refactor: 코드컨벤션에 맞게 코드 수정 및 imageDescription을 버튼 props에 추가

woowacourse-teams · Jul 31, 2024 · 930b117 · 930b117
1 parent eaaaf4c
commit 930b117
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 10 deletions.
diff --git a/frontend/src/components/common/Button/index.tsx b/frontend/src/components/common/Button/index.tsx
@@ -5,13 +5,14 @@ import * as S from './styles';
 interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
   buttonType: ButtonType;
   text: string;
-  icon?: string;
+  image?: string;
+  imageDescription?: string;
 }
 
-const Button = ({ buttonType, text, icon, onClick }: ButtonProps) => {
+const Button = ({ buttonType, text, image, imageDescription, onClick }: ButtonProps) => {
   return (
     <S.Button buttonType={buttonType} onClick={onClick}>
-      {icon && <S.Icon src={icon} alt="아이콘" />}
+      {image && <S.Image src={image} alt={imageDescription || ''} />}
       {text}
     </S.Button>
   );

diff --git a/frontend/src/components/common/Button/styles.ts b/frontend/src/components/common/Button/styles.ts
@@ -61,6 +61,6 @@ export const Button = styled.button<{ buttonType: ButtonType }>`
   ${({ buttonType, theme }) => getButtonStyle(buttonType, theme)};
 `;
 
-export const Icon = styled.img`
-  margin-right: 8px;
+export const Image = styled.img`
+  margin-right: 0.8rem;
 `;
diff --git a/frontend/src/pages/ErrorPage/index.tsx b/frontend/src/pages/ErrorPage/index.tsx
@@ -6,15 +6,15 @@ import { useSidebar } from '@/hooks';
 import ErrorSection from './components/ErrorSection';
 
 const ERROR_MESSAGE = {
-  server_unstable: '서버와의 통신이 불안정합니다.',
+  serverUnstable: '서버와의 통신이 불안정합니다.',
 };
 
 const ErrorPage = () => {
   const { isSidebarHidden, isSidebarModalOpen, closeSidebar, openSidebar } = useSidebar();
   const navigate = useNavigate();
 
-  const handleReLoad = () => {
-    window.location.reload();
+  const handleReload = () => {
+    navigate(0);
   };
 
   const handleGoHome = () => {
@@ -31,8 +31,8 @@ const ErrorPage = () => {
       <Topbar openSidebar={openSidebar} />
       <Main>
         <ErrorSection
-          errorMessage={ERROR_MESSAGE.server_unstable}
-          handleReLoad={handleReLoad}
+          errorMessage={ERROR_MESSAGE.serverUnstable}
+          handleReload={handleReload}
           handleGoHome={handleGoHome}
         />
       </Main>