feat(DocContextMenu): show word/character count

Author: sushantdhiman

src/cloud/components/DocPage/NewDocContextMenu.tsx

@@ -3,6 +3,8 @@ import {
   mdiAccountMultiple,
   mdiClockOutline,
   mdiContentSaveOutline,
+  mdiText,
+  mdiFormatLetterCase,
 } from '@mdi/js'
 import React, { useMemo, useState } from 'react'
 import Button from '../../../design/components/atoms/Button'
@@ -211,6 +213,26 @@ const DocContextMenu = ({
           }}
         />
       )}
+      {currentDoc.head && [
+        <MetadataContainerRow
+          key='word-count'
+          row={{
+            label: translate(lngKeys.WordCount),
+            type: 'content',
+            icon: mdiFormatLetterCase,
+            content: currentDoc.head.content.match(/\S+/g)?.length || 0,
+          }}
+        />,
+        <MetadataContainerRow
+          key='character-count'
+          row={{
+            label: translate(lngKeys.CharacterCount),
+            type: 'content',
+            icon: mdiText,
+            content: currentDoc.head.content.replace(/\s+/g, '').length || 0,
+          }}
+        />,
+      ]}
       <BackLinksList team={team} docs={backLinks} />
       <MetadataContainerBreak />
       <DocContextMenuActions

src/cloud/lib/i18n/enUS.ts

@@ -360,6 +360,8 @@ const enTranslation: TranslationSource = {
   [lngKeys.CreatedBy]: 'Created By',
   [lngKeys.UpdatedBy]: 'Updated By',
   [lngKeys.Contributors]: 'Contributors',
+  [lngKeys.WordCount]: 'Word Count',
+  [lngKeys.CharacterCount]: 'Character Count',
   [lngKeys.History]: 'History',
   [lngKeys.Share]: 'Share',
   [lngKeys.PublicSharing]: 'Public Sharing',

src/cloud/lib/i18n/types.ts

@@ -384,6 +384,8 @@ export enum lngKeys {
   CreatedBy = 'Created.By',
   UpdatedBy = 'Updated.By',
   Contributors = 'Contributors',
+  WordCount = 'Word.Count',
+  CharacterCount = 'Character.Count',
   History = 'History',
   Share = 'Share',
   PublicSharing = 'Public.Sharing',