diff --git a/blocksuite/affine/block-database/package.json b/blocksuite/affine/block-database/package.json index 4a47e9a7f7..f0297a173d 100644 --- a/blocksuite/affine/block-database/package.json +++ b/blocksuite/affine/block-database/package.json @@ -17,6 +17,7 @@ "@blocksuite/affine-model": "workspace:*", "@blocksuite/affine-shared": "workspace:*", "@blocksuite/affine-widget-drag-handle": "workspace:*", + "@blocksuite/affine-widget-slash-menu": "workspace:*", "@blocksuite/block-std": "workspace:*", "@blocksuite/data-view": "workspace:*", "@blocksuite/global": "workspace:*", diff --git a/blocksuite/affine/block-database/src/configs/slash-menu.ts b/blocksuite/affine/block-database/src/configs/slash-menu.ts new file mode 100644 index 0000000000..de2cb375e7 --- /dev/null +++ b/blocksuite/affine/block-database/src/configs/slash-menu.ts @@ -0,0 +1,83 @@ +import { getSelectedModelsCommand } from '@blocksuite/affine-shared/commands'; +import { TelemetryProvider } from '@blocksuite/affine-shared/services'; +import { isInsideBlockByFlavour } from '@blocksuite/affine-shared/utils'; +import { type SlashMenuConfig } from '@blocksuite/affine-widget-slash-menu'; +import { viewPresets } from '@blocksuite/data-view/view-presets'; +import { + DatabaseKanbanViewIcon, + DatabaseTableViewIcon, +} from '@blocksuite/icons/lit'; + +import { insertDatabaseBlockCommand } from '../commands'; +import { KanbanViewTooltip, TableViewTooltip } from './tooltips'; + +export const databaseSlashMenuConfig: SlashMenuConfig = { + disableWhen: ({ model }) => model.flavour === 'affine:database', + items: [ + { + name: 'Table View', + description: 'Display items in a table format.', + searchAlias: ['database'], + icon: DatabaseTableViewIcon(), + tooltip: { + figure: TableViewTooltip, + caption: 'Table View', + }, + group: '7_Database@0', + when: ({ model }) => + !isInsideBlockByFlavour(model.doc, model, 'affine:edgeless-text'), + action: ({ std }) => { + std.command + .chain() + .pipe(getSelectedModelsCommand) + .pipe(insertDatabaseBlockCommand, { + viewType: viewPresets.tableViewMeta.type, + place: 'after', + removeEmptyLine: true, + }) + .pipe(({ insertedDatabaseBlockId }) => { + if (insertedDatabaseBlockId) { + const telemetry = std.getOptional(TelemetryProvider); + telemetry?.track('BlockCreated', { + blockType: 'affine:database', + }); + } + }) + .run(); + }, + }, + + { + name: 'Kanban View', + description: 'Visualize data in a dashboard.', + searchAlias: ['database'], + icon: DatabaseKanbanViewIcon(), + tooltip: { + figure: KanbanViewTooltip, + caption: 'Kanban View', + }, + group: '7_Database@2', + when: ({ model }) => + !isInsideBlockByFlavour(model.doc, model, 'affine:edgeless-text'), + action: ({ std }) => { + std.command + .chain() + .pipe(getSelectedModelsCommand) + .pipe(insertDatabaseBlockCommand, { + viewType: viewPresets.kanbanViewMeta.type, + place: 'after', + removeEmptyLine: true, + }) + .pipe(({ insertedDatabaseBlockId }) => { + if (insertedDatabaseBlockId) { + const telemetry = std.getOptional(TelemetryProvider); + telemetry?.track('BlockCreated', { + blockType: 'affine:database', + }); + } + }) + .run(); + }, + }, + ], +}; diff --git a/blocksuite/affine/widget-slash-menu/src/tooltips/table-view.ts b/blocksuite/affine/block-database/src/configs/tooltips.ts similarity index 53% rename from blocksuite/affine/widget-slash-menu/src/tooltips/table-view.ts rename to blocksuite/affine/block-database/src/configs/tooltips.ts index 541b08efd6..a7491d0f17 100644 --- a/blocksuite/affine/widget-slash-menu/src/tooltips/table-view.ts +++ b/blocksuite/affine/block-database/src/configs/tooltips.ts @@ -84,3 +84,98 @@ export const TableViewTooltip = html` + + + + + + + + + + +Untitled Kanban +Ungroups + +In Progress + +Done + +Task 5 + + + + + + + + + + + +Task 1 + + + + + + +Task 4 + + + + + + + +1 + +1 + + +In Progress + +Done + +Visualize data in a dashboard. + + + + + + + + + + + + + + + + + + + + + + +`; + +// prettier-ignore +export const ToDoListTooltip = html` + + + + + + +Here is an example of todo list. + +Make a list for building preview. + + +`; diff --git a/blocksuite/affine/block-database/src/database-spec.ts b/blocksuite/affine/block-database/src/database-spec.ts index 872ca00f24..1a4d0b6cdd 100644 --- a/blocksuite/affine/block-database/src/database-spec.ts +++ b/blocksuite/affine/block-database/src/database-spec.ts @@ -1,11 +1,14 @@ +import { SlashMenuConfigExtension } from '@blocksuite/affine-widget-slash-menu'; import { BlockViewExtension, FlavourExtension } from '@blocksuite/block-std'; import type { ExtensionType } from '@blocksuite/store'; import { literal } from 'lit/static-html.js'; import { DatabaseBlockAdapterExtensions } from './adapters/extension.js'; +import { databaseSlashMenuConfig } from './configs/slash-menu.js'; export const DatabaseBlockSpec: ExtensionType[] = [ FlavourExtension('affine:database'), BlockViewExtension('affine:database', literal`affine-database`), DatabaseBlockAdapterExtensions, + SlashMenuConfigExtension('affine:database', databaseSlashMenuConfig), ].flat(); diff --git a/blocksuite/affine/block-database/tsconfig.json b/blocksuite/affine/block-database/tsconfig.json index ffea569f51..45857b26a2 100644 --- a/blocksuite/affine/block-database/tsconfig.json +++ b/blocksuite/affine/block-database/tsconfig.json @@ -12,6 +12,7 @@ { "path": "../model" }, { "path": "../shared" }, { "path": "../widget-drag-handle" }, + { "path": "../widget-slash-menu" }, { "path": "../../framework/block-std" }, { "path": "../data-view" }, { "path": "../../framework/global" }, diff --git a/blocksuite/affine/widget-slash-menu/package.json b/blocksuite/affine/widget-slash-menu/package.json index c67685e3d1..5de686d2f8 100644 --- a/blocksuite/affine/widget-slash-menu/package.json +++ b/blocksuite/affine/widget-slash-menu/package.json @@ -14,7 +14,6 @@ "license": "MIT", "dependencies": { "@blocksuite/affine-block-attachment": "workspace:*", - "@blocksuite/affine-block-database": "workspace:*", "@blocksuite/affine-block-embed": "workspace:*", "@blocksuite/affine-block-image": "workspace:*", "@blocksuite/affine-block-latex": "workspace:*", @@ -25,7 +24,6 @@ "@blocksuite/affine-components": "workspace:*", "@blocksuite/affine-shared": "workspace:*", "@blocksuite/block-std": "workspace:*", - "@blocksuite/data-view": "workspace:*", "@blocksuite/global": "workspace:*", "@blocksuite/icons": "^2.2.4", "@blocksuite/inline": "workspace:*", diff --git a/blocksuite/affine/widget-slash-menu/src/config.ts b/blocksuite/affine/widget-slash-menu/src/config.ts index 18d5a11677..b3bbed7bfc 100644 --- a/blocksuite/affine/widget-slash-menu/src/config.ts +++ b/blocksuite/affine/widget-slash-menu/src/config.ts @@ -1,6 +1,4 @@ import { addSiblingAttachmentBlocks } from '@blocksuite/affine-block-attachment'; -import type { DataViewBlockComponent } from '@blocksuite/affine-block-data-view'; -import { insertDatabaseBlockCommand } from '@blocksuite/affine-block-database'; import { insertImagesCommand } from '@blocksuite/affine-block-image'; import { insertLatexBlockCommand } from '@blocksuite/affine-block-latex'; import { focusBlockEnd } from '@blocksuite/affine-block-note'; @@ -35,13 +33,10 @@ import { findAncestorModel, openFileOrFiles, } from '@blocksuite/affine-shared/utils'; -import { viewPresets } from '@blocksuite/data-view/view-presets'; import { ArrowDownBigIcon, ArrowUpBigIcon, CopyIcon, - DatabaseKanbanViewIcon, - DatabaseTableViewIcon, DeleteIcon, DualLinkIcon, ExportToPdfIcon, @@ -85,7 +80,7 @@ let index = 0; export const defaultSlashMenuConfig: SlashMenuConfig = { disableWhen: ({ model }) => { return ( - ['affine:database', 'affine:code'].includes(model.flavour) || + ['affine:code'].includes(model.flavour) || !!findAncestorModel( model, ancestor => ancestor.flavour === 'affine:callout' @@ -93,7 +88,7 @@ export const defaultSlashMenuConfig: SlashMenuConfig = { ); }, items: [ - // --------------------------------------------------------- + // TODO(@L-Sun): move this to rich-text when it has been remove from blocksuite/affine-components ...textConversionConfigs .filter(i => i.type && ['h1', 'h2', 'h3', 'text'].includes(i.type)) .map(config => createConversionItem(config, `0_Basic@${index++}`)), @@ -180,12 +175,6 @@ export const defaultSlashMenuConfig: SlashMenuConfig = { .filter(i => !['Code', 'Link'].includes(i.name)) .map(config => createTextFormatItem(config, `2_Style@${index++}`)), - // --------------------------------------------------------- - // { - // groupName: 'Page', - // when: ({ model }) => - // model.doc.schema.flavourSchemaMap.has('affine:embed-linked-doc'), - // }, { name: 'New Doc', description: 'Start a new document.', @@ -605,104 +594,6 @@ export const defaultSlashMenuConfig: SlashMenuConfig = { ]; }, - // --------------------------------------------------------- - // { groupName: 'Database' }, - { - name: 'Table View', - description: 'Display items in a table format.', - searchAlias: ['database'], - icon: DatabaseTableViewIcon(), - tooltip: slashMenuToolTips['Table View'], - group: `7_Database@${index++}`, - when: ({ model }) => - model.doc.schema.flavourSchemaMap.has('affine:database') && - !insideEdgelessText(model), - action: ({ std }) => { - std.command - .chain() - .pipe(getSelectedModelsCommand) - .pipe(insertDatabaseBlockCommand, { - viewType: viewPresets.tableViewMeta.type, - place: 'after', - removeEmptyLine: true, - }) - .pipe(({ insertedDatabaseBlockId }) => { - if (insertedDatabaseBlockId) { - const telemetry = std.getOptional(TelemetryProvider); - telemetry?.track('BlockCreated', { - blockType: 'affine:database', - }); - } - }) - .run(); - }, - }, - { - name: 'Todo', - searchAlias: ['todo view'], - icon: DatabaseTableViewIcon(), - tooltip: slashMenuToolTips['Todo'], - group: `7_Database@${index++}`, - when: ({ model }) => - model.doc.schema.flavourSchemaMap.has('affine:database') && - !insideEdgelessText(model) && - !!model.doc.get(FeatureFlagService).getFlag('enable_block_query'), - - action: ({ model, std }) => { - const { host } = std; - const parent = host.doc.getParent(model); - if (!parent) return; - const index = parent.children.indexOf(model); - const id = host.doc.addBlock( - 'affine:data-view', - {}, - host.doc.getParent(model), - index + 1 - ); - const dataViewModel = host.doc.getBlock(id)!; - - Promise.resolve() - .then(() => { - const dataView = std.view.getBlock( - dataViewModel.id - ) as DataViewBlockComponent | null; - dataView?.dataSource.viewManager.viewAdd('table'); - }) - .catch(console.error); - tryRemoveEmptyLine(model); - }, - }, - { - name: 'Kanban View', - description: 'Visualize data in a dashboard.', - searchAlias: ['database'], - icon: DatabaseKanbanViewIcon(), - tooltip: slashMenuToolTips['Kanban View'], - group: `7_Database@${index++}`, - when: ({ model }) => - model.doc.schema.flavourSchemaMap.has('affine:database') && - !insideEdgelessText(model), - action: ({ std }) => { - std.command - .chain() - .pipe(getSelectedModelsCommand) - .pipe(insertDatabaseBlockCommand, { - viewType: viewPresets.kanbanViewMeta.type, - place: 'after', - removeEmptyLine: true, - }) - .pipe(({ insertedDatabaseBlockId }) => { - if (insertedDatabaseBlockId) { - const telemetry = std.getOptional(TelemetryProvider); - telemetry?.track('BlockCreated', { - blockType: 'affine:database', - }); - } - }) - .run(); - }, - }, - // --------------------------------------------------------- // { groupName: 'Actions' }, { diff --git a/blocksuite/affine/widget-slash-menu/src/extensions.ts b/blocksuite/affine/widget-slash-menu/src/extensions.ts index bf3d4f2187..921ed5232e 100644 --- a/blocksuite/affine/widget-slash-menu/src/extensions.ts +++ b/blocksuite/affine/widget-slash-menu/src/extensions.ts @@ -25,10 +25,7 @@ export class SlashMenuExtension extends Extension { di.add(this, [StdIdentifier]); // TODO(@L-Sun): remove this after moving all configs to corresponding extensions - SlashMenuConfigExtension({ - id: 'default', - config: defaultSlashMenuConfig, - }).setup(di); + SlashMenuConfigExtension('default', defaultSlashMenuConfig).setup(di); } constructor(readonly std: BlockStdScope) { @@ -43,13 +40,10 @@ const SlashMenuConfigIdentifier = createIdentifier( `${AFFINE_SLASH_MENU_WIDGET}-config` ); -export function SlashMenuConfigExtension({ - id, - config, -}: { - id: string; - config: SlashMenuConfig; -}): ExtensionType { +export function SlashMenuConfigExtension( + id: string, + config: SlashMenuConfig +): ExtensionType { return { setup: di => { di.addImpl(SlashMenuConfigIdentifier(id), config); diff --git a/blocksuite/affine/widget-slash-menu/src/tooltips/index.ts b/blocksuite/affine/widget-slash-menu/src/tooltips/index.ts index 45f61d1c76..a8b2b2a91e 100644 --- a/blocksuite/affine/widget-slash-menu/src/tooltips/index.ts +++ b/blocksuite/affine/widget-slash-menu/src/tooltips/index.ts @@ -16,7 +16,6 @@ import { Heading4Tooltip } from './heading-4'; import { Heading5Tooltip } from './heading-5'; import { Heading6Tooltip } from './heading-6'; import { ItalicTooltip } from './italic'; -import { KanbanViewTooltip } from './kanban-view'; import { LinearTooltip } from './linear'; import { LinkTooltip } from './link'; import { LinkDocTooltip } from './link-doc'; @@ -29,9 +28,7 @@ import { PDFTooltip } from './pdf'; import { PhotoTooltip } from './photo'; import { QuoteTooltip } from './quote'; import { StrikethroughTooltip } from './strikethrough'; -import { TableViewTooltip } from './table-view'; import { TextTooltip } from './text'; -import { ToDoListTooltip } from './to-do-list'; import { TodayTooltip } from './today'; import { TomorrowTooltip } from './tomorrow'; import { TweetTooltip } from './tweet'; @@ -100,11 +97,6 @@ export const slashMenuToolTips: Record = { caption: 'Numbered List', }, - 'To-do List': { - figure: ToDoListTooltip, - caption: 'To-do List', - }, - Bold: { figure: BoldTextTooltip, caption: 'Bold Text', @@ -200,16 +192,6 @@ export const slashMenuToolTips: Record = { caption: 'Now', }, - 'Table View': { - figure: TableViewTooltip, - caption: 'Table View', - }, - - 'Kanban View': { - figure: KanbanViewTooltip, - caption: 'Kanban View', - }, - 'Move Up': { figure: MoveUpTooltip, caption: 'Move Up', diff --git a/blocksuite/affine/widget-slash-menu/src/tooltips/kanban-view.ts b/blocksuite/affine/widget-slash-menu/src/tooltips/kanban-view.ts deleted file mode 100644 index a1cddeba4f..0000000000 --- a/blocksuite/affine/widget-slash-menu/src/tooltips/kanban-view.ts +++ /dev/null @@ -1,80 +0,0 @@ -import { html } from 'lit'; -// prettier-ignore -export const KanbanViewTooltip = html` - - - - - - - - - - -Untitled Kanban -Ungroups - -In Progress - -Done - -Task 5 - - - - - - - - - - - -Task 1 - - - - - - -Task 4 - - - - - - - -1 - -1 - - -In Progress - -Done - -Visualize data in a dashboard. - - - - - - - - - - - - - - - - - - - - - - -`; diff --git a/blocksuite/affine/widget-slash-menu/src/tooltips/to-do-list.ts b/blocksuite/affine/widget-slash-menu/src/tooltips/to-do-list.ts deleted file mode 100644 index 7fa0b1def2..0000000000 --- a/blocksuite/affine/widget-slash-menu/src/tooltips/to-do-list.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { html } from 'lit'; -// prettier-ignore -export const ToDoListTooltip = html` - - - - - - -Here is an example of todo list. - -Make a list for building preview. - - -`; diff --git a/blocksuite/affine/widget-slash-menu/tsconfig.json b/blocksuite/affine/widget-slash-menu/tsconfig.json index 8dd9ad7ba8..71cdf14c1d 100644 --- a/blocksuite/affine/widget-slash-menu/tsconfig.json +++ b/blocksuite/affine/widget-slash-menu/tsconfig.json @@ -8,7 +8,6 @@ "include": ["./src"], "references": [ { "path": "../block-attachment" }, - { "path": "../block-database" }, { "path": "../block-embed" }, { "path": "../block-image" }, { "path": "../block-latex" }, @@ -19,7 +18,6 @@ { "path": "../components" }, { "path": "../shared" }, { "path": "../../framework/block-std" }, - { "path": "../data-view" }, { "path": "../../framework/global" }, { "path": "../../framework/inline" }, { "path": "../../framework/store" } diff --git a/tools/utils/src/workspace.gen.ts b/tools/utils/src/workspace.gen.ts index c6971faad3..e7e5b44abf 100644 --- a/tools/utils/src/workspace.gen.ts +++ b/tools/utils/src/workspace.gen.ts @@ -91,6 +91,7 @@ export const PackageList = [ 'blocksuite/affine/model', 'blocksuite/affine/shared', 'blocksuite/affine/widget-drag-handle', + 'blocksuite/affine/widget-slash-menu', 'blocksuite/framework/block-std', 'blocksuite/affine/data-view', 'blocksuite/framework/global', @@ -441,7 +442,6 @@ export const PackageList = [ name: '@blocksuite/affine-widget-slash-menu', workspaceDependencies: [ 'blocksuite/affine/block-attachment', - 'blocksuite/affine/block-database', 'blocksuite/affine/block-embed', 'blocksuite/affine/block-image', 'blocksuite/affine/block-latex', diff --git a/yarn.lock b/yarn.lock index 1b5e7c6beb..e1e6b3c719 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2344,6 +2344,7 @@ __metadata: "@blocksuite/affine-model": "workspace:*" "@blocksuite/affine-shared": "workspace:*" "@blocksuite/affine-widget-drag-handle": "workspace:*" + "@blocksuite/affine-widget-slash-menu": "workspace:*" "@blocksuite/block-std": "workspace:*" "@blocksuite/data-view": "workspace:*" "@blocksuite/global": "workspace:*" @@ -2954,7 +2955,6 @@ __metadata: resolution: "@blocksuite/affine-widget-slash-menu@workspace:blocksuite/affine/widget-slash-menu" dependencies: "@blocksuite/affine-block-attachment": "workspace:*" - "@blocksuite/affine-block-database": "workspace:*" "@blocksuite/affine-block-embed": "workspace:*" "@blocksuite/affine-block-image": "workspace:*" "@blocksuite/affine-block-latex": "workspace:*" @@ -2965,7 +2965,6 @@ __metadata: "@blocksuite/affine-components": "workspace:*" "@blocksuite/affine-shared": "workspace:*" "@blocksuite/block-std": "workspace:*" - "@blocksuite/data-view": "workspace:*" "@blocksuite/global": "workspace:*" "@blocksuite/icons": "npm:^2.2.4" "@blocksuite/inline": "workspace:*"