From 072e471f274feac789d6bc5cfea69576180cff83 Mon Sep 17 00:00:00 2001 From: Abhinav Date: Wed, 19 Jan 2022 16:24:43 +0530 Subject: [PATCH] update to hadle new URL format --- src/components/PhotoFrame.tsx | 2 +- src/components/pages/gallery/PreviewCard.tsx | 2 +- .../pages/sharedAlbum/AbuseReportForm.tsx | 2 +- .../shared-album/{ => [[...token]]}/index.tsx | 37 ++++++------------- src/utils/collection/index.ts | 2 +- src/utils/publicCollectionGallery/index.ts | 14 +++++++ 6 files changed, 30 insertions(+), 29 deletions(-) rename src/pages/shared-album/{ => [[...token]]}/index.tsx (85%) create mode 100644 src/utils/publicCollectionGallery/index.ts diff --git a/src/components/PhotoFrame.tsx b/src/components/PhotoFrame.tsx index ba811e572..65b4adf23 100644 --- a/src/components/PhotoFrame.tsx +++ b/src/components/PhotoFrame.tsx @@ -24,7 +24,7 @@ import PublicCollectionDownloadManager from 'services/publicCollectionDownloadMa import { defaultPublicCollectionGalleryContext, PublicCollectionGalleryContext, -} from 'pages/shared-album'; +} from 'utils/publicCollectionGallery'; const Container = styled.div` display: block; diff --git a/src/components/pages/gallery/PreviewCard.tsx b/src/components/pages/gallery/PreviewCard.tsx index 1f24cd1fc..a91ba9403 100644 --- a/src/components/pages/gallery/PreviewCard.tsx +++ b/src/components/pages/gallery/PreviewCard.tsx @@ -9,7 +9,7 @@ import { GAP_BTW_TILES } from 'constants/gallery'; import { defaultPublicCollectionGalleryContext, PublicCollectionGalleryContext, -} from 'pages/shared-album'; +} from 'utils/publicCollectionGallery'; import PublicCollectionDownloadManager from 'services/publicCollectionDownloadManager'; interface IProps { diff --git a/src/components/pages/sharedAlbum/AbuseReportForm.tsx b/src/components/pages/sharedAlbum/AbuseReportForm.tsx index 5454f2b1a..fc11751d1 100644 --- a/src/components/pages/sharedAlbum/AbuseReportForm.tsx +++ b/src/components/pages/sharedAlbum/AbuseReportForm.tsx @@ -2,7 +2,7 @@ import MessageDialog from 'components/MessageDialog'; import SubmitButton from 'components/SubmitButton'; import { REPORT_REASON } from 'constants/publicCollection'; import { Formik, FormikHelpers } from 'formik'; -import { PublicCollectionGalleryContext } from 'pages/shared-album'; +import { PublicCollectionGalleryContext } from 'utils/publicCollectionGallery'; import React, { useContext, useState } from 'react'; import { Form, FormControl } from 'react-bootstrap'; import { reportAbuse } from 'services/publicCollectionService'; diff --git a/src/pages/shared-album/index.tsx b/src/pages/shared-album/[[...token]]/index.tsx similarity index 85% rename from src/pages/shared-album/index.tsx rename to src/pages/shared-album/[[...token]]/index.tsx index 3bb3c9cfe..54cacd94c 100644 --- a/src/pages/shared-album/index.tsx +++ b/src/pages/shared-album/[[...token]]/index.tsx @@ -1,13 +1,6 @@ import { ALL_SECTION } from 'constants/collection'; import PhotoFrame from 'components/PhotoFrame'; -import React, { - createContext, - useContext, - useEffect, - useRef, - useState, -} from 'react'; -import { PublicCollectionGalleryContextType } from 'types/publicCollection'; +import React, { useContext, useEffect, useRef, useState } from 'react'; import { getLocalPublicCollection, getLocalPublicFiles, @@ -23,18 +16,11 @@ import ReportAbuse from 'components/pages/sharedAlbum/ReportAbuse'; import { AbuseReportForm } from 'components/pages/sharedAlbum/AbuseReportForm'; import MessageDialog, { MessageAttributes } from 'components/MessageDialog'; import GoToEnte from 'components/pages/sharedAlbum/GoToEnte'; - -export const defaultPublicCollectionGalleryContext: PublicCollectionGalleryContextType = - { - token: null, - accessedThroughSharedURL: false, - setDialogMessage: () => null, - }; - -export const PublicCollectionGalleryContext = - createContext( - defaultPublicCollectionGalleryContext - ); +import { + defaultPublicCollectionGalleryContext, + PublicCollectionGalleryContext, +} from 'utils/publicCollectionGallery'; +import { useRouter } from 'next/router'; export default function PublicCollectionGallery() { const token = useRef(null); @@ -52,15 +38,16 @@ export default function PublicCollectionGallery() { const openMessageDialog = () => setMessageDialogView(true); const closeMessageDialog = () => setMessageDialogView(false); - + const router = useRouter(); useEffect(() => { const main = async () => { - url.current = window.location.href; - const urlParams = new URLSearchParams(window.location.search); - const eToken = urlParams.get('accessToken'); + const eToken = (router.query.token?.[0] ?? '') as string; const eCollectionKey = decodeURIComponent( - urlParams.get('collectionKey') + window.location.hash.slice(1) ); + if (!eToken || !eCollectionKey) { + return; + } token.current = eToken; collectionKey.current = eCollectionKey; const localCollection = await getLocalPublicCollection( diff --git a/src/utils/collection/index.ts b/src/utils/collection/index.ts index bd73f3d84..98704a1ee 100644 --- a/src/utils/collection/index.ts +++ b/src/utils/collection/index.ts @@ -110,7 +110,7 @@ export async function downloadCollection( export function transformShareURLForHost(url: string, collectionKey: string) { const host = window.location.host; - return `${url}&collectionKey=${encodeURIComponent(collectionKey)}`.replace( + return `${url}#${encodeURIComponent(collectionKey)}`.replace( 'https://albums.ente.io', `http://${host}/shared-album` ); diff --git a/src/utils/publicCollectionGallery/index.ts b/src/utils/publicCollectionGallery/index.ts new file mode 100644 index 000000000..97d41701e --- /dev/null +++ b/src/utils/publicCollectionGallery/index.ts @@ -0,0 +1,14 @@ +import { createContext } from 'react'; +import { PublicCollectionGalleryContextType } from 'types/publicCollection'; + +export const defaultPublicCollectionGalleryContext: PublicCollectionGalleryContextType = + { + token: null, + accessedThroughSharedURL: false, + setDialogMessage: () => null, + }; + +export const PublicCollectionGalleryContext = + createContext( + defaultPublicCollectionGalleryContext + );