-
Notifications
You must be signed in to change notification settings - Fork 165
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[페이먼츠 미션 Step 2] 우디(류정우) 미션 제출합니다. #267
Merged
Merged
Changes from 51 commits
Commits
Show all changes
59 commits
Select commit
Hold shift + click to select a range
7dd48e7
refactor: 범용적인 함수 utils 폴더로 분리
jw-r cb84e65
refactor: Card 컴포넌트 내부의 any 타입 제거
jw-r d462b92
refactor: nullable하지 않은 데이터에서 옵셔널 체이닝 제거
jw-r 4da03cb
refactor(InputBox): nullable하지 않은 데이터에서 옵셔널 체이닝 제거
jw-r 05979bd
refactor: CardRegisterPage를 typescript로 마이그레이션
jw-r 29e8680
refactor: 보안 코드의 에러 메세지에 left:0 스타일 적용
jw-r 633332f
refactor: 만료일 전체에 대한 유효성 검사 제거 (임시)
jw-r cb6cf6e
feat: Input, Card, Header에 대한 스토리 북 구현
jw-r 5740789
feat: 등록한 카드 정보를 기억하기 위해 useLocalStorage 훅 구현
jw-r c824ebb
refactor: localStorage 관련 로직을 hook이 아닌 utils로 변경
jw-r 59a3b84
refactor: utils 폴더로 분리
jw-r bb4ee24
refactor: 타입 정리
jw-r ddcd860
refactor: Year 데이터를 렌더링 할 때, 불필요한 반복문 제거
jw-r 28e84bf
chore: 카드 회사 로고 이미지 폴더, 파일 생성
jw-r 8f6e305
chore: svg 모듈 declare 작성
jw-r 3a4348f
feat: 모달을 열고 닫는 기능 구현
jw-r c538550
feat: 카드 회사 정보를 담은 constants 생성
jw-r 5749e6e
feat: 모달을 넣어주기 위한 Portal 구현
jw-r 8df67fd
feat: 카드사를 선택하는 컴포넌트의 템플릿 구현
jw-r 3cfeb3a
feat: 모달을 여는 클릭 이벤트 추가
jw-r e326b8a
feat: 등록할 카드 정보에 대한 상태를 다루는 context 구현
jw-r fef2746
feat: 카드사의 정보를 표시
jw-r 7d1a89c
refactor: 모달의 초기 상태를 외부에서 주입 받도록 변경
jw-r 485ac12
feat: 카드의 닉네임을 표시
jw-r 94c1b9f
feat: cardList에 대한 context 구현
jw-r 114f6d8
refactor: context파일 typescript로 마이그레이션
jw-r 748cad6
refactor: useModalSwitch를 useSwitch로 범용성 있게 수정
jw-r dc4fc35
refactor: 폴더 내 파일 이름 구체화
jw-r 65a840e
feat: overflow 히든 추가
jw-r fe1e55b
refactor: 폴더 구조 변경 및 폴더 별 내보내기 합치기
jw-r ec1bffe
refactor: useForm을 범용성 있게 변경
jw-r 5b61276
refactor: cardInfo, cardList에 대한 Context 적용
jw-r 068c18f
refactor: 상수에 타입 부여
jw-r ab24a27
feat: modal-root 태그 추가
jw-r e6afc1b
chore: 파일 구조 변경 및 컴포넌트 파일 이름 구체화
jw-r 904e5b5
chore: react-hooks 테스팅 라이브러리 설치
jw-r 53ab6f3
test: useSwitch hook 테스트 코드 작성
jw-r b265a94
chore: 불필요한 파일 삭제
jw-r 7b039b3
feat: form이 렌더링되면 input에 focus되도록 구현
jw-r 26eb0f5
feat: form 화면에서 첫 input을 focus하는 기능 구현
jw-r a33a56a
refactor: 닉네임 Input에 대한 스타일을 동적으로 변경하도록 변경
jw-r 6b4fe32
chore: 폴더 구조 변경
jw-r 773a193
story: Card 컴포넌트에 대한 스토리 구현
jw-r 493c947
stody: Header 컴포넌트에 대한 스토리 구현
jw-r 760143a
stody: SelectBank 컴포넌트에 대한 스토리 구현
jw-r aa17331
feat: Input에 max-width 추가
jw-r a5cde8c
story: Input 컴포넌트에 대한 스토리 구현
jw-r 02a38f1
chore: import 개행 정리
jw-r 5d05b25
story: InputBox 컴포넌트들에 대한 스토리 구현
jw-r 972993a
story: 내보내기 이름 변경
jw-r d7916ec
story: Page 컴포넌트에 대한 스토리 구현
jw-r cbd1b48
refactor: nullable하지 않은 객체에 대한 옵셔널 연산자 제거
jw-r e6bdff7
refactor: context에서 상태와 actions에 대한 타입 네로잉
jw-r 31d94c2
refactor: 카드사의 정보가 담긴 오브젝트에 반복문을 실행할 때 entries로 key와 value를 가져오도록 변경
jw-r a722c83
refactor: 삼항 연산자 대신 or, and 연산자를 사용하도록 변경
jw-r 20a2975
refactor: 로컬 스토리지 로직을 custom hook으로 구현
jw-r 316e29a
refactor: set 함수를 사용할 때, 이전 상태 값을 변경하도록 수정
jw-r ebb1de3
feat: errorOptions의 타입 지정
jw-r e19b98c
feat: props.name이 nickname이 아닐 경우 border 지정
jw-r File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,22 @@ | ||
import { renderHook } from '@testing-library/react-hooks'; | ||
import { act } from 'react-dom/test-utils'; | ||
|
||
import useSwitch from '../hooks/useSwitch'; | ||
|
||
test('useSwitch hook 테스트', () => { | ||
// useSwitch 훅을 사용한다. 초기 상태 값을 false로 설정한다 | ||
const { result } = renderHook(() => useSwitch(false)); | ||
|
||
// 상태 값의 초기 상태 값은 false이다 | ||
expect(result.current.state).toBe(false); | ||
|
||
// state의 상태 값을 true로 변경한다 | ||
act(() => result.current.turnOn()); | ||
|
||
expect(result.current.state).toBe(true); | ||
|
||
// state의 상태 값을 false로 변경한다 | ||
act(() => result.current.turnOff()); | ||
|
||
expect(result.current.state).toBe(false); | ||
}); |
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,52 @@ | ||
import * as styled from './Card.styled'; | ||
|
||
import { BANKS } from '../../constants'; | ||
|
||
import { CardInfo } from '../../types/card'; | ||
|
||
interface CardProps { | ||
cardInfo: CardInfo; | ||
} | ||
|
||
const Card = ({ cardInfo }: CardProps) => { | ||
return ( | ||
<styled.Card bgColor={BANKS[cardInfo.bank]?.bgColor} color={BANKS[cardInfo.bank]?.color}> | ||
<styled.Rectangle /> | ||
<styled.CardInfos> | ||
<styled.BankName>{BANKS[cardInfo.bank]?.name}</styled.BankName> | ||
<styled.Bottom> | ||
<styled.CardNumbers> | ||
<div>{cardInfo.firstCardNumbers}</div> | ||
<div>{cardInfo.secondCardNumbers}</div> | ||
<styled.EllipseContainer> | ||
{Array.from({ length: cardInfo.thirdCardNumbers.length }).map((_, index) => ( | ||
<styled.Ellipse key={index} color={BANKS[cardInfo.bank]?.color} /> | ||
))} | ||
</styled.EllipseContainer> | ||
<styled.EllipseContainer> | ||
{Array.from({ length: cardInfo.fourthCardNumbers.length }).map((_, index) => ( | ||
<styled.Ellipse key={index} color={BANKS[cardInfo.bank]?.color} /> | ||
))} | ||
</styled.EllipseContainer> | ||
</styled.CardNumbers> | ||
<styled.ExtraInfos> | ||
<styled.CardOwnerName> | ||
{cardInfo.ownerName ? cardInfo.ownerName : 'NAME'} | ||
</styled.CardOwnerName> | ||
<styled.ExpirationDate> | ||
<styled.ExpirationMonth> | ||
<span>{cardInfo.expirationMonth ? cardInfo.expirationMonth : 'MM'}</span> | ||
</styled.ExpirationMonth> | ||
<span>/</span> | ||
<styled.ExpirationYear> | ||
<span>{cardInfo.expirationYear || 'YY'}</span> | ||
</styled.ExpirationYear> | ||
</styled.ExpirationDate> | ||
</styled.ExtraInfos> | ||
</styled.Bottom> | ||
</styled.CardInfos> | ||
</styled.Card> | ||
); | ||
}; | ||
|
||
export default Card; |
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
요런건 어떤가요?!