+
{
switch (layout) {
@@ -42,7 +42,7 @@ function CollabView({ doc }: CollabViewProps) {
const getViewRowsMap = usePublishContext()?.getViewRowsMap;
const loadView = usePublishContext()?.loadView;
- if (!doc) {
+ if (!doc || !View) {
return ;
}
@@ -57,6 +57,7 @@ function CollabView({ doc }: CollabViewProps) {
icon={icon}
cover={cover}
viewId={viewId}
+ name={name}
/>
);
diff --git a/frontend/appflowy_web_app/src/components/publish/PublishView.tsx b/frontend/appflowy_web_app/src/components/publish/PublishView.tsx
index 4cb45e2c1c..a52c2efdd9 100644
--- a/frontend/appflowy_web_app/src/components/publish/PublishView.tsx
+++ b/frontend/appflowy_web_app/src/components/publish/PublishView.tsx
@@ -18,6 +18,7 @@ export function PublishView({ namespace, publishName }: PublishViewProps) {
const openPublishView = useCallback(async () => {
let doc;
+ setNotFound(false);
try {
doc = await service?.getPublishView(namespace, publishName);
} catch (e) {
diff --git a/frontend/appflowy_web_app/src/components/publish/header/Breadcrumb.tsx b/frontend/appflowy_web_app/src/components/publish/header/Breadcrumb.tsx
index 840a202289..77685a4a9a 100644
--- a/frontend/appflowy_web_app/src/components/publish/header/Breadcrumb.tsx
+++ b/frontend/appflowy_web_app/src/components/publish/header/Breadcrumb.tsx
@@ -1,6 +1,6 @@
-import BreadcrumbItem, { Crumb } from 'src/components/publish/header/BreadcrumbItem';
+import BreadcrumbItem, { Crumb } from '@/components/publish/header/BreadcrumbItem';
import React, { useMemo } from 'react';
-import { ReactComponent as RightIcon } from '$icons/16x/right.svg';
+import { ReactComponent as RightIcon } from '@/assets/arrow_right.svg';
export function Breadcrumb({ crumbs }: { crumbs: Crumb[] }) {
const renderCrumb = useMemo(() => {
@@ -9,10 +9,10 @@ export function Breadcrumb({ crumbs }: { crumbs: Crumb[] }) {
const key = crumb.rowId ? `${crumb.viewId}-${crumb.rowId}` : `${crumb.viewId}`;
return (
-
+
{!isLast && }
-
+
);
});
}, [crumbs]);
diff --git a/frontend/appflowy_web_app/src/components/publish/header/BreadcrumbItem.tsx b/frontend/appflowy_web_app/src/components/publish/header/BreadcrumbItem.tsx
index d3b5770221..9d07ece56e 100644
--- a/frontend/appflowy_web_app/src/components/publish/header/BreadcrumbItem.tsx
+++ b/frontend/appflowy_web_app/src/components/publish/header/BreadcrumbItem.tsx
@@ -55,7 +55,7 @@ function BreadcrumbItem({ crumb, disableClick = false }: { crumb: Crumb; disable
>
{renderCrumbIcon(icon)}
{name || t('menuAppHeader.defaultNewPageName')}
diff --git a/frontend/appflowy_web_app/src/components/publish/header/PublishViewHeader.tsx b/frontend/appflowy_web_app/src/components/publish/header/PublishViewHeader.tsx
index a5b8eafd33..2d3187f27c 100644
--- a/frontend/appflowy_web_app/src/components/publish/header/PublishViewHeader.tsx
+++ b/frontend/appflowy_web_app/src/components/publish/header/PublishViewHeader.tsx
@@ -6,11 +6,20 @@ export function PublishViewHeader() {
const viewMeta = usePublishContext()?.viewMeta;
const crumbs = useMemo(() => {
const ancestors = viewMeta?.ancestor_views || [];
+ let icon = viewMeta?.icon;
+
+ try {
+ const extra = viewMeta?.extra ? JSON.parse(viewMeta.extra) : {};
+
+ icon = extra.icon || icon;
+ } catch (e) {
+ // ignore
+ }
return ancestors.map((ancestor) => ({
viewId: ancestor.view_id,
name: ancestor.name,
- icon: ancestor.icon || String(viewMeta?.layout),
+ icon: icon || String(viewMeta?.layout),
}));
}, [viewMeta]);
diff --git a/frontend/appflowy_web_app/src/components/publish/useViewMeta.ts b/frontend/appflowy_web_app/src/components/publish/useViewMeta.ts
index adcbf57b03..e3f37749a0 100644
--- a/frontend/appflowy_web_app/src/components/publish/useViewMeta.ts
+++ b/frontend/appflowy_web_app/src/components/publish/useViewMeta.ts
@@ -22,13 +22,7 @@ export function useViewMeta() {
};
}, [extra]);
- const layout = useMemo(() => {
- if (viewMeta?.layout) {
- return viewMeta.layout;
- }
-
- return;
- }, [viewMeta?.layout]);
+ const layout = viewMeta?.layout;
const style = useMemo(() => {
const fontSizeMap = {
small: '14px',
@@ -96,7 +90,8 @@ export function useViewMeta() {
}, [extra]);
const viewId = viewMeta?.view_id;
-
+ const name = viewMeta?.name;
+
return {
icon,
cover,
@@ -104,5 +99,6 @@ export function useViewMeta() {
layoutClassName,
layout,
viewId,
+ name,
};
}
diff --git a/frontend/appflowy_web_app/src/components/view-meta/ViewMetaPreview.tsx b/frontend/appflowy_web_app/src/components/view-meta/ViewMetaPreview.tsx
index 60716a4454..2fb3882b9b 100644
--- a/frontend/appflowy_web_app/src/components/view-meta/ViewMetaPreview.tsx
+++ b/frontend/appflowy_web_app/src/components/view-meta/ViewMetaPreview.tsx
@@ -57,7 +57,7 @@ export function ViewMetaPreview({ icon, cover, name }: ViewMetaProps) {
const { t } = useTranslation();
return (
-