](https://www.browserstack.com/open-source)
diff --git a/configUtil.js b/configUtil.js
index 274c3d786..65234c2cf 100644
--- a/configUtil.js
+++ b/configUtil.js
@@ -26,7 +26,7 @@ module.exports = {
'style-src': "'self' 'unsafe-inline'",
'font-src ': "'self'; script-src 'self' 'unsafe-eval' blob:",
'connect-src':
- "'self' https://*.ente.io http://localhost:8080 data: blob: https://ente-prod-eu.s3.eu-central-003.backblazeb2.com ",
+ "'self' https://*.ente.io http://localhost:8080 data: blob: https://ente-prod-eu.s3.eu-central-003.backblazeb2.com https://ente-prod-v3.s3.eu-central-2.wasabisys.com/",
'base-uri ': "'self'",
// to allow worker
'child-src': "'self' blob:",
@@ -37,11 +37,6 @@ module.exports = {
'report-to': ' https://csp-reporter.ente.io/local',
},
- WORKBOX_CONFIG: {
- swSrc: 'src/serviceWorker.js',
- exclude: [/manifest\.json$/i],
- },
-
ALL_ROUTES: '/(.*)',
buildCSPHeader: (directives) => ({
diff --git a/next.config.js b/next.config.js
index 5b81c9910..2491e4ee0 100644
--- a/next.config.js
+++ b/next.config.js
@@ -1,7 +1,6 @@
const withBundleAnalyzer = require('@next/bundle-analyzer')({
enabled: process.env.ANALYZE === 'true',
});
-const withWorkbox = require('@ente-io/next-with-workbox');
const { withSentryConfig } = require('@sentry/nextjs');
const { PHASE_DEVELOPMENT_SERVER } = require('next/constants');
@@ -19,7 +18,6 @@ const {
COOP_COEP_HEADERS,
WEB_SECURITY_HEADERS,
CSP_DIRECTIVES,
- WORKBOX_CONFIG,
ALL_ROUTES,
getIsSentryEnabled,
} = require('./configUtil');
@@ -30,37 +28,39 @@ const IS_SENTRY_ENABLED = getIsSentryEnabled();
module.exports = (phase) =>
withSentryConfig(
- withWorkbox(
- withBundleAnalyzer(
- withTM({
- env: {
- SENTRY_RELEASE: GIT_SHA,
- NEXT_PUBLIC_LATEST_COMMIT_HASH: GIT_SHA,
+ withBundleAnalyzer(
+ withTM({
+ compiler: {
+ styledComponents: {
+ ssr: true,
+ displayName: true,
},
- workbox: WORKBOX_CONFIG,
+ },
+ env: {
+ SENTRY_RELEASE: GIT_SHA,
+ },
- headers() {
- return [
- {
- // Apply these headers to all routes in your application....
- source: ALL_ROUTES,
- headers: convertToNextHeaderFormat({
- ...COOP_COEP_HEADERS,
- ...WEB_SECURITY_HEADERS,
- ...buildCSPHeader(CSP_DIRECTIVES),
- }),
- },
- ];
- },
- // https://dev.to/marcinwosinek/how-to-add-resolve-fallback-to-webpack-5-in-nextjs-10-i6j
- webpack: (config, { isServer }) => {
- if (!isServer) {
- config.resolve.fallback.fs = false;
- }
- return config;
- },
- })
- )
+ headers() {
+ return [
+ {
+ // Apply these headers to all routes in your application....
+ source: ALL_ROUTES,
+ headers: convertToNextHeaderFormat({
+ ...COOP_COEP_HEADERS,
+ ...WEB_SECURITY_HEADERS,
+ ...buildCSPHeader(CSP_DIRECTIVES),
+ }),
+ },
+ ];
+ },
+ // https://dev.to/marcinwosinek/how-to-add-resolve-fallback-to-webpack-5-in-nextjs-10-i6j
+ webpack: (config, { isServer }) => {
+ if (!isServer) {
+ config.resolve.fallback.fs = false;
+ }
+ return config;
+ },
+ })
),
{
release: GIT_SHA,
diff --git a/package.json b/package.json
index b454d8592..42598d94b 100644
--- a/package.json
+++ b/package.json
@@ -5,8 +5,7 @@
"scripts": {
"dev": "next dev",
"albums": "next dev -p 3002",
- "lint": "eslint \"src/**/*.{js,jsx,ts,tsx}\"",
- "prebuild": "yarn lint",
+ "lint": "next lint",
"build": "next build",
"postbuild": "next export",
"build-analyze": "ANALYZE=true next build",
@@ -15,7 +14,6 @@
},
"dependencies": {
"@date-io/date-fns": "^2.14.0",
- "@ente-io/next-with-workbox": "^1.0.3",
"@mui/icons-material": "^5.6.2",
"@mui/material": "^5.6.2",
"@mui/styled-engine": "npm:@mui/styled-engine-sc@latest",
@@ -53,16 +51,16 @@
"libsodium-wrappers": "^0.7.8",
"localforage": "^1.9.0",
"ml-matrix": "^6.8.2",
- "next": "^12.1.0",
- "next-transpile-modules": "^9.0.0",
+ "next": "^13.0.6",
+ "next-transpile-modules": "^10.0.0",
"p-queue": "^7.1.0",
"photoswipe": "file:./thirdparty/photoswipe",
"piexifjs": "^1.0.6",
- "react": "^17.0.2",
+ "react": "^18.2.0",
"react-bootstrap": "^1.3.0",
"react-d3-tree": "^3.1.1",
"react-datepicker": "^4.3.0",
- "react-dom": "^17.0.2",
+ "react-dom": "^18.2.0",
"react-dropzone": "^11.2.4",
"react-otp-input": "^2.3.1",
"react-select": "^4.3.1",
@@ -70,6 +68,7 @@
"react-top-loading-bar": "^2.0.1",
"react-virtualized-auto-sizer": "^1.0.2",
"react-window": "^1.8.6",
+ "sanitize-filename": "^1.6.3",
"similarity-transformation": "^0.0.1",
"styled-components": "^5.3.5",
"tesseract.js": "file:./thirdparty/tesseract",
@@ -85,6 +84,7 @@
},
"devDependencies": {
"@next/bundle-analyzer": "^9.5.3",
+ "@types/bs58": "^4.0.1",
"@types/debounce-promise": "^3.1.3",
"@types/libsodium-wrappers": "^0.7.8",
"@types/node": "^14.6.4",
@@ -98,17 +98,10 @@
"@types/styled-components": "^5.1.25",
"@types/wicg-file-system-access": "^2020.9.5",
"@types/yup": "^0.29.7",
- "@typescript-eslint/eslint-plugin": "^4.25.0",
- "@typescript-eslint/parser": "^4.25.0",
- "babel-plugin-styled-components": "^1.11.1",
- "eslint": "^7.27.0",
- "eslint-config-airbnb": "^18.2.1",
- "eslint-config-google": "^0.14.0",
- "eslint-config-prettier": "^8.3.0",
- "eslint-plugin-import": "^2.23.3",
- "eslint-plugin-jsx-a11y": "^6.4.1",
- "eslint-plugin-react": "^7.23.2",
- "eslint-plugin-react-hooks": "^4.2.0",
+ "@typescript-eslint/eslint-plugin": "^5.43.0",
+ "eslint": "^8.28.0",
+ "eslint-config-next": "^13.0.6",
+ "eslint-config-prettier": "^8.5.0",
"husky": "^7.0.1",
"lint-staged": "^11.1.2",
"prettier": "2.3.2",
@@ -117,13 +110,7 @@
"standard": {
"parser": "babel-eslint"
},
- "lint-staged": {
- "src/**/*.{js,jsx,ts,tsx}": [
- "eslint --fix",
- "prettier --write --ignore-unknown"
- ]
- },
"resolutions": {
"@mui/styled-engine": "npm:@mui/styled-engine-sc@latest"
}
-}
+}
\ No newline at end of file
diff --git a/public/_headers b/public/_headers
index 388d4038c..caa299ea2 100644
--- a/public/_headers
+++ b/public/_headers
@@ -8,5 +8,5 @@
X-Frame-Options: deny
X-XSS-Protection: 1; mode=block
Referrer-Policy: same-origin
- Content-Security-Policy-Report-Only: default-src 'self'; img-src 'self' blob: data:; media-src 'self' blob:; style-src 'self' 'unsafe-inline'; font-src 'self'; script-src 'self' 'unsafe-eval' blob:; manifest-src 'self'; child-src 'self' blob:; object-src 'none'; connect-src 'self' https://*.ente.io data: blob: https://ente-prod-eu.s3.eu-central-003.backblazeb2.com ; base-uri 'self'; frame-ancestors 'none'; form-action 'none'; report-uri https://csp-reporter.ente.io; report-to https://csp-reporter.ente.io;
+ Content-Security-Policy-Report-Only: default-src 'self'; img-src 'self' blob: data:; media-src 'self' blob:; style-src 'self' 'unsafe-inline'; font-src 'self'; script-src 'self' 'unsafe-eval' blob:; manifest-src 'self'; child-src 'self' blob:; object-src 'none'; connect-src 'self' https://*.ente.io data: blob: https://ente-prod-eu.s3.eu-central-003.backblazeb2.com https://ente-prod-v3.s3.eu-central-2.wasabisys.com/ ; base-uri 'self'; frame-ancestors 'none'; form-action 'none'; report-uri https://csp-reporter.ente.io; report-to https://csp-reporter.ente.io;
diff --git a/sentry.client.config.js b/sentry.client.config.js
index 3eec2c8fc..aeda578d9 100644
--- a/sentry.client.config.js
+++ b/sentry.client.config.js
@@ -13,7 +13,6 @@ const SENTRY_ENV = getSentryENV();
const SENTRY_RELEASE = getSentryRelease();
const IS_ENABLED = getIsSentryEnabled();
-Sentry.setUser({ id: getSentryUserID() });
Sentry.init({
dsn: SENTRY_DSN,
enabled: IS_ENABLED,
@@ -39,3 +38,9 @@ Sentry.init({
// `release` value here - use the environment variable `SENTRY_RELEASE`, so
// that it will also get attached to your source maps
});
+
+const main = async () => {
+ Sentry.setUser({ id: await getSentryUserID() });
+};
+
+main();
diff --git a/sentry.server.config.js b/sentry.server.config.js
index 5d8714c99..79b62e6bd 100644
--- a/sentry.server.config.js
+++ b/sentry.server.config.js
@@ -6,6 +6,8 @@ import {
getIsSentryEnabled,
} from 'constants/sentry';
+import { getSentryUserID } from 'utils/user';
+
const SENTRY_DSN = getSentryDSN();
const SENTRY_ENV = getSentryENV();
const SENTRY_RELEASE = getSentryRelease();
@@ -18,3 +20,9 @@ Sentry.init({
release: SENTRY_RELEASE,
autoSessionTracking: false,
});
+
+const main = async () => {
+ Sentry.setUser({ id: await getSentryUserID() });
+};
+
+main();
diff --git a/sentryConfigUtil.js b/sentryConfigUtil.js
index 1b19f2f6b..84d4a7628 100644
--- a/sentryConfigUtil.js
+++ b/sentryConfigUtil.js
@@ -1,10 +1,11 @@
+const ENV_DEVELOPMENT = 'development';
+
module.exports.getIsSentryEnabled = () => {
- if (process.env.NEXT_PUBLIC_IS_SENTRY_ENABLED) {
- return process.env.NEXT_PUBLIC_IS_SENTRY_ENABLED === 'yes';
+ if (process.env.NEXT_PUBLIC_SENTRY_ENV === ENV_DEVELOPMENT) {
+ return false;
+ } else if (process.env.NEXT_PUBLIC_DISABLE_SENTRY === 'true') {
+ return false;
} else {
- if (process.env.NEXT_PUBLIC_SENTRY_ENV) {
- return process.env.NEXT_PUBLIC_SENTRY_ENV !== 'development';
- }
+ return true;
}
- return false;
};
diff --git a/src/components/Badge.tsx b/src/components/Badge.tsx
index 773729509..c145b2000 100644
--- a/src/components/Badge.tsx
+++ b/src/components/Badge.tsx
@@ -3,8 +3,9 @@ import { CSSProperties } from '@mui/styled-engine';
export const Badge = styled(Paper)(({ theme }) => ({
padding: '2px 4px',
- backgroundColor: theme.palette.glass.main,
- color: theme.palette.glass.contrastText,
+ backgroundColor: theme.palette.backdrop.main,
+ backdropFilter: `blur(${theme.palette.blur.muted})`,
+ color: theme.palette.primary.contrastText,
textTransform: 'uppercase',
...(theme.typography.mini as CSSProperties),
}));
diff --git a/src/components/Chip.tsx b/src/components/Chip.tsx
new file mode 100644
index 000000000..bce7429e1
--- /dev/null
+++ b/src/components/Chip.tsx
@@ -0,0 +1,10 @@
+import { Box, styled } from '@mui/material';
+import { CSSProperties } from 'react';
+
+export const Chip = styled(Box)(({ theme }) => ({
+ ...(theme.typography.body2 as CSSProperties),
+ padding: '8px 12px',
+ borderRadius: '4px',
+ backgroundColor: theme.palette.fill.dark,
+ fontWeight: 'bold',
+}));
diff --git a/src/components/CodeBlock/CopyButton.tsx b/src/components/CodeBlock/CopyButton.tsx
index 9686c0392..bc8e09f60 100644
--- a/src/components/CodeBlock/CopyButton.tsx
+++ b/src/components/CodeBlock/CopyButton.tsx
@@ -1,20 +1,43 @@
-import React from 'react';
+import React, { useState } from 'react';
import constants from 'utils/strings/constants';
-import { CopyButtonWrapper } from './styledComponents';
import DoneIcon from '@mui/icons-material/Done';
import ContentCopyIcon from '@mui/icons-material/ContentCopy';
-import { Tooltip } from '@mui/material';
+import {
+ IconButton,
+ IconButtonProps,
+ SvgIconProps,
+ Tooltip,
+} from '@mui/material';
-export default function CopyButton({ code, copied, copyToClipboardHelper }) {
+export default function CopyButton({
+ code,
+ color,
+ size,
+}: {
+ code: string;
+ color?: IconButtonProps['color'];
+ size?: SvgIconProps['fontSize'];
+}) {
+ const [copied, setCopied] = useState
@@ -307,29 +346,30 @@ const PhotoFrame = ({
}
return file;
};
- setFiles((files) => {
- const index = getFileIndexFromID(files, id);
- files[index] = updateFile(files[index]);
- return files;
- });
const index = getFileIndexFromID(files, id);
return updateFile(files[index]);
};
const updateSrcURL = async (id: number, srcURL: SourceURL) => {
- const { videoURL, imageURL } = srcURL;
- const isPlayable = videoURL && (await isPlaybackPossible(videoURL));
+ const {
+ originalImageURL,
+ convertedImageURL,
+ originalVideoURL,
+ convertedVideoURL,
+ } = srcURL;
+ const isPlayable =
+ convertedVideoURL && (await isPlaybackPossible(convertedVideoURL));
const updateFile = (file: EnteFile) => {
- file = {
- ...file,
- w: window.innerWidth,
- h: window.innerHeight,
- };
+ file.w = window.innerWidth;
+ file.h = window.innerHeight;
+ file.isSourceLoaded = true;
+ file.originalImageURL = originalImageURL;
+ file.originalVideoURL = originalVideoURL;
if (file.metadata.fileType === FILE_TYPE.VIDEO) {
if (isPlayable) {
file.html = `
`;
@@ -339,7 +379,7 @@ const PhotoFrame = ({
`;
@@ -348,9 +388,9 @@ const PhotoFrame = ({
if (isPlayable) {
file.html = `
- 
+ 
@@ -367,15 +407,10 @@ const PhotoFrame = ({
`;
}
} else {
- file.src = imageURL;
+ file.src = convertedImageURL;
}
return file;
};
- setFiles((files) => {
- const index = getFileIndexFromID(files, id);
- files[index] = updateFile(files[index]);
- return files;
- });
setIsSourceLoaded(true);
const index = getFileIndexFromID(files, id);
return updateFile(files[index]);
@@ -441,7 +476,11 @@ const PhotoFrame = ({
handleSelect(filteredData[index].id, index)(!checked);
}
};
- const getThumbnail = (files: EnteFile[], index: number) =>
+ const getThumbnail = (
+ files: EnteFile[],
+ index: number,
+ isScrolling: boolean
+ ) =>
files[index] ? (
- {constants.PRESERVED_BY}{' '}
-
+
{exif.raw};
-
- const renderSelectedValues = () => (
- <>
- {exif?.Make &&
- exif?.Model &&
- RenderInfoItem(constants.DEVICE, `${exif.Make} ${exif.Model}`)}
- {exif?.ImageWidth &&
- exif?.ImageHeight &&
- RenderInfoItem(
- constants.IMAGE_SIZE,
- `${exif.ImageWidth} x ${exif.ImageHeight}`
- )}
- {exif?.Flash && RenderInfoItem(constants.FLASH, exif.Flash)}
- {exif?.FocalLength &&
- RenderInfoItem(
- constants.FOCAL_LENGTH,
- exif.FocalLength.toString()
- )}
- {exif?.ApertureValue &&
- RenderInfoItem(
- constants.APERTURE,
- exif.ApertureValue.toString()
- )}
- {exif?.ISOSpeedRatings &&
- RenderInfoItem(constants.ISO, exif.ISOSpeedRatings.toString())}
-
- );
-
- return (
- <>
-
-
-
-
-
-
-
-
-
-
-
-
-
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+
+
+
+
+
+
+
+
+
+
+
+
@@ -411,36 +620,34 @@ function PhotoSwipe(props: Iprops) {
-
-
+
+