Merge pull request #44 from development-ping/feat/ide

fix: 이미지 경로 변경

Author: qowldud

src/pages/IDEPage/Header/Header.tsx

@@ -7,6 +7,7 @@ import { IFile } from '../../../recoil/File/type';
 import { confirmAlert } from 'react-confirm-alert';
 import { useRecoilState } from 'recoil';
 import FileState from '../../../recoil/File/atoms';
+import logo from '../../../../public/images/logo2.png';
 
 const Header = () => {
   const navigate = useNavigate();
@@ -72,7 +73,7 @@ const Header = () => {
   return (
     <IdeTop>
       <IdeTop_Logo>
-        <img src="/public/images/logo2.png" />
+        <img src={logo} />
         <span>D P I D E</span>
       </IdeTop_Logo>
       <IdeTop_Close onClick={onCloseClickHandler}>

src/pages/Invite/Header/Header.tsx

@@ -3,6 +3,7 @@ import { IdeTop, IdeTop_Close, IdeTop_Logo } from './Header.style';
 import { useNavigate } from 'react-router-dom';
 import { useSetRecoilState } from 'recoil';
 import ReceiveContent from '../../../recoil/ReceiveContent/atom';
+import logo from '../../../../public/images/logo2.png';
 
 const Header = () => {
   const navigate = useNavigate();
@@ -15,7 +16,7 @@ const Header = () => {
   return (
     <IdeTop>
       <IdeTop_Logo>
-        <img src="/public/images/logo2.png" />
+        <img src={logo} />
         <span>D P I D E</span>
       </IdeTop_Logo>
       <IdeTop_Close onClick={onCloseClickHandler}>

src/pages/LoginPage/InputBox/Input.tsx

@@ -1,6 +1,8 @@
 import { useState } from 'react';
 import { ErrorMessage, Inputbox, InputContent, InputWrapper } from './Input.style';
 import { FieldError, UseFormRegister } from 'react-hook-form';
+import eyeOn from '../../../../public/images/eye-light-on.png';
+import eyeOff from '../../../../public/images/eye-light-off.png';
 
 interface FormInput {
   email: string;
@@ -53,12 +55,7 @@ const Input = ({ placeholder, name, register, errors }: Props) => {
           type={placeholder === '이메일' ? 'text' : passwordState ? 'text' : 'password'}
           {...register(name, { required: required, pattern: pattern })}
         />
-        {placeholder === '비밀번호' && (
-          <img
-            src={passwordState ? '/public/images/eye-light-on.png' : '/public/images/eye-light-off.png'}
-            onClick={onEyeClickHandler}
-          />
-        )}
+        {placeholder === '비밀번호' && <img src={passwordState ? eyeOn : eyeOff} onClick={onEyeClickHandler} />}
       </Inputbox>
       {errors && <ErrorMessage>{renderErrorMessage()}</ErrorMessage>}
     </InputWrapper>

src/pages/LoginPage/Login.tsx

@@ -18,6 +18,7 @@ import LoginRequest from '../../apis/Auth/Login/LoginRequest';
 import { useCookies } from 'react-cookie';
 import { AxiosResponse } from 'axios';
 import { useEffect, useState } from 'react';
+import logo from '../../../public/images/logo2.png';
 
 interface FormInput {
   email: string;
@@ -78,7 +79,7 @@ const Login = () => {
     <LoginContainer>
       <LoginWrapper>
         <LoginLogo>
-          <img src="/public/images/logo2.png" />
+          <img src={logo} />
           <span>D P I D E</span>
         </LoginLogo>
         <LoginForm onSubmit={handleSubmit(onSubmit)}>

src/pages/SignUpPage/SignUp.tsx

@@ -20,6 +20,9 @@ import { useCookies } from 'react-cookie';
 import { toast } from 'react-toastify';
 import 'react-toastify/dist/ReactToastify.css';
 import { AxiosResponse } from 'axios';
+import eyeOn from '../../../public/images/eye-light-on.png';
+import eyeOff from '../../../public/images/eye-light-off.png';
+import logo from '../../../public/images/logo2.png';
 
 interface FormIF {
   email: string;
@@ -84,7 +87,7 @@ const SignUp = () => {
     <SignUpContainer>
       <SignUpWrapper>
         <SignUp_logo>
-          <img src="/public/images/logo2.png" />
+          <img src={logo} />
           <span>D P I D E</span>
         </SignUp_logo>
 
@@ -108,10 +111,7 @@ const SignUp = () => {
                 type={pwState ? 'text' : 'password'}
                 {...register('password', { required: true, pattern: /^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{8,}$/ })}
               />
-              <img
-                src={pwState ? '/public/images/eye-light-on.png' : '/public/images/eye-light-off.png'}
-                onClick={onPasswordHandler}
-              />
+              <img src={pwState ? eyeOn : eyeOff} onClick={onPasswordHandler} />
             </SignUp_InputBox>
             {errors.password && errors.password?.type === 'required' && (
               <ErrorMessage>비밀번호를 입력해주세요.</ErrorMessage>
@@ -129,10 +129,7 @@ const SignUp = () => {
                   required: true,
                 })}
               />
-              <img
-                src={pwConfirmState ? '/public/images/eye-light-on.png' : '/public/images/eye-light-off.png'}
-                onClick={onPasswordConfirmHandler}
-              />
+              <img src={pwConfirmState ? eyeOn : eyeOff} onClick={onPasswordConfirmHandler} />
             </SignUp_InputBox>
             {errors.passwordConfirm && errors.passwordConfirm?.type === 'required' && (
               <ErrorMessage>비밀번호 확인을 입력해주세요.</ErrorMessage>

src/pages/StartPage/StartPage.tsx

@@ -14,6 +14,7 @@ import {
 import StartHeader from '../../components/Header/StartHeader';
 import { useEffect } from 'react';
 import { useCookies } from 'react-cookie';
+import startPage from '../../../public/images/startPage.png';
 
 const StartPage = () => {
   const navigate = useNavigate();
@@ -40,7 +41,7 @@ const StartPage = () => {
           </StartWrapper_Bottom_Buttons>
         </Start>
         <StartWraper_Bottom_Image>
-          <img src="/public/images/startPage.png" />
+          <img src={startPage} />
         </StartWraper_Bottom_Image>
       </StartWrapper_Bottom>
     </StartContainer>