Show more possibility in cell area in Bixby - bixby

Question

The user says: "Show me Chinese menu"
I have used cell area to show food items because this is the layout I wanted in my card (vertical and small image).
However, because I have more than 80 items to list down, is it possible that first I show the user ten items and then a "Show More..." button?
If the user clicks on the "Show More Button", either I should open the menu in a different result-view or list down the rest menu in the same page hiding the "Show More..." button.
I know image-list has the option but the image is little big compare to cell-area image and showing it horizontally, where I wanted it vertically.
Scenario 2:
User: where is Pizzahut in my area
in my detail page, bixby will show one store with image, below image will be the location with map, below that will be the list of menu. So three blocks into the results. first block is compound-card, second block is map-card and third block is cell-area. Now third block which is the menu has more than 20 items and i am listing it down. I want it to show like 5 items and one show more link and as soon as user click one the show more link, rest of the menu will drop there or I can redirect it to one new page with list of all the menu... whatever is possible.

Answer 1

For a large set of results, the best way would be for you to use navigation-mode.
navigation-mode {
read-many-and-next {
underflow-statement (This is the first page of results)
list-summary ("I have #{size(this)} results")
overflow-statement (That's all I have)
overflow-question (What would you like to do?)
next-page-question (Do you want the next page?)
page-size (10)
}
}
This ensures that you give the user a paginated view of your results so the user can consume them piecemeal rather than getting overwhelmed with 2 sets of results (first 10 and then the next 70).
Adding information to account for modified question
The highlights functionality would've worked in a simpler view but for your more complex view, I would recommend manually adding 5 iterations of menu items to display the first 5 items followed by a card with an on-click that pulls the whole menu and displays it in a separate result-view. I've added a code sample below with some placeholder concepts and actions.
Code sample:
single-line {
text {
style (Title_S)
value ("#{value(menu[0])}")
}
}
divider
single-line {
text {
style (Title_S)
value ("#{value(restaurant.menu[1])}")
}
}
divider
single-line {
text {
style (Title_S)
value ("#{value(restaurant.menu[2])}")
}
}
divider
single-line {
text {
style (Title_S)
value ("#{value(restaurant.menu[3])}")
}
}
divider
single-line {
text {
style (Title_S)
value ("#{value(restaurant.menu[4])}")
}
}
divider
cell-card {
slot2 {
content {
order (PrimarySecondary)
primary {
template ("See Full Menu")
}
}
}
on-click {
intent {
goal:GetFullMenu
value-set: RestaurantName ("#{value(restaurant.name)}")
}
}
}