diff --git a/.eslintignore b/.eslintignore index f06235c..4709296 100644 --- a/.eslintignore +++ b/.eslintignore @@ -1,2 +1 @@ -node_modules -dist +src/main.css diff --git a/package-lock.json b/package-lock.json index 78e5cb5..0b80899 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,30 +8,31 @@ "name": "plugin-word-cloud", "version": "0.1.2", "dependencies": { - "@emotion/react": "^11.14.0", - "@emotion/styled": "^11.14.0", - "@mui/material": "^7.3.1", - "@testing-library/react": "^13.4.0", - "@testing-library/user-event": "^13.5.0", - "@tippyjs/react": "^4.2.6", - "@types/node": "^20.3.1", - "@types/react": "^18.2.13", - "@types/react-dom": "^18.2.6", - "babel-plugin-syntax-dynamic-import": "^6.18.0", - "bbb-ui-components-react": "npm:@mconf/bbb-ui-components-react@^1.0.0", + "@emotion/react": "11.14.0", + "@emotion/styled": "11.14.1", + "@mconf/bbb-ui-components-react": "2.3.0", + "@mui/icons-material": "7.3.1", + "@mui/material": "7.3.1", + "@testing-library/react": "13.4.0", + "@testing-library/user-event": "13.5.0", + "@tippyjs/react": "4.2.6", + "@types/node": "20.3.1", + "@types/react": "18.2.13", + "@types/react-dom": "18.2.6", + "babel-plugin-syntax-dynamic-import": "6.18.0", "bigbluebutton-html-plugin-sdk": "0.1.17", - "d3": "^7.9.0", - "d3-cloud": "^1.2.7", - "d3-scale": "^4.0.2", - "path": "^0.12.7", - "prop-types": "^15.8.1", - "react": "^18.2.0", - "react-dom": "^18.2.0", - "react-icons": "^5.5.0", - "react-intl": "^7.1.11", - "react-modal": "^3.16.1", - "styled-components": "^5.3.3", - "tippy.js": "^6.3.7" + "d3": "7.9.0", + "d3-cloud": "1.2.7", + "d3-scale": "4.0.2", + "path": "0.12.7", + "prop-types": "15.8.1", + "react": "18.2.0", + "react-dom": "18.2.0", + "react-icons": "5.5.0", + "react-intl": "7.1.11", + "react-modal": "3.16.1", + "styled-components": "5.3.3", + "tippy.js": "6.3.7" }, "devDependencies": { "@babel/core": "^7.21.8", @@ -60,7 +61,7 @@ "eslint-plugin-react-hooks": "^4.6.0", "eslint-watch": "^8.0.0", "lint-staged": "11.2.0", - "react-dom": "^18.2.0", + "react-dom": "18.2.0", "style-loader": "^3.3.3", "ts-loader": "^9.4.3", "typescript": "^5.1.6", @@ -2029,13 +2030,13 @@ } }, "node_modules/@formatjs/ecma402-abstract": { - "version": "2.3.6", - "resolved": "https://registry.npmjs.org/@formatjs/ecma402-abstract/-/ecma402-abstract-2.3.6.tgz", - "integrity": "sha512-HJnTFeRM2kVFVr5gr5kH1XP6K0JcJtE7Lzvtr3FS/so5f1kpsqqqxy5JF+FRaO6H2qmcMfAUIox7AJteieRtVw==", + "version": "2.3.4", + "resolved": "https://registry.npmjs.org/@formatjs/ecma402-abstract/-/ecma402-abstract-2.3.4.tgz", + "integrity": "sha512-qrycXDeaORzIqNhBOx0btnhpD1c+/qFIHAN9znofuMJX6QBwtbrmlpWfD4oiUUD2vJUOIYFA/gYtg2KAMGG7sA==", "license": "MIT", "dependencies": { "@formatjs/fast-memoize": "2.2.7", - "@formatjs/intl-localematcher": "0.6.2", + "@formatjs/intl-localematcher": "0.6.1", "decimal.js": "^10.4.3", "tslib": "^2.8.0" } @@ -2050,36 +2051,36 @@ } }, "node_modules/@formatjs/icu-messageformat-parser": { - "version": "2.11.4", - "resolved": "https://registry.npmjs.org/@formatjs/icu-messageformat-parser/-/icu-messageformat-parser-2.11.4.tgz", - "integrity": "sha512-7kR78cRrPNB4fjGFZg3Rmj5aah8rQj9KPzuLsmcSn4ipLXQvC04keycTI1F7kJYDwIXtT2+7IDEto842CfZBtw==", + "version": "2.11.2", + "resolved": "https://registry.npmjs.org/@formatjs/icu-messageformat-parser/-/icu-messageformat-parser-2.11.2.tgz", + "integrity": "sha512-AfiMi5NOSo2TQImsYAg8UYddsNJ/vUEv/HaNqiFjnI3ZFfWihUtD5QtuX6kHl8+H+d3qvnE/3HZrfzgdWpsLNA==", "license": "MIT", "dependencies": { - "@formatjs/ecma402-abstract": "2.3.6", - "@formatjs/icu-skeleton-parser": "1.8.16", + "@formatjs/ecma402-abstract": "2.3.4", + "@formatjs/icu-skeleton-parser": "1.8.14", "tslib": "^2.8.0" } }, "node_modules/@formatjs/icu-skeleton-parser": { - "version": "1.8.16", - "resolved": "https://registry.npmjs.org/@formatjs/icu-skeleton-parser/-/icu-skeleton-parser-1.8.16.tgz", - "integrity": "sha512-H13E9Xl+PxBd8D5/6TVUluSpxGNvFSlN/b3coUp0e0JpuWXXnQDiavIpY3NnvSp4xhEMoXyyBvVfdFX8jglOHQ==", + "version": "1.8.14", + "resolved": "https://registry.npmjs.org/@formatjs/icu-skeleton-parser/-/icu-skeleton-parser-1.8.14.tgz", + "integrity": "sha512-i4q4V4qslThK4Ig8SxyD76cp3+QJ3sAqr7f6q9VVfeGtxG9OhiAk3y9XF6Q41OymsKzsGQ6OQQoJNY4/lI8TcQ==", "license": "MIT", "dependencies": { - "@formatjs/ecma402-abstract": "2.3.6", + "@formatjs/ecma402-abstract": "2.3.4", "tslib": "^2.8.0" } }, "node_modules/@formatjs/intl": { - "version": "3.1.8", - "resolved": "https://registry.npmjs.org/@formatjs/intl/-/intl-3.1.8.tgz", - "integrity": "sha512-LWXgwI5zTMatvR8w8kCNh/priDTOF/ZssokMBHJ7ZWXFoYLVOYo0EJERD9Eajv+xsfQO1QkuAt77KWQ1OI4mOQ==", + "version": "3.1.6", + "resolved": "https://registry.npmjs.org/@formatjs/intl/-/intl-3.1.6.tgz", + "integrity": "sha512-tDkXnA4qpIFcDWac8CyVJq6oW8DR7W44QDUBsfXWIIJD/FYYen0QoH46W7XsVMFfPOVKkvbufjboZrrWbEfmww==", "license": "MIT", "dependencies": { - "@formatjs/ecma402-abstract": "2.3.6", + "@formatjs/ecma402-abstract": "2.3.4", "@formatjs/fast-memoize": "2.2.7", - "@formatjs/icu-messageformat-parser": "2.11.4", - "intl-messageformat": "10.7.18", + "@formatjs/icu-messageformat-parser": "2.11.2", + "intl-messageformat": "10.7.16", "tslib": "^2.8.0" }, "peerDependencies": { @@ -2092,9 +2093,9 @@ } }, "node_modules/@formatjs/intl-localematcher": { - "version": "0.6.2", - "resolved": "https://registry.npmjs.org/@formatjs/intl-localematcher/-/intl-localematcher-0.6.2.tgz", - "integrity": "sha512-XOMO2Hupl0wdd172Y06h6kLpBz6Dv+J4okPLl4LPtzbr8f66WbIoy4ev98EBuZ6ZK4h5ydTN6XneT4QVpD7cdA==", + "version": "0.6.1", + "resolved": "https://registry.npmjs.org/@formatjs/intl-localematcher/-/intl-localematcher-0.6.1.tgz", + "integrity": "sha512-ePEgLgVCqi2BBFnTMWPfIghu6FkbZnnBVhO2sSxvLfrdFw7wCHAHiDoM2h4NRgjbaY7+B7HgOLZGkK187pZTZg==", "license": "MIT", "dependencies": { "tslib": "^2.8.0" @@ -2234,6 +2235,29 @@ "dev": true, "license": "MIT" }, + "node_modules/@mconf/bbb-ui-components-react": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/@mconf/bbb-ui-components-react/-/bbb-ui-components-react-2.3.0.tgz", + "integrity": "sha512-hRuOxajSV4Cnu+DS4FKuW5iUdJ89YW9Ggs8Vc/1t409cIBW/b7S7YSVn/1tJBb4V3gknc/GAb9rUET6BV1eqeA==", + "license": "LGPL-3.0", + "dependencies": { + "@tippyjs/react": "^4.2.6", + "react-modal": ">=3.16.1", + "tippy.js": "^6.3.7" + }, + "peerDependencies": { + "@emotion/react": "^11.13.0", + "@emotion/styled": "^11.13.0", + "@mui/icons-material": "^6.1.4 || ^7.0.0", + "@mui/material": "^6.1.4 || ^7.0.0", + "prop-types": "^15.8.1", + "react": "^18.2.0", + "react-dom": "^18.2.0", + "react-icons": "^5.5.0", + "react-modal": ">=3.16.1", + "styled-components": ">=5.3.0" + } + }, "node_modules/@mui/core-downloads-tracker": { "version": "7.3.11", "resolved": "https://registry.npmjs.org/@mui/core-downloads-tracker/-/core-downloads-tracker-7.3.11.tgz", @@ -2245,12 +2269,12 @@ } }, "node_modules/@mui/icons-material": { - "version": "7.3.11", - "resolved": "https://registry.npmjs.org/@mui/icons-material/-/icons-material-7.3.11.tgz", - "integrity": "sha512-+hz5ilwHZ3djd5es3sCErLioqe/NhZcYTsV/TNXZAMdJdb23F4xzJjqnnZdnurc3S1+ietcssRNqieOhPQLZ7Q==", + "version": "7.3.1", + "resolved": "https://registry.npmjs.org/@mui/icons-material/-/icons-material-7.3.1.tgz", + "integrity": "sha512-upzCtG6awpL6noEZlJ5Z01khZ9VnLNLaj7tb6iPbN6G97eYfUTs8e9OyPKy3rEms3VQWmVBfri7jzeaRxdFIzA==", "license": "MIT", "dependencies": { - "@babel/runtime": "^7.28.6" + "@babel/runtime": "^7.28.2" }, "engines": { "node": ">=14.0.0" @@ -2260,7 +2284,7 @@ "url": "https://opencollective.com/mui-org" }, "peerDependencies": { - "@mui/material": "^7.3.11", + "@mui/material": "^7.3.1", "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0", "react": "^17.0.0 || ^18.0.0 || ^19.0.0" }, @@ -2271,22 +2295,22 @@ } }, "node_modules/@mui/material": { - "version": "7.3.11", - "resolved": "https://registry.npmjs.org/@mui/material/-/material-7.3.11.tgz", - "integrity": "sha512-yq8bPc3LxOwKRWpcjRgDkYFmpM6aKlARfESTmOQcvLYFeJwtHte2tw6hJDrb8sk8wcvpDprHEHVaoUU0MslIkw==", + "version": "7.3.1", + "resolved": "https://registry.npmjs.org/@mui/material/-/material-7.3.1.tgz", + "integrity": "sha512-Xf6Shbo03YmcBedZMwSpEFOwpYDtU7tC+rhAHTrA9FHk0FpsDqiQ9jUa1j/9s3HLs7KWb5mDcGnlwdh9Q9KAag==", "license": "MIT", "dependencies": { - "@babel/runtime": "^7.28.6", - "@mui/core-downloads-tracker": "^7.3.11", - "@mui/system": "^7.3.11", - "@mui/types": "^7.4.12", - "@mui/utils": "^7.3.11", + "@babel/runtime": "^7.28.2", + "@mui/core-downloads-tracker": "^7.3.1", + "@mui/system": "^7.3.1", + "@mui/types": "^7.4.5", + "@mui/utils": "^7.3.1", "@popperjs/core": "^2.11.8", "@types/react-transition-group": "^4.4.12", "clsx": "^2.1.1", - "csstype": "^3.2.3", + "csstype": "^3.1.3", "prop-types": "^15.8.1", - "react-is": "^19.2.3", + "react-is": "^19.1.1", "react-transition-group": "^4.4.5" }, "engines": { @@ -2299,7 +2323,7 @@ "peerDependencies": { "@emotion/react": "^11.5.0", "@emotion/styled": "^11.3.0", - "@mui/material-pigment-css": "^7.3.11", + "@mui/material-pigment-css": "^7.3.1", "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0", "react": "^17.0.0 || ^18.0.0 || ^19.0.0", "react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0" @@ -2319,80 +2343,6 @@ } } }, - "node_modules/@mui/private-theming": { - "version": "6.4.9", - "resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-6.4.9.tgz", - "integrity": "sha512-LktcVmI5X17/Q5SkwjCcdOLBzt1hXuc14jYa7NPShog0GBDCDvKtcnP0V7a2s6EiVRlv7BzbWEJzH6+l/zaCxw==", - "license": "MIT", - "peer": true, - "dependencies": { - "@babel/runtime": "^7.26.0", - "@mui/utils": "^6.4.9", - "prop-types": "^15.8.1" - }, - "engines": { - "node": ">=14.0.0" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/mui-org" - }, - "peerDependencies": { - "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0", - "react": "^17.0.0 || ^18.0.0 || ^19.0.0" - }, - "peerDependenciesMeta": { - "@types/react": { - "optional": true - } - } - }, - "node_modules/@mui/private-theming/node_modules/@mui/types": { - "version": "7.2.24", - "resolved": "https://registry.npmjs.org/@mui/types/-/types-7.2.24.tgz", - "integrity": "sha512-3c8tRt/CbWZ+pEg7QpSwbdxOk36EfmhbKf6AGZsD1EcLDLTSZoxxJ86FVtcjxvjuhdyBiWKSTGZFaXCnidO2kw==", - "license": "MIT", - "peer": true, - "peerDependencies": { - "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0" - }, - "peerDependenciesMeta": { - "@types/react": { - "optional": true - } - } - }, - "node_modules/@mui/private-theming/node_modules/@mui/utils": { - "version": "6.4.9", - "resolved": "https://registry.npmjs.org/@mui/utils/-/utils-6.4.9.tgz", - "integrity": "sha512-Y12Q9hbK9g+ZY0T3Rxrx9m2m10gaphDuUMgWxyV5kNJevVxXYCLclYUCC9vXaIk1/NdNDTcW2Yfr2OGvNFNmHg==", - "license": "MIT", - "peer": true, - "dependencies": { - "@babel/runtime": "^7.26.0", - "@mui/types": "~7.2.24", - "@types/prop-types": "^15.7.14", - "clsx": "^2.1.1", - "prop-types": "^15.8.1", - "react-is": "^19.0.0" - }, - "engines": { - "node": ">=14.0.0" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/mui-org" - }, - "peerDependencies": { - "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0", - "react": "^17.0.0 || ^18.0.0 || ^19.0.0" - }, - "peerDependenciesMeta": { - "@types/react": { - "optional": true - } - } - }, "node_modules/@mui/styled-engine": { "version": "7.3.10", "resolved": "https://registry.npmjs.org/@mui/styled-engine/-/styled-engine-7.3.10.tgz", @@ -2427,94 +2377,6 @@ } } }, - "node_modules/@mui/styles": { - "version": "6.5.0", - "resolved": "https://registry.npmjs.org/@mui/styles/-/styles-6.5.0.tgz", - "integrity": "sha512-DeE/S/l6adnMpKfgx6l7UaQwYuf+gD4FCp6En3Vdg2Er+CTArj4DcHNFVzb8HZ2nNqACwmSm16/P08m1vAxv2w==", - "license": "MIT", - "peer": true, - "dependencies": { - "@babel/runtime": "^7.26.0", - "@emotion/hash": "^0.9.2", - "@mui/private-theming": "^6.4.9", - "@mui/types": "~7.2.24", - "@mui/utils": "^6.4.9", - "clsx": "^2.1.1", - "csstype": "^3.1.3", - "hoist-non-react-statics": "^3.3.2", - "jss": "^10.10.0", - "jss-plugin-camel-case": "^10.10.0", - "jss-plugin-default-unit": "^10.10.0", - "jss-plugin-global": "^10.10.0", - "jss-plugin-nested": "^10.10.0", - "jss-plugin-props-sort": "^10.10.0", - "jss-plugin-rule-value-function": "^10.10.0", - "jss-plugin-vendor-prefixer": "^10.10.0", - "prop-types": "^15.8.1" - }, - "engines": { - "node": ">=14.0.0" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/mui-org" - }, - "peerDependencies": { - "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0", - "react": "^17.0.0 || ^18.0.0 || ^19.0.0" - }, - "peerDependenciesMeta": { - "@types/react": { - "optional": true - } - } - }, - "node_modules/@mui/styles/node_modules/@mui/types": { - "version": "7.2.24", - "resolved": "https://registry.npmjs.org/@mui/types/-/types-7.2.24.tgz", - "integrity": "sha512-3c8tRt/CbWZ+pEg7QpSwbdxOk36EfmhbKf6AGZsD1EcLDLTSZoxxJ86FVtcjxvjuhdyBiWKSTGZFaXCnidO2kw==", - "license": "MIT", - "peer": true, - "peerDependencies": { - "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0" - }, - "peerDependenciesMeta": { - "@types/react": { - "optional": true - } - } - }, - "node_modules/@mui/styles/node_modules/@mui/utils": { - "version": "6.4.9", - "resolved": "https://registry.npmjs.org/@mui/utils/-/utils-6.4.9.tgz", - "integrity": "sha512-Y12Q9hbK9g+ZY0T3Rxrx9m2m10gaphDuUMgWxyV5kNJevVxXYCLclYUCC9vXaIk1/NdNDTcW2Yfr2OGvNFNmHg==", - "license": "MIT", - "peer": true, - "dependencies": { - "@babel/runtime": "^7.26.0", - "@mui/types": "~7.2.24", - "@types/prop-types": "^15.7.14", - "clsx": "^2.1.1", - "prop-types": "^15.8.1", - "react-is": "^19.0.0" - }, - "engines": { - "node": ">=14.0.0" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/mui-org" - }, - "peerDependencies": { - "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0", - "react": "^17.0.0 || ^18.0.0 || ^19.0.0" - }, - "peerDependenciesMeta": { - "@types/react": { - "optional": true - } - } - }, "node_modules/@mui/system": { "version": "7.3.11", "resolved": "https://registry.npmjs.org/@mui/system/-/system-7.3.11.tgz", @@ -4523,31 +4385,6 @@ "dev": true, "license": "MIT" }, - "node_modules/bbb-ui-components-react": { - "name": "@mconf/bbb-ui-components-react", - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/@mconf/bbb-ui-components-react/-/bbb-ui-components-react-1.0.0.tgz", - "integrity": "sha512-RlS1+QW49acvGcVyyqnFa2Xs256nnFlk6FpeV4pAuItk3x5K81WtjHYDdvTi1ysRgn1+RsdUhjxs+4+AHw3Z3w==", - "license": "LGPL-3.0", - "dependencies": { - "@mui/icons-material": "^7.3.1", - "@tippyjs/react": "^4.2.6", - "react-modal": "^3.16.3", - "tippy.js": "^6.3.7" - }, - "peerDependencies": { - "@emotion/react": "^11.14.0", - "@emotion/styled": "^11.14.1", - "@mui/material": "^7.3.1", - "@mui/styles": "^6.4.8", - "prop-types": "^15.8.1", - "react": ">=18.0.0", - "react-dom": ">=18.0.0", - "react-icons": "^5.5.0", - "react-modal": ">=3.16.1", - "styled-components": ">=5.3.0" - } - }, "node_modules/bigbluebutton-html-plugin-sdk": { "version": "0.1.17", "resolved": "https://registry.npmjs.org/bigbluebutton-html-plugin-sdk/-/bigbluebutton-html-plugin-sdk-0.1.17.tgz", @@ -5302,17 +5139,6 @@ "postcss-value-parser": "^4.0.2" } }, - "node_modules/css-vendor": { - "version": "2.0.8", - "resolved": "https://registry.npmjs.org/css-vendor/-/css-vendor-2.0.8.tgz", - "integrity": "sha512-x9Aq0XTInxrkuFeHKbYC7zWY8ai7qJ04Kxd9MnvbC1uO5DagxoHQjm4JvG+vCdXOoFtCjbL2XSZfxmoYa9uQVQ==", - "license": "MIT", - "peer": true, - "dependencies": { - "@babel/runtime": "^7.8.3", - "is-in-browser": "^1.0.2" - } - }, "node_modules/cssesc": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz", @@ -5423,9 +5249,9 @@ } }, "node_modules/d3-cloud": { - "version": "1.2.9", - "resolved": "https://registry.npmjs.org/d3-cloud/-/d3-cloud-1.2.9.tgz", - "integrity": "sha512-leL1GLneC9ZQtnV+6TGWrNlGfI1WX7S2arcTv2vae12DaXo5wjm6GBCkskXbrDlyOymd/A75Pyj1H37MW4BZ/Q==", + "version": "1.2.7", + "resolved": "https://registry.npmjs.org/d3-cloud/-/d3-cloud-1.2.7.tgz", + "integrity": "sha512-8TrgcgwRIpoZYQp7s3fGB7tATWfhckRb8KcVd1bOgqkNdkJRDGWfdSf4HkHHzZxSczwQJdSxvfPudwir5IAJ3w==", "license": "BSD-3-Clause", "dependencies": { "d3-dispatch": "^1.0.3" @@ -7679,9 +7505,9 @@ } }, "node_modules/graphql-tag": { - "version": "2.12.6", - "resolved": "https://registry.npmjs.org/graphql-tag/-/graphql-tag-2.12.6.tgz", - "integrity": "sha512-FdSNcu2QQcWnM2VNvSCCDCVS5PpPqpzgFT8+GXzqJuoDd0CBncxCY278u4mhRO7tMgo2JjgJA5aZ+nWSQ/Z+xg==", + "version": "2.12.7", + "resolved": "https://registry.npmjs.org/graphql-tag/-/graphql-tag-2.12.7.tgz", + "integrity": "sha512-xnE/NFzy+0eIesvAsREJZ284zTl/wYuBAvpsFSDhRGRdRHdnE90M21Q3xAWyYInb0J756c6x0pIQ62+vtvOs1Q==", "license": "MIT", "dependencies": { "tslib": "^2.1.0" @@ -7690,7 +7516,7 @@ "node": ">=10" }, "peerDependencies": { - "graphql": "^0.9.0 || ^0.10.0 || ^0.11.0 || ^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0 || ^16.0.0" + "graphql": "^0.9.0 || ^0.10.0 || ^0.11.0 || ^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0" } }, "node_modules/handle-thing": { @@ -7958,13 +7784,6 @@ "node": ">=10.17.0" } }, - "node_modules/hyphenate-style-name": { - "version": "1.1.0", - "resolved": "https://registry.npmjs.org/hyphenate-style-name/-/hyphenate-style-name-1.1.0.tgz", - "integrity": "sha512-WDC/ui2VVRrz3jOVi+XtjqkDjiVjTtFaAGiW37k6b+ohyQ5wYDOGkvCZa8+H0nx3gyvv0+BST9xuOgIyGQ00gw==", - "license": "BSD-3-Clause", - "peer": true - }, "node_modules/iconv-lite": { "version": "0.6.3", "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz", @@ -8178,14 +7997,14 @@ } }, "node_modules/intl-messageformat": { - "version": "10.7.18", - "resolved": "https://registry.npmjs.org/intl-messageformat/-/intl-messageformat-10.7.18.tgz", - "integrity": "sha512-m3Ofv/X/tV8Y3tHXLohcuVuhWKo7BBq62cqY15etqmLxg2DZ34AGGgQDeR+SCta2+zICb1NX83af0GJmbQ1++g==", + "version": "10.7.16", + "resolved": "https://registry.npmjs.org/intl-messageformat/-/intl-messageformat-10.7.16.tgz", + "integrity": "sha512-UmdmHUmp5CIKKjSoE10la5yfU+AYJAaiYLsodbjL4lji83JNvgOQUjGaGhGrpFCb0Uh7sl7qfP1IyILa8Z40ug==", "license": "BSD-3-Clause", "dependencies": { - "@formatjs/ecma402-abstract": "2.3.6", + "@formatjs/ecma402-abstract": "2.3.4", "@formatjs/fast-memoize": "2.2.7", - "@formatjs/icu-messageformat-parser": "2.11.4", + "@formatjs/icu-messageformat-parser": "2.11.2", "tslib": "^2.8.0" } }, @@ -8464,13 +8283,6 @@ "node": ">=0.10.0" } }, - "node_modules/is-in-browser": { - "version": "1.1.3", - "resolved": "https://registry.npmjs.org/is-in-browser/-/is-in-browser-1.1.3.tgz", - "integrity": "sha512-FeXIBgG/CPGd/WUxuEyvgGTEfwiG9Z4EKGxjNMRqviiIIfsmgrpnHLffEDdwUHqNva1VEW91o3xBT/m8Elgl9g==", - "license": "MIT", - "peer": true - }, "node_modules/is-map": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/is-map/-/is-map-2.0.3.tgz", @@ -8894,104 +8706,6 @@ "node": ">=6" } }, - "node_modules/jss": { - "version": "10.10.0", - "resolved": "https://registry.npmjs.org/jss/-/jss-10.10.0.tgz", - "integrity": "sha512-cqsOTS7jqPsPMjtKYDUpdFC0AbhYFLTcuGRqymgmdJIeQ8cH7+AgX7YSgQy79wXloZq2VvATYxUOUQEvS1V/Zw==", - "license": "MIT", - "peer": true, - "dependencies": { - "@babel/runtime": "^7.3.1", - "csstype": "^3.0.2", - "is-in-browser": "^1.1.3", - "tiny-warning": "^1.0.2" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/jss" - } - }, - "node_modules/jss-plugin-camel-case": { - "version": "10.10.0", - "resolved": "https://registry.npmjs.org/jss-plugin-camel-case/-/jss-plugin-camel-case-10.10.0.tgz", - "integrity": "sha512-z+HETfj5IYgFxh1wJnUAU8jByI48ED+v0fuTuhKrPR+pRBYS2EDwbusU8aFOpCdYhtRc9zhN+PJ7iNE8pAWyPw==", - "license": "MIT", - "peer": true, - "dependencies": { - "@babel/runtime": "^7.3.1", - "hyphenate-style-name": "^1.0.3", - "jss": "10.10.0" - } - }, - "node_modules/jss-plugin-default-unit": { - "version": "10.10.0", - "resolved": "https://registry.npmjs.org/jss-plugin-default-unit/-/jss-plugin-default-unit-10.10.0.tgz", - "integrity": "sha512-SvpajxIECi4JDUbGLefvNckmI+c2VWmP43qnEy/0eiwzRUsafg5DVSIWSzZe4d2vFX1u9nRDP46WCFV/PXVBGQ==", - "license": "MIT", - "peer": true, - "dependencies": { - "@babel/runtime": "^7.3.1", - "jss": "10.10.0" - } - }, - "node_modules/jss-plugin-global": { - "version": "10.10.0", - "resolved": "https://registry.npmjs.org/jss-plugin-global/-/jss-plugin-global-10.10.0.tgz", - "integrity": "sha512-icXEYbMufiNuWfuazLeN+BNJO16Ge88OcXU5ZDC2vLqElmMybA31Wi7lZ3lf+vgufRocvPj8443irhYRgWxP+A==", - "license": "MIT", - "peer": true, - "dependencies": { - "@babel/runtime": "^7.3.1", - "jss": "10.10.0" - } - }, - "node_modules/jss-plugin-nested": { - "version": "10.10.0", - "resolved": "https://registry.npmjs.org/jss-plugin-nested/-/jss-plugin-nested-10.10.0.tgz", - "integrity": "sha512-9R4JHxxGgiZhurDo3q7LdIiDEgtA1bTGzAbhSPyIOWb7ZubrjQe8acwhEQ6OEKydzpl8XHMtTnEwHXCARLYqYA==", - "license": "MIT", - "peer": true, - "dependencies": { - "@babel/runtime": "^7.3.1", - "jss": "10.10.0", - "tiny-warning": "^1.0.2" - } - }, - "node_modules/jss-plugin-props-sort": { - "version": "10.10.0", - "resolved": "https://registry.npmjs.org/jss-plugin-props-sort/-/jss-plugin-props-sort-10.10.0.tgz", - "integrity": "sha512-5VNJvQJbnq/vRfje6uZLe/FyaOpzP/IH1LP+0fr88QamVrGJa0hpRRyAa0ea4U/3LcorJfBFVyC4yN2QC73lJg==", - "license": "MIT", - "peer": true, - "dependencies": { - "@babel/runtime": "^7.3.1", - "jss": "10.10.0" - } - }, - "node_modules/jss-plugin-rule-value-function": { - "version": "10.10.0", - "resolved": "https://registry.npmjs.org/jss-plugin-rule-value-function/-/jss-plugin-rule-value-function-10.10.0.tgz", - "integrity": "sha512-uEFJFgaCtkXeIPgki8ICw3Y7VMkL9GEan6SqmT9tqpwM+/t+hxfMUdU4wQ0MtOiMNWhwnckBV0IebrKcZM9C0g==", - "license": "MIT", - "peer": true, - "dependencies": { - "@babel/runtime": "^7.3.1", - "jss": "10.10.0", - "tiny-warning": "^1.0.2" - } - }, - "node_modules/jss-plugin-vendor-prefixer": { - "version": "10.10.0", - "resolved": "https://registry.npmjs.org/jss-plugin-vendor-prefixer/-/jss-plugin-vendor-prefixer-10.10.0.tgz", - "integrity": "sha512-UY/41WumgjW8r1qMCO8l1ARg7NHnfRVWRhZ2E2m0DMYsr2DD91qIXLyNhiX83hHswR7Wm4D+oDYNC1zWCJWtqg==", - "license": "MIT", - "peer": true, - "dependencies": { - "@babel/runtime": "^7.3.1", - "css-vendor": "^2.0.8", - "jss": "10.10.0" - } - }, "node_modules/jsx-ast-utils": { "version": "3.3.5", "resolved": "https://registry.npmjs.org/jsx-ast-utils/-/jsx-ast-utils-3.3.5.tgz", @@ -10508,9 +10222,9 @@ } }, "node_modules/react": { - "version": "18.3.1", - "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz", - "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==", + "version": "18.2.0", + "resolved": "https://registry.npmjs.org/react/-/react-18.2.0.tgz", + "integrity": "sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==", "license": "MIT", "dependencies": { "loose-envify": "^1.1.0" @@ -10520,40 +10234,40 @@ } }, "node_modules/react-dom": { - "version": "18.3.1", - "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz", - "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==", + "version": "18.2.0", + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.2.0.tgz", + "integrity": "sha512-6IMTriUmvsjHUjNtEDudZfuDQUoWXVxKHhlEGSk81n4YFS+r/Kl99wXiwlVXtPBtJenozv2P+hxDsw9eA7Xo6g==", "license": "MIT", "dependencies": { "loose-envify": "^1.1.0", - "scheduler": "^0.23.2" + "scheduler": "^0.23.0" }, "peerDependencies": { - "react": "^18.3.1" + "react": "^18.2.0" } }, "node_modules/react-icons": { - "version": "5.6.0", - "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-5.6.0.tgz", - "integrity": "sha512-RH93p5ki6LfOiIt0UtDyNg/cee+HLVR6cHHtW3wALfo+eOHTp8RnU2kRkI6E+H19zMIs03DyxUG/GfZMOGvmiA==", + "version": "5.5.0", + "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-5.5.0.tgz", + "integrity": "sha512-MEFcXdkP3dLo8uumGI5xN3lDFNsRtrjbOEKDLD7yv76v4wpnEq2Lt2qeHaQOr34I/wPN3s3+N08WkQ+CW37Xiw==", "license": "MIT", "peerDependencies": { "react": "*" } }, "node_modules/react-intl": { - "version": "7.1.14", - "resolved": "https://registry.npmjs.org/react-intl/-/react-intl-7.1.14.tgz", - "integrity": "sha512-VE/0Wi/lHJlBC7APQpCzLUdIt3GB5B0GZrRW8Q+ACbkHI4j+Wwgg9J1TniN6zmLHmPH5gxXcMy+fkSPfw5p1WQ==", + "version": "7.1.11", + "resolved": "https://registry.npmjs.org/react-intl/-/react-intl-7.1.11.tgz", + "integrity": "sha512-tnVoRCWvW5Ie2ikYSdPF7z3+880yCe/9xPmitFeRPw3RYDcCfR4m8ZYa4MBq19W4adt9Z+PQA4FaMBCJ7E+HCQ==", "license": "BSD-3-Clause", "dependencies": { - "@formatjs/ecma402-abstract": "2.3.6", - "@formatjs/icu-messageformat-parser": "2.11.4", - "@formatjs/intl": "3.1.8", + "@formatjs/ecma402-abstract": "2.3.4", + "@formatjs/icu-messageformat-parser": "2.11.2", + "@formatjs/intl": "3.1.6", "@types/hoist-non-react-statics": "^3.3.1", "@types/react": "16 || 17 || 18 || 19", "hoist-non-react-statics": "^3.3.2", - "intl-messageformat": "10.7.18", + "intl-messageformat": "10.7.16", "tslib": "^2.8.0" }, "peerDependencies": { @@ -10579,9 +10293,9 @@ "license": "MIT" }, "node_modules/react-modal": { - "version": "3.16.3", - "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.16.3.tgz", - "integrity": "sha512-yCYRJB5YkeQDQlTt17WGAgFJ7jr2QYcWa1SHqZ3PluDmnKJ/7+tVU+E6uKyZ0nODaeEj+xCpK4LcSnKXLMC0Nw==", + "version": "3.16.1", + "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.16.1.tgz", + "integrity": "sha512-VStHgI3BVcGo7OXczvnJN7yT2TWHJPDXZWyI/a0ssFNhGZWsPmB8cF0z33ewDXq4VfYMO1vXgiv/g8Nj9NDyWg==", "license": "MIT", "dependencies": { "exenv": "^1.2.0", @@ -10589,9 +10303,12 @@ "react-lifecycles-compat": "^3.0.0", "warning": "^4.0.3" }, + "engines": { + "node": ">=8" + }, "peerDependencies": { - "react": "^0.14.0 || ^15.0.0 || ^16 || ^17 || ^18 || ^19", - "react-dom": "^0.14.0 || ^15.0.0 || ^16 || ^17 || ^18 || ^19" + "react": "^0.14.0 || ^15.0.0 || ^16 || ^17 || ^18", + "react-dom": "^0.14.0 || ^15.0.0 || ^16 || ^17 || ^18" } }, "node_modules/react-transition-group": { @@ -11829,14 +11546,14 @@ } }, "node_modules/styled-components": { - "version": "5.3.11", - "resolved": "https://registry.npmjs.org/styled-components/-/styled-components-5.3.11.tgz", - "integrity": "sha512-uuzIIfnVkagcVHv9nE0VPlHPSCmXIUGKfJ42LNjxCCTDTL5sgnJ8Z7GZBq0EnLYGln77tPpEpExt2+qa+cZqSw==", + "version": "5.3.3", + "resolved": "https://registry.npmjs.org/styled-components/-/styled-components-5.3.3.tgz", + "integrity": "sha512-++4iHwBM7ZN+x6DtPPWkCI4vdtwumQ+inA/DdAsqYd4SVgUKJie5vXyzotA00ttcFdQkCng7zc6grwlfIfw+lw==", "license": "MIT", "dependencies": { "@babel/helper-module-imports": "^7.0.0", "@babel/traverse": "^7.4.5", - "@emotion/is-prop-valid": "^1.1.0", + "@emotion/is-prop-valid": "^0.8.8", "@emotion/stylis": "^0.8.4", "@emotion/unitless": "^0.7.4", "babel-plugin-styled-components": ">= 1.12.0", @@ -11858,6 +11575,21 @@ "react-is": ">= 16.8.0" } }, + "node_modules/styled-components/node_modules/@emotion/is-prop-valid": { + "version": "0.8.8", + "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-0.8.8.tgz", + "integrity": "sha512-u5WtneEAr5IDG2Wv65yhunPSMLIpuKsbuOktRojfrEiEvRyC85LgPMZI63cr7NUqT8ZIGdSVg8ZKGxIug4lXcA==", + "license": "MIT", + "dependencies": { + "@emotion/memoize": "0.7.4" + } + }, + "node_modules/styled-components/node_modules/@emotion/memoize": { + "version": "0.7.4", + "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.4.tgz", + "integrity": "sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw==", + "license": "MIT" + }, "node_modules/styled-components/node_modules/@emotion/unitless": { "version": "0.7.5", "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.7.5.tgz", @@ -12074,13 +11806,6 @@ "dev": true, "license": "MIT" }, - "node_modules/tiny-warning": { - "version": "1.0.3", - "resolved": "https://registry.npmjs.org/tiny-warning/-/tiny-warning-1.0.3.tgz", - "integrity": "sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA==", - "license": "MIT", - "peer": true - }, "node_modules/tippy.js": { "version": "6.3.7", "resolved": "https://registry.npmjs.org/tippy.js/-/tippy.js-6.3.7.tgz", diff --git a/package.json b/package.json index d094a79..aab1ca6 100644 --- a/package.json +++ b/package.json @@ -4,30 +4,31 @@ "private": true, "main": "./src/index.tsx", "dependencies": { - "@emotion/react": "^11.14.0", - "@emotion/styled": "^11.14.0", - "@mui/material": "^7.3.1", - "@testing-library/react": "^13.4.0", - "@testing-library/user-event": "^13.5.0", - "@tippyjs/react": "^4.2.6", - "@types/node": "^20.3.1", - "@types/react": "^18.2.13", - "@types/react-dom": "^18.2.6", - "babel-plugin-syntax-dynamic-import": "^6.18.0", - "bbb-ui-components-react": "npm:@mconf/bbb-ui-components-react@^1.0.0", + "@emotion/react": "11.14.0", + "@emotion/styled": "11.14.1", + "@mconf/bbb-ui-components-react": "2.3.0", + "@mui/icons-material": "7.3.1", + "@mui/material": "7.3.1", + "@testing-library/react": "13.4.0", + "@testing-library/user-event": "13.5.0", + "@tippyjs/react": "4.2.6", + "@types/node": "20.3.1", + "@types/react": "18.2.13", + "@types/react-dom": "18.2.6", + "babel-plugin-syntax-dynamic-import": "6.18.0", "bigbluebutton-html-plugin-sdk": "0.1.17", - "d3": "^7.9.0", - "d3-cloud": "^1.2.7", - "d3-scale": "^4.0.2", - "path": "^0.12.7", - "prop-types": "^15.8.1", - "react": "^18.2.0", - "react-dom": "^18.2.0", - "react-icons": "^5.5.0", - "react-intl": "^7.1.11", - "react-modal": "^3.16.1", - "styled-components": "^5.3.3", - "tippy.js": "^6.3.7" + "d3": "7.9.0", + "d3-cloud": "1.2.7", + "d3-scale": "4.0.2", + "path": "0.12.7", + "prop-types": "15.8.1", + "react": "18.2.0", + "react-dom": "18.2.0", + "react-icons": "5.5.0", + "react-intl": "7.1.11", + "react-modal": "3.16.1", + "styled-components": "5.3.3", + "tippy.js": "6.3.7" }, "scripts": { "build-bundle": "webpack --mode production", @@ -76,7 +77,7 @@ "eslint-plugin-react-hooks": "^4.6.0", "eslint-watch": "^8.0.0", "lint-staged": "11.2.0", - "react-dom": "^18.2.0", + "react-dom": "18.2.0", "style-loader": "^3.3.3", "ts-loader": "^9.4.3", "typescript": "^5.1.6", diff --git a/src/components/panel/component.tsx b/src/components/panel/component.tsx index 44be3ee..d1e0c4a 100644 --- a/src/components/panel/component.tsx +++ b/src/components/panel/component.tsx @@ -4,7 +4,7 @@ import { BBBToggle, BBBTypography, BBBDivider, -} from 'bbb-ui-components-react'; +} from '@mconf/bbb-ui-components-react'; import { pluginLogger } from 'bigbluebutton-html-plugin-sdk'; import { PanelProps } from './types'; import Styled from './styles'; @@ -93,20 +93,26 @@ function Panel({ - - + + + + + + + + diff --git a/src/components/panel/styles.ts b/src/components/panel/styles.ts index 47e5744..9eff24f 100644 --- a/src/components/panel/styles.ts +++ b/src/components/panel/styles.ts @@ -50,11 +50,38 @@ const AttendeeContent = styled.div` const ButtonsContainer = styled.div` display: flex; flex-direction: column; + align-items: stretch; gap: 1rem; margin-top: auto; padding-top: 1rem; `; +const ButtonRow = styled.div` + display: flex; + flex-direction: row; + width: 100%; + gap: 0.75rem; +`; + +const ButtonWrapper = styled.div` + flex: 1; + min-width: 0; + display: flex; + + > * { + width: 100%; + min-width: 0; + } + + button span { + display: block; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + min-width: 0; + } +`; + const StatusIndicator = styled.div<{ isActive: boolean }>` display: flex; align-items: center; @@ -103,6 +130,8 @@ export default { SectionContent, AttendeeContent, ButtonsContainer, + ButtonRow, + ButtonWrapper, StatusIndicator, StatusDot, StatusText, diff --git a/src/components/word-cloud-plugin/component.tsx b/src/components/word-cloud-plugin/component.tsx index 2a3e16b..2ba4bef 100644 --- a/src/components/word-cloud-plugin/component.tsx +++ b/src/components/word-cloud-plugin/component.tsx @@ -1,5 +1,7 @@ import * as React from 'react'; -import { useEffect, useRef, useMemo, useCallback, useState } from 'react'; +import { + useEffect, useRef, useMemo, useCallback, useState, +} from 'react'; import * as ReactDOM from 'react-dom/client'; import { GenericContentSidekickArea, @@ -303,9 +305,9 @@ function WordCloudPlugin({ pluginApi, intl }: WordCloudPluginProps): React.React } const generatedIds = pluginApi.setGenericContentItems(items); - sidekickContentId.current = generatedIds[0]; + [sidekickContentId.current] = generatedIds; if (isActiveRef.current && generatedIds.length > 1) { - mainAreaContentId.current = generatedIds[1]; + [, mainAreaContentId.current] = generatedIds; } isInitializedRef.current = true; @@ -338,9 +340,9 @@ function WordCloudPlugin({ pluginApi, intl }: WordCloudPluginProps): React.React } const generatedIds = pluginApi.setGenericContentItems(items); - sidekickContentId.current = generatedIds[0]; + [sidekickContentId.current] = generatedIds; if (isActiveRef.current && generatedIds.length > 1) { - mainAreaContentId.current = generatedIds[1]; + [, mainAreaContentId.current] = generatedIds; } }, [roleChangeCounter, titleMessage, pluginApi]); @@ -368,8 +370,8 @@ function WordCloudPlugin({ pluginApi, intl }: WordCloudPluginProps): React.React }); const newIds = pluginApi.setGenericContentItems([sidekickArea, mainArea]); - sidekickContentId.current = newIds[0]; - mainAreaContentId.current = newIds[1]; + [sidekickContentId.current] = newIds; + [, mainAreaContentId.current] = newIds; } // Transition: active -> inactive @@ -396,7 +398,7 @@ function WordCloudPlugin({ pluginApi, intl }: WordCloudPluginProps): React.React }); const newIds = pluginApi.setGenericContentItems([sidekickArea]); - sidekickContentId.current = newIds[0]; + [sidekickContentId.current] = newIds; mainAreaContentId.current = undefined; }, FADE_DURATION); } diff --git a/src/plugin-word-cloud/component.tsx b/src/plugin-word-cloud/component.tsx index 364564f..5790b41 100644 --- a/src/plugin-word-cloud/component.tsx +++ b/src/plugin-word-cloud/component.tsx @@ -2,12 +2,10 @@ import * as React from 'react'; import { useEffect, useState, useRef } from 'react'; // Removed useMemo, added useRef import * as d3 from 'd3'; import * as cloud from 'd3-cloud'; // Changed to namespace import -import { scaleOrdinal } from 'd3-scale'; // Using d3-scale for colors potentially import { intlMessages } from '../intlMessages'; import { PublicChatMessagesData, - ChatMessage, PluginWordCloudProps, } from './types'; import { PUBLIC_CHAT_MESSAGES_SUBSCRIPTION } from './queries'; @@ -20,6 +18,7 @@ interface WordData extends cloud.Word { } // Regex to match various emoji presentations, including flags and variation selectors +// eslint-disable-next-line max-len // Using Unicode property escapes: \p{Emoji_Presentation}, \p{Emoji} with VS16, Regional Indicators for flags // More restrictive to avoid matching Unicode numbers const emojiIsolatingRegex = /(\p{Emoji_Presentation}|\p{Emoji}\uFE0F|(?:\p{Regional_Indicator}){2})/gu; @@ -62,10 +61,9 @@ const extractWords = (text: string): string[] => { if (/\d[a-zA-Z]|[a-zA-Z]\d/.test(token)) return false; return true; }) - .map((token) => { - // Remove common punctuation from each word (including parentheses, brackets, etc.) - return token.replace(/[.,!?;:()[\]{}'"<>*#@&^%$~`\\|/+=_-]/g, ''); - }) + // Remove common punctuation from each word (including parentheses, brackets, etc.) + // eslint-disable-next-line no-useless-escape + .map((token) => token.replace(/[.,!?;:()[\]{}'"<>*#@&^%$~`\\|/+=_-]/g, '')) .filter((word) => { // Filter out empty strings after punctuation removal if (word.length === 0) return false; @@ -87,8 +85,10 @@ React.ReactElement { // State to store GLOBAL word counts (for font size) const [wordCounts, setWordCounts] = useState>({}); // State to store word counts PER CATEGORY (minute) (for layout grouping) + // eslint-disable-next-line max-len const [categorizedWordCounts, setCategorizedWordCounts] = useState>>({}); // State to keep track of processed messages with their content and category (to handle edits) + // eslint-disable-next-line max-len const [processedMessages, setProcessedMessages] = useState>({}); // State to track the current category index, incremented by "/cloud" const [currentCategoryIndex, setCurrentCategoryIndex] = useState(0); @@ -125,7 +125,9 @@ React.ReactElement { } // Destructure needed fields - const { messageId, message: messageText, editedAt, deletedAt, messageType } = message; + const { + messageId, message: messageText, editedAt, deletedAt, messageType, + } = message; // Check if this message was already processed const existingMessage = processedMessages[messageId]; @@ -220,6 +222,7 @@ React.ReactElement { setCurrentCategoryIndex((prevIndex) => prevIndex + 1); setProcessedMessages((prev) => ({ ...prev, + // eslint-disable-next-line max-len [messageId]: { content: messageText, category: String(currentCategoryIndex), editedAt }, })); } @@ -269,6 +272,7 @@ React.ReactElement { } // --- Process message (new or edited) --- + // eslint-disable-next-line max-len const currentCategory = isEdited && existingMessage ? existingMessage.category : String(currentCategoryIndex); const words = extractWords(messageText); @@ -296,13 +300,13 @@ React.ReactElement { newCategorizedCounts[currentCategory] = {}; } words.forEach((word) => { + // eslint-disable-next-line max-len newCategorizedCounts[currentCategory][word] = (newCategorizedCounts[currentCategory][word] || 0) + 1; }); return newCategorizedCounts; }); } }); - } // Depend only on the subscription data }, [subscriptionResponse.data]); // Removed processedMessageIds from dependencies @@ -314,17 +318,9 @@ React.ReactElement { const maxFontSize = 120; // Color parameters removed - will use d3.schemeCategory10 - // Calculate min and max counts for normalization (still needed for font size) - const counts = Object.values(wordCounts); - const minCount = counts.length > 0 ? Math.min(...counts) : 1; - const maxCount = counts.length > 0 ? Math.max(...counts) : 1; - - // Define a categorical color scale using a bright scheme suitable for dark backgrounds - const colorScale = d3.scaleOrdinal(d3.schemeCategory10); - // Effect to setup ResizeObserver for responsive layout useEffect(() => { - if (!svgRef.current) return; + if (!svgRef.current) return undefined; const resizeObserver = new ResizeObserver((entries) => { if (!entries || entries.length === 0) return; @@ -351,7 +347,7 @@ React.ReactElement { const [width, height] = dimensions; // Get current dimensions from state if (!svgRef.current || width === 0 || height === 0) { - return; // Don't run if ref isn't ready or dimensions are zero + return undefined; // Don't run if ref isn't ready or dimensions are zero } if (Object.keys(wordCounts).length === 0) { @@ -376,7 +372,7 @@ React.ReactElement { .style('text-anchor', 'middle') // Center text horizontally .text(intl.formatMessage(intlMessages.startTyping)); // Use intl for message - return; // Exit after drawing placeholder + return undefined; // Exit after drawing placeholder } // --- Proceed with Word Cloud Drawing --- @@ -391,7 +387,7 @@ React.ReactElement { // Ensure layout dimensions are not negative if (layoutWidth <= 0 || layoutHeight <= 0) { - return; + return undefined; } // --- Dynamic Font Size Calculation --- @@ -420,6 +416,7 @@ React.ReactElement { return (effectiveMinFontSize + maxFontSize) / 2; } // Linear interpolation between effectiveMinFontSize and maxFontSize + // eslint-disable-next-line max-len const size = effectiveMinFontSize + ((count - minCount) / (maxCount - minCount)) * (maxFontSize - effectiveMinFontSize); // Clamp within the dynamic bounds (effectiveMinFontSize to maxFontSize) return Math.max(effectiveMinFontSize, Math.min(size, maxFontSize)); @@ -429,7 +426,7 @@ React.ReactElement { // Each entry represents a unique word within a specific category (minute) const wordsData: WordData[] = []; Object.entries(categorizedWordCounts).forEach(([category, wordsInCategory]) => { - Object.entries(wordsInCategory).forEach(([wordText, countInCategory]) => { + Object.entries(wordsInCategory).forEach(([wordText]) => { // Get the GLOBAL count for font size calculation const globalCount = wordCounts[wordText] || 1; // Fallback to 1 if somehow missing wordsData.push({ @@ -458,7 +455,7 @@ React.ReactElement { if (numCategories === 0) { // Potentially draw placeholder or clear SVG if needed, though handled earlier - return; + return undefined; } // Calculate grid dimensions @@ -468,7 +465,6 @@ React.ReactElement { const cellHeight = layoutHeight / rows; const allLayoutPromises: Promise[] = []; - const allPositionedWords: WordData[] = []; // Array to collect results categories.forEach((category, index) => { const categoryWords = wordsByCategory[category]; @@ -484,7 +480,7 @@ React.ReactElement { .size([cellWidth, cellHeight]) .words(categoryWords) // Pass only words for this category .padding(1) // Maybe smaller padding within cells - .rotate(() => (~~(Math.random() * 6) - 3) * 15) // Less rotation? + .rotate(() => (Math.floor(Math.random() * 6) - 3) * 15) // Less rotation? .font('Tahoma') .fontSize((d) => d.size || 10) // Use size from WordData .on('end', (positionedWords: WordData[]) => { @@ -501,13 +497,6 @@ React.ReactElement { allLayoutPromises.push(layoutPromise); }); - // Wait for all category layouts to complete - Promise.all(allLayoutPromises).then((results) => { - const combinedWords = results.flat(); // Combine words from all categories - draw(combinedWords, width, height, margin); // Call draw with all positioned words - }); - // --- End Category-Based Layout --- - // Helper function to ensure color is not too dark const ensureLightColor = (colorString: string): string => { const darkThreshold = 0x66; // Equivalent to #666666 @@ -529,8 +518,7 @@ React.ReactElement { // Draw function: Renders the words using D3, now receives dimensions/margin // This function remains largely the same, but now receives words already positioned globally - function draw(words: WordData[], svgWidth: number, svgHeight: number, svgMargin: number) { - + const draw = (words: WordData[], svgWidth: number, svgHeight: number, svgMargin: number) => { // Select the container, ensure SVG exists, or create it const svg = d3.select(svgRef.current) .selectAll('svg') // Use selectAll for potential existing SVG @@ -589,7 +577,14 @@ React.ReactElement { .duration(1600) // Match previous transition duration .style('fill-opacity', 1) .attr('font-size', (d: WordData) => `${d.size}px`); // Add type WordData - } + }; + + // Wait for all category layouts to complete + Promise.all(allLayoutPromises).then((results) => { + const combinedWords = results.flat(); // Combine words from all categories + draw(combinedWords, width, height, margin); // Call draw with all positioned words + }); + // --- End Category-Based Layout --- // Cleanup function for when the component unmounts or dependencies change return () => { @@ -597,6 +592,7 @@ React.ReactElement { // layoutInstance.stop(); // Stop the layout process if it's still running // } }; + // eslint-disable-next-line max-len }, [wordCounts, categorizedWordCounts, dimensions]); // Re-run effect when counts or dimensions change // --- Rendering Logic --- diff --git a/tsconfig.json b/tsconfig.json index 82dcac4..c1920a8 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -2,11 +2,14 @@ "compilerOptions": { "outDir": "./dist-tsc/", "noImplicitAny": true, + "skipLibCheck": true, "module": "es6", - "target": "es6", // Changed from es5 to es6 + "target": "es2021", "jsx": "react", "allowJs": true, - "moduleResolution": "node" + "moduleResolution": "node", + "allowSyntheticDefaultImports": true, + "resolveJsonModule": true }, "include": ["src/**/*"], // Update to include subdirectories "paths": {