Pagination-free UI: one single page with all data sources included

[Dentrax]

Currently, if we follow more than 4 data sources, we need to click next and prev buttons to traverse between pages. (just noticed we could not swipe pages using touchpad with 2-fingers) I thought that the overall UI would be way better if we have an option to toggle one single page with all data sources included feature. One of the caveats is that we might consider reducing the font size to fill all texts in. What do you think? It makes sense? What should we do to get rid of pagination (or at least make it a feature)?

[medyo]

I tried to handle the touchpad (2 fingers) but couldn't find an efficient solution, I'll give another try later.
Regarding your second suggestion, do you mean gathering all cards in 1 view (2 rows, 4 columns) or gathering the content of all theses sources in 1 view ?

[Dentrax]

Actually I mean something like: gathering all cards in 1 view (2 rows, 4 columns). But I'm not explicitly saying that way, since I'm not so sure which design will fit better in this case. Here some sample reference, not sure if this adds unnecessary complexity in UI. 🤷‍♂️ What's your thoughts?

[victor-duarte]

Tabs

Tab navigation where each tab is a data source and have normal scroll.

List

Use a list with all the content that can be filtered and sorted

[medyo]

Thanks @victor-duarte for the Mockups,

I think going with the Tabs layout is totally doable. It's all about making some UI changes, and we can even use it to display the article content later. We just need to add an extra column where users can pick the article they want to see, and when they click on it, it'll show up in the remaining space.

with the List layout, filtering by tags could be challenging. Some sources like Hacker News and Product Hunt don't even use tags, and even when they do, as in the case of Dev.to, the tags aren't always on point.

[victor-duarte]

No problem 👍🏻

@medyo, are you thinking like an email dashboard?

• Folders = data sources
• Emails = data
• Preview = data preview

[medyo]

No problem 👍🏻

@medyo, are you thinking like an email dashboard?

• Folders = data sources
• Emails = data
• Preview = data preview

Yes exactly, the idea is to allow users to read the favourite content without leaving hackertab

[victor-duarte]

Will work on a proof of concept this week and come back with any findings.

[victor-duarte]

hey @medyo ,
I was not able to find a way of handling previews due to permissions on source pages when using iframes, any thoughts on alternative to do this?

In the meantime, here is an option/mock on how the layout might look without the preview section

If we want to proceed with it, we could go into the details on what needs to be changed and updated, e.g:

• would dragging functionality be needed with this new layout
• what data can be shown by row.
• would the compact mode be needed

etc.

[medyo]

@victor-duarte As a start, this looks good. Is it a coded version or a mockup?

[younes-io]

@victor-duarte : Looks great! Any updates on this one?

[victor-duarte]

@younes-io, no.

Displaying previews (see thread) was not possible due to different domains and I did not got confirmation if this was an issue so I did not pursue.

Will work this week on a PR with the changes of the last screenshot (sidebar + list of sources).

[victor-duarte]

@medyo, can you look into the draft PR. There is still work to do in regards to cleaning the cards, but before keep working on it, it would be good to know if its worth keep going down this direction.

Let me know if their is any questions in regards to the implementation details, but in a nutshell is removing the current behavior in large viewports and just re-position elements with css in large viewport.