feat: Show nested document count on document list items on collection home

app/components/DocumentListItem.js

@@ -23,6 +23,7 @@ type Props = {|
   document: Document,
   highlight?: ?string,
   context?: ?string,
+  showNestedDocuments?: boolean,
   showCollection?: boolean,
   showPublished?: boolean,
   showPin?: boolean,
@@ -44,6 +45,7 @@ function DocumentListItem(props: Props) {
   const [menuOpen, setMenuOpen] = React.useState(false);
   const {
     document,
+    showNestedDocuments,
     showCollection,
     showPublished,
     showPin,
@@ -104,6 +106,7 @@ function DocumentListItem(props: Props) {
           document={document}
           showCollection={showCollection}
           showPublished={showPublished}
+          showNestedDocuments={showNestedDocuments}
           showLastViewed
         />
       </Content>

app/components/DocumentMeta.js

@@ -27,6 +27,7 @@ type Props = {|
   showCollection?: boolean,
   showPublished?: boolean,
   showLastViewed?: boolean,
+  showNestedDocuments?: boolean,
   document: Document,
   children: React.Node,
   to?: string,
@@ -36,6 +37,7 @@ function DocumentMeta({
   showPublished,
   showCollection,
   showLastViewed,
+  showNestedDocuments,
   document,
   children,
   to,
@@ -123,6 +125,10 @@ function DocumentMeta({
     );
   };
 
+  const nestedDocumentsCount = collection
+    ? collection.getDocumentChildren(document.id).length
+    : 0;
+
   return (
     <Container align="center" {...rest}>
       {updatedByMe ? t("You") : updatedBy.name}&nbsp;
@@ -135,6 +141,12 @@ function DocumentMeta({
           </strong>
         </span>
       )}
+      {showNestedDocuments && nestedDocumentsCount > 0 && (
+        <span>
+          &nbsp;&middot; {nestedDocumentsCount}{" "}
+          {t("nested document", { count: nestedDocumentsCount })}
+        </span>
+      )}
       &nbsp;{timeSinceNow()}
       {children}
     </Container>

app/components/PaginatedDocumentList.js

@@ -11,6 +11,7 @@ type Props = {|
   options?: Object,
   heading?: React.Node,
   empty?: React.Node,
+  showNestedDocuments?: boolean,
   showCollection?: boolean,
   showPublished?: boolean,
   showPin?: boolean,

app/scenes/Collection.js

@@ -352,6 +352,7 @@ class CollectionScene extends React.Component<Props> {
                         sort: collection.sort.field,
                         direction: "ASC",
                       }}
+                      showNestedDocuments
                       showPin
                     />
                   </Route>

app/scenes/Document/components/References.js

@@ -32,15 +32,15 @@ class References extends React.Component<Props> {
       : [];
 
     const showBacklinks = !!backlinks.length;
-    const showChildren = !!children.length;
+    const showNestedDocuments = !!children.length;
     const isBacklinksTab =
-      this.props.location.hash === "#backlinks" || !showChildren;
+      this.props.location.hash === "#backlinks" || !showNestedDocuments;
 
     return (
-      (showBacklinks || showChildren) && (
+      (showBacklinks || showNestedDocuments) && (
         <Fade>
           <Tabs>
-            {showChildren && (
+            {showNestedDocuments && (
               <Tab to="#children" isActive={() => !isBacklinksTab}>
                 Nested documents
               </Tab>

shared/i18n/locales/en_US/translation.json

@@ -23,6 +23,8 @@
   "Never viewed": "Never viewed",
   "Viewed": "Viewed",
   "in": "in",
+  "nested document": "nested document",
+  "nested document_plural": "nested documents",
   "Insert column after": "Insert column after",
   "Insert column before": "Insert column before",
   "Insert row after": "Insert row after",