diff --git a/.eslintignore b/.eslintignore index fabbe10497..e5cc476988 100644 --- a/.eslintignore +++ b/.eslintignore @@ -1,2 +1,3 @@ src/vector/modernizr.js +# Legacy skinning file that some people might still have src/component-index.js diff --git a/.gitignore b/.gitignore index 52152e1a11..e0a77f171d 100644 --- a/.gitignore +++ b/.gitignore @@ -16,6 +16,7 @@ electron/pub /config.json /config.json.* /config.local*.json +# Legacy skinning file that some people might still have /src/component-index.js /.tmp /webpack-stats.json diff --git a/README.md b/README.md index 75049acdae..084b9b6181 100644 --- a/README.md +++ b/README.md @@ -264,9 +264,6 @@ top of the underlying `matrix-react-sdk`. `matrix-react-sdk` provides both the higher and lower level React components useful for building Matrix communication apps using React. -After creating a new component you must run `yarn reskindex` to regenerate -the `component-index.js` for the app (used in future for skinning). - Please note that Element is intended to run correctly without access to the public internet. So please don't depend on resources (JS libs, CSS, images, fonts) hosted by external CDNs or servers but instead please package all dependencies @@ -321,7 +318,6 @@ Finally, build and start Element itself: yarn link matrix-js-sdk yarn link matrix-react-sdk yarn install -yarn reskindex yarn start ``` @@ -369,9 +365,6 @@ ___ When you make changes to `matrix-react-sdk` or `matrix-js-sdk` they should be automatically picked up by webpack and built. -If you add or remove any components from the Element skin, you will need to rebuild -the skin's index by running, `yarn reskindex`. - If any of these steps error with, `file table overflow`, you are probably on a mac which has a very low limit on max open files. Run `ulimit -Sn 1024` and try again. You'll need to do this in each new terminal you open before building Element. diff --git a/babel.config.js b/babel.config.js index fe720e0a4d..d2248cd0c9 100644 --- a/babel.config.js +++ b/babel.config.js @@ -13,7 +13,6 @@ module.exports = { "@babel/preset-react", ], "plugins": [ - ["@babel/plugin-proposal-decorators", {legacy: true}], "@babel/plugin-proposal-export-default-from", "@babel/plugin-proposal-numeric-separator", "@babel/plugin-proposal-class-properties", diff --git a/components.json b/components.json new file mode 100644 index 0000000000..cc5046ed69 --- /dev/null +++ b/components.json @@ -0,0 +1,5 @@ +{ + "src/components/views/auth/AuthFooter.tsx": "src/components/views/auth/VectorAuthFooter.tsx", + "src/components/views/auth/AuthHeaderLogo.tsx": "src/components/views/auth/VectorAuthHeaderLogo.tsx", + "src/components/views/auth/AuthPage.tsx": "src/components/views/auth/VectorAuthPage.tsx" +} diff --git a/docs/app-load.md b/docs/app-load.md index 7908ce68b0..a043d20463 100644 --- a/docs/app-load.md +++ b/docs/app-load.md @@ -1,5 +1,8 @@ # App load order +**Dev note**: As of March 2022, the skin is no longer part of the app load order at all. The document's graphs have +been kept untouched for posterity. + Old slow flow: ![image](https://user-images.githubusercontent.com/2403652/73848963-00a2a080-4821-11ea-97d4-1200fc2638f3.png) diff --git a/docs/customisations.md b/docs/customisations.md index 5af98a01f9..fed7e616f6 100644 --- a/docs/customisations.md +++ b/docs/customisations.md @@ -34,9 +34,9 @@ default, Element Web does *not* ship with this file to prevent conflicts. ### Custom components -Instead of implementing skinning from the react-sdk, maintainers can use the above system to override components -if they wish. Maintenance and API surface compatibility are left as a responsibility for the project - the layering -in Element Web (including the react-sdk) do not make guarantees that properties/state machines won't change. +Maintainers can use the above system to override components if they wish. Maintenance and API surface compatibility are +left as a responsibility for the project - the layering in Element Web (including the react-sdk) do not make guarantees +that properties/state machines won't change. ### Component visibility customisation diff --git a/docs/skinning thoughts.md b/docs/skinning thoughts.md deleted file mode 100644 index 0466aaa035..0000000000 --- a/docs/skinning thoughts.md +++ /dev/null @@ -1,68 +0,0 @@ -== Skinning refactor == - -matrix-react-sdk - - base images - - base CSS - - all the components needed to build a workable app (including the top layer) - -element-web: the Element skin - - Element-specific classes (e.g. login header/footer) - - Element-specific themes - - light - - dark - -i.e. the only things which should go into element-web are bits which apply vector-specific skinning -specifically "Stuff that any other brand would not want to use. (e.g. Element logos, links, T&Cs)" - - Questions: - - Electron app? (should probably be a separate repo in its own right? but might as well go here for now) - - index.html & index.js? (should be in matrix-react-sdk, given the SDK is useless without them?) - -ideally matrix-react-sdk itself should ship with a default skin which actually works built in. - -status skin (can go in the same app for now) - - has status theme - - which inherits from Element light theme - - how do we share graphics between skins? - - shove them into react-sdk, or... - - guess we do ../../vector/img - - this means keeping the skin name in the images (unless /img is a shortcut to the right skin's images) - -out of scope: - - making the components more independent, so they can be used in isolation. - - that said, the bits which should probably be used by being embeded into a different app: - - login/reg - - RoomView + RoomSettings - - MessageComposer - - RoomList - - MemberList - - MemberInfo - - Voip UI - - UserSettings - - sharing different js-sdks between the different isolated modules - -other changes: - - how do we handle i18n? - - each skin should really be its own i18n project. As long as all the commonality stuff is in matrix-react-sdk this shouldn't be too bad. - - ability to associate components with a given skin - - skins/vector/src <-- components - - skins/vector/css - - skins/vector/img - - skins/vector/fonts - - gather together themes (per skin) into a single place too - - skins/vector/themes/foo/css - - skins/vector/themes/foo/img - - skins/vector/themes/foo/fonts - - ideally element-web would contain almost nothing but skins/vector directory. - - ability to entirely replace CSS rather than override it for a given theme - - e.g. if we replace `Login.js` with `StatusLogin.js`, then we should similarly be able to replace `_Login.scss` with `_StatusLogin.scss`. - -random thoughts; - - should we be able to change the entire skin at runtime (more like wordpress) - to the extent of replacing entire components? - - might pose security issues if a theme can be swapped out to replace MatrixChat or other fundamental functionality at runtime - - if so, perhaps skins & themes should converge... - ------------------ - -Immediate plan for Status: - * Implement it as a theme for the Element skin - * Ideally move skins to a sensible level (possibly even including src?) diff --git a/docs/theming.md b/docs/theming.md index 972c65e71f..10dc0008e1 100644 --- a/docs/theming.md +++ b/docs/theming.md @@ -6,7 +6,7 @@ Element app via CSS & custom imagery. They are *NOT* co be confused with 'skins', which describe apps which sit on top of matrix-react-sdk - e.g. in theory Element itself is a react-sdk skin. -As of Jan 2017, skins are not fully supported; Element is the only available skin. +As of March 2022, skins are not fully supported; Element is the only available skin. To define a theme for Element: diff --git a/package.json b/package.json index 3bd2a2ba11..6177f12caf 100644 --- a/package.json +++ b/package.json @@ -30,21 +30,18 @@ "i18n": "matrix-gen-i18n", "prunei18n": "matrix-prune-i18n", "diff-i18n": "cp src/i18n/strings/en_EN.json src/i18n/strings/en_EN_orig.json && matrix-gen-i18n && matrix-compare-i18n-files src/i18n/strings/en_EN_orig.json src/i18n/strings/en_EN.json", - "reskindex": "reskindex -h src/header", - "reskindex:watch": "reskindex -h src/header -w", - "reskindex:watch-react": "node scripts/yarn-sub.js matrix-react-sdk reskindex:watch", "clean": "rimraf lib webapp", "build": "yarn clean && yarn build:genfiles && yarn build:bundle", "build-stats": "yarn clean && yarn build:genfiles && yarn build:bundle-stats", "build:jitsi": "node scripts/build-jitsi.js", "build:res": "node scripts/copy-res.js", - "build:genfiles": "yarn reskindex && yarn build:res && yarn build:jitsi", + "build:genfiles": "yarn build:res && yarn build:jitsi", "build:modernizr": "modernizr -c .modernizr.json -d src/vector/modernizr.js", "build:bundle": "webpack --progress --bail --mode production", "build:bundle-stats": "webpack --progress --bail --mode production --json > webpack-stats.json", "dist": "scripts/package.sh", - "start": "concurrently --kill-others-on-fail --prefix \"{time} [{name}]\" -n reskindex,reskindex-react,res,element-js \"yarn reskindex:watch\" \"yarn reskindex:watch-react\" \"yarn start:res\" \"yarn start:js\"", - "start:https": "concurrently --kill-others-on-fail --prefix \"{time} [{name}]\" -n reskindex,reskindex-react,res,element-js \"yarn reskindex:watch\" \"yarn reskindex:watch-react\" \"yarn start:res\" \"yarn start:js --https\"", + "start": "concurrently --kill-others-on-fail --prefix \"{time} [{name}]\" -n res,element-js \"yarn start:res\" \"yarn start:js\"", + "start:https": "concurrently --kill-others-on-fail --prefix \"{time} [{name}]\" -n res,element-js \"yarn start:res\" \"yarn start:js --https\"", "start:res": "yarn build:jitsi && node scripts/copy-res.js -w", "start:js": "webpack-dev-server --host=0.0.0.0 --output-filename=bundles/_dev_/[name].js --output-chunk-filename=bundles/_dev_/[name].js -w --mode development --disable-host-check --hot", "lint": "yarn lint:types && yarn lint:js && yarn lint:style", @@ -74,7 +71,6 @@ "@babel/eslint-parser": "^7.12.10", "@babel/eslint-plugin": "^7.12.10", "@babel/plugin-proposal-class-properties": "^7.12.1", - "@babel/plugin-proposal-decorators": "^7.12.12", "@babel/plugin-proposal-export-default-from": "^7.12.1", "@babel/plugin-proposal-nullish-coalescing-operator": "^7.12.1", "@babel/plugin-proposal-numeric-separator": "^7.12.7", diff --git a/res/welcome.html b/res/welcome.html index bb3f84fe64..ef01d8876c 100644 --- a/res/welcome.html +++ b/res/welcome.html @@ -173,7 +173,8 @@ we don't have an account and should hide them. No account == no guest account ei <img src="welcome/images/logo.svg" alt="" class="mx_Logo"/> </a> <h1 class="mx_Header_title">_t("Welcome to Element")</h1> - <h4 class="mx_Header_subtitle">_t("Decentralised, encrypted chat & collaboration powered by [matrix]")</h4> + <!-- XXX: Our translations system isn't smart enough to recognize variables in the HTML, so we manually do it --> + <h4 class="mx_Header_subtitle">_t("Decentralised, encrypted chat & collaboration powered by $matrixLogo")</h4> <div class="mx_ButtonGroup"> <div class="mx_ButtonRow"> <a href="#/login" class="mx_ButtonParent mx_ButtonSignIn mx_Button_iconSignIn"> diff --git a/res/welcome/images/matrix.svg b/res/welcome/images/matrix.svg deleted file mode 100644 index 13adcab25a..0000000000 --- a/res/welcome/images/matrix.svg +++ /dev/null @@ -1,153 +0,0 @@ -<?xml version="1.0" encoding="utf-8"?> -<!-- Generator: Adobe Illustrator 13.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 14576) --> -<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> -<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" - width="793.322px" height="340.809px" viewBox="0 0 793.322 340.809" enable-background="new 0 0 793.322 340.809" - xml:space="preserve"> -<path opacity="0.5" fill="#FFFFFF" d="M34.004,340.809H2c-1.104,0-2-0.896-2-2V2c0-1.104,0.896-2,2-2h32.004c1.104,0,2,0.896,2,2 - v7.71c0,1.104-0.896,2-2,2h-21.13v317.386h21.13c1.104,0,2,0.896,2,2.001v7.712C36.004,339.913,35.108,340.809,34.004,340.809 - L34.004,340.809z"/> -<path opacity="0.5" fill="#FFFFFF" d="M10.875,9.711v321.386h23.13v7.711H1.999V2.001h32.006v7.71H10.875z"/> -<path opacity="0.5" fill="#FFFFFF" d="M252.402,233.711h-32.993c-1.104,0-2-0.896-2-2v-68.073c0-3.949-0.154-7.722-0.457-11.213 - c-0.289-3.282-1.074-6.153-2.332-8.53c-1.204-2.276-3.017-4.119-5.384-5.476c-2.393-1.362-5.775-2.056-10.042-2.056 - c-4.238,0-7.674,0.798-10.213,2.371c-2.565,1.596-4.604,3.701-6.053,6.258c-1.498,2.643-2.51,5.694-3.013,9.067 - c-0.526,3.513-0.793,7.125-0.793,10.741v66.91c0,1.104-0.896,2-2,2h-32.991c-1.104,0-2-0.896-2-2v-67.373 - c0-3.435-0.078-6.964-0.228-10.485c-0.148-3.251-0.767-6.278-1.841-8.995c-1.018-2.571-2.667-4.584-5.047-6.153 - c-2.372-1.552-6.029-2.341-10.865-2.341c-1.372,0-3.265,0.328-5.629,0.976c-2.28,0.624-4.536,1.826-6.705,3.577 - c-2.152,1.732-4.036,4.306-5.605,7.655c-1.569,3.356-2.367,7.877-2.367,13.438v69.701c0,1.104-0.895,2-2,2H68.857 - c-1.104,0-2-0.896-2-2V111.594c0-1.104,0.896-1.999,2-1.999h31.13c1.104,0,2,0.896,2,1.999v11.007 - c3.834-4.499,8.248-8.152,13.173-10.896c6.396-3.559,13.799-5.362,22.002-5.362c7.846,0,15.127,1.548,21.642,4.604 - c5.794,2.722,10.424,7.26,13.791,13.52c3.449-4.362,7.833-8.306,13.071-11.752c6.422-4.228,14.102-6.371,22.824-6.371 - c6.499,0,12.625,0.807,18.209,2.399c5.686,1.628,10.635,4.271,14.712,7.857c4.088,3.605,7.318,8.357,9.601,14.123 - c2.25,5.719,3.391,12.649,3.391,20.604v80.384C254.402,232.815,253.507,233.711,252.402,233.711L252.402,233.711z"/> -<path opacity="0.5" fill="#FFFFFF" d="M99.988,111.595v16.264h0.463c4.338-6.191,9.563-10.998,15.684-14.406 - c6.117-3.402,13.129-5.11,21.027-5.11c7.588,0,14.521,1.475,20.793,4.415c6.274,2.945,11.038,8.131,14.291,15.567 - c3.56-5.265,8.4-9.913,14.521-13.94c6.117-4.025,13.358-6.042,21.724-6.042c6.351,0,12.234,0.776,17.66,2.325 - c5.418,1.549,10.065,4.027,13.938,7.434c3.869,3.41,6.889,7.863,9.062,13.357c2.167,5.504,3.253,12.122,3.253,19.869v80.385H219.41 - v-68.074c0-4.025-0.154-7.82-0.465-11.385c-0.313-3.56-1.161-6.656-2.555-9.293c-1.395-2.631-3.45-4.724-6.157-6.274 - c-2.711-1.543-6.391-2.322-11.037-2.322s-8.403,0.896-11.269,2.671c-2.868,1.784-5.112,4.109-6.737,6.971 - c-1.626,2.869-2.711,6.12-3.252,9.762c-0.545,3.638-0.814,7.318-0.814,11.035v66.91h-32.991v-67.375c0-3.562-0.081-7.087-0.23-10.57 - c-0.158-3.487-0.814-6.7-1.978-9.645c-1.162-2.94-3.099-5.304-5.809-7.088c-2.711-1.775-6.699-2.671-11.965-2.671 - c-1.551,0-3.603,0.349-6.156,1.048c-2.556,0.697-5.036,2.016-7.435,3.949c-2.404,1.938-4.454,4.726-6.158,8.363 - c-1.705,3.642-2.556,8.402-2.556,14.287v69.701h-32.99V111.595H99.988z"/> -<path opacity="0.5" fill="#FFFFFF" d="M304.909,236.733c-5.883,0-11.46-0.729-16.574-2.163c-5.192-1.464-9.806-3.774-13.713-6.871 - c-3.944-3.117-7.068-7.111-9.282-11.871c-2.205-4.733-3.324-10.412-3.324-16.876c0-7.13,1.293-13.117,3.846-17.797 - c2.542-4.674,5.877-8.464,9.912-11.263c3.97-2.752,8.556-4.842,13.63-6.209c4.901-1.322,9.937-2.394,14.961-3.184 - c4.986-0.775,9.949-1.404,14.754-1.872c4.679-0.452,8.88-1.139,12.489-2.039c3.412-0.854,6.118-2.09,8.042-3.672 - c1.666-1.37,2.416-3.384,2.292-6.151c-0.002-3.289-0.502-5.816-1.492-7.595c-0.998-1.798-2.283-3.15-3.927-4.138 - c-1.703-1.02-3.725-1.713-6.012-2.062c-2.47-0.37-5.146-0.557-7.947-0.557c-6.034,0-10.789,1.271-14.135,3.783 - c-3.233,2.424-5.155,6.64-5.714,12.527c-0.098,1.026-0.961,1.812-1.992,1.812h-32.992c-0.552,0-1.079-0.229-1.457-0.629 - c-0.376-0.402-0.572-0.941-0.54-1.491c0.485-8.073,2.55-14.894,6.142-20.272c3.548-5.331,8.147-9.682,13.661-12.931 - c5.424-3.191,11.612-5.498,18.392-6.857c6.684-1.335,13.5-2.013,20.26-2.013c6.096,0,12.365,0.437,18.626,1.296 - c6.377,0.88,12.285,2.622,17.562,5.177c5.376,2.604,9.845,6.29,13.282,10.951c3.498,4.744,5.271,11.048,5.271,18.731v62.494 - c0,5.307,0.306,10.462,0.915,15.319c0.576,4.64,1.572,8.116,2.963,10.338c0.385,0.616,0.407,1.395,0.055,2.031 - c-0.353,0.635-1.022,1.03-1.75,1.03h-33.457c-0.861,0-1.624-0.55-1.898-1.367c-0.646-1.941-1.176-3.939-1.572-5.936 - c-0.141-0.696-0.267-1.402-0.38-2.12c-4.825,4.184-10.349,7.24-16.474,9.105C320.033,235.609,312.489,236.733,304.909,236.733 - L304.909,236.733z M341.941,176.661c-0.809,0.409-1.676,0.768-2.596,1.074c-2.161,0.72-4.511,1.326-6.988,1.807 - c-2.442,0.475-5.033,0.872-7.699,1.186c-2.631,0.311-5.251,0.697-7.784,1.146c-2.329,0.433-4.705,1.035-7.051,1.792 - c-2.194,0.711-4.114,1.667-5.699,2.842c-1.531,1.128-2.785,2.587-3.731,4.335c-0.917,1.709-1.385,3.97-1.385,6.719 - c0,2.598,0.465,4.778,1.385,6.481c0.928,1.722,2.142,3.035,3.716,4.018c1.644,1.026,3.601,1.757,5.816,2.17 - c2.344,0.439,4.799,0.663,7.297,0.663c6.105,0,10.836-0.996,14.063-2.961c3.244-1.973,5.666-4.349,7.199-7.062 - c1.568-2.78,2.542-5.62,2.892-8.436c0.376-3.019,0.565-5.436,0.565-7.187V176.661L341.941,176.661z"/> -<path opacity="0.5" fill="#FFFFFF" d="M273.544,129.255c3.405-5.113,7.744-9.215,13.012-12.316 - c5.264-3.097,11.186-5.303,17.771-6.621c6.582-1.315,13.205-1.976,19.865-1.976c6.042,0,12.158,0.428,18.354,1.277 - c6.195,0.855,11.85,2.522,16.962,4.997c5.111,2.477,9.292,5.926,12.546,10.338c3.253,4.414,4.879,10.262,4.879,17.543v62.494 - c0,5.428,0.31,10.611,0.931,15.567c0.615,4.959,1.701,8.676,3.251,11.153H347.66c-0.621-1.86-1.126-3.755-1.511-5.693 - c-0.39-1.933-0.661-3.908-0.813-5.923c-5.267,5.422-11.465,9.217-18.585,11.386c-7.127,2.163-14.407,3.251-21.842,3.251 - c-5.733,0-11.077-0.698-16.033-2.09c-4.958-1.395-9.293-3.562-13.01-6.51c-3.718-2.938-6.622-6.656-8.713-11.147 - s-3.138-9.84-3.138-16.033c0-6.813,1.199-12.43,3.604-16.84c2.399-4.417,5.495-7.939,9.295-10.575 - c3.793-2.632,8.129-4.607,13.01-5.923c4.878-1.315,9.795-2.358,14.752-3.137c4.957-0.772,9.835-1.393,14.638-1.857 - c4.801-0.466,9.062-1.164,12.779-2.093c3.718-0.929,6.658-2.282,8.829-4.065c2.165-1.781,3.172-4.375,3.02-7.785 - c0-3.56-0.58-6.389-1.742-8.479c-1.161-2.09-2.711-3.719-4.646-4.88c-1.937-1.161-4.183-1.936-6.737-2.325 - c-2.557-0.382-5.309-0.58-8.248-0.58c-6.506,0-11.617,1.395-15.335,4.183c-3.716,2.788-5.889,7.437-6.506,13.94h-32.991 - C268.199,140.794,270.132,134.363,273.544,129.255z M338.713,175.838c-2.09,0.696-4.337,1.275-6.736,1.741 - c-2.402,0.465-4.918,0.853-7.551,1.161c-2.635,0.313-5.268,0.698-7.899,1.163c-2.48,0.461-4.919,1.086-7.317,1.857 - c-2.404,0.779-4.495,1.822-6.274,3.138c-1.784,1.317-3.216,2.985-4.3,4.994c-1.085,2.014-1.626,4.571-1.626,7.668 - c0,2.94,0.541,5.422,1.626,7.431c1.084,2.017,2.558,3.604,4.416,4.765s4.025,1.976,6.507,2.438c2.475,0.466,5.031,0.698,7.665,0.698 - c6.505,0,11.537-1.082,15.103-3.253c3.561-2.166,6.192-4.762,7.899-7.785c1.702-3.019,2.749-6.072,3.137-9.174 - c0.384-3.097,0.58-5.576,0.58-7.434v-12.316C342.547,174.173,340.805,175.14,338.713,175.838z"/> -<path opacity="0.5" fill="#FFFFFF" d="M444.542,234.874c-5.187,0-10.173-0.361-14.823-1.069c-4.802-0.732-9.104-2.183-12.779-4.313 - c-3.789-2.185-6.821-5.341-9.006-9.375c-2.163-3.986-3.26-9.232-3.26-15.59v-68.859h-17.981c-1.104,0-2-0.896-2-1.999v-22.073 - c0-1.104,0.896-1.999,2-1.999h17.981V75.582c0-1.104,0.896-2,2-2h32.992c1.104,0,2,0.896,2,2v34.014h22.162c1.104,0,2,0.896,2,1.999 - v22.073c0,1.104-0.896,1.999-2,1.999h-22.162v57.479c0,6.229,1.198,8.731,2.202,9.733c1.004,1.007,3.506,2.205,9.738,2.205 - c1.804,0,3.542-0.076,5.161-0.225c1.604-0.144,3.174-0.367,4.669-0.665c0.13-0.026,0.261-0.039,0.391-0.039 - c0.458,0,0.907,0.159,1.27,0.454c0.463,0.379,0.73,0.946,0.73,1.546v25.555c0,0.979-0.707,1.813-1.672,1.974 - c-2.834,0.472-6.041,0.794-9.527,0.957C451.015,234.798,447.718,234.874,444.542,234.874L444.542,234.874z"/> -<path opacity="0.5" fill="#FFFFFF" d="M463.825,111.595v22.072h-24.161v59.479c0,5.573,0.928,9.292,2.788,11.149 - c1.856,1.859,5.576,2.788,11.152,2.788c1.859,0,3.638-0.076,5.343-0.232c1.703-0.152,3.33-0.388,4.878-0.696v25.557 - c-2.788,0.465-5.887,0.773-9.293,0.931c-3.407,0.149-6.737,0.23-9.99,0.23c-5.111,0-9.953-0.35-14.521-1.048 - c-4.571-0.695-8.597-2.047-12.081-4.063c-3.486-2.011-6.236-4.88-8.248-8.597c-2.016-3.714-3.021-8.595-3.021-14.639v-70.859h-19.98 - v-22.072h19.98V75.583h32.992v36.012H463.825z"/> -<path opacity="0.5" fill="#FFFFFF" d="M512.613,233.711h-32.991c-1.104,0-2-0.896-2-2V111.594c0-1.104,0.896-1.999,2-1.999h31.366 - c1.104,0,2,0.896,2,1.999v15.069c0.967-1.516,2.034-2.978,3.199-4.382c2.754-3.312,5.949-6.182,9.496-8.522 - c3.545-2.332,7.385-4.169,11.415-5.462c4.056-1.298,8.327-1.954,12.691-1.954c2.341,0,4.953,0.418,7.766,1.243 - c0.852,0.25,1.437,1.032,1.437,1.92v30.67c0,0.6-0.269,1.167-0.732,1.547c-0.361,0.296-0.808,0.452-1.265,0.452 - c-0.133,0-0.265-0.013-0.398-0.039c-1.484-0.3-3.299-0.565-5.392-0.787c-2.098-0.224-4.136-0.339-6.062-0.339 - c-5.706,0-10.572,0.95-14.467,2.823c-3.862,1.86-7.012,4.428-9.361,7.629c-2.389,3.263-4.115,7.12-5.127,11.47 - c-1.043,4.479-1.574,9.409-1.574,14.647v54.132C514.613,232.815,513.717,233.711,512.613,233.711L512.613,233.711z"/> -<path opacity="0.5" fill="#FFFFFF" d="M510.988,111.595V133.9h0.465c1.546-3.72,3.636-7.163,6.272-10.341 - c2.634-3.172,5.652-5.885,9.06-8.131c3.405-2.242,7.047-3.985,10.923-5.228c3.868-1.237,7.898-1.859,12.081-1.859 - c2.168,0,4.566,0.39,7.202,1.163v30.67c-1.551-0.312-3.41-0.584-5.576-0.814c-2.17-0.233-4.26-0.35-6.274-0.35 - c-6.041,0-11.152,1.01-15.332,3.021c-4.182,2.014-7.55,4.761-10.107,8.247c-2.555,3.487-4.379,7.55-5.462,12.198 - c-1.083,4.645-1.625,9.682-1.625,15.102v54.133h-32.991V111.595H510.988z"/> -<path opacity="0.5" fill="#FFFFFF" d="M603.923,233.711H570.93c-1.104,0-2-0.896-2-2V111.594c0-1.104,0.896-1.999,2-1.999h32.994 - c1.104,0,2,0.896,2,1.999v120.117C605.923,232.815,605.027,233.711,603.923,233.711L603.923,233.711z M603.923,95.006H570.93 - c-1.104,0-2-0.896-2-1.999V65.825c0-1.104,0.896-2,2-2h32.994c1.104,0,2,0.896,2,2v27.182 - C605.923,94.11,605.027,95.006,603.923,95.006L603.923,95.006z"/> -<path opacity="0.5" fill="#FFFFFF" d="M570.93,93.007V65.824h32.994v27.183H570.93z M603.924,111.595v120.117H570.93V111.595 - H603.924z"/> -<path opacity="0.5" fill="#FFFFFF" d="M742.163,233.711h-37.64c-0.671,0-1.297-0.335-1.667-0.896l-23.426-35.352l-23.426,35.352 - c-0.369,0.561-0.995,0.896-1.667,0.896h-36.938c-0.741,0-1.424-0.411-1.77-1.067c-0.345-0.654-0.3-1.449,0.118-2.061l42.435-62.055 - l-38.71-55.793c-0.424-0.613-0.474-1.408-0.128-2.069c0.343-0.658,1.028-1.071,1.771-1.071h37.636c0.665,0,1.287,0.33,1.658,0.882 - l19.477,28.893l19.255-28.884c0.372-0.556,0.996-0.891,1.665-0.891h36.475c0.746,0,1.43,0.415,1.776,1.078 - c0.343,0.66,0.289,1.46-0.139,2.071l-38.69,55.082l43.578,62.744c0.424,0.61,0.474,1.408,0.128,2.066 - C743.591,233.298,742.908,233.711,742.163,233.711L742.163,233.711z"/> -<path opacity="0.5" fill="#FFFFFF" d="M621.115,111.595h37.637l21.144,31.365l20.911-31.365h36.476l-39.496,56.226l44.377,63.892 - h-37.64l-25.093-37.87l-25.094,37.87h-36.938l43.213-63.193L621.115,111.595z"/> -<path opacity="0.5" fill="#FFFFFF" d="M791.322,340.809h-32.008c-1.105,0-2-0.896-2-2v-7.712c0-1.105,0.896-2.001,2-2.001h21.13 - V11.71h-21.13c-1.105,0-2-0.896-2-2V2c0-1.104,0.896-2,2-2h32.008c1.104,0,2,0.896,2,2v336.809 - C793.322,339.913,792.426,340.809,791.322,340.809L791.322,340.809z"/> -<path opacity="0.5" fill="#FFFFFF" d="M782.443,331.097V9.711h-23.13v-7.71h32.008v336.807h-32.008v-7.711H782.443z"/> -<path d="M10.875,9.711v321.386h23.13v7.711H1.999V2.001h32.006v7.71H10.875z"/> -<path d="M99.988,111.595v16.264h0.463c4.338-6.191,9.563-10.998,15.684-14.406c6.117-3.402,13.129-5.11,21.027-5.11 - c7.588,0,14.521,1.475,20.793,4.415c6.274,2.945,11.038,8.131,14.291,15.567c3.56-5.265,8.4-9.913,14.521-13.94 - c6.117-4.025,13.358-6.042,21.724-6.042c6.351,0,12.234,0.776,17.66,2.325c5.418,1.549,10.065,4.027,13.938,7.434 - c3.869,3.41,6.889,7.863,9.062,13.357c2.167,5.504,3.253,12.122,3.253,19.869v80.385H219.41v-68.074 - c0-4.025-0.154-7.82-0.465-11.385c-0.313-3.56-1.161-6.656-2.555-9.293c-1.395-2.631-3.45-4.724-6.157-6.274 - c-2.711-1.543-6.391-2.322-11.037-2.322s-8.403,0.896-11.269,2.671c-2.868,1.784-5.112,4.109-6.737,6.971 - c-1.626,2.869-2.711,6.12-3.252,9.762c-0.545,3.638-0.814,7.318-0.814,11.035v66.91h-32.991v-67.375c0-3.562-0.081-7.087-0.23-10.57 - c-0.158-3.487-0.814-6.7-1.978-9.645c-1.162-2.94-3.099-5.304-5.809-7.088c-2.711-1.775-6.699-2.671-11.965-2.671 - c-1.551,0-3.603,0.349-6.156,1.048c-2.556,0.697-5.036,2.016-7.435,3.949c-2.404,1.938-4.454,4.726-6.158,8.363 - c-1.705,3.642-2.556,8.402-2.556,14.287v69.701h-32.99V111.595H99.988z"/> -<path d="M273.544,129.255c3.405-5.113,7.744-9.215,13.012-12.316c5.264-3.097,11.186-5.303,17.771-6.621 - c6.582-1.315,13.205-1.976,19.865-1.976c6.042,0,12.158,0.428,18.354,1.277c6.195,0.855,11.85,2.522,16.962,4.997 - c5.111,2.477,9.292,5.926,12.546,10.338c3.253,4.414,4.879,10.262,4.879,17.543v62.494c0,5.428,0.31,10.611,0.931,15.567 - c0.615,4.959,1.701,8.676,3.251,11.153H347.66c-0.621-1.86-1.126-3.755-1.511-5.693c-0.39-1.933-0.661-3.908-0.813-5.923 - c-5.267,5.422-11.465,9.217-18.585,11.386c-7.127,2.163-14.407,3.251-21.842,3.251c-5.733,0-11.077-0.698-16.033-2.09 - c-4.958-1.395-9.293-3.562-13.01-6.51c-3.718-2.938-6.622-6.656-8.713-11.147s-3.138-9.84-3.138-16.033 - c0-6.813,1.199-12.43,3.604-16.84c2.399-4.417,5.495-7.939,9.295-10.575c3.793-2.632,8.129-4.607,13.01-5.923 - c4.878-1.315,9.795-2.358,14.752-3.137c4.957-0.772,9.835-1.393,14.638-1.857c4.801-0.466,9.062-1.164,12.779-2.093 - c3.718-0.929,6.658-2.282,8.829-4.065c2.165-1.781,3.172-4.375,3.02-7.785c0-3.56-0.58-6.389-1.742-8.479 - c-1.161-2.09-2.711-3.719-4.646-4.88c-1.937-1.161-4.183-1.936-6.737-2.325c-2.557-0.382-5.309-0.58-8.248-0.58 - c-6.506,0-11.617,1.395-15.335,4.183c-3.716,2.788-5.889,7.437-6.506,13.94h-32.991 - C268.199,140.794,270.132,134.363,273.544,129.255z M338.713,175.838c-2.09,0.696-4.337,1.275-6.736,1.741 - c-2.402,0.465-4.918,0.853-7.551,1.161c-2.635,0.313-5.268,0.698-7.899,1.163c-2.48,0.461-4.919,1.086-7.317,1.857 - c-2.404,0.779-4.495,1.822-6.274,3.138c-1.784,1.317-3.216,2.985-4.3,4.994c-1.085,2.014-1.626,4.571-1.626,7.668 - c0,2.94,0.541,5.422,1.626,7.431c1.084,2.017,2.558,3.604,4.416,4.765s4.025,1.976,6.507,2.438c2.475,0.466,5.031,0.698,7.665,0.698 - c6.505,0,11.537-1.082,15.103-3.253c3.561-2.166,6.192-4.762,7.899-7.785c1.702-3.019,2.749-6.072,3.137-9.174 - c0.384-3.097,0.58-5.576,0.58-7.434v-12.316C342.547,174.173,340.805,175.14,338.713,175.838z"/> -<path d="M463.825,111.595v22.072h-24.161v59.479c0,5.573,0.928,9.292,2.788,11.149c1.856,1.859,5.576,2.788,11.152,2.788 - c1.859,0,3.638-0.076,5.343-0.232c1.703-0.152,3.33-0.388,4.878-0.696v25.557c-2.788,0.465-5.887,0.773-9.293,0.931 - c-3.407,0.149-6.737,0.23-9.99,0.23c-5.111,0-9.953-0.35-14.521-1.048c-4.571-0.695-8.597-2.047-12.081-4.063 - c-3.486-2.011-6.236-4.88-8.248-8.597c-2.016-3.714-3.021-8.595-3.021-14.639v-70.859h-19.98v-22.072h19.98V75.583h32.992v36.012 - H463.825z"/> -<path d="M510.988,111.595V133.9h0.465c1.546-3.72,3.636-7.163,6.272-10.341c2.634-3.172,5.652-5.885,9.06-8.131 - c3.405-2.242,7.047-3.985,10.923-5.228c3.868-1.237,7.898-1.859,12.081-1.859c2.168,0,4.566,0.39,7.202,1.163v30.67 - c-1.551-0.312-3.41-0.584-5.576-0.814c-2.17-0.233-4.26-0.35-6.274-0.35c-6.041,0-11.152,1.01-15.332,3.021 - c-4.182,2.014-7.55,4.761-10.107,8.247c-2.555,3.487-4.379,7.55-5.462,12.198c-1.083,4.645-1.625,9.682-1.625,15.102v54.133h-32.991 - V111.595H510.988z"/> -<path d="M570.93,93.007V65.824h32.994v27.183H570.93z M603.924,111.595v120.117H570.93V111.595H603.924z"/> -<path d="M621.115,111.595h37.637l21.144,31.365l20.911-31.365h36.476l-39.496,56.226l44.377,63.892h-37.64l-25.093-37.87 - l-25.094,37.87h-36.938l43.213-63.193L621.115,111.595z"/> -<path d="M782.443,331.097V9.711h-23.13v-7.71h32.008v336.807h-32.008v-7.711H782.443z"/> -</svg> diff --git a/scripts/docker-link-repos.sh b/scripts/docker-link-repos.sh index 54c89bacae..cf824d87ad 100644 --- a/scripts/docker-link-repos.sh +++ b/scripts/docker-link-repos.sh @@ -32,7 +32,6 @@ cd react-sdk yarn link yarn link matrix-js-sdk yarn --network-timeout=100000 install -yarn reskindex cd ../ echo "Setting up element-web with react-sdk and js-sdk packages" diff --git a/scripts/fetch-develop.deps.sh b/scripts/fetch-develop.deps.sh index 65159d1a1b..71850188a6 100755 --- a/scripts/fetch-develop.deps.sh +++ b/scripts/fetch-develop.deps.sh @@ -92,16 +92,8 @@ pushd matrix-react-sdk yarn link yarn link matrix-js-sdk yarn install --pure-lockfile -yarn reskindex popd yarn link matrix-react-sdk ############################## - -# Link the reskindex binary in place: if we used `yarn link`, -# Yarn would do this for us, but we don't because we'd have -# to define the Yarn binary prefix somewhere so it could put the -# intermediate symlinks there. Instead, we do it ourselves. -mkdir -p node_modules/.bin -ln -sfv ../matrix-react-sdk/scripts/reskindex.js node_modules/.bin/reskindex diff --git a/src/components/structures/VectorEmbeddedPage.tsx b/src/components/structures/VectorEmbeddedPage.tsx deleted file mode 100644 index 85adb2fb3f..0000000000 --- a/src/components/structures/VectorEmbeddedPage.tsx +++ /dev/null @@ -1,34 +0,0 @@ -/* -Copyright 2016 OpenMarket Ltd -Copyright 2017 Vector Creations Ltd -Copyright 2019 New Vector Ltd - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -import EmbeddedPage from 'matrix-react-sdk/src/components/structures/EmbeddedPage'; -import sanitizeHtml from 'sanitize-html'; -import { _t } from 'matrix-react-sdk/src/languageHandler'; - -export default class VectorEmbeddedPage extends EmbeddedPage { - static replaces = 'EmbeddedPage'; - - // we're overriding the base component here, for Element-specific tweaks - translate(s: string) { - s = sanitizeHtml(_t(s)); - // ugly fix for https://github.com/vector-im/element-web/issues/4243 - // eslint-disable-next-line max-len - s = s.replace(/\[matrix\]/, '<a href="https://matrix.org" target="_blank" rel="noreferrer noopener"><img width="79" height="34" alt="Matrix" style="padding-left: 1px;vertical-align: middle" src="welcome/images/matrix.svg"/></a>'); - return s; - } -} diff --git a/src/components/views/auth/VectorAuthFooter.tsx b/src/components/views/auth/VectorAuthFooter.tsx index 0cdfdc0a23..87557ab4bd 100644 --- a/src/components/views/auth/VectorAuthFooter.tsx +++ b/src/components/views/auth/VectorAuthFooter.tsx @@ -44,6 +44,4 @@ const VectorAuthFooter = () => { ); }; -VectorAuthFooter.replaces = 'AuthFooter'; - export default VectorAuthFooter; diff --git a/src/components/views/auth/VectorAuthHeaderLogo.tsx b/src/components/views/auth/VectorAuthHeaderLogo.tsx index deaf9cc232..d44e3e5a7b 100644 --- a/src/components/views/auth/VectorAuthHeaderLogo.tsx +++ b/src/components/views/auth/VectorAuthHeaderLogo.tsx @@ -19,9 +19,7 @@ import React from 'react'; import SdkConfig from 'matrix-react-sdk/src/SdkConfig'; export default class VectorAuthHeaderLogo extends React.PureComponent { - static replaces = 'AuthHeaderLogo'; - - render() { + public render() { const brandingConfig = SdkConfig.getObject("branding"); const logoUrl = brandingConfig?.get("auth_header_logo_url") ?? "themes/element/img/logos/element-logo.svg"; diff --git a/src/components/views/auth/VectorAuthPage.tsx b/src/components/views/auth/VectorAuthPage.tsx index d37739a032..d2e6d9f8db 100644 --- a/src/components/views/auth/VectorAuthPage.tsx +++ b/src/components/views/auth/VectorAuthPage.tsx @@ -15,16 +15,15 @@ limitations under the License. */ import React, { CSSProperties } from 'react'; -import * as sdk from 'matrix-react-sdk/src/index'; import SdkConfig from 'matrix-react-sdk/src/SdkConfig'; -export default class VectorAuthPage extends React.PureComponent { - static replaces = 'AuthPage'; +import VectorAuthFooter from "./VectorAuthFooter"; - static welcomeBackgroundUrl; +export default class VectorAuthPage extends React.PureComponent { + private static welcomeBackgroundUrl; // cache the url as a static to prevent it changing without refreshing - static getWelcomeBackgroundUrl() { + private static getWelcomeBackgroundUrl() { if (VectorAuthPage.welcomeBackgroundUrl) return VectorAuthPage.welcomeBackgroundUrl; const brandingConfig = SdkConfig.getObject("branding"); @@ -43,9 +42,7 @@ export default class VectorAuthPage extends React.PureComponent { return VectorAuthPage.welcomeBackgroundUrl; } - render() { - const AuthFooter = sdk.getComponent('auth.AuthFooter'); - + public render() { const pageStyle = { background: `center/cover fixed url(${VectorAuthPage.getWelcomeBackgroundUrl()})`, }; @@ -80,7 +77,7 @@ export default class VectorAuthPage extends React.PureComponent { { this.props.children } </div> </div> - <AuthFooter /> + <VectorAuthFooter /> </div> ); } diff --git a/src/header b/src/header deleted file mode 100644 index e80658c103..0000000000 --- a/src/header +++ /dev/null @@ -1,15 +0,0 @@ -/* -Copyright 2018 New Vector Ltd - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index 24cdd0fc3d..aef27979d6 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -26,7 +26,7 @@ "Go to element.io": "Go to element.io", "Failed to start": "Failed to start", "Welcome to Element": "Welcome to Element", - "Decentralised, encrypted chat & collaboration powered by [matrix]": "Decentralised, encrypted chat & collaboration powered by [matrix]", + "Decentralised, encrypted chat & collaboration powered by $matrixLogo": "Decentralised, encrypted chat & collaboration powered by $matrixLogo", "Sign In": "Sign In", "Create Account": "Create Account", "Explore rooms": "Explore rooms" diff --git a/src/vector/app.tsx b/src/vector/app.tsx index 7a3abc0c17..1c38a2c84a 100644 --- a/src/vector/app.tsx +++ b/src/vector/app.tsx @@ -18,8 +18,10 @@ See the License for the specific language governing permissions and limitations under the License. */ +// To ensure we load the browser-request version +import "matrix-js-sdk"; // eslint-disable-line no-restricted-imports + import React from 'react'; -import * as sdk from 'matrix-react-sdk/src/index'; import PlatformPeg from 'matrix-react-sdk/src/PlatformPeg'; import { _td, newTranslatableError } from 'matrix-react-sdk/src/languageHandler'; import AutoDiscoveryUtils from 'matrix-react-sdk/src/utils/AutoDiscoveryUtils'; @@ -30,6 +32,7 @@ import { IConfigOptions } from "matrix-react-sdk/src/IConfigOptions"; import { logger } from "matrix-js-sdk/src/logger"; import { createClient } from "matrix-js-sdk/src/matrix"; import { SnakedObject } from "matrix-react-sdk/src/utils/SnakedObject"; +import MatrixChat from "matrix-react-sdk/src/components/structures/MatrixChat"; import { parseQs } from './url_utils'; import VectorBasePlatform from "./platform/VectorBasePlatform"; @@ -133,7 +136,6 @@ export async function loadApp(fragParams: {}) { const defaultDeviceName = snakedConfig.get("default_device_display_name") ?? platform.getDefaultDeviceDisplayName(); - const MatrixChat = sdk.getComponent('structures.MatrixChat'); return <MatrixChat onNewScreen={onNewScreen} makeRegistrationUrl={makeRegistrationUrl} @@ -147,7 +149,7 @@ export async function loadApp(fragParams: {}) { />; } -async function verifyServerConfig() { +async function verifyServerConfig(): Promise<IConfigOptions> { let validatedConfig; try { logger.log("Verifying homeserver configuration"); diff --git a/src/vector/index.ts b/src/vector/index.ts index 87388799c3..e27129d9aa 100644 --- a/src/vector/index.ts +++ b/src/vector/index.ts @@ -110,7 +110,6 @@ async function start() { preparePlatform, loadOlm, loadConfig, - loadSkin, loadLanguage, loadTheme, loadApp, @@ -160,10 +159,9 @@ async function start() { const loadLanguagePromise = loadLanguage(); // as quickly as we possibly can, set a default theme... const loadThemePromise = loadTheme(); - const loadSkinPromise = loadSkin(); // await things settling so that any errors we have to render have features like i18n running - await settled(loadSkinPromise, loadThemePromise, loadLanguagePromise); + await settled(loadThemePromise, loadLanguagePromise); let acceptBrowser = supportedBrowser; if (!acceptBrowser && window.localStorage) { @@ -211,7 +209,6 @@ async function start() { // assert things started successfully // ################################## await loadOlmPromise; - await loadSkinPromise; await loadThemePromise; await loadLanguagePromise; diff --git a/src/vector/init.tsx b/src/vector/init.tsx index e810d6c826..0e43700ae9 100644 --- a/src/vector/init.tsx +++ b/src/vector/init.tsx @@ -127,27 +127,6 @@ export async function loadLanguage() { } } -export async function loadSkin() { - // Ensure the skin is the very first thing to load for the react-sdk. We don't even want to reference - // the SDK until we have to in imports. - logger.log("Loading skin..."); - // load these async so that its code is not executed immediately and we can catch any exceptions - const [sdk, skin] = await Promise.all([ - import( - /* webpackChunkName: "matrix-react-sdk" */ - /* webpackPreload: true */ - "matrix-react-sdk"), - import( - /* webpackChunkName: "element-web-component-index" */ - /* webpackPreload: true */ - // eslint-disable-next-line @typescript-eslint/ban-ts-comment - // @ts-ignore - this module is generated so may fail lint - "../component-index"), - ]); - sdk.loadSkin(skin); - logger.log("Skin loaded!"); -} - export async function loadTheme() { setTheme(); } diff --git a/test/app-tests/joining-test.tsx b/test/app-tests/joining-test.tsx index 1ea411fec1..618cb10348 100644 --- a/test/app-tests/joining-test.tsx +++ b/test/app-tests/joining-test.tsx @@ -18,9 +18,7 @@ limitations under the License. import PlatformPeg from 'matrix-react-sdk/src/PlatformPeg'; import WebPlatform from '../../src/vector/platform/WebPlatform'; -import * as sdk from "matrix-react-sdk/src/index"; import * as jssdk from "matrix-js-sdk/src/matrix"; -import "../skin-sdk"; import "../jest-mocks"; import React from "react"; import ReactDOM from "react-dom"; @@ -28,15 +26,12 @@ import ReactTestUtils from "react-dom/test-utils"; import {makeType} from "matrix-react-sdk/src/utils/TypeUtils"; import {ValidatedServerConfig} from "matrix-react-sdk/src/utils/AutoDiscoveryUtils"; import {sleep} from "../test-utils"; -import * as test_utils from "../test-utils"; import MockHttpBackend from "matrix-mock-request"; import "fake-indexeddb/auto"; import { RoomView as RoomViewClass } from 'matrix-react-sdk/src/components/structures/RoomView'; - - -const MatrixChat = sdk.getComponent('structures.MatrixChat'); -const RoomDirectory = sdk.getComponent('structures.RoomDirectory'); -const RoomPreviewBar = sdk.getComponent('rooms.RoomPreviewBar'); +import MatrixChat from "matrix-react-sdk/src/components/structures/MatrixChat"; +import RoomDirectory from "matrix-react-sdk/src/components/structures/RoomDirectory"; +import RoomPreviewBar from "matrix-react-sdk/src/components/views/rooms/RoomPreviewBar"; const HS_URL='http://localhost'; const IS_URL='http://localhost'; diff --git a/test/app-tests/loading-test.tsx b/test/app-tests/loading-test.tsx index 068164dcee..ccdcaccdda 100644 --- a/test/app-tests/loading-test.tsx +++ b/test/app-tests/loading-test.tsx @@ -19,16 +19,14 @@ limitations under the License. import PlatformPeg from 'matrix-react-sdk/src/PlatformPeg'; import WebPlatform from '../../src/vector/platform/WebPlatform'; -import '../skin-sdk'; import "../jest-mocks"; import React from 'react'; import ReactDOM from 'react-dom'; import ReactTestUtils from 'react-dom/test-utils'; import MatrixReactTestUtils from 'matrix-react-test-utils'; import * as jssdk from 'matrix-js-sdk/src/matrix'; -import * as sdk from 'matrix-react-sdk/src/index'; import {MatrixClientPeg} from 'matrix-react-sdk/src/MatrixClientPeg'; -import {Views} from 'matrix-react-sdk/src/components/structures/MatrixChat'; +import MatrixChat, {Views} from 'matrix-react-sdk/src/components/structures/MatrixChat'; import dis from 'matrix-react-sdk/src/dispatcher/dispatcher'; import * as test_utils from '../test-utils'; import MockHttpBackend from 'matrix-mock-request'; @@ -41,6 +39,8 @@ import {cleanLocalstorage} from "../test-utils"; import {IndexedDBCryptoStore} from "matrix-js-sdk/src/crypto/store/indexeddb-crypto-store"; import { RoomView as RoomViewClass } from 'matrix-react-sdk/src/components/structures/RoomView'; import LoginComponent from 'matrix-react-sdk/src/components/structures/auth/Login'; +import WelcomeComponent from "matrix-react-sdk/src/components/views/auth/Welcome"; +import EmbeddedPage from "matrix-react-sdk/src/components/structures/EmbeddedPage"; const DEFAULT_HS_URL='http://my_server'; const DEFAULT_IS_URL='http://my_is'; @@ -124,7 +124,6 @@ describe('loading:', function() { }; } - const MatrixChat = sdk.getComponent('structures.MatrixChat'); const fragParts = parseQsFromFragment(windowLocation); const config = Object.assign({ @@ -269,7 +268,7 @@ describe('loading:', function() { return awaitLoginComponent(matrixChat).then(() => { // we expect a single <Login> component ReactTestUtils.findRenderedComponentWithType( - matrixChat, sdk.getComponent('structures.auth.Login')); + matrixChat, LoginComponent); // the only outstanding request should be a GET /login // (in particular there should be no /register request for @@ -290,7 +289,7 @@ describe('loading:', function() { }).then(() => { // once the sync completes, we should have a room view ReactTestUtils.findRenderedComponentWithType( - matrixChat, sdk.getComponent('structures.EmbeddedPage')); + matrixChat, EmbeddedPage); expect(windowLocation.hash).toEqual("#/home"); }); }); @@ -343,7 +342,7 @@ describe('loading:', function() { // once the sync completes, we should have a home page httpBackend.verifyNoOutstandingExpectation(); ReactTestUtils.findRenderedComponentWithType( - matrixChat, sdk.getComponent('structures.EmbeddedPage')); + matrixChat, EmbeddedPage); expect(windowLocation.hash).toEqual("#/home"); }); }); @@ -384,7 +383,7 @@ describe('loading:', function() { // we expect a single <Login> component ReactTestUtils.findRenderedComponentWithType( - matrixChat, sdk.getComponent('structures.auth.Login'), + matrixChat, LoginComponent, ); // the only outstanding request should be a GET /login @@ -413,7 +412,7 @@ describe('loading:', function() { // we should see a home page, even though we previously had // a stored mx_last_room_id ReactTestUtils.findRenderedComponentWithType( - matrixChat, sdk.getComponent('structures.EmbeddedPage')); + matrixChat, EmbeddedPage); expect(windowLocation.hash).toEqual("#/home"); }); }); @@ -447,7 +446,7 @@ describe('loading:', function() { // once the sync completes, we should have a welcome page httpBackend.verifyNoOutstandingExpectation(); ReactTestUtils.findRenderedComponentWithType( - matrixChat, sdk.getComponent('auth.Welcome')); + matrixChat, WelcomeComponent); expect(windowLocation.hash).toEqual("#/welcome"); }); }); @@ -480,7 +479,7 @@ describe('loading:', function() { // once the sync completes, we should have a welcome page httpBackend.verifyNoOutstandingExpectation(); ReactTestUtils.findRenderedComponentWithType( - matrixChat, sdk.getComponent('auth.Welcome')); + matrixChat, WelcomeComponent); expect(windowLocation.hash).toEqual("#/welcome"); expect(MatrixClientPeg.get().baseUrl).toEqual(DEFAULT_HS_URL); expect(MatrixClientPeg.get().idBaseUrl).toEqual(DEFAULT_IS_URL); @@ -539,7 +538,7 @@ describe('loading:', function() { }).then(() => { // once the sync completes, we should have a home page ReactTestUtils.findRenderedComponentWithType( - matrixChat, sdk.getComponent('structures.EmbeddedPage')); + matrixChat, EmbeddedPage); // we simulate a click on the 'login' button by firing off // the relevant dispatch. @@ -561,7 +560,7 @@ describe('loading:', function() { // we expect a single <Login> component ReactTestUtils.findRenderedComponentWithType( - matrixChat, sdk.getComponent('structures.auth.Login'), + matrixChat, LoginComponent, ); }); @@ -569,7 +568,7 @@ describe('loading:', function() { // ILAG renders this obsolete. I think. it('should allow us to return to the app', function() { const login = ReactTestUtils.findRenderedComponentWithType( - matrixChat, sdk.getComponent('structures.auth.Login') + matrixChat, LoginComponent ); const linkText = 'Return to app'; @@ -586,7 +585,7 @@ describe('loading:', function() { return sleep(1).then(() => { // we should be straight back into the home page ReactTestUtils.findRenderedComponentWithType( - matrixChat, sdk.getComponent('structures.EmbeddedPage')); + matrixChat, EmbeddedPage); }); }); */ @@ -733,19 +732,19 @@ function awaitRoomView(matrixChat, retryLimit?, retryCount?) { function awaitLoginComponent(matrixChat, attempts?) { return MatrixReactTestUtils.waitForRenderedComponentWithType( - matrixChat, sdk.getComponent('structures.auth.Login'), attempts, + matrixChat, LoginComponent, attempts, ); } function awaitWelcomeComponent(matrixChat, attempts?) { return MatrixReactTestUtils.waitForRenderedComponentWithType( - matrixChat, sdk.getComponent('auth.Welcome'), attempts, + matrixChat, WelcomeComponent, attempts, ); } function moveFromWelcomeToLogin(matrixChat) { ReactTestUtils.findRenderedComponentWithType( - matrixChat, sdk.getComponent('auth.Welcome')); + matrixChat, WelcomeComponent); dis.dispatch({ action: 'start_login' }); return awaitLoginComponent(matrixChat); } diff --git a/test/skin-sdk.js b/test/skin-sdk.js deleted file mode 100644 index eaeff52043..0000000000 --- a/test/skin-sdk.js +++ /dev/null @@ -1,9 +0,0 @@ -/* - * skin-sdk.js - * - * Skins the react-sdk with the vector components - */ - -import * as sdk from "matrix-react-sdk"; -import * as skin from "../src/component-index"; -sdk.loadSkin(skin); diff --git a/tsconfig.json b/tsconfig.json index b0a58196f5..e48ae0f7b9 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,7 +1,7 @@ { "compilerOptions": { - "experimentalDecorators": true, - "emitDecoratorMetadata": true, + "experimentalDecorators": false, + "emitDecoratorMetadata": false, "resolveJsonModule": true, "esModuleInterop": true, "module": "commonjs", diff --git a/webpack.config.js b/webpack.config.js index 0fd747a61d..13e969eca4 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -49,14 +49,24 @@ try { } catch (e) { // ignore - not important } -const moduleReplacementPlugins = Object.entries(fileOverrides).map(([oldPath, newPath]) => { - return new webpack.NormalModuleReplacementPlugin( - // because the input is effectively defined by the person running the build, we don't - // need to do anything special to protect against regex overrunning, etc. - new RegExp(oldPath.replace(/\//g, '[\\/\\\\]').replace(/\./g, '\\.')), - path.resolve(__dirname, newPath), - ); -}); + +function parseOverridesToReplacements(overrides) { + return Object.entries(overrides).map(([oldPath, newPath]) => { + return new webpack.NormalModuleReplacementPlugin( + // because the input is effectively defined by the person running the build, we don't + // need to do anything special to protect against regex overrunning, etc. + new RegExp(oldPath.replace(/\//g, '[\\/\\\\]').replace(/\./g, '\\.')), + path.resolve(__dirname, newPath), + ); + }); +} + +const moduleReplacementPlugins = [ + ...parseOverridesToReplacements(require('./components.json')), + + // Allow customisations to override the default components too + ...parseOverridesToReplacements(fileOverrides), +]; module.exports = (env, argv) => { // Establish settings based on the environment and args. diff --git a/yarn.lock b/yarn.lock index dc1d04d87d..f84eac0800 100644 --- a/yarn.lock +++ b/yarn.lock @@ -116,7 +116,7 @@ browserslist "^4.17.5" semver "^6.3.0" -"@babel/helper-create-class-features-plugin@^7.16.10", "@babel/helper-create-class-features-plugin@^7.16.7", "@babel/helper-create-class-features-plugin@^7.17.1": +"@babel/helper-create-class-features-plugin@^7.16.10", "@babel/helper-create-class-features-plugin@^7.16.7": version "7.17.1" resolved "https://registry.yarnpkg.com/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.17.1.tgz#9699f14a88833a7e055ce57dcd3ffdcd25186b21" integrity sha512-JBdSr/LtyYIno/pNnJ75lBcqc3Z1XXujzPanHqjvvrhOA+DTceTFuJi8XjmWTZh4r3fsdfqaCMN0iZemdkxZHQ== @@ -354,17 +354,6 @@ "@babel/helper-plugin-utils" "^7.16.7" "@babel/plugin-syntax-class-static-block" "^7.14.5" -"@babel/plugin-proposal-decorators@^7.12.12": - version "7.17.2" - resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-decorators/-/plugin-proposal-decorators-7.17.2.tgz#c36372ddfe0360cac1ee331a238310bddca11493" - integrity sha512-WH8Z95CwTq/W8rFbMqb9p3hicpt4RX4f0K659ax2VHxgOyT6qQmUaEVEjIh4WR9Eh9NymkVn5vwsrE68fAQNUw== - dependencies: - "@babel/helper-create-class-features-plugin" "^7.17.1" - "@babel/helper-plugin-utils" "^7.16.7" - "@babel/helper-replace-supers" "^7.16.7" - "@babel/plugin-syntax-decorators" "^7.17.0" - charcodes "^0.2.0" - "@babel/plugin-proposal-dynamic-import@^7.16.7": version "7.16.7" resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-dynamic-import/-/plugin-proposal-dynamic-import-7.16.7.tgz#c19c897eaa46b27634a00fee9fb7d829158704b2" @@ -503,13 +492,6 @@ dependencies: "@babel/helper-plugin-utils" "^7.14.5" -"@babel/plugin-syntax-decorators@^7.17.0": - version "7.17.0" - resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-decorators/-/plugin-syntax-decorators-7.17.0.tgz#a2be3b2c9fe7d78bd4994e790896bc411e2f166d" - integrity sha512-qWe85yCXsvDEluNP0OyeQjH63DlhAR3W7K9BxxU1MvbDb48tgBG+Ao6IJJ6smPDrrVzSQZrbF6donpkFBMcs3A== - dependencies: - "@babel/helper-plugin-utils" "^7.16.7" - "@babel/plugin-syntax-dynamic-import@^7.8.3": version "7.8.3" resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-dynamic-import/-/plugin-syntax-dynamic-import-7.8.3.tgz#62bf98b2da3cd21d626154fc96ee5b3cb68eacb3" @@ -3397,11 +3379,6 @@ character-reference-invalid@^1.0.0: resolved "https://registry.yarnpkg.com/character-reference-invalid/-/character-reference-invalid-1.1.4.tgz#083329cda0eae272ab3dbbf37e9a382c13af1560" integrity sha512-mKKUkUbhPpQlCOfIuZkvSEgktjPFIsZKRRbC6KWVEMvlzblj3i3asQv5ODsrwt0N3pHAEvjP8KTQPHkp0+6jOg== -charcodes@^0.2.0: - version "0.2.0" - resolved "https://registry.yarnpkg.com/charcodes/-/charcodes-0.2.0.tgz#5208d327e6cc05f99eb80ffc814707572d1f14e4" - integrity sha512-Y4kiDb+AM4Ecy58YkuZrrSRJBDQdQ2L+NyS1vHHFtNtUjgutcZfx3yp1dAONI/oPaPmyGfCLx5CxL+zauIMyKQ== - cheerio-select@^1.5.0: version "1.5.0" resolved "https://registry.yarnpkg.com/cheerio-select/-/cheerio-select-1.5.0.tgz#faf3daeb31b17c5e1a9dabcee288aaf8aafa5823"