전체링크페이지 로딩 및 에어 UI 요청사항 수정

[Seong-Myeong]

관련 이슈

• close 전체링크페이지 로딩 ui 조정 #443

PR 설명

• spinner 크기 36으로 조정
• spinner 및 에러 UI 정중앙에 위치하도록 배치

2026-03-24.20.24.44.mov

[coderabbitai]

Walkthrough

전체링크 페이지의 로딩 및 에러 상태 UI가 조정되었습니다. AllLink 컴포넌트에서 로딩 상태는 전체 높이와 너비를 차지하는 컨테이너로 감싸지고 Spinner에 explicit size 값이 전달되었습니다. 에러 상태도 유사하게 더 명확한 flex 컨테이너로 구성되었습니다. 동시에 Spinner 컴포넌트는 string 기반 size 옵션뿐 아니라 숫자 값도 수용하도록 타입이 확장되었으며, 런타임 타입 체크를 통해 적절한 크기를 계산합니다.

Possibly related PRs

• Spinner 디자인 적용 #282: Spinner 컴포넌트의 size prop API 변경으로 본 PR과 동일 컴포넌트의 공개 인터페이스 수정
• Spinner 컴포넌트 구현 #149: Spinner에 numeric size 지원 기능 도입으로 본 PR이 size={36} 사용 시 직접 연관

🚥 Pre-merge checks | ✅ 4

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	제목이 PR의 주요 변경사항을 명확하게 요약하고 있습니다: AllLink 페이지의 로딩 및 에러 UI 조정이라는 핵심 내용을 담고 있습니다.
Description check	✅ Passed	PR 설명이 템플릿 구조를 따르고 있으며, 관련 이슈(#443)와 주요 변경사항(스피너 크기 조정, UI 중앙 배치)을 명확하게 나열하고 있습니다.
Linked Issues check	✅ Passed	PR의 코드 변경사항이 이슈 #443의 요구사항을 충족합니다: Spinner 크기를 36으로 조정하고 로딩/에러 UI를 화면 정중앙에 배치하는 작업이 구현되었습니다.
Out of Scope Changes check	✅ Passed	모든 변경사항이 AllLink 페이지의 로딩/에러 UI 조정이라는 링크된 이슈 #443의 범위 내에 있으며, 불필요한 변경사항이 없습니다.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch feature/#443-edit-allLinkPage-loading-ui

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

🧹 Nitpick comments (1)

src/components/basics/Spinner/Spinner.tsx (1)

19-20: 숫자 size 입력에 대한 최소값/유효성 보정이 필요합니다.

Line 19에서 number를 그대로 사용하면 0, 음수, NaN 입력 시 SVG 반지름 계산(Line 20)이 깨질 수 있습니다. 안전한 하한과 기본값으로 정규화해 주세요.

수정 예시

-  const spinnerSize = typeof size === 'number' ? size : sizeMap[size];
+  const spinnerSize =
+    typeof size === 'number'
+      ? Number.isFinite(size)
+        ? Math.max(size, strokeWidth + 2)
+        : sizeMap.md
+      : sizeMap[size];

🤖 Prompt for AI Agents

Verify each finding against the current code and only fix it if needed.

In `@src/components/basics/Spinner/Spinner.tsx` around lines 19 - 20, The
spinnerSize calculation must normalize numeric `size` inputs to avoid 0,
negative or NaN values breaking the SVG radius; update the `spinnerSize` logic
in Spinner.tsx so that when `size` is a number you coerce it (Number(size)),
check Number.isFinite, and clamp it to a safe minimum (for example
Math.max(Number(size) || 0, strokeWidth * 2 + 1) or fall back to a default like
sizeMap.medium) before using it in the `radius` computation; ensure you still
support string sizes via `sizeMap[size]` and use the same `spinnerSize` const
and `strokeWidth` symbol names so `radius` = (spinnerSize - strokeWidth) / 2
remains valid.

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Nitpick comments:
In `@src/components/basics/Spinner/Spinner.tsx`:
- Around line 19-20: The spinnerSize calculation must normalize numeric `size`
inputs to avoid 0, negative or NaN values breaking the SVG radius; update the
`spinnerSize` logic in Spinner.tsx so that when `size` is a number you coerce it
(Number(size)), check Number.isFinite, and clamp it to a safe minimum (for
example Math.max(Number(size) || 0, strokeWidth * 2 + 1) or fall back to a
default like sizeMap.medium) before using it in the `radius` computation; ensure
you still support string sizes via `sizeMap[size]` and use the same
`spinnerSize` const and `strokeWidth` symbol names so `radius` = (spinnerSize -
strokeWidth) / 2 remains valid.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Run ID: f84a62a7-223b-4348-a150-cd99c49e4052

📥 Commits

Reviewing files that changed from the base of the PR and between eda67c6 and 9f52d55.

📒 Files selected for processing (2)

• src/app/(route)/all-link/AllLink.tsx
• src/components/basics/Spinner/Spinner.tsx