feat: show user label

3 files changed, 17 insertions, 0 deletions

diff --git a/frontend/app/api/schema.d.ts b/frontend/app/api/schema.d.ts
index cec5661..b5ec26b 100644
--- a/frontend/app/api/schema.d.ts
+++ b/frontend/app/api/schema.d.ts
@@ -159,6 +159,8 @@ export interface components {
             icon_path?: string;
             /** @example false */
             is_admin: boolean;
+            /** @example staff */
+            label: string | null;
         };
         Game: {
             /** @example 1 */
diff --git a/frontend/app/components/GolfWatchApps/GolfWatchAppGamingMultiplayer.tsx b/frontend/app/components/GolfWatchApps/GolfWatchAppGamingMultiplayer.tsx
index 7a36283..758c589 100644
--- a/frontend/app/components/GolfWatchApps/GolfWatchAppGamingMultiplayer.tsx
+++ b/frontend/app/components/GolfWatchApps/GolfWatchAppGamingMultiplayer.tsx
@@ -2,6 +2,7 @@ import { useAtomValue } from "jotai";
 import type { components } from "../../api/schema";
 import { gamingLeftTimeSecondsAtom } from "../../states/watch";
 import BorderedContainer from "../BorderedContainer";
+import UserLabel from "../UserLabel";
 
 type RankingEntry = components["schemas"]["RankingEntry"];
 
@@ -91,6 +92,9 @@ export default function GolfWatchAppGamingMultiplayer({
 									</td>
 									<td className="px-6 py-4 whitespace-nowrap text-gray-900">
 										{entry.player.display_name}
+										{entry.player.label && (
+											<UserLabel label={entry.player.label} />
+										)}
 									</td>
 									<td className="px-6 py-4 whitespace-nowrap text-gray-900">
 										{entry.score}
diff --git a/frontend/app/components/UserLabel.tsx b/frontend/app/components/UserLabel.tsx
new file mode 100644
index 0000000..b436ad6
--- /dev/null
+++ b/frontend/app/components/UserLabel.tsx
@@ -0,0 +1,11 @@
+type Props = {
+	label: string;
+};
+
+export default function UserLabel({ label }: Props) {
+	return (
+		<span className="bg-sky-700 text-sky-50 rounded-lg p-3 text-sm">
+			{label}
+		</span>
+	);
+}