src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Components/GameBase.cs

@@ -0,0 +1,42 @@
+using GameIdeas.Shared.Dto;
+using Microsoft.AspNetCore.Components;
+
+namespace GameIdeas.BlazorApp.Pages.Games.Components;
+
+public class GameBase : ComponentBase
+{
+    [Parameter] public GameDto GameDto { get; set; } = new();
+    [Inject] public NavigationManager NavigationManager { get; set; } = default!;
+
+    protected void HandleDetailClicked()
+    {
+        NavigationManager.NavigateTo($"/Game/Detail/{GameDto.Id}");
+    }
+
+    protected void HandlePlatformClicked(PlatformDto platform)
+    {
+        if (platform.Url != null)
+        {
+            NavigationManager.NavigateTo(platform.Url);
+        }
+    }
+
+    protected string GetFormatedStorageSpace()
+    {
+        if (GameDto.StorageSpace == null)
+        {
+            return string.Empty;
+        }
+
+        int quotien = (int)Math.Round((decimal)GameDto.StorageSpace) / 1000;
+        string unit = quotien switch
+        {
+            0 => "Mo",
+            1 => "Go",
+            2 => "To",
+            _ => string.Empty
+        };
+
+        return $"{GameDto.StorageSpace % 1000:g1} {unit}";
+    }
+}

src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Components/GameRow.razor

@@ -0,0 +1,38 @@
+@using GameIdeas.BlazorApp.Shared.Constants
+@inherits GameBase
+
+<div class="row">
+    <img class="icon" src="~/icon.png" />
+
+    <span class="title">@GameDto.Title</span>
+
+    <span class="release-date">@GameDto.ReleaseDate?.ToShortDateString() ?? @ResourcesKey.Unknown</span>
+
+    <div class="platforms">
+        @foreach (var platform in GameDto.Platforms ?? [])
+        {
+            <div class="platform-pill pill"
+                 @onclick=@(_ => HandlePlatformClicked(platform))>
+                @platform.Label
+            </div>
+        }
+    </div>
+
+    <div class="tags">
+        @foreach (var tag in GameDto.Tags ?? [])
+        {
+            <div class="tag-pill pill">
+                @tag.Label
+            </div>
+        }
+    </div>
+
+    <span class="storage">@GetFormatedStorageSpace()</span>
+
+    <div class="interest">
+        <span class="value">@GameDto.Interest</span>
+        <span class="max-value">/5</span>
+    </div>
+
+    <button class="detail">@Icons.Search.Triangle</button>
+</div>

src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Components/GameRow.razor.css

@@ -0,0 +1 @@
+

src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Game.razor.cs

@@ -6,7 +6,7 @@ using Microsoft.AspNetCore.Components;
 
 namespace GameIdeas.BlazorApp.Pages.Games;
 
-public partial class GameBase ()
+public partial class Game
 {
     [Inject] private IGameGateway GameGateway { get; set; } = default!;
 

src/GameIdeas/GameIdeas.Resources/CreateStaticResourceKey.cs

@@ -38,6 +38,7 @@ public class Translations (TranslationService translationService)
     public string ErrorCreateGame => translationService.Translate(nameof(ErrorCreateGame));
     public string InvalidTitle => translationService.Translate(nameof(InvalidTitle));
     public string InvalidInterest => translationService.Translate(nameof(InvalidInterest));
+    public string Unknown => translationService.Translate(nameof(Unknown));
 }
 
 public static class ResourcesKey
@@ -84,4 +85,5 @@ public static class ResourcesKey
     public static string ErrorCreateGame => _instance?.ErrorCreateGame ?? throw new InvalidOperationException("ResourcesKey.ErrorCreateGame is not initialized.");
     public static string InvalidTitle => _instance?.InvalidTitle ?? throw new InvalidOperationException("ResourcesKey.InvalidTitle is not initialized.");
     public static string InvalidInterest => _instance?.InvalidInterest ?? throw new InvalidOperationException("ResourcesKey.InvalidInterest is not initialized.");
+    public static string Unknown => _instance?.Unknown ?? throw new InvalidOperationException("ResourcesKey.Unknown is not initialized.");
 }

src/GameIdeas/Server/GameIdeas.WebAPI/Files/GameIdeas.fr.json

@@ -33,5 +33,6 @@
     "PlaceholderAdd": "Ajouter un nouveau",
     "ErrorCreateGame": "Erreur lors de la Création d'un jeu",
     "InvalidTitle": "Le titre est incorrect",
-    "InvalidInterest": "L'interêt est incorrect'"
+    "InvalidInterest": "L'interêt est incorrect",
+    "Unknown": "Inconnu"
 }