From 4b376c2037f0b468b17e0f40c2c3ceb7a6e43b2f Mon Sep 17 00:00:00 2001 From: Sergo Date: Tue, 6 Apr 2021 15:05:37 +0800 Subject: [PATCH] Unify react (#100) * Use same react version * Bump packages versions * Update react to 16.14 * Remove unnecessary components --- package-lock.json | 22 +-- package.json | 10 +- packages/button/package.json | 2 +- packages/cache-buster/package.json | 2 +- packages/drawing-toolbar/package-lock.json | 2 +- packages/drawing-toolbar/package.json | 12 +- packages/drawing/package-lock.json | 6 +- packages/drawing/package.json | 2 +- packages/frame/package.json | 2 +- packages/grid/package.json | 2 +- packages/icons/package.json | 2 +- packages/location-viewport/package-lock.json | 16 +- packages/location-viewport/package.json | 6 +- packages/panel/package.json | 2 +- packages/presentation/package-lock.json | 14 +- packages/presentation/package.json | 4 +- packages/spinner/package.json | 2 +- packages/switcher/package.json | 2 +- .../pdf-presentation/pdf-presentation.jsx | 146 ------------------ .../pdf-presentation/pdf-rendering.js | 86 ----------- 20 files changed, 55 insertions(+), 287 deletions(-) delete mode 100644 src/packages/pdf-presentation/pdf-presentation.jsx delete mode 100644 src/packages/pdf-presentation/pdf-rendering.js diff --git a/package-lock.json b/package-lock.json index afe68e8c..e2501370 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "@ulms/components", - "version": "1.3.2", + "version": "1.4.0", "lockfileVersion": 1, "requires": true, "dependencies": { @@ -32671,9 +32671,9 @@ } }, "react": { - "version": "16.12.0", - "resolved": "https://registry.npmjs.org/react/-/react-16.12.0.tgz", - "integrity": "sha512-fglqy3k5E+81pA8s+7K0/T3DBCF0ZDOher1elBFzF7O6arXJgzyu/FW+COxFvAWXJoJN9KIZbT2LXlukwphYTA==", + "version": "16.14.0", + "resolved": "https://registry.npmjs.org/react/-/react-16.14.0.tgz", + "integrity": "sha512-0X2CImDkJGApiAlcf0ODKIneSwBPhqJawOa5wCtKbu7ZECrmS26NvtSILynQ66cgkT/RJ4LidJOc3bUESwmU8g==", "requires": { "loose-envify": "^1.1.0", "object-assign": "^4.1.1", @@ -32774,14 +32774,14 @@ } }, "react-dom": { - "version": "16.12.0", - "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.12.0.tgz", - "integrity": "sha512-LMxFfAGrcS3kETtQaCkTKjMiifahaMySFDn71fZUNpPHZQEzmk/GiAeIT8JSOrHB23fnuCOMruL2a8NYlw+8Gw==", + "version": "16.14.0", + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.14.0.tgz", + "integrity": "sha512-1gCeQXDLoIqMgqD3IO2Ah9bnf0w9kzhwN5q4FGnHZ67hBm9yePzB5JJAIQCc8x3pFnNlwFq4RidZggNAAkzWWw==", "requires": { "loose-envify": "^1.1.0", "object-assign": "^4.1.1", "prop-types": "^15.6.2", - "scheduler": "^0.18.0" + "scheduler": "^0.19.1" } }, "react-draggable": { @@ -35868,9 +35868,9 @@ } }, "scheduler": { - "version": "0.18.0", - "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.18.0.tgz", - "integrity": "sha512-agTSHR1Nbfi6ulI0kYNK0203joW2Y5W4po4l+v03tOoiJKpTBbxpNhWDvqc/4IcOw+KLmSiQLTasZ4cab2/UWQ==", + "version": "0.19.1", + "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.19.1.tgz", + "integrity": "sha512-n/zwRWRYSUj0/3g/otKDRPMh6qv2SYMWNq85IEa8iZyAv8od9zDYpGSnpBEjNgcMNq6Scbu5KfIPxNF72R/2EA==", "requires": { "loose-envify": "^1.1.0", "object-assign": "^4.1.1" diff --git a/package.json b/package.json index 72cdde02..d2af4bad 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@ulms/components", - "version": "1.3.2", + "version": "1.4.0", "description": "UI components library", "homepage": "https://github.com/netology-group/ulms-media-ui", "bugs": { @@ -56,9 +56,9 @@ "popper.js": "^1.15.0", "query-string": "^6.2.0", "rc-slider": "^8.6.9", - "react": "^16.6.3", + "react": "^16.14.0", "react-color": "^2.17.3", - "react-dom": "^16.6.3", + "react-dom": "^16.14.0", "react-sizeme": "~2.6.7", "react-visibility-sensor": "~5.0.2", "recompose": "^0.30.0", @@ -139,9 +139,9 @@ "@foxford/ui": "^1.8.1", "fabric": "netology-group/fabric.js#feature/ULMS-509", "rc-slider": "~8.6.9", - "react": "^15.6 || ^16.x", + "react": "^15.6 || ^16.x || ^17.x", "react-color": "~2.17.0", - "react-dom": "^15.6 || ^16.x", + "react-dom": "^15.6 || ^16.x || ^17.x", "react-sizeme": "~2.6.7", "react-visibility-sensor": "~5.0", "scroll-into-view-if-needed": "~2.2" diff --git a/packages/button/package.json b/packages/button/package.json index 7a5b02aa..e6542467 100644 --- a/packages/button/package.json +++ b/packages/button/package.json @@ -26,7 +26,7 @@ }, "dependencies": { "classnames-es": "^2.2.6", - "react": "^16.12.0" + "react": "^16.14.0" }, "peerDependencies": { "react": "^15.6 || ^16.x || ^17.x" diff --git a/packages/cache-buster/package.json b/packages/cache-buster/package.json index 6d8a29e7..58c01a33 100644 --- a/packages/cache-buster/package.json +++ b/packages/cache-buster/package.json @@ -25,7 +25,7 @@ "build": "rm -rf ./es/* && BABEL_ENV=es rollup --config ./rollup.config.js index.js" }, "dependencies": { - "react": "^16.12.0" + "react": "^16.14.0" }, "peerDependencies": { "react": "^15.6 || ^16.x || ^17.x" diff --git a/packages/drawing-toolbar/package-lock.json b/packages/drawing-toolbar/package-lock.json index dbffb742..3fb0786c 100644 --- a/packages/drawing-toolbar/package-lock.json +++ b/packages/drawing-toolbar/package-lock.json @@ -1,6 +1,6 @@ { "name": "@ulms/ui-drawing-toolbar", - "version": "1.0.3", + "version": "1.0.4", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/packages/drawing-toolbar/package.json b/packages/drawing-toolbar/package.json index 901eaba7..741492f2 100644 --- a/packages/drawing-toolbar/package.json +++ b/packages/drawing-toolbar/package.json @@ -1,6 +1,6 @@ { "name": "@ulms/ui-drawing-toolbar", - "version": "1.0.3", + "version": "1.0.4", "description": "", "keywords": [ "lerna" @@ -30,15 +30,15 @@ "classnames-es": "^2.2.6", "ramda": "^0.26.1", "rc-slider": "^8.6.13", - "react": "^16.12.0", + "react": "^16.14.0", "react-color": "^2.17.3", "react-floater": "^0.6.5" }, - "peerDependencies": { - "react": "^15.6 || ^16.x || ^17.x", - "react-dom": "^16.14 || ^17.x" - }, "devDependencies": { "react-dom": "^16.14.0" + }, + "peerDependencies": { + "react": "^15.6 || ^16.x || ^17.x", + "react-dom": "^15.6 || ^16.x || ^17.x" } } diff --git a/packages/drawing/package-lock.json b/packages/drawing/package-lock.json index 1432ff08..2a7dd29f 100644 --- a/packages/drawing/package-lock.json +++ b/packages/drawing/package-lock.json @@ -989,9 +989,9 @@ } }, "react": { - "version": "16.12.0", - "resolved": "https://registry.npmjs.org/react/-/react-16.12.0.tgz", - "integrity": "sha512-fglqy3k5E+81pA8s+7K0/T3DBCF0ZDOher1elBFzF7O6arXJgzyu/FW+COxFvAWXJoJN9KIZbT2LXlukwphYTA==", + "version": "16.14.0", + "resolved": "https://registry.npmjs.org/react/-/react-16.14.0.tgz", + "integrity": "sha512-0X2CImDkJGApiAlcf0ODKIneSwBPhqJawOa5wCtKbu7ZECrmS26NvtSILynQ66cgkT/RJ4LidJOc3bUESwmU8g==", "requires": { "loose-envify": "^1.1.0", "object-assign": "^4.1.1", diff --git a/packages/drawing/package.json b/packages/drawing/package.json index bf240289..a79a6de1 100644 --- a/packages/drawing/package.json +++ b/packages/drawing/package.json @@ -29,7 +29,7 @@ "d3-queue": "~3.0.7", "fabric": "netology-group/fabric.js#feature/ULMS-509", "hammerjs": "~2.0.8", - "react": "^16.12.0" + "react": "^16.14.0" }, "peerDependencies": { "fabric": "netology-group/fabric.js#feature/ULMS-509", diff --git a/packages/frame/package.json b/packages/frame/package.json index 5a442edb..78e516c6 100644 --- a/packages/frame/package.json +++ b/packages/frame/package.json @@ -25,7 +25,7 @@ "build": "rm -rf ./es/* && BABEL_ENV=es rollup --config ./rollup.config.js index.js" }, "dependencies": { - "react": "^16.12.0" + "react": "^16.14.0" }, "peerDependencies": { "react": "^15.6 || ^16.x || ^17.x" diff --git a/packages/grid/package.json b/packages/grid/package.json index f975e0d1..67762a11 100644 --- a/packages/grid/package.json +++ b/packages/grid/package.json @@ -27,7 +27,7 @@ "dependencies": { "@foxford/ui": "^1.8.1", "classnames-es": "^2.2.6", - "react": "^16.12.0" + "react": "^16.14.0" }, "peerDependencies": { "react": "^15.6 || ^16.x || ^17.x" diff --git a/packages/icons/package.json b/packages/icons/package.json index 7d30f0d6..fff989b8 100644 --- a/packages/icons/package.json +++ b/packages/icons/package.json @@ -26,7 +26,7 @@ }, "dependencies": { "classnames-es": "^2.2.6", - "react": "^16.12.0" + "react": "^16.14.0" }, "peerDependencies": { "react": "^15.6 || ^16.x || ^17.x" diff --git a/packages/location-viewport/package-lock.json b/packages/location-viewport/package-lock.json index 850b7ea2..39a6bb45 100644 --- a/packages/location-viewport/package-lock.json +++ b/packages/location-viewport/package-lock.json @@ -1,6 +1,6 @@ { "name": "@ulms/ui-location-viewport", - "version": "1.0.0", + "version": "1.0.1", "lockfileVersion": 1, "requires": true, "dependencies": { @@ -67,14 +67,14 @@ } }, "react-dom": { - "version": "16.12.0", - "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.12.0.tgz", - "integrity": "sha512-LMxFfAGrcS3kETtQaCkTKjMiifahaMySFDn71fZUNpPHZQEzmk/GiAeIT8JSOrHB23fnuCOMruL2a8NYlw+8Gw==", + "version": "16.14.0", + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.14.0.tgz", + "integrity": "sha512-1gCeQXDLoIqMgqD3IO2Ah9bnf0w9kzhwN5q4FGnHZ67hBm9yePzB5JJAIQCc8x3pFnNlwFq4RidZggNAAkzWWw==", "requires": { "loose-envify": "^1.1.0", "object-assign": "^4.1.1", "prop-types": "^15.6.2", - "scheduler": "^0.18.0" + "scheduler": "^0.19.1" } }, "react-is": { @@ -83,9 +83,9 @@ "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==" }, "scheduler": { - "version": "0.18.0", - "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.18.0.tgz", - "integrity": "sha512-agTSHR1Nbfi6ulI0kYNK0203joW2Y5W4po4l+v03tOoiJKpTBbxpNhWDvqc/4IcOw+KLmSiQLTasZ4cab2/UWQ==", + "version": "0.19.1", + "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.19.1.tgz", + "integrity": "sha512-n/zwRWRYSUj0/3g/otKDRPMh6qv2SYMWNq85IEa8iZyAv8od9zDYpGSnpBEjNgcMNq6Scbu5KfIPxNF72R/2EA==", "requires": { "loose-envify": "^1.1.0", "object-assign": "^4.1.1" diff --git a/packages/location-viewport/package.json b/packages/location-viewport/package.json index a34cbb29..00e1c2d7 100644 --- a/packages/location-viewport/package.json +++ b/packages/location-viewport/package.json @@ -1,6 +1,6 @@ { "name": "@ulms/ui-location-viewport", - "version": "1.0.0", + "version": "1.0.1", "description": "", "keywords": [ "lerna" @@ -29,8 +29,8 @@ "@ungap/event-target": "0.1.0", "classnames-es": "^2.2.6", "popper.js": "^1.16.0", - "react": "^16.12.0", - "react-dom": "16.12.0" + "react": "^16.14.0", + "react-dom": "^16.14.0" }, "peerDependencies": { "react": "^15.6 || ^16.x || ^17.x", diff --git a/packages/panel/package.json b/packages/panel/package.json index 11c3e619..9e9a0a0d 100644 --- a/packages/panel/package.json +++ b/packages/panel/package.json @@ -26,7 +26,7 @@ }, "dependencies": { "classnames-es": "^2.2.6", - "react": "^16.12.0" + "react": "^16.14.0" }, "peerDependencies": { "react": "^15.6 || ^16.x || ^17.x" diff --git a/packages/presentation/package-lock.json b/packages/presentation/package-lock.json index 30fc0304..3827c8be 100644 --- a/packages/presentation/package-lock.json +++ b/packages/presentation/package-lock.json @@ -181,14 +181,14 @@ } }, "react-dom": { - "version": "16.12.0", - "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.12.0.tgz", - "integrity": "sha512-LMxFfAGrcS3kETtQaCkTKjMiifahaMySFDn71fZUNpPHZQEzmk/GiAeIT8JSOrHB23fnuCOMruL2a8NYlw+8Gw==", + "version": "16.14.0", + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.14.0.tgz", + "integrity": "sha512-1gCeQXDLoIqMgqD3IO2Ah9bnf0w9kzhwN5q4FGnHZ67hBm9yePzB5JJAIQCc8x3pFnNlwFq4RidZggNAAkzWWw==", "requires": { "loose-envify": "^1.1.0", "object-assign": "^4.1.1", "prop-types": "^15.6.2", - "scheduler": "^0.18.0" + "scheduler": "^0.19.1" } }, "react-is": { @@ -216,9 +216,9 @@ } }, "scheduler": { - "version": "0.18.0", - "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.18.0.tgz", - "integrity": "sha512-agTSHR1Nbfi6ulI0kYNK0203joW2Y5W4po4l+v03tOoiJKpTBbxpNhWDvqc/4IcOw+KLmSiQLTasZ4cab2/UWQ==", + "version": "0.19.1", + "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.19.1.tgz", + "integrity": "sha512-n/zwRWRYSUj0/3g/otKDRPMh6qv2SYMWNq85IEa8iZyAv8od9zDYpGSnpBEjNgcMNq6Scbu5KfIPxNF72R/2EA==", "requires": { "loose-envify": "^1.1.0", "object-assign": "^4.1.1" diff --git a/packages/presentation/package.json b/packages/presentation/package.json index e257c75b..66a81eaf 100644 --- a/packages/presentation/package.json +++ b/packages/presentation/package.json @@ -30,8 +30,8 @@ "classnames-es": "^2.2.6", "lodash": "^4.17.20", "pdfjs-dist": "^2.0.943", - "react": "^16.12.0", - "react-dom": "^16.12.0", + "react": "^16.14.0", + "react-dom": "^16.14.0", "react-sizeme": "^2.6.7", "react-visibility-sensor": "^5.0.2", "scroll-into-view-if-needed": "^2.2.20" diff --git a/packages/spinner/package.json b/packages/spinner/package.json index f45b4450..62599b51 100644 --- a/packages/spinner/package.json +++ b/packages/spinner/package.json @@ -27,7 +27,7 @@ "dependencies": { "@ulms/ui-icons": "^1.0.0", "classnames-es": "^2.2.6", - "react": "^16.12.0" + "react": "^16.14.0" }, "peerDependencies": { "react": "^15.6 || ^16.x || ^17.x" diff --git a/packages/switcher/package.json b/packages/switcher/package.json index 3a32e34c..f38a2985 100644 --- a/packages/switcher/package.json +++ b/packages/switcher/package.json @@ -26,7 +26,7 @@ }, "dependencies": { "classnames-es": "^2.2.6", - "react": "^16.12.0" + "react": "^16.14.0" }, "peerDependencies": { "react": "^15.6 || ^16.x || ^17.x" diff --git a/src/packages/pdf-presentation/pdf-presentation.jsx b/src/packages/pdf-presentation/pdf-presentation.jsx deleted file mode 100644 index 29f13efa..00000000 --- a/src/packages/pdf-presentation/pdf-presentation.jsx +++ /dev/null @@ -1,146 +0,0 @@ -/* eslint-disable react/prop-types */ -import React from 'react' -import debounce from 'lodash/debounce' - -import { Presentation } from '../presentation/presentation' - -import { getDocument, getImage, keyFn, renderPage } from './pdf-rendering' - -const reportError = error => console.log(error) // eslint-disable-line no-console - -export const CANVAS_WIDTH = 2048 - -export const CANVAS_HEIGHT = 1536 - -export const CANVAS_PREVIEW_WIDTH = 120 - -export const CANVAS_PREVIEW_HEIGHT = 68 - -export class PDFPresentation extends React.Component { - constructor () { - super() - - this.state = { - pagesCollection: [], - } - - this.createCollection = this.createCollection.bind(this) - this.updateCollection = this.updateCollection.bind(this) - - this.debouncedUpdateCollection = debounce(this.updateCollection, 100) - - this.mounted = false - } - - componentDidMount () { - const { url } = this.props - - this.mounted = true - - if (url) { - this.updateCollection() - } - } - - componentDidUpdate (prevProps) { - const { url } = this.props - - if (url !== prevProps.url) { - this.setState({ pagesCollection: [] }) // eslint-disable-line - this.updateCollection() - } - } - - componentWillUnmount () { - this.mounted = false - } - - createCollection (count) { - const { tokenProvider, url } = this.props - const collection = [] - - const getter = (documentUrl, documentPage, width, height) => () => { - tokenProvider() - .then(token => renderPage(documentUrl, documentPage, width, height, { httpHeaders: { authorization: `Bearer ${token}` } })) - .then(() => { - this.debouncedUpdateCollection() - - return null - }).catch(reportError) - - return null - } - - for (let i = 0; i < count; i++) { - const page = i + 1 - const imageDataCached = getImage(keyFn(url, page, CANVAS_WIDTH, CANVAS_HEIGHT)) - const previewDataCached = getImage(keyFn(url, page, CANVAS_PREVIEW_WIDTH, CANVAS_PREVIEW_HEIGHT)) // eslint-disable-line max-len - const item = { - page, - image: null, - imageWidth: null, - imageHeight: null, - preview: null, - previewWidth: null, - previewHeight: null, - } - - if (imageDataCached) { - item.image = imageDataCached.url - item.imageWidth = imageDataCached.width - item.imageHeight = imageDataCached.height - } else { - Object.defineProperty(item, 'image', { - get: getter(url, page, CANVAS_WIDTH, CANVAS_HEIGHT), - enumerable: true, - configurable: true, - }) - } - - if (previewDataCached) { - item.preview = previewDataCached.url - item.previewWidth = previewDataCached.width - item.previewHeight = previewDataCached.height - } else { - Object.defineProperty(item, 'preview', { - get: getter(url, page, CANVAS_PREVIEW_WIDTH, CANVAS_PREVIEW_HEIGHT), - enumerable: true, - configurable: true, - }) - } - - collection.push(item) - } - - return collection - } - - updateCollection () { - const { tokenProvider, url } = this.props - - tokenProvider() - .then(token => getDocument(url, { httpHeaders: { authorization: `Bearer ${token}` } })) - .then((document) => { - if (this.mounted) { - this.setState({ - pagesCollection: this.createCollection(document.numPages), - }) - } - - return null - }) - .catch(reportError) - } - - render () { - const { pagesCollection } = this.state - const { url, ...otherProps } = this.props // eslint-disable-line no-unused-vars - - return ( - - ) - } -} diff --git a/src/packages/pdf-presentation/pdf-rendering.js b/src/packages/pdf-presentation/pdf-rendering.js deleted file mode 100644 index 836d53ec..00000000 --- a/src/packages/pdf-presentation/pdf-rendering.js +++ /dev/null @@ -1,86 +0,0 @@ -const service = window.pdfjsLib - -const documentCache = {} -const imageCache = {} -const tasks = {} - -export function keyFn (documentUrl, pageNumber, width, height) { - return `${documentUrl}_${pageNumber}_${width}_${height}` -} - -export function getDocument (url, { httpHeaders }) { - if (!documentCache[url]) { - documentCache[url] = service.getDocument({ url, httpHeaders }) - } - - return documentCache[url] -} - -export function getImage (key) { - return imageCache[key] -} - -export function renderPage (documentUrl, pageNumber, width, height, { httpHeaders }) { - const key = keyFn(documentUrl, pageNumber, width, height) - let canvas - let context - let renderViewport - - if (!tasks[key]) { - tasks[key] = new Promise((resolve, reject) => { - getDocument(documentUrl, { httpHeaders }) - .then(document => document.getPage(pageNumber)) - .then((page) => { - const initialViewport = page.getViewport(1) - const scale = Math.min(width / initialViewport.width, height / initialViewport.height) - - renderViewport = page.getViewport(scale) - - canvas = window.document.createElement('canvas') - context = canvas.getContext('2d') - - canvas.width = renderViewport.width - canvas.height = renderViewport.height - - context.clearRect(0, 0, canvas.width, canvas.height) - - const renderContext = { - canvasContext: context, - viewport: renderViewport, - } - - return page.render(renderContext) - }) - .then(() => { - canvas.toBlob((blob) => { - if (blob) { - const url = window.URL.createObjectURL(blob) - const imageData = { - url, - width: renderViewport.width, - height: renderViewport.height, - } - - context.clearRect(0, 0, canvas.width, canvas.height) - canvas.width = 0 - canvas.height = 0 - canvas = null - context = null - renderViewport = null - - imageCache[`${documentUrl}_${pageNumber}_${width}_${height}`] = imageData - - resolve(imageData) - } - - resolve({}) - }) - - return null - }) - .catch(error => reject(error)) - }) - } - - return tasks[key] -}