init: the first public commit for AFFiNE

2026-07-23 13:29:02 +08:00 · 2022-07-22 15:49:21 +08:00
commit e3e3741393
1451 changed files with 108124 additions and 0 deletions
@@ -0,0 +1,34 @@
+import { MuiAvatar as Avatar, Popover } from '@toeverything/components/ui';
+import { useUserAndSpaces } from '@toeverything/datasource/state';
+import { getUserDisplayName } from '@toeverything/utils';
+import { UserMenuList } from './UserMenuList';
+
+/**
+ * An icon is displayed by default, click the icon to display the popover, and the content of the popover is children.
+ */
+export const UserMenuIcon = () => {
+    const { user } = useUserAndSpaces();
+
+    return (
+        <Popover
+            content={<UserMenuList />}
+            placement="bottom-end"
+            trigger="click"
+        >
+            <Avatar
+                // onClick={handleClick}
+                sx={{
+                    width: 26,
+                    height: 26,
+                    mr: 4,
+                    cursor: 'pointer',
+                    fontSize: '1rem',
+                }}
+                alt={getUserDisplayName(user)}
+                src={user?.photo || ''}
+            />
+        </Popover>
+    );
+};
+
+export default UserMenuIcon;
@@ -0,0 +1,66 @@
+import { useMemo } from 'react';
+import { getAuth, signOut } from 'firebase/auth';
+
+import { LOGOUT_COOKIES, LOGOUT_LOCAL_STORAGE } from '@toeverything/utils';
+import { useUserAndSpaces } from '@toeverything/datasource/state';
+import {
+    MuiDivider as Divider,
+    MuiList as List,
+    MuiListItem as ListItem,
+    MuiListItemText as ListItemText,
+} from '@toeverything/components/ui';
+
+export const UserMenuList = () => {
+    const { user } = useUserAndSpaces();
+
+    const user_menu_data = useMemo(() => {
+        return [
+            // {
+            // text: 'Settings',
+            // onClick: () => {
+            // console.log('Open the settings panel');
+            // },
+            // },
+            {
+                text: user?.email || 'Unknown User',
+                showDivider: true,
+            },
+            {
+                text: 'Logout',
+                onClick: async () => {
+                    LOGOUT_LOCAL_STORAGE.forEach(name =>
+                        localStorage.removeItem(name)
+                    );
+                    // localStorage.clear();
+                    document.cookie = LOGOUT_COOKIES.map(
+                        name =>
+                            name + '=; expires=Thu, 01 Jan 1970 00:00:01 GMT;'
+                    ).join(' ');
+
+                    signOut(getAuth());
+
+                    window.location.href = '/';
+                },
+            },
+        ];
+    }, [user?.email]);
+
+    return (
+        <List component="nav" aria-label="user settings">
+            {user_menu_data.map(menu => {
+                const { text, onClick, showDivider } = menu;
+
+                return (
+                    <>
+                        <ListItem button onClick={onClick} key={text}>
+                            <ListItemText primary={text} />
+                        </ListItem>
+                        {showDivider && <Divider />}
+                    </>
+                );
+            })}
+        </List>
+    );
+};
+
+export default UserMenuList;
@@ -0,0 +1,3 @@
+import { UserMenuIcon } from './UserMenuIcon';
+export { UserMenuIcon };
+export default UserMenuIcon;