[FEAT] 채팅 메시지 버블/컴포저 UI 구현 및 버블 크기 동적 조절

[cchanmi]

Describe

채팅 화면의 메시지 버블·컴포저 UI를 구현하고, 메시지 버블이 콘텐츠 길이에 맞춰 동적으로 크기가 조절되도록 개선했습니다.

Works made

• Message에 createdAt 추가 및 DTO 파싱, 소수점 초가 포함된 시각 파싱 실패로 메시지가 사라지던 문제 수정
• 채팅 메시지 타임스탬프 포맷터 추가
• 인용 답장 헤더 라벨 계산 로직 추가
• 메시지 버블 최대너비 계산 로직(MessageBubbleLayout) 추가
• 캐릭터 아바타 placeholder, 메시지 버블, 채팅 컴포저 컴포넌트 추가
• ChatView에 새 메시지 버블/컴포저 컴포넌트 연결, 앱 전체 라이트 모드 고정
• BubbleWidthLayout(custom Layout) 추가: 버블이 .frame(maxWidth:)만으로는 부모 HStack의 공간 분배 방식에 따라 짧은 메시지에도 maxWidth까지 늘어나는 문제가 있어, 콘텐츠 intrinsic 너비와 maxWidth 중 작은 값을 직접 계산해 보고하도록 수정
• createdAt 파싱 안정성 개선: 타임존 지정자 없이 소수초만 있는 값에서 stripFractionalSeconds가 원본을 그대로 반환해 파싱이 통째로 실패하던 문제 수정
• 채팅 버블/컴포저 코드 정리

Changes Made

As-Is

기존 로직
메시지 버블이 짧은 메시지에도 항상 maxWidth만큼 늘어나 보임. createdAt이 없어 타임스탬프도 표시되지 않았음.

To-BE

변경 로직
메시지 버블/컴포저 UI가 추가되었고, 버블은 콘텐츠 길이에 맞춰 짧으면 좁게, maxWidth를 넘으면 그 안에서 줄바꿈되도록 동작. 메시지마다 타임스탬프가 표시됨.

Additional context

• 키보드가 정상적으로 포커싱되지는 않습니다.
• 헤더뷰는 적용하지 않았습니다.
• 사용자가 감정에 답변하는 기능은 아직 없습니다.
• 메시지 입력필드가 피그마와 조금 상이하고, 그외에 레이아웃도 조금 다른 부분이 있습니다.