From e9d494c24e49e71be36cf5a7858c2c247b242c37 Mon Sep 17 00:00:00 2001
From: Jason Dove <1695733+jasongdove@users.noreply.github.com>
Date: Sun, 27 Jul 2025 13:06:57 +0000
Subject: [PATCH] add troubleshoot playback to media card overflow menu (#2210)

---
 CHANGELOG.md                                 |  4 ++++
 ErsatzTV/Pages/PlaybackTroubleshooting.razor | 21 +++++++++++++-------
 ErsatzTV/Shared/MediaCard.razor              |  9 +++++++++
 3 files changed, 27 insertions(+), 7 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 3c7ba73fa..66fe2509c 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -4,6 +4,10 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
 
 ## [Unreleased]
+### Added
+- Add `Troubleshoot Playback` to overflow menu on all media cards
+  - This should eliminate the need to lookup media ids for content
+
 ### Fixed
 - Fix app startup with MySql/MariaDB
 - YAML playout: fix `pad_to_next` always running over time
diff --git a/ErsatzTV/Pages/PlaybackTroubleshooting.razor b/ErsatzTV/Pages/PlaybackTroubleshooting.razor
index 0c43ede71..13d64fbf6 100644
--- a/ErsatzTV/Pages/PlaybackTroubleshooting.razor
+++ b/ErsatzTV/Pages/PlaybackTroubleshooting.razor
@@ -31,7 +31,7 @@
                 <div class="d-flex">
                     <MudText>Media Item ID</MudText>
                 </div>
-                <MudTextField T="int?" Value="_mediaItemId" ValueChanged="@(async x => await OnMediaItemIdChanged(x))" />
+                <MudTextField T="int?" Value="MediaItemId" ValueChanged="@(async x => await OnMediaItemIdChanged(x))" />
             </MudStack>
             <MudStack Row="true" Breakpoint="Breakpoint.SmAndDown" Class="form-field-stack gap-md-8 mb-5">
                 <div class="d-flex">
@@ -77,7 +77,7 @@
                 <MudButton Variant="Variant.Filled"
                            Color="Color.Primary"
                            StartIcon="@Icons.Material.Filled.PlayCircle"
-                           Disabled="@(Locker.IsTroubleshootingPlaybackLocked() || _mediaItemId is null)"
+                           Disabled="@(Locker.IsTroubleshootingPlaybackLocked() || MediaItemId is null)"
                            OnClick="@PreviewChannel">
                     Play
                 </MudButton>
@@ -107,13 +107,15 @@
 
     private List<FFmpegProfileViewModel> _ffmpegProfiles = [];
     private List<WatermarkViewModel> _watermarks = [];
-    private int? _mediaItemId;
     private MediaItemInfo _info;
     private int _ffmpegProfileId;
     private int? _watermarkId;
     private bool _startFromBeginning;
     private bool _hasPlayed;
 
+    [SupplyParameterFromQuery(Name = "mediaItem")]
+    public int? MediaItemId { get; set; }
+
     public void Dispose()
     {
         _cts.Cancel();
@@ -135,6 +137,11 @@
         }
 
         _watermarks = await Mediator.Send(new GetAllWatermarks(), _cts.Token);
+
+        if (MediaItemId is not null)
+        {
+            await OnMediaItemIdChanged(MediaItemId);
+        }
     }
 
     private void LockChanged(object sender, EventArgs e) => InvokeAsync(StateHasChanged);
@@ -143,7 +150,7 @@
     {
         var uri = new UriBuilder(NavigationManager.ToAbsoluteUri(NavigationManager.Uri));
         uri.Path = uri.Path.Replace("/system/troubleshooting/playback", "/api/troubleshoot/playback.m3u8");
-        uri.Query = $"?mediaItem={_mediaItemId}&ffmpegProfile={_ffmpegProfileId}&watermark={_watermarkId ?? 0}&startFromBeginning={_startFromBeginning}";
+        uri.Query = $"?mediaItem={MediaItemId}&ffmpegProfile={_ffmpegProfileId}&watermark={_watermarkId ?? 0}&startFromBeginning={_startFromBeginning}";
         await JsRuntime.InvokeVoidAsync("previewChannel", uri.ToString());
 
         await Task.Delay(TimeSpan.FromSeconds(1));
@@ -153,7 +160,7 @@
 
     private async Task OnMediaItemIdChanged(int? mediaItemId)
     {
-        _mediaItemId = mediaItemId;
+        MediaItemId = mediaItemId;
         _hasPlayed = false;
 
         foreach (int id in Optional(mediaItemId))
@@ -167,7 +174,7 @@
 
             if (maybeInfo.IsLeft)
             {
-                _mediaItemId = null;
+                MediaItemId = null;
             }
         }
 
@@ -176,7 +183,7 @@
 
     private async Task DownloadResults()
     {
-        await JsRuntime.InvokeVoidAsync("window.open", $"api/troubleshoot/playback/archive?mediaItem={_mediaItemId ?? 0}&ffmpegProfile={_ffmpegProfileId}&watermark={_watermarkId ?? 0}&startFromBeginning={_startFromBeginning}");
+        await JsRuntime.InvokeVoidAsync("window.open", $"api/troubleshoot/playback/archive?mediaItem={MediaItemId ?? 0}&ffmpegProfile={_ffmpegProfileId}&watermark={_watermarkId ?? 0}&startFromBeginning={_startFromBeginning}");
     }
 
     private void HandleTroubleshootingCompleted(PlaybackTroubleshootingCompletedNotification result)
diff --git a/ErsatzTV/Shared/MediaCard.razor b/ErsatzTV/Shared/MediaCard.razor
index 9de5387f6..d69d4261d 100644
--- a/ErsatzTV/Shared/MediaCard.razor
+++ b/ErsatzTV/Shared/MediaCard.razor
@@ -72,6 +72,10 @@
                                 <MudMenuItem Icon="@Icons.Material.Filled.Info"
                                              Label="Show Media Info"
                                              OnClick="@ShowMediaInfo"/>
+
+                                <MudMenuItem Icon="@Icons.Material.Filled.Troubleshoot"
+                                             Label="Troubleshoot Playback"
+                                             OnClick="@TroubleshootPlayback"/>
                             }
                         </MudMenu>
                     }
@@ -223,4 +227,9 @@
         }
     }
 
+    private void TroubleshootPlayback()
+    {
+        NavigationManager.NavigateTo($"system/troubleshooting/playback?mediaItem={Data.MediaItemId}");
+    }
+
 }
\ No newline at end of file