hackertab.dev icon indicating copy to clipboard operation
hackertab.dev copied to clipboard

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

Open Dentrax opened this issue 3 years ago • 12 comments

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)?

Dentrax avatar Nov 02 '21 09:11 Dentrax

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 ?

medyo avatar Nov 03 '21 11:11 medyo

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?

Screen Shot 2021-11-03 at 15 56 40

Dentrax avatar Nov 03 '21 12:11 Dentrax

Tabs

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

List

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

victor-duarte avatar Oct 14 '23 03:10 victor-duarte

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.

medyo avatar Oct 15 '23 11:10 medyo

No problem 👍🏻

@medyo, are you thinking like an email dashboard?

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

image

victor-duarte avatar Oct 15 '23 16:10 victor-duarte

No problem 👍🏻

@medyo, are you thinking like an email dashboard?

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

image

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

medyo avatar Oct 15 '23 16:10 medyo

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

victor-duarte avatar Oct 15 '23 23:10 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

image

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.

victor-duarte avatar Oct 17 '23 16:10 victor-duarte

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

medyo avatar Nov 22 '23 23:11 medyo

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

younes-io avatar Jan 09 '24 18:01 younes-io

@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 avatar Jan 22 '24 18:01 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.

victor-duarte avatar Mar 04 '24 17:03 victor-duarte