Movie Detail (#3)

* Implemented Movie Detail
* Implemented basic favorites

Reviewed-on: #3
Co-authored-by: Berack96 <giacomobertolazzi7@gmail.com>
Co-committed-by: Berack96 <giacomobertolazzi7@gmail.com>

Components/Pages/Movie.razor

@@ -1,11 +0,0 @@
-@page "/movie/{id}"
-
-<PageTitle>Movie Details</PageTitle>
-
-<h1>TODO</h1>
-<p>Movie ID: @id</p>
-
-@code {
-    [Parameter]
-    public string id { get; set; }
-}

Components/Pages/MovieDetail.razor

@@ -0,0 +1,76 @@
+@page "/movie/{id}"
+
+<PageTitle>Movie Details</PageTitle>
+
+<style>
+    .my-grid {
+        display: grid;
+        grid-template-columns: 1fr 2fr;
+        grid-template-rows: auto auto;
+        gap: 20px;
+        max-width: 800px;
+        margin-right: auto;
+    }
+    .favorite {
+        background-color: gold;
+        color: black;
+    }
+    .not-favorite {
+        background-color: gray;
+        color: white;
+    }
+</style>
+
+<div class="my-grid">
+    @if (movie is not null)
+    {
+        <h1>@movie.Title</h1>
+        <div></div>
+        <img src="@movie.Poster" alt="@movie.Title Poster" />
+        <div class="details">
+            <p>@movie.Runtime</p>
+            <p>@movie.Plot</p>
+            @if(ManageFavorite.IsFavorite(id))
+            {
+                <button class="btn-secondary favorite" @onclick="ToggleFavoriteMovie">Remove Favorite</button>
+            }
+            else
+            {
+                <button class="btn-secondary not-favorite" @onclick="ToggleFavoriteMovie">Add to Favorites</button>
+            }
+        </div>
+    }
+    else
+    {
+        <p>Loading movie details...</p>
+    }
+</div>
+
+
+@inject OmdbService OmdbService
+@inject ManageFavorite ManageFavorite
+
+@code {
+    [Parameter]
+    public required string id { get; set; }
+    private Movie? movie;
+
+    protected override async Task OnInitializedAsync()
+    {
+        movie = await OmdbService.FetchMovieDetail(id);
+    }
+
+    protected override async Task OnAfterRenderAsync(bool firstRender)
+    {
+        if (firstRender)
+        {
+            await ManageFavorite.LoadFavorites();
+            StateHasChanged();
+        }
+    }
+
+    private async Task ToggleFavoriteMovie()
+    {
+        await ManageFavorite.ToggleFavoriteMovie(id);
+    }
+}