Skip to content

[RELEASE] 데모데이를 위한 프론트 배포#257

Merged
jeonbinggu merged 58 commits intomainfrom
develop
Feb 12, 2026
Merged

[RELEASE] 데모데이를 위한 프론트 배포#257
jeonbinggu merged 58 commits intomainfrom
develop

Conversation

@jeonbinggu
Copy link
Contributor

🔀 Pull Request Title

데모데이를 위한 프론트 배포


🎞️ 주요 코드 설명

주제1

주제2


📌 PR 설명

이번 PR에서 어떤 작업을 했는지 요약해주세요.

  • [ ]
  • [ ]
  • [ ]

📷 스크린샷

UI 변경이 있을 경우 스크린샷을 첨부해주세요.


jeonbinggu and others added 30 commits February 11, 2026 07:39
MlNTYS and others added 24 commits February 12, 2026 19:08
…Sheet(#224)

[BUG] 현상관리 바텀시트 최소 높이 고정
…-change(#227)

[FIX] TextArea 최소 글자 관련 수정
…filter(#228)

[FEAT] 사진수다 검색에서 빈화면에 필터링 추가
…ssage(#242)

[BUG] 토스트 메세지 관련 오류 수정
)

[FIX] 예상 작업 완료 시간 관련 로직 수정
…qa-2-pm031(#202)

[REFACTOR] 현상관리 페이지 2차 QA 반영
@vercel
Copy link

vercel bot commented Feb 12, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
finders Ready Ready Preview, Comment Feb 12, 2026 2:59pm

@jeonbinggu jeonbinggu self-assigned this Feb 12, 2026
@jeonbinggu jeonbinggu merged commit 43aebec into main Feb 12, 2026
2 checks passed
@gemini-code-assist
Copy link
Contributor

Summary of Changes

Hello @jeonbinggu, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

이 Pull Request는 사용자 경험을 향상하고 애플리케이션의 안정성을 높이는 데 중점을 둡니다. 주요 변경 사항으로는 프로젝트 문서화의 대폭 개선, UI 컴포넌트의 기능 및 유효성 검사 로직 강화, 데이터 캐싱 및 상태 관리 최적화, 그리고 주소 및 인쇄 주문 관련 사용자 흐름의 명확화가 있습니다. 또한, 자산 관리 효율성을 높이고 소셜 로그인 및 약관 페이지의 견고성을 확보하여 전반적인 프론트엔드 품질을 향상했습니다.

Highlights

  • README.md 업데이트 및 프로젝트 문서화 강화: 프로젝트 소개, 핵심 기능, 웹 파트 팀원, 기술 스택, 폴더 구조, 기술 의사결정 등 상세한 내용을 추가하여 README.md 파일을 대폭 개선했습니다. 이를 통해 프로젝트의 전반적인 이해도를 높이고 새로운 팀원이나 외부 기여자에게 유용한 정보를 제공합니다.
  • UI/UX 컴포넌트 기능 개선 및 리팩토링: BottomSheet 컴포넌트에 fixedMin prop을 추가하여 최소 높이 동작을 제어하고, TextArea 컴포넌트에 forwardRefisError prop을 적용하여 유효성 검사 피드백을 강화했습니다. CTA_Button의 간격을 조정하고 ToastMessage의 최소 높이를 제거하는 등 여러 공통 컴포넌트의 사용성과 유연성을 향상했습니다.
  • 데이터 관리 및 캐싱 전략 최적화: TanStack Query를 활용한 좋아요/좋아요 취소 기능에 낙관적 업데이트(optimistic updates)를 적용하여 사용자 경험을 개선하고, useInfinitePosts 훅의 staleTimegcTime을 조정하여 캐싱 효율을 높였습니다. useDebouncedTrue 훅을 추가하여 닉네임 유효성 검사 피드백의 깜빡임 현상을 방지했습니다.
  • 주소 관리 및 인쇄 주문 플로우 개선: 새로운 주소 상세 입력 페이지(AddressDetailPage)를 추가하고, 주소 선택 및 수령 방식 선택 페이지(SelectAddressPage, PickUpMethodPage)의 로직을 리팩토링하여 사용자 입력 흐름을 명확히 했습니다. 인쇄 옵션 페이지(PrintOptionPage)에서는 선택된 옵션을 즉시 저장하고, 견적 조회 로딩 상태를 명확히 표시하도록 개선했습니다.
  • 자산 관리 및 아이콘/이미지 사용성 개선: 사용하지 않는 SVG 아이콘들을 대량 제거하고, Apple.svg, bigLogo.svg, defaultProfile.svg, Kakao.svg 등 일부 아이콘 파일명을 소문자로 통일했습니다. 프로모션 배너 및 필름 뉴스 섹션의 이미지를 SVG에서 WebP 형식으로 변경하고 src/assets/images/index.ts를 통해 관리하도록 전환하여 성능을 최적화했습니다.
  • 카카오 로그인 및 약관 페이지 로직 강화: 카카오 로그인 콜백 페이지에서 인증 취소/거부 및 code 파라미터 누락 시 로그인 페이지로 리다이렉트하는 로직을 추가했습니다. 약관 페이지에는 IntersectionObserver를 도입하여 스크롤 위치에 따라 URL 해시를 자동으로 업데이트하는 기능을 구현했습니다.

🧠 New Feature in Public Preview: You can now enable Memory to help Gemini Code Assist learn from your team's feedback. This makes future code reviews more consistent and personalized to your project's style. Click here to enable Memory in your admin console.

Changelog
  • README.md
    • 프로젝트 소개, 핵심 기능, 팀원, 기술 스택, 폴더 구조, 기술 의사결정 등 상세 내용 추가
    • 이전 기술 스택 및 네이밍 컨벤션 섹션 제거
    • 핵심 기능 설명 업데이트 및 이미지 추가
  • eslint.config.js
    • React Hooks 관련 ESLint 규칙 (react-hooks/set-state-in-effect, react-hooks/refs, react-hooks/exhaustive-deps) 비활성화
  • src/assets/icon/Apple.svg
    • apple.svg로 파일명 변경
  • src/assets/icon/Kakao.svg
    • kakao.svg로 파일명 변경
  • src/assets/icon/bell-fill.svg
    • 파일 제거
  • src/assets/icon/bigLogo.svg
    • big-logo.svg로 파일명 변경
  • src/assets/icon/bookmark-empty.svg
    • 파일 제거
  • src/assets/icon/bookmark.svg
    • 파일 제거
  • src/assets/icon/bruned.svg
    • 파일 제거
  • src/assets/icon/camera-fill.svg
    • 파일 제거
  • src/assets/icon/caret-down-fill.svg
    • 파일 제거
  • src/assets/icon/chat-bubble-double-ellipsis.svg
    • 파일 제거
  • src/assets/icon/chat-bubble-double-fill.svg
    • 파일 제거
  • src/assets/icon/chat-square.svg
    • 파일 제거
  • src/assets/icon/check.svg
    • 파일 제거
  • src/assets/icon/confirmation.svg
    • 파일 제거
  • src/assets/icon/defaultProfile.svg
    • default-profile.svg로 파일명 변경
  • src/assets/icon/flim-image.svg
    • 파일 제거
  • src/assets/icon/headset-fill.svg
    • 파일 제거
  • src/assets/icon/headset.svg
    • 파일 제거
  • src/assets/icon/index.ts
    • 리네임된 SVG 아이콘 (apple.svg, big-logo.svg, default-profile.svg, kakao.svg) 경로 업데이트
    • 제거된 SVG 아이콘 (bookmark-empty.svg, bell-fill.svg, bruned.svg, camera-fill.svg, caret-down-fill.svg, chat-bubble-double-ellipsis.svg, chat-bubble-double-fill.svg, chat-square.svg, check.svg, flim-image.svg, headset-fill.svg, headset.svg, map-pin-fill.svg, photo.svg, ticket-fill.svg, to-do-list.svg, truck-fill.svg, main-sparkle.svg) 임포트 제거
    • 배너 이미지 임포트를 src/assets/images로 이동
  • src/assets/icon/main-sparkle.svg
    • 파일 제거
  • src/assets/icon/map-pin-fill.svg
    • 파일 제거
  • src/assets/icon/photo.svg
    • 파일 제거
  • src/assets/icon/ticket-fill.svg
    • 파일 제거
  • src/assets/icon/to-do-list.svg
    • 파일 제거
  • src/assets/icon/truck-fill.svg
    • 파일 제거
  • src/assets/images/index.ts
    • 새로운 파일 추가: WebP 이미지 자산 (develop.webp, scan-pic.webp, print.webp, delivery.webp, promotion-banner-1.webp, promotion-banner-2.webp, promotion-banner-3.webp, film-news-section-1.webp, film-news-section-2.webp, film-news-section-3.webp) 내보내기
  • src/assets/mocks/index.ts
    • 사용하지 않는 목업 SVG 임포트 제거
  • src/components/auth/AppleButton.tsx
    • Apple 로고 임포트 경로 업데이트
    • <img> 태그를 AppleIcon 컴포넌트로 대체
  • src/components/common/BottomSheet.tsx
    • fixedMin prop 추가 및 관련 로직 구현
    • 높이 계산 로직 및 useEffect 의존성 배열 업데이트
  • src/components/common/CTA_Button.tsx
    • 기본 클래스에 gap-2 추가
  • src/components/common/TextArea.tsx
    • forwardRef를 사용하여 ref 전달 기능 추가
    • isError prop 추가 및 에러 상태에 따른 스타일링 적용
    • 헬퍼 텍스트 및 에러 메시지 표시 로직 개선
  • src/components/common/ToastMessage.tsx
    • ToastItem 컴포넌트에서 min-h-[3.75rem] 스타일 제거
  • src/components/mainPage/ComunityGallarySection/CommunityGallerySectionCard.tsx
    • 좋아요/좋아요 취소 기능을 useMutation으로 리팩토링
    • 낙관적 업데이트 및 에러 핸들링 로직 추가
    • 좋아요 버튼의 disabledaria-pressed 속성 추가
  • src/components/mainPage/FilmNewsSection/FilmNewsSection.tsx
    • 이미지 임포트 경로를 src/assets/images로 업데이트
  • src/components/mainPage/Header.tsx
    • 헤더 스타일링에 pt-[env(safe-area-inset-top)] 추가
    • 헤더 내용을 div로 감싸 레이아웃 제어 개선
  • src/components/mainPage/NoticeSection/NoticeSection.tsx
    • 스크롤 가능한 리스트의 pb (padding-bottom) 값 조정
  • src/components/mainPage/PromotionBanner.tsx
    • 프로모션 배너 이미지를 SVG 아이콘에서 src/assets/images의 WebP 이미지로 변경
  • src/components/photoLab/Calendar.tsx
    • isSameDay 유틸리티 함수를 src/utils/dateFormat.ts에서 임포트하여 사용
  • src/components/photoLab/FilterBottomSheet.tsx
    • 오늘 날짜의 지난 시간 슬롯을 비활성화하는 isDateDisabled 로직 추가
    • 오늘 날짜의 지난 시간 슬롯을 숨기는 filteredSlots 로직 추가
    • 선택된 시간 적용 시 유효한 슬롯만 포함하도록 로직 업데이트
  • src/components/photoLab/detail/LabLocationSection.tsx
    • 불필요한 eslint-disable-next-line 주석 제거
  • src/components/photoManage/DropBox.tsx
    • 코드 주석 간소화
    • onSelect 핸들러에 e.stopPropagation() 추가하여 외부 토글 방지
  • src/constants/gcsUrl.ts
    • defaultProfile.svg 임포트 경로 업데이트
  • src/hooks/auth/onBoarding/useOnBoardingForm.ts
    • isTyping 상태 및 isNicknameErrorText 로직 추가
    • useDebouncedTrue 훅을 사용하여 닉네임 유효성 검사 에러 메시지 표시 개선
  • src/hooks/common/useDebounceValue.ts
    • useDebouncedTrue 훅 추가: boolean 값의 true 전환을 지연 처리
  • src/hooks/photoFeed/posts/useInfinitePosts.ts
    • TanStack Query의 staleTimegcTime 값 조정
  • src/hooks/photoFeed/reactions/useLikePost.ts
    • 좋아요 기능에 낙관적 업데이트 로직 추가: 게시글 상세 및 커뮤니티 미리보기 쿼리 모두 적용
  • src/hooks/photoFeed/reactions/useUnlikePost.ts
    • 좋아요 취소 기능에 낙관적 업데이트 로직 추가: 게시글 상세 및 커뮤니티 미리보기 쿼리 모두 적용
  • src/lib/buildProcessSteps.tsx
    • getEarlyFinishedHoursgetEarlyFinishedTime으로 변경
    • 작업 완료 시간을 분/시간/일 단위로 표시하도록 로직 업데이트
  • src/lib/getBannerContent.tsx
    • 배너 콘텐츠 이미지를 SVG 아이콘에서 src/assets/images의 WebP 이미지로 변경
  • src/pages/auth/KakaoCallbackPage.tsx
    • 카카오 OAuth 인증 취소/거부 및 code 파라미터 누락 시 로그인 페이지로 리다이렉트하는 로직 추가
  • src/pages/auth/TermsPage.tsx
    • IntersectionObserver를 사용하여 스크롤 위치에 따른 URL 해시 자동 업데이트 기능 구현
    • scrollIntoView 동작 개선 및 CTA 버튼 로직 조정
  • src/pages/mainPage/MainPage.tsx
    • 메인 페이지 레이아웃을 flex-colflex-1로 리팩토링하여 스크롤 관리 개선
    • 헤더에 pt-[env(safe-area-inset-top)] 적용
  • src/pages/mypage/edit-info/NickNameEditPage.tsx
    • 닉네임 편집 로직에 touchedRefisInitialSame 상태를 사용하여 유효성 검사 피드백 정밀화
    • 초기 닉네임 동기화 및 헬퍼 텍스트/스타일링 로직 개선
  • src/pages/mypage/tab/LikedPhotoLabPage.tsx
    • isEmpty 상태를 추가하여 즐겨찾기 현상소가 없을 때 빈 화면 표시
    • 스크롤 가능한 콘텐츠의 스타일링 조정
  • src/pages/mypage/tab/LikedPostPage.tsx
    • isEmpty 상태를 추가하여 좋아요한 게시글이 없을 때 빈 화면 표시
    • 스크롤 가능한 콘텐츠의 스타일링 조정
  • src/pages/mypage/tab/MyPostPage.tsx
    • 토스트 메시지 표시 로직을 toastTrigger로 리팩토링하여 상태 관리 개선
    • isEmpty 상태를 추가하여 내 게시글이 없을 때 빈 화면 표시
    • 스크롤 가능한 콘텐츠의 스타일링 조정
  • src/pages/photoFeed/NewPostPage.tsx
    • 제목 및 내용 입력 필드에 유효성 검사 및 에러 메시지 표시 기능 추가
    • scrollToCenter 유틸리티를 사용하여 에러 발생 시 해당 필드로 스크롤 및 포커스 이동
  • src/pages/photoFeed/PhotoFeedPage.tsx
    • 토스트 메시지 페이드 및 언마운트 지연 시간을 상수로 정의
    • 토스트 메시지 로직 업데이트: 언마운트 시 상태 제거
  • src/pages/photoFeed/PostPage.tsx
    • 토스트 메시지 지연 시간 상수를 임포트하여 사용
  • src/pages/photoFeed/ReviewPhotoLabPage.tsx
    • 리뷰 텍스트 입력 필드에 유효성 검사 및 에러 메시지 표시 기능 추가
    • scrollToCenter 유틸리티를 사용하여 에러 발생 시 해당 필드로 스크롤 및 포커스 이동
  • src/pages/photoManage/AddressDetailPage.tsx
    • 새로운 페이지 추가: 상세 주소 입력 및 Daum 주소 검색 연동
  • src/pages/photoManage/DetailInfoPage.tsx
    • 수령인 정보 입력 시 로컬 상태와 Zustand 스토어 동기화
    • 이름 및 휴대폰 번호 변경 시 스토어 deliveryAddress 업데이트
    • 다음 단계로 이동 시 selectedOptions 초기화
  • src/pages/photoManage/PhotoManageMainPage.tsx
    • BottomSheet 컴포넌트에 fixedMin={true} prop 추가
  • src/pages/photoManage/PickUpMethodPage.tsx
    • useAddressIdStore를 사용하여 선택된 주소 ID 관리
    • 수령 방식 선택 시 로컬 상태와 스토어 동기화
    • 다음 단계로 이동 시 주소 및 옵션 초기화 로직 추가
  • src/pages/photoManage/PrintOptionPage.tsx
    • 선택된 인쇄 옵션을 스토어에 즉시 저장하도록 로직 변경
    • 견적 조회 로딩 상태 (isQuoting) 추가 및 총 금액 표시 개선
    • 송금 가능 조건 (canPay) 로직 강화
  • src/pages/photoManage/SelectAddressPage.tsx
    • 주소 검색 완료 후 AddressDetailPage로 이동하도록 변경
    • URL state를 통해 선택된 주소 ID를 전달받아 처리
  • src/router/Router.tsx
    • AddressDetailPagephotoManageRoutes에 추가
  • src/store/useAddressId.store.ts
    • 새로운 Zustand 스토어 추가: 선택된 주소 ID 관리
  • src/utils/dateFormat.ts
    • isSameDay 유틸리티 함수 추가
  • src/utils/getEarlyFinishedHours.ts
    • 파일 제거
  • src/utils/getEarlyFinishedTime.ts
    • 새로운 유틸리티 함수 추가: 예상 완료 시간 대비 실제 완료 시간을 분/시간/일 단위로 계산 및 포맷
  • src/utils/scrollToCenter.ts
    • 새로운 유틸리티 함수 추가: 특정 HTML 요소를 뷰포트 중앙으로 스크롤
Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature Command Description
Code Review /gemini review Performs a code review for the current pull request in its current state.
Pull Request Summary /gemini summary Provides a summary of the current pull request in its current state.
Comment @gemini-code-assist Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help /gemini help Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

  1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution.

Copy link
Contributor

@gemini-code-assist gemini-code-assist bot left a comment

Choose a reason for hiding this comment

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

Code Review

데모데이를 위한 프론트엔드 배포 PR이네요. 전반적으로 코드 품질을 높이기 위한 많은 리팩토링과 개선이 이루어진 점이 인상적입니다. 특히 react-query를 활용한 상태 관리 개선, 폼 유효성 검사 UX 향상, 레이아웃 견고성 증대 등 좋은 변경 사항이 많습니다. 몇 가지 사소한 개선점과 중요한 설정 관련 이슈에 대한 리뷰 의견을 남겼으니 확인 부탁드립니다.


"react-hooks/refs": "off",

"react-hooks/exhaustive-deps": "off",
Copy link
Contributor

Choose a reason for hiding this comment

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

critical

'react-hooks/exhaustive-deps' 규칙을 전역적으로 비활성화하는 것은 매우 위험합니다. 이 규칙은 useEffect, useCallback, useMemo 등의 의존성 배열이 올바르게 설정되었는지 확인하여 오래된 값(stale value)으로 인한 버그를 방지하는 중요한 역할을 합니다. 전역적으로 비활성화하면 잠재적인 버그를 찾기 어려워질 수 있습니다. 꼭 필요한 경우에만 eslint-disable-next-line 주석을 사용하여 특정 줄에 대해서만 규칙을 비활성화하고, 그 이유를 명확히 설명하는 것이 좋습니다. 이 규칙을 다시 활성화하는 것을 강력히 권장합니다.

필름 현상소와 필름 사용자를 잇는 웹 플랫폼<br/>
<em>A web platform connecting film labs and film enthusiasts</em>
</p>
<img width="1920" height="1080" alt="Image" src="https://github.com/user-attachments/assets/e96d6912-3697-4af1-8c3c-3422e64421da" />
Copy link
Contributor

Choose a reason for hiding this comment

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

high

GitHub 사용자 첨부 파일(user-attachments)의 URL은 임시적이며 시간이 지나면 만료될 수 있습니다. 이미지를 레포지토리에 직접 추가하거나 영구적인 URL을 사용하여 README가 깨지지 않도록 하는 것이 좋습니다. 데모데이 이후에도 프로젝트를 잘 보여주기 위해 중요한 부분입니다.


## 🗓️ 프로젝트 기간

> **2025.12.19 ~ ing**
Copy link
Contributor

Choose a reason for hiding this comment

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

medium

프로젝트 시작일이 '2025.12.19'로 되어 있습니다. '2024년'의 오타가 아닌지 확인해주세요.

Comment on lines 173 to 177
// 1) 너무 아래로 끌면 닫기
if (sheetH <= vh * CLOSE_THRESHOLD_RATIO) {
onClose();
return;
}
Copy link
Contributor

Choose a reason for hiding this comment

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

medium

이 코드는 중복된 것으로 보입니다. !fixedMin이 참일 경우, 166-171번째 줄의 로직이 이미 이 조건을 확인하고 있습니다. 이 블록을 제거하여 코드를 간소화할 수 있습니다.

export const ToastItem = ({ message, icon }: ToastItemProps) => {
return (
<div className="animate-toast-in relative min-h-[3.75rem] w-[20.3125rem]">
<div className="animate-toast-in relative w-[20.3125rem]">
Copy link
Contributor

Choose a reason for hiding this comment

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

medium

min-h-[3.75rem] 클래스를 제거하면 토스트 메시지의 내용 길이에 따라 높이가 달라져 레이아웃이 불안정해질 수 있습니다. 특히 여러 토스트가 동시에 표시될 때 문제가 될 수 있습니다. 일관된 높이를 유지하기 위해 min-h 클래스를 다시 추가하는 것을 고려해 보세요.

Suggested change
<div className="animate-toast-in relative w-[20.3125rem]">
<div className="animate-toast-in relative min-h-[3.75rem] w-[20.3125rem]">

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants