diff --git a/apps/web/src/components/blocksuite/block-suite-page-list/index.tsx b/apps/web/src/components/blocksuite/block-suite-page-list/index.tsx index f6a910048f..e833e44173 100644 --- a/apps/web/src/components/blocksuite/block-suite-page-list/index.tsx +++ b/apps/web/src/components/blocksuite/block-suite-page-list/index.tsx @@ -70,7 +70,7 @@ export const BlockSuitePageList: React.FC = ({ permanentlyDeletePage, cancelPublicPage, } = useBlockSuiteMetaHelper(blockSuiteWorkspace); - const { createPage, createEdgeless, isPreferredEdgeless } = + const { createPage, createEdgeless, importFile, isPreferredEdgeless } = usePageHelper(blockSuiteWorkspace); const t = useAFFiNEI18N(); const list = useMemo( @@ -155,6 +155,7 @@ export const BlockSuitePageList: React.FC = ({ diff --git a/apps/web/src/components/blocksuite/block-suite-page-list/utils.tsx b/apps/web/src/components/blocksuite/block-suite-page-list/utils.tsx index d21c9ab497..03d0a17414 100644 --- a/apps/web/src/components/blocksuite/block-suite-page-list/utils.tsx +++ b/apps/web/src/components/blocksuite/block-suite-page-list/utils.tsx @@ -23,9 +23,14 @@ export const usePageHelper = (blockSuiteWorkspace: BlockSuiteWorkspace) => { setPreferredMode(page.id, 'edgeless'); openPage(blockSuiteWorkspace.id, page.id); }; + const importFileAndOpen = async () => { + const { showImportModal } = await import('@blocksuite/blocks'); + showImportModal({ workspace: blockSuiteWorkspace }); + }; return { createPage: createPageAndOpen, createEdgeless: createEdgelessAndOpen, + importFile: importFileAndOpen, isPreferredEdgeless: isPreferredEdgeless, }; }; diff --git a/packages/component/src/components/page-list/all-page.tsx b/packages/component/src/components/page-list/all-page.tsx index 2459985ae8..b7a31885ba 100644 --- a/packages/component/src/components/page-list/all-page.tsx +++ b/packages/component/src/components/page-list/all-page.tsx @@ -26,11 +26,13 @@ const AllPagesHead = ({ sorter, createNewPage, createNewEdgeless, + importFile, }: { isPublicWorkspace: boolean; sorter: ReturnType>; createNewPage: () => void; createNewEdgeless: () => void; + importFile: () => void; }) => { const t = useAFFiNEI18N(); const titleList = [ @@ -56,6 +58,7 @@ const AllPagesHead = ({ ), showWhen: () => !isPublicWorkspace, @@ -109,6 +112,7 @@ export const PageList = ({ list, onCreateNewPage, onCreateNewEdgeless, + onImportFile, }: PageListProps) => { const sorter = useSorter({ data: list, @@ -124,6 +128,7 @@ export const PageList = ({ isPublicWorkspace={isPublicWorkspace} createNewPage={onCreateNewPage} createNewEdgeless={onCreateNewEdgeless} + importFile={onImportFile} list={sorter.data} /> ); @@ -145,6 +150,7 @@ export const PageList = ({ sorter={sorter} createNewPage={onCreateNewPage} createNewEdgeless={onCreateNewEdgeless} + importFile={onImportFile} /> void; createNewEdgeless: () => void; + importFile: () => void; }; export const CreateNewPagePopup = ({ createNewPage, createNewEdgeless, + importFile, }: NewPageButtonProps) => { const t = useAFFiNEI18N(); return ( @@ -37,6 +39,12 @@ export const CreateNewPagePopup = ({ right={} onClick={createNewEdgeless} /> + } + onClick={importFile} + /> {/* TODO Import */} ); @@ -45,6 +53,7 @@ export const CreateNewPagePopup = ({ export const NewPageButton = ({ createNewPage, createNewEdgeless, + importFile, }: NewPageButtonProps) => { const t = useAFFiNEI18N(); const [open, setOpen] = useState(false); @@ -68,6 +77,10 @@ export const NewPageButton = ({ createNewEdgeless(); setOpen(false); }} + importFile={() => { + importFile(); + setOpen(false); + }} /> } > diff --git a/packages/component/src/components/page-list/mobile.tsx b/packages/component/src/components/page-list/mobile.tsx index 2c738219d2..c1b8175cb1 100644 --- a/packages/component/src/components/page-list/mobile.tsx +++ b/packages/component/src/components/page-list/mobile.tsx @@ -21,10 +21,12 @@ const MobileHead = ({ isPublicWorkspace, createNewPage, createNewEdgeless, + importFile, }: { isPublicWorkspace: boolean; createNewPage: () => void; createNewEdgeless: () => void; + importFile: () => void; }) => { const t = useAFFiNEI18N(); return ( @@ -43,6 +45,7 @@ const MobileHead = ({ @@ -57,11 +60,13 @@ export const AllPageListMobileView = ({ isPublicWorkspace, createNewPage, createNewEdgeless, + importFile, }: { isPublicWorkspace: boolean; list: ListData[]; createNewPage: () => void; createNewEdgeless: () => void; + importFile: () => void; }) => { return ( @@ -70,6 +75,7 @@ export const AllPageListMobileView = ({ isPublicWorkspace={isPublicWorkspace} createNewPage={createNewPage} createNewEdgeless={createNewEdgeless} + importFile={importFile} /> void; onCreateNewEdgeless: () => void; + onImportFile: () => void; }; diff --git a/packages/component/src/stories/page-list.stories.tsx b/packages/component/src/stories/page-list.stories.tsx index 34bb93fa9b..173fda6022 100644 --- a/packages/component/src/stories/page-list.stories.tsx +++ b/packages/component/src/stories/page-list.stories.tsx @@ -63,6 +63,7 @@ AffineAllPageList.args = { isPublicWorkspace: false, onCreateNewPage: () => toast('Create new page'), onCreateNewEdgeless: () => toast('Create new edgeless'), + onImportFile: () => toast('Import file'), list: [ { pageId: '1', diff --git a/packages/i18n/src/resources/en.json b/packages/i18n/src/resources/en.json index b71802ce1e..d1584814d5 100644 --- a/packages/i18n/src/resources/en.json +++ b/packages/i18n/src/resources/en.json @@ -22,6 +22,8 @@ "com.affine.write_with_a_blank_page": "Write with a blank page", "com.affine.new_edgeless": "New Edgeless", "com.affine.draw_with_a_blank_whiteboard": "Draw with a blank whiteboard", + "com.affine.new_import": "Import", + "com.affine.import_file": "Support Markdown/Notion", "New Keyword Page": "New '{{query}}' page", "Find 0 result": "Find 0 result", "Find results": "Find {{number}} results",