Skip to content

[Feat] : 곡 카드에 title_ko / artist_ko 표시 (#197) #198

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
GulSam00 merged 3 commits into from
Apr 19, 2026
Merged

[Feat] : 곡 카드에 title_ko / artist_ko 표시 (#197) #198

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
624014e
feat : 검색 결과 카드에 title_ko / artist_ko 표시 (#197)
GulSam00 Apr 19, 2026
9ea9d4e
feat : tosing/recent 카드에도 title_ko / artist_ko 표시 (#197)
GulSam00 Apr 19, 2026
6950e7e
feat : tosing 카드 높이 확장 및 API 응답에 title_ko/artist_ko 추가 (#197)
GulSam00 Apr 19, 2026
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
2 changes: 2 additions & 0 deletions apps/web/src/app/api/search/route.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -179,6 +179,8 @@ export async function GET(request: Request): Promise<NextResponse<ApiResponse<Se
id: song.id,
title: song.title,
artist: song.artist,
title_ko: song.title_ko,
artist_ko: song.artist_ko,
num_tj: song.num_tj,
num_ky: song.num_ky,
isToSing: authenticated
Expand Down
2 changes: 2 additions & 0 deletions apps/web/src/app/api/songs/tosing/route.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,8 @@ export async function GET(): Promise<NextResponse<ApiResponse<ToSingSong[]>>> {
id,
title,
artist,
title_ko,
artist_ko,
num_tj,
num_ky
)
Expand Down
10 changes: 8 additions & 2 deletions apps/web/src/app/recent/RecentSongCard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,17 +3,23 @@ import { Separator } from '@/components/ui/separator';
import { Song } from '@/types/song';

export default function RecentSongCard({ song }: { song: Song }) {
const { title, artist, num_tj, num_ky } = song;
const { title, artist, title_ko, artist_ko, num_tj, num_ky } = song;

return (
<div className="w-full gap-4">
{/* 노래 정보 */}
<div className="flex flex-col">
{/* 제목 및 가수 */}
<div className="flex justify-between">
<div className="max-w-[250px] min-w-[100px]">
<div className="flex max-w-[250px] min-w-[100px] flex-col gap-0.5">
<MarqueeText className="text-base font-medium">{title}</MarqueeText>
{title_ko && title_ko !== title && (
<MarqueeText className="text-muted-foreground text-xs">{title_ko}</MarqueeText>
)}
<MarqueeText className="text-muted-foreground text-sm">{artist}</MarqueeText>
{artist_ko && artist_ko !== artist && (
<MarqueeText className="text-muted-foreground/70 text-xs">{artist_ko}</MarqueeText>
)}
</div>

<div className="flex flex-col space-x-4">
Expand Down
14 changes: 10 additions & 4 deletions apps/web/src/app/search/SearchResultCard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@ export default function SearchResultCard({
onClickSave,
onClickArtist,
}: IProps) {
const { id, title, artist, num_tj, num_ky, thumb } = song;
const { id, title, artist, title_ko, artist_ko, num_tj, num_ky, thumb } = song;

const { isAuthenticated } = useAuthStore();

Expand All @@ -62,17 +62,23 @@ export default function SearchResultCard({
{/* 메인 콘텐츠 영역 */}
<div className="flex flex-col gap-4">
{/* 노래 정보 */}
<div className="flex flex-col gap-2">
<div className="flex flex-col gap-3">
{/* 제목 및 가수 */}
<div className="flex justify-between">
<div className="flex w-[calc(100%-40px)] flex-col truncate">
<div className="flex w-[calc(100%-40px)] flex-col gap-0.5 truncate">
<MarqueeText className="text-base font-medium">{title}</MarqueeText>
{title_ko && title_ko !== title && (
<MarqueeText className="text-muted-foreground text-xs">{title_ko}</MarqueeText>
)}
<MarqueeText
className="text-muted-foreground hover:text-accent cursor-pointer text-sm hover:underline hover:underline-offset-4"
className="text-muted-foreground hover:text-accent mt-0.5 cursor-pointer text-sm hover:underline hover:underline-offset-4"
onClick={onClickArtist}
>
{artist}
</MarqueeText>
{artist_ko && artist_ko !== artist && (
<MarqueeText className="text-muted-foreground/70 text-xs">{artist_ko}</MarqueeText>
)}
</div>

<Dialog open={open} onOpenChange={setOpen}>
Expand Down
15 changes: 11 additions & 4 deletions apps/web/src/app/tosing/SongCard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,8 @@ export default function SongCard({ song, onDelete, onMoveToTop, onMoveToBottom }
id: song.id,
});

const { title, artist, num_tj, num_ky } = song;
const { title, artist, title_ko, artist_ko, num_tj, num_ky } = song;

const style = {
transform: CSS.Transform.toString(transform),
transition,
Expand All @@ -30,13 +31,19 @@ export default function SongCard({ song, onDelete, onMoveToTop, onMoveToBottom }
return (
<Card ref={setNodeRef} style={style} className={'relative'}>
{/* 메인 콘텐츠 영역 */}
<div className="flex h-[150px] w-full gap-4 p-3">
<div className="flex h-[180px] w-full gap-4 p-3">
{/* 노래 정보 */}
<div className="mb-8 flex flex-col active:cursor-grabbing">
<div className="mb-10 flex flex-col justify-between active:cursor-grabbing">
{/* 제목 및 가수 */}
<div className="mb-1 w-[290px]">
<div className="mb-1 flex w-[290px] flex-col gap-0.5">
<MarqueeText className="text-base font-medium">{title}</MarqueeText>
{title_ko && title_ko !== title && (
<MarqueeText className="text-muted-foreground text-xs">{title_ko}</MarqueeText>
)}
<MarqueeText className="text-muted-foreground text-sm">{artist}</MarqueeText>
{artist_ko && artist_ko !== artist && (
<MarqueeText className="text-muted-foreground/70 text-xs">{artist_ko}</MarqueeText>
)}
</div>

{/* 노래방 번호 */}
Expand Down
3 changes: 3 additions & 0 deletions apps/web/src/types/song.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,9 @@ export interface Song {
id: string;
title: string;
artist: string;
title_ko?: string;
artist_ko?: string;

num_tj: string;
num_ky: string;

Expand Down