Extract BookMark note

core/ui/src/main/kotlin/com/google/samples/apps/nowinandroid/core/ui/NewsResourceCard.kt

@@ -97,6 +97,7 @@ fun NewsResourceCardExpanded(
     onTopicClick: (String) -> Unit,
     modifier: Modifier = Modifier,
     onLongClick: (() -> Unit)? = null,
+    bookmarkNote: (@Composable () -> Unit)? = null,
 ) {
     val clickActionLabel = stringResource(R.string.core_ui_card_tap_action)
     val sharingLabel = stringResource(R.string.core_ui_feed_sharing)
@@ -156,6 +157,7 @@ fun NewsResourceCardExpanded(
                         Spacer(modifier = Modifier.weight(1f))
                         BookmarkButton(isBookmarked, onToggleBookmark)
                     }
+                    bookmarkNote?.invoke()
                     Spacer(modifier = Modifier.height(14.dp))
                     Row(verticalAlignment = Alignment.CenterVertically) {
                         if (!hasBeenViewed) {

feature/bookmarks/impl/src/main/kotlin/com/google/samples/apps/nowinandroid/feature/bookmarks/impl/BookmarksScreen.kt

@@ -323,52 +323,44 @@ private fun BookmarksGrid(
                         .padding(horizontal = 8.dp)
                         .animateItem(),
                 ) {
-                    Column {
-                        NewsResourceCardExpanded(
-                            userNewsResource = userNewsResource,
-                            isBookmarked = userNewsResource.isSaved,
-                            onClick = {
-                                if (isInSelectionMode) {
-                                    toggleSelection(userNewsResource.id)
-                                } else {
-                                    analyticsHelper.logNewsResourceOpened(
-                                        newsResourceId = userNewsResource.id,
-                                    )
-                                    launchCustomChromeTab(
-                                        context,
-                                        Uri.parse(userNewsResource.url),
-                                        backgroundColor,
-                                    )
-                                    onNewsResourceViewed(userNewsResource.id)
-                                }
-                            },
-                            onLongClick = {
-                                if (!isInSelectionMode) enterSelectionMode(userNewsResource.id)
-                            },
-                            hasBeenViewed = userNewsResource.hasBeenViewed,
-                            onToggleBookmark = { if (!isInSelectionMode) removeFromBookmarks(userNewsResource.id) },
-                            onTopicClick = onTopicClick,
-                        )
-                        val note = userNewsResource.bookmarkNote
-                        if (note != null) {
-                            Text(
-                                text = note,
-                                style = MaterialTheme.typography.bodySmall,
-                                color = MaterialTheme.colorScheme.onSurfaceVariant,
-                                maxLines = 1,
-                                overflow = TextOverflow.Ellipsis,
-                                modifier = Modifier
-                                    .fillMaxWidth()
-                                    .then(
-                                        if (!isInSelectionMode) {
-                                            Modifier.clickable { onEditNote(userNewsResource.id) }
-                                        } else {
-                                            Modifier
-                                        },
-                                    ),
+                    NewsResourceCardExpanded(
+                        userNewsResource = userNewsResource,
+                        isBookmarked = userNewsResource.isSaved,
+                        onClick = {
+                            if (isInSelectionMode) {
+                                toggleSelection(userNewsResource.id)
+                            } else {
+                                analyticsHelper.logNewsResourceOpened(
+                                    newsResourceId = userNewsResource.id,
+                                )
+                                launchCustomChromeTab(
+                                    context,
+                                    Uri.parse(userNewsResource.url),
+                                    backgroundColor,
+                                )
+                                onNewsResourceViewed(userNewsResource.id)
+                            }
+                        },
+                        onLongClick = {
+                            if (!isInSelectionMode) enterSelectionMode(userNewsResource.id)
+                        },
+                        hasBeenViewed = userNewsResource.hasBeenViewed,
+                        onToggleBookmark = {
+                            if (!isInSelectionMode) removeFromBookmarks(
+                                userNewsResource.id,
                             )
-                        }
-                    }
+                        },
+                        onTopicClick = onTopicClick,
+                        bookmarkNote = userNewsResource.bookmarkNote?.let { note ->
+                            {
+                                UserNote(
+                                    note = note,
+                                    isInSelectionMode = isInSelectionMode,
+                                    onEditNote = { onEditNote(userNewsResource.id) },
+                                )
+                            }
+                        },
+                    )
                     if (isInSelectionMode) {
                         Checkbox(
                             checked = userNewsResource.id in selectedIds,
@@ -403,6 +395,27 @@ private fun BookmarksGrid(
     }
 }
 
+@Composable
+private fun UserNote(
+    note: String,
+    isInSelectionMode: Boolean,
+    onEditNote: () -> Unit,
+) {
+    Text(
+        text = note,
+        style = MaterialTheme.typography.bodyMedium,
+        color = MaterialTheme.colorScheme.onPrimaryContainer,
+        maxLines = 1,
+        overflow = TextOverflow.Ellipsis,
+        modifier = Modifier
+            .fillMaxWidth()
+            .padding(vertical = 8.dp)
+            .then(
+                if (!isInSelectionMode) Modifier.clickable(onClick = onEditNote) else Modifier,
+            ),
+    )
+}
+
 @Composable
 private fun EmptyState(modifier: Modifier = Modifier) {
     Column(