feat: enable share menu (#1883)

Co-authored-by: JimmFly <yangjinfei001@gmail.com>
2026-07-22 20:46:38 +08:00 · 2023-04-13 16:22:49 -05:00
parent 32b206a137
commit 01a686dc28
48 changed files with 2666 additions and 2113 deletions
@@ -0,0 +1,59 @@
+import { useTranslation } from '@affine/i18n';
+import type { Page } from '@blocksuite/store';
+import { useBlockSuiteWorkspacePageIsPublic } from '@toeverything/hooks/use-blocksuite-workspace-page-is-public';
+import { useCallback } from 'react';
+
+import { Modal, ModalCloseButton, toast } from '../../..';
+import {
+  StyledButton,
+  StyledButtonContent,
+  StyledDangerButton,
+  StyledModalHeader,
+  StyledModalWrapper,
+  StyledTextContent,
+} from './style';
+
+export type PublicLinkDisableProps = {
+  page: Page;
+  open: boolean;
+  onClose: () => void;
+};
+
+export const PublicLinkDisableModal = ({
+  page,
+  open,
+  onClose,
+}: PublicLinkDisableProps) => {
+  const { t } = useTranslation();
+  const [, setIsPublic] = useBlockSuiteWorkspacePageIsPublic(page);
+  const handleDisable = useCallback(() => {
+    setIsPublic(false);
+    toast('Successfully disabled', {
+      portal: document.body,
+    });
+    onClose();
+  }, []);
+  return (
+    <Modal open={open} onClose={onClose}>
+      <StyledModalWrapper>
+        <ModalCloseButton onClick={onClose} top={12} right={12} />
+        <StyledModalHeader>{t('Disable Public Link ?')}</StyledModalHeader>
+
+        <StyledTextContent>
+          {t('Disable Public Link Description')}
+        </StyledTextContent>
+
+        <StyledButtonContent>
+          <StyledButton onClick={onClose}>{t('Cancel')}</StyledButton>
+          <StyledDangerButton
+            data-testid="disable-public-link-confirm-button"
+            onClick={handleDisable}
+            style={{ marginLeft: '24px' }}
+          >
+            {t('Disable')}
+          </StyledDangerButton>
+        </StyledButtonContent>
+      </StyledModalWrapper>
+    </Modal>
+  );
+};
@@ -0,0 +1,63 @@
+import { styled, TextButton } from '@affine/component';
+
+export const StyledModalWrapper = styled('div')(({ theme }) => {
+  return {
+    position: 'relative',
+    padding: '0px',
+    width: '560px',
+    background: theme.colors.popoverBackground,
+    borderRadius: '12px',
+    // height: '312px',
+  };
+});
+
+export const StyledModalHeader = styled('div')(({ theme }) => {
+  return {
+    margin: '44px 0px 12px 0px',
+    width: '560px',
+    fontWeight: '600',
+    fontSize: theme.font.h6,
+    textAlign: 'center',
+  };
+});
+
+export const StyledTextContent = styled('div')(({ theme }) => {
+  return {
+    margin: 'auto',
+    width: '560px',
+    padding: '0px 84px',
+    fontWeight: '400',
+    fontSize: theme.font.base,
+    textAlign: 'center',
+  };
+});
+
+export const StyledButtonContent = styled('div')(() => {
+  return {
+    margin: '32px 0',
+    display: 'flex',
+    flexDirection: 'row',
+    justifyContent: 'center',
+  };
+});
+export const StyledButton = styled(TextButton)(({ theme }) => {
+  return {
+    color: theme.colors.primaryColor,
+    height: '32px',
+    background: '#F3F0FF',
+    border: 'none',
+    borderRadius: '8px',
+    padding: '4px 20px',
+  };
+});
+export const StyledDangerButton = styled(TextButton)(({ theme }) => {
+  return {
+    color: '#FF631F',
+    height: '32px',
+    background:
+      'linear-gradient(0deg, rgba(255, 99, 31, 0.1), rgba(255, 99, 31, 0.1)), #FFFFFF;',
+    border: 'none',
+    borderRadius: '8px',
+    padding: '4px 20px',
+  };
+});