Repository: android/compose-samples
File: JetNews/app/src/main/java/com/example/jetnews/ui/interests/InterestsScreen.kt (Kotlin)

Code before:
                )
                TopicDivider(topicModifier)
            }
        }
    }
}

/**
 * Display a sectioned list of topics
 *
 * @param sections (state) topics to display, grouped by sections
 * @param selectedTopics (state) currently selected topics
 * @param onTopicSelect (event) request a topic+section selection be changed
 */
@Composable
private fun TabWithSections(
    windowSize: WindowSize,
    sections: List<InterestSection>,
    selectedTopics: Set<TopicSelection>,
    onTopicSelect: (TopicSelection) -> Unit
) {
    val columns = remember(windowSize) { if (windowSize == WindowSize.Compact) 1 else 2 }

    BoxWithConstraints {
        val itemMaxWidth = rememberItemMaxWidth(maxWidth, columns)
        val groupedSections = rememberSectionsGroupedInColumns(sections, columns)

        Row(
            horizontalArrangement = Arrangement.SpaceEvenly,
            modifier = Modifier.fillMaxSize()
        ) {
            groupedSections.forEach { sectionsInGroup ->
                LazyColumn(
                    modifier = Modifier
                        .widthIn(max = itemMaxWidth)
                        .padding(horizontal = if (columns > 1) 8.dp else 0.dp),
                    contentPadding = rememberContentPaddingForScreen(),
                ) {
                    sectionsInGroup.forEach { (section, topics) ->
                        item {
                            Text(
                                text = section,
                                modifier = Modifier
                                    .padding(16.dp)
                                    .semantics { heading() },
                                style = MaterialTheme.typography.subtitle1
                            )
                        }
                        items(topics) { topic ->
                            TopicItem(
                                itemTitle = topic,

Review comment (suggestion):
Just wanted to highlight this case:
We are keeping the `BoxWithConstraints`, because we want to base some decision around the local space available.
However, we are also making a decision based on the window size class, which we pass in.

Code after:
                    selected = selectedTopics.contains(topic),
                    onToggle = { onTopicSelect(topic) },
                    modifier = topicModifier
                )
                TopicDivider(topicModifier)
            }
        }
    }
}

/**
 * Display a sectioned list of topics
 *
 * @param windowSize (state) the current window size class
 * @param sections (state) topics to display, grouped by sections
 * @param selectedTopics (state) currently selected topics
 * @param onTopicSelect (event) request a topic+section selection be changed
 */
@Composable
private fun TabWithSections(
    windowSize: WindowSize,
    sections: List<InterestSection>,
    selectedTopics: Set<TopicSelection>,
    onTopicSelect: (TopicSelection) -> Unit
) {
    val columns = remember(windowSize) { if (windowSize == WindowSize.Compact) 1 else 2 }

    // TODO: Optimize by manually positioning items, rather than using BoxWithConstraints
    BoxWithConstraints {
        val itemMaxWidth = rememberItemMaxWidth(maxWidth, columns)
        val groupedSections = rememberSectionsGroupedInColumns(sections, columns)

        Row(
            horizontalArrangement = Arrangement.SpaceEvenly,
            modifier = Modifier.fillMaxSize()
        ) {
            groupedSections.forEach { sectionsInGroup ->
                LazyColumn(
                    modifier = Modifier
                        .widthIn(max = itemMaxWidth)
                        .padding(horizontal = if (columns > 1) 8.dp else 0.dp),
                    contentPadding = rememberContentPaddingForScreen(),
                ) {
                    sectionsInGroup.forEach { (section, topics) ->
                        item {
                            Text(
                                text = section,
                                modifier = Modifier
                                    .padding(16.dp)
                                    .semantics { heading() },
                                style = MaterialTheme.typography.subtitle1