From da8138f80f70691213fae8e58aef3193fb05dd05 Mon Sep 17 00:00:00 2001 From: sebastien Date: Wed, 21 Oct 2026 12:03:30 +0200 Subject: [PATCH] refactor(ideal-image): remove unused code from the internalized react-ideal-image fork (AI-assisted) - MediaWithDefaults: never imported - Commented-out getScreenWidth(), supportsWebp() and fetchLoader() - Commented-out tests, and the test import they left unused Co-Authored-By: Claude Opus 5.5 --- .../IdealImageLegacy/__tests__/helpers.js | 87 +----------------- .../components/MediaWithDefaults/README.md | 89 ------------------- .../components/MediaWithDefaults/index.js | 11 --- .../IdealImageLegacy/components/helpers.js | 32 ------- .../IdealImageLegacy/components/loaders.js | 27 ------ 5 files changed, 1 insertion(+), 245 deletions(-) delete mode 100644 packages/docusaurus-plugin-ideal-image/src/theme/IdealImageLegacy/components/MediaWithDefaults/README.md delete mode 100644 packages/docusaurus-plugin-ideal-image/src/theme/IdealImageLegacy/components/MediaWithDefaults/index.js diff --git a/packages/docusaurus-plugin-ideal-image/src/theme/IdealImageLegacy/__tests__/helpers.js b/packages/docusaurus-plugin-ideal-image/src/theme/IdealImageLegacy/__tests__/helpers.js index 284a8ad04251..dc5f065ef191 100644 --- a/packages/docusaurus-plugin-ideal-image/src/theme/IdealImageLegacy/__tests__/helpers.js +++ b/packages/docusaurus-plugin-ideal-image/src/theme/IdealImageLegacy/__tests__/helpers.js @@ -1,75 +1,5 @@ import {describe, expect, it} from 'vitest'; -import { - // guessMaxImageWidth, - bytesToSize, - selectSrc, - fallbackParams, -} from '../components/helpers'; - -/* -describe('guessMaxImageWidth', () => { - it('Should calculate the maximum image width', () => { - const dimensions = { - width: 400, - height: 100, - } - const mockedWindow = { - screen: { - width: 100, - }, - innerWidth: 1024, - innerHeight: 768, - } - const expected = dimensions.width - const result = guessMaxImageWidth(dimensions, mockedWindow) - - expect(result).toEqual(expected) - }) - - it('Should calculate the maximum image width with screen changes', () => { - const dimensions = { - width: 400, - height: 100, - } - const mockedWindow = { - screen: { - width: 100, - }, - innerWidth: 50, - innerHeight: 30, - } - const expected = - (dimensions.width / mockedWindow.innerWidth) * mockedWindow.screen.width - const result = guessMaxImageWidth(dimensions, mockedWindow) - - expect(result).toEqual(expected) - }) - - it('Should calculate the maximum image width with screen changes and scroll', () => { - const body = document.getElementsByTagName('body')[0] - Object.defineProperty(body, 'clientHeight', { - get: () => { - return 400 - }, - }) - const dimensions = { - width: 400, - height: 100, - } - const mockedWindow = { - screen: { - width: 100, - }, - innerWidth: 50, - innerHeight: 100, - } - const expected = 450 - const result = guessMaxImageWidth(dimensions, mockedWindow) - - expect(result).toEqual(expected) - }) -}) -*/ +import {bytesToSize, selectSrc} from '../components/helpers'; describe('bytesToSize', () => { const bitsInKB = 1024; @@ -169,18 +99,3 @@ describe('selectSrc', () => { expect(result).toEqual(expected); }); }); - -/* -describe('fallbackParams', () => { - it('Should return an empty object when run in the browser environment', () => { - const result = fallbackParams({ - srcSet: [ - { - format: 'webp', - }, - ], - }); - expect(result).toEqual({}); - }); -}); - */ diff --git a/packages/docusaurus-plugin-ideal-image/src/theme/IdealImageLegacy/components/MediaWithDefaults/README.md b/packages/docusaurus-plugin-ideal-image/src/theme/IdealImageLegacy/components/MediaWithDefaults/README.md deleted file mode 100644 index a69473f61e2c..000000000000 --- a/packages/docusaurus-plugin-ideal-image/src/theme/IdealImageLegacy/components/MediaWithDefaults/README.md +++ /dev/null @@ -1,89 +0,0 @@ -All possible states of the component - -```js -const lqip = - 'data:image/jpeg;base64,/9j/2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhYaHSUfGhsjHBYWICwgIyYnKSopGR8tMC0oMCUoKSj/2wBDAQcHBwoIChMKChMoGhYaKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCj/wAARCAAIAA4DASIAAhEBAxEB/8QAFgABAQEAAAAAAAAAAAAAAAAAAAUG/8QAIRAAAQQDAAEFAAAAAAAAAAAAAQIDBREABAYhEjEyQVH/xAAUAQEAAAAAAAAAAAAAAAAAAAAE/8QAGBEBAAMBAAAAAAAAAAAAAAAAAQACIRH/2gAMAwEAAhEDEQA/AMJ2DG+7Dw0nz8gsx+uyhlxnWdLakOlfzpIF3aRf1WT5t96P5+N1ug9Tu7ZWS8q1gG6B8H2FDz+YxhjUrEOdZ//Z'; - -const sqip = - "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4774 3024'%3e%3cfilter id='b'%3e%3cfeGaussianBlur stdDeviation='12' /%3e%3c/filter%3e%3cpath fill='%23515a57' d='M0 0h4774v3021H0z'/%3e%3cg filter='url(%23b)' transform='translate(9.3 9.3) scale(18.64844)' fill-opacity='.5'%3e%3cellipse fill='whitefef' rx='1' ry='1' transform='matrix(74.55002 60.89891 -21.7939 26.67923 151.8 104.4)'/%3e%3cellipse fill='black80c' cx='216' cy='49' rx='59' ry='59'/%3e%3cellipse fill='black60e' cx='22' cy='60' rx='46' ry='89'/%3e%3cellipse fill='%23ffebd5' cx='110' cy='66' rx='42' ry='28'/%3e%3cellipse fill='whiteff9' rx='1' ry='1' transform='rotate(33.3 -113.2 392.6) scale(42.337 17.49703)'/%3e%3cellipse fill='%23031f1e' rx='1' ry='1' transform='matrix(163.4651 -64.93326 6.77862 17.06471 111 16.4)'/%3e%3cpath fill='whitefea' d='M66 74l9 39 16-44z'/%3e%3cellipse fill='%23a28364' rx='1' ry='1' transform='rotate(-32.4 253.2 -179) scale(30.79511 43.65381)'/%3e%3cpath fill='%231a232c' d='M40 139l61-57 33 95z'/%3e%3cpath fill='%230a222b' d='M249.8 153.3l-48.1-48 32.5-32.6 48.1 48z'/%3e%3c/g%3e%3c/svg%3e"; - - - - - - - - - - - - - - - - - - - - - -
- load - - - - noicon - - -
loading - - offline - -
loaded - - error - -
; -``` diff --git a/packages/docusaurus-plugin-ideal-image/src/theme/IdealImageLegacy/components/MediaWithDefaults/index.js b/packages/docusaurus-plugin-ideal-image/src/theme/IdealImageLegacy/components/MediaWithDefaults/index.js deleted file mode 100644 index eb96a307afd6..000000000000 --- a/packages/docusaurus-plugin-ideal-image/src/theme/IdealImageLegacy/components/MediaWithDefaults/index.js +++ /dev/null @@ -1,11 +0,0 @@ -import Media from '../Media'; -import icons from '../icons'; -import theme from '../theme'; - -const MediaWithDefaults = ({ - icons: iconsProp = icons, - theme: themeProp = theme, - ...props -}) => ; - -export default MediaWithDefaults; diff --git a/packages/docusaurus-plugin-ideal-image/src/theme/IdealImageLegacy/components/helpers.js b/packages/docusaurus-plugin-ideal-image/src/theme/IdealImageLegacy/components/helpers.js index 5360a02721b0..ce13a0a9ffd1 100644 --- a/packages/docusaurus-plugin-ideal-image/src/theme/IdealImageLegacy/components/helpers.js +++ b/packages/docusaurus-plugin-ideal-image/src/theme/IdealImageLegacy/components/helpers.js @@ -3,19 +3,6 @@ export const ssr = export const nativeConnection = !ssr && !!window.navigator.connection; -// export const getScreenWidth = () => { -// if (ssr) return 0 -// const devicePixelRatio = window.devicePixelRatio || 1 -// const {screen} = window -// const {width} = screen -// // const angle = (screen.orientation && screen.orientation.angle) || 0 -// // return Math.max(width, height) -// // const rotated = Math.floor(angle / 90) % 2 !== 0 -// // return (rotated ? height : width) * devicePixelRatio -// return width * devicePixelRatio -// } -// export const screenWidth = getScreenWidth() - export const guessMaxImageWidth = (dimensions, w) => { if (ssr) return 0; @@ -64,25 +51,6 @@ export const bytesToSize = (bytes) => { return `${(bytes / 1024 ** i).toFixed(1)} ${sizes[i]}`; }; -// async function supportsWebp() { -// if (typeof createImageBitmap === 'undefined' || typeof fetch === 'undefined') -// return false -// return fetch( -// 'data:image/webp;base64,UklGRh4AAABXRUJQVlA4TBEAAAAvAAAAAAfQ//73v/+BiOh/AAA=', -// ) -// .then(response => response.blob()) -// .then(blob => createImageBitmap(blob).then(() => true, () => false)) -// } -// let webp = undefined -// const webpPromise = supportsWebp() -// webpPromise.then(x => (webp = x)) -// export default () => { -// if (webp === undefined) return webpPromise -// return { -// then: callback => callback(webp), -// } -// } - const detectWebpSupport = () => { if (ssr) return false; const elem = document.createElement('canvas'); diff --git a/packages/docusaurus-plugin-ideal-image/src/theme/IdealImageLegacy/components/loaders.js b/packages/docusaurus-plugin-ideal-image/src/theme/IdealImageLegacy/components/loaders.js index a0345feaf778..216d7cb9d4fb 100644 --- a/packages/docusaurus-plugin-ideal-image/src/theme/IdealImageLegacy/components/loaders.js +++ b/packages/docusaurus-plugin-ideal-image/src/theme/IdealImageLegacy/components/loaders.js @@ -83,30 +83,3 @@ export const xhrLoader = (url, options) => { }; return result; }; - -// Caveat: AbortController only supported in Chrome 66+ -// Caveat: we still need imageLoader to do actual decoding, -// but if images are uncachable this will lead to two requests -// export const fetchLoader = (url, options) => { -// let controller = new AbortController() -// const signal = controller.signal -// const result = new Promise((resolve, reject) => -// fetch(url, {...options, signal}).then(response => { -// if (response.ok) { -// options && options.onMeta && options.onMeta(response.headers) -// response -// .blob() -// .then(() => imageLoader(url)) -// .then(resolve) -// } else { -// reject({status: response.status}) -// } -// }, reject), -// ) -// result.cancel = () => { -// if (!controller) throw new Error('Already canceled') -// controller.abort() -// controller = undefined -// } -// return result -// }