Skip to content

Conversation

@oceanlee-seoul
Copy link
Contributor

연관된 이슈

작업 내용

대시보드 수정 페이지에 대시보드 정보 수정 컴포넌트를 구현

  • 퍼블리싱
  • API 연결

스크린샷

대시보드정보수정컴포넌트

코멘트 및 논의 사항

API 관련 : 제가 구현한 대시보드 수정 컴포넌트는 수정 버튼 클릭 시 refetch 함수로 새로고침하는데 sidebar에 정보는 refetch가 안이루어지네요?! 사이드바랑 연동되면 좋을 것 같은데 어떻게 하면 될까요?!

반응형 관련 : 대시보드 이름이 길고, 뷰포트가 엄청나게 좁지 않으면 저렇게 컬러 선택 버튼이 그대로 있어도 괜찮은 것 같습니다.
혹시 다른 아이디어 있으면 얘기해주세용!!

스크린샷 2024-06-30 오후 11 44 54

그리고 저희가 설정한 tailwind-config color들 위와 같은 warning 나오네요?!

@oceanlee-seoul oceanlee-seoul added ✨ feat 새로운 기능 추가 📝 dashboard edit 대시보드 수정 페이지 관련 labels Jun 30, 2024
@oceanlee-seoul oceanlee-seoul added this to the 📝 Dashboard edit milestone Jun 30, 2024
@oceanlee-seoul oceanlee-seoul self-assigned this Jun 30, 2024
@un0211
Copy link
Contributor

un0211 commented Jun 30, 2024

그리고 저희가 설정한 tailwind-config color들 위와 같은 warning 나오네요?!

저는 text-black-33 만 그게 뜨는 거 같아요!!

반응형 관련 : 대시보드 이름이 길고, 뷰포트가 엄청나게 좁지 않으면 저렇게 컬러 선택 버튼이 그대로 있어도 괜찮은 것 같습니다.

모바일도 있어서 컬러 아래로 내리거나 시안처럼 하나로 줄이긴 해야할 것 같아요!

@wjsdncl
Copy link
Contributor

wjsdncl commented Jun 30, 2024

API 관련 : 제가 구현한 대시보드 수정 컴포넌트는 수정 버튼 클릭 시 refetch 함수로 새로고침하는데 sidebar에 정보는 refetch가 안이루어지네요?! 사이드바랑 연동되면 좋을 것 같은데 어떻게 하면 될까요?!

저는 아래처럼 queryKey찾아서 refetch 시켰습니다 🫡

useFetchData<DashboardsResponse>(['dashboards', currentChunk], () =>
    getDashboardsList('pagination', currentChunk, 5),
  );
queryClient.invalidateQueries({ queryKey: ['dashboards'] });
queryClient.invalidateQueries({ queryKey: ['sideDashboards'] });

반응형 관련 : 대시보드 이름이 길고, 뷰포트가 엄청나게 좁지 않으면 저렇게 컬러 선택 버튼이 그대로 있어도 괜찮은 것 같습니다. 혹시 다른 아이디어 있으면 얘기해주세용!!

확실히 있는게 더 편해서 좋을거 같습니다
공간이 없을때는 드롭다운으로 만들면 좋을거 같네요 🤔

그리고 저희가 설정한 tailwind-config color들 위와 같은 warning 나오네요?!

제 프로젝트에서는 에러가 안나와서 혹시 vscode를 껏다 켜도 동일하다면 콘솔창에서 출력에 Prettier, ESLint 확인해서 알려주시면 감사하겠습니다! 🫡
image
image

Copy link
Contributor

@un0211 un0211 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

대양님 수고 많으셨어요~~~

if (error) {
return (
<section className='section flex h-[211px] items-center justify-center px-[18px] py-[32px] md:h-[256px]'>
<h1 className='text-[22px] font-bold text-black-33'>대시보드 정보가 없습니다!</h1>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

h1은 페이지마다 하나 있어야 해서 페이지의 일부인 여기에선 안쓰는 게 좋을 것 같아요!

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

아 그렇군요!! h1이 페이지에 하나만 있어야 한다는 걸 처음 알았어요!! 감사합니다 p 태그로 수정했습니다. :)

대시보드 이름
</label>
<input
className='h-[42px] rounded-[6px] border border-gray-d9 px-[15px] text-[14px] md:h-[48px] md:text-[16px]'
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

input이랑 label은 제가 글로벌에 클래스 만들어뒀어요~~
꼭 써야하는 건 아니지만..

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

사용했습니다!!! 글씨 크기만 조금 달라서 크기 지정만 따로 했습니다. 감사합니다 :)

try {
await putDashboardInfo(Number(id), value);
openModal({ type: 'textModal', modalProps: { text: '대시보드 정보가 수정되었습니다!' } });
refetch();
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

const handleAcceptInvitation = async (invitationId: number, inviteAccepted: boolean) => {

민재님이 작업하신 mydashboard의 invitedDashboardList에서처럼

      queryClient.invalidateQueries({ queryKey: ['dashboards'] });
      queryClient.invalidateQueries({ queryKey: ['sideDashboards'] });

invalidateQueries하면 저 키에 해당하는 저장되어있는 값이 무효화되어서 다시 요청을 보냅니다!
특히 ['sideDashboards'] 가 대양님이 업데이트 하고싶은 사이드바 관련일 것 같고,
이 대시보드 관련 정보 새로고침 하고 싶으면 ['dashboards', id] 넣으시면 될 거예요! (id: 대시보드 아이디)

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

민재님이 도와주셔서 반영해서 문제 해결했습니다. 감사해요 :)

@wayandway
Copy link
Contributor

wayandway commented Jul 1, 2024

API 관련

-> 저도 민재님 코멘트 잘 읽었습니다 👍

반응형 관련 : 대시보드 이름이 길고, 뷰포트가 엄청나게 좁지 않으면 저렇게 컬러 선택 버튼이 그대로 있어도 괜찮은 것 같습니다. 혹시 다른 아이디어 있으면 얘기해주세용!!

-> 저는 컬러선택 버튼은 한 눈에 보이는게 좋을 것 같다 생각해요!! flex 이용해서 6개~>3개+3개 로 줄바꿈해도 괜찮을 것 같네요!

대양님 고생하셨습니다 :)

스크린샷 2024-07-01 오후 1 57 17 스크린샷 2024-07-01 오후 1 57 36 스크린샷 2024-07-01 오후 1 57 51

반응형 위와 같이 만들어봤습니다. 최소 사이즈로 줄여도 깨지는 부분 없네요.
다들 괜찮으실까요?!

@wjsdncl
Copy link
Contributor

wjsdncl commented Jul 1, 2024

고생하셨습니다!! 👍🫡

