Merge pull request #5713 from dnmfarrell/dnmfarrell/set-messages-title

groups: set the right title for messages

pkg/interface/src/logic/lib/workspace.ts

@@ -11,8 +11,7 @@ export function getTitleFromWorkspace(
     case 'messages':
       return 'Messages';
     case 'group':
-      const association = associations.groups[workspace.group];
-      return association?.metadata?.title || '';
+      return associations.groups[workspace.group]?.metadata?.title || 'Groups';
   }
 }
 

pkg/interface/src/views/apps/chat/DmResource.tsx

@@ -1,5 +1,6 @@
 import { acceptDm, cite, Content, declineDm, deSig, Post } from '@urbit/api';
 import React, { useCallback, useEffect } from 'react';
+import Helmet from 'react-helmet';
 import _ from 'lodash';
 import bigInt from 'big-integer';
 import { Box, Row, Col, Text, Center } from '@tlon/indigo-react';
@@ -49,6 +50,21 @@ function quoteReply(post: Post) {
   return `${reply}\n\n~${post.author}:`;
 }
 
+export function DmHelmet(props: DmHelmetProps) {
+  const { ship } = props;
+  const hark = useHarkDm(ship);
+  const unreadCount = hark.count;
+  const contact = useContact(ship);
+  const { hideNicknames } = useSettingsState(selectCalmState);
+  const showNickname = !hideNicknames && Boolean(contact);
+  const nickname = showNickname ? contact!.nickname : cite(ship) ?? ship;
+  return(
+    <Helmet defer={false}>
+      <title>{unreadCount ? `(${String(unreadCount)}) ` : ''}{ nickname }</title>
+    </Helmet>
+  );
+}
+
 export function DmResource(props: DmResourceProps) {
   const { ship } = props;
   const dm = useDM(ship);

pkg/interface/src/views/landscape/components/GroupsPane.tsx

@@ -8,7 +8,7 @@ import {
 } from 'react-router-dom';
 import { useShortcut } from '~/logic/state/settings';
 import { useLocalStorageState } from '~/logic/lib/useLocalStorageState';
-import { getGroupFromWorkspace } from '~/logic/lib/workspace';
+import { getGroupFromWorkspace, getTitleFromWorkspace } from '~/logic/lib/workspace';
 import useGroupState from '~/logic/state/group';
 import useHarkState from '~/logic/state/hark';
 import useMetadataState from '~/logic/state/metadata';
@@ -22,7 +22,7 @@ import { Skeleton } from './Skeleton';
 import { EmptyGroupHome } from './Home/EmptyGroupHome';
 import { Join } from './Join/Join';
 import { Resource } from './Resource';
-import { DmResource } from '~/views/apps/chat/DmResource';
+import { DmResource, DmHelmet } from '~/views/apps/chat/DmResource';
 import { UnjoinedResource } from '~/views/components/UnjoinedResource';
 import { NewChannel } from './NewChannel';
 import { GroupHome } from './Home/GroupHome';
@@ -126,16 +126,18 @@ export function GroupsPane(props: GroupsPaneProps) {
             const { ship } = match.params as Record<string, string>;
 
             return (
-              <Skeleton
-                mobileHide
-                recentGroups={recentGroups}
-                selected={ship}
-                {...props}
-                baseUrl={match.path}
-              > <DmResource ship={ship} />
-
-              </Skeleton>
+              <>
+                <DmHelmet ship={ship} />
+                <Skeleton
+                  mobileHide
+                  recentGroups={recentGroups}
+                  selected={ship}
+                  {...props}
+                  baseUrl={match.path}
+                > <DmResource ship={ship} />
 
+                </Skeleton>
+              </>
             );
           }}
         />
@@ -180,7 +182,7 @@ export function GroupsPane(props: GroupsPaneProps) {
             const appPath = `/ship/${host}/${name}`;
             const association = associations.graph[appPath];
             const resourceUrl = `${baseUrl}/join/${app}${appPath}`;
-            let title = groupAssociation?.metadata?.title ?? 'Groups';
+            let title = getTitleFromWorkspace(associations, workspace);
 
             if (!association) {
               return <Loading />;
@@ -252,7 +254,7 @@ export function GroupsPane(props: GroupsPaneProps) {
           render={(routeProps) => {
             const shouldHideSidebar =
               routeProps.location.pathname.includes('/feed');
-            const title = groupAssociation?.metadata?.title ?? 'Groups';
+            const title = getTitleFromWorkspace(associations, workspace);
             return (
               <>
                 <Helmet defer={false}>