feat(import): add the import page, multi-select add and the favorite platform

src/pages/GameLibrary.jsx

@@ -7,7 +7,7 @@ import useForceSync from '../hooks/useForceSync.js';
 import useSessionExpired from '../hooks/useSessionExpired.js';
 import {formatPlaytime} from '../utils/games.js';
 import {GAME_STATUSES, libraryQuery, parseStatus} from '../utils/backlog.js';
-import {ArrowUpDown, ChevronLeft, ChevronRight, Clock, EyeOff, Gamepad2, Library, Plus, RefreshCw, Search, SearchX, Timer, Trophy} from 'lucide-react';
+import {ArrowUpDown, ChevronLeft, ChevronRight, Clock, EyeOff, Gamepad2, Library, Plus, RefreshCw, Search, SearchX, Timer, Trophy, Upload} from 'lucide-react';
 
 import {Badge} from '@/components/ui/badge';
 import {Button} from '@/components/ui/button';
@@ -22,6 +22,7 @@ import GameStatusBadge from '../components/GameStatusBadge.jsx';
 import PageContainer from '../components/PageContainer.jsx';
 import {apiFetch} from '../utils/api.js';
 import {hasSession} from '../utils/auth.js';
+import {platformLabel} from '../utils/platforms.js';
 
 const PAGE_SIZES = [20, 40, 80];
 const DEFAULT_SIZE = 20;
@@ -195,6 +196,9 @@ export default function GameLibrary() {
                         <Button variant="outline" size="sm" onClick={() => setAdding(true)} disabled={adding}>
                             <Plus/>{t('MANUAL_GAME.ADD_BUTTON')}
                         </Button>
+                        <Button variant="outline" size="sm" asChild>
+                            <Link to="/import"><Upload/>{t('IMPORT.OPEN')}</Link>
+                        </Button>
                     </div>
                 </div>
                 <div className="flex flex-wrap items-center gap-3">
@@ -309,9 +313,9 @@ export default function GameLibrary() {
                                     <span className="min-w-0 flex-1 truncate font-medium group-hover:text-primary transition-colors">
                                         {g.name ?? `App ${g.appid}`}
                                     </span>
-                                    {g.platform && (
-                                        <Badge variant="outline" className="hidden sm:inline-flex" title={g.platform}>
-                                            <Gamepad2 className="size-3"/>{g.platform}
+                                    {platformLabel(g) && (
+                                        <Badge variant="outline" className="hidden sm:inline-flex" title={platformLabel(g)}>
+                                            <Gamepad2 className="size-3"/>{platformLabel(g)}
                                         </Badge>
                                     )}
                                     <GameStatusBadge status={g.status} compact/>