refactor(electron): tab title/icon update logic (#7675)

fix AF-1122
fix AF-1136

packages/frontend/core/src/pages/workspace/all-collection/index.tsx

@@ -6,6 +6,10 @@ import {
   VirtualizedCollectionList,
 } from '@affine/core/components/page-list';
 import { useNavigateHelper } from '@affine/core/hooks/use-navigate-helper';
+import {
+  ViewIcon,
+  ViewTitle,
+} from '@affine/core/modules/workbench/view/view-meta';
 import { useI18n } from '@affine/i18n';
 import { useLiveData, useService, WorkspaceService } from '@toeverything/infra';
 import { nanoid } from 'nanoid';
@@ -55,6 +59,8 @@ export const AllCollection = () => {
 
   return (
     <>
+      <ViewTitle title={t['Collections']()} />
+      <ViewIcon icon="collection" />
       <ViewHeader>
         <AllCollectionHeader
           showCreateNew={!hideHeaderCreateNew}

packages/frontend/core/src/pages/workspace/all-page/all-page.tsx

@@ -6,6 +6,7 @@ import {
 import { useBlockSuiteDocMeta } from '@affine/core/hooks/use-block-suite-page-meta';
 import { performanceRenderLogger } from '@affine/core/shared';
 import type { Filter } from '@affine/env/filter';
+import { useI18n } from '@affine/i18n';
 import {
   GlobalContextService,
   useService,
@@ -17,6 +18,8 @@ import {
   useIsActiveView,
   ViewBody,
   ViewHeader,
+  ViewIcon,
+  ViewTitle,
 } from '../../../modules/workbench';
 import { EmptyPageList } from '../page-list-empty';
 import * as styles from './all-page.css';
@@ -47,8 +50,12 @@ export const AllPage = () => {
     return;
   }, [globalContext, isActiveView]);
 
+  const t = useI18n();
+
   return (
     <>
+      <ViewTitle title={t['All pages']()} />
+      <ViewIcon icon="allDocs" />
       <ViewHeader>
         <AllPageHeader
           showCreateNew={!hideHeaderCreateNew}

packages/frontend/core/src/pages/workspace/all-tag/index.tsx

@@ -5,10 +5,16 @@ import {
 import { CreateOrEditTag } from '@affine/core/components/page-list/tags/create-tag';
 import type { TagMeta } from '@affine/core/components/page-list/types';
 import { DeleteTagConfirmModal, TagService } from '@affine/core/modules/tag';
+import { useI18n } from '@affine/i18n';
 import { useLiveData, useService } from '@toeverything/infra';
 import { useCallback, useState } from 'react';
 
-import { ViewBody, ViewHeader } from '../../../modules/workbench';
+import {
+  ViewBody,
+  ViewHeader,
+  ViewIcon,
+  ViewTitle,
+} from '../../../modules/workbench';
 import { EmptyTagList } from '../page-list-empty';
 import * as styles from './all-tag.css';
 import { AllTagHeader } from './header';
@@ -54,8 +60,12 @@ export const AllTag = () => {
     [setOpen, setSelectedTagIds]
   );
 
+  const t = useI18n();
+
   return (
     <>
+      <ViewTitle title={t['Tags']()} />
+      <ViewIcon icon="tag" />
       <ViewHeader>
         <AllTagHeader />
       </ViewHeader>

packages/frontend/core/src/pages/workspace/collection/index.tsx

@@ -29,6 +29,8 @@ import {
   useIsActiveView,
   ViewBody,
   ViewHeader,
+  ViewIcon,
+  ViewTitle,
 } from '../../../modules/workbench';
 import { WorkspaceSubPath } from '../../../shared';
 import * as styles from './collection.css';
@@ -155,6 +157,8 @@ const Placeholder = ({ collection }: { collection: Collection }) => {
 
   return (
     <>
+      <ViewTitle title={collection.name} />
+      <ViewIcon icon="collection" />
       <ViewHeader>
         <div
           style={{

packages/frontend/core/src/pages/workspace/detail-page/detail-page-header.tsx

@@ -13,9 +13,16 @@ import { PageHeaderMenuButton } from '@affine/core/components/blocksuite/block-s
 import { DetailPageHeaderPresentButton } from '@affine/core/components/blocksuite/block-suite-header/present/detail-header-present-button';
 import { EditorModeSwitch } from '@affine/core/components/blocksuite/block-suite-mode-switch';
 import { useRegisterCopyLinkCommands } from '@affine/core/hooks/affine/use-register-copy-link-commands';
+import { useDocCollectionPageTitle } from '@affine/core/hooks/use-block-suite-workspace-page-title';
 import { useJournalInfoHelper } from '@affine/core/hooks/use-journal';
+import { ViewIcon, ViewTitle } from '@affine/core/modules/workbench';
 import type { Doc } from '@blocksuite/store';
-import { type Workspace } from '@toeverything/infra';
+import {
+  DocService,
+  useLiveData,
+  useService,
+  type Workspace,
+} from '@toeverything/infra';
 import { useAtom, useAtomValue } from 'jotai';
 import { forwardRef, useCallback, useEffect, useRef, useState } from 'react';
 
@@ -68,8 +75,11 @@ export function JournalPageHeader({ page, workspace }: PageHeaderProps) {
 
   const { hideShare, hideToday } =
     useDetailPageHeaderResponsive(containerWidth);
+  const title = useDocCollectionPageTitle(workspace.docCollection, page?.id);
   return (
     <Header className={styles.header} ref={containerRef}>
+      <ViewTitle title={title} />
+      <ViewIcon icon="journal" />
       <EditorModeSwitch
         docCollection={workspace.docCollection}
         pageId={page?.id}
@@ -115,8 +125,15 @@ export function NormalPageHeader({ page, workspace }: PageHeaderProps) {
   const onRename = useCallback(() => {
     setTimeout(() => titleInputHandleRef.current?.triggerEdit());
   }, []);
+
+  const title = useDocCollectionPageTitle(workspace.docCollection, page?.id);
+  const doc = useService(DocService).doc;
+  const currentMode = useLiveData(doc.mode$);
+
   return (
     <Header className={styles.header} ref={containerRef}>
+      <ViewTitle title={title} />
+      <ViewIcon icon={currentMode ?? 'page'} />
       <EditorModeSwitch
         docCollection={workspace.docCollection}
         pageId={page?.id}

packages/frontend/core/src/pages/workspace/tag/index.tsx

@@ -8,6 +8,8 @@ import {
   useIsActiveView,
   ViewBody,
   ViewHeader,
+  ViewIcon,
+  ViewTitle,
 } from '@affine/core/modules/workbench';
 import {
   GlobalContextService,
@@ -39,6 +41,7 @@ export const TagDetail = ({ tagId }: { tagId?: string }) => {
   }, [pageIds, pageMetas]);
 
   const isActiveView = useIsActiveView();
+  const tagName = useLiveData(currentTag?.value$);
 
   useEffect(() => {
     if (isActiveView && currentTag) {
@@ -59,6 +62,8 @@ export const TagDetail = ({ tagId }: { tagId?: string }) => {
 
   return (
     <>
+      <ViewTitle title={tagName ?? 'Untitled'} />
+      <ViewIcon icon="tag" />
       <ViewHeader>
         <TagDetailHeader />
       </ViewHeader>

packages/frontend/core/src/pages/workspace/trash-page.tsx

@@ -14,7 +14,13 @@ import {
 } from '@toeverything/infra';
 import { useEffect } from 'react';
 
-import { useIsActiveView, ViewBody, ViewHeader } from '../../modules/workbench';
+import {
+  useIsActiveView,
+  ViewBody,
+  ViewHeader,
+  ViewIcon,
+  ViewTitle,
+} from '../../modules/workbench';
 import { EmptyPageList } from './page-list-empty';
 import * as styles from './trash-page.css';
 
@@ -56,8 +62,11 @@ export const TrashPage = () => {
     return;
   }, [globalContextService.globalContext.isTrash, isActiveView]);
 
+  const t = useI18n();
   return (
     <>
+      <ViewTitle title={t['Trash']()} />
+      <ViewIcon icon={'trash'} />
       <ViewHeader>
         <TrashHeader />
       </ViewHeader>