Merge branch 'master' into upload-refactoring
This commit is contained in:
commit
1d4679d5c5
|
@ -53,6 +53,7 @@ const FileList = styled.ul`
|
||||||
`;
|
`;
|
||||||
|
|
||||||
const SectionTitle = styled.div`
|
const SectionTitle = styled.div`
|
||||||
|
margin-top: 10px;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
padding: 0 20px;
|
padding: 0 20px;
|
||||||
|
@ -65,7 +66,7 @@ interface ResultSectionProps {
|
||||||
fileUploadResultMap: Map<FileUploadResults, string[]>;
|
fileUploadResultMap: Map<FileUploadResults, string[]>;
|
||||||
fileUploadResult: FileUploadResults;
|
fileUploadResult: FileUploadResults;
|
||||||
sectionTitle;
|
sectionTitle;
|
||||||
sectionInfo;
|
sectionInfo?: any;
|
||||||
infoHeight: number;
|
infoHeight: number;
|
||||||
}
|
}
|
||||||
const ResultSection = (props: ResultSectionProps) => {
|
const ResultSection = (props: ResultSectionProps) => {
|
||||||
|
@ -84,7 +85,7 @@ const ResultSection = (props: ResultSectionProps) => {
|
||||||
<Content
|
<Content
|
||||||
collapsed={!listView}
|
collapsed={!listView}
|
||||||
height={fileList.length * 33 + props.infoHeight}>
|
height={fileList.length * 33 + props.infoHeight}>
|
||||||
<p>{props.sectionInfo}</p>
|
{props.sectionInfo && <p>{props.sectionInfo}</p>}
|
||||||
<FileList>
|
<FileList>
|
||||||
{fileList.map((fileName) => (
|
{fileList.map((fileName) => (
|
||||||
<li key={fileName}>{fileName}</li>
|
<li key={fileName}>{fileName}</li>
|
||||||
|
@ -95,6 +96,39 @@ const ResultSection = (props: ResultSectionProps) => {
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
interface InProgressProps {
|
||||||
|
sectionTitle: string;
|
||||||
|
fileProgressStatuses: FileProgresses[];
|
||||||
|
}
|
||||||
|
const InProgressSection = (props: InProgressProps) => {
|
||||||
|
const [listView, setListView] = useState(true);
|
||||||
|
const fileList = props.fileProgressStatuses;
|
||||||
|
if (!fileList?.length) {
|
||||||
|
return <></>;
|
||||||
|
}
|
||||||
|
if (!fileList?.length) {
|
||||||
|
return <></>;
|
||||||
|
}
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<SectionTitle onClick={() => setListView(!listView)}>
|
||||||
|
{' '}
|
||||||
|
{props.sectionTitle}{' '}
|
||||||
|
{listView ? <ExpandLess /> : <ExpandMore />}
|
||||||
|
</SectionTitle>
|
||||||
|
<Content collapsed={!listView} height={fileList.length * 35}>
|
||||||
|
<FileList>
|
||||||
|
{fileList.map(({ fileName, progress }) => (
|
||||||
|
<li key={fileName} style={{ marginTop: '12px' }}>
|
||||||
|
{constants.FILE_UPLOAD_PROGRESS(fileName, progress)}
|
||||||
|
</li>
|
||||||
|
))}
|
||||||
|
</FileList>
|
||||||
|
</Content>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
export default function UploadProgress(props: Props) {
|
export default function UploadProgress(props: Props) {
|
||||||
const fileProgressStatuses = [] as FileProgresses[];
|
const fileProgressStatuses = [] as FileProgresses[];
|
||||||
const fileUploadResultMap = new Map<FileUploadResults, string[]>();
|
const fileUploadResultMap = new Map<FileUploadResults, string[]>();
|
||||||
|
@ -155,26 +189,15 @@ export default function UploadProgress(props: Props) {
|
||||||
variant="upload-progress-bar"
|
variant="upload-progress-bar"
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
{fileProgressStatuses.length > 0 && (
|
<InProgressSection
|
||||||
<FileList>
|
fileProgressStatuses={fileProgressStatuses}
|
||||||
{fileProgressStatuses.map(({ fileName, progress }) => (
|
sectionTitle={constants.INPROGRESS_UPLOADS}
|
||||||
<li key={fileName} style={{ marginTop: '12px' }}>
|
/>
|
||||||
{props.uploadStage === UPLOAD_STAGES.FINISH
|
|
||||||
? fileName
|
|
||||||
: constants.FILE_UPLOAD_PROGRESS(
|
|
||||||
fileName,
|
|
||||||
progress
|
|
||||||
)}
|
|
||||||
</li>
|
|
||||||
))}
|
|
||||||
</FileList>
|
|
||||||
)}
|
|
||||||
|
|
||||||
<ResultSection
|
<ResultSection
|
||||||
fileUploadResultMap={fileUploadResultMap}
|
fileUploadResultMap={fileUploadResultMap}
|
||||||
fileUploadResult={FileUploadResults.UPLOADED}
|
fileUploadResult={FileUploadResults.UPLOADED}
|
||||||
sectionTitle={constants.SUCCESSFUL_UPLOADS}
|
sectionTitle={constants.SUCCESSFUL_UPLOADS}
|
||||||
sectionInfo={constants.SUCCESS_INFO}
|
|
||||||
infoHeight={32}
|
infoHeight={32}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
|
|
|
@ -31,7 +31,7 @@ export default function Credentials() {
|
||||||
const key = getKey(SESSION_KEYS.ENCRYPTION_KEY);
|
const key = getKey(SESSION_KEYS.ENCRYPTION_KEY);
|
||||||
if (
|
if (
|
||||||
(!user?.token && !user?.encryptedToken) ||
|
(!user?.token && !user?.encryptedToken) ||
|
||||||
!keyAttributes?.memLimit
|
(keyAttributes && !keyAttributes.memLimit)
|
||||||
) {
|
) {
|
||||||
clearData();
|
clearData();
|
||||||
router.push('/');
|
router.push('/');
|
||||||
|
|
|
@ -13,12 +13,14 @@ import {
|
||||||
logoutUser,
|
logoutUser,
|
||||||
clearFiles,
|
clearFiles,
|
||||||
EmailVerificationResponse,
|
EmailVerificationResponse,
|
||||||
|
User,
|
||||||
} from 'services/userService';
|
} from 'services/userService';
|
||||||
import { setIsFirstLogin } from 'utils/storage';
|
import { setIsFirstLogin } from 'utils/storage';
|
||||||
import SubmitButton from 'components/SubmitButton';
|
import SubmitButton from 'components/SubmitButton';
|
||||||
import { clearKeys } from 'utils/storage/sessionStorage';
|
import { clearKeys } from 'utils/storage/sessionStorage';
|
||||||
import { AppContext } from 'pages/_app';
|
import { AppContext } from 'pages/_app';
|
||||||
import LogoImg from 'components/LogoImg';
|
import LogoImg from 'components/LogoImg';
|
||||||
|
import { KeyAttributes } from 'types';
|
||||||
|
|
||||||
interface formValues {
|
interface formValues {
|
||||||
ott: string;
|
ott: string;
|
||||||
|
@ -36,9 +38,14 @@ export default function Verify() {
|
||||||
router.prefetch('/twoFactor/verify');
|
router.prefetch('/twoFactor/verify');
|
||||||
router.prefetch('/credentials');
|
router.prefetch('/credentials');
|
||||||
router.prefetch('/generate');
|
router.prefetch('/generate');
|
||||||
const user = getData(LS_KEYS.USER);
|
const user: User = getData(LS_KEYS.USER);
|
||||||
|
const keyAttributes: KeyAttributes = getData(
|
||||||
|
LS_KEYS.KEY_ATTRIBUTES
|
||||||
|
);
|
||||||
if (!user?.email) {
|
if (!user?.email) {
|
||||||
router.push('/');
|
router.push('/');
|
||||||
|
} else if (keyAttributes.encryptedKey) {
|
||||||
|
router.push('credentials');
|
||||||
} else {
|
} else {
|
||||||
setEmail(user.email);
|
setEmail(user.email);
|
||||||
}
|
}
|
||||||
|
@ -71,7 +78,6 @@ export default function Verify() {
|
||||||
router.push('/two-factor/verify');
|
router.push('/two-factor/verify');
|
||||||
} else {
|
} else {
|
||||||
setData(LS_KEYS.USER, {
|
setData(LS_KEYS.USER, {
|
||||||
...getData(LS_KEYS.USER),
|
|
||||||
email,
|
email,
|
||||||
token,
|
token,
|
||||||
encryptedToken,
|
encryptedToken,
|
||||||
|
|
|
@ -498,8 +498,8 @@ const englishConstants = {
|
||||||
' unable to upload these files because of network issue, you can retry upload these files',
|
' unable to upload these files because of network issue, you can retry upload these files',
|
||||||
SKIPPED_INFO: 'these files already existed in the album',
|
SKIPPED_INFO: 'these files already existed in the album',
|
||||||
UNSUPPORTED_INFO: 'these files are currently not supported by ente',
|
UNSUPPORTED_INFO: 'these files are currently not supported by ente',
|
||||||
SUCCESS_INFO: 'successfully backed-up memories',
|
|
||||||
BLOCKED_UPLOADS: 'blocked uploads',
|
BLOCKED_UPLOADS: 'blocked uploads',
|
||||||
|
INPROGRESS_UPLOADS: 'upload in progress',
|
||||||
};
|
};
|
||||||
|
|
||||||
export default englishConstants;
|
export default englishConstants;
|
||||||
|
|
Loading…
Reference in a new issue