Video playlists as a poster grid, with genre and rating filters, and a Playlists tab in libraries

[SergeiAK]

A playlist of movies opens only as a list, while a collection of the same movies gets a poster grid with view options. For video playlists — "Top rated", "Halloween", a franchise in watch order — the list is the weaker view: small art, no view options, no way to filter by genre or parental rating, and the playlist can't be reached from the movie library it belongs to.

What I built in my fork (Jellyfin 12.2.0, NVIDIA Shield):

1. Grid / List toggle on the playlist. The playlist page gets a "Grid view" button; the grid is the existing collection page (CollectionDetails) with a "List view" button back. The choice is remembered per playlist (per user, KeyValueService). Without a choice, video playlists (MediaType == Video) open as a grid, others as a list. In the grid the "Default" sort is the playlist order (BoxSetSortOptions), and Play / Shuffle go through the collection page's existing code. Reordering stays in the list view — a grid has no natural "up/down".

2. Genre and parental rating filters for playlists, in both views. Today the playlist's filter menu has no "Genres" entry, and "Parental rating" opens to "No results". The server returns no filter values when the parent is a playlist:

   Request	Playlist	Movie library
   GET /Genres?parentId=… (also with recursive=true)	0	19
   GET /Items/Filters?parentId=…	Genres 0, Tags 0, OfficialRatings 0, Years 0	—
   GET /Years?parentId=…	100	—

   Filtering itself works once the values are known (genreIds={Drama} → 36 of 100, years=1994 → 4), so only the option lists are missing. Year and decade already work in the app because they come from /Years. My guess is that playlist entries are linked children and the aggregate endpoints don't see them — not checked in the server source.

   The fix: for a playlist, collect genre, rating, year and decade values from its own items with one request (/Items?parentId={playlist}&fields=Genres&enableImages=false&collapseBoxSetItems=false). FilterOptionCache.getFilterOptionValues gets a fromItems flag (part of the cache key), and GenreFilter joins DefaultPlaylistItemsOptions. On the same 100-movie playlist: 22 genres, years from 1946, "Drama" → 36.

3. "Remove from playlist" in the grid's long-press menu, as the list already has since Add controls to edit playlists #1927. Shown only when the server says the user can edit the playlist (GET /Playlists/{id}/Users/{userId} → CanEdit); reuses PlaylistCreator.removeFromServerPlaylist.

4. A "Playlists" tab in movie and TV libraries, after Genres / Studios: includeItemTypes=Playlist&recursive=true under the library. The server itself assigns a playlist to a library by its contents, and the web client's Playlists tab shows the same set (4 in my Movies library, 1 in Animation). The tab is added last so remembered tab indexes don't shift. A library with no playlists (TV, in my case) shows "No results" in the tab.

New file ui/detail/PlaylistPage.kt picks between PlaylistDetails and CollectionDetails; the rest are small parameters threaded through existing composables. About +370 lines in total.

The diff also carries collapseBoxSetItems = false for playlist queries — that's the fix for #912 (movies replaced by their box sets), proposed there on its own: #912 (comment).

Checked on the Shield: the toggle and that it's remembered, grid order and description, genre and year filters in both views, the tab in Movies and TV, the "Remove from playlist" menu entry. Not yet: actually removing an item, Play / Shuffle from the grid, parental rating values on screen, music playlists, unit tests.

Questions for you:

• One PR, or split (e.g. filters first, then the grid and the tab)?
• Default for video playlists: grid as above, or list until the user picks?
• Keep the empty Playlists tab, or hide it when a library has none?

Before/after screenshots below.

Before

After

Diff

From 02b9a2501f2b1b618b0e0c8641875dd66453f3d7 Mon Sep 17 00:00:00 2001
From: Sergey K <17836309+SergeiAK@users.noreply.github.com>
Date: Wed, 14 Oct 2026 13:24:22 +0300
Subject: [PATCH 1/4] Show playlists as a grid like collections

Adds a per-playlist toggle between the classic list view and the collection
grid view. Video playlists default to the grid, other playlists to the list.

Playlist item queries now pass collapseBoxSetItems=false: otherwise the
server may replace movies that belong to a box set with the box set itself.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 .../wholphin/services/PlaylistCreator.kt      |   2 +
 .../wholphin/ui/detail/PlaylistDetails.kt     |  14 ++
 .../wholphin/ui/detail/PlaylistPage.kt        | 153 ++++++++++++++++++
 .../ui/detail/collection/CollectionButtons.kt |  17 +-
 .../ui/detail/collection/CollectionDetails.kt |   4 +
 .../detail/collection/CollectionViewModel.kt  |   3 +
 .../wholphin/ui/nav/DestinationContent.kt     |   4 +-
 app/src/main/res/values-ru/strings.xml        |   2 +
 app/src/main/res/values/strings.xml           |   2 +
 9 files changed, 198 insertions(+), 3 deletions(-)
 create mode 100644 app/src/main/java/com/github/damontecres/wholphin/ui/detail/PlaylistPage.kt

diff --git a/app/src/main/java/com/github/damontecres/wholphin/services/PlaylistCreator.kt b/app/src/main/java/com/github/damontecres/wholphin/services/PlaylistCreator.kt
index b1a48753..54df5261 100644
--- a/app/src/main/java/com/github/damontecres/wholphin/services/PlaylistCreator.kt
+++ b/app/src/main/java/com/github/damontecres/wholphin/services/PlaylistCreator.kt
@@ -100,6 +100,8 @@ class PlaylistCreator
                         sortBy = listOf(sortAndDirection.sort),
                         sortOrder = listOf(sortAndDirection.direction),
                         excludeLocationTypes = listOf(LocationType.VIRTUAL),
