From d0316027890e0fc03b58e162c1b1c9b599469b43 Mon Sep 17 00:00:00 2001
From: Azalea <22280294+hykilpikonna@users.noreply.github.com>
Date: Sun, 9 Feb 2025 00:22:17 -0500
Subject: [PATCH] [+] Display country

---
 AquaNet/src/app.sass              |  1 +
 AquaNet/src/pages/UserHome.svelte | 13 +++++++++++--
 2 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/AquaNet/src/app.sass b/AquaNet/src/app.sass
index 2d5fdd55..bc7bad14 100644
--- a/AquaNet/src/app.sass
+++ b/AquaNet/src/app.sass
@@ -1,5 +1,6 @@
 @use "sass:color"
 @use "vars"
+@import 'components/font/twemoji-flags.css'
 @import 'lxgw-wenkai-lite-webfont/style.css'
 
 html
diff --git a/AquaNet/src/pages/UserHome.svelte b/AquaNet/src/pages/UserHome.svelte
index d8d2a736..763f8bd7 100644
--- a/AquaNet/src/pages/UserHome.svelte
+++ b/AquaNet/src/pages/UserHome.svelte
@@ -18,7 +18,7 @@
   import { type GameName, getMult, roundFloor } from "../libs/scoring";
   import StatusOverlays from "../components/StatusOverlays.svelte";
   import Icon from "@iconify/svelte";
-  import { GAME_TITLE, t } from "../libs/i18n";
+  import { countryCodeToEmoji, GAME_TITLE, t } from "../libs/i18n";
   import RankDetails from "../components/RankDetails.svelte";
   import RatingComposition from "../components/RatingComposition.svelte";
   import useLocalStorage from "../libs/hooks/useLocalStorage.svelte";
@@ -121,7 +121,12 @@
     <div class="user-pfp">
       <img use:pfp={d.user.aquaUser} alt="" class="pfp" on:error={pfpNotFound}>
       <div class="name-box">
-        <h2>{d.user.name}</h2>
+        <div class="name-left">
+          <h2>{d.user.name}</h2>
+          {#if d.user.aquaUser}
+            <div class="country">{countryCodeToEmoji(d.user.aquaUser?.country)}</div>
+          {/if}
+        </div>
         {#if typeof d.user.rival === 'boolean' && game === 'mai2'}
           <span class="clickable" on:click={() => setRival(!d?.user.rival)} role="button" tabindex="0"
              on:keydown={e => e.key === "Enter" && setRival(!d?.user.rival)}>
@@ -359,6 +364,10 @@
       justify-content: space-between
       gap: 10px
 
+      .name-left
+        display: flex
+        gap: 1em
+
   .pfp
     width: 100px
     height: 100px