Feature/meditor 896 show collaborators for given document #63

benforshey · 2024-09-20T12:44:01Z

Purpose

This PR adds the ability to see collaborators on a given unique document (model name + document title).

Only users with edit privileges are considered collaborators.
Collaborators have UI for isActive (blue), hasBeenActive (dark grey), whose states are determined by globalThis.navigator.userActivation (docs). If neither are true (I opened the page but never interacted with it), a tertiary stale UI state (light grey) is shown.
Collaborators are removed after 10 minutes of inactivity (they are no longer have a UI element representing them on the page). E.g., I'm editing a page, but then leave it. My browser may put the tab into "sleep mode" and stop sending updates. After 10 minutes, I'd no longer be considered a collaborator, and the UI for my user as a collaborator would disappear. Another example: I leave the page open and my browser doesn't suspend the tab. Because it is still sending requests to the collaborator API, I will still be shown as a collaborator. Let's discuss this if there's something more optimal that we could do!
I used the title attribute to show additional information about each collaborator: full name, description of what the UI state means.
Even if you're not an editor for a given document, you will still see collaborators.
Four collaborators will be displayed at a time, with up to nine additional collaborators being put into a +n UI component. If there are more than nine additional collaborators, the UI component displays ++.
Collaborators are sorted by state, so active collaborators show up first, followed by inactive collaborators, followed by collaborators who haven't yet interacted with the page.

Testing

I owe some tests for this; I built this feature in the tail end of an IP sprint.

