load more functionalities

Author: PrashantUnity

Pages/PlayMedia.razor

@@ -245,9 +245,33 @@
 
                     <!-- Load More Button -->
                     <div class="text-center">
-                        <button class="px-6 py-3 bg-soft-blue hover:bg-cartoon-yellow text-amber-800 rounded-full font-bold font-comic transition-colors cartoon-rounded">
-                            Load more videos
-                        </button>
+                        @if (hasMoreVideos)
+                        {
+                            <button @onclick="LoadMoreVideos" 
+                                    disabled="@isLoadingMore"
+                                    class="px-6 py-3 bg-soft-blue hover:bg-cartoon-yellow text-amber-800 rounded-full font-bold font-comic transition-colors cartoon-rounded disabled:opacity-50 disabled:cursor-not-allowed">
+                                @if (isLoadingMore)
+                                {
+                                    <div class="flex items-center space-x-2">
+                                        <svg class="animate-spin h-4 w-4" fill="none" viewBox="0 0 24 24">
+                                            <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
+                                            <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
+                                        </svg>
+                                        <span>Loading...</span>
+                                    </div>
+                                }
+                                else
+                                {
+                                    <span>Load more videos</span>
+                                }
+                            </button>
+                        }
+                        else
+                        {
+                            <div class="px-6 py-3 text-amber-600 font-comic text-sm">
+                                No more videos to load
+                            </div>
+                        }
                     </div>
                 </div>
             </div>
@@ -262,7 +286,11 @@
     [Parameter] public string VideId { get; set; } = string.Empty;
 
     private Video? currentVideo;
-    private IEnumerable<Video> randomVideos = Enumerable.Empty<Video>();
+    private List<Video> randomVideos = new();
+    private int currentVideoCount = 8;
+    private int videosPerLoad = 8;
+    private bool isLoadingMore = false;
+    private bool hasMoreVideos = true;
 
     private void GoTOPage(Video video)
     {
@@ -301,7 +329,14 @@
         {
             await VideoService.InitializeAsync();
             currentVideo = await VideoService.GetVideoByIdAsync(VideId);
-            randomVideos = await VideoService.GetRandomVideosAsync(8);
+            
+            // Reset video list and load initial videos
+            randomVideos.Clear();
+            currentVideoCount = videosPerLoad;
+            hasMoreVideos = true;
+            
+            var initialVideos = await VideoService.GetRandomVideosAsync(videosPerLoad);
+            randomVideos.AddRange(initialVideos);
 
             // Reset comments state for new video
             show = false;
@@ -313,6 +348,57 @@
         }
     }
 
+    private async Task LoadMoreVideos()
+    {
+        if (isLoadingMore || !hasMoreVideos) return;
+        
+        isLoadingMore = true;
+        StateHasChanged();
+        
+        try
+        {
+            // Get all videos to check if we have more available
+            var allVideos = await VideoService.GetAllVideosAsync();
+            var allVideosList = allVideos.ToList();
+            
+            // Check if we have more videos to load
+            if (currentVideoCount >= allVideosList.Count)
+            {
+                hasMoreVideos = false;
+                return;
+            }
+            
+            // Load more videos (excluding current video and already loaded videos)
+            var remainingVideos = allVideosList
+                .Where(v => v.Id != currentVideo?.Id && !randomVideos.Any(rv => rv.Id == v.Id))
+                .ToList();
+            
+            var videosToAdd = remainingVideos
+                .OrderBy(x => Guid.NewGuid()) // Randomize
+                .Take(videosPerLoad)
+                .ToList();
+            
+            randomVideos.AddRange(videosToAdd);
+            currentVideoCount += videosToAdd.Count;
+            
+            // Check if we've loaded all available videos
+            if (currentVideoCount >= allVideosList.Count || videosToAdd.Count < videosPerLoad)
+            {
+                hasMoreVideos = false;
+            }
+        }
+        catch (Exception ex)
+        {
+            // Handle error - in a real app you might want to show an error message
+            Console.WriteLine($"Error loading more videos: {ex.Message}");
+        }
+        finally
+        {
+            isLoadingMore = false;
+            StateHasChanged();
+        }
+    }
+
     public void Dispose()
     {
         StateService.OnStateChanged -= StateHasChanged;