Merge pull request #363 from ente-io/public-link-changes

Public link changes

src/components/Container.ts

@@ -50,7 +50,7 @@ export const Value = styled.div<{ width?: string }>`
     justify-content: flex-start;
     align-items: center;
     width: ${(props) => props.width ?? '30%'};
-    text-align: center;
+
     color: #ddd;
 `;
 

src/components/PhotoFrame.tsx

@@ -50,7 +50,7 @@ const EmptyScreen = styled.div`
     }
 `;
 
-const PHOTOSWIPE_HASH_SUFFIX = '&photoswipe-opened';
+const PHOTOSWIPE_HASH_SUFFIX = '&opened';
 
 interface Props {
     files: EnteFile[];

src/components/PhotoList.tsx

@@ -12,7 +12,7 @@ import {
 } from 'constants/gallery';
 import constants from 'utils/strings/constants';
 import { PublicCollectionGalleryContext } from 'utils/publicCollectionGallery';
-import { ENTE_WEBSITE_LINK } from 'constants/publicCollection';
+import { ENTE_WEBSITE_LINK } from 'constants/urls';
 import { getVariantColor, ButtonVariant } from './pages/gallery/LinkButton';
 
 const A_DAY = 24 * 60 * 60 * 1000;

src/components/PhotoSwipe/PhotoSwipe.tsx

@@ -148,7 +148,14 @@ function RenderCreationTime({
         <>
             <Row>
                 <Label width="30%">{constants.CREATION_TIME}</Label>
-                <Value width={isInEditMode ? '50%' : '60%'}>
+                <Value
+                    width={
+                        !shouldDisableEdits
+                            ? isInEditMode
+                                ? '50%'
+                                : '60%'
+                            : '70%'
+                    }>
                     {isInEditMode ? (
                         <EnteDateTimePicker
                             loading={loading}
@@ -160,11 +167,11 @@ function RenderCreationTime({
                         formatDateTime(pickedTime)
                     )}
                 </Value>
+                {!shouldDisableEdits && (
                     <Value
                         width={isInEditMode ? '20%' : '10%'}
                         style={{ cursor: 'pointer', marginLeft: '10px' }}>
-                    {!shouldDisableEdits &&
+                        {!isInEditMode ? (
-                        (!isInEditMode ? (
                             <IconButton onClick={openEditMode}>
                                 <EditIcon />
                             </IconButton>
@@ -181,8 +188,9 @@ function RenderCreationTime({
                                     <CloseIcon />
                                 </IconButton>
                             </>
-                        ))}
+                        )}
                     </Value>
+                )}
             </Row>
         </>
     );
@@ -323,7 +331,7 @@ function RenderFileName({
                 <Label width="30%">{constants.FILE_NAME}</Label>
                 {!isInEditMode ? (
                     <>
-                        <Value width="60%">
+                        <Value width={!shouldDisableEdits ? '60%' : '70%'}>
                             <FreeFlowText>
                                 {getFileTitle(filename, extension)}
                             </FreeFlowText>
@@ -735,11 +743,13 @@ function PhotoSwipe(props: Iprops) {
                                         }}
                                     />
                                 )}
+                            {!props.isSharedCollection && (
                                 <button
                                     className="pswp-custom info-btn"
                                     title={constants.INFO}
                                     onClick={handleOpenInfo}
                                 />
+                            )}
                             <div className="pswp__preloader">
                                 <div className="pswp__preloader__icn">
                                     <div className="pswp__preloader__cut">
@@ -765,6 +775,7 @@ function PhotoSwipe(props: Iprops) {
                     </div>
                 </div>
             </div>
+            {!props.isSharedCollection && (
                 <InfoModal
                     shouldDisableEdits={props.isSharedCollection}
                     showInfo={showInfo}
@@ -775,6 +786,7 @@ function PhotoSwipe(props: Iprops) {
                     exif={exif}
                     scheduleUpdate={scheduleUpdate}
                 />
+            )}
         </>
     );
 }

src/components/pages/sharedAlbum/GoToEnte.tsx

@@ -1,3 +1,4 @@
+import { ENTE_WEBSITE_LINK } from 'constants/urls';
 import React, { useEffect, useState } from 'react';
 import { Button } from 'react-bootstrap';
 import styled from 'styled-components';
@@ -42,17 +43,9 @@ function GoToEnte() {
         }
     };
 
-    const getHookLink = (os: OS) => {
-        if (os === OS.ANDROID || os === OS.IOS) {
-            return 'https://ente.io/app';
-        } else {
-            return 'https://web.ente.io';
-        }
-    };
-
     return (
         <Wrapper>
-            <ButtonWithLink href={getHookLink(os)}>
+            <ButtonWithLink href={ENTE_WEBSITE_LINK}>
                 {getButtonText(os)}
             </ButtonWithLink>
         </Wrapper>

src/constants/publicCollection/index.ts

@@ -2,5 +2,3 @@ export enum REPORT_REASON {
     COPYRIGHT = 'COPYRIGHT',
     MALICIOUS_CONTENT = 'MALICIOUS_CONTENT',
 }
-
-export const ENTE_WEBSITE_LINK = 'https://ente.io';

src/constants/urls/index.ts

@@ -0,0 +1 @@
+export const ENTE_WEBSITE_LINK = 'https://ente.io';

src/services/publicCollectionDownloadManager.ts

@@ -144,7 +144,7 @@ class PublicCollectionDownloadManager {
         }
         const resp = await fetch(getPublicCollectionFileURL(file.id), {
             headers: {
-                'X-Auth-Token': token,
+                'X-Auth-Access-Token': token,
             },
         });
         const reader = resp.body.getReader();