[FEAT] 설정 모달 UI 변경 및 추가 API 연결

[eun0903]

🔗 관련 이슈

closed #76

✨ 요약

설정 모달 UI 변경 및 무드보드 생성 버튼 추가 및 API 연결을 합니다.

📝 작업 내용

##

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
mine	Ready	Preview, Comment	Mar 19, 2026 6:46am

[gemini-code-assist]

Summary of Changes

Hello, I'm Gemini Code Assist¹! 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!

이 PR은 사용자 설정 모달의 UI를 개편하고, '화면 설정' 기능을 매거진 섹션 콘텐츠 페이지로 이동하여 '무드보드 생성' 기능으로 재구성합니다. 이를 통해 사용자 경험을 개선하고, 관련 API 연결을 통해 새로운 기능을 지원합니다. 기존 설정 모달은 프로필 및 관심사 설정에 집중하도록 간소화되었습니다.

Highlights

• 설정 모달 UI 개편: 기존 설정 모달에서 '화면 설정' 탭을 제거하고, 프로필 및 관심사 설정에 집중하도록 UI를 간소화했습니다.
• 무드보드 생성 기능 추가: 매거진 섹션 콘텐츠 페이지에 무드보드 생성 버튼을 추가하고, 이를 통해 '화면 설정' 모달을 열 수 있도록 기능을 재배치했습니다.
• 아이콘 스타일링 개선: wand_stars.svg 아이콘의 색상 설정을 currentColor로 변경하여 부모 요소의 텍스트 색상을 따르도록 유연성을 높였습니다.
• API 연결: 무드보드 생성 기능과 관련된 추가 API 연결이 이루어졌습니다.

Changelog

• Mine/src/components/settings/SettingsModal.tsx
  • ScreenSettings 컴포넌트 임포트 및 관련 탭 제거
  • activeTab 상태에서 'screen' 옵션 제거
  • '화면 설정' 버튼 UI 제거
  • ScreenSettings 컴포넌트 렌더링 로직 제거
• Mine/src/icon/wand_stars.svg
  • SVG 아이콘의 fill 속성을 #D9D9D9에서 currentColor로 변경하여 스타일링 유연성 확보
• Mine/src/pages/magazine/components/SectionContent.tsx
  • useState, IconWandStars, ScreenSettings 컴포넌트 임포트 추가
  • isScreenSettingsOpen 상태 변수 추가
  • 무드보드 생성 버튼 (wand_stars 아이콘) 추가 및 클릭 시 ScreenSettings 모달 열기 기능 구현
  • ScreenSettings 컴포넌트를 포함하는 모달 UI 추가

Activity

• 현재까지 이 PR에 대한 사람의 활동은 없습니다.

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. ↩

[gemini-code-assist]

Code Review

이 PR은 설정 모달에서 화면 설정 기능을 분리하고, 매거진 섹션 페이지에 무드보드 생성 기능을 추가하는 변경 사항을 담고 있습니다. 전반적으로 기능 분리 및 추가가 잘 이루어졌습니다. 다만, SVG 아이콘 색상 적용에 문제가 있어 수정이 필요하며, 코드 유지보수성을 높이기 위해 모달 컴포넌트를 분리하는 것을 제안합니다. 자세한 내용은 각 파일의 주석을 참고해주세요.