diff --git a/packages/frontend/core/src/components/cloud/share-header-right-item/authenticated-item.tsx b/packages/frontend/core/src/components/cloud/share-header-right-item/authenticated-item.tsx
deleted file mode 100644
index 64dc2d12e1..0000000000
--- a/packages/frontend/core/src/components/cloud/share-header-right-item/authenticated-item.tsx
+++ /dev/null
@@ -1,49 +0,0 @@
-import { Button } from '@affine/component/ui/button';
-import { useNavigateHelper } from '@affine/core/hooks/use-navigate-helper';
-import { useI18n } from '@affine/i18n';
-import {
- useLiveData,
- useService,
- WorkspacesService,
-} from '@toeverything/infra';
-import { useCallback, useEffect } from 'react';
-
-import type { ShareHeaderRightItemProps } from './index';
-import * as styles from './styles.css';
-
-export const AuthenticatedItem = ({
- setIsMember,
- ...props
-}: { setIsMember: (value: boolean) => void } & ShareHeaderRightItemProps) => {
- const { workspaceId, pageId } = props;
-
- const workspacesService = useService(WorkspacesService);
- const workspaces = useLiveData(workspacesService.list.workspaces$);
- const isMember = workspaces?.some(workspace => workspace.id === workspaceId);
- const t = useI18n();
- const { jumpToPage } = useNavigateHelper();
-
- const handleEdit = useCallback(() => {
- jumpToPage(workspaceId, pageId);
- }, [workspaceId, pageId, jumpToPage]);
-
- useEffect(() => {
- if (isMember) {
- setIsMember(true);
- }
- }, [isMember, setIsMember]);
-
- if (isMember) {
- return (
-
- );
- }
-
- return null;
-};
diff --git a/packages/frontend/core/src/components/cloud/share-header-right-item/index.tsx b/packages/frontend/core/src/components/cloud/share-header-right-item/index.tsx
index 6d3324105c..68af19d881 100644
--- a/packages/frontend/core/src/components/cloud/share-header-right-item/index.tsx
+++ b/packages/frontend/core/src/components/cloud/share-header-right-item/index.tsx
@@ -1,9 +1,8 @@
import { AuthService } from '@affine/core/modules/cloud';
import { type DocMode, useLiveData, useService } from '@toeverything/infra';
-import { useState } from 'react';
-import { AuthenticatedItem } from './authenticated-item';
import { PresentButton } from './present';
+import { SignIn } from './sign-in';
import * as styles from './styles.css';
import { PublishPageUserAvatar } from './user-avatar';
@@ -16,20 +15,16 @@ export type ShareHeaderRightItemProps = {
const ShareHeaderRightItem = ({ ...props }: ShareHeaderRightItemProps) => {
const loginStatus = useLiveData(useService(AuthService).session.status$);
const { publishMode } = props;
- const [isMember, setIsMember] = useState(false);
-
- // TODO(@JimmFly): Add TOC
+ const authenticated = loginStatus === 'authenticated';
return (
- {loginStatus === 'authenticated' ? (
-
- ) : null}
+ {authenticated ? null :
}
{publishMode === 'edgeless' ?
: null}
- {loginStatus === 'authenticated' ? (
+ {authenticated ? (
<>
diff --git a/packages/frontend/core/src/components/cloud/share-header-right-item/sign-in.tsx b/packages/frontend/core/src/components/cloud/share-header-right-item/sign-in.tsx
new file mode 100644
index 0000000000..0bbeb32ebe
--- /dev/null
+++ b/packages/frontend/core/src/components/cloud/share-header-right-item/sign-in.tsx
@@ -0,0 +1,30 @@
+import { Button } from '@affine/component/ui/button';
+import { authAtom } from '@affine/core/atoms';
+import { useI18n } from '@affine/i18n';
+import { useSetAtom } from 'jotai';
+import { useCallback } from 'react';
+
+import * as styles from './styles.css';
+
+export const SignIn = () => {
+ const setOpen = useSetAtom(authAtom);
+
+ const t = useI18n();
+
+ const onClickSignIn = useCallback(() => {
+ setOpen(state => ({
+ ...state,
+ openModal: true,
+ }));
+ }, [setOpen]);
+
+ return (
+
+ );
+};
diff --git a/packages/frontend/core/src/pages/workspace/share/share-header.tsx b/packages/frontend/core/src/pages/workspace/share/share-header.tsx
index 82619a4d39..7782f36316 100644
--- a/packages/frontend/core/src/pages/workspace/share/share-header.tsx
+++ b/packages/frontend/core/src/pages/workspace/share/share-header.tsx
@@ -1,6 +1,7 @@
import { BlocksuiteHeaderTitle } from '@affine/core/components/blocksuite/block-suite-header/title';
import { EditorModeSwitch } from '@affine/core/components/blocksuite/block-suite-mode-switch';
import ShareHeaderRightItem from '@affine/core/components/cloud/share-header-right-item';
+import { AuthModal } from '@affine/core/providers/modal-provider';
import type { DocCollection } from '@blocksuite/store';
import type { DocMode } from '@toeverything/infra';
@@ -25,6 +26,7 @@ export function ShareHeader({
pageId={pageId}
publishMode={publishMode}
/>
+
);
}
diff --git a/packages/frontend/i18n/src/resources/en.json b/packages/frontend/i18n/src/resources/en.json
index 8ae47575df..7db4dd6be9 100644
--- a/packages/frontend/i18n/src/resources/en.json
+++ b/packages/frontend/i18n/src/resources/en.json
@@ -1408,6 +1408,7 @@
"com.affine.share-page.footer.description": "Empower your sharing with AFFiNE Cloud: One-click doc sharing",
"com.affine.share-page.footer.get-started": "Get started for free",
"com.affine.share-page.header.present": "Present",
+ "com.affine.share-page.header.login": "Login or Sign Up",
"com.affine.shortcutsTitle.edgeless": "Edgeless",
"com.affine.shortcutsTitle.general": "General",
"com.affine.shortcutsTitle.markdownSyntax": "Markdown syntax",
diff --git a/tests/affine-cloud/e2e/share-page.spec.ts b/tests/affine-cloud/e2e/share-page.spec.ts
index eea6a4d5bc..99d9f38454 100644
--- a/tests/affine-cloud/e2e/share-page.spec.ts
+++ b/tests/affine-cloud/e2e/share-page.spec.ts
@@ -111,8 +111,6 @@ test('share page with default edgeless', async ({ page, browser }) => {
expect(page2.locator('affine-paragraph').first()).toContainText(
'TEST CONTENT'
);
- const editButton = page2.getByTestId('share-page-edit-button');
- await expect(editButton).not.toBeVisible();
}
});