Frontend Development Roadmap

Natively
1

Hey all!

I guess a few of you might wonder what’s going on with the Natively frontend development :sweat_smile: I’ve been a bit silent up to now, but I thought I should give y’all my planned roadmap and what’s going on behind the scenes.

Trigger Warning: This thread contains a fair share of technical terms - read at your own risk :rofl: Feel free to ignore all the tech speak and just read the general message if you like.

Current State of the Union

As it stands, the frontend is currently split up between two technologies, one is django-generated pages, each with a small React app that gets the data from the django page, but there is no frontend-side data storage (e.g. Redux) and those apps are running in isolation, being unmounted as soon as the page is switched.
The other technology is next.js (maybe some of you remember Brandon’s big overhaul some time ago - that’s when next.js entered the stage).

Plans for the Future

I think Natively is unnecessarily being restricted by this architecture as data is not remembered in the frontend between pages (if you e.g. go to some page, change some settings, go to another page and return to the first one, you have to change the same settings all over again), and each page load contains all the data the page needs, thus different pages who share data needlessly load the same data over and over again. Therefore, my plan is to turn Natively into a Single-Page Application backed by a Redux store. This way, data that is loaded once can be reused on other pages as well. [Disclaimer: I know this is not 100% true - e.g. the browsing mode will probably not keep all the loaded data in the frontend if you browse hundreds of media :sweat_smile: But I hope you get the idea.]

Currently Ongoing Work

Alright, you may think, while Brandon and Mathew were busy cleaning up data, fixing bugs and doing a hundred other useful things, what has Nicole been up to during the past three weeks? – I have been busy as well, it’s just that unfortunately my work is currently not yet visible. I’m working on transforming the Dashboard page into an SPA, and I must say it’s coming along nicely! It’s just a lot more dialogs than I had envisioned :rofl: so it will take a bit of time until it’s done. I’m also laying the foundations for the data store at the same time, plus transforming the code to TypeScript, adding some tests here and there (but that’s not my main focus right now – it will become more important once the first rough transformation is done).

What can you do to help?

I already feel everybody is currently helping so much by reviving the discussions around critical items - thank you all! :+1: I know there are the bug reports and feature requests waiting for us, but sometimes an urgent discussion is what will really push us into action (see the dreaded spoiler bug :rofl:). So please keep them coming!

At the moment I would like to know your gripes with the Dashboard (as that’s what I’m focusing on at the moment). If there is any bug report or feature request I might have overlooked, please drop a link or write a comment in this thread to bring it to my attention. I can’t promise we will fix it soon, but we’d like to know, at the very least.

Also, once the Dashboard page is nearing completion, I might want to reach out to a few daredevils who would like to give it a thorough whirl, unearthing unexpected behaviour due to the new architecture. If you are interested in being a beta tester, please let me know here as well!

And with that , let me have a look into the next component to transform :waving_hand:

24 Likes
2

Lovely update and thank you, I’m excited for everything that’s planned.

The only gripe I have with the Dashboard is that the Forum links don’t lead me to the latest post (instead they always go to the first post), but I don’t know if that even belongs to the things you’re working on.

9 Likes
3

Dashboard gripe: in the activity feed it doesn’t always remember your filter settings. For example, if you set it to “global feed, reviews only” the list correctly adjusts to only show the “X wrote a review for Y” items. But if you click through to read the review and then use the browser back button to return to the list, sometimes it remembers that you’re only looking at “review” items, but sometimes it resets to the default “show everything” view.

But on the other hand I only notice that because I’m using it as a workaround for a missing feature, which is that I’d like a page with a chronological list of reviews for all items by anybody, so I could read them by scrolling through rather than having to click through links for each entry in the activity feed.

10 Likes
4

Maybe too shitsurei specific dashboard gripe: going to a page in another Natively language takes you to that language dashboard forever.. sometimes I want to follow a link to a book from the forums, and then I’m stuck in that language until I manually change back. I’d love a “primary language” that it reverts back to unless I personally hit the language toggle.

14 Likes
5

Oh yes, I’ve been bitten by that one too: “wait, why is my dashboard showing me an empty page for my nonexistent German reading activity?”.

7 Likes
6

Not bugs but requests for the activity feed:

  • Collapsing “marked as owned” and “wishlisted” books into a single dialogue. Right now, if someone wishlists 15 books, it shows all 15 in the activity feed. I’d like something like “so and so marked xyz book and 14 others as owned”
  • Or, honestly, I wouldn’t mind if both of these were removed from the activity feed, but maybe other people like them.
  • Like button: I want to be able to “like” activity feed updates and show my support for what people are reading :pleading_face:
  • I also like pm’s suggestion for a separate filter for reviews.
12 Likes
7

+1 to all of these. In particular I would like to be able to mute wishlists, as I’m only interested in what people are actually reading.

This isn’t really a dashboard thing, but it’s always bugged me that my dashboard shows percentage read but I can’t see that information on the actual book entry page itself…

11 Likes
8

Oh you lovely people! That’s exactly what I needed :smiling_cat_with_heart_eyes:

@Pashmina not sure how much control I have over the forum links but I’ll keep this in mind
@pm filter settings are a big issue for me and I hope I will get around to fixing them all

You mean like one massive page with all the texts? Wowow that’s an interesting idea!

@shitsurei @pm there are some shenanigans going on around the language switching, this is not the only place where strange things happen. I will handle language switching a bit differently in the new frontend so I hope some of them will dissolve automatically. Interesting idea with the “primary language” - will think about it.

@soggyboy if there were a more fine-grained filter settings dialogue (where you can select and deselect individual activity entry types) would that go in the right direction for you (and @Jintor ) ?