@oceanlee-seoul oceanlee-seoul merged commit e5d60f8 into develop Jul 1, 2024
@oceanlee-seoul oceanlee-seoul deleted the feature/dashboardEdit branch July 1, 2024 05:11
un0211 added a commit that referenced this pull request Jul 9, 2024
* ⚙️  Chore: tailwind 컬러 팔레트 및 반응형 브레이크 포인트 세팅 (#33)

⚙️  chore: tailwind 컬러 팔레트 및 반응형 브레이크 포인트 세팅

* ✨ Feat: 페이지 라우팅 설정 (#34)

* ⚙️ Chore: 배포하기 (#39)

* ⚙️  chore: pnpm-lock.yaml 업데이트

* ⚙️  chore: 배포용 repo에 main과 develop 변화 반영하도록 workflow 생성

* ✨ feat: userReducer 추가

- store 설정
- userSlice 추가
- app 컴포넌트에서의 Provider 지정

* ⚙️ Chore: eslintrc.json 타입스크립트에 맞춰서 수정 (#38)

* ⚙️ Chore: eslintrc.json 타입스크립트에 맞춰서 수정

* ⚙️ Chore: eslintrc.json rules 변경
- react/jsx-filename-extension에 .js, .jsx 추가

* ✨ feat: 로그인 커스텀 훅 useSignIn 추가

* ✅ test: 테스트용 로그인 폼

* 🛠  fix: 중복된 userReducer 등록 수정

* ⚙️  Chore: eslintrc.json 변경에 따른 패키지 추가 (#46)

* ⚙️ Chore: 유저 기능 관련 패키지 추가 (#47)

* ⚙️  chore: install React Query

* ⚙️  chore: install Redux Toolkit(+ Persist)

* ✨ Feat: 공용 버튼 컴포넌트 구현 (#50)

* ✨ feat: 공용 버튼 컴포넌트 구현

* ✨ feat: className 기본값 추가

* 🗑  remove: 테스트 코드 제거

* ✨ feat: useFetchData 커스텀 훅 (#55)

✨ feat: useFetchData 커스텀 훅 정의

* ✨ Feat: generateTagIndex 함수 구현 (#44)

✨ feat: generateTagIndex 함수 구현

* ⚙️  Chore: scope 적는 것 강제하도록 변경 (이슈넘버 적기) (#56)

⚙️  chore(#51): scope 적는 것 강제하도록 변경 (이슈넘버 적기)

* ♻️ Refactor: 서비스 로직 분리 & useFetch 커스텀훅 리팩토링 (#63)

* ⚙️  chore(#58): install axios

* ♻️  refactor(#54): useFetchData 리팩토링 -> useQuery 훅 사용

* ✨ feat(#58): axios 인스터스 생성 & GET 호출 로직 분리

* ✨ feat(#52): 대시보드 인터페이스 정의

* ✨ feat(#52): 대시보드 목록을 전역 상태로 등록 (Reducer)

* ✨ feat(#52): 대시보드 목록 데이터 패칭 커스텀훅

* 🛠  fix(#54): 캐시 키를 파라미터로 지정할 수 있도록 수정

* 🛠  fix(#58): getDashboardsList() 파라미터 타입 수정

* ✨ Feat(#2): Sidebar 제작 (#65)

* ✨ Feat(#2): Sidebar Layout 구성

* ✨ Feat(#2): Sidebar 임시 api 연동 및 구현

* ✨ Feat(#2): Sidebar 임시 구현 완료
- API 재연동 필요
- 모달 연동 필요

* ✨ Feat(#2): Sidebar 제작 완료
- 모달 연동 필요

* ♻️  refactor(#2): Sidebar 코드 개선

* 🎨 design(#2): sidebar css 수정

* 🎨 design(#2): padding, margin 피그마 디자인에 맞춰서 수정

* ✨ Feat: user 관련 저장하는 정보 추가 (이메일, 프로필 이미지) (#70)

* 🛠  fix(#69): 로그인 시 이메일, 프로필 이미지 정보도 저장하도록 변경

* ⚙️  chore(#69): import named 에러 해결

.eslintrc.json에import/typescript 플러그인 추가

* ✨ feat(#31): Layout 설정 (#67)

* ✨ feat(#31): Layout 적용
- 랜딩, 로그인, 회원가입, 404 페이지 제외한 모든 페이지에 레이아웃 적용

* ✨ feat(#31): Layout 임시 설정

* ♻️  refactor(#2): Sidebar 코드 개선

* 🎨 design(#2): sidebar css 수정

* 🎨 design(#2): padding, margin 피그마 디자인에 맞춰서 수정

* ✨ feat(#31): Layout에 Sidebar 추가

* ✨ feat(#31): Layouts 폴더로 MainLayout 이동
- src/components/MainLayout/index.tsx -> src/layouts/MainLayout.tsx로 변경
- src/layouts/MainLayout.tsx에서 tailwindcss 적용 안되는 문제 해결

* ✨ Feat(#6, #7): 로그인, 회원가입 페이지 (#68)

* ⚙️  chore: react-hook-form 추가

* ⚙️  chore: yup 추가

* ⚙️  chore: hookform resolvers 추가

* ✨ feat(#7): 회원가입 페이지 퍼블리싱

* ⚙️  chore(#7): 파일 구조 변경

* 🎨 design(#7): css 조정

* ✨ feat(#7): 비밀번호 확인 validation 변경

* ⚙️  chore(#72): eslint tui 제거

* ↔️  style(#6): 화살표 함수, 선언문으로 변경

* 🚚 rename(#6, #7): input 컴포넌트 파일명 변경

* ⚙️ Chore(#74): tailwind.config.ts 컬러 수정 및 기존 컬러 클래스명 변경 (#75)

* ⚙️  chore(#74): tailwind.config.ts 컬러 수정

* ↔️  style(#74): 기존 color 데이터 현재 포맷에 맞게 변경

* ✨ Feat: 컬럼 섹션 & 개별 컬럼 (#71)

* ⚙️  chore(#29): containers/ 이하의 컴포넌트에도 tailwindCSS 적용

* ✨ feat(#12): define Column Interface

* ✨ feat(#12): add ColumnsSection.tsx

* ✨ feat(#13): add Column.tsx

* ↔️  style(#12, #13): 시맨틱 태그로 수정 & 주석 추가

* 🛠  fix(#12): modify ColumnsSectionProps Type

* ✨ feat(#12): dashboard/[id] 페이지 내 ColumnsSection 컴포넌트 렌더링

* ↔️  style(#74): tailwind 컬러명 수정 반영

* 🛠  fix(#31): 레이아웃 내 main 태그의 패딩값 제거

* ⚙️  chore(#79): pnpm-lock.yaml 최신화 (#81)

* ✨ Feat(#9): Header 컴포넌트 구현 (#78)

* 🎨 design(#9): 폰트 Pretendard 400 기본으로 설정

* ✨ feat(#9): 랜딩 페이지 내비게이션 구현(로고 이미지 제외 반응형)

* ✨ feat(#9): 사용자 프로필 컴포넌트 구현

* ✨ feat(#9): 기본 헤더 컴포넌트 구현

* 🚚 rename(#9): 이미지 이름 - 사용하도록 변경

* ✨ feat(#9): 대시보드 헤더 컴포넌트 구현 (구성원 목록 제외)

* ✨ feat(#9): 헤더 컴포넌트 구현

* ✨ feat(#9): 대시보드 헤더 컴포넌트 구성원 구현(미완)

* ✨ feat(#9): 레이아웃에 헤더 적용

* ↔️  style(#74): 바뀐 tailwind 설정에 맞게 색상 지정

* 🗑  remove(#9): 중복 아이콘 삭제

* 🎨 design(#9): 유저 아이콘 폰트 적용

* 🛠  fix(#9): 관리 버튼 관리 페이지로 이동하도록 변경

* ⚙️  chore(#38): tailwind 관련 프리티어 설정 변경

* 🎨 design(#9): inline style로 구성원 프로필 겹쳐서 배열

* ✨ feat(#9): 헤더의 유저 메뉴 드롭다운 기능만 구현

* 🛠  fix(#9): 대시보드 페이지 전환시 에러 해결

* ↔️  style(#9): 컨벤션에 맞게 함수 표현식으로 변경

* 🛠  fix(#9): localStoarge 관련 코드 제거

* 🎨 design(#9): 아이콘에서 글자 가운데정렬

* ⚙️  chore(#38): tailwind 관련 eslint 설정 변경

* ✨ Feat(#16): mydashboard 페이지 DashboardList 컴포넌트 구현 (#80)

* ✨ Feat(#16): mydashboard 페이지 DashboardList 컴포넌트 구현
- 리덕스에 등록된 대시보드 목록을 5개씩 보여주는 컴포넌트 구현
- 대시보드 목록을 클릭하면 해당 대시보드로 이동하는 기능 구현

* 🛠  fix(#16): mydashboard 페이지 대시보드 목록 페이지 수정
- 기존 전역 대시보드 목록을 받아오던 방식을 서버에 요청하여 받아오도록 수정
- 페이지네이션 기능 추가

* 🛠  fix(#16): mydashboard 페이지 개선
- API 호출 방식을 useFetchData hook을 사용하도록 변경
- 페이지네이션 버튼 수정

* 🎨 design(#16): 대시보드 이동 버튼 화살표 추가
- section 크기 조정

* 🎨 design(#16): 화살표 이미지 추가

* 🎨 design(#16): 반응형 디자인 설정

* 🎨 design(#16): 대시보드 목록 버튼 배경색 수정

* 🛠  fix(#16): 페이지네이션 버튼 분리

* ⚙️  chore(#78): 프리티어 플러그인 설치에 따른 패키지 업데이트 (#91)

* ✨ Feat: POST API 로직 분리 (#83)

* ↔️  style(#58): getService.ts 내에 function 선언 함수들 -> 표현식으로 변경

* ✨ feat(#76): define SignUpForm Interface

* ✨ feat(#76): define async function - postSignUp()

* ✨ feat(#76): 회원가입 폼 POST API 연동

* ✨ feat(#76): 회원가입 성공 시 로그인 페이지로 리다이렉트되도록 로직 추가

* 🛠  fix(#6): 로그인폼 내의 이용약관 동의 체크박스 제거

* ✨ feat(#76): 로그인 성공 시 MY대시보드페이지로 리다이렉트되도록 로직 추가

* ✨ feat(#76): 로그인폼 리퀘스트/리스폰스 인터페이스 정의

* ✨ feat(#76): redefined User Interface

* ♻️  refactor(#76): postSignIn과 연동한 useSignin 리팩토링

* 🛠  fix(#76): postSignIn 함수 내 accessToken을 로컬스토리지에 저장하는 코드 삭제

* ✨ Feat: SideBar 컴포넌트 반응형 디자인 추가 및 로딩 UI 수정 (#92)

* 🛠  fix(#2): API 로딩 시 UI 수정

* 🎨 design(#2): 반응형 디자인 설정

* 🎨 design(#2): 모바일용 로고 이미지 파일 업로드

* 🎨 design(#2): 이미지를 불러오는 방식 수정

* ♻️ Refactor(#86): 버튼 디자인 클래스 생성 및 버튼 컴포넌트 개선 (#89)

* 🎨 design(#86): 색상별 버튼 클래스 생성

* ♻️  refactor(#86): 버튼 클래스 리팩토링 (자주 사용하는 버튼 컴포넌트화)

* 🛠  fix(#86): 버튼 컴포넌트 반응형 수정

* ♻️  refactor(#86): 기존 버튼에 버튼 스타일 적용

* 🎨 design(#86): 버튼 디자인 적용

* 🎨 design(#86): 로그인/회원가입 버튼 디자인 적용

* 🛠  fix(#16): 대시보드 리스트 버튼 비활성화 추가 (#93)

* 🛠  fix(#16): 대시보드 리스트 버튼 비활성화 추가

* 🎨 design(#16): 페이지 이동 버튼 배경색 수정

* 🎨 design(#16): 이미지를 받아오는 방식 수정

* 🛠  fix(#16): 페이지 리스트 totalPage 수정

* 🎨 design(#31): 레이아웃 크기, 색상 수정 (#95)

- 최대 크기 없앰
- 최소 너비 375px로 설정
- main 부분 배경색 지정 (페이지별로 각각 지정하던 것 삭제)

* 🎨 Design(#31): 레이아웃 main이 남은 크기 차지하도록 설정 (#98)

* ⚙️ Chore: Tanstack Query 업그레이드 (#96)

* ⚙  chore(#73): install Tanstack Query

* 🛠  fix(#73): tanstack query 패키지 임포트 & 개발자 도구 추가

* 🛠  fix(#73): useFetchData 수정 - Tanstack Query 적용

* 🛠  fix(#73): useSignIn 수정 - Tanstack Query 적용

* 🛠  fix(#73): useFetchDashboards 수정 - Tanstack Query 적용

* ✨ Feat(#8): 프로필 수정 기능 (#100)

* 🎨 design(#8): 프로필 변경 섹션 디자인

* ✨ feat(#8): 입력폼 내부기능 완성 (API 연결 X)

* ✨ feat(#8): 프로필변경 API 연결 (내부정보 업데이트 X)

* ✨ feat(#8): 프로필 변경시 유저 정보 업데이트

- userSlice에서 accessToken이 string | null이므로 함수에서도 같은 타입을 받도록 함

* 🛠  fix(#9): 헤더에서 에러 정보를 유저정보대신 표시하지 않도록 함

* ↔️  style(#9): 안쓰게 된 import 삭제

* ⚙️  chore(#9): 프로필 이미지 받아올 수 있게 next.config.mjs 설정

* 🎨 design(#9): 프로필 이미지 디자인 수정

- 비율 유지
- 둥근 테두리

* ✨ feat(#8): 닉네임 유효성 검사

- 길이 1자 이상 10자 이하

* ✨ feat(#8):  프로필 이미지 삭제 기능 추가 + 업데이트 폼에서 정보 선택적으로 전달하도록 변경

* 🎨 design(#8): 이미지 인풋 호버, 클릭시 효과 적용

* 🛠  fix(#8, #73): tanstack query 업그레이드에 따른 훅과 사용처 수정"

* 🎨 design(#8): label 반응형 크기 수정

* ✨ feat(#20) 내가 받은 초대 목록 컴포넌트 제작 (#99)

* ✨ feat(#20): 내가 초대받은 대시보드 목록을 보여주는 페이지 추가
- 임시로 초대받은 대시보드 목록을 보여주는 페이지를 추가

* 🎨 design(#20): Image 오류 수정

* ✨ feat(#20): API 연동 및 UI 구현 완료

* ✨ feat(#20): 초대 목록 state 관리 및 렌더링 구현

* ✨ feat(#20): 초대받은 대시보드 검색 기능 추가

* ♻️  refactor(#20): 내가 받은 초대 목록 컴포넌트 구조 변경 및 분리

* ♻️  refactor(#20): getInvitationsList 수정

* ✨ feat(#20): 초대 수락 시 대시보드 리스트 갱신

* ✨ feat(#20): 무한스크롤 구현
- 검색 기능 API 연동해서 검색하도록 구현

* 🎨 design(#20): 반응형 디자인 설정

* 🛠  fix(#20): 초대 목록 무한스크롤 수정

* ✨ Feat: 전역 모달 1차 완료 (#97)

* ✨ feat(#42): redux 모달 상태 관리 추가

* ✨ feat(#42): _app에 Modal 컴포넌트 추가

* ✨ feat(#42): modal 컴포넌트 추가

* ♻️  refactor(#42): button 컴포넌트 변경

* ✨ feat(#94, #42): 공통 모달 알림창 구현

* ✨ feat(#94, #42): openModal의 props optional로 변경

* ✨ feat(#42): 초대하기, 컬럼 생성 모달 구현

* ✨ feat(#42, #17): 대시보드 생성 모달 구현

* ✨ feat(#42, #17): 초대하기 모달 valid 추가

* 🚚 rename(#42): 상수 네이밍 변경

* ✨ feat(#42): 컬럼 삭제 수정 모달, props 추가

* ✨ feat(#42): 모달 props 타입 추가

* ✨ feat(#42): 모달 프롭 타입 정의

* ✨ feat(#42): null 값 초기화 제거

* ✨ feat(#42): 대시보드 생성 모달, 컬럼 생성 모달 API 연결

* ✨ feat(#42): 대시보드 멤버 초대 API 연결

* 🛠  fix(#42): 대시보드 생성 모달 컬러 버튼 색상 보이게 수정

* 🛠  fix(#42): 대시보드 생성 모달 컬러 버그 수정

* ✨ feat(#42): 컬럼 수정 및 삭제하기 API 연결

* ✨ feat(#42, #109): 대시보드 삭제 모달 및 대시보드 삭제 API 연결

* ✨ feat(#42): 초대하기 모달, 존재하지 않는 멤버 초대 시 에러 메시지 출력

* 🛠  fix(#42): 함수 이름 변경

* 🎨 Design(#85, #87): 헤더와 사용자 프로필, 드롭다운 디자인 완성 (#105)

* 🎨 design(#85): 아이콘 가운데정렬

* 🎨 design(#87): 드롭다운 디자인 적용

* 🛠  fix(#87): 드롭다운 메뉴 선택시 드롭다운 닫기

* 🛠  fix(#85): 대시보드 헤더에서 직접 상세정보 조회하도록 변경

* 🎨 design(#85): 랜딩 헤더 로고 반응형

* ♻️  refactor(#85): 대시보드 헤더 컴포넌트 파일 분리

* 🎨 design(#85): 대시보드 헤더 멤버목록 반응형 디자인 (노가다)

* ✨ Feat(#27): 비밀번호 변경 기능 (#102)

* 🎨 design(#27): 비밀번호 변경 기능 반응형 디자인 구현

* ✨ feat(#27): 비밀번호 유효성 검사

* 🛠  fix(#8): 프로필 변경 관련 타입 export 하도록 변경

* ✨ feat(#27): 비밀번호 변경 기능 구현

* 🎨 design(#27): 마이페이지에 비밀번호 변경 폼 배치

* 🛠  fix(#27): 입력 유효성 검사 로직 변경

- 모두 포커스 아웃 될 때 검사
- 새 비밀번호가 기존 비밀번호랑 같은 경우 거절 (서버에서도 거절하며, 변경 의미가 없으므로)
- 값 입력 안되어있을 때 버튼 비활성화

* 🛠  fix(#8, #27): type export/import 관련 문제 해결

* ✨ Feat(#84): 사용자 아이콘 색상 배정 함수 구현과 색상 설정 (#107)

* 🎨 design(#84): 프로필 아이콘 색상 설정

* ✨ feat(#84): 프로필 아이콘 배경 색상 적용

* ✨ Feat: Card 컴포넌트 (대시보드 페이지) (#117)

* ✨ feat(#13): define Card Interface

* ✨ feat(#13): 컬럼 내 카드 개수 데이터 표시(API 연결)

* ♻️  refactor(#58): 서비스 함수들 파라미터 id 타입들을 number로 수정

* ✨ feat(#19): 날짜 형식 포맷팅 함수 정의

* 🎨 design(#41): 대시보드 페이지 내 div태그 제거

* 🛠  fix(#31): 메인 레이아웃 내 수직 스크롤 제거

* 🛠  fix(#12): 컬럼 섹션 내 스크롤 수정

* 🛠  fix(#13): 컬럼 queryKey 값 수정

* ✨ feat(#13): 컬럼 내 카드 렌더링 & 컬럼 내 수평 스크롤 추가

* ✨ feat(#19): 할일 카드 컴포넌트 추가

* ✨ feat(#19): 태그컬러 자동생성 유틸함수 정의

* ✨ feat(#19): 카드 상세 데이터 조회 GET 함수 추가

* ⚙️  chore(#19): 태그전용 컬러 4종 추가

* ✨ feat(#19): 카드 내 ProfilIcon 추가

* 🛠  fix(#19): 카드 내 이미지 값이 있을 때만 렌더링되도록 수정

* 🛠  fix(#12): 컬럼 추가 버튼 내 마진값 수정

* ✨ feat(#13): 컬럼수정 모달 연동

* ✨ feat(#12): 컬럼추가 모달 연동

* 🛠  fix(#12): 컬럼 내 x-scroll 버그픽스 - width크기 임시 지정

* 🛠  fix(#13): 컬럼 내 y-scroll 버그픽스 - height 값 수정

* 💬 comment(#12): 컬럼추가 모달을 위한 주석 추가

* 🛠  fix(#12): 컬럼섹션 내 오버스크롤 수정

* ✨ feat(#104): 사이드바 페이지네이션 구현 및 이동 버튼 추가 (#110)

* ✨ feat(#104): 사이드바 페이지네이션 구현 및 이동 버튼 추가
- 내 대시보드, 내 페이지 이동 버튼 추가

* 🎨 design(#104): 디자인 수정

* ✨ feat(#104): 사이드바에 대시보드 생성 모달 연동

* 🎨 design(#104): 사이드바 스켈레톤 추가

* ✨ Feat(#7): 회원가입 모달 연결 (#112)

* ✨ feat(#7): 회원가입 모달 연결

* ✨ feat(#7): email 중복 시 이메일 필드 비우기

* ✨ feat(#7): 이메일 input focus 및 비우기, 일반 텍스트 전달 받는 모달 추가

* ✨ Feat: 초대 내역 컴포넌트 (#116)

* 🎨 design(#23): 초대내역 컴포넌트 반응형 디자인

* ✨ feat(#23): 초대내역 불러오기 기능 구현 (페이지내이션)

* 🛠  fix(#23): ol의 모든 자식 태그에 고유한 key 부여

* ✨ feat(#23): 초대 취소 기능 구현

* ♻️  refactor(#23): useDeleteData 훅으로 다른 delete 함수들도 호출할 수 있도록 함

* ✨ feat(#23): 페이지네이션 텍스트 없이 사용 가능하게 변경

* ♻️  refactor(#23): 기존 코드에서도 페이지네이션 컴포넌트 사용하도록 변경

* 🛠  Fix(#84): 멤버의 프로필색상을 제대로 보여줄 수 있도록 수정 (#120)

* 🛠  fix(#84): 멤버의 프로필색상을 제대로 보여줄 수 있도록 수정

* 🛠  fix(#84): 카드 컴포넌트에서도 userId 사용하도록 수정

---------

Co-authored-by: 류혜원 <[email protected]>

* 🛠  Fix(#118): 새 비밀번호도 글자수 확인하도록 변경 (#126)

🛠  fix(#118): 새 비밀번호도 글자수 확인하도록 변경

* 🎨 design(#124): 내 대시보드 대시보드 목록 스켈레톤 설정 (#125)

* 🎨 design(#124): 내 대시보드 대시보드 목록 스켈레톤 설정

* 🎨 design(#124): 대시보드 초대 목록 스켈레톤 설정

* ♻️  refactor(#124): 중복 코드 배열로 묶음

* ✨ Feat: Tags 컴포넌트 (#130)

* ⚙️  chore(#127): tailwind.config 내 태그컬러 정의 제거"

* 🛠  fix(#12): 컬럼섹션 내 너비/높이 값 버그  수정

* 🗑  remove(#127): generateTagColor 유틸함수 삭제

* ✨ feat(#127): add Tags Component

* 🛠  fix(#19): 프로필아이콘 조건부 렌더링

* 🛠  fix(#127): generateTagIndex 함수를 이용한 고유 색상값 지정 & 파라미터 수정

* 🛠  fix(#127): generateTagIndex 수정

- generateTagIndex 파라미터 원래대로 수정
- 색상 종류 6가지로 수정(NUM_TAG_COLORS)
- yellow, purple 색상 추가(상수 객체)

* ✨ Feat: 로그인 폼, 회원가입 폼 모달 연결 및 모달 리팩토링 (#132)

* ✨ feat(#6): 로그인 폼 모달 연결

* ♻️  refactor(#6): 모달 프롭 제거

* ♻️  refactor(#6): 알림 모달 제거 후 텍스트 모달로 변경

* ♻️  refactor(#6): 모달 index 코드 정리

* 🗑  remove(#6): notificationModal 제거

* ✨ Feat: 멤버 컴포넌트  (#128)

* 🎨 design(#24): 구성원 컴포넌트 반응형 디자인 완성

* ✨ feat(#24): 구성원 불러오기와 페이지네이션 구현

* ✨ feat(#24): 멤버 삭제 기능 구현

* ✨ feat(#40): 대시보드 수정페이지 완성 (#134)

* ✨ feat(#40): 대시보드 수정페이지 완성

* 🛠  fix(#9): 헤더 모바일 높이 수정

* 🗑  Remove(#136): 안쓰는 파일 삭제 (dashboard, context) (#138)

* 🗑  remove(#136): dashboard 전역 상태 관련 안 쓰는 파일 삭제

* 🗑  remove(#136): context 폴더 삭제

* ♻️  Refactor(#121): 기본 모달 리팩토링 (#141)

* ♻️  refactor(#121): 기본 모달 리팩토링

- notificationModal: 설명과 확인 버튼만 존재. 특별한 작업 원할 시 onClick 선택적으로
- confirmModal: 삭제전 확인하는 모달. 삭제와 확인 버튼 존재. 삭제작업은 onActionClick 필수

* ♻️  refactor(#121): 새 컬럼 생성 모달 리팩토링

- 컬럼 중복 검사 추가
- 추가시 화면에 반영되도록 refetch
- 컬럼 10개 있을 때 더 생성하지 못하도록 막음

* 🗑  remove(#121): default modal 삭제하고 빈 notification으로 대체

* 🛠  fix(#121, #84, #24): button 타입 지정 + 대시보드관리 구성원 컴포넌트 프로필 아이콘 변경 반영

* 🛠  fix(#121): 모달에서 dashboard id 알아서 가져다 쓰도록 변경

* ✨ Feat(#25): 대시보드 정보 수정 컴포넌트 추가 (#143)

* ✨ feat(#25): 대시보드 정보 수정 컴포넌트 추가

* 🛠  fix(#25): 코드 리뷰 반영 및 주석 제거

* 🎨 design(#129): 화면 세로 크기를 줄이면 레이아웃이 고장나는 버그 수정 (#133)

* 🎨 design(#129): 화면 세로 크기를 줄이면 레이아웃이 고장나는 버그 수정

* 🎨 design(#129): UI 높이 고정

* 🎨 design(#129): 대시보드 제목이 긴 경우 생기는 문제 해결
- 사이드바 크기 조정
- 대시보드 리스트 아이템 크기 조정

* ♻️  refactor(#121, #114, #21): 컬럼 수정 모달 리팩토링 및 적용 (#147)

* ♻️  refactor(#121, #114, #21): 컬럼 수정 모달 리팩토링

- 중복 이름 방지
- 변경사항 바로 반영되도록 쿼리 무효화
- 사용처인 dashboard 변경 (추가 파일 정리)

* 🛠  fix(#121): 에러 발생 시 입력 하단에 에러메시지 출력하도록 변경

* ✨ feat(#121, #21): 글자수 10자 제한

* ♻️ Refactor(#121, #22): 초대하기 모달 리팩토링 및 적용 (#148)

* ♻️  refactor(#121, #22): 초대하기 모달 컴포넌트 리팩토링

* ✨ feat(#121, #9, #23): 초대하기 모달 적용

* 🛠  fix(#121): 초대 버튼 글자 변경, 초기 비활성화 설정

* ♻️ Refactor: 대시보드 생성 모달 리팩토링 및 적용 (#150)

* ♻️  refactor(#121, #17): 대시보드 생성 모달 리팩토링

- 에러 출력 추가

* ✨ feat(#121): 대시보드 생성 모달 적용

* ✨ feat(#121, #17): 글자수 10자 제한

* ✨ Feat: 카드 DnD (대시보드 페이지)  (#145)

* ⚙️  chore(#131): install react-beautiful-dnd

* ⚙️  chore(#131): next.config 내 reactStrictMode false로 변경

* 🎨 design(#19): 카드 컴포넌트 오른쪽 마진값 제거

* ✨ feat(#131): 대시보드 내 카드 DnD 구현

- react-beautiful-dnd 라이브러리 활용(DragDropContext: 컬럼 섹션, Droppable: 개별 컬럼/카드, Draggable: 카드)
- 한 컬럼 내 & 다른 컬럼으로의 카드 이동
- 다른 컬럼으로의 이동시, 컬럼 ID값을 수정하기 위한 PUT API 함수 정의

* 🛠  fix(#131): 한 컬럼 내 카드 DnD 기능 삭제

* 🗑  Remove(#136): 누락된 useFetchDashboard 삭제 (#159)

🗑  remove(#136): 누락된 useFetchDashboard 삭제

* ✨ feat(#10): 랜딩페이지 제작 (#115)

* ✨ feat(#10): 랜딩페이지 임시 제작

* 🎨 design(#10): 반응형 디자인 추가

* ✨ feat(#10): 로그인 후 로고 클릭 시 내 대시보드로 이동하는 기능 추가
- 로그인 전에는 랜딩 페이지로 이동하도록 수정

* 🎨 design(#10): Footer 링크 제거 및 색 변경

* 🛠  Fix(#128): 배포 오류 해결 (#161)

🛠  fix(#128): 잘못 붙은 copy 삭제

* 🛠  fix(#158): 내 대시보드 스켈레톤 key 문제 해결 (#160)

* 🛠  fix(#137): 드롭다운 클릭효과 범위 수정 (#139)

* 🛠  fix(#137): 드롭다운 클릭효과 범위 수정

* 🎨 design(#137): 잘 보이게 크기 수정

* 🛠  fix(#137): 전역에서 드롭다운 닫을 수 있도록 변경

* ✨ feat(#157): 404 페이지 제작 (#163)

* ✨ feat(#157): 404 페이지 제작

* ✨ feat(#157): 404 페이지에서 레이아웃 안나오게 수정

* ✨ feat(#157): 로그인 시 404페이지에서 사이드바 보이게 설정

* ♻️  Refactor(#121): 함수를 분리하여 타입 점검함으로써 타입 단언 방어 (#151)

* ♻️  refactor(#121): 함수를 분리하여 타입 점검함으로써 타입 단언 방어

* 🛠  fix(#121): 글자수 제한 15자로 변경

* ✨ feat(#121): 대시보드 생성 시 생성된 대시보드로 이동

* ✨ Feat(#90): 비밀번호 암호화  (#164)

* ⚙️  chore(#90): .env를 .gitignnore에 추가

* ⚙️  chore(#90): sha256 설치

* ✨ feat(#90): 비밀번호 암호화 (돕는 key를 .env에 저장)

* 🎨 design(#171): 내 대시보드 고정된 디자인 수정 (#175)

* 🎨 design(#171): 내 대시보드 고정된 디자인 수정

* 🎨 design(#162): HTML HEAD 설정

* 🎨 design(#171): 내 대시보드 PC, Mobile 최대 가로 사이즈 설정

* 🎨 design(#162): HTML 프리뷰 추가

* 🛠  Fix(#77): 재요청 횟수 제한 (#172)

* 🛠  fix(#85): 헤더 수정 (#169)

* 🛠  fix(#85): 헤더 구성원 프로필 오류 해결

- 구성원 숫자 바르게 (totalCount)
- 구성원 수에 맞는 사이즈 갖도록
- 385px일 때 레이아웃 깨지지 않도록 모바일 헤더 패딩 줄임

* 🎨 design(#9, #171): 모바일 사이즈에서 헤더 버튼 아이콘만 보이도록 변경

* 🛠  fix(#168): 대시보드 생성자가 아니면 관리 버튼 보이지 않도록 함

* 🛠  fix(#171): 디자인 오류 수정

- 위치 적절하도록 header relative 설정
- z index 설정

* ✨ Feat(#173): 모달 적용하기 (#174)

* ✨ feat(#173): 계정관리 - 프로필 변경에 모달 적용

- 추가로 변경사항 있을때만 버튼 활성화

* ✨ feat(#173): 계정관리 - 비밀번호 변경에 모달 적용

* ✨ feat(#173): 대시보드 수정 - 구성원 삭제 모달 연결

* 🎨 design(#121): 모달 텍스트 줄바꿈 반영, 글씨 가운데정렬

* ✨ feat(#173): 대시보드 수정 - 대시보드 삭제 기능 구현 및 모달 연결

* ✨ Feat(#82) : 로그인 상태에 따른 리다이렉션 구현 (#154)

* ✨ feat(#82): 로그인 상태에 따른 리다이렉션 구현

* 🛠  fix(#82): 리다이렉트 로직 수정

---------

Co-authored-by: un0211 <[email protected]>

* ❗️HOTFIX(#82): 리다이렉션 중 이전 모달 사용하는 부분 수정 (#186)

* 🛠  fix(#185): 대시보드 이름 수정 시 15자 길이 제한 (#187)

* 🛠  fix(#185): 대시보드 이름 수정 시 15자 길이 제한

* 🛠  fix(#185): 회원가입 시 닉네임 10자로 길이 제한

* ✨ Feat(#156): 대시보드 초대 알림 기능 추가 (#178)

* 🚚 rename(#156): 헤더 폴더구조 변경

* ⚙️  chore(#156): toastify 추가

* ✨ feat(#156): 초대 알림 토스트 구현 (3초마다 갱신)

* 🚚 rename(#156): 위치 변경, 재요청 간격 5초로 조정

* ✨ Feat(#11): 할 일 카드 생성 모달 컴포넌트 구현 (#184)

* ✨ feat(#11): 할 일 카드 모달 퍼블리싱 및 columnId 전달

* ✨ feat(#11): 담당자 선택 드랍다운 구현

* ✨ feat(#11): 할 일 카드 생성 기본 폼 구현

* Merge branch 'develop' into feature/newCardModal

* ✨ feat(#11): 생성 API 연결

* ✨ feat(#11): 모달 폼 디자인 수정 및 isEdit 프롭 추가

* ⚙️  chore(#11): react-datepicker 라이브러리 설치

* ✨ feat(#11): 이미지 API 수정

* 🗑  remove(#11): react-datepicker 제거

* 🛠  fix(#11): 코드 리뷰 반영

* 🎨 design(#171): 전체 레이아웃과 내 대시보드 디자인 문제 수정 (#189)

* 🎨 design(#171): 내 대시보드 높이 디자인 문제 수정

* 🎨 design(#171): 내 대시보드 흰색 부분 최대 높이 지정

* 🎨 design(#171): 내 대시보드 모바일 크기 수정

* 🎨 design(#171): 초대받은 대시보드 목록 버튼 크기 수정

* 🎨 design(#171): 레이아웃 전반적인 문제 해결

* 🎨 design(#171): 대시보드 페이지 레이아웃 개선

- 너비 조정 (사이드바 크기 맞게, PC만)
- 높이 조정 (full로 채우게)
- section 안에 굳이 div 필요 없을 것 같아 삭제

---------

Co-authored-by: un0211 <[email protected]>

* 🎨 Design(#171) 헤더 관련 디자인 수정사항 (#190)

* 🎨 design(#171): 닉네임 길어도 헤더 깨지지 않게 간격 조정

* 🎨 design(#171): 구성원 수에 맞게 멤버 프로필 영역 너비 변경

* 🎨 design(#171): 헤더 간격 재조정 (패딩 늘리기)

* 🛠  fix(#168): 대시보드 초대 알림 문제 해결 (#193)

🛠  fix(#168): 대시보드 초대 알림 비로그인 시 계속 호출되는 문제 해결

* 🛠  fix(#11): 카드 생성 모달 태그 색상 추가 (#195)

* 🛠  fix(#11): 카드 생성 모달 태그 색상 추가

* 🛠  fix(#11): 태그 컴포넌트 수정 및 적용(삭제 기능 동작하도록)

---------

Co-authored-by: un0211 <[email protected]>

* 🎨 design(#171): 로그인/회원가입 여백설정 (#191)

* 🎨 design(#171): 로그인/회원가입 여백설정

* 🎨 design(#171): 로그인/회원가입 Tablet, PC 최대 높이 지정

---------

Co-authored-by: jmj <[email protected]>

* 🛠  fix(#168): 초대알림에서 user 접근 시 에러 해결 (#196)

* ✨ Feat: 할일 카드 모달 (#180)

* 🎨 design(#127): 태그 호버시 커서 디자인 수정

* ♻️  refactor(#3): formatDate 함수 시간까지 볼 수 있도록 수정

* 🎨 design(#12): 대시보드 스크롤 태블릿 이하에서는 안보이도록  수정

* ✨ feat(#3): 할일카드 모달 선언 & 타입 선언

* ✨ feat(#3): 할일카드 모달 관련 API 함수 추가

- 댓글 조회, 생성, 수정, 삭제 API 함수 정의
- POST용 CommentForm 타입 정의

* ✨ feat(#3): 할일카드 모달 & 댓글 기능 추가

* 🎨 design(#3): 할일카드 모달 내의 디자인 수정

- 스크롤 보이게 하기
- (꼽사리 커밋) 데스크톱 화면에서 컬럼 너비 고정되도록 수정

* 🎨 design(#127): 할일카드 태그 스크롤/줄바꿈 디자인 추가

* ✨ feat(#3): 수정하기 드롭다운 추가

- 수정하기/삭제하기 드롭다운 추가
- 카드 삭제 DELETE API 함수 정의

* 🎨 design(#3): 수정 칸 패딩 & 댓글 줄바꿈 추가

* 🎨 design(#3): 담당자&마감일 섹션 수징 중앙 정렬

* 🎨 design(#3): 할일카드 모달 내 디자인 오류 수정

* ⚙️  chore(#3): 할일카드 모달 배포 테스트

* ✨ Feat(#155): 대시보드 공유 기능 (#181)

* 🎨 design(#155): 토글 디자인, 클릭 기능 구현

* ✨ feat(#155): 대시보드 생성 시 공유선택하면 공유 계정 멤버로 추가

* ✨ feat(#155): 대시보드 수정 페이지에서 공유 on/off에 따른 멤버 추가 삭제

* ✨ feat(#155): 공유계정 멤버 삭제시 자동 공유 취소

* 🎨 design(#155): 공유 시 로그인 안한 상태에서도 헤더 보이게 변경

* 🎨 design(#157): 404 페이지에서 헤더 보이게 수정 후 디자인 조정

* 🎨 design(#155): 로그인 안한 상태에서 공유 대시보드 접근 시 사이드바 제거

* ↔️  style(#155): 안쓰는 코드 제거

* 🛠  fix(#9, #155): 멤버 삭제시 상단 멤버 프로필에 반영

* ✨ feat(#155, #168): 관리 페이지 접근 권한 없을 경우 리다이렉트

* 🛠  fix(#162): 프리뷰 안뜨는 문제 수정 (#204)

* ❗️ HOTFIX(#24): 대시보드 생성자 멤버 삭제 불가능하게 변경 (#203)

🛠  fix(#24): 대시보드 생성자 멤버 삭제 불가능하게 변경

* 🎨 design(#171): 랜딩 페이지 디자인 수정 (#192)

* 🎨 design(#171): 랜딩 페이지 가로 크기 오버되는 문제 해결

* 🎨 design(#171): 랜딩 페이지 이미지 수정

* 🛠  fix(#200): 같은 대시보드 초대를 하나만 받을 수 있도록 수정 (#201)

* 🎨 Design(#153): 다크 모드 설정 (#197)

* 🎨 design(#153): 다크 모드 추가

* 🎨 design(#153): 내 대시보드 페이지 다크 모드 추가

* 🎨 design(#153): 모든 페이지, 모달 다크 모드 추가

* 🎨 design(#153): 할 일 모달 댓글 다크모드 적용

* 🎨 design(#153): 테마 버튼 수정

* 🎨 design(#153): 버튼 디자인 수정

* 🎨 design(#153): 취소 버튼 색상 변경

* 🎨 design(#153): 로그인, 회원가입 페이지 다크모드 적용

* ✨ Feat(#18): 할 일 카드 수정 모달 구현  (#205)

* ✨ feat(#11): 할 일 생성 모달 컬럼 드랍다운 추가

* ✨ feat(#11): 할 일 카드 생성 및 수정 props 변경

* ✨ feat(#11): 할 일 카드 모달 수정 완성

* ✨ feat(#11): submit 버튼 로딩 시 disabled

* 🗑  remove(#11): 주석 제거

* ✨ feat(#18): 컬럼 변화 없을 시 수정 버튼 비활성화

* ✨ feat(#11, #18): 제목 길이 제한 추가 (한글 25자, 영어 50자)

* 🛠  fix(#198): 초대목록 변동 생길 경우를 고려해 필터링 기준을 시간으로 변경 (#202)

* ✨ Feat(#210): 할 일 카드 수정 및 생성 추가 기능 구현 (#212)

* ✨ feat(#18): 수정 -> 취소 시 할 일 카드 다시 오픈 기능 구현

* ✨ feat(#11, #18): 생성 및 수정 시 카드 오픈

* ✨ feat(#11, #18): 로딩 스피너 구현

* 🛠  fix(#11, #18): 생성 시 생성 완료 모달로 변경 및 타입 변경

* 🛠  Fix(#153): 다크모드로 바뀐 버튼 디자인 복귀 (#216)

🎨 design(#153): 다크모드로 바뀐 버튼 디자인 복귀

* ✨ Feat(#209): 폰트 적용 (#219)

* 🎨 design(#209): 나눔고딕, Pretendard 폰트 적용

* 🎨 design(#209): 프로필 아이콘에 나눔고딕 폰트 적용

* 🛠  fix(#219): font weight 400 기본 설정 다시 추가

* 🎨 design(#217): 다크모드 수정 (#218)

* 🎨 design(#217): 다크모드 수정

* 🎨 design(#153): 다크모드로 바뀐 버튼 디자인 복귀

---------

Co-authored-by: un0211 <[email protected]>

* 🛠 Fix: 대시보드 페이지 내 버그 수정 (#214)

* ♻️  refactor(#12): 프롭 id명을 dashboardId로 수정

* 🎨 design(#180): 수정 드롭다운을 위한 z-index 수정

* 🛠  fix(#180): 날짜가 -1로 찍히는 문제 수정 (fix formatDate.ts)

* 🛠  fix(#182, #194): 카드 데이터 쿼리 무효화 적용

* 🎨 design(#171): 대시보드 내 종합 디자인 수정

- #207 : 카드 컴포넌트 댓글 개수 보여주기
- 대시보드 반응형 디자인 수정
- 카드 이미지 placeholder 지정
- 프로필이미지 깨짐, 카드 제목 깨짐 수정
- 카드에  댓글이 없을 때 빈댓글 이미지 표시
- 카드 설명글 줄바꿈 반영
- 카드 모달 내 애니메이션들 추가

* ✨ feat(#3): 댓글 입력 없이 제출하면 에러메시지 뜨는 기능 추가

* 🛠  fix(#4): 카드모달 댓글 섹션 깜빡거림 문제 수정 (refetch 적용)

* ✨ feat(#166): 컬럼 섹션 스켈레톤 UI 적용

* 🛠  fix(#4): refetch & useEffect 훅을 컴포넌트 최상위 레벨에서 호출되도록 분리

* 🎨 design(#3): 댓글 에러메시지 패딩 수정

* 🛠  fix(#4): 댓글 에러를 버튼 disabled로 변경

* 🎨 design(#184): 카드 모달 내 프로필아이콘 폰트 크기 수정

- 할일 생성/수정 카드 내의 프로필아이콘
- 댓글 내의 프로필아이콘

* 🎨 design(#171): 할일카드 모달 내 프로필 아이콘 크기 수정

* ♻️ refactor(#167): 내 대시보드 페이지 서버 사이드 렌더링 적용 (#199)

* ♻️  refactor(#167): 내 대시보드 페이지 서버 사이드 렌더링 적용

* ♻️  refactor(#167): 내 대시보드 서버 사이드 렌더링 수정

* 🛠  fix(#167): 서버사이드 중복 코드 제거

* 🛠  fix(#167): 초대 목록 함수 수정

* 🛠  fix(#167): 이미지 불러오는 성능 개선

* 🛠  fix(#167): 컨플릭트 해결

* ✨ feat(#188): 대시보드 즐겨찾기 추가 (#213)

* ✨ feat(#188): 대시보드 즐겨찾기 API 추가

* ✨ feat(#188): 대시보드 즐겨찾기 3개 제한 기능 추가

* ✨ feat(#188): 대시보드 즐겨찾기 사이드바에 추가

* 🛠  fix(#188): 대시보드 즐겨찾기 갯수 제한 수정

* 🛠  fix(#188): 대시보드 갯수 제한 수정

* 🛠  fix(#188): request.http 제거

* 🛠  fix(#188): 대시보드 즐겨찾기 유저마다 받아오게 설정

* 🛠  fix(#188): 즐겨찾기 제거기능 수정

* 🛠  fix(#188): 즐겨찾기 최대 3개까지 추가 가능하게 수정

* 🛠  fix(#188): 즐겨찾기 추가 안되는 버그 수정

* 🛠  fix(#188): 즐겨찾기 에러 수정

* 🛠  fix(#188): 즐겨찾기 useFetchData 사용해서 불러오게 수정

* 🛠  fix(#188): 즐겨찾기 버그 수정

* 🛠  Fix(#168): 권한에 따른 페이지 접근 제어 (#211)

* 🛠  fix(#82): 훅 최상위에서만 쓰도록 변경

* 🛠  fix(#168): 공유계정으로 하는 요청 제한

* 🛠  fix(#168): 생성자가 아닌 경우 대시보드 관리 페이지 접근시 리다이렉트

* 🎨 design(#168): 대시보드 관리페이지 에러문구 개선

* 🛠  fix(#168): 대시보드 관리페이지 접근 완전 제어, 리다이렉트 훅 형식 변경

* 🛠  fix(#168): 대시보드 접근 제어

* 🎨 design(#168, #41): 공유 대시보드 비로그인 상태일때 레이아웃 꽉 차게

* 🛠  fix(#168): 공유계정에서 모든 수정 기능 비활성화

* 🛠  fix(#4, #21): 변경사항 없을 시 버튼 비활성화 (댓글수정, 컬럼 수정

* 🛠  fix(#168): 리다이렉트 수정 (랜딩, 404)

- 랜딩: 로그인 상태일때 모달 없이 바로 나의 대시보드로
- 404: 3초 뒤 로그인 여부에 따라 랜딩 or 나의 대시보드로

* 🛠  fix(#168): 멤버가 아닌 로그인 한 사람도 수정 버튼 비활성화

* 🎨 design(#13): 대시보드 컬럼 길이 수정 (#220)

* 🛠 fix(#212, #211): 배포 오류 해결 (#222)

* 🛠  fix(#212): postCardDat -> PostCardData

* 🛠  fix(#211): 할 일 카드 모달 여는 곳마다 isMember 인자 추가

* 🛠  fix(#212): postCardDat -> PostCardData

* 🛠  fix(#214): 할 일 수정에서 컬럼 변동 시 두 컬럼 모두 새로고침하도록 수정 (#223)

* 🛠  fix(#198): 첫 번째 초대도 알람 올 수 있게 변경 (#224)

* 🎨 design(#188): 사이드바 즐겨찾기 글자 수정 (#221)

* 🎨 design(#188): 사이드바 즐겨찾기 모바일 사이즈에서 아이콘으로 변경

* 🎨 design(#188): 사이드바 즐겨찾기 글자 수정

* 🎨 design(#188): 사이드바 디자인 수정

* 🎨 design(#153): 다크모드 버튼 위치 수정 (#228)

* 🎨 design(#153): 다크모드 버튼 위치 수정

- 랜딩 페이지는 항상 light 모드로 고정

* 🎨 design(#181): 토글 원이 정 가운데 오도록 높이고정

---------

Co-authored-by: un0211 <[email protected]>

* ♻️  refactor(#226): 즐겨찾기 기능 최적화 (#227)

* ♻️  refactor(#188): 즐겨찾기 기능 최적화
- 즐겨찾기용 유저 정보를 Redux에 저장하도록 변경
- 즐겨찾기 정보를 가져오는 요청을 최소화

* 🛠  fix(#226): 초기값 한번만 불러오게 변경

* 🛠  fix(#226): 로그아웃 시 즐겨찾기 정보 정리

---------

Co-authored-by: un0211 <[email protected]>

* ✨ Feat: 카드목록, 댓글목록 무한스크롤 적용 & 기타 리팩토링 (#225)

* ♻️  refactor(#3): 댓글 섹션 refetch - 언마운트시 쿼리를 취소하도록 변경

* 🎨 design(#166): 컬럼섹션 스켈레톤 수정

* 🗑  remove(#41): 쓰지 않는 index.tsx 파일 삭제

* ♻️  refactor(#4): 댓글 생성 날짜(UTC)도 포맷될 수 있도록 formatDate.ts 리팩토링

* 🎨 design(#166): 다크모드 컬럼 스켈레톤 색상 수정

* ✨ feat(#13): 컬럼 내 카드 무한스크롤 적용

- 10개를 기본으로 로드하고, 이후로는 1개씩 로드
- 로드 중인 카드는 로딩 스피너로 대체
- getCardsList() 서비스 함수 로직 수정

* 🎨 design(#166): 로딩 스피너 라이트모드에서 색상반전

* 🛠  fix(#13): 카드 패치 개수 5개로 수정

* ✨ feat(#4): 할일카드 내 댓글목록 무한스크롤 적용

* ✨ feat(#4): 할일카드 내 댓글목록 무한스크롤 적용

* ♻️  refactor(#58): getComments 서비스 함수 수정

* 🎨 design(#207): 댓글이 10개 이상이면 10+로 보이도록 지정

* 🎨 design(#166): 대시보드 페이지, 컬럼 섹션에 로딩 스피너 적용

* ♻️  refactor(#194): 쓰지 않는 refetch 함수 제거

* 🎨 design(#166): 카드 로딩스피너 투명도 수정

* 🎨 design(#4): 컬럼섹션 내 카드추가 버튼 높이 수정

* 📝 docs(#165): README.md 수정 (#215)

* 📝 docs(#165): 파일 README.md 1차 수정 (이미지, 팀원후기 추가 필요)

* 📝 docs(#165): 드래그 앤 드롭 설명 추가

* 📝 docs(#165): 즐겨찾기 설명 추가

* 📝 docs(#165): 다크모드 설명 추가

* 📝 docs(#165): 즐겨찾기 설명 수정

* 📝 docs(#165): 유저플로우 추가

* 📝 docs(#165): 페이지 이미지와 일부 설명 추가

* 📝 docs(#165): 시연영상 추가

---------

Co-authored-by: Jiyun Kim <[email protected]>
Co-authored-by: jmj <[email protected]>

---------

Co-authored-by: DAEYANG LEE <[email protected]>
Co-authored-by: JMJ <[email protected]>
Co-authored-by: Jiyun Kim <[email protected]>
Co-authored-by: jmj <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

📝 dashboard edit 대시보드 수정 페이지 관련 ✨ feat 새로운 기능 추가

Projects

Status: Done

Development

Successfully merging this pull request may close these issues.

✨ Feat: 대시보드 정보 수정 컴포넌트 (대시보드 수정 페이지)

5 participants