+                        // Otherwise the server may group the movies into their box sets
+                        collapseBoxSetItems = false,
                     ),
                 )
             val items = GetItemsRequestHandler.execute(api, request).content.items
diff --git a/app/src/main/java/com/github/damontecres/wholphin/ui/detail/PlaylistDetails.kt b/app/src/main/java/com/github/damontecres/wholphin/ui/detail/PlaylistDetails.kt
index b7085db6..d658f018 100644
--- a/app/src/main/java/com/github/damontecres/wholphin/ui/detail/PlaylistDetails.kt
+++ b/app/src/main/java/com/github/damontecres/wholphin/ui/detail/PlaylistDetails.kt
@@ -278,6 +278,8 @@ class PlaylistViewModel
                             parentId = itemId,
                             userId = user.id,
                             fields = SlimItemFields,
+                            // Otherwise the server may group the movies into their box sets
+                            collapseBoxSetItems = false,
                             sortBy = listOf(sortAndDirection.sort),
                             sortOrder = listOf(sortAndDirection.direction),
                         ),
@@ -456,6 +458,7 @@ fun PlaylistDetails(
     preferences: UserPreferences,
     destination: Destination.MediaItem,
     modifier: Modifier = Modifier,
+    onClickShowAsGrid: (() -> Unit)? = null,
     viewModel: PlaylistViewModel =
         hiltViewModel<PlaylistViewModel, PlaylistViewModel.Factory>(
             creationCallback = { it.create(destination.itemId) },
@@ -584,6 +587,7 @@ fun PlaylistDetails(
         getPossibleFilterValues = viewModel::getFilterOptionValues,
         canEdit = state.canEdit,
         onMoveItem = viewModel::onMoveItem,
+        onClickShowAsGrid = onClickShowAsGrid,
         modifier = modifier,
     )
     showContextMenu?.let { contextMenu ->
@@ -636,6 +640,7 @@ fun PlaylistDetailsContent(
     loadingState: LoadingState,
     canEdit: Boolean,
     modifier: Modifier = Modifier,
+    onClickShowAsGrid: (() -> Unit)? = null,
 ) {
     var savedIndex by rememberSaveable { mutableIntStateOf(0) }
     var focusedIndex by remember { mutableIntStateOf(savedIndex) }
@@ -683,6 +688,7 @@ fun PlaylistDetailsContent(
                     onFilterAndSortChange = onFilterAndSortChange,
                     getPossibleFilterValues = getPossibleFilterValues,
                     filterOptions = DefaultPlaylistItemsOptions,
+                    onClickShowAsGrid = onClickShowAsGrid,
                     modifier =
                         Modifier
                             .padding(top = 80.dp)
@@ -737,6 +743,7 @@ fun PlaylistDetailsHeader(
     onFilterAndSortChange: (GetItemsFilter, SortAndDirection) -> Unit,
     getPossibleFilterValues: suspend (ItemFilterBy<*>) -> List<FilterValueOption>,
     modifier: Modifier = Modifier,
+    onClickShowAsGrid: (() -> Unit)? = null,
 ) {
     Column(
         verticalArrangement = Arrangement.spacedBy(8.dp),
@@ -758,6 +765,13 @@ fun PlaylistDetailsHeader(
                 iconStringRes = R.string.fa_shuffle,
                 onClick = { onClickPlay.invoke(true) },
             )
+            if (onClickShowAsGrid != null) {
+                ExpandableFaButton(
+                    title = R.string.show_as_grid,
+                    iconStringRes = R.string.fa_images,
+                    onClick = onClickShowAsGrid,
+                )
+            }
         }
         Row(
             horizontalArrangement = Arrangement.spacedBy(8.dp),
diff --git a/app/src/main/java/com/github/damontecres/wholphin/ui/detail/PlaylistPage.kt b/app/src/main/java/com/github/damontecres/wholphin/ui/detail/PlaylistPage.kt
new file mode 100644
index 00000000..d99e94cd
--- /dev/null
+++ b/app/src/main/java/com/github/damontecres/wholphin/ui/detail/PlaylistPage.kt
@@ -0,0 +1,153 @@
+package com.github.damontecres.wholphin.ui.detail
+
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.collectAsState
+import androidx.compose.runtime.getValue
+import androidx.compose.ui.Modifier
+import androidx.hilt.lifecycle.viewmodel.compose.hiltViewModel
+import androidx.lifecycle.ViewModel
+import androidx.lifecycle.viewModelScope
+import com.github.damontecres.wholphin.data.ServerRepository
+import com.github.damontecres.wholphin.preferences.UserPreferences
+import com.github.damontecres.wholphin.services.KeyValueService
+import com.github.damontecres.wholphin.ui.components.ErrorMessage
+import com.github.damontecres.wholphin.ui.components.LoadingPage
+import com.github.damontecres.wholphin.ui.detail.collection.CollectionDetails
+import com.github.damontecres.wholphin.ui.launchIO
+import com.github.damontecres.wholphin.ui.nav.Destination
+import com.github.damontecres.wholphin.ui.toServerString
+import com.github.damontecres.wholphin.util.LoadingState
+import dagger.assisted.Assisted
+import dagger.assisted.AssistedFactory
+import dagger.assisted.AssistedInject
+import dagger.hilt.android.lifecycle.HiltViewModel
+import kotlinx.coroutines.CancellationException
+import kotlinx.coroutines.flow.MutableStateFlow
+import kotlinx.coroutines.flow.StateFlow
+import kotlinx.coroutines.flow.first
+import kotlinx.coroutines.flow.update
+import org.jellyfin.sdk.api.client.ApiClient
+import org.jellyfin.sdk.api.client.extensions.userLibraryApi
+import org.jellyfin.sdk.model.api.MediaType
+import timber.log.Timber
+import java.util.UUID
+
+/**
+ * How a playlist is displayed: as a list (the classic playlist page) or as a grid like a collection
+ */
+data class PlaylistPageState(
+    val loadingState: LoadingState = LoadingState.Pending,
+    val showAsGrid: Boolean = false,
+)
+
+@HiltViewModel(assistedFactory = PlaylistPageViewModel.Factory::class)
+class PlaylistPageViewModel
+    @AssistedInject
+    constructor(
+        private val api: ApiClient,
+        private val serverRepository: ServerRepository,
+        private val keyValueService: KeyValueService,
+        @Assisted private val itemId: UUID,
+    ) : ViewModel() {
+        @AssistedFactory
+        interface Factory {
+            fun create(itemId: UUID): PlaylistPageViewModel
+        }
+
+        private val _state = MutableStateFlow(PlaylistPageState())
+        val state: StateFlow<PlaylistPageState> = _state
+
+        init {
+            viewModelScope.launchIO {
+                try {
+                    val saved =
+                        serverRepository.currentUser?.id?.let { userId ->
+                            keyValueService
+                                .get(userId, VIEW_MODE_KEY, emptyMap<String, Boolean>())
+                                .first()[itemId.toServerString()]
+                        }
+                    val showAsGrid =
+                        saved ?: run {
+                            // Video playlists default to the grid, everything else to the list
+                            val playlist by api.userLibraryApi.getItem(itemId)
+                            playlist.mediaType == MediaType.VIDEO
+                        }
+                    _state.update {
+                        it.copy(loadingState = LoadingState.Success, showAsGrid = showAsGrid)
+                    }
+                } catch (ex: CancellationException) {
+                    throw ex
+                } catch (ex: Exception) {
+                    Timber.e(ex, "Error getting view mode for playlist %s", itemId)
+                    _state.update { it.copy(loadingState = LoadingState.Success) }
+                }
+            }
+        }
+
+        fun setShowAsGrid(showAsGrid: Boolean) {
+            _state.update { it.copy(showAsGrid = showAsGrid) }
+            viewModelScope.launchIO {
+                serverRepository.currentUser?.id?.let { userId ->
+                    val current =
+                        keyValueService
+                            .get(userId, VIEW_MODE_KEY, emptyMap<String, Boolean>())
+                            .first()
+                    keyValueService.save(
+                        userId,
+                        VIEW_MODE_KEY,
+                        current + (itemId.toServerString() to showAsGrid),
+                    )
+                }
+            }
+        }
+
+        companion object {
+            const val VIEW_MODE_KEY = "PlaylistShowAsGrid"
+        }
+    }
+
+/**
+ * Shows a playlist either as a list ([PlaylistDetails]) or as a grid ([CollectionDetails]),
+ * remembering the choice per playlist
+ */
+@Composable
+fun PlaylistPage(
+    preferences: UserPreferences,
+    destination: Destination.MediaItem,
+    modifier: Modifier = Modifier,
+    viewModel: PlaylistPageViewModel =
+        hiltViewModel<PlaylistPageViewModel, PlaylistPageViewModel.Factory>(
+            creationCallback = { it.create(destination.itemId) },
+        ),
+) {
+    val state by viewModel.state.collectAsState()
+    when (val s = state.loadingState) {
+        is LoadingState.Error -> {
+            ErrorMessage(s, modifier)
+        }
+
+        LoadingState.Pending,
+        LoadingState.Loading,
+        -> {
+            LoadingPage(modifier)
+        }
+
+        LoadingState.Success -> {
+            if (state.showAsGrid) {
+                CollectionDetails(
+                    preferences = preferences,
+                    itemId = destination.itemId,
+                    onClickShowAsList = { viewModel.setShowAsGrid(false) },
+                    modifier = modifier,
+                )
+            } else {
+                PlaylistDetails(
+                    preferences = preferences,
+                    destination = destination,
+                    onClickShowAsGrid = { viewModel.setShowAsGrid(true) },
+                    modifier = modifier,
+                )
+            }
+        }
+    }
+}
diff --git a/app/src/main/java/com/github/damontecres/wholphin/ui/detail/collection/CollectionButtons.kt b/app/src/main/java/com/github/damontecres/wholphin/ui/detail/collection/CollectionButtons.kt
index 759da02e..a63ae1ca 100644
--- a/app/src/main/java/com/github/damontecres/wholphin/ui/detail/collection/CollectionButtons.kt
+++ b/app/src/main/java/com/github/damontecres/wholphin/ui/detail/collection/CollectionButtons.kt
@@ -27,8 +27,10 @@ import com.github.damontecres.wholphin.ui.components.ExpandableFaButton
 import com.github.damontecres.wholphin.ui.components.ExpandablePlayButton
 import com.github.damontecres.wholphin.ui.components.FilterByButton
 import com.github.damontecres.wholphin.ui.components.SortByButton
+import com.github.damontecres.wholphin.ui.data.BoxSetSortOptions
 import com.github.damontecres.wholphin.ui.data.MovieSortOptions
 import com.github.damontecres.wholphin.ui.data.SortAndDirection
+import org.jellyfin.sdk.model.api.BaseItemKind
 import kotlin.time.Duration
 
 @Composable
@@ -44,8 +46,11 @@ fun CollectionButtons(
     canDelete: Boolean,
     moreOnClick: () -> Unit,
     modifier: Modifier = Modifier,
+    onClickShowAsList: (() -> Unit)? = null,
 ) {
-    val sortOptions = MovieSortOptions
+    // Playlists have their own order, which is only available as the default sort
+    val sortOptions =
+        if (state.collection?.type == BaseItemKind.PLAYLIST) BoxSetSortOptions else MovieSortOptions
     val filterOptions = DefaultFilterOptions
     val firstFocus = remember { FocusRequester() }
     Row(
@@ -98,6 +103,16 @@ fun CollectionButtons(
                 }
             }
 
+            if (onClickShowAsList != null) {
+                item("show_as_list") {
+                    ExpandableFaButton(
+                        title = R.string.show_as_list,
+                        iconStringRes = R.string.fa_list_ul,
+                        onClick = onClickShowAsList,
+                    )
+                }
+            }
+
             item {
                 ExpandableFaButton(
                     title = R.string.view_options,
diff --git a/app/src/main/java/com/github/damontecres/wholphin/ui/detail/collection/CollectionDetails.kt b/app/src/main/java/com/github/damontecres/wholphin/ui/detail/collection/CollectionDetails.kt
index 291ef74a..99eb9a96 100644
--- a/app/src/main/java/com/github/damontecres/wholphin/ui/detail/collection/CollectionDetails.kt
+++ b/app/src/main/java/com/github/damontecres/wholphin/ui/detail/collection/CollectionDetails.kt
@@ -64,6 +64,7 @@ fun CollectionDetails(
     preferences: UserPreferences,
     itemId: UUID,
     modifier: Modifier = Modifier,
+    onClickShowAsList: (() -> Unit)? = null,
     viewModel: CollectionViewModel =
         hiltViewModel<CollectionViewModel, CollectionViewModel.Factory>(
             creationCallback = { it.create(itemId) },
@@ -182,6 +183,7 @@ fun CollectionDetails(
                 getPossibleFilterValues = viewModel::getPossibleFilterValues,
                 letterPosition = viewModel::letterPosition,
                 onClickViewOptions = onClickViewOptions,
+                onClickShowAsList = onClickShowAsList,
                 modifier = modifier,
                 overviewOnClick = {
                     val collection = state.collection!!
@@ -298,6 +300,7 @@ fun CollectionDetailsContent(
     canDelete: Boolean,
     moreOnClick: () -> Unit,
     modifier: Modifier,
+    onClickShowAsList: (() -> Unit)? = null,
 ) {
     var itemsContentHasFocus by rememberSaveable { mutableStateOf(false) }
     val bringIntoViewRequester = remember { BringIntoViewRequester() }
@@ -393,6 +396,7 @@ fun CollectionDetailsContent(
                             onFilterChange = onFilterChange,
                             getPossibleFilterValues = getPossibleFilterValues,
                             onClickViewOptions = onClickViewOptions,
+                            onClickShowAsList = onClickShowAsList,
                             favoriteOnClick = favoriteOnClick,
                             onConfirmDelete = onConfirmDelete,
                             canDelete = canDelete,
diff --git a/app/src/main/java/com/github/damontecres/wholphin/ui/detail/collection/CollectionViewModel.kt b/app/src/main/java/com/github/damontecres/wholphin/ui/detail/collection/CollectionViewModel.kt
index bdbb059a..ba89b628 100644
--- a/app/src/main/java/com/github/damontecres/wholphin/ui/detail/collection/CollectionViewModel.kt
+++ b/app/src/main/java/com/github/damontecres/wholphin/ui/detail/collection/CollectionViewModel.kt
@@ -305,6 +305,9 @@ class CollectionViewModel
                     sortBy = sort?.let { listOf(sort.sort) },
                     sortOrder = sort?.let { listOf(sort.direction) },
                     fields = SlimItemFields,
+                    // A playlist shows its own items, not the box sets they belong to
+                    collapseBoxSetItems =
+                        if (state.value.collection?.type == BaseItemKind.PLAYLIST) false else null,
                 ).let {
                     filter?.applyTo(it, false) ?: it
                 }
diff --git a/app/src/main/java/com/github/damontecres/wholphin/ui/nav/DestinationContent.kt b/app/src/main/java/com/github/damontecres/wholphin/ui/nav/DestinationContent.kt
index 63789d6c..f2a1fcff 100644
--- a/app/src/main/java/com/github/damontecres/wholphin/ui/nav/DestinationContent.kt
+++ b/app/src/main/java/com/github/damontecres/wholphin/ui/nav/DestinationContent.kt
@@ -26,7 +26,7 @@ import com.github.damontecres.wholphin.ui.detail.DebugPage
 import com.github.damontecres.wholphin.ui.detail.FavoritesPage
 import com.github.damontecres.wholphin.ui.detail.HomeRowGrid
 import com.github.damontecres.wholphin.ui.detail.PersonPage
-import com.github.damontecres.wholphin.ui.detail.PlaylistDetails
+import com.github.damontecres.wholphin.ui.detail.PlaylistPage
 import com.github.damontecres.wholphin.ui.detail.collection.CollectionDetails
 import com.github.damontecres.wholphin.ui.detail.discover.DiscoverMovieDetails
 import com.github.damontecres.wholphin.ui.detail.discover.DiscoverPersonPage
@@ -191,7 +191,7 @@ fun DestinationContent(
 
                 BaseItemKind.PLAYLIST -> {
                     LaunchedEffect(Unit) { onClearBackdrop.invoke() }
-                    PlaylistDetails(
+                    PlaylistPage(
                         preferences = preferences,
                         destination = destination,
                         modifier = modifier,
diff --git a/app/src/main/res/values-ru/strings.xml b/app/src/main/res/values-ru/strings.xml
index 1c2321e9..d45fe411 100644
--- a/app/src/main/res/values-ru/strings.xml
+++ b/app/src/main/res/values-ru/strings.xml
@@ -237,6 +237,8 @@
     <string name="confirm_pin">Подтвердите ПИН-код</string>
     <string name="incorrect">Неверно</string>
     <string name="view_options">Параметры отображения</string>
+    <string name="show_as_grid">Показать сеткой</string>
+    <string name="show_as_list">Показать списком</string>
     <string name="columns">Колонки</string>
     <string name="subtitle_style">Стиль субтитров</string>
     <string name="background_color">Цвет фона</string>
diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml
index 81353ff3..60e58b43 100644
--- a/app/src/main/res/values/strings.xml
+++ b/app/src/main/res/values/strings.xml
@@ -427,6 +427,8 @@
         <item>@string/force_disable</item>
     </string-array>
     <string name="view_options">View options</string>
+    <string name="show_as_grid">Show as grid</string>
+    <string name="show_as_list">Show as list</string>
     <string name="columns">Columns</string>
     <string name="spacing">Spacing</string>
     <string name="aspect_ratio">Aspect Ratio</string>
-- 
2.55.0.windows.3

From 0bb7715cf05036f4da50df2605765fd9fd2ccf11 Mon Sep 17 00:00:00 2001
From: Sergey K <17836309+SergeiAK@users.noreply.github.com>
Date: Wed, 14 Oct 2026 14:29:54 +0300
Subject: [PATCH 2/4] Remove from playlist in the grid, Playlists tab in
 libraries

The grid view of a playlist offers "Remove from playlist" on long press when
the user can edit the playlist. Movie and TV libraries get a Playlists tab
with the playlists the server considers part of that library.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 .../ui/detail/CollectionFolderMovie.kt        | 33 +++++++++++++++++
 .../wholphin/ui/detail/CollectionFolderTv.kt  | 32 +++++++++++++++++
 .../ui/detail/collection/CollectionDetails.kt |  4 +++
 .../detail/collection/CollectionViewModel.kt  | 36 +++++++++++++++++++
 4 files changed, 105 insertions(+)

diff --git a/app/src/main/java/com/github/damontecres/wholphin/ui/detail/CollectionFolderMovie.kt b/app/src/main/java/com/github/damontecres/wholphin/ui/detail/CollectionFolderMovie.kt
index cb1d1812..b841d70f 100644
--- a/app/src/main/java/com/github/damontecres/wholphin/ui/detail/CollectionFolderMovie.kt
+++ b/app/src/main/java/com/github/damontecres/wholphin/ui/detail/CollectionFolderMovie.kt
@@ -42,6 +42,7 @@ fun CollectionFolderMovie(
                 TabDetails(R.string.library),
                 TabDetails(R.string.collections),
                 TabDetails(R.string.genres),
+                TabDetails(R.string.playlists),
             )
         }
 
@@ -146,6 +147,38 @@ fun CollectionFolderMovie(
                 )
             }
 
+            // Playlists, the server returns those with items in this library
+            4 -> {
+                CollectionFolderView(
+                    preferences = preferences,
+                    onClickItem = { _, item ->
+                        preferencesViewModel.navigationManager.navigateTo(item.destination())
+                    },
+                    itemId = destination.itemId,
+                    viewModelKey = "${destination.itemId}_playlist",
+                    initialFilter =
+                        CollectionFolderFilter(
+                            filter =
+                                GetItemsFilter(
+                                    includeItemTypes = listOf(BaseItemKind.PLAYLIST),
+                                ),
+                        ),
+                    showTitle = false,
+                    recursive = true,
+                    sortOptions = VideoSortOptions,
+                    defaultViewOptions = ViewOptionsPoster,
+                    modifier =
+                        Modifier
+                            .fillMaxSize()
+                            .focusRequester(tabDetails.contentFocusRequester),
+                    positionCallback = { columns, position ->
+                        showHeader = position < columns
+                    },
+                    playEnabled = false,
+                    focusRequesterOnEmpty = tabDetails.tabFocusRequester,
+                )
+            }
+
             else -> {
                 ErrorMessage("Invalid tab index $tabIndex", null)
             }
diff --git a/app/src/main/java/com/github/damontecres/wholphin/ui/detail/CollectionFolderTv.kt b/app/src/main/java/com/github/damontecres/wholphin/ui/detail/CollectionFolderTv.kt
index 2f8fb909..d243d34a 100644
--- a/app/src/main/java/com/github/damontecres/wholphin/ui/detail/CollectionFolderTv.kt
+++ b/app/src/main/java/com/github/damontecres/wholphin/ui/detail/CollectionFolderTv.kt
@@ -27,6 +27,7 @@ import com.github.damontecres.wholphin.ui.components.TabDetails
 import com.github.damontecres.wholphin.ui.components.TabbedPage
 import com.github.damontecres.wholphin.ui.components.ViewOptionsPoster
 import com.github.damontecres.wholphin.ui.data.SeriesSortOptions
+import com.github.damontecres.wholphin.ui.data.VideoSortOptions
 import com.github.damontecres.wholphin.ui.nav.Destination
 import dagger.hilt.android.lifecycle.HiltViewModel
 import org.jellyfin.sdk.model.api.BaseItemKind
@@ -54,6 +55,7 @@ fun CollectionFolderTv(
                 TabDetails(R.string.library),
                 TabDetails(R.string.genres),
                 TabDetails(R.string.studios),
+                TabDetails(R.string.playlists),
             )
         }
     val onClickItem =
@@ -142,6 +144,36 @@ fun CollectionFolderTv(
                 )
             }
 
+            // Playlists, the server returns those with items in this library
+            4 -> {
+                CollectionFolderView(
+                    preferences = preferences,
+                    itemId = destination.itemId,
+                    viewModelKey = "${destination.itemId}_playlist",
+                    initialFilter =
+                        CollectionFolderFilter(
+                            filter =
+                                GetItemsFilter(
+                                    includeItemTypes = listOf(BaseItemKind.PLAYLIST),
+                                ),
+                        ),
+                    showTitle = false,
+                    recursive = true,
+                    sortOptions = VideoSortOptions,
+                    defaultViewOptions = ViewOptionsPoster,
+                    modifier =
+                        Modifier
+                            .fillMaxSize()
+                            .focusRequester(tabDetails.contentFocusRequester),
+                    positionCallback = { columns, position ->
+                        showHeader = position < columns
+                    },
+                    onClickItem = onClickItem,
+                    playEnabled = false,
+                    focusRequesterOnEmpty = tabDetails.tabFocusRequester,
+                )
+            }
+
             else -> {
                 ErrorMessage("Invalid tab index $tabIndex", null)
             }
diff --git a/app/src/main/java/com/github/damontecres/wholphin/ui/detail/collection/CollectionDetails.kt b/app/src/main/java/com/github/damontecres/wholphin/ui/detail/collection/CollectionDetails.kt
index 99eb9a96..43e9fcdd 100644
--- a/app/src/main/java/com/github/damontecres/wholphin/ui/detail/collection/CollectionDetails.kt
+++ b/app/src/main/java/com/github/damontecres/wholphin/ui/detail/collection/CollectionDetails.kt
@@ -106,6 +106,9 @@ fun CollectionDetails(
             onClearChosenStreams = {
                 // Not supported on this page
             },
+            onRemoveFromPlaylist = { _, itemId ->
+                viewModel.removeFromPlaylist(itemId, position)
+            },
         )
 
     // Actions
@@ -127,6 +130,7 @@ fun CollectionDetails(
                         canRemoveContinueWatching = false,
                         canRemoveNextUp = false,
                         actions = contextActionsFor(position),
+                        showRemoveFromPlaylist = state.canEditPlaylist,
                     )
             }
         }
diff --git a/app/src/main/java/com/github/damontecres/wholphin/ui/detail/collection/CollectionViewModel.kt b/app/src/main/java/com/github/damontecres/wholphin/ui/detail/collection/CollectionViewModel.kt
index ba89b628..b141b07c 100644
--- a/app/src/main/java/com/github/damontecres/wholphin/ui/detail/collection/CollectionViewModel.kt
+++ b/app/src/main/java/com/github/damontecres/wholphin/ui/detail/collection/CollectionViewModel.kt
@@ -20,6 +20,7 @@ import com.github.damontecres.wholphin.services.KeyValueService
 import com.github.damontecres.wholphin.services.MediaManagementService
 import com.github.damontecres.wholphin.services.MusicService
 import com.github.damontecres.wholphin.services.NavigationManager
+import com.github.damontecres.wholphin.services.PlaylistCreator
 import com.github.damontecres.wholphin.services.ServerReportService
 import com.github.damontecres.wholphin.services.ThemeSongPlayer
 import com.github.damontecres.wholphin.services.UserPreferencesService
@@ -63,6 +64,7 @@ import kotlinx.coroutines.launch
 import kotlinx.coroutines.supervisorScope
 import kotlinx.coroutines.withContext
 import org.jellyfin.sdk.api.client.ApiClient
+import org.jellyfin.sdk.api.client.extensions.playlistsApi
 import org.jellyfin.sdk.api.client.extensions.userLibraryApi
 import org.jellyfin.sdk.model.api.BaseItemKind
 import org.jellyfin.sdk.model.api.ImageType
@@ -92,6 +94,7 @@ class CollectionViewModel
         private val musicService: MusicService,
         val serverReportService: ServerReportService,
         private val filterOptionCache: FilterOptionCache,
+        private val playlistCreator: PlaylistCreator,
         @Assisted private val itemId: UUID,
     ) : ViewModel() {
         @AssistedFactory
@@ -156,6 +159,10 @@ class CollectionViewModel
                             logoImageUrl = logoImageUrl,
                         )
                     }
+                    if (collection.type == BaseItemKind.PLAYLIST) {
+                        val canEdit = canEditPlaylist()
+                        _state.update { it.copy(canEditPlaylist = canEdit) }
+                    }
                     listenForStateUpdates()
                     themeSongPlayer.playThemeFor(itemId)
                 } catch (ex: CancellationException) {
@@ -171,6 +178,34 @@ class CollectionViewModel
             themeSongPlayer.stop()
         }
 
+        private suspend fun canEditPlaylist(): Boolean {
+            val userId = serverRepository.currentUser?.id ?: return false
+            return try {
+                api.playlistsApi
+                    .getPlaylistUser(itemId, userId)
+                    .content.canEdit
+            } catch (ex: CancellationException) {
+                throw ex
+            } catch (ex: Exception) {
+                // The server returns 404 if the user has no permission
+                Timber.w(ex, "Cannot check permission for playlist %s", itemId)
+                false
+            }
+        }
+
+        fun removeFromPlaylist(
+            itemId: UUID,
+            position: RowColumn?,
+        ) = viewModelScope.launch(ExceptionHandler() + WholphinDispatchers.IO) {
+            playlistCreator.removeFromServerPlaylist(
+                playlistId = this@CollectionViewModel.itemId,
+                itemId = itemId,
+            )
+            if (position != null) {
+                refreshItem(itemId, position, true)
+            }
+        }
+
         /**
          * Collects on [state] and fetches data when needed
          */
@@ -528,4 +563,5 @@ data class CollectionState(
     val items: List<BaseItem?> = emptyList(),
     val separateItems: Map<BaseItemKind, HomeRowLoadingState> = emptyMap(),
     val logoImageUrl: String? = null,
+    val canEditPlaylist: Boolean = false,
 )
-- 
2.55.0.windows.3

From 5cb50d2ab40ecfe1cbdb6c9e396fda2fc81ae013 Mon Sep 17 00:00:00 2001
From: Sergey K <17836309+SergeiAK@users.noreply.github.com>
Date: Wed, 14 Oct 2026 15:15:55 +0300
Subject: [PATCH 3/4] Collect playlist filter values from its items

The server returns no genres, years or official ratings when the parent is a
playlist, so the filter lists were empty. Collect them from the playlist's
items instead, and offer the genre filter on the playlist list page too.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 .../wholphin/data/filter/ItemFilterBy.kt      |  1 +
 .../wholphin/services/FilterOptionCache.kt    | 82 ++++++++++++++++++-
 .../wholphin/ui/detail/PlaylistDetails.kt     |  1 +
 .../detail/collection/CollectionViewModel.kt  |  1 +
 4 files changed, 82 insertions(+), 3 deletions(-)

diff --git a/app/src/main/java/com/github/damontecres/wholphin/data/filter/ItemFilterBy.kt b/app/src/main/java/com/github/damontecres/wholphin/data/filter/ItemFilterBy.kt
index b92d251f..e9dfb018 100644
--- a/app/src/main/java/com/github/damontecres/wholphin/data/filter/ItemFilterBy.kt
+++ b/app/src/main/java/com/github/damontecres/wholphin/data/filter/ItemFilterBy.kt
@@ -67,6 +67,7 @@ val DefaultForStudiosFilterOptions =
 
 val DefaultPlaylistItemsOptions =
     listOf(
+        GenreFilter,
         PlayedFilter,
         FavoriteFilter,
         CommunityRatingFilter,
diff --git a/app/src/main/java/com/github/damontecres/wholphin/services/FilterOptionCache.kt b/app/src/main/java/com/github/damontecres/wholphin/services/FilterOptionCache.kt
index 52734f20..0c496f54 100644
--- a/app/src/main/java/com/github/damontecres/wholphin/services/FilterOptionCache.kt
+++ b/app/src/main/java/com/github/damontecres/wholphin/services/FilterOptionCache.kt
@@ -26,6 +26,7 @@ import com.github.damontecres.wholphin.data.filter.VideoTypeFilter
 import com.github.damontecres.wholphin.data.filter.YearFilter
 import com.github.damontecres.wholphin.services.hilt.IoCoroutineScope
 import com.github.damontecres.wholphin.ui.showToast
+import com.github.damontecres.wholphin.util.GetItemsRequestHandler
 import com.mayakapps.kache.InMemoryKache
 import dagger.hilt.android.qualifiers.ApplicationContext
 import kotlinx.coroutines.CancellationException
@@ -39,8 +40,10 @@ import org.jellyfin.sdk.api.client.extensions.studiosApi
 import org.jellyfin.sdk.api.client.extensions.yearsApi
 import org.jellyfin.sdk.model.UUID
 import org.jellyfin.sdk.model.api.BaseItemKind
+import org.jellyfin.sdk.model.api.ItemFields
 import org.jellyfin.sdk.model.api.ItemSortBy
 import org.jellyfin.sdk.model.api.SortOrder
+import org.jellyfin.sdk.model.api.request.GetItemsRequest
 import timber.log.Timber
 import java.util.TreeSet
 import javax.inject.Inject
@@ -74,12 +77,18 @@ class FilterOptionCache
         suspend fun getFilterOptionValues(
             parentId: UUID?,
             filterOption: FilterBy<*, *>,
+            fromItems: Boolean = false,
         ): List<FilterValueOption> {
-            val cacheKey = FilterOptionCacheKey(serverRepository.currentUser?.id, parentId, filterOption)
+            val cacheKey =
+                FilterOptionCacheKey(serverRepository.currentUser?.id, parentId, filterOption, fromItems)
             return try {
                 cache
-                    .getOrPut(cacheKey) { (userId, parentId, filterOption) ->
-                        getFilterOptionValues(userId, parentId, filterOption)
+                    .getOrPut(cacheKey) { (userId, parentId, filterOption, fromItems) ->
+                        if (fromItems && parentId != null) {
+                            getFilterOptionValuesFromItems(userId, parentId, filterOption)
+                        } else {
+                            getFilterOptionValues(userId, parentId, filterOption)
+                        }
                     }.orEmpty()
             } catch (ex: CancellationException) {
                 throw ex
@@ -191,6 +200,72 @@ class FilterOptionCache
             }
         }
 
+        /**
+         * Collects the values from the items of the parent itself
+         *
+         * The server returns no genres, years or ratings when the parent is a playlist,
+         * because its items are only linked to it
+         */
+        private suspend fun getFilterOptionValuesFromItems(
+            userId: UUID?,
+            parentId: UUID,
+            filterOption: FilterBy<*, *>,
+        ): List<FilterValueOption> {
+            if (filterOption !in setOf(GenreFilter, OfficialRatingFilter, YearFilter, DecadeFilter)) {
+                return getFilterOptionValues(userId, parentId, filterOption)
+            }
+            val request =
+                GetItemsRequest(
+                    userId = userId,
+                    parentId = parentId,
+                    fields = listOf(ItemFields.GENRES),
+                    enableImages = false,
+                    collapseBoxSetItems = false,
+                )
+            val items =
+                GetItemsRequestHandler
+                    .execute(api, request)
+                    .content.items
+            return when (filterOption) {
+                GenreFilter -> {
+                    items
+                        .flatMap { it.genreItems.orEmpty() }
+                        .distinctBy { it.id }
+                        .sortedBy { it.name?.lowercase() }
+                        .map { FilterValueOption(it.name ?: "", it.id) }
+                }
+
+                OfficialRatingFilter -> {
+                    val ratings =
+                        api.localizationApi
+                            .getParentalRatings()
+                            .content
+                            .associate { it.name to it.value }
+                    items
+                        .mapNotNull { it.officialRating }
+                        .distinct()
+                        .map { FilterValueOption(it, ratings[it] ?: 0) }
+                        .sortedBy { it.value as Int }
+                }
+
+                YearFilter -> {
+                    items
+                        .mapNotNull { it.productionYear }
+                        .distinct()
+                        .sorted()
+                        .map { FilterValueOption(it.toString(), it) }
+                }
+
+                else -> {
+                    items
+                        .mapNotNull { it.productionYear?.div(10)?.times(10) }
+                        .distinct()
+                        .sorted()
+                        .map { FilterValueOption("$it's", it) }
+                }
+            }
+        }
+
         private suspend fun getDiscoverFilterOptionValues(filterOption: DiscoverFilterBy<*>): List<FilterValueOption> {
             if (seerrService.active.firstOrNull() != true) {
                 return emptyList()
@@ -266,5 +341,6 @@ class FilterOptionCache
             val userId: UUID?,
             val parentId: UUID?,
             val filterOption: FilterBy<*, *>,
+            val fromItems: Boolean,
         )
     }
diff --git a/app/src/main/java/com/github/damontecres/wholphin/ui/detail/PlaylistDetails.kt b/app/src/main/java/com/github/damontecres/wholphin/ui/detail/PlaylistDetails.kt
index d658f018..86f475ae 100644
--- a/app/src/main/java/com/github/damontecres/wholphin/ui/detail/PlaylistDetails.kt
+++ b/app/src/main/java/com/github/damontecres/wholphin/ui/detail/PlaylistDetails.kt
@@ -362,6 +362,7 @@ class PlaylistViewModel
             filterOptionCache.getFilterOptionValues(
                 itemId,
                 filterOption,
+                fromItems = true,
             )
 
         fun updateBackdrop(item: BaseItem) {
diff --git a/app/src/main/java/com/github/damontecres/wholphin/ui/detail/collection/CollectionViewModel.kt b/app/src/main/java/com/github/damontecres/wholphin/ui/detail/collection/CollectionViewModel.kt
index b141b07c..c8b82c56 100644
--- a/app/src/main/java/com/github/damontecres/wholphin/ui/detail/collection/CollectionViewModel.kt
+++ b/app/src/main/java/com/github/damontecres/wholphin/ui/detail/collection/CollectionViewModel.kt
@@ -407,6 +407,7 @@ class CollectionViewModel
             filterOptionCache.getFilterOptionValues(
                 itemId,
                 filterOption,
+                fromItems = state.value.collection?.type == BaseItemKind.PLAYLIST,
             )
 
         suspend fun letterPosition(letter: Char): Int =
-- 
2.55.0.windows.3

From 84539533deaaa1b132c117616e1ec72c5ca696cf Mon Sep 17 00:00:00 2001
From: Sergey K <17836309+SergeiAK@users.noreply.github.com>
Date: Wed, 14 Oct 2026 15:26:29 +0300
Subject: [PATCH 4/4] Shorter labels for the playlist view toggle

"Show as grid" wrapped to two lines in the narrow header of the playlist list page.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 app/src/main/res/values-ru/strings.xml | 4 ++--
 app/src/main/res/values/strings.xml    | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/app/src/main/res/values-ru/strings.xml b/app/src/main/res/values-ru/strings.xml
index d45fe411..5e0c0b46 100644
--- a/app/src/main/res/values-ru/strings.xml
+++ b/app/src/main/res/values-ru/strings.xml
@@ -237,8 +237,8 @@
     <string name="confirm_pin">Подтвердите ПИН-код</string>
     <string name="incorrect">Неверно</string>
     <string name="view_options">Параметры отображения</string>
-    <string name="show_as_grid">Показать сеткой</string>
-    <string name="show_as_list">Показать списком</string>
+    <string name="show_as_grid">Сеткой</string>
+    <string name="show_as_list">Списком</string>
     <string name="columns">Колонки</string>
     <string name="subtitle_style">Стиль субтитров</string>
     <string name="background_color">Цвет фона</string>
diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml
index 60e58b43..31b2b564 100644
--- a/app/src/main/res/values/strings.xml
+++ b/app/src/main/res/values/strings.xml
@@ -427,8 +427,8 @@
         <item>@string/force_disable</item>
     </string-array>
     <string name="view_options">View options</string>
-    <string name="show_as_grid">Show as grid</string>
-    <string name="show_as_list">Show as list</string>
+    <string name="show_as_grid">Grid view</string>
+    <string name="show_as_list">List view</string>
     <string name="columns">Columns</string>
     <string name="spacing">Spacing</string>
     <string name="aspect_ratio">Aspect Ratio</string>
-- 
2.55.0.windows.3

[damontecres]

I'm planning to pretty much remove PlaylistDetailsContent and replace it with CollectionFolderViewContent since CollectionFolderViewContent as a list with "show details" is very close to PlaylistDetailsContent. And I dislike the position of the buttons.

I hadn't thought about additional filter options, so feel free to propose a PR to add those.

[SergeiAK]

Thanks — that's cleaner than a second view to toggle between. The filters are up as #2105. They don't depend on which view shows the playlist: the values are collected in FilterOptionCache, and the flag is set both in PlaylistViewModel and in CollectionFolderViewModel for playlist items, so they'll keep working after the switch to CollectionFolderViewContent.

The Playlists tab in libraries and "Remove from playlist" in the grid can wait for your rework; I'll rebase them onto it once it lands, if you still want them.

[damontecres]

I've done the refactoring in #2113

"Remove from playlist" in the grid

This is implemented in #2113 just by how the code was refactored!