fix delay of manage option
This commit is contained in:
parent
7bcc3ced7b
commit
ee16cf4b10
|
@ -1,37 +1,36 @@
|
||||||
import { Box, Typography } from '@mui/material';
|
import { Box, Typography } from '@mui/material';
|
||||||
import { FlexWrapper } from 'components/Container';
|
import { FlexWrapper } from 'components/Container';
|
||||||
import { ButtonVariant } from 'components/pages/gallery/LinkButton';
|
import { ButtonVariant } from 'components/pages/gallery/LinkButton';
|
||||||
import { GalleryContext } from 'pages/gallery';
|
|
||||||
import { AppContext } from 'pages/_app';
|
import { AppContext } from 'pages/_app';
|
||||||
import React, { useContext } from 'react';
|
import React, { useContext, useState } from 'react';
|
||||||
import {
|
import {
|
||||||
createShareableURL,
|
createShareableURL,
|
||||||
deleteShareableURL,
|
deleteShareableURL,
|
||||||
} from 'services/collectionService';
|
} from 'services/collectionService';
|
||||||
import { appendCollectionKeyToShareURL } from 'utils/collection';
|
import { Collection, PublicURL } from 'types/collection';
|
||||||
import { handleSharingErrors } from 'utils/error';
|
import { handleSharingErrors } from 'utils/error';
|
||||||
import constants from 'utils/strings/constants';
|
import constants from 'utils/strings/constants';
|
||||||
import PublicShareSwitch from './switch';
|
import PublicShareSwitch from './switch';
|
||||||
|
interface Iprops {
|
||||||
|
collection: Collection;
|
||||||
|
publicShareActive: boolean;
|
||||||
|
setPublicShareProp: (value: PublicURL) => void;
|
||||||
|
}
|
||||||
|
|
||||||
export default function PublicShareControl({
|
export default function PublicShareControl({
|
||||||
publicShareUrl,
|
|
||||||
sharableLinkError,
|
|
||||||
collection,
|
collection,
|
||||||
setPublicShareUrl,
|
publicShareActive,
|
||||||
setSharableLinkError,
|
setPublicShareProp,
|
||||||
}) {
|
}: Iprops) {
|
||||||
const appContext = useContext(AppContext);
|
const appContext = useContext(AppContext);
|
||||||
const galleryContext = useContext(GalleryContext);
|
|
||||||
|
const [sharableLinkError, setSharableLinkError] = useState(null);
|
||||||
|
|
||||||
const createSharableURLHelper = async () => {
|
const createSharableURLHelper = async () => {
|
||||||
try {
|
try {
|
||||||
appContext.startLoading();
|
appContext.startLoading();
|
||||||
const publicURL = await createShareableURL(collection);
|
const publicURL = await createShareableURL(collection);
|
||||||
const sharableURL = await appendCollectionKeyToShareURL(
|
setPublicShareProp(publicURL);
|
||||||
publicURL.url,
|
|
||||||
collection.key
|
|
||||||
);
|
|
||||||
setPublicShareUrl(sharableURL);
|
|
||||||
galleryContext.syncWithRemote(false, true);
|
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
const errorMessage = handleSharingErrors(e);
|
const errorMessage = handleSharingErrors(e);
|
||||||
setSharableLinkError(errorMessage);
|
setSharableLinkError(errorMessage);
|
||||||
|
@ -44,8 +43,7 @@ export default function PublicShareControl({
|
||||||
try {
|
try {
|
||||||
appContext.startLoading();
|
appContext.startLoading();
|
||||||
await deleteShareableURL(collection);
|
await deleteShareableURL(collection);
|
||||||
setPublicShareUrl(null);
|
setPublicShareProp(null);
|
||||||
galleryContext.syncWithRemote(false, true);
|
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
const errorMessage = handleSharingErrors(e);
|
const errorMessage = handleSharingErrors(e);
|
||||||
setSharableLinkError(errorMessage);
|
setSharableLinkError(errorMessage);
|
||||||
|
@ -69,8 +67,7 @@ export default function PublicShareControl({
|
||||||
|
|
||||||
const handleCollectionPublicSharing = () => {
|
const handleCollectionPublicSharing = () => {
|
||||||
setSharableLinkError(null);
|
setSharableLinkError(null);
|
||||||
|
if (publicShareActive) {
|
||||||
if (publicShareUrl) {
|
|
||||||
confirmDisablePublicSharing();
|
confirmDisablePublicSharing();
|
||||||
} else {
|
} else {
|
||||||
createSharableURLHelper();
|
createSharableURLHelper();
|
||||||
|
@ -86,7 +83,7 @@ export default function PublicShareControl({
|
||||||
sx={{
|
sx={{
|
||||||
ml: 2,
|
ml: 2,
|
||||||
}}
|
}}
|
||||||
checked={!!publicShareUrl}
|
checked={publicShareActive}
|
||||||
onChange={handleCollectionPublicSharing}
|
onChange={handleCollectionPublicSharing}
|
||||||
/>
|
/>
|
||||||
</FlexWrapper>
|
</FlexWrapper>
|
||||||
|
|
|
@ -1,51 +1,53 @@
|
||||||
import React, { useEffect, useState } from 'react';
|
import React, { useEffect, useState } from 'react';
|
||||||
import { PublicURL } from 'types/collection';
|
import { Collection, PublicURL } from 'types/collection';
|
||||||
import { appendCollectionKeyToShareURL } from 'utils/collection';
|
import { appendCollectionKeyToShareURL } from 'utils/collection';
|
||||||
import PublicShareControl from './control';
|
import PublicShareControl from './control';
|
||||||
import PublicShareLink from './link';
|
import PublicShareLink from './link';
|
||||||
import PublicShareManage from './manage';
|
import PublicShareManage from './manage';
|
||||||
|
|
||||||
export default function PublicShare({ collection }) {
|
export default function PublicShare({
|
||||||
const [sharableLinkError, setSharableLinkError] = useState(null);
|
collection,
|
||||||
|
}: {
|
||||||
|
collection: Collection;
|
||||||
|
}) {
|
||||||
const [publicShareUrl, setPublicShareUrl] = useState<string>(null);
|
const [publicShareUrl, setPublicShareUrl] = useState<string>(null);
|
||||||
const [publicShareProp, setPublicShareProp] = useState<PublicURL>(null);
|
const [publicShareProp, setPublicShareProp] = useState<PublicURL>(null);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const main = async () => {
|
if (collection.publicURLs?.length) {
|
||||||
if (collection?.publicURLs?.[0]?.url) {
|
setPublicShareProp(collection.publicURLs[0]);
|
||||||
const t = await appendCollectionKeyToShareURL(
|
}
|
||||||
collection?.publicURLs?.[0]?.url,
|
|
||||||
collection.key
|
|
||||||
);
|
|
||||||
setPublicShareUrl(t);
|
|
||||||
setPublicShareProp(collection?.publicURLs?.[0] as PublicURL);
|
|
||||||
} else {
|
|
||||||
setPublicShareUrl(null);
|
|
||||||
setPublicShareProp(null);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
main();
|
|
||||||
}, [collection]);
|
}, [collection]);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (publicShareProp) {
|
||||||
|
const url = appendCollectionKeyToShareURL(
|
||||||
|
publicShareProp.url,
|
||||||
|
collection.key
|
||||||
|
);
|
||||||
|
setPublicShareUrl(url);
|
||||||
|
} else {
|
||||||
|
setPublicShareUrl(null);
|
||||||
|
}
|
||||||
|
}, [publicShareProp]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<PublicShareControl
|
<PublicShareControl
|
||||||
setPublicShareUrl={setPublicShareUrl}
|
setPublicShareProp={setPublicShareProp}
|
||||||
collection={collection}
|
collection={collection}
|
||||||
publicShareUrl={publicShareUrl}
|
publicShareActive={!!publicShareProp}
|
||||||
sharableLinkError={sharableLinkError}
|
|
||||||
setSharableLinkError={setSharableLinkError}
|
|
||||||
/>
|
/>
|
||||||
{publicShareUrl && (
|
|
||||||
<PublicShareLink publicShareUrl={publicShareUrl} />
|
|
||||||
)}
|
|
||||||
{publicShareProp && (
|
{publicShareProp && (
|
||||||
<PublicShareManage
|
<>
|
||||||
publicShareProp={publicShareProp}
|
<PublicShareLink publicShareUrl={publicShareUrl} />
|
||||||
collection={collection}
|
|
||||||
setPublicShareProp={setPublicShareProp}
|
<PublicShareManage
|
||||||
setSharableLinkError={setSharableLinkError}
|
publicShareProp={publicShareProp}
|
||||||
/>
|
collection={collection}
|
||||||
|
setPublicShareProp={setPublicShareProp}
|
||||||
|
/>
|
||||||
|
</>
|
||||||
)}
|
)}
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
|
|
|
@ -2,7 +2,7 @@ import { ManageLinkPassword } from './linkPassword';
|
||||||
import { ManageDeviceLimit } from './deviceLimit';
|
import { ManageDeviceLimit } from './deviceLimit';
|
||||||
import { ManageLinkExpiry } from './linkExpiry';
|
import { ManageLinkExpiry } from './linkExpiry';
|
||||||
import { PublicLinkSetPassword } from '../setPassword';
|
import { PublicLinkSetPassword } from '../setPassword';
|
||||||
import { Stack } from '@mui/material';
|
import { Stack, Typography } from '@mui/material';
|
||||||
import { GalleryContext } from 'pages/gallery';
|
import { GalleryContext } from 'pages/gallery';
|
||||||
import React, { useContext, useState } from 'react';
|
import React, { useContext, useState } from 'react';
|
||||||
import { updateShareableURL } from 'services/collectionService';
|
import { updateShareableURL } from 'services/collectionService';
|
||||||
|
@ -20,11 +20,11 @@ export default function PublicShareManage({
|
||||||
publicShareProp,
|
publicShareProp,
|
||||||
collection,
|
collection,
|
||||||
setPublicShareProp,
|
setPublicShareProp,
|
||||||
setSharableLinkError,
|
|
||||||
}) {
|
}) {
|
||||||
const galleryContext = useContext(GalleryContext);
|
const galleryContext = useContext(GalleryContext);
|
||||||
|
|
||||||
const [changePasswordView, setChangePasswordView] = useState(false);
|
const [changePasswordView, setChangePasswordView] = useState(false);
|
||||||
|
const [sharableLinkError, setSharableLinkError] = useState(null);
|
||||||
|
|
||||||
const closeConfigurePassword = () => setChangePasswordView(false);
|
const closeConfigurePassword = () => setChangePasswordView(false);
|
||||||
|
|
||||||
|
@ -58,6 +58,16 @@ export default function PublicShareManage({
|
||||||
<ManageSectionLabel onClick={scrollToEnd}>
|
<ManageSectionLabel onClick={scrollToEnd}>
|
||||||
{constants.MANAGE_LINK}
|
{constants.MANAGE_LINK}
|
||||||
</ManageSectionLabel>
|
</ManageSectionLabel>
|
||||||
|
{sharableLinkError && (
|
||||||
|
<Typography
|
||||||
|
variant="body2"
|
||||||
|
sx={{
|
||||||
|
color: (theme) => theme.palette.danger.main,
|
||||||
|
mt: 0.5,
|
||||||
|
}}>
|
||||||
|
{sharableLinkError}
|
||||||
|
</Typography>
|
||||||
|
)}
|
||||||
<ManageSectionOptions>
|
<ManageSectionOptions>
|
||||||
<Stack spacing={1}>
|
<Stack spacing={1}>
|
||||||
<ManageLinkExpiry
|
<ManageLinkExpiry
|
||||||
|
|
|
@ -43,7 +43,7 @@ export default class MyDocument extends Document {
|
||||||
type="image/png"
|
type="image/png"
|
||||||
/>
|
/>
|
||||||
<link rel="manifest" href="manifest.json" />
|
<link rel="manifest" href="manifest.json" />
|
||||||
<link rel="apple-touch-icon" href="/images/ente-512.png" />
|
<link rel="apple-touch-icon" href="/images/ente/512.png" />
|
||||||
<meta name="theme-color" content="#111" />
|
<meta name="theme-color" content="#111" />
|
||||||
<link
|
<link
|
||||||
rel="icon"
|
rel="icon"
|
||||||
|
|
|
@ -111,7 +111,7 @@ export async function downloadAllCollectionFiles(collectionID: number) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function appendCollectionKeyToShareURL(
|
export function appendCollectionKeyToShareURL(
|
||||||
url: string,
|
url: string,
|
||||||
collectionKey: string
|
collectionKey: string
|
||||||
) {
|
) {
|
||||||
|
|
Loading…
Reference in a new issue