some more styling to the frontend

discord_verificiation/playtime-frontend/components/PlayerTimelineChart.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import Link from 'next/link';
-import { formatMinutes } from '@/lib/steam';
+import { formatMinutes, countryCodeToFlag } from '@/lib/steam';
 
 interface Segment {
   startMin: number;
@@ -12,6 +12,7 @@ interface TimelinePlayer {
   steamid: string;
   name: string;
   avatarUrl: string;
+  country?: string | null;
   totalMinutes: number;
   segments: Segment[];
 }
@@ -53,6 +54,11 @@ export default function PlayerTimelineChart({
             >
               {/* eslint-disable-next-line @next/next/no-img-element */}
               <img src={p.avatarUrl} alt="" className="w-6 h-6 rounded-full object-cover ring-1 ring-base-border shrink-0" />
+              {p.country !== undefined && (
+                <span className="text-xs shrink-0" aria-hidden>
+                  {countryCodeToFlag(p.country)}
+                </span>
+              )}
               <span className="text-sm text-ink truncate">{p.name}</span>
             </Link>