init: the first public commit for AFFiNE

2026-08-24 05:07:06 +08:00 · 2022-07-22 15:49:21 +08:00
commit e3e3741393
1451 changed files with 108124 additions and 0 deletions
@@ -0,0 +1,146 @@
+import style9 from 'style9';
+import LanguageIcon from '@mui/icons-material/Language';
+import { useState, MouseEvent } from 'react';
+import InsertLinkIcon from '@mui/icons-material/InsertLink';
+import ShareIcon from '@mui/icons-material/Share';
+import {
+    MuiSnackbar as Snackbar,
+    MuiButton as Button,
+    MuiDivider as Divider,
+    MuiInputBase as InputBase,
+    MuiPaper as Paper,
+    MuiSwitch as Switch,
+    Popover,
+} from '@toeverything/components/ui';
+import { copyToClipboard } from '@toeverything/utils';
+
+const styles = style9.create({
+    pageShareBox: {
+        width: '500px',
+        padding: '30px 20px 50px 20px',
+    },
+    btnPageShare: {
+        width: '24px',
+        height: '24px',
+    },
+    pageShareBoxIcon: {
+        position: 'absolute',
+        left: '5px',
+        top: '10px',
+        color: 'var(--color-gray-400)',
+    },
+    pageShareBoxForWeb: {
+        position: 'relative',
+        paddingLeft: '40px',
+        borderBottom: '1px solid var(--color-gray-400))',
+        marginBottom: '15px',
+    },
+    pageShareBoxSwitch: {
+        position: 'absolute',
+        right: '5px',
+        top: '10px',
+    },
+    pageShareBoxForWebP1: {
+        fontWeight: 'bold',
+        marginBottom: '5px',
+    },
+    pageShareBoxForWebP2: {
+        color: 'var(--color-gray-400)',
+    },
+    copyLinkBtn: {
+        marginTop: '15px',
+        float: 'right',
+        cursor: 'pointer',
+    },
+    copyLinkcon: {
+        verticalAlign: 'middle',
+    },
+});
+const MESSAGES = {
+    COPY_LINK: ' Copy Link',
+    INVITE: 'Add people,emails, or groups',
+    SHARE_TO_WEB: 'Share to web',
+    SHARE_TO_ANYONE: 'Publish and share link with any one',
+    COPY_LINK_SUCCESS: 'Copyed link to clipboard',
+};
+function PageSharePortal() {
+    const [alertOpen, setAlertOpen] = useState(false);
+    const handleCopy = () => {
+        copyToClipboard(window.location.href);
+        setAlertOpen(true);
+    };
+    const handleAlertClose = () => {
+        setAlertOpen(false);
+    };
+
+    return (
+        <div>
+            <Popover
+                placement="bottom-start"
+                trigger="click"
+                content={
+                    <div className={styles('pageShareBox')}>
+                        <div className={styles('pageShareBoxForWeb')}>
+                            <LanguageIcon
+                                className={styles('pageShareBoxIcon')}
+                            />
+                            <p className={styles('pageShareBoxForWebP1')}>
+                                {MESSAGES.SHARE_TO_WEB}
+                            </p>
+                            <p className={styles('pageShareBoxForWebP2')}>
+                                {MESSAGES.SHARE_TO_ANYONE}
+                            </p>
+                            <div className={styles('pageShareBoxSwitch')}>
+                                <Switch />
+                            </div>
+                        </div>
+
+                        <div>
+                            <Paper
+                                component="form"
+                                sx={{
+                                    p: '0px',
+                                    display: 'flex',
+                                    alignItems: 'center',
+                                    width: 460,
+                                }}
+                            >
+                                <InputBase
+                                    sx={{ ml: 1, flex: 1 }}
+                                    placeholder={MESSAGES.INVITE}
+                                />
+                                <Button variant="contained">Invite</Button>
+                            </Paper>
+                        </div>
+                        <div>
+                            <a
+                                className={styles('copyLinkBtn')}
+                                onClick={handleCopy}
+                            >
+                                <InsertLinkIcon
+                                    className={styles('copyLinkcon')}
+                                />
+                                {MESSAGES.COPY_LINK}
+                            </a>
+                        </div>
+                        <Snackbar
+                            anchorOrigin={{
+                                vertical: 'bottom',
+                                horizontal: 'center',
+                            }}
+                            open={alertOpen}
+                            message={MESSAGES.COPY_LINK_SUCCESS}
+                            key={'bottomcenter'}
+                            autoHideDuration={2000}
+                            onClose={handleAlertClose}
+                        />
+                    </div>
+                }
+            >
+                <ShareIcon style={{ marginTop: '8px' }} />
+            </Popover>
+        </div>
+    );
+}
+
+export { PageSharePortal };