@Jintor I will remember the percentage issue for later ^^

9 Likes
9

Does the “Frontend” also include “Backend” for future Librarian Role / Databse collaborators? :sweat_smile:

I’m guessing right now, a lot of things are dealt directly with the database or ugly interfaces not intended to be seen by anyone else?

5 Likes
10

Hm I must confess that goes beyond my current horizon :rofl:

For the time being, I would like to focus on the part of the system that’s visible for all users, and I don’t feel I will get bored any time soon :melting_face:

6 Likes
11

My only complaint about the dashboard is a broader complaint about the dark theme in general. Not many glaring whites on the dashboard (thankfully), but the color choices and contrast generally need to be improved. I’m sure that will wait for a general theming overhaul though. :slight_smile:

4 Likes
12
  1. Can we have more rows for the reading/listening in progress rather than horizontal scroll? Maybe some sort of flexbox with wrap layout?
  2. Maybe unify the “4 day” days read widget from the dashboard with the calendar month widget from the activity page (i.e. clicking “see all” expands it in place rather than navigates to another page?)
8 Likes
13

My dashboard gripe is kind of similar to this re: the filters on the activity feed. The books/videos filters for the dashboard activity feed will reset any time you visit the activity feed on someone’s user profile. I always just have my dashboard activity feed set to books, but if I look at my own profile’s activity feed or other user, that feed’s filter is set to everything by default, and then that feed’s filter setting overwrites the dashboard filter, so the dashboard activity feed also shows everything (or whatever filter I selected last on the user’s activity feed).

A just-nice-to-have would be to have the currently-reading and currently-watching widgets always visible, even if they are empty (or to be able to configure which widgets are visible in account settings). It’s small, but being able to always access “My books” from the dashboard widget would be one less click through a menu if I’m starting something new while my currently-reading is empty, instead of having that widget disappear when I finish a book.

6 Likes
14

Yeah, that would be fine so I could deselect activity types I don’t want. I still think collapsing the ‘marked as owned’ and ‘wishlist’ types would be good, though.

5 Likes
15

Only that dark mode isn’t a profile setting and goes away when logging into a fresh browser.

Oh but I also think an “everything” dashboard view that has my currently reading aggragted for all my languages would be convenient. Not that I’ve started reading anything but textbooks in Korean yet, but the ease of updating would be nice.

6 Likes
16

til there’s a different experience if you finish all your books/shows :rofl:

7 Likes
17

Oh this would be great!! +1

I’m fine keeping all of the activity content in my feed, but I’d also love to collapse owned/read/wishlisted for 2+ items in a short period of time. I add read there because new users will sometimes come in and then add everything they’ve read all at once and it had the same issue of spamming the feed for a while.. I imagine that there aren’t a lot of times people are marking a bunch of things as read all at once unless they’re filling out a newish profile.

8 Likes
18

not sure if it was already mentioned but in the data manager sometimes when books don’t always update or need to manually change things, the data sort is by date or page but you always have to scroll down to the bottom to edit the most recent… adding some alt sorts for ascending/descending would be helpful (at least for me)

one other thing, after doing that edit the most recent page update so say I goofed and the page on the “update” doesn’t always align with the data manager after changing…for example say you goofed and put in you read to say page 182 but meant to put in page 152… then go to the data manager and fix the entry but then going back to the update and it still shows 182 … silly minor annoyances (not really bugs persay but not ideal)..

one other minor thing is I’m often on a laptop and only see 4.5 or so in a single browser window for the activity feed. shouldn’t be too small but, could have an option for a narrow/compact view and maybe reduce the height by 20-30% or so… and be able to see more of the activity feed …

not sure if any of that makes sense but… the only minor things that bug me…
otherwise tbh this dashboard as it is, has a nice and clean feeling and hoping the improvements keep it clean and tidy …

curious what the beta will look like :eyes:

5 Likes
19

Thanks for sharing your roadmap, it’s cool to hear what you’ve got planned!

I think Natively is unnecessarily being restricted by this architecture as data is not remembered in the frontend between pages (if you e.g. go to some page, change some settings, go to another page and return to the first one, you have to change the same settings all over again)

Just out of interest, which settings do you mean? I haven’t noticed this to be an issue but maybe I’m misunderstanding the problem :slight_smile: Depending on what kind of settings we’re talking about I was wondering if they could just be part of the URL params.

each page load contains all the data the page needs, thus different pages who share data needlessly load the same data over and over again. Therefore, my plan is to turn Natively into a Single-Page Application backed by a Redux store

Do you feel it’s causing noticeable performance issues? I wonder whether changing the way things are cached or even making more use of localStorage could help address some of those issues.

I’m happy to be a beta tester if you need more people to test things out!

7 Likes
20

Looking forward to a new and improved dashboard! :smile:

I have changed my own using a tampermonkey script to make better use of space and so i can see everything without having to scroll, as the current design seems optimised for mobile rather than desktop.

Also changed the navbar links:
Site: has all the links from the footer (about, contact, support, etc), plus a link to the book providers page.
Browse: links to browse page for books and video ordered by popular (default), newly added, recently reviewed, as well as “highlights” (to distinguish from regular browse) and lists
Add: add new resource, not sure how much others use the feature but I use it a lot
Forum: nice to have an easy way to access

The profile dropdown links have also been changed: profile, stats, my books, my videos, my lists, settings, logout.

I also think the Quick Stats box would be much more useful on the dashboard than hidden away in profile>activity as it currently is.

There are also these PRs:

And +1 to all the suggestions below! :+1:

9 Likes