diff --git a/app/components/Flag.tsx b/app/components/Flag.tsx index 1c6026eae..ad98901a2 100644 --- a/app/components/Flag.tsx +++ b/app/components/Flag.tsx @@ -1,3 +1,17 @@ -export function Flag({ countryCode }: { countryCode: string }) { - return
; +import clsx from "clsx"; + +export function Flag({ + countryCode, + tiny = false, +}: { + countryCode: string; + tiny?: boolean; +}) { + return ( + + ); } diff --git a/app/routes/u.$identifier.tsx b/app/routes/u.$identifier.tsx index 3ccd39ebd..cbe0e6176 100644 --- a/app/routes/u.$identifier.tsx +++ b/app/routes/u.$identifier.tsx @@ -93,7 +93,6 @@ export const loader = async ({ request, params }: LoaderArgs) => { country: countryObj && user.country ? { - emoji: countryObj.emoji, code: user.country, name: translatedCountry({ diff --git a/app/routes/u.$identifier/index.tsx b/app/routes/u.$identifier/index.tsx index b1618e580..bd6b9b1c9 100644 --- a/app/routes/u.$identifier/index.tsx +++ b/app/routes/u.$identifier/index.tsx @@ -4,6 +4,7 @@ import * as React from "react"; import invariant from "tiny-invariant"; import { Avatar } from "~/components/Avatar"; import { Badge } from "~/components/Badge"; +import { Flag } from "~/components/Flag"; import { TwitchIcon } from "~/components/icons/Twitch"; import { TwitterIcon } from "~/components/icons/Twitter"; import { YouTubeIcon } from "~/components/icons/YouTube"; @@ -37,7 +38,7 @@ export default function UserInfoPage() { {data.country ? (