69 lines
2.0 KiB
TypeScript
69 lines
2.0 KiB
TypeScript
import { useTranslation } from '@affine/i18n';
|
|
import type { PageBlockModel } from '@blocksuite/blocks';
|
|
import { PlusIcon } from '@blocksuite/icons';
|
|
import { assertEquals, nanoid } from '@blocksuite/store';
|
|
import { Command } from 'cmdk';
|
|
import type { NextRouter } from 'next/router';
|
|
import type React from 'react';
|
|
|
|
import { useBlockSuiteWorkspaceHelper } from '../../../hooks/use-blocksuite-workspace-helper';
|
|
import { useRouterHelper } from '../../../hooks/use-router-helper';
|
|
import type { BlockSuiteWorkspace } from '../../../shared';
|
|
import { StyledModalFooterContent } from './style';
|
|
|
|
export type FooterProps = {
|
|
query: string;
|
|
onClose: () => void;
|
|
blockSuiteWorkspace: BlockSuiteWorkspace;
|
|
router: NextRouter;
|
|
};
|
|
|
|
export const Footer: React.FC<FooterProps> = ({
|
|
query,
|
|
onClose,
|
|
blockSuiteWorkspace,
|
|
router,
|
|
}) => {
|
|
const { createPage } = useBlockSuiteWorkspaceHelper(blockSuiteWorkspace);
|
|
const { t } = useTranslation();
|
|
const { jumpToPage } = useRouterHelper(router);
|
|
const MAX_QUERY_SHOW_LENGTH = 20;
|
|
const normalizedQuery =
|
|
query.length > MAX_QUERY_SHOW_LENGTH
|
|
? query.slice(0, MAX_QUERY_SHOW_LENGTH) + '...'
|
|
: query;
|
|
return (
|
|
<Command.Item
|
|
data-testid="quick-search-add-new-page"
|
|
onSelect={async () => {
|
|
onClose();
|
|
const id = nanoid();
|
|
const page = await createPage(id, query);
|
|
assertEquals(page.id, id);
|
|
await jumpToPage(blockSuiteWorkspace.id, page.id);
|
|
if (!query) {
|
|
return;
|
|
}
|
|
const newPage = blockSuiteWorkspace.getPage(page.id);
|
|
if (newPage) {
|
|
const block = newPage.getBlockByFlavour(
|
|
'affine:page'
|
|
)[0] as PageBlockModel;
|
|
if (block) {
|
|
block.title.insert(query, 0);
|
|
}
|
|
}
|
|
}}
|
|
>
|
|
<StyledModalFooterContent>
|
|
<PlusIcon />
|
|
{query ? (
|
|
<span>{t('New Keyword Page', { query: normalizedQuery })}</span>
|
|
) : (
|
|
<span>{t('New Page')}</span>
|
|
)}
|
|
</StyledModalFooterContent>
|
|
</Command.Item>
|
|
);
|
|
};
|