Improve display of Top activities by type widget in dashboard

[joanagmaia]

Steps to achieve this:

1. Only show a preview of the Top 5 activities. If number of activities > 5, show "View all" button to display the remaining ones

2. If "View all" is clicked, open a Drawer component with a list of the first 20 activities. Below the title of the header, display the applied filters (time, platform, and channel (channel should only be added when this task C-2249 is completed))

3. If list of activities in drawer has > 20 activities, display a "Load more" button. If button is clicked, we should add 20 more results to it, until all activities are loaded.

Technical specs

• dashboard.cube.js should be updated in activityTypes method payload to Cube. You should add limit, offset to the payload to handle pagination. You should also add total: true, to that response retrieves total of results. This will be useful to add logic to check if View all button should be added or not. https://cube.dev/docs/guides/recipes/queries/pagination
• dashboard-activity-types.vue should be updated with the new "View all" button according to the pagination
• For the implementation of the drawer, use app-drawer component

[ShatilKhan]

Please assign this issue to me. I've done frontend contributions before

[joanagmaia]

Please assign this issue to me. I've done frontend contributions before

Sure 😄

[ShatilKhan]

Thanks @joanagmaia
Apologies for my delay, can you give some guidance on which files to work on?

[joanagmaia]

Thanks @joanagmaia Apologies for my delay, can you give some guidance on which files to work on?

Hey @ShatilKhan , did you check the technical specs on the issue description? It mentions which files to update. If you need any help setting the app locally let me know as well