Skip to content
This repository was archived by the owner on May 18, 2025. It is now read-only.

Commit 4a41839

Browse files
fpierfedfpierfed
committed
Merge remote-tracking branch 'fpierfed/develop' into testing_merge
2 parents 074b4dd + 9c8aa0d commit 4a41839

File tree

707 files changed

+6719
-6165
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

707 files changed

+6719
-6165
lines changed

‎.eslintrc.js

Lines changed: 45 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
11
module.exports = {
2-
extends: ["matrix-org", "matrix-org/react-legacy"],
3-
parser: "babel-eslint",
4-
2+
plugins: ["matrix-org"],
3+
extends: [
4+
"plugin:matrix-org/babel",
5+
"plugin:matrix-org/react",
6+
],
57
env: {
68
browser: true,
79
node: true,
@@ -15,35 +17,60 @@ module.exports = {
1517
"prefer-promise-reject-errors": "off",
1618
"no-async-promise-executor": "off",
1719
"quotes": "off",
18-
},
20+
"no-extra-boolean-cast": "off",
21+
22+
// Bind or arrow functions in props causes performance issues (but we
23+
// currently use them in some places).
24+
// It's disabled here, but we should using it sparingly.
25+
"react/jsx-no-bind": "off",
26+
"react/jsx-key": ["error"],
1927

28+
"no-restricted-properties": [
29+
"error",
30+
...buildRestrictedPropertiesOptions(
31+
["window.innerHeight", "window.innerWidth", "window.visualViewport"],
32+
"Use UIStore to access window dimensions instead.",
33+
),
34+
...buildRestrictedPropertiesOptions(
35+
["*.mxcUrlToHttp", "*.getHttpUriForMxc"],
36+
"Use Media helper instead to centralise access for customisation.",
37+
),
38+
],
39+
},
2040
overrides: [{
21-
"files": ["src/**/*.{ts,tsx}", "test/**/*.{ts,tsx}"],
22-
"extends": ["matrix-org/ts"],
23-
"rules": {
41+
files: [
42+
"src/**/*.{ts,tsx}",
43+
"test/**/*.{ts,tsx}",
44+
],
45+
extends: [
46+
"plugin:matrix-org/typescript",
47+
"plugin:matrix-org/react",
48+
],
49+
rules: {
50+
// Things we do that break the ideal style
51+
"prefer-promise-reject-errors": "off",
52+
"quotes": "off",
53+
"no-extra-boolean-cast": "off",
54+
55+
// Remove Babel things manually due to override limitations
56+
"@babel/no-invalid-this": ["off"],
57+
2458
// We're okay being explicit at the moment
2559
"@typescript-eslint/no-empty-interface": "off",
2660
// We disable this while we're transitioning
2761
"@typescript-eslint/no-explicit-any": "off",
2862
// We'd rather not do this but we do
2963
"@typescript-eslint/ban-ts-comment": "off",
30-
31-
"quotes": "off",
32-
"no-extra-boolean-cast": "off",
33-
"no-restricted-properties": [
34-
"error",
35-
...buildRestrictedPropertiesOptions(
36-
["window.innerHeight", "window.innerWidth", "window.visualViewport"],
37-
"Use UIStore to access window dimensions instead",
38-
),
39-
],
4064
},
4165
}],
4266
};
4367

4468
function buildRestrictedPropertiesOptions(properties, message) {
4569
return properties.map(prop => {
46-
const [object, property] = prop.split(".");
70+
let [object, property] = prop.split(".");
71+
if (object === "*") {
72+
object = undefined;
73+
}
4774
return {
4875
object,
4976
property,

‎.flowconfig

Lines changed: 0 additions & 6 deletions
This file was deleted.

‎babel.config.js

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,6 @@ module.exports = {
1010
],
1111
}],
1212
"@babel/preset-typescript",
13-
"@babel/preset-flow",
1413
"@babel/preset-react",
1514
],
1615
"plugins": [
@@ -19,7 +18,6 @@ module.exports = {
1918
"@babel/plugin-proposal-numeric-separator",
2019
"@babel/plugin-proposal-class-properties",
2120
"@babel/plugin-proposal-object-rest-spread",
22-
"@babel/plugin-transform-flow-comments",
2321
"@babel/plugin-syntax-dynamic-import",
2422
"@babel/plugin-transform-runtime",
2523
],

‎package.json

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -104,16 +104,16 @@
104104
"devDependencies": {
105105
"@babel/cli": "^7.12.10",
106106
"@babel/core": "^7.12.10",
107+
"@babel/eslint-parser": "^7.12.10",
108+
"@babel/eslint-plugin": "^7.12.10",
107109
"@babel/parser": "^7.12.11",
108110
"@babel/plugin-proposal-class-properties": "^7.12.1",
109111
"@babel/plugin-proposal-decorators": "^7.12.12",
110112
"@babel/plugin-proposal-export-default-from": "^7.12.1",
111113
"@babel/plugin-proposal-numeric-separator": "^7.12.7",
112114
"@babel/plugin-proposal-object-rest-spread": "^7.12.1",
113-
"@babel/plugin-transform-flow-comments": "^7.12.1",
114115
"@babel/plugin-transform-runtime": "^7.12.10",
115116
"@babel/preset-env": "^7.12.11",
116-
"@babel/preset-flow": "^7.12.1",
117117
"@babel/preset-react": "^7.12.10",
118118
"@babel/preset-typescript": "^7.12.7",
119119
"@babel/register": "^7.12.10",
@@ -139,18 +139,16 @@
139139
"@types/react-transition-group": "^4.4.0",
140140
"@types/sanitize-html": "^2.3.1",
141141
"@types/zxcvbn": "^4.4.0",
142-
"@typescript-eslint/eslint-plugin": "^4.14.0",
143-
"@typescript-eslint/parser": "^4.14.0",
142+
"@typescript-eslint/eslint-plugin": "^4.17.0",
143+
"@typescript-eslint/parser": "^4.17.0",
144144
"@wojtekmaj/enzyme-adapter-react-17": "^0.6.1",
145-
"babel-eslint": "^10.1.0",
146145
"babel-jest": "^26.6.3",
147146
"chokidar": "^3.5.1",
148147
"concurrently": "^5.3.0",
149148
"enzyme": "^3.11.0",
150149
"eslint": "7.18.0",
151-
"eslint-config-matrix-org": "^0.2.0",
152-
"eslint-plugin-babel": "^5.3.1",
153-
"eslint-plugin-flowtype": "^5.2.0",
150+
"eslint-config-google": "^0.14.0",
151+
"eslint-plugin-matrix-org": "github:matrix-org/eslint-plugin-matrix-org#main",
154152
"eslint-plugin-react": "^7.22.0",
155153
"eslint-plugin-react-hooks": "^4.2.0",
156154
"glob": "^7.1.6",

‎res/css/_components.scss

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,11 @@
3737
@import "./structures/_ViewSource.scss";
3838
@import "./structures/auth/_CompleteSecurity.scss";
3939
@import "./structures/auth/_Login.scss";
40+
@import "./views/audio_messages/_AudioPlayer.scss";
41+
@import "./views/audio_messages/_PlayPauseButton.scss";
42+
@import "./views/audio_messages/_PlaybackContainer.scss";
43+
@import "./views/audio_messages/_SeekBar.scss";
44+
@import "./views/audio_messages/_Waveform.scss";
4045
@import "./views/auth/_AuthBody.scss";
4146
@import "./views/auth/_AuthButtons.scss";
4247
@import "./views/auth/_AuthFooter.scss";
@@ -165,6 +170,7 @@
165170
@import "./views/messages/_MTextBody.scss";
166171
@import "./views/messages/_MVideoBody.scss";
167172
@import "./views/messages/_MVoiceMessageBody.scss";
173+
@import "./views/messages/_MediaBody.scss";
168174
@import "./views/messages/_MessageActionBar.scss";
169175
@import "./views/messages/_MessageTimestamp.scss";
170176
@import "./views/messages/_MjolnirBody.scss";
@@ -253,9 +259,6 @@
253259
@import "./views/toasts/_AnalyticsToast.scss";
254260
@import "./views/toasts/_NonUrgentEchoFailureToast.scss";
255261
@import "./views/verification/_VerificationShowSas.scss";
256-
@import "./views/voice_messages/_PlayPauseButton.scss";
257-
@import "./views/voice_messages/_PlaybackContainer.scss";
258-
@import "./views/voice_messages/_Waveform.scss";
259262
@import "./views/voip/_CallContainer.scss";
260263
@import "./views/voip/_CallView.scss";
261264
@import "./views/voip/_CallViewForRoom.scss";

‎res/css/structures/_GroupView.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -323,7 +323,7 @@ limitations under the License.
323323
}
324324

325325
.mx_GroupView_featuredThing .mx_BaseAvatar {
326-
/* To prevent misalignment with mx_TintableSvg (in addButton) */
326+
/* To prevent misalignment with img (in addButton) */
327327
vertical-align: initial;
328328
}
329329

‎res/css/structures/_RoomStatusBar.scss

Lines changed: 5 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -112,7 +112,7 @@ limitations under the License.
112112

113113
.mx_AccessibleButton {
114114
padding: 5px 10px;
115-
padding-left: 28px; // 16px for the icon, 2px margin to text, 10px regular padding
115+
padding-left: 30px; // 18px for the icon, 2px margin to text, 10px regular padding
116116
display: inline-block;
117117
position: relative;
118118

@@ -128,23 +128,21 @@ limitations under the License.
128128
mask-repeat: no-repeat;
129129
mask-position: center;
130130
mask-size: contain;
131+
width: 18px;
132+
height: 18px;
133+
top: 50%; // text sizes are dynamic
134+
transform: translateY(-50%);
131135
}
132136

133137
&.mx_RoomStatusBar_unsentCancelAllBtn::before {
134138
mask-image: url('$(res)/img/element-icons/trashcan.svg');
135-
width: 12px;
136-
height: 16px;
137-
top: calc(50% - 8px); // text sizes are dynamic
138139
}
139140

140141
&.mx_RoomStatusBar_unsentResendAllBtn {
141142
padding-left: 34px; // 28px from above, but +6px to account for the wider icon
142143

143144
&::before {
144145
mask-image: url('$(res)/img/element-icons/retry.svg');
145-
width: 18px;
146-
height: 18px;
147-
top: calc(50% - 9px); // text sizes are dynamic
148146
}
149147
}
150148
}

‎res/css/structures/_ToastContainer.scss

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -140,6 +140,10 @@ limitations under the License.
140140
min-width: 96px;
141141
box-sizing: border-box;
142142
}
143+
144+
.mx_AccessibleButton + .mx_AccessibleButton {
145+
margin-left: 5px;
146+
}
143147
}
144148

