Coach Bookmarks Follow-Up

[nucleogenesis]

We will need to do some follow-up work to complete the Coach's Bookmarks work done in #8272

In summary, the following will need to be decided upon and then implemented.

Routing During Quiz/Lesson Creation

Will need to discuss with @jtamiace for decisions around how best to approach this.

An illustration of the flow:

1. Quiz / lesson creation
2. [Full-screen modal] -> Select resources for quiz / lesson. (User clicks a card linking to their bookmarks).
3. [?? Another full-screen sub-modal?] -> Lists the user's bookmarked resources. (User clicks to navigate a bookmarked topic).
4. [?? The same full-screen modal as before?]

At that 4th step it is unclear how the navigation should work - however it seems like it would be best to use smart Breadcrumbs which shows the user where they have been in order to get where they are, provides a way to click back to a previous page, where the root is always going to be the item 2 above - the "Manage resources" page.

So breadcrumbs can go like:

Manage resources for <quiz> > Bookmarks > Topic A > Subtopic

or

Manage resources for <lesson> > Topic B > Subtopic

The browser back will go back one step in the breadcrumbs.

I think this covers a fairly reasonable navigation UX but may be missing something. Any additional thoughts are much appreciated.

Paginating bookmarks

We need to paginate the list of bookmarks. Note Jessica's comment here with the show more design.

API Refactor?

There are two contexts on the front-end where we want bookmarks.

1. A user viewing their own bookmarks.

In this case, we really only care about the associated content nodes. A Bookmark is just a record connecting a user to content and we cannot display anything useful from it so it may be worthwhile to update the Bookmarks API such that it has endpoints or an optional flag that will let the backend create an optimized query for the required content nodes. This may also simplify pagination - so the frontend can just ask /api/bookmarks?contentNodes=true or whatever and not have to process a list of Bookmarks in order to make a second /api/contentnode request for the data we actually need to display to the user.

2. A user viewing any number of content nodes and needing to see if it is currently bookmarked (and then being able to toggle the bookmarked status).

In this context, we only need to know which of the currently viewed resources are or aren't bookmarked by this user.

Personally, I think that storing a user's bookmarks in the core Vuex store in their own little namespaced module might be a good path forward but definitely open to any other approach.

In any case, the handlers and code that handle content node display will need to be adjusted to also allow toggling bookmarked status. I think, again, a vuex module is a good candidate for this.

Noting that this is all a sort of subtask to #8209 and that task depends on this.

[nucleogenesis]

@jtamiace has some new designs relevant to this in Figma - I will keep this issue open to avoid letting it fall through the cracks but may end up closing it if "revising the coach reports" becomes a separate project as I'm sure it will.