refactor(store): port to useGlobalState with zustand (#1012)

This commit is contained in:
Himself65
2023-02-14 23:38:21 -06:00
committed by GitHub
parent 2b3ec1240a
commit 6a8aff9e56
29 changed files with 304 additions and 207 deletions

View File

@@ -19,7 +19,7 @@ import { Tooltip } from '@affine/component';
import useCurrentPageMeta from '@/hooks/use-current-page-meta';
import useHistoryUpdated from '@/hooks/use-history-update';
import { useTranslation } from '@affine/i18n';
import { useBlockSuite } from '@/store/workspace';
import { useGlobalState } from '@/store/app';
const useToolbarList1 = () => {
const { t } = useTranslation();
@@ -87,7 +87,7 @@ const useToolbarList1 = () => {
const UndoRedo = () => {
const [canUndo, setCanUndo] = useState(false);
const [canRedo, setCanRedo] = useState(false);
const currentPage = useBlockSuite(store => store.currentPage);
const currentPage = useGlobalState(store => store.currentPage);
const onHistoryUpdated = useHistoryUpdated();
const { t } = useTranslation();
useEffect(() => {

View File

@@ -5,6 +5,7 @@ import { CloseIcon } from '@blocksuite/icons';
import { useRouter } from 'next/router';
import { useState } from 'react';
import { Content, ContentTitle, Header, StyleButton, StyleTips } from './style';
import { useGlobalState } from '@/store/app';
interface EnableWorkspaceModalProps {
open: boolean;
@@ -16,7 +17,10 @@ export const EnableWorkspaceModal = ({
onClose,
}: EnableWorkspaceModalProps) => {
const { t } = useTranslation();
const { user, dataCenter, login, currentWorkspace } = useAppState();
const login = useGlobalState(store => store.login);
const user = useGlobalState(store => store.user);
const dataCenter = useGlobalState(store => store.dataCenter);
const { currentWorkspace } = useAppState();
const [loading, setLoading] = useState(false);
const router = useRouter();

View File

@@ -11,12 +11,12 @@ import QuickSearchButton from './QuickSearchButton';
import Header from './Header';
import usePropsUpdated from '@/hooks/use-props-updated';
import useCurrentPageMeta from '@/hooks/use-current-page-meta';
import { useBlockSuite } from '@/store/workspace';
import { useGlobalState } from '@/store/app';
export const EditorHeader = () => {
const [title, setTitle] = useState('');
const [isHover, setIsHover] = useState(false);
const editor = useBlockSuite(store => store.editor);
const editor = useGlobalState(store => store.editor);
const { trash: isTrash = false } = useCurrentPageMeta() || {};
const onPropsUpdated = usePropsUpdated();

View File

@@ -16,9 +16,9 @@ import { useConfirm } from '@/providers/ConfirmProvider';
import useCurrentPageMeta from '@/hooks/use-current-page-meta';
import { toast } from '@affine/component';
import { useTranslation } from '@affine/i18n';
import { useBlockSuite } from '@/store/workspace';
import { useGlobalState } from '@/store/app';
const PopoverContent = () => {
const editor = useBlockSuite(store => store.editor);
const editor = useGlobalState(store => store.editor);
const { toggleFavoritePage, toggleDeletePage } = usePageHelper();
const { changePageMode } = usePageHelper();
const confirm = useConfirm(store => store.confirm);

View File

@@ -11,7 +11,7 @@ import { Tooltip } from '@affine/component';
import { useTranslation } from '@affine/i18n';
import { useModal } from '@/store/globalModal';
import { MuiFade } from '@affine/component';
import { useBlockSuite } from '@/store/workspace';
import { useGlobalState } from '@/store/app';
export type IslandItemNames = 'contact' | 'shortcuts';
export const HelpIsland = ({
showList = ['contact', 'shortcuts'],
@@ -20,7 +20,7 @@ export const HelpIsland = ({
}) => {
const [spread, setShowSpread] = useState(false);
const { triggerShortcutsModal, triggerContactModal } = useModal();
const blockHub = useBlockSuite(store => store.blockHub);
const blockHub = useGlobalState(store => store.blockHub);
const { t } = useTranslation();
useEffect(() => {

View File

@@ -1,16 +1,16 @@
import { positionAbsolute, styled } from '@affine/component';
import { Modal, ModalWrapper, ModalCloseButton } from '@affine/component';
import { Button } from '@affine/component';
import { useAppState } from '@/providers/app-state-provider';
import { useTranslation } from '@affine/i18n';
import { GoogleIcon } from './GoogleIcon';
import { useGlobalState } from '@/store/app';
interface LoginModalProps {
open: boolean;
onClose: () => void;
}
export const LoginModal = ({ open, onClose }: LoginModalProps) => {
const { login } = useAppState();
const login = useGlobalState(store => store.login);
const { t } = useTranslation();
return (
<Modal open={open} onClose={onClose} data-testid="login-modal">

View File

@@ -2,12 +2,13 @@ import { Command } from 'cmdk';
import { StyledListItem, StyledNotFound } from './style';
import { PaperIcon, EdgelessIcon } from '@blocksuite/icons';
import { Dispatch, SetStateAction, useEffect, useState } from 'react';
import { useAppState, PageMeta } from '@/providers/app-state-provider';
import { PageMeta } from '@/providers/app-state-provider';
import { useRouter } from 'next/router';
import { NoResultSVG } from './NoResultSVG';
import { useTranslation } from '@affine/i18n';
import usePageHelper from '@/hooks/use-page-helper';
import { Workspace } from '@blocksuite/store';
import { useGlobalState } from '@/store/app';
export const PublishedResults = (props: {
query: string;
@@ -21,7 +22,7 @@ export const PublishedResults = (props: {
props;
const { search } = usePageHelper();
const [results, setResults] = useState(new Map<string, string | undefined>());
const { dataCenter } = useAppState();
const dataCenter = useGlobalState(store => store.dataCenter);
const router = useRouter();
const [pageList, setPageList] = useState<PageMeta[]>([]);
useEffect(() => {

View File

@@ -2,10 +2,10 @@ import { CloudWorkspaceIcon, SignOutIcon } from '@blocksuite/icons';
import { FlexWrapper } from '@affine/component';
import { WorkspaceAvatar } from '@/components/workspace-avatar';
import { IconButton } from '@affine/component';
import { useAppState } from '@/providers/app-state-provider';
import { StyledFooter, StyleUserInfo, StyledSignInButton } from './styles';
import { useTranslation } from '@affine/i18n';
import { Tooltip } from '@affine/component';
import { useGlobalState } from '@/store/app';
export const Footer = ({
onLogin,
onLogout,
@@ -13,7 +13,7 @@ export const Footer = ({
onLogin: () => void;
onLogout: () => void;
}) => {
const { user } = useAppState();
const user = useGlobalState(store => store.user);
const { t } = useTranslation();
return (

View File

@@ -10,9 +10,10 @@ import { WorkspaceUnit } from '@affine/datacenter';
import { useAppState } from '@/providers/app-state-provider';
import { StyleWorkspaceInfo, StyleWorkspaceTitle, StyledCard } from './styles';
import { useTranslation } from '@affine/i18n';
import { useGlobalState } from '@/store/app';
const WorkspaceType = ({ workspaceData }: { workspaceData: WorkspaceUnit }) => {
const { user } = useAppState();
const user = useGlobalState(store => store.user);
const { t } = useTranslation();
const isOwner = user?.id === workspaceData.owner?.id;

View File

@@ -6,7 +6,6 @@ import { Tooltip } from '@affine/component';
import { PlusIcon, HelpIcon } from '@blocksuite/icons';
import { useAppState } from '@/providers/app-state-provider';
import { useRouter } from 'next/router';
import { useTranslation } from '@affine/i18n';
import { LanguageMenu } from './SelectLanguageMenu';
@@ -28,6 +27,7 @@ import {
} from './styles';
import { WorkspaceCard } from './WorkspaceCard';
import { Footer } from './Footer';
import { useGlobalState } from '@/store/app';
interface WorkspaceModalProps {
open: boolean;
onClose: () => void;
@@ -35,7 +35,8 @@ interface WorkspaceModalProps {
export const WorkspaceModal = ({ open, onClose }: WorkspaceModalProps) => {
const [createWorkspaceOpen, setCreateWorkspaceOpen] = useState(false);
const { logout, dataCenter } = useAppState();
const logout = useGlobalState(store => store.logout);
const dataCenter = useGlobalState(store => store.dataCenter);
const router = useRouter();
const { t } = useTranslation();
const [loginOpen, setLoginOpen] = useState(false);

View File

@@ -2,9 +2,9 @@ import { StyledWorkspaceName } from './style';
import { WorkspaceUnit } from '@affine/datacenter';
import { useTranslation, Trans } from '@affine/i18n';
import { WorkspaceUnitAvatar } from '@/components/workspace-avatar';
import { useAppState } from '@/providers/app-state-provider';
import { FlexWrapper, Content, Wrapper, Button } from '@affine/component';
import { useModal } from '@/store/globalModal';
import { useGlobalState } from '@/store/app';
// // FIXME: Temporary solution, since the @blocksuite/icons is broken
// const ActiveIcon = () => {
@@ -34,7 +34,7 @@ import { useModal } from '@/store/globalModal';
export const SyncPage = ({ workspace }: { workspace: WorkspaceUnit }) => {
const { t } = useTranslation();
const { user } = useAppState();
const user = useGlobalState(store => store.user);
const { triggerEnableWorkspaceModal } = useModal();
if (workspace.provider === 'local') {

View File

@@ -24,12 +24,14 @@ import { useTranslation } from '@affine/i18n';
import { CameraIcon } from './icons';
import { Upload } from '@/components/file-upload';
import { MuiFade } from '@affine/component';
import { useGlobalState } from '@/store/app';
export const GeneralPage = ({ workspace }: { workspace: WorkspaceUnit }) => {
const [showDelete, setShowDelete] = useState<boolean>(false);
const [showLeave, setShowLeave] = useState<boolean>(false);
const [workspaceName, setWorkspaceName] = useState<string>(workspace?.name);
const [showEditInput, setShowEditInput] = useState(false);
const { currentWorkspace, isOwner } = useAppState();
const isOwner = useGlobalState(store => store.isOwner);
const { currentWorkspace } = useAppState();
const { updateWorkspace } = useWorkspaceHelper();
const { t } = useTranslation();