Matrix/element-web
Matrix/element-web
1
0
Fork 0
mirror of https://github.com/vector-im/element-web.git synced 2024-09-10 07:05:14 +00:00
Code Issues Projects Releases Packages Wiki Activity

Merge branch 'travis/remove-skinning' into develop

Browse source
This commit is contained in:
Travis Ralston 2022-04-05 11:27:43 -06:00
commit ecf1c41f7c
29 changed files with 74 additions and 411 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
.eslintignore
View file

@ -1,2 +1,3 @@
src/vector/modernizr.js
# Legacy skinning file that some people might still have
src/component-index.js

1
.gitignore vendored
View file

@ -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

7
README.md
View file

@ -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.

1
babel.config.js
View file

@ -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",

5
components.json Normal file
View file

@ -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"
}

3
docs/app-load.md
View file

@ -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)

6
docs/customisations.md
View file

@ -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

68
docs/skinning thoughts.md
View file

@ -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?)

2
docs/theming.md
View file

@ -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:

10
package.json
View file

@ -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",

3
res/welcome.html
View file

@ -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 &amp; 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 &amp; collaboration powered by $matrixLogo")</h4>
<div class="mx_ButtonGroup">
<div class="mx_ButtonRow">
<a href="#/login" class="mx_ButtonParent mx_ButtonSignIn mx_Button_iconSignIn">

153
res/welcome/images/matrix.svg
View file

@ -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>
Side by side

Before

Width:  |  Height:  |  Size: 16 KiB

1
scripts/docker-link-repos.sh
View file

@ -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"

8
scripts/fetch-develop.deps.sh
View file

@ -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

34
src/components/structures/VectorEmbeddedPage.tsx
View file

@ -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;
}
}

2
src/components/views/auth/VectorAuthFooter.tsx
View file

@ -44,6 +44,4 @@ const VectorAuthFooter = () => {
);
};
VectorAuthFooter.replaces = 'AuthFooter';
export default VectorAuthFooter;

4
src/components/views/auth/VectorAuthHeaderLogo.tsx
View file

@ -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";

15
src/components/views/auth/VectorAuthPage.tsx
View file

@ -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>
);
}

15
src/header
View file

@ -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.
*/

2
src/i18n/strings/en_EN.json
View file

@ -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 &amp; collaboration powered by [matrix]": "Decentralised, encrypted chat &amp; collaboration powered by [matrix]",
"Decentralised, encrypted chat &amp; collaboration powered by $matrixLogo": "Decentralised, encrypted chat &amp; collaboration powered by $matrixLogo",
"Sign In": "Sign In",
"Create Account": "Create Account",
"Explore rooms": "Explore rooms"

8
src/vector/app.tsx
View file

@ -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");

5
src/vector/index.ts
View file

@ -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;

21
src/vector/init.tsx
View file

@ -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();
}

11
test/app-tests/joining-test.tsx
View file

@ -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';

35
test/app-tests/loading-test.tsx
View file

@ -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);
}

9
test/skin-sdk.js
View file

@ -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);

4
tsconfig.json
View file

@ -1,7 +1,7 @@
{
"compilerOptions": {
"experimentalDecorators": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": false,
"emitDecoratorMetadata": false,
"resolveJsonModule": true,
"esModuleInterop": true,
"module": "commonjs",

26
webpack.config.js
View file

@ -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.

25
yarn.lock
View file

@ -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"