Implement Recommendations

[jackyzy823]

UI looks like:

Desktop

Mobile:
1.toggle off

2.toggle on

TODO:
Should we limit numbers of recommendations in twitter api. or limit numbers in display (random pick) or just display them all?

[zedeus]

This feature is nice, but I'm having mixed feelings about it. I think some might see it as an anti-feature, Twitter trying to stuff "You might like" recommendations down the throat of users making the experience more "noisy", while it can also be a great way to discover similar accounts. You know what I mean? I feel like maybe it should be opt-in with a preference, and only show 3 with a "Show more" link at the bottom similar to tweet threads. I'd also like to call it "Similar accounts" or "Recommendations" for a more neutral wording.

A different issue is design. I'm quite happy with Nitter's profile layout, in particular my choice to make the profile "sticky" by default, so you can see what timeline you're browsing at all times. This does however mean there's a limit to how much stuff we can put on the left side before you run into issues. Here's how Twitter currently looks:

Instead of on the left side, they have the gallery, recommendations, and trends on the right-hand side. If the window gets too narrow, they simply hide everything instead of turning it into a mobile-friendly column like Nitter. One step towards a more "scalable" layout would be enabling the mobile view dropdowns for gallery and recommendations in desktop view, expanded by default instead of collapsed. In other words, the distinction between desktop and mobile for the sidebar dropdowns should be minimal, only using media queries to invert the behavior between mobile and desktop (unchecked checkbox should mean expanded on desktop and collapsed on mobile). That way you can just collapse the gallery if your screen isn't tall enough to see the recommendations. I would also like to be able to show trends as well (opt-in of course), so being able to collapse on desktop is a must. On that note it would be great to have a more generic way to create these "dropdown panels" for the profile side bar that can be reused between the gallery, this and upcoming trends, both in the view code and scss. You don't have to do this unless you really want to, I can take care of it after the PR.

So in short:

• "You might like" -> "Similar accounts"
• Add a new preference group called "Features", make one called similarAccounts off by default, add one called profileGallery on by default, and move infiniteScroll into the group
• Limit the amount of displayed accounts to 3
• Add a "Show more" link which opens a separate page with every fetched account shown (I consider this out of scope for this PR and not a necessity by any means, but it would be nice and not that hard, we already have an account list view used for search and list members)

[zedeus]

Typo

[jackyzy823]

I feel like maybe it should be opt-in with a preference

ok. I will make it a preference.

• Limit the amount of displayed accounts to 3

I'd like to fetch all and then random show user 3 of them. It is just because I hate that when i click show more in twitter page, they ask me to login :-(

it will take some days to finish these all.

[zedeus]

Picking 3 by random could work, but I wonder if they rank/sort the list somehow, which would result in worse recommendations of course. Do you know? Looking at some API responses and manually assessing how relevant the results are for a few examples should be enough to get a feel for how they do it.

[zedeus]

Due to a semi-emergency caused by Twitter I had to make a lot of changes, especially in routes/timeline.nim. Let me know if you need help rebasing, I see quite a lot of conflicts.