From 3647bba825d94e5e21c3560700c3de272a4e13b5 Mon Sep 17 00:00:00 2001 From: Sam Becker Date: Fri, 1 Mar 2024 15:11:44 -0600 Subject: [PATCH 1/3] Revert to Next 14.1.0 --- package.json | 4 +- pnpm-lock.yaml | 108 ++++++++++++++++++++++++------------------------- 2 files changed, 54 insertions(+), 58 deletions(-) diff --git a/package.json b/package.json index bfc202b5..ae681357 100644 --- a/package.json +++ b/package.json @@ -11,7 +11,7 @@ "dependencies": { "@aws-sdk/client-s3": "3.525.0", "@aws-sdk/s3-request-presigner": "3.525.0", - "@next/bundle-analyzer": "14.1.1", + "@next/bundle-analyzer": "14.1.0", "@radix-ui/react-dropdown-menu": "^2.0.6", "@tailwindcss/container-queries": "^0.1.1", "@tailwindcss/forms": "^0.5.7", @@ -39,7 +39,7 @@ "jest": "^29.7.0", "jest-environment-jsdom": "^29.7.0", "nanoid": "^5.0.6", - "next": "14.1.1", + "next": "14.1.0", "next-auth": "5.0.0-beta.13", "next-themes": "^0.2.1", "postcss": "8.4.35", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index ee21f706..85bafa33 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -12,8 +12,8 @@ dependencies: specifier: 3.525.0 version: 3.525.0 '@next/bundle-analyzer': - specifier: 14.1.1 - version: 14.1.1 + specifier: 14.1.0 + version: 14.1.0 '@radix-ui/react-dropdown-menu': specifier: ^2.0.6 version: 2.0.6(@types/react-dom@18.2.19)(@types/react@18.2.61)(react-dom@18.2.0)(react@18.2.0) @@ -49,7 +49,7 @@ dependencies: version: 7.1.0(eslint@8.57.0)(typescript@5.3.3) '@vercel/analytics': specifier: ^1.2.2 - version: 1.2.2(next@14.1.1)(react@18.2.0) + version: 1.2.2(next@14.1.0)(react@18.2.0) '@vercel/blob': specifier: ^0.22.1 version: 0.22.1 @@ -58,7 +58,7 @@ dependencies: version: 0.7.2 '@vercel/speed-insights': specifier: ^1.0.10 - version: 1.0.10(next@14.1.1)(react@18.2.0) + version: 1.0.10(next@14.1.0)(react@18.2.0) autoprefixer: specifier: 10.4.18 version: 10.4.18(postcss@8.4.35) @@ -96,14 +96,14 @@ dependencies: specifier: ^5.0.6 version: 5.0.6 next: - specifier: 14.1.1 - version: 14.1.1(@babel/core@7.23.9)(react-dom@18.2.0)(react@18.2.0) + specifier: 14.1.0 + version: 14.1.0(@babel/core@7.23.9)(react-dom@18.2.0)(react@18.2.0) next-auth: specifier: 5.0.0-beta.13 - version: 5.0.0-beta.13(next@14.1.1)(react@18.2.0) + version: 5.0.0-beta.13(next@14.1.0)(react@18.2.0) next-themes: specifier: ^0.2.1 - version: 0.2.1(next@14.1.1)(react-dom@18.2.0)(react@18.2.0) + version: 0.2.1(next@14.1.0)(react-dom@18.2.0)(react@18.2.0) postcss: specifier: 8.4.35 version: 8.4.35 @@ -1557,8 +1557,8 @@ packages: '@types/pg': 8.6.6 dev: false - /@next/bundle-analyzer@14.1.1: - resolution: {integrity: sha512-vM8PLggRNodmJo8FJy6+Bnv4jWsVtOuH87naJA7/sdmBUZrBk2fj3xkI1zwarWzDAYzNYTxiMRGVioyNPxBvXg==} + /@next/bundle-analyzer@14.1.0: + resolution: {integrity: sha512-RJWjnlMp/1WSW0ahAdawV22WgJiC6BVaFS5Xfhw6gP7NJEX3cAJjh4JqSHKGr8GnLNRaFCVTQdDPoX84E421BA==} dependencies: webpack-bundle-analyzer: 4.10.1 transitivePeerDependencies: @@ -1566,8 +1566,8 @@ packages: - utf-8-validate dev: false - /@next/env@14.1.1: - resolution: {integrity: sha512-7CnQyD5G8shHxQIIg3c7/pSeYFeMhsNbpU/bmvH7ZnDql7mNRgg8O2JZrhrc/soFnfBnKP4/xXNiiSIPn2w8gA==} + /@next/env@14.1.0: + resolution: {integrity: sha512-Py8zIo+02ht82brwwhTg36iogzFqGLPXlRGKQw5s+qP/kMNc4MAyDeEwBKDijk6zTIbegEgu8Qy7C1LboslQAw==} dev: false /@next/eslint-plugin-next@14.1.1: @@ -1576,8 +1576,8 @@ packages: glob: 10.3.10 dev: false - /@next/swc-darwin-arm64@14.1.1: - resolution: {integrity: sha512-yDjSFKQKTIjyT7cFv+DqQfW5jsD+tVxXTckSe1KIouKk75t1qZmj/mV3wzdmFb0XHVGtyRjDMulfVG8uCKemOQ==} + /@next/swc-darwin-arm64@14.1.0: + resolution: {integrity: sha512-nUDn7TOGcIeyQni6lZHfzNoo9S0euXnu0jhsbMOmMJUBfgsnESdjN97kM7cBqQxZa8L/bM9om/S5/1dzCrW6wQ==} engines: {node: '>= 10'} cpu: [arm64] os: [darwin] @@ -1585,8 +1585,8 @@ packages: dev: false optional: true - /@next/swc-darwin-x64@14.1.1: - resolution: {integrity: sha512-KCQmBL0CmFmN8D64FHIZVD9I4ugQsDBBEJKiblXGgwn7wBCSe8N4Dx47sdzl4JAg39IkSN5NNrr8AniXLMb3aw==} + /@next/swc-darwin-x64@14.1.0: + resolution: {integrity: sha512-1jgudN5haWxiAl3O1ljUS2GfupPmcftu2RYJqZiMJmmbBT5M1XDffjUtRUzP4W3cBHsrvkfOFdQ71hAreNQP6g==} engines: {node: '>= 10'} cpu: [x64] os: [darwin] @@ -1594,8 +1594,8 @@ packages: dev: false optional: true - /@next/swc-linux-arm64-gnu@14.1.1: - resolution: {integrity: sha512-YDQfbWyW0JMKhJf/T4eyFr4b3tceTorQ5w2n7I0mNVTFOvu6CGEzfwT3RSAQGTi/FFMTFcuspPec/7dFHuP7Eg==} + /@next/swc-linux-arm64-gnu@14.1.0: + resolution: {integrity: sha512-RHo7Tcj+jllXUbK7xk2NyIDod3YcCPDZxj1WLIYxd709BQ7WuRYl3OWUNG+WUfqeQBds6kvZYlc42NJJTNi4tQ==} engines: {node: '>= 10'} cpu: [arm64] os: [linux] @@ -1603,8 +1603,8 @@ packages: dev: false optional: true - /@next/swc-linux-arm64-musl@14.1.1: - resolution: {integrity: sha512-fiuN/OG6sNGRN/bRFxRvV5LyzLB8gaL8cbDH5o3mEiVwfcMzyE5T//ilMmaTrnA8HLMS6hoz4cHOu6Qcp9vxgQ==} + /@next/swc-linux-arm64-musl@14.1.0: + resolution: {integrity: sha512-v6kP8sHYxjO8RwHmWMJSq7VZP2nYCkRVQ0qolh2l6xroe9QjbgV8siTbduED4u0hlk0+tjS6/Tuy4n5XCp+l6g==} engines: {node: '>= 10'} cpu: [arm64] os: [linux] @@ -1612,8 +1612,8 @@ packages: dev: false optional: true - /@next/swc-linux-x64-gnu@14.1.1: - resolution: {integrity: sha512-rv6AAdEXoezjbdfp3ouMuVqeLjE1Bin0AuE6qxE6V9g3Giz5/R3xpocHoAi7CufRR+lnkuUjRBn05SYJ83oKNQ==} + /@next/swc-linux-x64-gnu@14.1.0: + resolution: {integrity: sha512-zJ2pnoFYB1F4vmEVlb/eSe+VH679zT1VdXlZKX+pE66grOgjmKJHKacf82g/sWE4MQ4Rk2FMBCRnX+l6/TVYzQ==} engines: {node: '>= 10'} cpu: [x64] os: [linux] @@ -1621,8 +1621,8 @@ packages: dev: false optional: true - /@next/swc-linux-x64-musl@14.1.1: - resolution: {integrity: sha512-YAZLGsaNeChSrpz/G7MxO3TIBLaMN8QWMr3X8bt6rCvKovwU7GqQlDu99WdvF33kI8ZahvcdbFsy4jAFzFX7og==} + /@next/swc-linux-x64-musl@14.1.0: + resolution: {integrity: sha512-rbaIYFt2X9YZBSbH/CwGAjbBG2/MrACCVu2X0+kSykHzHnYH5FjHxwXLkcoJ10cX0aWCEynpu+rP76x0914atg==} engines: {node: '>= 10'} cpu: [x64] os: [linux] @@ -1630,8 +1630,8 @@ packages: dev: false optional: true - /@next/swc-win32-arm64-msvc@14.1.1: - resolution: {integrity: sha512-1L4mUYPBMvVDMZg1inUYyPvFSduot0g73hgfD9CODgbr4xiTYe0VOMTZzaRqYJYBA9mana0x4eaAaypmWo1r5A==} + /@next/swc-win32-arm64-msvc@14.1.0: + resolution: {integrity: sha512-o1N5TsYc8f/HpGt39OUQpQ9AKIGApd3QLueu7hXk//2xq5Z9OxmV6sQfNp8C7qYmiOlHYODOGqNNa0e9jvchGQ==} engines: {node: '>= 10'} cpu: [arm64] os: [win32] @@ -1639,8 +1639,8 @@ packages: dev: false optional: true - /@next/swc-win32-ia32-msvc@14.1.1: - resolution: {integrity: sha512-jvIE9tsuj9vpbbXlR5YxrghRfMuG0Qm/nZ/1KDHc+y6FpnZ/apsgh+G6t15vefU0zp3WSpTMIdXRUsNl/7RSuw==} + /@next/swc-win32-ia32-msvc@14.1.0: + resolution: {integrity: sha512-XXIuB1DBRCFwNO6EEzCTMHT5pauwaSj4SWs7CYnME57eaReAKBXCnkUE80p/pAZcewm7hs+vGvNqDPacEXHVkw==} engines: {node: '>= 10'} cpu: [ia32] os: [win32] @@ -1648,8 +1648,8 @@ packages: dev: false optional: true - /@next/swc-win32-x64-msvc@14.1.1: - resolution: {integrity: sha512-S6K6EHDU5+1KrBDLko7/c1MNy/Ya73pIAmvKeFwsF4RmBFJSO7/7YeD4FnZ4iBdzE69PpQ4sOMU9ORKeNuxe8A==} + /@next/swc-win32-x64-msvc@14.1.0: + resolution: {integrity: sha512-9WEbVRRAqJ3YFVqEZIxUqkiO8l1nool1LmNxygr5HWF8AcSYsEpneUDhmjUVJEzO2A04+oPtZdombzzPPkTtgg==} engines: {node: '>= 10'} cpu: [x64] os: [win32] @@ -3249,7 +3249,7 @@ packages: resolution: {integrity: sha512-zuVdFrMJiuCDQUMCzQaD6KL28MjnqqN8XnAqiEq9PNm/hCPTSGfrXCOfwj1ow4LFb/tNymJPwsNbVePc1xFqrQ==} dev: false - /@vercel/analytics@1.2.2(next@14.1.1)(react@18.2.0): + /@vercel/analytics@1.2.2(next@14.1.0)(react@18.2.0): resolution: {integrity: sha512-X0rctVWkQV1e5Y300ehVNqpOfSOufo7ieA5PIdna8yX/U7Vjz0GFsGf4qvAhxV02uQ2CVt7GYcrFfddXXK2Y4A==} peerDependencies: next: '>= 13' @@ -3260,7 +3260,7 @@ packages: react: optional: true dependencies: - next: 14.1.1(@babel/core@7.23.9)(react-dom@18.2.0)(react@18.2.0) + next: 14.1.0(@babel/core@7.23.9)(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 server-only: 0.0.1 dev: false @@ -3285,7 +3285,7 @@ packages: ws: 8.14.2(bufferutil@4.0.8)(utf-8-validate@6.0.3) dev: false - /@vercel/speed-insights@1.0.10(next@14.1.1)(react@18.2.0): + /@vercel/speed-insights@1.0.10(next@14.1.0)(react@18.2.0): resolution: {integrity: sha512-4uzdKB0RW6Ff2FkzshzjZ+RlJfLPxgm/00i0XXgxfMPhwnnsk92YgtqsxT9OcPLdJUyVU1DqFlSWWjIQMPkh0g==} requiresBuild: true peerDependencies: @@ -3309,7 +3309,7 @@ packages: vue-router: optional: true dependencies: - next: 14.1.1(@babel/core@7.23.9)(react-dom@18.2.0)(react@18.2.0) + next: 14.1.0(@babel/core@7.23.9)(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 dev: false @@ -3700,7 +3700,7 @@ packages: engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7} hasBin: true dependencies: - caniuse-lite: 1.0.30001585 + caniuse-lite: 1.0.30001591 electron-to-chromium: 1.4.664 node-releases: 2.0.14 update-browserslist-db: 1.0.13(browserslist@4.22.3) @@ -3792,10 +3792,6 @@ packages: engines: {node: '>=16'} dev: false - /caniuse-lite@1.0.30001585: - resolution: {integrity: sha512-yr2BWR1yLXQ8fMpdS/4ZZXpseBgE7o4g41x3a6AJOqZuOi+iE/WdJYAuZ6Y95i4Ohd2Y+9MzIWRR+uGABH4s3Q==} - dev: false - /caniuse-lite@1.0.30001591: resolution: {integrity: sha512-PCzRMei/vXjJyL5mJtzNiUCKP59dm8Apqc3PH8gJkMnMXZGox93RbE76jHsmLwmIo6/3nsYIpJtx0O7u5PqFuQ==} dev: false @@ -6219,7 +6215,7 @@ packages: resolution: {integrity: sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==} dev: false - /next-auth@5.0.0-beta.13(next@14.1.1)(react@18.2.0): + /next-auth@5.0.0-beta.13(next@14.1.0)(react@18.2.0): resolution: {integrity: sha512-2m2Gq69WQ0YXcHCCpHn2y5z1bxSlqD/XOuAgrdtz49/VIAdTFFeYZz97RYqf6xMF8VGmoG32VUnJ6LzaHk6Fwg==} peerDependencies: '@simplewebauthn/browser': ^9.0.1 @@ -6236,24 +6232,24 @@ packages: optional: true dependencies: '@auth/core': 0.27.0 - next: 14.1.1(@babel/core@7.23.9)(react-dom@18.2.0)(react@18.2.0) + next: 14.1.0(@babel/core@7.23.9)(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 dev: false - /next-themes@0.2.1(next@14.1.1)(react-dom@18.2.0)(react@18.2.0): + /next-themes@0.2.1(next@14.1.0)(react-dom@18.2.0)(react@18.2.0): resolution: {integrity: sha512-B+AKNfYNIzh0vqQQKqQItTS8evEouKD7H5Hj3kmuPERwddR2TxvDSFZuTj6T7Jfn1oyeUyJMydPl1Bkxkh0W7A==} peerDependencies: next: '*' react: '*' react-dom: '*' dependencies: - next: 14.1.1(@babel/core@7.23.9)(react-dom@18.2.0)(react@18.2.0) + next: 14.1.0(@babel/core@7.23.9)(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 react-dom: 18.2.0(react@18.2.0) dev: false - /next@14.1.1(@babel/core@7.23.9)(react-dom@18.2.0)(react@18.2.0): - resolution: {integrity: sha512-McrGJqlGSHeaz2yTRPkEucxQKe5Zq7uPwyeHNmJaZNY4wx9E9QdxmTp310agFRoMuIYgQrCrT3petg13fSVOww==} + /next@14.1.0(@babel/core@7.23.9)(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-wlzrsbfeSU48YQBjZhDzOwhWhGsy+uQycR8bHAOt1LY1bn3zZEcDyHQOEoN3aWzQ8LHCAJ1nqrWCc9XF2+O45Q==} engines: {node: '>=18.17.0'} hasBin: true peerDependencies: @@ -6267,25 +6263,25 @@ packages: sass: optional: true dependencies: - '@next/env': 14.1.1 + '@next/env': 14.1.0 '@swc/helpers': 0.5.2 busboy: 1.6.0 - caniuse-lite: 1.0.30001585 + caniuse-lite: 1.0.30001591 graceful-fs: 4.2.11 postcss: 8.4.31 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) styled-jsx: 5.1.1(@babel/core@7.23.9)(react@18.2.0) optionalDependencies: - '@next/swc-darwin-arm64': 14.1.1 - '@next/swc-darwin-x64': 14.1.1 - '@next/swc-linux-arm64-gnu': 14.1.1 - '@next/swc-linux-arm64-musl': 14.1.1 - '@next/swc-linux-x64-gnu': 14.1.1 - '@next/swc-linux-x64-musl': 14.1.1 - '@next/swc-win32-arm64-msvc': 14.1.1 - '@next/swc-win32-ia32-msvc': 14.1.1 - '@next/swc-win32-x64-msvc': 14.1.1 + '@next/swc-darwin-arm64': 14.1.0 + '@next/swc-darwin-x64': 14.1.0 + '@next/swc-linux-arm64-gnu': 14.1.0 + '@next/swc-linux-arm64-musl': 14.1.0 + '@next/swc-linux-x64-gnu': 14.1.0 + '@next/swc-linux-x64-musl': 14.1.0 + '@next/swc-win32-arm64-msvc': 14.1.0 + '@next/swc-win32-ia32-msvc': 14.1.0 + '@next/swc-win32-x64-msvc': 14.1.0 transitivePeerDependencies: - '@babel/core' - babel-plugin-macros From 8c8edf652362c190fb45e60bf862a79c533235e9 Mon Sep 17 00:00:00 2001 From: Sam Becker Date: Fri, 1 Mar 2024 15:46:40 -0600 Subject: [PATCH 2/3] Refine Image object ref handling --- src/components/CanvasBlurCapture.tsx | 16 +++++++++------- 1 file changed, 9 insertions(+), 7 deletions(-) diff --git a/src/components/CanvasBlurCapture.tsx b/src/components/CanvasBlurCapture.tsx index fa8650bb..d6400646 100644 --- a/src/components/CanvasBlurCapture.tsx +++ b/src/components/CanvasBlurCapture.tsx @@ -24,7 +24,7 @@ export default function CanvasBlurCapture({ quality?: number }) { const refCanvas = useRef(null); - const refImage = useRef(null); + const refImage = useRef(); const refTimeouts = useRef([]); const refShouldCapture = useRef(true); @@ -51,7 +51,8 @@ export default function CanvasBlurCapture({ -edgeCompensation, -edgeCompensation, width + edgeCompensation * 2, - width * image.height / image.width + edgeCompensation * 2, + width * refImage.current.height / refImage.current.width + + edgeCompensation * 2, ); refTimeouts.current.forEach(clearTimeout); onCapture(canvas.toDataURL('image/jpeg', quality)); @@ -70,11 +71,12 @@ export default function CanvasBlurCapture({ } }; - const image = new Image(); - image.crossOrigin = 'anonymous'; - image.src = imageUrl; - image.onload = capture; - refImage.current = image; + if (!refImage.current) { + refImage.current = new Image(); + } + refImage.current.crossOrigin = 'anonymous'; + refImage.current.src = imageUrl; + refImage.current.onload = capture; // Attempt delayed capture in case image.onload never fires refTimeouts.current.push(setTimeout(capture, RETRY_DELAY)); From 16b107c252737741417dcd2a44ac691d3e666776 Mon Sep 17 00:00:00 2001 From: Sam Becker Date: Fri, 1 Mar 2024 15:56:43 -0600 Subject: [PATCH 3/3] Tweak Image ref handling --- src/components/CanvasBlurCapture.tsx | 11 +++++------ 1 file changed, 5 insertions(+), 6 deletions(-) diff --git a/src/components/CanvasBlurCapture.tsx b/src/components/CanvasBlurCapture.tsx index d6400646..a47d6a2a 100644 --- a/src/components/CanvasBlurCapture.tsx +++ b/src/components/CanvasBlurCapture.tsx @@ -24,7 +24,7 @@ export default function CanvasBlurCapture({ quality?: number }) { const refCanvas = useRef(null); - const refImage = useRef(); + const refImage = useRef(typeof Image !== 'undefined' ? new Image() : null); const refTimeouts = useRef([]); const refShouldCapture = useRef(true); @@ -71,12 +71,11 @@ export default function CanvasBlurCapture({ } }; - if (!refImage.current) { - refImage.current = new Image(); + if (refImage.current) { + refImage.current.crossOrigin = 'anonymous'; + refImage.current.src = imageUrl; + refImage.current.onload = capture; } - refImage.current.crossOrigin = 'anonymous'; - refImage.current.src = imageUrl; - refImage.current.onload = capture; // Attempt delayed capture in case image.onload never fires refTimeouts.current.push(setTimeout(capture, RETRY_DELAY));