Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 6 additions & 1 deletion CLAUDE.md
Original file line number Diff line number Diff line change
Expand Up @@ -76,6 +76,7 @@ Never do any of the following:
- **No inline styles** — use Tailwind classes only
- **No cross-layer imports in FSD** — e.g., `features` must not import from `pages`
- **No committing to `main` or `develop`** — always use a feature branch + PR
- **No PRs to `main`** — every PR targets `develop`; `main` is updated only by a maintainer's release PR
- **No skipping CI gates** — do not use `--no-verify` or bypass lint/typecheck

## Commit Convention (Conventional Commits)
Expand Down Expand Up @@ -110,12 +111,16 @@ CI must pass before merging. Run `npm run typecheck && npm run lint && npm run f
Direct pushes to `main` and `develop` are blocked by a git `pre-push` hook.
Always work on a feature branch and open a PR. Use `/pr` to create the PR.

**All PRs MUST target `develop` — never open a PR against `main`.**
`main` only receives changes via a `develop` → `main` release PR opened by a maintainer.
Claude must never create a PR to `main` or merge anything into `main`.

Hook lives in `.githooks/pre-push` and registers automatically on `npm install`
via the `prepare` script (`git config core.hooksPath .githooks`).

## GitHub

- Repo: `DarkMode-Lab/AIKON-Client`
- Repo: `DarkMode-Lap/AIKON-Client`
- Default branch: `main`
- PR template: `.github/pull_request_template.md`
- Use `gh` CLI for PR operations (`/pr` command handles this)
Expand Down
30 changes: 30 additions & 0 deletions src/pages/create/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -101,6 +101,16 @@ export default function CreatePage() {
})
}

// 스타일 자동 선택: 직접 고르지 않고 랜덤 스타일로 다음 단계 진행
function handleStyleAuto() {
const style = STYLE_OPTIONS[Math.floor(Math.random() * STYLE_OPTIONS.length)].id
setForm((f) => ({ ...f, style }))
setDir(1)
// 함수형 업데이터로 멱등 처리 — 빠른 더블클릭에도 2→3만, 단계 건너뛰기 방지
setStep((s) => (s === 2 ? 3 : s))
toast.success('스타일을 랜덤으로 골랐어요! ✨')
}
Comment thread
g-hyxn marked this conversation as resolved.

return (
<div className="relative min-h-dvh bg-white flex flex-col items-center px-4 py-6 overflow-hidden">
<div className="pointer-events-none absolute inset-0 overflow-hidden">
Expand Down Expand Up @@ -166,6 +176,7 @@ export default function CreatePage() {
<StepStyle
selected={form.style}
onSelect={(style: AvatarStyle) => setForm((f) => ({ ...f, style }))}
onAuto={handleStyleAuto}
/>
)}
{step === 3 && (
Expand Down Expand Up @@ -271,9 +282,11 @@ function StepNickname({
function StepStyle({
selected,
onSelect,
onAuto,
}: {
selected: AvatarStyle | null
onSelect: (s: AvatarStyle) => void
onAuto: () => void
}) {
return (
<div className="glass-card p-6 space-y-4">
Expand All @@ -282,6 +295,23 @@ function StepStyle({
<p className="text-sm text-gray-500">어떤 느낌의 캐릭터로 만들까요? 🎨</p>
</div>

<button
onClick={onAuto}
className="btn-magic w-full py-4 text-white flex items-center justify-center gap-2 text-sm font-bold"
>
<Sparkles className="w-4 h-4" />
자동으로 만들기 ✨
</button>
<p className="text-center text-xs text-gray-400 -mt-1">
고르기 어렵다면 AI가 알아서 멋지게 만들어드려요
</p>

<div className="flex items-center gap-3">
<div className="h-px flex-1 bg-gray-200" />
<span className="text-xs text-gray-400 font-semibold">또는 직접 고르기</span>
<div className="h-px flex-1 bg-gray-200" />
</div>

<div className="grid grid-cols-2 gap-3">
{STYLE_OPTIONS.map((style) => (
<motion.button
Expand Down
Loading