Move package "de.grimsi.gameyfin" to "org.gameyfin"

2026-06-16 00:30:02 +00:00 · 2025-06-14 19:23:12 +02:00
parent be0ba28c54
commit d3d46b6b01
328 changed files with 710 additions and 678 deletions
@@ -0,0 +1,50 @@
+import LibraryDto from "Frontend/generated/org/gameyfin/app/libraries/dto/LibraryDto";
+import React from "react";
+import GameDto from "Frontend/generated/org/gameyfin/app/games/dto/GameDto";
+import {useSnapshot} from "valtio/react";
+import {gameState} from "Frontend/state/GameState";
+import IconBackgroundPattern from "Frontend/components/general/IconBackgroundPattern";
+import {Card} from "@heroui/react";
+
+interface LibraryHeaderProps {
+    library: LibraryDto;
+    className?: string;
+}
+
+export default function LibraryHeader({library, className}: LibraryHeaderProps) {
+    const MAX_COVER_COUNT = 5;
+    const state = useSnapshot(gameState);
+    const randomGames = getRandomGames();
+
+    function getRandomGames() {
+        const games = state.randomlyOrderedGamesByLibraryId[library.id] as GameDto[];
+        if (!games) return [];
+        return games.slice(0, MAX_COVER_COUNT);
+    }
+
+    return (
+        <Card className={`overflow-hidden rounded-lg relative pointer-events-none select-none ${className}`}>
+            <IconBackgroundPattern/>
+            <div className="flex flex-row items-center w-full h-full brightness-50">
+                {randomGames.map((game, idx) => (
+                    <div
+                        key={idx}
+                        className="flex-none overflow-hidden -ml-[10%]"
+                        style={{
+                            width: `calc(100% / ${MAX_COVER_COUNT - 2})`,
+                            clipPath: 'polygon(15% 0, 100% 0, 85% 100%, 0% 100%)',
+                        }}
+                    >
+                        <img
+                            src={`/images/screenshot/${game.imageIds![0]}`}
+                            alt={`Image ${idx}`}
+                        />
+                    </div>
+                ))}
+            </div>
+            <div className="absolute inset-0 flex items-center justify-center">
+                <h2 className="text-white text-3xl font-bold">{library.name}</h2>
+            </div>
+        </Card>
+    );
+}