From 9f3580263a01cbab7cbd64fc34e693f00ff6549d Mon Sep 17 00:00:00 2001
From: CatsJuice <wp1298554944@hotmail.com>
Date: Fri, 7 Mar 2025 12:32:42 +0000
Subject: [PATCH] feat(core): support removing journal template from right
 sidebar (#10571)

---
 .../tabs/journal/template-setting.tsx         | 28 ++++++++++++++++---
 packages/frontend/i18n/src/resources/en.json  |  1 +
 2 files changed, 25 insertions(+), 4 deletions(-)

diff --git a/packages/frontend/core/src/desktop/pages/workspace/detail-page/tabs/journal/template-setting.tsx b/packages/frontend/core/src/desktop/pages/workspace/detail-page/tabs/journal/template-setting.tsx
index 7d4024cf72..5a7d07246e 100644
--- a/packages/frontend/core/src/desktop/pages/workspace/detail-page/tabs/journal/template-setting.tsx
+++ b/packages/frontend/core/src/desktop/pages/workspace/detail-page/tabs/journal/template-setting.tsx
@@ -1,10 +1,10 @@
-import { Button, Menu } from '@affine/component';
+import { Button, Menu, MenuItem, MenuSeparator } from '@affine/component';
 import { DocsService } from '@affine/core/modules/doc';
 import { DocDisplayMetaService } from '@affine/core/modules/doc-display-meta';
 import { TemplateDocService } from '@affine/core/modules/template-doc';
 import { TemplateListMenuContentScrollable } from '@affine/core/modules/template-doc/view/template-list-menu';
 import { useI18n } from '@affine/i18n';
-import { TemplateIcon } from '@blocksuite/icons/rc';
+import { DeleteIcon, TemplateIcon } from '@blocksuite/icons/rc';
 import { useLiveData, useService } from '@toeverything/infra';
 import clsx from 'clsx';
 import { useCallback, useMemo } from 'react';
@@ -33,18 +33,38 @@ export const JournalTemplateSetting = () => {
   const isDeleted = useLiveData(journalTemplateDoc?.trash$);
 
   const updateJournalTemplate = useCallback(
-    (templateId: string) => {
+    (templateId?: string) => {
       templateDocService.setting.updateJournalTemplateDocId(templateId);
     },
     [templateDocService.setting]
   );
 
+  const removeJournalTemplate = useCallback(() => {
+    updateJournalTemplate();
+  }, [updateJournalTemplate]);
+
   return (
     <div className={styles.container}>
       <Menu
         contentOptions={{ className: styles.menu }}
         items={
-          <TemplateListMenuContentScrollable onSelect={updateJournalTemplate} />
+          <TemplateListMenuContentScrollable
+            onSelect={updateJournalTemplate}
+            suffixItems={
+              journalTemplateDocId ? (
+                <>
+                  <MenuSeparator />
+                  <MenuItem
+                    prefixIcon={<DeleteIcon />}
+                    onClick={removeJournalTemplate}
+                    type="danger"
+                  >
+                    {t['com.affine.template-list.delete']()}
+                  </MenuItem>
+                </>
+              ) : null
+            }
+          />
         }
       >
         <Button
diff --git a/packages/frontend/i18n/src/resources/en.json b/packages/frontend/i18n/src/resources/en.json
index 813bcfdc0c..e45b181f97 100644
--- a/packages/frontend/i18n/src/resources/en.json
+++ b/packages/frontend/i18n/src/resources/en.json
@@ -1736,6 +1736,7 @@
   "com.affine.page-starter-bar.edgeless": "Edgeless",
   "tips": "Tips",
   "Template": "Template",
+  "com.affine.template-list.delete": "Delete Template",
   "com.affine.template-list.empty": "No template",
   "com.affine.template-list.create-new": "Create new template",
   "com.affine.template-journal-onboarding.title": "Set a Template for the Journal",