mirror of
https://github.com/toeverything/AFFiNE.git
synced 2025-01-01 02:18:14 +03:00
refactor(page): rename pageId
This commit is contained in:
parent
9442c023e5
commit
281c3f6c44
@ -14,7 +14,7 @@ type EdgelessProps = {
|
||||
};
|
||||
|
||||
export const Edgeless = (props: EdgelessProps) => {
|
||||
const { page_id } = useParams();
|
||||
const { pageId } = useParams();
|
||||
const { user } = useUserAndSpaces();
|
||||
|
||||
useEffect(() => {
|
||||
@ -31,7 +31,5 @@ export const Edgeless = (props: EdgelessProps) => {
|
||||
update_recent_pages();
|
||||
}, [user, props.workspace]);
|
||||
|
||||
return (
|
||||
<MemoAffineBoard workspace={props.workspace} rootBlockId={page_id} />
|
||||
);
|
||||
return <MemoAffineBoard workspace={props.workspace} rootBlockId={pageId} />;
|
||||
};
|
||||
|
@ -15,11 +15,11 @@ export function WorkspaceContainer() {
|
||||
<Route path="/" element={<WorkspaceRootContainer />}>
|
||||
<Route path="/pages" element={<Pages />} />
|
||||
<Route
|
||||
path="/:page_id/edgeless"
|
||||
path="/:pageId/edgeless"
|
||||
element={<Edgeless workspace={workspaceId} />}
|
||||
/>
|
||||
<Route
|
||||
path="/:page_id"
|
||||
path="/:pageId"
|
||||
element={<Page workspace={workspaceId} />}
|
||||
/>
|
||||
<Route path="/" element={<WorkspaceHome />} />
|
||||
|
@ -34,7 +34,7 @@ export function Page(props: PageProps) {
|
||||
const [activeTab, setActiveTab] = useState(
|
||||
TabMap.get(TAB_TITLE.PAGES).value
|
||||
);
|
||||
const { page_id } = useParams();
|
||||
const { pageId } = useParams();
|
||||
const { showSpaceSidebar, fixedDisplay, setSpaceSidebarVisible } =
|
||||
useShowSpaceSidebar();
|
||||
const dailyNotesFlag = useFlag('BooleanDailyNotes', false);
|
||||
@ -79,7 +79,7 @@ export function Page(props: PageProps) {
|
||||
</div>
|
||||
<div>
|
||||
<CollapsiblePageTree title="PAGES">
|
||||
{page_id ? <PageTree /> : null}
|
||||
{pageId ? <PageTree /> : null}
|
||||
</CollapsiblePageTree>
|
||||
</div>
|
||||
</div>
|
||||
@ -91,7 +91,7 @@ export function Page(props: PageProps) {
|
||||
</WorkspaceSidebarContent>
|
||||
</WorkspaceSidebar>
|
||||
</LigoLeftContainer>
|
||||
<EditorContainer workspace={props.workspace} pageId={page_id} />
|
||||
<EditorContainer workspace={props.workspace} pageId={pageId} />
|
||||
</LigoApp>
|
||||
);
|
||||
}
|
||||
|
@ -38,7 +38,7 @@ export type CollapsiblePageTreeProps = {
|
||||
export function CollapsiblePageTree(props: CollapsiblePageTreeProps) {
|
||||
const { className, style, children, title, initialOpen = true } = props;
|
||||
const navigate = useNavigate();
|
||||
const { workspaceId, page_id } = useParams();
|
||||
const { workspaceId, pageId } = useParams();
|
||||
|
||||
const { handleAddPage } = usePageTree();
|
||||
const { addPageToday } = useCalendarHeatmap();
|
||||
@ -46,7 +46,7 @@ export function CollapsiblePageTree(props: CollapsiblePageTreeProps) {
|
||||
const [open, setOpen] = useState(initialOpen);
|
||||
|
||||
const create_page = useCallback(async () => {
|
||||
if (page_id) {
|
||||
if (pageId) {
|
||||
const newPage = await services.api.editorBlock.create({
|
||||
workspace: workspaceId,
|
||||
type: 'page' as const,
|
||||
@ -57,7 +57,7 @@ export function CollapsiblePageTree(props: CollapsiblePageTreeProps) {
|
||||
|
||||
navigate(`/${workspaceId}/${newPage.id}`);
|
||||
}
|
||||
}, [addPageToday, handleAddPage, navigate, page_id, workspaceId]);
|
||||
}, [addPageToday, handleAddPage, navigate, pageId, workspaceId]);
|
||||
|
||||
const [newPageBtnVisible, setNewPageBtnVisible] = useState<boolean>(false);
|
||||
|
||||
|
@ -116,7 +116,7 @@ const renderTOCContent = tocDataSource => {
|
||||
};
|
||||
|
||||
export const TOC = () => {
|
||||
const { page_id } = useParams();
|
||||
const { pageId } = useParams();
|
||||
const [tocDataSource, setTocDataSource] = useState<TOCType[]>([]);
|
||||
const [activeBlockId, setActiveBlockId] = useState('');
|
||||
|
||||
@ -124,7 +124,7 @@ export const TOC = () => {
|
||||
const listenerMapRef = useRef<ListenerMap>(new Map());
|
||||
|
||||
const { currentEditors } = useCurrentEditors();
|
||||
const editor = currentEditors[page_id] as Virgo;
|
||||
const editor = currentEditors[pageId] as Virgo;
|
||||
|
||||
const updateTocDataSource = useCallback(async () => {
|
||||
if (!editor) {
|
||||
@ -134,7 +134,7 @@ export const TOC = () => {
|
||||
const listenerMap = listenerMapRef.current;
|
||||
|
||||
/* page listener: trigger update-notice when add new group */
|
||||
const pageAsyncBlock = (await editor.getBlockByIds([page_id]))?.[0];
|
||||
const pageAsyncBlock = (await editor.getBlockByIds([pageId]))?.[0];
|
||||
if (!listenerMap.has(pageAsyncBlock.id)) {
|
||||
listenerMap.set(
|
||||
pageAsyncBlock.id,
|
||||
@ -144,7 +144,7 @@ export const TOC = () => {
|
||||
|
||||
/* block listener: trigger update-notice when change block content */
|
||||
const { children = [] } =
|
||||
(await editor.queryByPageId(page_id))?.[0] || {};
|
||||
(await editor.queryByPageId(pageId))?.[0] || {};
|
||||
const asyncBlocks = (await editor.getBlockByIds(children)) || [];
|
||||
const { tocContents } = await getContentByAsyncBlocks(
|
||||
asyncBlocks,
|
||||
@ -155,7 +155,7 @@ export const TOC = () => {
|
||||
/* toc: flat content */
|
||||
const tocDataSource = getPageTOC(asyncBlocks, tocContents);
|
||||
setTocDataSource(tocDataSource);
|
||||
}, [editor, page_id]);
|
||||
}, [editor, pageId]);
|
||||
|
||||
/* init toc and add page/block update-listener & unmount-listener */
|
||||
useEffect(() => {
|
||||
|
@ -6,16 +6,16 @@ import { CreateView } from '@toeverything/framework/virgo';
|
||||
type RefLinkView = CreateView;
|
||||
|
||||
export const RefLinkView = ({ block, editor }: RefLinkView) => {
|
||||
const page_id = useMemo(() => block.getProperty('reference'), [block]);
|
||||
const pageId = useMemo(() => block.getProperty('reference'), [block]);
|
||||
|
||||
const [block_content, set_block] =
|
||||
useState<Awaited<ReturnType<typeof editor.search>>[number]>();
|
||||
|
||||
useEffect(() => {
|
||||
editor
|
||||
.search({ tag: `id:${page_id}` })
|
||||
.search({ tag: `id:${pageId}` })
|
||||
.then(block => set_block(block[0]));
|
||||
}, [editor, page_id]);
|
||||
}, [editor, pageId]);
|
||||
|
||||
return <InlineRefLink block={block_content} pageId={page_id} />;
|
||||
return <InlineRefLink block={block_content} pageId={pageId} />;
|
||||
};
|
||||
|
@ -8,7 +8,7 @@ export const useAddComment = ({
|
||||
selectionInfo,
|
||||
setShow,
|
||||
}: WithEditorSelectionType) => {
|
||||
const { workspaceId, page_id: pageId } = useParams();
|
||||
const { workspaceId, pageId } = useParams();
|
||||
const [currentComment, setCurrentComment] = useState('');
|
||||
|
||||
const createComment = useCallback(async (): Promise<{
|
||||
|
@ -44,7 +44,7 @@ export const DoubleLinkMenu = ({
|
||||
hooks,
|
||||
style,
|
||||
}: DoubleLinkMenuProps) => {
|
||||
const { page_id: curPageId } = useParams();
|
||||
const { pageId: curPageId } = useParams();
|
||||
const [isOpen, setIsOpen] = useState(false);
|
||||
const [anchorEl, setAnchorEl] = useState(null);
|
||||
const dialogRef = useRef<HTMLDivElement>();
|
||||
|
@ -42,7 +42,7 @@ const normalizeUrl = (url: string) => {
|
||||
};
|
||||
|
||||
export const LinkMenu = ({ editor, hooks }: LinkMenuProps) => {
|
||||
const { page_id: curPageId } = useParams();
|
||||
const { pageId: curPageId } = useParams();
|
||||
const [isOpen, setIsOpen] = useState(false);
|
||||
const [anchorEl, setAnchorEl] = useState(null);
|
||||
const dialogRef = useRef<HTMLDivElement>();
|
||||
|
@ -9,7 +9,7 @@ import { useParams } from 'react-router-dom';
|
||||
import type { CommentInfo } from './type';
|
||||
|
||||
export const useComments = () => {
|
||||
const { workspaceId, page_id: pageId } = useParams();
|
||||
const { workspaceId, pageId } = useParams();
|
||||
|
||||
const [comments, setComments] = useState<CommentInfo[]>([]);
|
||||
const [observeIds, setObserveIds] = useState<string[]>([]);
|
||||
@ -71,7 +71,7 @@ export const useComments = () => {
|
||||
};
|
||||
|
||||
export const useActiveComment = () => {
|
||||
const { workspaceId, page_id: pageId } = useParams();
|
||||
const { workspaceId, pageId } = useParams();
|
||||
const { currentEditors } = useCurrentEditors();
|
||||
const editor = useMemo(() => {
|
||||
return currentEditors[pageId] as Virgo;
|
||||
|
@ -47,8 +47,8 @@ export async function fetchActivitiesHeatmap(
|
||||
// const pages = await db.getByType('page');
|
||||
const pages_with_ids = (await Promise.all(
|
||||
flattenedItems.map(async (page_item: any) => {
|
||||
const page_id = page_item.id;
|
||||
return [page_id, await db.get(page_id as 'page')];
|
||||
const pageId = page_item.id;
|
||||
return [pageId, await db.get(pageId as 'page')];
|
||||
})
|
||||
)) as [string, BlockImplInstance][];
|
||||
const pages = new Map(pages_with_ids);
|
||||
|
@ -57,7 +57,9 @@ export const TreeItem = forwardRef<HTMLDivElement, TreeItemProps>(
|
||||
},
|
||||
ref
|
||||
) => {
|
||||
const { workspaceId, page_id } = useParams();
|
||||
const params = useParams();
|
||||
const workspaceId = params['workspaceId'];
|
||||
const curPageId = params['pageId'];
|
||||
const BooleanPageTreeItemMoreActions = useFlag(
|
||||
'BooleanPageTreeItemMoreActions',
|
||||
true
|
||||
@ -71,7 +73,7 @@ export const TreeItem = forwardRef<HTMLDivElement, TreeItemProps>(
|
||||
disableSelection={disableSelection}
|
||||
disableInteraction={disableInteraction}
|
||||
spacing={`${indentationWidth * depth + 12}px`}
|
||||
active={pageId === page_id}
|
||||
active={pageId === curPageId}
|
||||
{...props}
|
||||
>
|
||||
{childCount !== 0 ? (
|
||||
|
@ -19,7 +19,7 @@ import {
|
||||
const page_tree_atom = atom<TreeItems | undefined>([]);
|
||||
|
||||
export const usePageTree = ({ indentationWidth = 16 }: DndTreeProps = {}) => {
|
||||
const { workspaceId, page_id } = useParams();
|
||||
const { workspaceId, pageId } = useParams();
|
||||
const navigate = useNavigate();
|
||||
const [items] = useAtom(page_tree_atom);
|
||||
const [activeId, setActiveId] = useState<string | undefined>(undefined);
|
||||
@ -132,7 +132,7 @@ export const usePageTree = ({ indentationWidth = 16 }: DndTreeProps = {}) => {
|
||||
await services.api.userConfig.removePage(workspaceId, id);
|
||||
//remove page from jwst
|
||||
await services.api.pageTree.removePage(workspaceId, id);
|
||||
if (id === page_id) {
|
||||
if (id === pageId) {
|
||||
navigate(`/${workspaceId}`);
|
||||
}
|
||||
},
|
||||
@ -140,8 +140,8 @@ export const usePageTree = ({ indentationWidth = 16 }: DndTreeProps = {}) => {
|
||||
);
|
||||
|
||||
const handleAddPage = useCallback(
|
||||
async (page_id?: string) => {
|
||||
await savePageTreeData([{ id: page_id, children: [] }, ...items]);
|
||||
async (pageId?: string) => {
|
||||
await savePageTreeData([{ id: pageId, children: [] }, ...items]);
|
||||
},
|
||||
[items, savePageTreeData]
|
||||
);
|
||||
@ -177,7 +177,7 @@ export const usePageTree = ({ indentationWidth = 16 }: DndTreeProps = {}) => {
|
||||
|
||||
export const useDndTreeAutoUpdate = () => {
|
||||
const [, set_items] = useAtom(page_tree_atom);
|
||||
const { workspaceId, page_id } = useParams();
|
||||
const { workspaceId, pageId } = useParams();
|
||||
|
||||
const fetch_page_tree_data = useCallback(async () => {
|
||||
const pages = await services.api.pageTree.getPageTree<TreeItem>(
|
||||
@ -191,11 +191,11 @@ export const useDndTreeAutoUpdate = () => {
|
||||
}, [fetch_page_tree_data]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!page_id) return () => {};
|
||||
if (!pageId) return () => {};
|
||||
let unobserve: () => void;
|
||||
const auto_update_page_tree = async () => {
|
||||
unobserve = await services.api.pageTree.observe(
|
||||
{ workspace: workspaceId, page: page_id },
|
||||
{ workspace: workspaceId, page: pageId },
|
||||
() => {
|
||||
fetch_page_tree_data();
|
||||
}
|
||||
@ -206,5 +206,5 @@ export const useDndTreeAutoUpdate = () => {
|
||||
return () => {
|
||||
unobserve?.();
|
||||
};
|
||||
}, [fetch_page_tree_data, page_id, workspaceId]);
|
||||
}, [fetch_page_tree_data, pageId, workspaceId]);
|
||||
};
|
||||
|
@ -266,36 +266,33 @@ export class EditorBlock extends ServiceBaseClass {
|
||||
}
|
||||
async copyPage(
|
||||
workspaceId: string,
|
||||
source_page_id: string,
|
||||
new_page_id: string
|
||||
sourcePageId: string,
|
||||
newPageId: string
|
||||
): Promise<boolean> {
|
||||
const db = await this.database.getDatabase(workspaceId);
|
||||
|
||||
const source_page = await this.getBlock(
|
||||
const sourcePage = await this.getBlock(
|
||||
workspaceId,
|
||||
source_page_id as 'block'
|
||||
sourcePageId as 'block'
|
||||
);
|
||||
const new_page = await this.getBlock(
|
||||
workspaceId,
|
||||
new_page_id as 'block'
|
||||
);
|
||||
if (!source_page) {
|
||||
const newPage = await this.getBlock(workspaceId, newPageId as 'block');
|
||||
if (!sourcePage) {
|
||||
return false;
|
||||
}
|
||||
const source_page_children = source_page.children;
|
||||
const decorations = source_page.getDecorations();
|
||||
const sourcePageChildren = sourcePage.children;
|
||||
const decorations = sourcePage.getDecorations();
|
||||
Object.entries(decorations).forEach(([key, value]) => {
|
||||
new_page?.setDecoration(key, source_page.getDecoration(key));
|
||||
newPage?.setDecoration(key, sourcePage.getDecoration(key));
|
||||
});
|
||||
|
||||
//@ts-ignore
|
||||
this.decorate_page_title(new_page, 'copy from ');
|
||||
this.decorate_page_title(newPage, 'copy from ');
|
||||
|
||||
for (let i = 0; i < source_page_children.length; i++) {
|
||||
const source_page_child = await db.get(
|
||||
source_page_children[i] as 'block'
|
||||
for (let i = 0; i < sourcePageChildren.length; i++) {
|
||||
const sourcePageChild = await db.get(
|
||||
sourcePageChildren[i] as 'block'
|
||||
);
|
||||
new_page?.insertChildren(source_page_child);
|
||||
newPage?.insertChildren(sourcePageChild);
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
@ -350,7 +350,7 @@ export class YjsAdapter implements AsyncDatabaseAdapter<YjsContentOperation> {
|
||||
const [file] = (await fromEvent(handles)) as File[];
|
||||
const binary = await file?.arrayBuffer();
|
||||
console.log(this._provider.providers);
|
||||
let { indexeddb } = (
|
||||
const { indexeddb } = (
|
||||
this._provider.providers as any[]
|
||||
).find(p => p.indexeddb);
|
||||
await indexeddb?.idb?.clearData();
|
||||
@ -391,9 +391,9 @@ export class YjsAdapter implements AsyncDatabaseAdapter<YjsContentOperation> {
|
||||
},
|
||||
parse: () => this._doc.toJSON(),
|
||||
// eslint-disable-next-line @typescript-eslint/naming-convention
|
||||
parse_page: (page_id: string) => {
|
||||
parse_page: (pageId: string) => {
|
||||
const blocks = this._blocks.toJSON();
|
||||
return resolve_block(blocks, page_id);
|
||||
return resolve_block(blocks, pageId);
|
||||
},
|
||||
// eslint-disable-next-line @typescript-eslint/naming-convention
|
||||
parse_pages: (resolve = false) => {
|
||||
|
@ -9,7 +9,7 @@ const _currentEditors = atom<EditorsMap>({} as EditorsMap);
|
||||
|
||||
/** hook for using editors outside page */
|
||||
export const useCurrentEditors = () => {
|
||||
const { workspaceId, page_id: pageId } = useParams();
|
||||
const { workspaceId, pageId } = useParams();
|
||||
const { pathname } = useLocation();
|
||||
const [currentEditors, setCurrentEditors] = useAtom(_currentEditors);
|
||||
|
||||
|
@ -6,8 +6,8 @@ export function getUserDisplayName(user?: UserInfo) {
|
||||
}
|
||||
|
||||
/**
|
||||
* Get page_id from URL
|
||||
* @returns page_id
|
||||
* Get pageId from URL
|
||||
* @returns pageId
|
||||
*/
|
||||
export function getPageId() {
|
||||
const path = window.location.pathname.match(/\/(\w+)\/(\w+)/);
|
||||
|
Loading…
Reference in New Issue
Block a user