Add userId to views response, closes #6014

app/components/DocumentViews.tsx

@@ -1,3 +1,4 @@
+import { compact } from "lodash";
 import sortBy from "lodash/sortBy";
 import { observer } from "mobx-react";
 import * as React from "react";
@@ -31,10 +32,10 @@ function DocumentViews({ document, isOpen }: Props) {
   const documentViews = views.inDocument(document.id);
   const sortedViews = sortBy(
     documentViews,
-    (view) => !presentIds.includes(view.user.id)
+    (view) => !presentIds.includes(view.userId)
   );
   const users = React.useMemo(
-    () => sortedViews.map((v) => v.user),
+    () => compact(sortedViews.map((v) => v.user)),
     [sortedViews]
   );
 
@@ -45,7 +46,7 @@ function DocumentViews({ document, isOpen }: Props) {
           aria-label={t("Viewers")}
           items={users}
           renderItem={(model: User) => {
-            const view = documentViews.find((v) => v.user.id === model.id);
+            const view = documentViews.find((v) => v.userId === model.id);
             const isPresent = presentIds.includes(model.id);
             const isEditing = editingIds.includes(model.id);
             const subtitle = isPresent

app/models/View.ts

@@ -16,8 +16,10 @@ class View extends Model {
   @observable
   count: number;
 
+  userId: string;
+
   @Relation(() => User)
-  user: User;
+  user?: User;
 
   @action
   touch() {

app/scenes/Document/components/DocumentMeta.tsx

@@ -35,7 +35,7 @@ function TitleDocumentMeta({
   const match = useRouteMatch();
   const documentViews = useObserver(() => views.inDocument(document.id));
   const totalViewers = documentViews.length;
-  const onlyYou = totalViewers === 1 && documentViews[0].user.id;
+  const onlyYou = totalViewers === 1 && documentViews[0].userId;
   const viewsLoadedOnMount = React.useRef(totalViewers > 0);
 
   const Wrapper = viewsLoadedOnMount.current ? React.Fragment : Fade;

app/stores/ViewsStore.ts

@@ -29,7 +29,7 @@ export default class ViewsStore extends Store<View> {
   touch(documentId: string, userId: string) {
     const view = find(
       this.orderedData,
-      (view) => view.documentId === documentId && view.user.id === userId
+      (view) => view.documentId === documentId && view.userId === userId
     );
     if (!view) {
       return;

server/presenters/view.ts

@@ -8,6 +8,7 @@ export default function presentView(view: View) {
     count: view.count,
     firstViewedAt: view.createdAt,
     lastViewedAt: view.updatedAt,
+    userId: view.userId,
     user: presentUser(view.user),
   };
 }