[1월 26일] 리팩토링 회의

진행상황

수화님 유효성 검증해서 input 에 state 로 보여주는것까지

영인님 미니프로필 원래 축구 하드코딩에서 실제 API 로 변경완료!

찬혁님 DM퍼블리싱완료 , API 기다리는중 1/27 까지 DM API 안오면 게시글업로드 담당

보고

영인님

• 미니프로필 팔로우 언팔로우를 위해 한 Thunk 에 두가지 Slice 연결 할 계획
• 미니프로필 부분 hover 엄청 디테일하게 구현완료 아바타 / 이름 어떤것에 hover 되었고 또한 미니프로필에 hover 되어있을때도 모달 살아있어야함
• 기존 모달타입에서 미니프로필 / 팔로잉 모달 두개 켜져있어야하는 상황도 있어서 타입 수정

수화님

• 로그인 height 에 따른 layout 수정
• 가입하기 시 유효성 검증
• 유저 중복 API 이용

찬혁님

• DM 퍼블리싱 화면 및 코드 설명

할 것

영인님

• ModalThunk , ModalSlice 를 만들었는데 , 찬혁님 DM 의 Modal 과 겹쳐서 명명을 수정
• useInput 인자 2개 받는것 첫번째 인자 refreshFunction 2번째인자 onChange 와 value 묶은 객체 만들기

import { ChangeEvent, useState } from "react";

const useInput = (
    initialValue: string,
    onBlurValidator?: (value: string) => boolean,
) => {
    const [value, setValue] = useState(initialValue);
    const [isValid, setIsValid] = useState<boolean | null>(null);

    const onChange = (event: ChangeEvent<HTMLInputElement>) => {
        const {
            target: { value },
        } = event;
        if (onBlurValidator) {
            setIsValid(null);
        }
        setValue(value);
    };

    const resetValue = () => setValue("");

    const onBlur = () => {
        if (onBlurValidator) {
            setIsValid(onBlurValidator(value));
        }
    };

    return onBlurValidator
        ? [resetValue, isValid, { value, onChange, onBlur }]
        : [resetValue, { value, onChange }];
};

export default useInput;

• 게시물 업로드

찬혁님

• ImageSprite 합치기
• gapText DM 부분 쓰고 , 영인님이 쓴 부분 전 추가하기 ( useGapText )
• DM 새로운메시지 모바일일때 길어지는 부분 수정 (반응형) ( 735px )
• NewChatRecommendUser 상위컴포넌트에서 선택처리해주기
• 친구아닌 유저에게 온 경우 처리 페이지 하나 더 만들기!
• selectChatItem 에서 현재는 id 이지만 username 으로 바꾸는것도 고려해보기!!
• directSlice 에서 action 의 타입 정의하기

수화님

• 비동기 처리중 then catch 가 아닌 try catch 로 처리하는거 고려
• value 와 setValue 명명법 맞추기 ( useInput 쓰면 상관없음 )
• validator 명확히 하기 지금 너무 검증이 분산되어 있음 첫번째 인자로 검증하고자하는 타입 두번째 인자로 current.target.value를 받아서 검증을 전반적으로 하는걸 따로 빼는게 좋을 것 같음

결론

• Route 그대로가기