google · luizgrp · Jul 8, 2022 · Jul 8, 2022
diff --git a/media-ui/api/current.api b/media-ui/api/current.api
@@ -278,6 +278,29 @@ package com.google.android.horologist.media.ui.screens.browse {
 
 }
 
+package com.google.android.horologist.media.ui.screens.playlist {
+
+  public final class PlaylistScreenKt {
+    method @androidx.compose.runtime.Composable @com.google.android.horologist.media.ui.ExperimentalHorologistMediaUiApi public static void PlaylistScreen(com.google.android.horologist.media.ui.screens.playlist.PlaylistScreenState playlistScreenState, kotlin.jvm.functions.Function1<? super com.google.android.horologist.media.ui.state.model.PlaylistUiModel,kotlin.Unit> onPlaylistItemClick, androidx.compose.ui.focus.FocusRequester focusRequester, androidx.wear.compose.material.ScalingLazyListState scalingLazyListState, optional androidx.compose.ui.Modifier modifier, optional androidx.compose.ui.graphics.painter.Painter? playlistItemArtworkPlaceholder);
+  }
+
+  @com.google.android.horologist.media.ui.ExperimentalHorologistMediaUiApi public abstract sealed class PlaylistScreenState {
+  }
+
+  public static final class PlaylistScreenState.Loaded extends com.google.android.horologist.media.ui.screens.playlist.PlaylistScreenState {
+    ctor public PlaylistScreenState.Loaded(java.util.List<com.google.android.horologist.media.ui.state.model.PlaylistUiModel> playlistList);
+    method public java.util.List<com.google.android.horologist.media.ui.state.model.PlaylistUiModel> component1();
+    method public com.google.android.horologist.media.ui.screens.playlist.PlaylistScreenState.Loaded copy(java.util.List<com.google.android.horologist.media.ui.state.model.PlaylistUiModel> playlistList);
+    method public java.util.List<com.google.android.horologist.media.ui.state.model.PlaylistUiModel> getPlaylistList();
+    property public final java.util.List<com.google.android.horologist.media.ui.state.model.PlaylistUiModel> playlistList;
+  }
+
+  public static final class PlaylistScreenState.Loading extends com.google.android.horologist.media.ui.screens.playlist.PlaylistScreenState {
+    field public static final com.google.android.horologist.media.ui.screens.playlist.PlaylistScreenState.Loading INSTANCE;
+  }
+
+}
+
 package com.google.android.horologist.media.ui.semantics {
 
   @com.google.android.horologist.media.ui.ExperimentalHorologistMediaUiApi public final class CustomSemanticsProperties {
@@ -424,31 +447,25 @@ package com.google.android.horologist.media.ui.state.mapper {
 package com.google.android.horologist.media.ui.state.model {
 
   @com.google.android.horologist.media.ui.ExperimentalHorologistMediaUiApi public abstract sealed class DownloadPlaylistUiModel {
-    method public String? getArtworkUri();
-    method public String getTitle();
-    property public String? artworkUri;
-    property public String title;
+    method public com.google.android.horologist.media.ui.state.model.PlaylistUiModel getPlaylistUiModel();
+    property public com.google.android.horologist.media.ui.state.model.PlaylistUiModel playlistUiModel;
   }
 
   public static final class DownloadPlaylistUiModel.Completed extends com.google.android.horologist.media.ui.state.model.DownloadPlaylistUiModel {
-    ctor public DownloadPlaylistUiModel.Completed(String title, String? artworkUri);
-    method public String component1();
-    method public String? component2();
-    method public com.google.android.horologist.media.ui.state.model.DownloadPlaylistUiModel.Completed copy(String title, String? artworkUri);
-    property public String? artworkUri;
-    property public String title;
+    ctor public DownloadPlaylistUiModel.Completed(com.google.android.horologist.media.ui.state.model.PlaylistUiModel playlistUiModel);
+    method public com.google.android.horologist.media.ui.state.model.PlaylistUiModel component1();
+    method public com.google.android.horologist.media.ui.state.model.DownloadPlaylistUiModel.Completed copy(com.google.android.horologist.media.ui.state.model.PlaylistUiModel playlistUiModel);
+    property public com.google.android.horologist.media.ui.state.model.PlaylistUiModel playlistUiModel;
   }
 
   public static final class DownloadPlaylistUiModel.InProgress extends com.google.android.horologist.media.ui.state.model.DownloadPlaylistUiModel {
-    ctor public DownloadPlaylistUiModel.InProgress(String title, String? artworkUri, int percentage);
-    method public String component1();
-    method public String? component2();
-    method public int component3();
-    method public com.google.android.horologist.media.ui.state.model.DownloadPlaylistUiModel.InProgress copy(String title, String? artworkUri, int percentage);
+    ctor public DownloadPlaylistUiModel.InProgress(com.google.android.horologist.media.ui.state.model.PlaylistUiModel playlistUiModel, int percentage);
+    method public com.google.android.horologist.media.ui.state.model.PlaylistUiModel component1();
+    method public int component2();
+    method public com.google.android.horologist.media.ui.state.model.DownloadPlaylistUiModel.InProgress copy(com.google.android.horologist.media.ui.state.model.PlaylistUiModel playlistUiModel, int percentage);
     method public int getPercentage();
-    property public String? artworkUri;
     property public final int percentage;
-    property public String title;
+    property public com.google.android.horologist.media.ui.state.model.PlaylistUiModel playlistUiModel;
   }
 
   @com.google.android.horologist.media.ui.ExperimentalHorologistMediaUiApi public final class MediaItemUiModel {
@@ -468,6 +485,17 @@ package com.google.android.horologist.media.ui.state.model {
     property public final String? title;
   }
 
+  public final class PlaylistUiModel {
+    ctor public PlaylistUiModel(String title, optional String? artworkUri);
+    method public String component1();
+    method public String? component2();
+    method public com.google.android.horologist.media.ui.state.model.PlaylistUiModel copy(String title, String? artworkUri);
+    method public String? getArtworkUri();
+    method public String getTitle();
+    property public final String? artworkUri;
+    property public final String title;
+  }
+
   @com.google.android.horologist.media.ui.ExperimentalHorologistMediaUiApi public final class TrackPositionUiModel {
     ctor public TrackPositionUiModel(long current, long duration, float percent);
     method public long component1();

diff --git a/...debug/java/com/google/android/horologist/media/ui/components/base/SecondaryChipPreview.kt b/...debug/java/com/google/android/horologist/media/ui/components/base/SecondaryChipPreview.kt
@@ -32,7 +32,7 @@ import com.google.android.horologist.media.ui.utils.rememberVectorPainter
 )
 @Composable
 fun SecondaryChipPreview() {
-    SecondaryChip(primaryLabel = "Primary label", onClick = { })
+    SecondaryChip(label = "Primary label", onClick = { })
 }
 
 @Preview(
@@ -43,7 +43,7 @@ fun SecondaryChipPreview() {
 @Composable
 fun SecondaryChipPreviewWithSecondaryLabel() {
     SecondaryChip(
-        primaryLabel = "Primary label",
+        label = "Primary label",
         onClick = { },
         secondaryLabel = "Secondary label",
     )
@@ -57,7 +57,7 @@ fun SecondaryChipPreviewWithSecondaryLabel() {
 @Composable
 fun SecondaryChipPreviewWithIcon() {
     SecondaryChip(
-        primaryLabel = "Primary label",
+        label = "Primary label",
         onClick = { },
         icon = "iconUri",
         placeholder = rememberVectorPainter(
@@ -75,7 +75,7 @@ fun SecondaryChipPreviewWithIcon() {
 @Composable
 fun SecondaryChipPreviewWithImageVectorAsIcon() {
     SecondaryChip(
-        primaryLabel = "Primary label",
+        label = "Primary label",
         onClick = { },
         icon = Icons.Default.Add
     )
@@ -89,7 +89,7 @@ fun SecondaryChipPreviewWithImageVectorAsIcon() {
 @Composable
 fun SecondaryChipPreviewWithLargeIcon() {
     SecondaryChip(
-        primaryLabel = "Primary label",
+        label = "Primary label",
         onClick = { },
         icon = "iconUri",
         largeIcon = true,
@@ -108,7 +108,7 @@ fun SecondaryChipPreviewWithLargeIcon() {
 @Composable
 fun SecondaryChipPreviewWithSecondaryLabelAndIcon() {
     SecondaryChip(
-        primaryLabel = "Primary label",
+        label = "Primary label",
         onClick = { },
         secondaryLabel = "Secondary label",
         icon = "iconUri",
@@ -127,7 +127,7 @@ fun SecondaryChipPreviewWithSecondaryLabelAndIcon() {
 @Composable
 fun SecondaryChipPreviewWithSecondaryLabelAndLargeIcon() {
     SecondaryChip(
-        primaryLabel = "Primary label",
+        label = "Primary label",
         onClick = { },
         secondaryLabel = "Secondary label",
         icon = "iconUri",
@@ -147,7 +147,7 @@ fun SecondaryChipPreviewWithSecondaryLabelAndLargeIcon() {
 @Composable
 fun SecondaryChipPreviewDisabled() {
     SecondaryChip(
-        primaryLabel = "Primary label",
+        label = "Primary label",
         onClick = { },
         secondaryLabel = "Secondary label",
         icon = "iconUri",
@@ -167,7 +167,7 @@ fun SecondaryChipPreviewDisabled() {
 @Composable
 fun SecondaryChipPreviewWithLongText() {
     SecondaryChip(
-        primaryLabel = "Primary label very very very very very very very very very very very very very very very very very long text",
+        label = "Primary label very very very very very very very very very very very very very very very very very long text",
         onClick = { }
     )
 }
@@ -180,7 +180,7 @@ fun SecondaryChipPreviewWithLongText() {
 @Composable
 fun SecondaryChipPreviewWithSecondaryLabelAndLongText() {
     SecondaryChip(
-        primaryLabel = "Primary label very very very very very very very very long text",
+        label = "Primary label very very very very very very very very long text",
         onClick = { },
         secondaryLabel = "Secondary label very very very very very very very very very long text",
         icon = "iconUri",
@@ -199,7 +199,7 @@ fun SecondaryChipPreviewWithSecondaryLabelAndLongText() {
 @Composable
 fun SecondaryChipPreviewUsingSmallIcon() {
     SecondaryChip(
-        primaryLabel = "Primary label",
+        label = "Primary label",
         onClick = { },
         icon = "iconUri",
         placeholder = rememberVectorPainter(
@@ -217,7 +217,7 @@ fun SecondaryChipPreviewUsingSmallIcon() {
 @Composable
 fun SecondaryChipPreviewWithLargeIconUsingSmallIcon() {
     SecondaryChip(
-        primaryLabel = "Primary label",
+        label = "Primary label",
         onClick = { },
         icon = "iconUri",
         largeIcon = true,
@@ -236,7 +236,7 @@ fun SecondaryChipPreviewWithLargeIconUsingSmallIcon() {
 @Composable
 fun SecondaryChipPreviewUsingExtraLargeIcon() {
     SecondaryChip(
-        primaryLabel = "Primary label",
+        label = "Primary label",
         onClick = { },
         icon = "iconUri",
         placeholder = rememberVectorPainter(
@@ -254,7 +254,7 @@ fun SecondaryChipPreviewUsingExtraLargeIcon() {
 @Composable
 fun SecondaryChipPreviewWithLargeIconUsingExtraLargeIcon() {
     SecondaryChip(
-        primaryLabel = "Primary label",
+        label = "Primary label",
         onClick = { },
         icon = "iconUri",
         largeIcon = true,

diff --git a/...c/debug/java/com/google/android/horologist/media/ui/screens/browse/BrowseScreenPreview.kt b/...c/debug/java/com/google/android/horologist/media/ui/screens/browse/BrowseScreenPreview.kt
@@ -27,6 +27,7 @@ import androidx.wear.compose.material.rememberScalingLazyListState
 import com.google.android.horologist.compose.tools.WearPreviewDevices
 import com.google.android.horologist.media.ui.ExperimentalHorologistMediaUiApi
 import com.google.android.horologist.media.ui.state.model.DownloadPlaylistUiModel
+import com.google.android.horologist.media.ui.state.model.PlaylistUiModel
 import com.google.android.horologist.media.ui.uamp.UampTheme
 import com.google.android.horologist.media.ui.utils.rememberVectorPainter
 
@@ -95,16 +96,20 @@ fun BrowseScreenPreviewUampTheme() {
 private val downloadList = buildList {
     add(
         DownloadPlaylistUiModel.InProgress(
-            title = "Rock Classics",
-            artworkUri = "https://www.example.com/album1.png",
+            PlaylistUiModel(
+                title = "Rock Classics",
+                artworkUri = "https://www.example.com/album1.png",
+            ),
             percentage = 15,
         )
     )
 
     add(
         DownloadPlaylistUiModel.Completed(
-            title = "Pop Punk",
-            artworkUri = "https://www.example.com/album2.png"
+            PlaylistUiModel(
+                title = "Pop Punk",
+                artworkUri = "https://www.example.com/album2.png"
+            )
         )
     )
 }
diff --git a/...bug/java/com/google/android/horologist/media/ui/screens/playlist/PlaylistScreenPreview.kt b/...bug/java/com/google/android/horologist/media/ui/screens/playlist/PlaylistScreenPreview.kt
@@ -0,0 +1,71 @@
+/*
+ * Copyright 2022 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+@file:OptIn(ExperimentalHorologistMediaUiApi::class)
+
+package com.google.android.horologist.media.ui.screens.playlist
+
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.FeaturedPlayList
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.focus.FocusRequester
+import androidx.compose.ui.graphics.Color
+import androidx.wear.compose.material.rememberScalingLazyListState
+import com.google.android.horologist.compose.tools.WearPreviewDevices
+import com.google.android.horologist.media.ui.ExperimentalHorologistMediaUiApi
+import com.google.android.horologist.media.ui.state.model.PlaylistUiModel
+import com.google.android.horologist.media.ui.utils.rememberVectorPainter
+
+@WearPreviewDevices
+@Composable
+fun PlaylistScreenPreview() {
+    PlaylistScreen(
+        playlistScreenState = PlaylistScreenState.Loaded(
+            buildList {
+                add(
+                    PlaylistUiModel(
+                        title = "Rock Classics",
+                        artworkUri = "https://www.example.com/album1.png",
+                    )
+                )
+                add(
+                    PlaylistUiModel(
+                        title = "Pop Punk",
+                        artworkUri = "https://www.example.com/album2.png"
+                    )
+                )
+            }
+        ),
+        onPlaylistItemClick = { },
+        focusRequester = FocusRequester(),
+        scalingLazyListState = rememberScalingLazyListState(),
+        playlistItemArtworkPlaceholder = rememberVectorPainter(
+            image = Icons.Default.FeaturedPlayList,
+            tintColor = Color.Green,
+        )
+    )
+}
+
+@WearPreviewDevices
+@Composable
+fun PlaylistScreenPreviewLoading() {
+    PlaylistScreen(
+        playlistScreenState = PlaylistScreenState.Loading,
+        onPlaylistItemClick = { },
+        focusRequester = FocusRequester(),
+        scalingLazyListState = rememberScalingLazyListState(),
+    )
+}
diff --git a/...-ui/src/main/java/com/google/android/horologist/media/ui/components/base/SecondaryChip.kt b/...-ui/src/main/java/com/google/android/horologist/media/ui/components/base/SecondaryChip.kt
@@ -45,7 +45,7 @@ import coil.compose.rememberAsyncImagePainter
  */
 @Composable
 internal fun SecondaryChip(
-    primaryLabel: String,
+    label: String,
     onClick: () -> Unit,
     modifier: Modifier = Modifier,
     secondaryLabel: String? = null,
@@ -57,10 +57,10 @@ internal fun SecondaryChip(
     val hasSecondaryLabel = secondaryLabel != null
     val hasIcon = icon != null
 
-    val primaryLabelParam: (@Composable RowScope.() -> Unit) =
+    val labelParam: (@Composable RowScope.() -> Unit) =
         {
             Text(
-                text = primaryLabel,
+                text = label,
                 modifier = Modifier.fillMaxWidth(),
                 textAlign = if (hasSecondaryLabel || hasIcon) TextAlign.Left else TextAlign.Center,
                 overflow = TextOverflow.Ellipsis,
@@ -115,7 +115,7 @@ internal fun SecondaryChip(
         }
 
     Chip(
-        label = primaryLabelParam,
+        label = labelParam,
         onClick = onClick,
         modifier = modifier.fillMaxWidth(),
         secondaryLabel = secondaryLabelParam,