diff --git a/app/(route)/admin/page.tsx b/app/(route)/admin/page.tsx index 2fc575ee..d47048e7 100644 --- a/app/(route)/admin/page.tsx +++ b/app/(route)/admin/page.tsx @@ -46,7 +46,7 @@ const Admin = () => { return ( <> - + {isAdminLogin && (
{isAuth ? ( diff --git a/app/(route)/artist/[artistId]/layout.tsx b/app/(route)/artist/[artistId]/layout.tsx new file mode 100644 index 00000000..172db281 --- /dev/null +++ b/app/(route)/artist/[artistId]/layout.tsx @@ -0,0 +1,35 @@ +import { ReactNode } from "react"; +import { getArtist, getGroup } from "@/utils/getArtist"; +import MetaTag from "@/components/MetaTag"; + +interface Props { + children: ReactNode; + params: { artistId: string }; +} + +const getArtistName = async (artistId: string) => { + let res; + try { + const groupData = await fetch(`https://${process.env.NEXT_PUBLIC_BASE_URL}/group?groupId=${artistId}`); + res = await groupData.json(); + if(res.message) throw Error(); + return res; + } catch(err){ + const artistData = await fetch(`https://${process.env.NEXT_PUBLIC_BASE_URL}/artist?artists=${artistId}`); + res = await artistData.json(); + return res[0]; + } +}; + +const layout = async ({ children, params }: Props) => { + const res = await getArtistName(params.artistId); + + return ( + <> + + {children} + + ); +}; + +export default layout; diff --git a/app/(route)/artist/[artistId]/page.tsx b/app/(route)/artist/[artistId]/page.tsx index e7e43d7f..f28fe855 100644 --- a/app/(route)/artist/[artistId]/page.tsx +++ b/app/(route)/artist/[artistId]/page.tsx @@ -6,7 +6,6 @@ import Image from "next/image"; import { useParams } from "next/navigation"; import { useEffect, useState } from "react"; import KakaoMap from "@/components/KakaoMap"; -import MetaTag from "@/components/MetaTag"; import TimeFilter from "@/components/TimeFilter"; import DottedLayout from "@/components/layout/DottedLayout"; import { instance } from "@/api/api"; @@ -27,8 +26,13 @@ const ArtistIdPage = () => { const group = getGroup(instance, artistId); const artist = getArtist(instance, artistId); - const name = group.groupName || artist.artistName; - const image = group.groupImage || artist.artistImage; + const [name, setName] = useState(""); + const [image, setImage] = useState(""); + + useEffect(() => { + setName(group.groupName || artist.artistName); + setImage(group.groupImage || artist.artistImage); + }, [group, artist]); const [sort, setSort] = useState(SORT[0]); const [status, setStatus] = useState(3); @@ -62,7 +66,6 @@ const ArtistIdPage = () => { return ( <> -
{
diff --git a/app/_components/MetaTag.tsx b/app/_components/MetaTag.tsx index 1d8613d7..fdb7c631 100644 --- a/app/_components/MetaTag.tsx +++ b/app/_components/MetaTag.tsx @@ -2,9 +2,10 @@ interface Props { title?: string; description?: string; imgUrl?: string; + noFollow?: boolean; } -const MetaTag = ({ title, description, imgUrl }: Props) => { +const MetaTag = ({ title, description, imgUrl, noFollow = false }: Props) => { return ( <> {title ? `${title} | Opener` : "Opener"} @@ -29,6 +30,16 @@ const MetaTag = ({ title, description, imgUrl }: Props) => { + + + + ); };