diff --git a/src/apis/fishtank.ts b/src/apis/fishtank.ts index 5a4f8e3..fe3d245 100644 --- a/src/apis/fishtank.ts +++ b/src/apis/fishtank.ts @@ -125,7 +125,7 @@ export async function getMyBackgrounds(): Promise { * @param repoId repo ID * @returns FishTank 상세 정보 */ -export async function getFishtankDetail(repoId: string): Promise { +export async function getFishtankDetail(repoId: number): Promise { try { const res = await api.get(`/aquatics/fishtank/${repoId}/`); return res.data; @@ -143,7 +143,7 @@ export async function getFishtankDetail(repoId: string): Promise * @param repoId 레포지토리 ID * @param backgroundId Background.id (사용자가 소유한 배경의 background_id) */ -export async function applyFishtankBackground(repoId: string, backgroundId: number): Promise { +export async function applyFishtankBackground(repoId: number, backgroundId: number): Promise { try { await api.post(`/aquatics/fishtank/${repoId}/background/`, { background_id: backgroundId, @@ -163,7 +163,7 @@ export async function applyFishtankBackground(repoId: string, backgroundId: numb * @param repoId 레포지토리 ID * @returns 선택 가능한 물고기 목록 */ -export async function getSelectableFish(repoId: string): Promise { +export async function getSelectableFish(repoId: number): Promise { try { const res = await api.get<{ fishes: SelectableFish[] }>( `/aquatics/fishtank/${repoId}/selectable-fish/`, diff --git a/src/assets/png/Backgrounds/index.ts b/src/assets/png/Backgrounds/index.ts index 4eccdf3..73e5003 100644 --- a/src/assets/png/Backgrounds/index.ts +++ b/src/assets/png/Backgrounds/index.ts @@ -1,11 +1,11 @@ -import bg1 from "@/assets/png/Backgrounds/bg-deep-1.png"; -import bg2 from "@/assets/png/Backgrounds/bg-deep-2.png"; -import bg3 from "@/assets/png/Backgrounds/bg-ocean.png"; +import bgDeep1 from "@/assets/png/Backgrounds/bg-deep-1.png"; +import bgDeep2 from "@/assets/png/Backgrounds/bg-deep-2.png"; +import bgOcean from "@/assets/png/Backgrounds/bg-ocean.png"; const BACKGROUND_IMAGES: Record = { - "Bg Ocean": bg1, - "Bg Deep 1": bg2, - "Bg Deep 2": bg3, + "Bg Ocean": bgOcean, + "Bg Deep 1": bgDeep1, + "Bg Deep 2": bgDeep2, }; export function getBackgroundImage(name?: string): string | null { diff --git a/src/components/CollectionPage/RepoSelect.tsx b/src/components/CollectionPage/RepoSelect.tsx index 2622e12..466c7e9 100644 --- a/src/components/CollectionPage/RepoSelect.tsx +++ b/src/components/CollectionPage/RepoSelect.tsx @@ -31,7 +31,7 @@ export default function RepoSelect({ value, onChange, customRepos }: RepoSelectP const repositories = await getRepositories(); const repoInfos: RepoInfo[] = repositories.map((repo: Repository) => ({ - id: repo.id.toString(), + id: repo.id, fullName: repo.full_name, contributions: repo.commit_count, })); @@ -71,7 +71,8 @@ export default function RepoSelect({ value, onChange, customRepos }: RepoSelectP className={`font-abeezee /* 안쪽 그림자 적용 */ w-full cursor-pointer appearance-none rounded-md border border-[#89482D]/50 bg-[#DFC39D] px-3 py-2 pr-8 text-[0.85rem] text-[#89482D] shadow-inner transition-all duration-200 hover:shadow-[inset_-4px_4px_4px_0_rgba(137,72,45,0.2)] focus:shadow-[inset_-4px_4px_6px_0_rgba(137,72,45,0.3)] focus:ring-0 focus:outline-none`} value={value?.id ?? ""} onChange={(e) => { - const selected = repos.find((d) => d.id === e.target.value); + const value = Number(e.target.value); + const selected = repos.find((d) => d.id === value) ?? null; onChange(selected ?? null); e.currentTarget.blur(); }} diff --git a/src/components/CollectionPage/fishGrowthCard.tsx b/src/components/CollectionPage/fishGrowthCard.tsx index 5ca0b11..2f61830 100644 --- a/src/components/CollectionPage/fishGrowthCard.tsx +++ b/src/components/CollectionPage/fishGrowthCard.tsx @@ -49,7 +49,7 @@ const FishGrowthCard: React.FC = ({ return allFishData .filter((fish) => fish.group_code === selectedFishGroup.group_code) .map((fish) => ({ - id: fish.id.toString(), + id: fish.id, fullName: fish.repository_full_name, contributions: fish.maturity, })); diff --git a/src/components/MyPage/FishTankSection.tsx b/src/components/MyPage/FishTankSection.tsx index 6970cc0..b790e89 100644 --- a/src/components/MyPage/FishTankSection.tsx +++ b/src/components/MyPage/FishTankSection.tsx @@ -140,12 +140,7 @@ export default function FishTankSection() { try { console.log("Fetching fishtank detail for repo:", repo.id, repo.fullName); - // repo.id는 string이므로 숫자로 변환 - const repoIdNum = parseInt(repo.id, 10); - if (isNaN(repoIdNum)) { - console.error("Invalid repo ID:", repo.id); - throw new Error(`Invalid repository ID: ${repo.id}`); - } + const fishtankDetail = await getFishtankDetail(repo.id); console.log("Fishtank detail received:", fishtankDetail); console.log( @@ -255,7 +250,7 @@ export default function FishTankSection() { } try { - const embedCode = await getFishtankEmbedCode(Number(repo.id)); + const embedCode = await getFishtankEmbedCode(repo.id); // Markdown 코드를 클립보드에 복사 await navigator.clipboard.writeText(embedCode.markdown); setMessage("Markdown 코드가 클립보드에 복사되었습니다!"); @@ -282,7 +277,7 @@ export default function FishTankSection() { } try { - const backgroundId = parseInt(selectedBgId); + const backgroundId = parseInt(selectedBgId, 10); if (isNaN(backgroundId)) { setMessage("Invalid background selected."); setTimeout(() => setMessage(null), 3000); @@ -436,7 +431,10 @@ export default function FishTankSection() {
{tab === "timeline" && (
- +
)} {tab === "background" && @@ -596,7 +594,7 @@ export default function FishTankSection() { {/* GrowthTimeline */}
- +
); diff --git a/src/components/MyPage/GrowthTimeline.tsx b/src/components/MyPage/GrowthTimeline.tsx index 6c420c4..f98fcb2 100644 --- a/src/components/MyPage/GrowthTimeline.tsx +++ b/src/components/MyPage/GrowthTimeline.tsx @@ -20,7 +20,7 @@ interface ContributionFishData { } interface GrowthTimelineProps { - repoId: string | null; + repoId: number | null; contributionFishes?: ContributionFishData[]; } @@ -56,11 +56,6 @@ export default function GrowthTimeline({ repoId, contributionFishes = [] }: Grow // ContributionFish 데이터를 기반으로 같은 group_code를 가진 물고기들 중 maturity가 현재 이하인 것들 필터링 const filteredFishes = useMemo(() => { - console.log("GrowthTimeline: filteredFishes calculation", { - contributionFishesCount: contributionFishes.length, - fishesCount: fishes.length, - }); - if (contributionFishes.length === 0) { console.log("GrowthTimeline: No contributionFishes, using all fishes"); return fishes; // ContributionFish가 없으면 기존 로직 사용 diff --git a/src/components/MyPage/RepoSelect.tsx b/src/components/MyPage/RepoSelect.tsx index eca3ae1..01b8588 100644 --- a/src/components/MyPage/RepoSelect.tsx +++ b/src/components/MyPage/RepoSelect.tsx @@ -25,7 +25,7 @@ export default function RepoSelect({ // Repository 타입을 RepoInfo 타입으로 변환 // my_commit_count를 사용하여 현재 사용자의 기여도를 표시 const repoInfos: RepoInfo[] = repositories.map((repo: Repository) => ({ - id: repo.id.toString(), + id: repo.id, fullName: repo.full_name, contributions: repo.my_commit_count, // 사용자의 기여도 사용 })); @@ -62,8 +62,12 @@ export default function RepoSelect({ ) : (