145149
.mx_Toast_description {

‎res/css/views/audio_messages/_AudioPlayer.scss

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
/*
2+
Copyright 2021 The Matrix.org Foundation C.I.C.
3+
4+
Licensed under the Apache License, Version 2.0 (the "License");
5+
you may not use this file except in compliance with the License.
6+
You may obtain a copy of the License at
7+
8+
http://www.apache.org/licenses/LICENSE-2.0
9+
10+
Unless required by applicable law or agreed to in writing, software
11+
distributed under the License is distributed on an "AS IS" BASIS,
12+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
See the License for the specific language governing permissions and
14+
limitations under the License.
15+
*/
16+
17+
.mx_AudioPlayer_container {
18+
padding: 16px 12px 12px 12px;
19+
max-width: 267px; // use max to make the control fit in the files/pinned panels
20+
21+
.mx_AudioPlayer_primaryContainer {
22+
display: flex;
23+
24+
.mx_PlayPauseButton {
25+
margin-right: 8px;
26+
}
27+
28+
.mx_AudioPlayer_mediaInfo {
29+
flex: 1;
30+
overflow: hidden; // makes the ellipsis on the file name work
31+
32+
& > * {
33+
display: block;
34+
}
35+
36+
.mx_AudioPlayer_mediaName {
37+
color: $primary-fg-color;
38+
font-size: $font-15px;
39+
line-height: $font-15px;
40+
text-overflow: ellipsis;
41+
white-space: nowrap;
42+
overflow: hidden;
43+
padding-bottom: 4px; // mimics the line-height differences in the Figma
44+
}
45+
46+
.mx_AudioPlayer_byline {
47+
font-size: $font-12px;
48+
line-height: $font-12px;
49+
}
50+
}
51+
}
52+
53+
.mx_AudioPlayer_seek {
54+
display: flex;
55+
align-items: center;
56+
57+
.mx_SeekBar {
58+
flex: 1;
59+
}
60+
61+
.mx_Clock {
62+
width: $font-42px; // we're not using a monospace font, so fake it
63+
min-width: $font-42px; // for flexbox
64+
padding-left: 4px; // isolate from seek bar
65+
text-align: right;
66+
}
67+
}
68+
}

‎res/css/views/voice_messages/_PlayPauseButton.scss renamed to ‎res/css/views/audio_messages/_PlayPauseButton.scss

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,8 @@ limitations under the License.
1818
position: relative;
1919
width: 32px;
2020
height: 32px;
21+
min-width: 32px; // for when the button is used in a flexbox
22+
min-height: 32px; // for when the button is used in a flexbox
2123
border-radius: 32px;
2224
background-color: $voice-playback-button-bg-color;
2325

0 commit comments

Comments
 (0)