Run the existing tests to see if I've broken anything.
Find someone (or lots of people) who have edit privileges (maybe some who don't) and visit a document.

Visual Changes

I don't have a screenshot at the moment, but collaborators will show up in the document's header towards the right.

benforshey · 2024-09-20T13:09:51Z

packages/app/collaboration/adapters.ts

+import type { User } from 'auth/types'
+import type { Collaborator } from './types'
+
+export function adaptUserToCollaborator(


Receives a user and returns a collaborator, which is similar to a user, but has additional fields specifically for the collaboration feature.

benforshey · 2024-09-20T13:10:45Z

packages/app/collaboration/db.ts

+class CollaboratorsDb {
+    #COLLECTION = 'Collaborators'
+    #db: Db
+    #durationSeconds = 60 * 10


This is used to set the Time To Live (TTL) index for MongoDB.

benforshey · 2024-09-20T13:12:12Z

packages/app/collaboration/db.ts

+        })
+
+        if (!index) {
+            await this.#db.collection(this.#COLLECTION).createIndex(


This TTL index is created only if it doesn't already exist. It is based on the updatedAt field, which is a BSON ISODate.

benforshey · 2024-09-20T13:15:52Z

packages/app/collaboration/db.ts

+        documentTitle: string,
+        modelName: string
+    ) {
+        const query = { uid: collaborator.uid }


Since we query on the uid as our PK, each user may only be collaborating on one document at a time, which is recorded in documentModelTitle. If users have multiple document open, and each is sending an HTTP request to the API, I could see this getting weird. I should probably add (to the document page) something to check which tab is active...

Addressed in 97c6f5c.

benforshey · 2024-09-20T14:20:31Z

packages/app/components/document/document-header.tsx

 const DocumentHeader = ({
    activePanel = null,
    document = null,
    isJsonPanelOpen = false,
    model,
    version = null,
-    toggleJsonDiffer,
-    togglePanelOpen,
+    toggleJsonDiffer = () => {},


This is basically a bit of a guard against not knowing if we've passed these functions in. Since adding the PropsType above, I wasn't able to get the app to pass the production ESLint check / tsc check without marking the toggle fns optional. On the new document page, we now do not pass in these undefined functions.

benforshey · 2024-09-20T14:36:12Z

packages/app/pages/[modelName]/[documentTitle]/index.tsx

+                modelName
+            )
+
+            consecutiveErrorCount = error ? consecutiveErrorCount + 1 : 0


Only increment for consecutive errors.

benforshey · 2024-09-20T14:37:24Z

packages/app/pages/[modelName]/[documentTitle]/index.tsx

+
+            consecutiveErrorCount = error ? consecutiveErrorCount + 1 : 0
+
+            setClientCollaborators(filterActiveUser(collaborators, user))


filter returns an array, so if there are no active collaborators, we still keep the same data type.

benforshey · 2024-09-20T14:39:55Z

packages/app/pages/[modelName]/[documentTitle]/index.tsx

@@ -419,11 +475,18 @@ export async function getServerSideProps(ctx: NextPageContext) {
        decodeURIComponent(modelName.toString())
    )

+    // We only get the document collaborators here, because the browser's heuristics are needed to determine hasBeenActive and isActive.
+    const [collaboratorsError, collaborators] = await getDocumentCollaborators(


We can load the page with a list of collaborators, but don't poll the API to set collaborators or get collaborators unless the user's browser has the userActivation API. I suppose this could be worked around by adding an else to the userActivation check, where we could still get collaborators on long poll.

Addressed in 97c6f5c.

benforshey · 2024-09-20T14:43:03Z

packages/app/pages/api/collaboration/index.ts

I struggled a bit with the path for this API. Right now, it's collaborators/models/[modelName]/documents/[documentTitle]/index.ts Collaboration is it's own store, which seems appropriate (it's not the same as a document resource)...but if you think of a better path, please let me know! We do need both the modelName and documentTitle to generate a unique document. So, anyway, there are a handful of files like this that disable the constituent endpoints until we reach the only working endpoint at the full path.

benforshey · 2024-09-20T14:47:51Z

packages/app/pages/api/collaboration/models/[modelName]/documents/[documentTitle]/index.ts

+
+    switch (req.method) {
+        case 'GET': {
+            // Unlike most GET endpoints, unauthenticated users should not have access to an authenicated user's actions.


This is worth noting. Also, I'm noodling over how to differentiate between userCanAccessModel and these !user checks. I feel like we could rename those functions to be clearer about their restrictions.

…n an active tab

When a user opens a tab to collaborate but then closes the document without opening another, they should be removed fairly quickly.

benforshey added 3 commits September 19, 2024 14:16

refactor(types): remove unused type

50eee30

feat(collaboration): show collaborators on a given document

cf19c48

fix(types): address type issues from build

1fbc884

benforshey added the enhancement New feature or request label Sep 20, 2024

benforshey self-assigned this Sep 20, 2024

benforshey commented Sep 20, 2024

View reviewed changes

benforshey requested review from joncarlson and KrupaRami September 20, 2024 14:48

benforshey added 2 commits September 20, 2024 12:01

feat(collaboration): get collaborators regardless; only collaborate o…

97c6f5c

…n an active tab

fix(collaboration): use short timeout in DB index

8728a72

When a user opens a tab to collaborate but then closes the document without opening another, they should be removed fairly quickly.

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Feature/meditor 896 show collaborators for given document #63

Feature/meditor 896 show collaborators for given document #63

benforshey commented Sep 20, 2024

benforshey Sep 20, 2024

benforshey Sep 20, 2024

benforshey Sep 20, 2024

benforshey Sep 20, 2024

benforshey Sep 20, 2024

benforshey Sep 20, 2024

benforshey Sep 20, 2024

benforshey Sep 20, 2024

benforshey Sep 20, 2024

benforshey Sep 20, 2024

benforshey Sep 20, 2024

benforshey Sep 20, 2024


		consecutiveErrorCount = error ? consecutiveErrorCount + 1 : 0

		setClientCollaborators(filterActiveUser(collaborators, user))

Feature/meditor 896 show collaborators for given document #63

Are you sure you want to change the base?

Feature/meditor 896 show collaborators for given document #63

Conversation

benforshey commented Sep 20, 2024

Purpose

Testing

Visual Changes

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment