Feat/land page (#391)

* feat: update landing page

* feat: update landing page

* fix: react warning

* feat(route): rename variables

* feat(route): better refresh

* fix: update logo and i18n

* feat(code): remove unused comment

* refactor(workspace): rename workspaceId

* refactor(page): rename pageId

* feat(edit): more robust editing experience

* fix: landing page mobile

* fix: landing page mobile

Co-authored-by: tzhangchi <terry.zhangchi@outlook.com>
Co-authored-by: DarkSky <25152247+darkskygit@users.noreply.github.com>
This commit is contained in:
zuomeng wang
2022-09-09 10:56:10 +08:00
committed by GitHub
parent bd2668335c
commit b35c9b2c14
35 changed files with 374 additions and 145 deletions
@@ -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 { workspace_id, 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 ? (
@@ -89,12 +91,12 @@ export const TreeItem = forwardRef<HTMLDivElement, TreeItemProps>(
)}
<TreeItemContent {...handleProps}>
<TextLink to={`/${workspace_id}/${pageId}`}>
<TextLink to={`/${workspaceId}/${pageId}`}>
{value}
</TextLink>
{BooleanPageTreeItemMoreActions && (
<MoreActions
workspaceId={workspace_id}
workspaceId={workspaceId}
pageId={pageId}
onRemove={onRemove}
/>
@@ -19,7 +19,7 @@ import {
const page_tree_atom = atom<TreeItems | undefined>([]);
export const usePageTree = ({ indentationWidth = 16 }: DndTreeProps = {}) => {
const { workspace_id, page_id } = useParams();
const { workspaceId, pageId } = useParams();
const navigate = useNavigate();
const [items] = useAtom(page_tree_atom);
const [activeId, setActiveId] = useState<string | undefined>(undefined);
@@ -56,11 +56,11 @@ export const usePageTree = ({ indentationWidth = 16 }: DndTreeProps = {}) => {
const savePageTreeData = useCallback(
async (treeData?: TreeItem[]) => {
await services.api.pageTree.setPageTree<TreeItem>(
workspace_id,
workspaceId,
treeData || []
);
},
[workspace_id]
[workspaceId]
);
const resetState = useCallback(() => {
@@ -129,19 +129,19 @@ export const usePageTree = ({ indentationWidth = 16 }: DndTreeProps = {}) => {
const handleRemove = useCallback(
async (id: string) => {
await savePageTreeData(removeItem(items, id));
await services.api.userConfig.removePage(workspace_id, id);
await services.api.userConfig.removePage(workspaceId, id);
//remove page from jwst
await services.api.pageTree.removePage(workspace_id, id);
if (id === page_id) {
navigate(`/${workspace_id}`);
await services.api.pageTree.removePage(workspaceId, id);
if (id === pageId) {
navigate(`/${workspaceId}`);
}
},
[items, savePageTreeData, workspace_id]
[items, savePageTreeData, workspaceId]
);
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,25 +177,25 @@ export const usePageTree = ({ indentationWidth = 16 }: DndTreeProps = {}) => {
export const useDndTreeAutoUpdate = () => {
const [, set_items] = useAtom(page_tree_atom);
const { workspace_id, page_id } = useParams();
const { workspaceId, pageId } = useParams();
const fetch_page_tree_data = useCallback(async () => {
const pages = await services.api.pageTree.getPageTree<TreeItem>(
workspace_id
workspaceId
);
set_items(pages);
}, [set_items, workspace_id]);
}, [set_items, workspaceId]);
useEffect(() => {
fetch_page_tree_data();
}, [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: workspace_id, 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, workspace_id]);
}, [fetch_page_tree_data, pageId, workspaceId]);
};