luulam/AFFiNE
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

feat: add loading for PublishPage

Browse Source
This commit is contained in:
tzhangchi
2023-01-13 22:17:10 +08:00
parent 772a5adbc9
commit 863ebf8360
1 changed files with 21 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
packages/app/src/components/workspace-setting/PublishPage.tsx
View File

@@ -5,7 +5,7 @@ import {
StyledPublishExplanation, StyledPublishExplanation,
StyledSettingH2, StyledSettingH2,
} from './style'; } from './style';
import { useState } from 'react';
import { Button } from '@/ui/button'; import { Button } from '@/ui/button';
import Input from '@/ui/input'; import Input from '@/ui/input';
import { toast } from '@/ui/toast'; import { toast } from '@/ui/toast';
@@ -13,10 +13,13 @@ import { toast } from '@/ui/toast';
import { WorkspaceUnit } from '@affine/datacenter'; import { WorkspaceUnit } from '@affine/datacenter';
import { useWorkspaceHelper } from '@/hooks/use-workspace-helper'; import { useWorkspaceHelper } from '@/hooks/use-workspace-helper';
import { useTranslation } from '@affine/i18n'; import { useTranslation } from '@affine/i18n';
import Loading from '@/components/loading';
import { Wrapper } from '@/ui/layout';
export const PublishPage = ({ workspace }: { workspace: WorkspaceUnit }) => { export const PublishPage = ({ workspace }: { workspace: WorkspaceUnit }) => {
const shareUrl = window.location.host + '/public-workspace/' + workspace.id; const shareUrl = window.location.host + '/public-workspace/' + workspace.id;
const { publishWorkspace, enableWorkspace } = useWorkspaceHelper(); const { publishWorkspace, enableWorkspace } = useWorkspaceHelper();
const { t } = useTranslation(); const { t } = useTranslation();
const [loaded, setLoaded] = useState(true);
const togglePublic = async (flag: boolean) => { const togglePublic = async (flag: boolean) => {
await publishWorkspace(workspace.id.toString(), flag); await publishWorkspace(workspace.id.toString(), flag);
}; };
@@ -58,8 +61,10 @@ export const PublishPage = ({ workspace }: { workspace: WorkspaceUnit }) => {
<StyledPublishCopyContainer> <StyledPublishCopyContainer>
{workspace.published ? ( {workspace.published ? (
<Button <Button
onClick={() => { onClick={async () => {
togglePublic(false); setLoaded(false);
await togglePublic(false);
setLoaded(true);
}} }}
type="primary" type="primary"
shape="circle" shape="circle"
@@ -68,8 +73,10 @@ export const PublishPage = ({ workspace }: { workspace: WorkspaceUnit }) => {
</Button> </Button>
) : ( ) : (
<Button <Button
onClick={() => { onClick={async () => {
togglePublic(true); setLoaded(false);
await togglePublic(true);
setLoaded(true);
}} }}
type="primary" type="primary"
shape="circle" shape="circle"
@@ -88,8 +95,10 @@ export const PublishPage = ({ workspace }: { workspace: WorkspaceUnit }) => {
<StyledPublishCopyContainer> <StyledPublishCopyContainer>
<Button <Button
onClick={() => { onClick={async () => {
enableAffineCloud(); setLoaded(false);
await enableAffineCloud();
setLoaded(true);
}} }}
type="primary" type="primary"
shape="circle" shape="circle"
@@ -100,6 +109,11 @@ export const PublishPage = ({ workspace }: { workspace: WorkspaceUnit }) => {
</> </>
</StyledPublishContent> </StyledPublishContent>
)} )}
{!loaded && (
<Wrapper>
<Loading size={25} />
</Wrapper>
)}
</> </>
); );
}; };