Feature: New PostList cards

[bdougie]

Type of feature

🍕 Feature

Current behavior

We are combing the list and grid views. Currently we have a list card view that lacks information and hides the vote button amongst data. We need to update this.

Suggested solution

1. Remove the list/grid toggle and place it with a list view only.
2. This change will support #202. The hot card section will be placed above the list view.

Link to figma

Additional context

password to figma is secretsauce

Code of Conduct

• [X] I agree to follow this project's Code of Conduct

Contributing Docs

• [X] I agree to follow this project's Contribution Docs

[eryc-cc]

When you click to "upvote":

[shamimbinnur]

@bdougie @pixelsbyeryc how many cards will be shown here as initially? Don't we need a button to load more cards? We will be fetching cards and showing up right in this section? Or will we send users to different routes/pages to show all the cards in there?

[eryc-cc]

@shamimbinnur In the conversations I had with @bdougie, we were going to work similarly to ProductHunt, it might make sense to keep fetching the cards as the user scrolls.

So we have 2 options:

1. They can search for a specific repo
2. They can browse the timeline of repos

Now, we have other questions:

• How will we order the repos every week? What's the criteria for them to show up at the top each week?
  • Is it new repos that are added?
  • Is it most liked that week?
  • Is it most requested/viewed?

[0-vortex]

We have the backend capable of producing pagination in the form of:

{
  "meta": {
    "page": 1,
    "take": 10,
    "itemCount": 6856,
    "pageCount": 686,
    "hasPreviousPage": false,
    "hasNextPage": true
  }
}

IMHO the most user friendly mechanism I envision is to create a top-fixed or bottom-padded client pagination, then add a function to click the next/prev page on scroll and advance the page without any invisible elements or the user being unable to quickly access filters.

Why not best of both worlds? 🍕

[shamimbinnur]

I can think infinite scrolling can be a barrier to reaching out to the next component below the "Post List" component. We may have to add more components(ex. footer) below that in the future.

[0-vortex]

I can think infinite scrolling can be a barrier to reaching out to the next component below the "Post List" component. We may have to add more components(ex. footer) below that in the future.

We can work around that by using a holy grail kind of layout and only scrolling the middle section. The more modern approach to that is https://layout.bradwoods.io but I am also happy to suggest old-school IE6 positioning techniques.

The pagination would act the same way, padding fixed spaced on top of the already padded body/footer space 🍕

[shamimbinnur]

242

[github-actions[bot]]

:tada: This issue has been resolved in version 2.16.0 :tada:

The release is available on:

• GitHub release
• ghcr.io container (@latest dist-tag)

Your semantic-release bot :package::rocket: