Merge remote-tracking branch 'upstream/develop' into fix/17130/draggable-pip
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
|
@ -1,16 +0,0 @@
|
||||||
# autogenerated file: run scripts/generate-eslint-error-ignore-file to update.
|
|
||||||
|
|
||||||
src/Markdown.js
|
|
||||||
src/NodeAnimator.js
|
|
||||||
src/components/structures/RoomDirectory.js
|
|
||||||
src/components/views/rooms/MemberList.js
|
|
||||||
src/ratelimitedfunc.js
|
|
||||||
src/utils/DMRoomMap.js
|
|
||||||
src/utils/MultiInviter.js
|
|
||||||
test/components/structures/MessagePanel-test.js
|
|
||||||
test/components/views/dialogs/InteractiveAuthDialog-test.js
|
|
||||||
test/mock-clock.js
|
|
||||||
src/component-index.js
|
|
||||||
test/end-to-end-tests/node_modules/
|
|
||||||
test/end-to-end-tests/element/
|
|
||||||
test/end-to-end-tests/synapse/
|
|
63
.eslintrc.js
|
@ -1,7 +1,9 @@
|
||||||
module.exports = {
|
module.exports = {
|
||||||
extends: ["matrix-org", "matrix-org/react-legacy"],
|
plugins: ["matrix-org"],
|
||||||
parser: "babel-eslint",
|
extends: [
|
||||||
|
"plugin:matrix-org/babel",
|
||||||
|
"plugin:matrix-org/react",
|
||||||
|
],
|
||||||
env: {
|
env: {
|
||||||
browser: true,
|
browser: true,
|
||||||
node: true,
|
node: true,
|
||||||
|
@ -15,35 +17,60 @@ module.exports = {
|
||||||
"prefer-promise-reject-errors": "off",
|
"prefer-promise-reject-errors": "off",
|
||||||
"no-async-promise-executor": "off",
|
"no-async-promise-executor": "off",
|
||||||
"quotes": "off",
|
"quotes": "off",
|
||||||
},
|
"no-extra-boolean-cast": "off",
|
||||||
|
|
||||||
|
// Bind or arrow functions in props causes performance issues (but we
|
||||||
|
// currently use them in some places).
|
||||||
|
// It's disabled here, but we should using it sparingly.
|
||||||
|
"react/jsx-no-bind": "off",
|
||||||
|
"react/jsx-key": ["error"],
|
||||||
|
|
||||||
|
"no-restricted-properties": [
|
||||||
|
"error",
|
||||||
|
...buildRestrictedPropertiesOptions(
|
||||||
|
["window.innerHeight", "window.innerWidth", "window.visualViewport"],
|
||||||
|
"Use UIStore to access window dimensions instead.",
|
||||||
|
),
|
||||||
|
...buildRestrictedPropertiesOptions(
|
||||||
|
["*.mxcUrlToHttp", "*.getHttpUriForMxc"],
|
||||||
|
"Use Media helper instead to centralise access for customisation.",
|
||||||
|
),
|
||||||
|
],
|
||||||
|
},
|
||||||
overrides: [{
|
overrides: [{
|
||||||
"files": ["src/**/*.{ts,tsx}", "test/**/*.{ts,tsx}"],
|
files: [
|
||||||
"extends": ["matrix-org/ts"],
|
"src/**/*.{ts,tsx}",
|
||||||
"rules": {
|
"test/**/*.{ts,tsx}",
|
||||||
|
],
|
||||||
|
extends: [
|
||||||
|
"plugin:matrix-org/typescript",
|
||||||
|
"plugin:matrix-org/react",
|
||||||
|
],
|
||||||
|
rules: {
|
||||||
|
// Things we do that break the ideal style
|
||||||
|
"prefer-promise-reject-errors": "off",
|
||||||
|
"quotes": "off",
|
||||||
|
"no-extra-boolean-cast": "off",
|
||||||
|
|
||||||
|
// Remove Babel things manually due to override limitations
|
||||||
|
"@babel/no-invalid-this": ["off"],
|
||||||
|
|
||||||
// We're okay being explicit at the moment
|
// We're okay being explicit at the moment
|
||||||
"@typescript-eslint/no-empty-interface": "off",
|
"@typescript-eslint/no-empty-interface": "off",
|
||||||
// We disable this while we're transitioning
|
// We disable this while we're transitioning
|
||||||
"@typescript-eslint/no-explicit-any": "off",
|
"@typescript-eslint/no-explicit-any": "off",
|
||||||
// We'd rather not do this but we do
|
// We'd rather not do this but we do
|
||||||
"@typescript-eslint/ban-ts-comment": "off",
|
"@typescript-eslint/ban-ts-comment": "off",
|
||||||
|
|
||||||
"quotes": "off",
|
|
||||||
"no-extra-boolean-cast": "off",
|
|
||||||
"no-restricted-properties": [
|
|
||||||
"error",
|
|
||||||
...buildRestrictedPropertiesOptions(
|
|
||||||
["window.innerHeight", "window.innerWidth", "window.visualViewport"],
|
|
||||||
"Use UIStore to access window dimensions instead",
|
|
||||||
),
|
|
||||||
],
|
|
||||||
},
|
},
|
||||||
}],
|
}],
|
||||||
};
|
};
|
||||||
|
|
||||||
function buildRestrictedPropertiesOptions(properties, message) {
|
function buildRestrictedPropertiesOptions(properties, message) {
|
||||||
return properties.map(prop => {
|
return properties.map(prop => {
|
||||||
const [object, property] = prop.split(".");
|
let [object, property] = prop.split(".");
|
||||||
|
if (object === "*") {
|
||||||
|
object = undefined;
|
||||||
|
}
|
||||||
return {
|
return {
|
||||||
object,
|
object,
|
||||||
property,
|
property,
|
||||||
|
|
|
@ -1,6 +0,0 @@
|
||||||
[include]
|
|
||||||
src/**/*.js
|
|
||||||
test/**/*.js
|
|
||||||
|
|
||||||
[ignore]
|
|
||||||
node_modules/
|
|
3
.github/PULL_REQUEST_TEMPLATE.md
vendored
Normal file
|
@ -0,0 +1,3 @@
|
||||||
|
<!-- Please read https://github.com/matrix-org/matrix-js-sdk/blob/develop/CONTRIBUTING.rst before submitting your pull request -->
|
||||||
|
|
||||||
|
<!-- Include a Sign-Off as described in https://github.com/matrix-org/matrix-js-sdk/blob/develop/CONTRIBUTING.rst#sign-off -->
|
7
.github/workflows/develop.yml
vendored
|
@ -11,10 +11,13 @@ jobs:
|
||||||
steps:
|
steps:
|
||||||
- name: Checkout code
|
- name: Checkout code
|
||||||
uses: actions/checkout@v2
|
uses: actions/checkout@v2
|
||||||
- name: End-to-End tests
|
- name: Prepare End-to-End tests
|
||||||
run: ./scripts/ci/end-to-end-tests.sh
|
run: ./scripts/ci/prepare-end-to-end-tests.sh
|
||||||
|
- name: Run End-to-End tests
|
||||||
|
run: ./scripts/ci/run-end-to-end-tests.sh
|
||||||
- name: Archive logs
|
- name: Archive logs
|
||||||
uses: actions/upload-artifact@v2
|
uses: actions/upload-artifact@v2
|
||||||
|
if: ${{ always() }}
|
||||||
with:
|
with:
|
||||||
path: |
|
path: |
|
||||||
test/end-to-end-tests/logs/**/*
|
test/end-to-end-tests/logs/**/*
|
||||||
|
|
301
CHANGELOG.md
|
@ -1,3 +1,304 @@
|
||||||
|
Changes in [3.25.0](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v3.25.0) (2021-07-05)
|
||||||
|
=====================================================================================================
|
||||||
|
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v3.25.0-rc.1...v3.25.0)
|
||||||
|
|
||||||
|
* Remove reminescent references to the tinter
|
||||||
|
[\#6316](https://github.com/matrix-org/matrix-react-sdk/pull/6316)
|
||||||
|
* Update to released version of js-sdk
|
||||||
|
|
||||||
|
Changes in [3.25.0-rc.1](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v3.25.0-rc.1) (2021-06-29)
|
||||||
|
===============================================================================================================
|
||||||
|
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v3.24.0...v3.25.0-rc.1)
|
||||||
|
|
||||||
|
* Update to js-sdk v12.0.1-rc.1
|
||||||
|
* Translations update from Weblate
|
||||||
|
[\#6286](https://github.com/matrix-org/matrix-react-sdk/pull/6286)
|
||||||
|
* Fix back button on user info card after clicking a permalink
|
||||||
|
[\#6277](https://github.com/matrix-org/matrix-react-sdk/pull/6277)
|
||||||
|
* Group ACLs with MELS
|
||||||
|
[\#6280](https://github.com/matrix-org/matrix-react-sdk/pull/6280)
|
||||||
|
* Fix editState not getting passed through
|
||||||
|
[\#6282](https://github.com/matrix-org/matrix-react-sdk/pull/6282)
|
||||||
|
* Migrate message context menu to IconizedContextMenu
|
||||||
|
[\#5671](https://github.com/matrix-org/matrix-react-sdk/pull/5671)
|
||||||
|
* Improve audio recording performance
|
||||||
|
[\#6240](https://github.com/matrix-org/matrix-react-sdk/pull/6240)
|
||||||
|
* Fix multiple timeline panels handling composer and edit events
|
||||||
|
[\#6278](https://github.com/matrix-org/matrix-react-sdk/pull/6278)
|
||||||
|
* Let m.notice messages mark a room as unread
|
||||||
|
[\#6281](https://github.com/matrix-org/matrix-react-sdk/pull/6281)
|
||||||
|
* Removes the override on the Bubble Container
|
||||||
|
[\#5953](https://github.com/matrix-org/matrix-react-sdk/pull/5953)
|
||||||
|
* Fix IRC layout regressions
|
||||||
|
[\#6193](https://github.com/matrix-org/matrix-react-sdk/pull/6193)
|
||||||
|
* Fix trashcan.svg by exporting it with its viewbox
|
||||||
|
[\#6248](https://github.com/matrix-org/matrix-react-sdk/pull/6248)
|
||||||
|
* Fix tiny scrollbar dot on chrome/electron in Forward Dialog
|
||||||
|
[\#6276](https://github.com/matrix-org/matrix-react-sdk/pull/6276)
|
||||||
|
* Upgrade puppeteer to use newer version of Chrome
|
||||||
|
[\#6268](https://github.com/matrix-org/matrix-react-sdk/pull/6268)
|
||||||
|
* Make toast dismiss button less prominent
|
||||||
|
[\#6275](https://github.com/matrix-org/matrix-react-sdk/pull/6275)
|
||||||
|
* Encrypt the voice message file if needed
|
||||||
|
[\#6269](https://github.com/matrix-org/matrix-react-sdk/pull/6269)
|
||||||
|
* Fix hyper-precise presence
|
||||||
|
[\#6270](https://github.com/matrix-org/matrix-react-sdk/pull/6270)
|
||||||
|
* Fix issues around private spaces, including previewable
|
||||||
|
[\#6265](https://github.com/matrix-org/matrix-react-sdk/pull/6265)
|
||||||
|
* Make _pinned messages_ in `m.room.pinned_events` event clickable
|
||||||
|
[\#6257](https://github.com/matrix-org/matrix-react-sdk/pull/6257)
|
||||||
|
* Fix space avatar management layout being broken
|
||||||
|
[\#6266](https://github.com/matrix-org/matrix-react-sdk/pull/6266)
|
||||||
|
* Convert EntityTile, MemberTile and PresenceLabel to TS
|
||||||
|
[\#6251](https://github.com/matrix-org/matrix-react-sdk/pull/6251)
|
||||||
|
* Fix UserInfo not working when rendered without a room
|
||||||
|
[\#6260](https://github.com/matrix-org/matrix-react-sdk/pull/6260)
|
||||||
|
* Update membership reason handling, including leave reason displaying
|
||||||
|
[\#6253](https://github.com/matrix-org/matrix-react-sdk/pull/6253)
|
||||||
|
* Consolidate types with js-sdk changes
|
||||||
|
[\#6220](https://github.com/matrix-org/matrix-react-sdk/pull/6220)
|
||||||
|
* Fix edit history modal
|
||||||
|
[\#6258](https://github.com/matrix-org/matrix-react-sdk/pull/6258)
|
||||||
|
* Convert MemberList to TS
|
||||||
|
[\#6249](https://github.com/matrix-org/matrix-react-sdk/pull/6249)
|
||||||
|
* Fix two PRs duplicating the css attribute
|
||||||
|
[\#6259](https://github.com/matrix-org/matrix-react-sdk/pull/6259)
|
||||||
|
* Improve invite error messages in InviteDialog for room invites
|
||||||
|
[\#6201](https://github.com/matrix-org/matrix-react-sdk/pull/6201)
|
||||||
|
* Fix invite dialog being cut off when it has limited results
|
||||||
|
[\#6256](https://github.com/matrix-org/matrix-react-sdk/pull/6256)
|
||||||
|
* Fix pinning event in a room which hasn't had events pinned in before
|
||||||
|
[\#6255](https://github.com/matrix-org/matrix-react-sdk/pull/6255)
|
||||||
|
* Allow modal widget buttons to be disabled when the modal opens
|
||||||
|
[\#6178](https://github.com/matrix-org/matrix-react-sdk/pull/6178)
|
||||||
|
* Decrease e2e shield fill mask size so that it doesn't overlap
|
||||||
|
[\#6250](https://github.com/matrix-org/matrix-react-sdk/pull/6250)
|
||||||
|
* Dial Pad UI bug fixes
|
||||||
|
[\#5786](https://github.com/matrix-org/matrix-react-sdk/pull/5786)
|
||||||
|
* Simple handling of mid-call output changes
|
||||||
|
[\#6247](https://github.com/matrix-org/matrix-react-sdk/pull/6247)
|
||||||
|
* Improve ForwardDialog performance by using TruncatedList
|
||||||
|
[\#6228](https://github.com/matrix-org/matrix-react-sdk/pull/6228)
|
||||||
|
* Fix dependency and lockfile mismatch
|
||||||
|
[\#6246](https://github.com/matrix-org/matrix-react-sdk/pull/6246)
|
||||||
|
* Improve room directory click behaviour
|
||||||
|
[\#6234](https://github.com/matrix-org/matrix-react-sdk/pull/6234)
|
||||||
|
* Fix keyboard accessibility of the space panel
|
||||||
|
[\#6239](https://github.com/matrix-org/matrix-react-sdk/pull/6239)
|
||||||
|
* Add ways to manage addresses for Spaces
|
||||||
|
[\#6151](https://github.com/matrix-org/matrix-react-sdk/pull/6151)
|
||||||
|
* Hide communities invites and the community autocompleter when Spaces on
|
||||||
|
[\#6244](https://github.com/matrix-org/matrix-react-sdk/pull/6244)
|
||||||
|
* Convert bunch of files to TS
|
||||||
|
[\#6241](https://github.com/matrix-org/matrix-react-sdk/pull/6241)
|
||||||
|
* Open local addresses section by default when there are no existing local
|
||||||
|
addresses
|
||||||
|
[\#6179](https://github.com/matrix-org/matrix-react-sdk/pull/6179)
|
||||||
|
* Allow reordering of the space panel via Drag and Drop
|
||||||
|
[\#6137](https://github.com/matrix-org/matrix-react-sdk/pull/6137)
|
||||||
|
* Replace drag and drop mechanism in communities with something simpler
|
||||||
|
[\#6134](https://github.com/matrix-org/matrix-react-sdk/pull/6134)
|
||||||
|
* EventTilePreview fixes
|
||||||
|
[\#6000](https://github.com/matrix-org/matrix-react-sdk/pull/6000)
|
||||||
|
* Upgrade @types/react and @types/react-dom
|
||||||
|
[\#6233](https://github.com/matrix-org/matrix-react-sdk/pull/6233)
|
||||||
|
* Fix type error in the SpaceStore
|
||||||
|
[\#6242](https://github.com/matrix-org/matrix-react-sdk/pull/6242)
|
||||||
|
* Add experimental options to the Spaces beta
|
||||||
|
[\#6199](https://github.com/matrix-org/matrix-react-sdk/pull/6199)
|
||||||
|
* Consolidate types with js-sdk changes
|
||||||
|
[\#6215](https://github.com/matrix-org/matrix-react-sdk/pull/6215)
|
||||||
|
* Fix branch matching for Buildkite
|
||||||
|
[\#6236](https://github.com/matrix-org/matrix-react-sdk/pull/6236)
|
||||||
|
* Migrate SearchBar to TypeScript
|
||||||
|
[\#6230](https://github.com/matrix-org/matrix-react-sdk/pull/6230)
|
||||||
|
* Add support to keyboard shortcuts dialog for [digits]
|
||||||
|
[\#6088](https://github.com/matrix-org/matrix-react-sdk/pull/6088)
|
||||||
|
* Fix modal opening race condition
|
||||||
|
[\#6238](https://github.com/matrix-org/matrix-react-sdk/pull/6238)
|
||||||
|
* Deprecate FormButton in favour of AccessibleButton
|
||||||
|
[\#6229](https://github.com/matrix-org/matrix-react-sdk/pull/6229)
|
||||||
|
* Add PR template
|
||||||
|
[\#6216](https://github.com/matrix-org/matrix-react-sdk/pull/6216)
|
||||||
|
* Prefer canonical aliases while autocompleting rooms
|
||||||
|
[\#6222](https://github.com/matrix-org/matrix-react-sdk/pull/6222)
|
||||||
|
* Fix quote button
|
||||||
|
[\#6232](https://github.com/matrix-org/matrix-react-sdk/pull/6232)
|
||||||
|
* Restore branch matching support for GitHub Actions e2e tests
|
||||||
|
[\#6224](https://github.com/matrix-org/matrix-react-sdk/pull/6224)
|
||||||
|
* Fix View Source accessing renamed private field on MatrixEvent
|
||||||
|
[\#6225](https://github.com/matrix-org/matrix-react-sdk/pull/6225)
|
||||||
|
* Fix ConfirmUserActionDialog returning an input field rather than text
|
||||||
|
[\#6219](https://github.com/matrix-org/matrix-react-sdk/pull/6219)
|
||||||
|
* Revert "Partially restore immutable event objects at the rendering layer"
|
||||||
|
[\#6221](https://github.com/matrix-org/matrix-react-sdk/pull/6221)
|
||||||
|
* Add jq to e2e tests Dockerfile
|
||||||
|
[\#6218](https://github.com/matrix-org/matrix-react-sdk/pull/6218)
|
||||||
|
* Partially restore immutable event objects at the rendering layer
|
||||||
|
[\#6196](https://github.com/matrix-org/matrix-react-sdk/pull/6196)
|
||||||
|
* Update MSC number references for voice messages
|
||||||
|
[\#6197](https://github.com/matrix-org/matrix-react-sdk/pull/6197)
|
||||||
|
* Fix phase enum usage in JS modules as well
|
||||||
|
[\#6214](https://github.com/matrix-org/matrix-react-sdk/pull/6214)
|
||||||
|
* Migrate some dialogs to TypeScript
|
||||||
|
[\#6185](https://github.com/matrix-org/matrix-react-sdk/pull/6185)
|
||||||
|
* Typescript fixes due to MatrixEvent being TSified
|
||||||
|
[\#6208](https://github.com/matrix-org/matrix-react-sdk/pull/6208)
|
||||||
|
* Allow click-to-ping, quote & emoji picker for edit composer too
|
||||||
|
[\#5858](https://github.com/matrix-org/matrix-react-sdk/pull/5858)
|
||||||
|
* Add call silencing
|
||||||
|
[\#6082](https://github.com/matrix-org/matrix-react-sdk/pull/6082)
|
||||||
|
* Fix types in SlashCommands
|
||||||
|
[\#6207](https://github.com/matrix-org/matrix-react-sdk/pull/6207)
|
||||||
|
* Benchmark multiple common user scenario
|
||||||
|
[\#6190](https://github.com/matrix-org/matrix-react-sdk/pull/6190)
|
||||||
|
* Fix forward dialog message preview display names
|
||||||
|
[\#6204](https://github.com/matrix-org/matrix-react-sdk/pull/6204)
|
||||||
|
* Remove stray bullet point in reply preview
|
||||||
|
[\#6206](https://github.com/matrix-org/matrix-react-sdk/pull/6206)
|
||||||
|
* Stop requesting null next replies from the server
|
||||||
|
[\#6203](https://github.com/matrix-org/matrix-react-sdk/pull/6203)
|
||||||
|
* Fix soft crash caused by a broken shouldComponentUpdate
|
||||||
|
[\#6202](https://github.com/matrix-org/matrix-react-sdk/pull/6202)
|
||||||
|
* Keep composer reply when scrolling away from a highlighted event
|
||||||
|
[\#6200](https://github.com/matrix-org/matrix-react-sdk/pull/6200)
|
||||||
|
* Cache virtual/native room mappings when they're created
|
||||||
|
[\#6194](https://github.com/matrix-org/matrix-react-sdk/pull/6194)
|
||||||
|
* Disable comment-on-alert
|
||||||
|
[\#6191](https://github.com/matrix-org/matrix-react-sdk/pull/6191)
|
||||||
|
* Bump postcss from 7.0.35 to 7.0.36
|
||||||
|
[\#6195](https://github.com/matrix-org/matrix-react-sdk/pull/6195)
|
||||||
|
|
||||||
|
Changes in [3.24.0](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v3.24.0) (2021-06-21)
|
||||||
|
=====================================================================================================
|
||||||
|
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v3.24.0-rc.1...v3.24.0)
|
||||||
|
|
||||||
|
* Upgrade to JS SDK 12.0.0
|
||||||
|
* [Release] Keep composer reply when scrolling away from a highlighted event
|
||||||
|
[\#6211](https://github.com/matrix-org/matrix-react-sdk/pull/6211)
|
||||||
|
* [Release] Remove stray bullet point in reply preview
|
||||||
|
[\#6210](https://github.com/matrix-org/matrix-react-sdk/pull/6210)
|
||||||
|
* [Release] Stop requesting null next replies from the server
|
||||||
|
[\#6209](https://github.com/matrix-org/matrix-react-sdk/pull/6209)
|
||||||
|
|
||||||
|
Changes in [3.24.0-rc.1](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v3.24.0-rc.1) (2021-06-15)
|
||||||
|
===============================================================================================================
|
||||||
|
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v3.23.0...v3.24.0-rc.1)
|
||||||
|
|
||||||
|
* Upgrade to JS SDK 12.0.0-rc.1
|
||||||
|
* Translations update from Weblate
|
||||||
|
[\#6192](https://github.com/matrix-org/matrix-react-sdk/pull/6192)
|
||||||
|
* Disable comment-on-alert for PR coming from a fork
|
||||||
|
[\#6189](https://github.com/matrix-org/matrix-react-sdk/pull/6189)
|
||||||
|
* Add JS benchmark tracking in CI
|
||||||
|
[\#6177](https://github.com/matrix-org/matrix-react-sdk/pull/6177)
|
||||||
|
* Upgrade matrix-react-test-utils for React 17 peer deps
|
||||||
|
[\#6187](https://github.com/matrix-org/matrix-react-sdk/pull/6187)
|
||||||
|
* Fix display name overlaps on the IRC layout
|
||||||
|
[\#6186](https://github.com/matrix-org/matrix-react-sdk/pull/6186)
|
||||||
|
* Small fixes to the spaces experience
|
||||||
|
[\#6184](https://github.com/matrix-org/matrix-react-sdk/pull/6184)
|
||||||
|
* Add footer and privacy note to the start dm dialog
|
||||||
|
[\#6111](https://github.com/matrix-org/matrix-react-sdk/pull/6111)
|
||||||
|
* Format mxids when disambiguation needed
|
||||||
|
[\#5880](https://github.com/matrix-org/matrix-react-sdk/pull/5880)
|
||||||
|
* Move various createRoom types to the js-sdk
|
||||||
|
[\#6183](https://github.com/matrix-org/matrix-react-sdk/pull/6183)
|
||||||
|
* Fix HTML tag for Event Tile when not rendered in a list
|
||||||
|
[\#6175](https://github.com/matrix-org/matrix-react-sdk/pull/6175)
|
||||||
|
* Remove legacy polyfills and unused dependencies
|
||||||
|
[\#6176](https://github.com/matrix-org/matrix-react-sdk/pull/6176)
|
||||||
|
* Fix buggy hovering/selecting of event tiles
|
||||||
|
[\#6173](https://github.com/matrix-org/matrix-react-sdk/pull/6173)
|
||||||
|
* Add room intro warning when e2ee is not enabled
|
||||||
|
[\#5929](https://github.com/matrix-org/matrix-react-sdk/pull/5929)
|
||||||
|
* Migrate end to end tests to GitHub actions
|
||||||
|
[\#6156](https://github.com/matrix-org/matrix-react-sdk/pull/6156)
|
||||||
|
* Fix expanding last collapsed sticky session when zoomed in
|
||||||
|
[\#6171](https://github.com/matrix-org/matrix-react-sdk/pull/6171)
|
||||||
|
* ⚛️ Upgrade to React@17
|
||||||
|
[\#6165](https://github.com/matrix-org/matrix-react-sdk/pull/6165)
|
||||||
|
* Revert refreshStickyHeaders optimisations
|
||||||
|
[\#6168](https://github.com/matrix-org/matrix-react-sdk/pull/6168)
|
||||||
|
* Add logging for which rooms calls are in
|
||||||
|
[\#6170](https://github.com/matrix-org/matrix-react-sdk/pull/6170)
|
||||||
|
* Restore read receipt animation from event to event
|
||||||
|
[\#6169](https://github.com/matrix-org/matrix-react-sdk/pull/6169)
|
||||||
|
* Restore copy button icon when sharing permalink
|
||||||
|
[\#6166](https://github.com/matrix-org/matrix-react-sdk/pull/6166)
|
||||||
|
* Restore Page Up/Down key bindings when focusing the composer
|
||||||
|
[\#6167](https://github.com/matrix-org/matrix-react-sdk/pull/6167)
|
||||||
|
* Timeline rendering optimizations
|
||||||
|
[\#6143](https://github.com/matrix-org/matrix-react-sdk/pull/6143)
|
||||||
|
* Bump css-what from 5.0.0 to 5.0.1
|
||||||
|
[\#6164](https://github.com/matrix-org/matrix-react-sdk/pull/6164)
|
||||||
|
* Bump ws from 6.2.1 to 6.2.2 in /test/end-to-end-tests
|
||||||
|
[\#6145](https://github.com/matrix-org/matrix-react-sdk/pull/6145)
|
||||||
|
* Bump trim-newlines from 3.0.0 to 3.0.1
|
||||||
|
[\#6163](https://github.com/matrix-org/matrix-react-sdk/pull/6163)
|
||||||
|
* Fix upgrade to element home button in top left menu
|
||||||
|
[\#6162](https://github.com/matrix-org/matrix-react-sdk/pull/6162)
|
||||||
|
* Fix unpinning of pinned messages and panel empty state
|
||||||
|
[\#6140](https://github.com/matrix-org/matrix-react-sdk/pull/6140)
|
||||||
|
* Better handling for widgets that fail to load
|
||||||
|
[\#6161](https://github.com/matrix-org/matrix-react-sdk/pull/6161)
|
||||||
|
* Improved forwarding UI
|
||||||
|
[\#5999](https://github.com/matrix-org/matrix-react-sdk/pull/5999)
|
||||||
|
* Fixes for sharing room links
|
||||||
|
[\#6118](https://github.com/matrix-org/matrix-react-sdk/pull/6118)
|
||||||
|
* Fix setting watchers
|
||||||
|
[\#6160](https://github.com/matrix-org/matrix-react-sdk/pull/6160)
|
||||||
|
* Fix Stickerpicker context menu
|
||||||
|
[\#6152](https://github.com/matrix-org/matrix-react-sdk/pull/6152)
|
||||||
|
* Add warning to private space creation flow
|
||||||
|
[\#6155](https://github.com/matrix-org/matrix-react-sdk/pull/6155)
|
||||||
|
* Add prop to alwaysShowTimestamps on TimelinePanel
|
||||||
|
[\#6159](https://github.com/matrix-org/matrix-react-sdk/pull/6159)
|
||||||
|
* Fix notif panel timestamp padding
|
||||||
|
[\#6157](https://github.com/matrix-org/matrix-react-sdk/pull/6157)
|
||||||
|
* Fixes and refactoring for the ImageView
|
||||||
|
[\#6149](https://github.com/matrix-org/matrix-react-sdk/pull/6149)
|
||||||
|
* Fix timestamps
|
||||||
|
[\#6148](https://github.com/matrix-org/matrix-react-sdk/pull/6148)
|
||||||
|
* Make it easier to pan images in the lightbox
|
||||||
|
[\#6147](https://github.com/matrix-org/matrix-react-sdk/pull/6147)
|
||||||
|
* Fix scroll token for EventTile and EventListSummary node type
|
||||||
|
[\#6154](https://github.com/matrix-org/matrix-react-sdk/pull/6154)
|
||||||
|
* Convert bunch of things to Typescript
|
||||||
|
[\#6153](https://github.com/matrix-org/matrix-react-sdk/pull/6153)
|
||||||
|
* Lint the typescript tests
|
||||||
|
[\#6142](https://github.com/matrix-org/matrix-react-sdk/pull/6142)
|
||||||
|
* Fix jumping to bottom without a highlighted event
|
||||||
|
[\#6146](https://github.com/matrix-org/matrix-react-sdk/pull/6146)
|
||||||
|
* Repair event status position in timeline
|
||||||
|
[\#6141](https://github.com/matrix-org/matrix-react-sdk/pull/6141)
|
||||||
|
* Adapt for js-sdk MatrixClient conversion to TS
|
||||||
|
[\#6132](https://github.com/matrix-org/matrix-react-sdk/pull/6132)
|
||||||
|
* Improve pinned messages in Labs
|
||||||
|
[\#6096](https://github.com/matrix-org/matrix-react-sdk/pull/6096)
|
||||||
|
* Map phone number lookup results to their native rooms
|
||||||
|
[\#6136](https://github.com/matrix-org/matrix-react-sdk/pull/6136)
|
||||||
|
* Fix mx_Event containment rules and empty read avatar row
|
||||||
|
[\#6138](https://github.com/matrix-org/matrix-react-sdk/pull/6138)
|
||||||
|
* Improve switch room rendering
|
||||||
|
[\#6079](https://github.com/matrix-org/matrix-react-sdk/pull/6079)
|
||||||
|
* Add CSS containment rules for shorter reflow operations
|
||||||
|
[\#6127](https://github.com/matrix-org/matrix-react-sdk/pull/6127)
|
||||||
|
* ignore hash/fragment when de-duplicating links for url previews
|
||||||
|
[\#6135](https://github.com/matrix-org/matrix-react-sdk/pull/6135)
|
||||||
|
* Clicking jump to bottom resets room hash
|
||||||
|
[\#5823](https://github.com/matrix-org/matrix-react-sdk/pull/5823)
|
||||||
|
* Use passive option for scroll handlers
|
||||||
|
[\#6113](https://github.com/matrix-org/matrix-react-sdk/pull/6113)
|
||||||
|
* Optimise memberSort performance for large list
|
||||||
|
[\#6130](https://github.com/matrix-org/matrix-react-sdk/pull/6130)
|
||||||
|
* Tweak event border radius to match action bar
|
||||||
|
[\#6133](https://github.com/matrix-org/matrix-react-sdk/pull/6133)
|
||||||
|
* Log when we ignore a second call in a room
|
||||||
|
[\#6131](https://github.com/matrix-org/matrix-react-sdk/pull/6131)
|
||||||
|
* Performance monitoring measurements
|
||||||
|
[\#6041](https://github.com/matrix-org/matrix-react-sdk/pull/6041)
|
||||||
|
|
||||||
Changes in [3.23.0](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v3.23.0) (2021-06-07)
|
Changes in [3.23.0](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v3.23.0) (2021-06-07)
|
||||||
=====================================================================================================
|
=====================================================================================================
|
||||||
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v3.23.0-rc.1...v3.23.0)
|
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v3.23.0-rc.1...v3.23.0)
|
||||||
|
|
|
@ -10,7 +10,6 @@ module.exports = {
|
||||||
],
|
],
|
||||||
}],
|
}],
|
||||||
"@babel/preset-typescript",
|
"@babel/preset-typescript",
|
||||||
"@babel/preset-flow",
|
|
||||||
"@babel/preset-react",
|
"@babel/preset-react",
|
||||||
],
|
],
|
||||||
"plugins": [
|
"plugins": [
|
||||||
|
@ -19,7 +18,6 @@ module.exports = {
|
||||||
"@babel/plugin-proposal-numeric-separator",
|
"@babel/plugin-proposal-numeric-separator",
|
||||||
"@babel/plugin-proposal-class-properties",
|
"@babel/plugin-proposal-class-properties",
|
||||||
"@babel/plugin-proposal-object-rest-spread",
|
"@babel/plugin-proposal-object-rest-spread",
|
||||||
"@babel/plugin-transform-flow-comments",
|
|
||||||
"@babel/plugin-syntax-dynamic-import",
|
"@babel/plugin-syntax-dynamic-import",
|
||||||
"@babel/plugin-transform-runtime",
|
"@babel/plugin-transform-runtime",
|
||||||
],
|
],
|
||||||
|
|
40
package.json
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "matrix-react-sdk",
|
"name": "matrix-react-sdk",
|
||||||
"version": "3.23.0",
|
"version": "3.25.0",
|
||||||
"description": "SDK for matrix.org using React",
|
"description": "SDK for matrix.org using React",
|
||||||
"author": "matrix.org",
|
"author": "matrix.org",
|
||||||
"repository": {
|
"repository": {
|
||||||
|
@ -45,7 +45,7 @@
|
||||||
"start:all": "concurrently --kill-others-on-fail --prefix \"{time} [{name}]\" -n build,reskindex \"yarn start:build\" \"yarn reskindex:watch\"",
|
"start:all": "concurrently --kill-others-on-fail --prefix \"{time} [{name}]\" -n build,reskindex \"yarn start:build\" \"yarn reskindex:watch\"",
|
||||||
"start:build": "babel src -w -s -d lib --verbose --extensions \".ts,.js\"",
|
"start:build": "babel src -w -s -d lib --verbose --extensions \".ts,.js\"",
|
||||||
"lint": "yarn lint:types && yarn lint:js && yarn lint:style",
|
"lint": "yarn lint:types && yarn lint:js && yarn lint:style",
|
||||||
"lint:js": "eslint --max-warnings 0 --ignore-path .eslintignore.errorfiles src test",
|
"lint:js": "eslint --max-warnings 0 src test",
|
||||||
"lint:types": "tsc --noEmit --jsx react",
|
"lint:types": "tsc --noEmit --jsx react",
|
||||||
"lint:style": "stylelint 'res/css/**/*.scss'",
|
"lint:style": "stylelint 'res/css/**/*.scss'",
|
||||||
"test": "jest",
|
"test": "jest",
|
||||||
|
@ -55,6 +55,7 @@
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@babel/runtime": "^7.12.5",
|
"@babel/runtime": "^7.12.5",
|
||||||
"await-lock": "^2.1.0",
|
"await-lock": "^2.1.0",
|
||||||
|
"blurhash": "^1.1.3",
|
||||||
"browser-encrypt-attachment": "^0.3.0",
|
"browser-encrypt-attachment": "^0.3.0",
|
||||||
"browser-request": "^0.3.3",
|
"browser-request": "^0.3.3",
|
||||||
"cheerio": "^1.0.0-rc.9",
|
"cheerio": "^1.0.0-rc.9",
|
||||||
|
@ -78,8 +79,8 @@
|
||||||
"katex": "^0.12.0",
|
"katex": "^0.12.0",
|
||||||
"linkifyjs": "^2.1.9",
|
"linkifyjs": "^2.1.9",
|
||||||
"lodash": "^4.17.20",
|
"lodash": "^4.17.20",
|
||||||
"matrix-js-sdk": "github:matrix-org/matrix-js-sdk#develop",
|
"matrix-js-sdk": "12.0.1",
|
||||||
"matrix-widget-api": "^0.1.0-beta.14",
|
"matrix-widget-api": "^0.1.0-beta.15",
|
||||||
"minimist": "^1.2.5",
|
"minimist": "^1.2.5",
|
||||||
"opus-recorder": "^8.0.3",
|
"opus-recorder": "^8.0.3",
|
||||||
"pako": "^2.0.3",
|
"pako": "^2.0.3",
|
||||||
|
@ -89,7 +90,8 @@
|
||||||
"qrcode": "^1.4.4",
|
"qrcode": "^1.4.4",
|
||||||
"re-resizable": "^6.9.0",
|
"re-resizable": "^6.9.0",
|
||||||
"react": "^17.0.2",
|
"react": "^17.0.2",
|
||||||
"react-beautiful-dnd": "^4.0.1",
|
"react-beautiful-dnd": "^13.1.0",
|
||||||
|
"react-blurhash": "^0.1.3",
|
||||||
"react-dom": "^17.0.2",
|
"react-dom": "^17.0.2",
|
||||||
"react-focus-lock": "^2.5.0",
|
"react-focus-lock": "^2.5.0",
|
||||||
"react-transition-group": "^4.4.1",
|
"react-transition-group": "^4.4.1",
|
||||||
|
@ -104,16 +106,16 @@
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@babel/cli": "^7.12.10",
|
"@babel/cli": "^7.12.10",
|
||||||
"@babel/core": "^7.12.10",
|
"@babel/core": "^7.12.10",
|
||||||
|
"@babel/eslint-parser": "^7.12.10",
|
||||||
|
"@babel/eslint-plugin": "^7.12.10",
|
||||||
"@babel/parser": "^7.12.11",
|
"@babel/parser": "^7.12.11",
|
||||||
"@babel/plugin-proposal-class-properties": "^7.12.1",
|
"@babel/plugin-proposal-class-properties": "^7.12.1",
|
||||||
"@babel/plugin-proposal-decorators": "^7.12.12",
|
"@babel/plugin-proposal-decorators": "^7.12.12",
|
||||||
"@babel/plugin-proposal-export-default-from": "^7.12.1",
|
"@babel/plugin-proposal-export-default-from": "^7.12.1",
|
||||||
"@babel/plugin-proposal-numeric-separator": "^7.12.7",
|
"@babel/plugin-proposal-numeric-separator": "^7.12.7",
|
||||||
"@babel/plugin-proposal-object-rest-spread": "^7.12.1",
|
"@babel/plugin-proposal-object-rest-spread": "^7.12.1",
|
||||||
"@babel/plugin-transform-flow-comments": "^7.12.1",
|
|
||||||
"@babel/plugin-transform-runtime": "^7.12.10",
|
"@babel/plugin-transform-runtime": "^7.12.10",
|
||||||
"@babel/preset-env": "^7.12.11",
|
"@babel/preset-env": "^7.12.11",
|
||||||
"@babel/preset-flow": "^7.12.1",
|
|
||||||
"@babel/preset-react": "^7.12.10",
|
"@babel/preset-react": "^7.12.10",
|
||||||
"@babel/preset-typescript": "^7.12.7",
|
"@babel/preset-typescript": "^7.12.7",
|
||||||
"@babel/register": "^7.12.10",
|
"@babel/register": "^7.12.10",
|
||||||
|
@ -122,7 +124,9 @@
|
||||||
"@peculiar/webcrypto": "^1.1.4",
|
"@peculiar/webcrypto": "^1.1.4",
|
||||||
"@sinonjs/fake-timers": "^7.0.2",
|
"@sinonjs/fake-timers": "^7.0.2",
|
||||||
"@types/classnames": "^2.2.11",
|
"@types/classnames": "^2.2.11",
|
||||||
|
"@types/commonmark": "^0.27.4",
|
||||||
"@types/counterpart": "^0.18.1",
|
"@types/counterpart": "^0.18.1",
|
||||||
|
"@types/diff-match-patch": "^1.0.32",
|
||||||
"@types/flux": "^3.1.9",
|
"@types/flux": "^3.1.9",
|
||||||
"@types/jest": "^26.0.20",
|
"@types/jest": "^26.0.20",
|
||||||
"@types/linkifyjs": "^2.1.3",
|
"@types/linkifyjs": "^2.1.3",
|
||||||
|
@ -132,23 +136,22 @@
|
||||||
"@types/pako": "^1.0.1",
|
"@types/pako": "^1.0.1",
|
||||||
"@types/parse5": "^6.0.0",
|
"@types/parse5": "^6.0.0",
|
||||||
"@types/qrcode": "^1.3.5",
|
"@types/qrcode": "^1.3.5",
|
||||||
"@types/react": "^16.9",
|
"@types/react": "^17.0.2",
|
||||||
"@types/react-dom": "^16.9.10",
|
"@types/react-beautiful-dnd": "^13.0.0",
|
||||||
|
"@types/react-dom": "^17.0.2",
|
||||||
"@types/react-transition-group": "^4.4.0",
|
"@types/react-transition-group": "^4.4.0",
|
||||||
"@types/sanitize-html": "^2.3.1",
|
"@types/sanitize-html": "^2.3.1",
|
||||||
"@types/zxcvbn": "^4.4.0",
|
"@types/zxcvbn": "^4.4.0",
|
||||||
"@typescript-eslint/eslint-plugin": "^4.14.0",
|
"@typescript-eslint/eslint-plugin": "^4.17.0",
|
||||||
"@typescript-eslint/parser": "^4.14.0",
|
"@typescript-eslint/parser": "^4.17.0",
|
||||||
"babel-eslint": "^10.1.0",
|
"@wojtekmaj/enzyme-adapter-react-17": "^0.6.1",
|
||||||
"babel-jest": "^26.6.3",
|
"babel-jest": "^26.6.3",
|
||||||
"chokidar": "^3.5.1",
|
"chokidar": "^3.5.1",
|
||||||
"concurrently": "^5.3.0",
|
"concurrently": "^5.3.0",
|
||||||
"enzyme": "^3.11.0",
|
"enzyme": "^3.11.0",
|
||||||
"@wojtekmaj/enzyme-adapter-react-17": "^0.6.1",
|
|
||||||
"eslint": "7.18.0",
|
"eslint": "7.18.0",
|
||||||
"eslint-config-matrix-org": "^0.2.0",
|
"eslint-config-google": "^0.14.0",
|
||||||
"eslint-plugin-babel": "^5.3.1",
|
"eslint-plugin-matrix-org": "github:matrix-org/eslint-plugin-matrix-org#main",
|
||||||
"eslint-plugin-flowtype": "^5.2.0",
|
|
||||||
"eslint-plugin-react": "^7.22.0",
|
"eslint-plugin-react": "^7.22.0",
|
||||||
"eslint-plugin-react-hooks": "^4.2.0",
|
"eslint-plugin-react-hooks": "^4.2.0",
|
||||||
"glob": "^7.1.6",
|
"glob": "^7.1.6",
|
||||||
|
@ -167,13 +170,10 @@
|
||||||
"typescript": "^4.1.3",
|
"typescript": "^4.1.3",
|
||||||
"walk": "^2.3.14"
|
"walk": "^2.3.14"
|
||||||
},
|
},
|
||||||
"resolutions": {
|
|
||||||
"**/@types/react": "^16.14"
|
|
||||||
},
|
|
||||||
"jest": {
|
"jest": {
|
||||||
"testEnvironment": "./__test-utils__/environment.js",
|
"testEnvironment": "./__test-utils__/environment.js",
|
||||||
"testMatch": [
|
"testMatch": [
|
||||||
"<rootDir>/test/**/*-test.[jt]s"
|
"<rootDir>/test/**/*-test.[jt]s?(x)"
|
||||||
],
|
],
|
||||||
"setupFiles": [
|
"setupFiles": [
|
||||||
"jest-canvas-mock"
|
"jest-canvas-mock"
|
||||||
|
|
|
@ -37,6 +37,11 @@
|
||||||
@import "./structures/_ViewSource.scss";
|
@import "./structures/_ViewSource.scss";
|
||||||
@import "./structures/auth/_CompleteSecurity.scss";
|
@import "./structures/auth/_CompleteSecurity.scss";
|
||||||
@import "./structures/auth/_Login.scss";
|
@import "./structures/auth/_Login.scss";
|
||||||
|
@import "./views/audio_messages/_AudioPlayer.scss";
|
||||||
|
@import "./views/audio_messages/_PlayPauseButton.scss";
|
||||||
|
@import "./views/audio_messages/_PlaybackContainer.scss";
|
||||||
|
@import "./views/audio_messages/_SeekBar.scss";
|
||||||
|
@import "./views/audio_messages/_Waveform.scss";
|
||||||
@import "./views/auth/_AuthBody.scss";
|
@import "./views/auth/_AuthBody.scss";
|
||||||
@import "./views/auth/_AuthButtons.scss";
|
@import "./views/auth/_AuthButtons.scss";
|
||||||
@import "./views/auth/_AuthFooter.scss";
|
@import "./views/auth/_AuthFooter.scss";
|
||||||
|
@ -52,7 +57,6 @@
|
||||||
@import "./views/avatars/_BaseAvatar.scss";
|
@import "./views/avatars/_BaseAvatar.scss";
|
||||||
@import "./views/avatars/_DecoratedRoomAvatar.scss";
|
@import "./views/avatars/_DecoratedRoomAvatar.scss";
|
||||||
@import "./views/avatars/_MemberStatusMessageAvatar.scss";
|
@import "./views/avatars/_MemberStatusMessageAvatar.scss";
|
||||||
@import "./views/avatars/_PulsedAvatar.scss";
|
|
||||||
@import "./views/avatars/_WidgetAvatar.scss";
|
@import "./views/avatars/_WidgetAvatar.scss";
|
||||||
@import "./views/beta/_BetaCard.scss";
|
@import "./views/beta/_BetaCard.scss";
|
||||||
@import "./views/context_menus/_CallContextMenu.scss";
|
@import "./views/context_menus/_CallContextMenu.scss";
|
||||||
|
@ -123,7 +127,6 @@
|
||||||
@import "./views/elements/_EventListSummary.scss";
|
@import "./views/elements/_EventListSummary.scss";
|
||||||
@import "./views/elements/_FacePile.scss";
|
@import "./views/elements/_FacePile.scss";
|
||||||
@import "./views/elements/_Field.scss";
|
@import "./views/elements/_Field.scss";
|
||||||
@import "./views/elements/_FormButton.scss";
|
|
||||||
@import "./views/elements/_ImageView.scss";
|
@import "./views/elements/_ImageView.scss";
|
||||||
@import "./views/elements/_InfoTooltip.scss";
|
@import "./views/elements/_InfoTooltip.scss";
|
||||||
@import "./views/elements/_InlineSpinner.scss";
|
@import "./views/elements/_InlineSpinner.scss";
|
||||||
|
@ -166,6 +169,7 @@
|
||||||
@import "./views/messages/_MTextBody.scss";
|
@import "./views/messages/_MTextBody.scss";
|
||||||
@import "./views/messages/_MVideoBody.scss";
|
@import "./views/messages/_MVideoBody.scss";
|
||||||
@import "./views/messages/_MVoiceMessageBody.scss";
|
@import "./views/messages/_MVoiceMessageBody.scss";
|
||||||
|
@import "./views/messages/_MediaBody.scss";
|
||||||
@import "./views/messages/_MessageActionBar.scss";
|
@import "./views/messages/_MessageActionBar.scss";
|
||||||
@import "./views/messages/_MessageTimestamp.scss";
|
@import "./views/messages/_MessageTimestamp.scss";
|
||||||
@import "./views/messages/_MjolnirBody.scss";
|
@import "./views/messages/_MjolnirBody.scss";
|
||||||
|
@ -197,6 +201,7 @@
|
||||||
@import "./views/rooms/_GroupLayout.scss";
|
@import "./views/rooms/_GroupLayout.scss";
|
||||||
@import "./views/rooms/_IRCLayout.scss";
|
@import "./views/rooms/_IRCLayout.scss";
|
||||||
@import "./views/rooms/_JumpToBottomButton.scss";
|
@import "./views/rooms/_JumpToBottomButton.scss";
|
||||||
|
@import "./views/rooms/_LinkPreviewGroup.scss";
|
||||||
@import "./views/rooms/_LinkPreviewWidget.scss";
|
@import "./views/rooms/_LinkPreviewWidget.scss";
|
||||||
@import "./views/rooms/_MemberInfo.scss";
|
@import "./views/rooms/_MemberInfo.scss";
|
||||||
@import "./views/rooms/_MemberList.scss";
|
@import "./views/rooms/_MemberList.scss";
|
||||||
|
@ -254,9 +259,6 @@
|
||||||
@import "./views/toasts/_AnalyticsToast.scss";
|
@import "./views/toasts/_AnalyticsToast.scss";
|
||||||
@import "./views/toasts/_NonUrgentEchoFailureToast.scss";
|
@import "./views/toasts/_NonUrgentEchoFailureToast.scss";
|
||||||
@import "./views/verification/_VerificationShowSas.scss";
|
@import "./views/verification/_VerificationShowSas.scss";
|
||||||
@import "./views/voice_messages/_PlayPauseButton.scss";
|
|
||||||
@import "./views/voice_messages/_PlaybackContainer.scss";
|
|
||||||
@import "./views/voice_messages/_Waveform.scss";
|
|
||||||
@import "./views/voip/_CallContainer.scss";
|
@import "./views/voip/_CallContainer.scss";
|
||||||
@import "./views/voip/_CallView.scss";
|
@import "./views/voip/_CallView.scss";
|
||||||
@import "./views/voip/_CallViewForRoom.scss";
|
@import "./views/voip/_CallViewForRoom.scss";
|
||||||
|
|
|
@ -323,7 +323,7 @@ limitations under the License.
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_GroupView_featuredThing .mx_BaseAvatar {
|
.mx_GroupView_featuredThing .mx_BaseAvatar {
|
||||||
/* To prevent misalignment with mx_TintableSvg (in addButton) */
|
/* To prevent misalignment with img (in addButton) */
|
||||||
vertical-align: initial;
|
vertical-align: initial;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -111,6 +111,29 @@ $roomListCollapsedWidth: 68px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mx_LeftPanel_dialPadButton {
|
||||||
|
width: 32px;
|
||||||
|
height: 32px;
|
||||||
|
border-radius: 8px;
|
||||||
|
background-color: $roomlist-button-bg-color;
|
||||||
|
position: relative;
|
||||||
|
margin-left: 8px;
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 8px;
|
||||||
|
left: 8px;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
mask-image: url('$(res)/img/element-icons/call/dialpad.svg');
|
||||||
|
mask-position: center;
|
||||||
|
mask-size: contain;
|
||||||
|
mask-repeat: no-repeat;
|
||||||
|
background: $secondary-fg-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.mx_LeftPanel_exploreButton {
|
.mx_LeftPanel_exploreButton {
|
||||||
width: 32px;
|
width: 32px;
|
||||||
height: 32px;
|
height: 32px;
|
||||||
|
@ -185,6 +208,12 @@ $roomListCollapsedWidth: 68px;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
|
||||||
|
.mx_LeftPanel_dialPadButton {
|
||||||
|
margin-left: 0;
|
||||||
|
margin-top: 8px;
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
.mx_LeftPanel_exploreButton {
|
.mx_LeftPanel_exploreButton {
|
||||||
margin-left: 0;
|
margin-left: 0;
|
||||||
margin-top: 8px;
|
margin-top: 8px;
|
||||||
|
|
|
@ -121,23 +121,51 @@ $pulse-color: $pinned-unread-color;
|
||||||
box-shadow: 0 0 0 0 rgba($pulse-color, 1);
|
box-shadow: 0 0 0 0 rgba($pulse-color, 1);
|
||||||
animation: mx_RightPanel_indicator_pulse 2s infinite;
|
animation: mx_RightPanel_indicator_pulse 2s infinite;
|
||||||
animation-iteration-count: 1;
|
animation-iteration-count: 1;
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
width: inherit;
|
||||||
|
height: inherit;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
transform: scale(1);
|
||||||
|
transform-origin: center center;
|
||||||
|
animation-name: mx_RightPanel_indicator_pulse_shadow;
|
||||||
|
animation-duration: inherit;
|
||||||
|
animation-iteration-count: inherit;
|
||||||
|
border-radius: 50%;
|
||||||
|
background: rgba($pulse-color, 1);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@keyframes mx_RightPanel_indicator_pulse {
|
@keyframes mx_RightPanel_indicator_pulse {
|
||||||
0% {
|
0% {
|
||||||
transform: scale(0.95);
|
transform: scale(0.95);
|
||||||
box-shadow: 0 0 0 0 rgba($pulse-color, 0.7);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
70% {
|
70% {
|
||||||
transform: scale(1);
|
transform: scale(1);
|
||||||
box-shadow: 0 0 0 10px rgba($pulse-color, 0);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
100% {
|
100% {
|
||||||
transform: scale(0.95);
|
transform: scale(0.95);
|
||||||
box-shadow: 0 0 0 0 rgba($pulse-color, 0);
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes mx_RightPanel_indicator_pulse_shadow {
|
||||||
|
0% {
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
70% {
|
||||||
|
transform: scale(2.2);
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
opacity: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -112,7 +112,7 @@ limitations under the License.
|
||||||
|
|
||||||
.mx_AccessibleButton {
|
.mx_AccessibleButton {
|
||||||
padding: 5px 10px;
|
padding: 5px 10px;
|
||||||
padding-left: 28px; // 16px for the icon, 2px margin to text, 10px regular padding
|
padding-left: 30px; // 18px for the icon, 2px margin to text, 10px regular padding
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
|
@ -128,13 +128,14 @@ limitations under the License.
|
||||||
mask-repeat: no-repeat;
|
mask-repeat: no-repeat;
|
||||||
mask-position: center;
|
mask-position: center;
|
||||||
mask-size: contain;
|
mask-size: contain;
|
||||||
|
width: 18px;
|
||||||
|
height: 18px;
|
||||||
|
top: 50%; // text sizes are dynamic
|
||||||
|
transform: translateY(-50%);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.mx_RoomStatusBar_unsentCancelAllBtn::before {
|
&.mx_RoomStatusBar_unsentCancelAllBtn::before {
|
||||||
mask-image: url('$(res)/img/element-icons/trashcan.svg');
|
mask-image: url('$(res)/img/element-icons/trashcan.svg');
|
||||||
width: 12px;
|
|
||||||
height: 16px;
|
|
||||||
top: calc(50% - 8px); // text sizes are dynamic
|
|
||||||
}
|
}
|
||||||
|
|
||||||
&.mx_RoomStatusBar_unsentResendAllBtn {
|
&.mx_RoomStatusBar_unsentResendAllBtn {
|
||||||
|
@ -142,9 +143,6 @@ limitations under the License.
|
||||||
|
|
||||||
&::before {
|
&::before {
|
||||||
mask-image: url('$(res)/img/element-icons/retry.svg');
|
mask-image: url('$(res)/img/element-icons/retry.svg');
|
||||||
width: 18px;
|
|
||||||
height: 18px;
|
|
||||||
top: calc(50% - 9px); // text sizes are dynamic
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -57,14 +57,15 @@ limitations under the License.
|
||||||
|
|
||||||
@keyframes mx_RoomView_fileDropTarget_image_animation {
|
@keyframes mx_RoomView_fileDropTarget_image_animation {
|
||||||
from {
|
from {
|
||||||
width: 0px;
|
transform: scaleX(0);
|
||||||
}
|
}
|
||||||
to {
|
to {
|
||||||
width: 32px;
|
transform: scaleX(1);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_RoomView_fileDropTarget_image {
|
.mx_RoomView_fileDropTarget_image {
|
||||||
|
width: 32px;
|
||||||
animation: mx_RoomView_fileDropTarget_image_animation;
|
animation: mx_RoomView_fileDropTarget_image_animation;
|
||||||
animation-duration: 0.5s;
|
animation-duration: 0.5s;
|
||||||
margin-bottom: 16px;
|
margin-bottom: 16px;
|
||||||
|
|
|
@ -31,7 +31,6 @@ $activeBorderColor: $secondary-fg-color;
|
||||||
// Create another flexbox so the Panel fills the container
|
// Create another flexbox so the Panel fills the container
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
overflow-y: auto;
|
|
||||||
|
|
||||||
.mx_SpacePanel_spaceTreeWrapper {
|
.mx_SpacePanel_spaceTreeWrapper {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
|
@ -69,6 +68,12 @@ $activeBorderColor: $secondary-fg-color;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mx_SpaceItem_dragging {
|
||||||
|
.mx_SpaceButton_toggleCollapse {
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.mx_SpaceTreeLevel {
|
.mx_SpaceTreeLevel {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|
|
@ -71,7 +71,7 @@ limitations under the License.
|
||||||
&::before {
|
&::before {
|
||||||
background-color: #ffffff;
|
background-color: #ffffff;
|
||||||
mask-image: url('$(res)/img/e2e/normal.svg');
|
mask-image: url('$(res)/img/e2e/normal.svg');
|
||||||
mask-size: 90%;
|
mask-size: 80%;
|
||||||
}
|
}
|
||||||
|
|
||||||
&::after {
|
&::after {
|
||||||
|
@ -135,10 +135,14 @@ limitations under the License.
|
||||||
float: right;
|
float: right;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
||||||
.mx_FormButton {
|
.mx_AccessibleButton {
|
||||||
min-width: 96px;
|
min-width: 96px;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mx_AccessibleButton + .mx_AccessibleButton {
|
||||||
|
margin-left: 5px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_Toast_description {
|
.mx_Toast_description {
|
||||||
|
|
68
res/css/views/audio_messages/_AudioPlayer.scss
Normal file
|
@ -0,0 +1,68 @@
|
||||||
|
/*
|
||||||
|
Copyright 2021 The Matrix.org Foundation C.I.C.
|
||||||
|
|
||||||
|
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.
|
||||||
|
*/
|
||||||
|
|
||||||
|
.mx_AudioPlayer_container {
|
||||||
|
padding: 16px 12px 12px 12px;
|
||||||
|
max-width: 267px; // use max to make the control fit in the files/pinned panels
|
||||||
|
|
||||||
|
.mx_AudioPlayer_primaryContainer {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.mx_PlayPauseButton {
|
||||||
|
margin-right: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_AudioPlayer_mediaInfo {
|
||||||
|
flex: 1;
|
||||||
|
overflow: hidden; // makes the ellipsis on the file name work
|
||||||
|
|
||||||
|
& > * {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_AudioPlayer_mediaName {
|
||||||
|
color: $primary-fg-color;
|
||||||
|
font-size: $font-15px;
|
||||||
|
line-height: $font-15px;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
padding-bottom: 4px; // mimics the line-height differences in the Figma
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_AudioPlayer_byline {
|
||||||
|
font-size: $font-12px;
|
||||||
|
line-height: $font-12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_AudioPlayer_seek {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.mx_SeekBar {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_Clock {
|
||||||
|
width: $font-42px; // we're not using a monospace font, so fake it
|
||||||
|
min-width: $font-42px; // for flexbox
|
||||||
|
padding-left: 4px; // isolate from seek bar
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -18,6 +18,8 @@ limitations under the License.
|
||||||
position: relative;
|
position: relative;
|
||||||
width: 32px;
|
width: 32px;
|
||||||
height: 32px;
|
height: 32px;
|
||||||
|
min-width: 32px; // for when the button is used in a flexbox
|
||||||
|
min-height: 32px; // for when the button is used in a flexbox
|
||||||
border-radius: 32px;
|
border-radius: 32px;
|
||||||
background-color: $voice-playback-button-bg-color;
|
background-color: $voice-playback-button-bg-color;
|
||||||
|
|
|
@ -22,25 +22,24 @@ limitations under the License.
|
||||||
// 7px top and bottom for visual design. 12px left & right, but the waveform (right)
|
// 7px top and bottom for visual design. 12px left & right, but the waveform (right)
|
||||||
// has a 1px padding on it that we want to account for.
|
// has a 1px padding on it that we want to account for.
|
||||||
padding: 7px 12px 7px 11px;
|
padding: 7px 12px 7px 11px;
|
||||||
background-color: $voice-record-waveform-bg-color;
|
|
||||||
border-radius: 12px;
|
|
||||||
|
|
||||||
// Cheat at alignment a bit
|
// Cheat at alignment a bit
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
||||||
color: $voice-record-waveform-fg-color;
|
contain: content;
|
||||||
font-size: $font-14px;
|
|
||||||
line-height: $font-24px;
|
|
||||||
|
|
||||||
.mx_Waveform {
|
.mx_Waveform {
|
||||||
.mx_Waveform_bar {
|
.mx_Waveform_bar {
|
||||||
background-color: $voice-record-waveform-incomplete-fg-color;
|
background-color: $voice-record-waveform-incomplete-fg-color;
|
||||||
|
height: 100%;
|
||||||
|
/* Variable set by a JS component */
|
||||||
|
transform: scaleY(max(0.05, var(--barHeight)));
|
||||||
|
|
||||||
&.mx_Waveform_bar_100pct {
|
&.mx_Waveform_bar_100pct {
|
||||||
// Small animation to remove the mechanical feel of progress
|
// Small animation to remove the mechanical feel of progress
|
||||||
transition: background-color 250ms ease;
|
transition: background-color 250ms ease;
|
||||||
background-color: $voice-record-waveform-fg-color;
|
background-color: $message-body-panel-fg-color;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
103
res/css/views/audio_messages/_SeekBar.scss
Normal file
|
@ -0,0 +1,103 @@
|
||||||
|
/*
|
||||||
|
Copyright 2021 The Matrix.org Foundation C.I.C.
|
||||||
|
|
||||||
|
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.
|
||||||
|
*/
|
||||||
|
|
||||||
|
// CSS inspiration from:
|
||||||
|
// * https://www.w3schools.com/howto/howto_js_rangeslider.asp
|
||||||
|
// * https://stackoverflow.com/a/28283806
|
||||||
|
// * https://css-tricks.com/styling-cross-browser-compatible-range-inputs-css/
|
||||||
|
|
||||||
|
.mx_SeekBar {
|
||||||
|
// Dev note: we deliberately do not have the -ms-track (and friends) selectors because we don't
|
||||||
|
// need to support IE.
|
||||||
|
|
||||||
|
appearance: none; // default style override
|
||||||
|
|
||||||
|
width: 100%;
|
||||||
|
height: 1px;
|
||||||
|
background: $quaternary-fg-color;
|
||||||
|
outline: none; // remove blue selection border
|
||||||
|
position: relative; // for before+after pseudo elements later on
|
||||||
|
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
&::-webkit-slider-thumb {
|
||||||
|
appearance: none; // default style override
|
||||||
|
|
||||||
|
// Dev note: This needs to be duplicated with the -moz-range-thumb selector
|
||||||
|
// because otherwise Edge (webkit) will fail to see the styles and just refuse
|
||||||
|
// to apply them.
|
||||||
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
|
border-radius: 8px;
|
||||||
|
background-color: $tertiary-fg-color;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
&::-moz-range-thumb {
|
||||||
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
|
border-radius: 8px;
|
||||||
|
background-color: $tertiary-fg-color;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
// Firefox adds a border on the thumb
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
// This is for webkit support, but we can't limit the functionality of it to just webkit
|
||||||
|
// browsers. Firefox responds to webkit-prefixed values now, which means we can't use media
|
||||||
|
// or support queries to selectively apply the rule. An upside is that this CSS doesn't work
|
||||||
|
// in firefox, so it's just wasted CPU/GPU time.
|
||||||
|
&::before { // ::before to ensure it ends up under the thumb
|
||||||
|
content: '';
|
||||||
|
background-color: $tertiary-fg-color;
|
||||||
|
|
||||||
|
// Absolute positioning to ensure it overlaps with the existing bar
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
|
||||||
|
// Sizing to match the bar
|
||||||
|
width: 100%;
|
||||||
|
height: 1px;
|
||||||
|
|
||||||
|
// And finally dynamic width without overly hurting the rendering engine.
|
||||||
|
transform-origin: 0 100%;
|
||||||
|
transform: scaleX(var(--fillTo));
|
||||||
|
}
|
||||||
|
|
||||||
|
// This is firefox's built-in support for the above, with 100% less hacks.
|
||||||
|
&::-moz-range-progress {
|
||||||
|
background-color: $tertiary-fg-color;
|
||||||
|
height: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:disabled {
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Increase clickable area for the slider (approximately same size as browser default)
|
||||||
|
// We do it this way to keep the same padding and margins of the element, avoiding margin math.
|
||||||
|
// Source: https://front-back.com/expand-clickable-areas-for-a-better-touch-experience/
|
||||||
|
&::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: -6px;
|
||||||
|
bottom: -6px;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
}
|
||||||
|
}
|
|
@ -19,49 +19,68 @@ limitations under the License.
|
||||||
padding: 24px;
|
padding: 24px;
|
||||||
background-color: $settings-profile-placeholder-bg-color;
|
background-color: $settings-profile-placeholder-bg-color;
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
display: flex;
|
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
|
|
||||||
> div {
|
.mx_BetaCard_columns {
|
||||||
.mx_BetaCard_title {
|
display: flex;
|
||||||
font-weight: $font-semi-bold;
|
|
||||||
font-size: $font-18px;
|
|
||||||
line-height: $font-22px;
|
|
||||||
color: $primary-fg-color;
|
|
||||||
margin: 4px 0 14px;
|
|
||||||
|
|
||||||
.mx_BetaCard_betaPill {
|
> div {
|
||||||
margin-left: 12px;
|
.mx_BetaCard_title {
|
||||||
|
font-weight: $font-semi-bold;
|
||||||
|
font-size: $font-18px;
|
||||||
|
line-height: $font-22px;
|
||||||
|
color: $primary-fg-color;
|
||||||
|
margin: 4px 0 14px;
|
||||||
|
|
||||||
|
.mx_BetaCard_betaPill {
|
||||||
|
margin-left: 12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_BetaCard_caption {
|
||||||
|
font-size: $font-15px;
|
||||||
|
line-height: $font-20px;
|
||||||
|
color: $secondary-fg-color;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_BetaCard_buttons .mx_AccessibleButton {
|
||||||
|
display: block;
|
||||||
|
margin: 12px 0;
|
||||||
|
padding: 7px 40px;
|
||||||
|
width: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_BetaCard_disclaimer {
|
||||||
|
font-size: $font-12px;
|
||||||
|
line-height: $font-15px;
|
||||||
|
color: $secondary-fg-color;
|
||||||
|
margin-top: 20px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_BetaCard_caption {
|
> img {
|
||||||
font-size: $font-15px;
|
margin: auto 0 auto 20px;
|
||||||
line-height: $font-20px;
|
width: 300px;
|
||||||
color: $secondary-fg-color;
|
object-fit: contain;
|
||||||
margin-bottom: 20px;
|
height: 100%;
|
||||||
}
|
|
||||||
|
|
||||||
.mx_AccessibleButton {
|
|
||||||
display: block;
|
|
||||||
margin: 12px 0;
|
|
||||||
padding: 7px 40px;
|
|
||||||
width: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mx_BetaCard_disclaimer {
|
|
||||||
font-size: $font-12px;
|
|
||||||
line-height: $font-15px;
|
|
||||||
color: $secondary-fg-color;
|
|
||||||
margin-top: 20px;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
> img {
|
.mx_BetaCard_relatedSettings {
|
||||||
margin: auto 0 auto 20px;
|
.mx_SettingsFlag {
|
||||||
width: 300px;
|
margin: 16px 0 0;
|
||||||
object-fit: contain;
|
font-size: $font-15px;
|
||||||
height: 100%;
|
line-height: $font-24px;
|
||||||
|
color: $primary-fg-color;
|
||||||
|
|
||||||
|
.mx_SettingsFlag_microcopy {
|
||||||
|
margin-top: 4px;
|
||||||
|
font-size: $font-12px;
|
||||||
|
line-height: $font-15px;
|
||||||
|
color: $secondary-fg-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -91,24 +110,52 @@ $dot-size: 12px;
|
||||||
width: $dot-size;
|
width: $dot-size;
|
||||||
transform: scale(1);
|
transform: scale(1);
|
||||||
background: rgba($pulse-color, 1);
|
background: rgba($pulse-color, 1);
|
||||||
box-shadow: 0 0 0 0 rgba($pulse-color, 1);
|
|
||||||
animation: mx_Beta_bluePulse 2s infinite;
|
animation: mx_Beta_bluePulse 2s infinite;
|
||||||
animation-iteration-count: 20;
|
animation-iteration-count: 20;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
width: inherit;
|
||||||
|
height: inherit;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
transform: scale(1);
|
||||||
|
transform-origin: center center;
|
||||||
|
animation-name: mx_Beta_bluePulse_shadow;
|
||||||
|
animation-duration: inherit;
|
||||||
|
animation-iteration-count: inherit;
|
||||||
|
border-radius: 50%;
|
||||||
|
background: rgba($pulse-color, 1);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@keyframes mx_Beta_bluePulse {
|
@keyframes mx_Beta_bluePulse {
|
||||||
0% {
|
0% {
|
||||||
transform: scale(0.95);
|
transform: scale(0.95);
|
||||||
box-shadow: 0 0 0 0 rgba($pulse-color, 0.7);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
70% {
|
70% {
|
||||||
transform: scale(1);
|
transform: scale(1);
|
||||||
box-shadow: 0 0 0 10px rgba($pulse-color, 0);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
100% {
|
100% {
|
||||||
transform: scale(0.95);
|
transform: scale(0.95);
|
||||||
box-shadow: 0 0 0 0 rgba($pulse-color, 0);
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes mx_Beta_bluePulse_shadow {
|
||||||
|
0% {
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
70% {
|
||||||
|
transform: scale(2.2);
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
opacity: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
/*
|
/*
|
||||||
Copyright 2015, 2016 OpenMarket Ltd
|
Copyright 2015, 2016 OpenMarket Ltd
|
||||||
|
Copyright 2021 Michael Weimann <mail@michael-weimann.eu>
|
||||||
|
|
||||||
Licensed under the Apache License, Version 2.0 (the "License");
|
Licensed under the Apache License, Version 2.0 (the "License");
|
||||||
you may not use this file except in compliance with the License.
|
you may not use this file except in compliance with the License.
|
||||||
|
@ -15,16 +16,69 @@ limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
.mx_MessageContextMenu {
|
.mx_MessageContextMenu {
|
||||||
padding: 6px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mx_MessageContextMenu_field {
|
.mx_IconizedContextMenu_icon {
|
||||||
display: block;
|
width: 16px;
|
||||||
padding: 3px 6px 3px 6px;
|
height: 16px;
|
||||||
cursor: pointer;
|
display: block;
|
||||||
white-space: nowrap;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mx_MessageContextMenu_field.mx_MessageContextMenu_fieldSet {
|
&::before {
|
||||||
font-weight: bold;
|
content: '';
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
display: block;
|
||||||
|
mask-position: center;
|
||||||
|
mask-size: contain;
|
||||||
|
mask-repeat: no-repeat;
|
||||||
|
background: $primary-fg-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_MessageContextMenu_iconCollapse::before {
|
||||||
|
mask-image: url('$(res)/img/element-icons/message/chevron-up.svg');
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_MessageContextMenu_iconReport::before {
|
||||||
|
mask-image: url('$(res)/img/element-icons/warning-badge.svg');
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_MessageContextMenu_iconLink::before {
|
||||||
|
mask-image: url('$(res)/img/element-icons/link.svg');
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_MessageContextMenu_iconPermalink::before {
|
||||||
|
mask-image: url('$(res)/img/element-icons/room/share.svg');
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_MessageContextMenu_iconUnhidePreview::before {
|
||||||
|
mask-image: url('$(res)/img/element-icons/settings/appearance.svg');
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_MessageContextMenu_iconForward::before {
|
||||||
|
mask-image: url('$(res)/img/element-icons/message/fwd.svg');
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_MessageContextMenu_iconRedact::before {
|
||||||
|
mask-image: url('$(res)/img/element-icons/trashcan.svg');
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_MessageContextMenu_iconResend::before {
|
||||||
|
mask-image: url('$(res)/img/element-icons/retry.svg');
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_MessageContextMenu_iconSource::before {
|
||||||
|
mask-image: url('$(res)/img/element-icons/room/format-bar/code.svg');
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_MessageContextMenu_iconQuote::before {
|
||||||
|
mask-image: url('$(res)/img/element-icons/room/format-bar/quote.svg');
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_MessageContextMenu_iconPin::before {
|
||||||
|
mask-image: url('$(res)/img/element-icons/room/pin-upright.svg');
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_MessageContextMenu_iconUnpin::before {
|
||||||
|
mask-image: url('$(res)/img/element-icons/room/pin.svg');
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -38,6 +38,15 @@ limitations under the License.
|
||||||
mask-image: url('$(res)/img/element-icons/view-community.svg');
|
mask-image: url('$(res)/img/element-icons/view-community.svg');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mx_TagTileContextMenu_moveUp::before {
|
||||||
|
transform: rotate(180deg);
|
||||||
|
mask-image: url('$(res)/img/feather-customised/chevron-down.svg');
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_TagTileContextMenu_moveDown::before {
|
||||||
|
mask-image: url('$(res)/img/feather-customised/chevron-down.svg');
|
||||||
|
}
|
||||||
|
|
||||||
.mx_TagTileContextMenu_hideCommunity::before {
|
.mx_TagTileContextMenu_hideCommunity::before {
|
||||||
mask-image: url('$(res)/img/element-icons/hide.svg');
|
mask-image: url('$(res)/img/element-icons/hide.svg');
|
||||||
}
|
}
|
||||||
|
|
|
@ -34,7 +34,7 @@ limitations under the License.
|
||||||
> .mx_ForwardDialog_preview {
|
> .mx_ForwardDialog_preview {
|
||||||
max-height: 30%;
|
max-height: 30%;
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
overflow: scroll;
|
overflow-y: auto;
|
||||||
|
|
||||||
div {
|
div {
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
|
|
|
@ -295,6 +295,7 @@ limitations under the License.
|
||||||
|
|
||||||
.mx_InviteDialog_content {
|
.mx_InviteDialog_content {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -316,3 +317,42 @@ limitations under the License.
|
||||||
.mx_InviteDialog_helpText .mx_AccessibleButton_kind_link {
|
.mx_InviteDialog_helpText .mx_AccessibleButton_kind_link {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mx_InviteDialog_multiInviterError {
|
||||||
|
> h4 {
|
||||||
|
font-size: $font-15px;
|
||||||
|
line-height: $font-24px;
|
||||||
|
color: $secondary-fg-color;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
> div {
|
||||||
|
.mx_InviteDialog_multiInviterError_entry {
|
||||||
|
margin-bottom: 24px;
|
||||||
|
|
||||||
|
.mx_InviteDialog_multiInviterError_entry_userProfile {
|
||||||
|
.mx_InviteDialog_multiInviterError_entry_name {
|
||||||
|
margin-left: 6px;
|
||||||
|
font-size: $font-15px;
|
||||||
|
line-height: $font-24px;
|
||||||
|
font-weight: $font-semi-bold;
|
||||||
|
color: $primary-fg-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_InviteDialog_multiInviterError_entry_userId {
|
||||||
|
margin-left: 6px;
|
||||||
|
font-size: $font-12px;
|
||||||
|
line-height: $font-15px;
|
||||||
|
color: $tertiary-fg-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_InviteDialog_multiInviterError_entry_error {
|
||||||
|
margin-left: 32px;
|
||||||
|
font-size: $font-15px;
|
||||||
|
line-height: $font-24px;
|
||||||
|
color: $notice-primary-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -15,7 +15,7 @@ limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
// Not actually a component but things shared by settings components
|
// Not actually a component but things shared by settings components
|
||||||
.mx_UserSettingsDialog, .mx_RoomSettingsDialog {
|
.mx_UserSettingsDialog, .mx_RoomSettingsDialog, .mx_SpaceSettingsDialog {
|
||||||
width: 90vw;
|
width: 90vw;
|
||||||
max-width: 1000px;
|
max-width: 1000px;
|
||||||
// set the height too since tabbed view scrolls itself.
|
// set the height too since tabbed view scrolls itself.
|
||||||
|
|
|
@ -15,7 +15,6 @@ limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
.mx_SpaceSettingsDialog {
|
.mx_SpaceSettingsDialog {
|
||||||
width: 480px;
|
|
||||||
color: $primary-fg-color;
|
color: $primary-fg-color;
|
||||||
|
|
||||||
.mx_SpaceSettings_errorText {
|
.mx_SpaceSettings_errorText {
|
||||||
|
@ -32,8 +31,44 @@ limitations under the License.
|
||||||
margin-left: 16px;
|
margin-left: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_AccessibleButton_kind_danger {
|
.mx_SettingsTab_section {
|
||||||
margin-top: 28px;
|
.mx_SettingsTab_section_caption {
|
||||||
|
margin-top: 12px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
& + .mx_SettingsTab_subheading {
|
||||||
|
border-top: 1px solid $message-body-panel-bg-color;
|
||||||
|
margin-top: 0;
|
||||||
|
padding-top: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_RadioButton {
|
||||||
|
margin-top: 8px;
|
||||||
|
margin-bottom: 4px;
|
||||||
|
|
||||||
|
.mx_RadioButton_content {
|
||||||
|
font-weight: $font-semi-bold;
|
||||||
|
line-height: $font-18px;
|
||||||
|
color: $primary-fg-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
& + span {
|
||||||
|
font-size: $font-15px;
|
||||||
|
line-height: $font-18px;
|
||||||
|
color: $secondary-fg-color;
|
||||||
|
margin-left: 26px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_SettingsTab_showAdvanced {
|
||||||
|
margin: 16px 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_SettingsFlag {
|
||||||
|
margin-top: 24px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_SpaceSettingsDialog_buttons {
|
.mx_SpaceSettingsDialog_buttons {
|
||||||
|
@ -52,4 +87,14 @@ limitations under the License.
|
||||||
.mx_AccessibleButton_hasKind {
|
.mx_AccessibleButton_hasKind {
|
||||||
padding: 8px 22px;
|
padding: 8px 22px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mx_TabbedView_tabLabel {
|
||||||
|
.mx_SpaceSettingsDialog_generalIcon::before {
|
||||||
|
mask-image: url('$(res)/img/element-icons/settings.svg');
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_SpaceSettingsDialog_visibilityIcon::before {
|
||||||
|
mask-image: url('$(res)/img/element-icons/eye.svg');
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -28,6 +28,7 @@ limitations under the License.
|
||||||
left: 0;
|
left: 0;
|
||||||
top: 2px; // alignment
|
top: 2px; // alignment
|
||||||
background-image: url("$(res)/img/element-icons/warning-badge.svg");
|
background-image: url("$(res)/img/element-icons/warning-badge.svg");
|
||||||
|
background-size: contain;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_AccessSecretStorageDialog_reset_link {
|
.mx_AccessSecretStorageDialog_reset_link {
|
||||||
|
|
|
@ -1,42 +0,0 @@
|
||||||
/*
|
|
||||||
Copyright 2019 The Matrix.org Foundation C.I.C.
|
|
||||||
|
|
||||||
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.
|
|
||||||
*/
|
|
||||||
|
|
||||||
.mx_FormButton {
|
|
||||||
line-height: $font-16px;
|
|
||||||
padding: 5px 15px;
|
|
||||||
font-size: $font-12px;
|
|
||||||
height: min-content;
|
|
||||||
|
|
||||||
&:not(:last-child) {
|
|
||||||
margin-right: 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.mx_AccessibleButton_kind_primary {
|
|
||||||
color: $accent-color;
|
|
||||||
background-color: $accent-bg-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.mx_AccessibleButton_kind_danger {
|
|
||||||
color: $notice-primary-color;
|
|
||||||
background-color: $notice-primary-bg-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.mx_AccessibleButton_kind_secondary {
|
|
||||||
color: $secondary-fg-color;
|
|
||||||
border: 1px solid $secondary-fg-color;
|
|
||||||
background-color: unset;
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -14,6 +14,8 @@ See the License for the specific language governing permissions and
|
||||||
limitations under the License.
|
limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
$timelineImageBorderRadius: 4px;
|
||||||
|
|
||||||
.mx_MImageBody {
|
.mx_MImageBody {
|
||||||
display: block;
|
display: block;
|
||||||
margin-right: 34px;
|
margin-right: 34px;
|
||||||
|
@ -25,7 +27,11 @@ limitations under the License.
|
||||||
height: 100%;
|
height: 100%;
|
||||||
left: 0;
|
left: 0;
|
||||||
top: 0;
|
top: 0;
|
||||||
border-radius: 4px;
|
border-radius: $timelineImageBorderRadius;
|
||||||
|
|
||||||
|
> canvas {
|
||||||
|
border-radius: $timelineImageBorderRadius;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_MImageBody_thumbnail_container {
|
.mx_MImageBody_thumbnail_container {
|
||||||
|
@ -43,7 +49,7 @@ limitations under the License.
|
||||||
top: 50%;
|
top: 50%;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Inner img and TintableSvg should be centered around 0, 0
|
// Inner img should be centered around 0, 0
|
||||||
.mx_MImageBody_thumbnail_spinner > * {
|
.mx_MImageBody_thumbnail_spinner > * {
|
||||||
transform: translate(-50%, -50%);
|
transform: translate(-50%, -50%);
|
||||||
}
|
}
|
||||||
|
|
28
res/css/views/messages/_MediaBody.scss
Normal file
|
@ -0,0 +1,28 @@
|
||||||
|
/*
|
||||||
|
Copyright 2021 The Matrix.org Foundation C.I.C.
|
||||||
|
|
||||||
|
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.
|
||||||
|
*/
|
||||||
|
|
||||||
|
// A "media body" is any file upload looking thing, apart from images and videos (they
|
||||||
|
// have unique styles).
|
||||||
|
|
||||||
|
.mx_MediaBody {
|
||||||
|
background-color: $message-body-panel-bg-color;
|
||||||
|
border-radius: 12px;
|
||||||
|
|
||||||
|
color: $message-body-panel-fg-color;
|
||||||
|
font-size: $font-14px;
|
||||||
|
line-height: $font-24px;
|
||||||
|
}
|
||||||
|
|
|
@ -17,4 +17,9 @@ limitations under the License.
|
||||||
.mx_TextualEvent {
|
.mx_TextualEvent {
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
overflow-y: hidden;
|
overflow-y: hidden;
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: $accent-color;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -21,7 +21,7 @@ limitations under the License.
|
||||||
mask-image: url('$(res)/img/e2e/normal.svg');
|
mask-image: url('$(res)/img/e2e/normal.svg');
|
||||||
mask-repeat: no-repeat;
|
mask-repeat: no-repeat;
|
||||||
mask-position: center;
|
mask-position: center;
|
||||||
mask-size: 90%;
|
mask-size: 80%;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.mx_cryptoEvent_icon::after {
|
&.mx_cryptoEvent_icon::after {
|
||||||
|
@ -48,6 +48,7 @@ limitations under the License.
|
||||||
.mx_cryptoEvent_buttons {
|
.mx_cryptoEvent_buttons {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
gap: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_cryptoEvent_state {
|
.mx_cryptoEvent_state {
|
||||||
|
|
|
@ -259,16 +259,6 @@ limitations under the License.
|
||||||
|
|
||||||
.mx_AccessibleButton.mx_AccessibleButton_hasKind {
|
.mx_AccessibleButton.mx_AccessibleButton_hasKind {
|
||||||
padding: 8px 18px;
|
padding: 8px 18px;
|
||||||
|
|
||||||
&.mx_AccessibleButton_kind_primary {
|
|
||||||
color: $accent-color;
|
|
||||||
background-color: $accent-bg-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.mx_AccessibleButton_kind_danger {
|
|
||||||
color: $notice-primary-color;
|
|
||||||
background-color: $notice-primary-bg-color;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_VerificationShowSas .mx_AccessibleButton,
|
.mx_VerificationShowSas .mx_AccessibleButton,
|
||||||
|
|
|
@ -58,7 +58,7 @@ limitations under the License.
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_VerificationPanel_reciprocate_section {
|
.mx_VerificationPanel_reciprocate_section {
|
||||||
.mx_FormButton {
|
.mx_AccessibleButton {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
|
|
|
@ -45,7 +45,7 @@ limitations under the License.
|
||||||
mask-image: url('$(res)/img/e2e/normal.svg');
|
mask-image: url('$(res)/img/e2e/normal.svg');
|
||||||
mask-repeat: no-repeat;
|
mask-repeat: no-repeat;
|
||||||
mask-position: center;
|
mask-position: center;
|
||||||
mask-size: 90%;
|
mask-size: 80%;
|
||||||
}
|
}
|
||||||
|
|
||||||
// transparent-looking border surrounding the shield for when overlain over avatars
|
// transparent-looking border surrounding the shield for when overlain over avatars
|
||||||
|
@ -59,7 +59,7 @@ limitations under the License.
|
||||||
}
|
}
|
||||||
// shrink the infill of the badge
|
// shrink the infill of the badge
|
||||||
&::before {
|
&::before {
|
||||||
mask-size: 65%;
|
mask-size: 60%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -345,7 +345,7 @@ $hover-select-border: 4px;
|
||||||
mask-image: url('$(res)/img/e2e/normal.svg');
|
mask-image: url('$(res)/img/e2e/normal.svg');
|
||||||
mask-repeat: no-repeat;
|
mask-repeat: no-repeat;
|
||||||
mask-position: center;
|
mask-position: center;
|
||||||
mask-size: 90%;
|
mask-size: 80%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -477,8 +477,7 @@ $hover-select-border: 4px;
|
||||||
|
|
||||||
pre, code {
|
pre, code {
|
||||||
font-family: $monospace-font-family !important;
|
font-family: $monospace-font-family !important;
|
||||||
// deliberate constants as we're behind an invert filter
|
background-color: $header-panel-bg-color;
|
||||||
color: #333;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
pre {
|
pre {
|
||||||
|
@ -488,11 +487,6 @@ $hover-select-border: 4px;
|
||||||
overflow-x: overlay;
|
overflow-x: overlay;
|
||||||
overflow-y: visible;
|
overflow-y: visible;
|
||||||
}
|
}
|
||||||
|
|
||||||
code {
|
|
||||||
// deliberate constants as we're behind an invert filter
|
|
||||||
background-color: #f8f8f8;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_EventTile_lineNumbers {
|
.mx_EventTile_lineNumbers {
|
||||||
|
|
|
@ -29,6 +29,7 @@ $irc-line-height: $font-18px;
|
||||||
// timestamps are links which shouldn't be underlined
|
// timestamps are links which shouldn't be underlined
|
||||||
> a {
|
> a {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
min-width: 45px;
|
||||||
}
|
}
|
||||||
|
|
||||||
display: flex;
|
display: flex;
|
||||||
|
@ -49,18 +50,6 @@ $irc-line-height: $font-18px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
> .mx_SenderProfile {
|
|
||||||
order: 2;
|
|
||||||
flex-shrink: 0;
|
|
||||||
width: var(--name-width);
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
text-align: left;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
overflow: visible;
|
|
||||||
justify-content: flex-end;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mx_EventTile_line, .mx_EventTile_reply {
|
.mx_EventTile_line, .mx_EventTile_reply {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
@ -173,27 +162,37 @@ $irc-line-height: $font-18px;
|
||||||
border-left: 0;
|
border-left: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_SenderProfile_hover {
|
.mx_SenderProfile {
|
||||||
background-color: $primary-bg-color;
|
width: var(--name-width);
|
||||||
overflow: hidden;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
|
order: 2;
|
||||||
|
flex-shrink: 0;
|
||||||
|
justify-content: flex-start;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
> .mx_SenderProfile_displayName {
|
> .mx_SenderProfile_displayName {
|
||||||
|
width: 100%;
|
||||||
|
text-align: end;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
min-width: var(--name-width);
|
}
|
||||||
text-align: end;
|
|
||||||
|
> .mx_SenderProfile_mxid {
|
||||||
|
visibility: collapse;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_SenderProfile:hover {
|
.mx_SenderProfile:hover {
|
||||||
justify-content: flex-start;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mx_SenderProfile_hover:hover {
|
|
||||||
overflow: visible;
|
overflow: visible;
|
||||||
width: max(auto, 100%);
|
|
||||||
z-index: 10;
|
z-index: 10;
|
||||||
|
|
||||||
|
> .mx_SenderProfile_displayName {
|
||||||
|
overflow: visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
> .mx_SenderProfile_mxid {
|
||||||
|
visibility: visible;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_ReplyThread {
|
.mx_ReplyThread {
|
||||||
|
@ -201,16 +200,7 @@ $irc-line-height: $font-18px;
|
||||||
.mx_SenderProfile {
|
.mx_SenderProfile {
|
||||||
width: unset;
|
width: unset;
|
||||||
max-width: var(--name-width);
|
max-width: var(--name-width);
|
||||||
}
|
|
||||||
|
|
||||||
.mx_SenderProfile_hover {
|
|
||||||
background: transparent;
|
background: transparent;
|
||||||
|
|
||||||
> span {
|
|
||||||
> .mx_SenderProfile_displayName {
|
|
||||||
min-width: inherit;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_EventTile_emote {
|
.mx_EventTile_emote {
|
||||||
|
|
38
res/css/views/rooms/_LinkPreviewGroup.scss
Normal file
|
@ -0,0 +1,38 @@
|
||||||
|
/*
|
||||||
|
Copyright 2021 The Matrix.org Foundation C.I.C.
|
||||||
|
|
||||||
|
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.
|
||||||
|
*/
|
||||||
|
|
||||||
|
.mx_LinkPreviewGroup {
|
||||||
|
.mx_LinkPreviewGroup_hide {
|
||||||
|
cursor: pointer;
|
||||||
|
width: 18px;
|
||||||
|
height: 18px;
|
||||||
|
|
||||||
|
img {
|
||||||
|
flex: 0 0 40px;
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover .mx_LinkPreviewGroup_hide img,
|
||||||
|
.mx_LinkPreviewGroup_hide.focus-visible:focus img {
|
||||||
|
visibility: visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
> .mx_AccessibleButton {
|
||||||
|
color: $accent-color;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
|
@ -33,12 +33,16 @@ limitations under the License.
|
||||||
.mx_LinkPreviewWidget_caption {
|
.mx_LinkPreviewWidget_caption {
|
||||||
margin-left: 15px;
|
margin-left: 15px;
|
||||||
flex: 1 1 auto;
|
flex: 1 1 auto;
|
||||||
|
overflow-x: hidden; // cause it to wrap rather than clip
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_LinkPreviewWidget_title {
|
.mx_LinkPreviewWidget_title {
|
||||||
display: inline;
|
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
white-space: normal;
|
white-space: normal;
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-line-clamp: 2;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_LinkPreviewWidget_siteName {
|
.mx_LinkPreviewWidget_siteName {
|
||||||
|
@ -49,22 +53,9 @@ limitations under the License.
|
||||||
margin-top: 8px;
|
margin-top: 8px;
|
||||||
white-space: normal;
|
white-space: normal;
|
||||||
word-wrap: break-word;
|
word-wrap: break-word;
|
||||||
}
|
display: -webkit-box;
|
||||||
|
-webkit-line-clamp: 3;
|
||||||
.mx_LinkPreviewWidget_cancel {
|
-webkit-box-orient: vertical;
|
||||||
cursor: pointer;
|
|
||||||
width: 18px;
|
|
||||||
height: 18px;
|
|
||||||
|
|
||||||
img {
|
|
||||||
flex: 0 0 40px;
|
|
||||||
visibility: hidden;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.mx_LinkPreviewWidget:hover .mx_LinkPreviewWidget_cancel img,
|
|
||||||
.mx_LinkPreviewWidget_cancel.focus-visible:focus img {
|
|
||||||
visibility: visible;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_MatrixChat_useCompactLayout {
|
.mx_MatrixChat_useCompactLayout {
|
||||||
|
|
|
@ -36,10 +36,10 @@ limitations under the License.
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_VoiceRecordComposerTile_delete {
|
.mx_VoiceRecordComposerTile_delete {
|
||||||
width: 14px; // w&h are size of icon
|
width: 24px;
|
||||||
height: 18px;
|
height: 24px;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
margin-right: 11px; // distance from left edge of waveform container (container has some margin too)
|
margin-right: 8px; // distance from left edge of waveform container (container has some margin too)
|
||||||
background-color: $voice-record-icon-color;
|
background-color: $voice-record-icon-color;
|
||||||
mask-repeat: no-repeat;
|
mask-repeat: no-repeat;
|
||||||
mask-size: contain;
|
mask-size: contain;
|
||||||
|
|
|
@ -16,7 +16,7 @@ limitations under the License.
|
||||||
|
|
||||||
.mx_SpaceBasicSettings {
|
.mx_SpaceBasicSettings {
|
||||||
.mx_Field {
|
.mx_Field {
|
||||||
margin: 32px 0;
|
margin: 24px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_SpaceBasicSettings_avatarContainer {
|
.mx_SpaceBasicSettings_avatarContainer {
|
||||||
|
@ -73,7 +73,7 @@ limitations under the License.
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_FormButton {
|
.mx_AccessibleButton_hasKind {
|
||||||
padding: 8px 22px;
|
padding: 8px 22px;
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
display: block;
|
display: block;
|
||||||
|
|
|
@ -23,7 +23,7 @@ limitations under the License.
|
||||||
.mx_DialPad_button {
|
.mx_DialPad_button {
|
||||||
width: 40px;
|
width: 40px;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
background-color: $theme-button-bg-color;
|
background-color: $dialpad-button-bg-color;
|
||||||
border-radius: 40px;
|
border-radius: 40px;
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
|
|
|
@ -27,9 +27,22 @@ limitations under the License.
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_DialPadContextMenu_dialled {
|
.mx_DialPadContextMenu_dialled {
|
||||||
height: 1em;
|
height: 1.5em;
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
|
max-width: 150px;
|
||||||
|
border: none;
|
||||||
|
margin: 0px;
|
||||||
|
}
|
||||||
|
.mx_DialPadContextMenu_dialled input {
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: 600;
|
||||||
|
overflow: hidden;
|
||||||
|
max-width: 150px;
|
||||||
|
text-align: left;
|
||||||
|
direction: rtl;
|
||||||
|
padding: 8px 0px;
|
||||||
|
background-color: rgb(0, 0, 0, 0);
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_DialPadContextMenu_dialPad {
|
.mx_DialPadContextMenu_dialPad {
|
||||||
|
|
3
res/img/element-icons/call/dialpad.svg
Normal file
|
@ -0,0 +1,3 @@
|
||||||
|
<svg width="12" height="18" viewBox="0 0 12 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M6 14.25C5.175 14.25 4.5 14.925 4.5 15.75C4.5 16.575 5.175 17.25 6 17.25C6.825 17.25 7.5 16.575 7.5 15.75C7.5 14.925 6.825 14.25 6 14.25ZM1.5 0.75C0.675 0.75 0 1.425 0 2.25C0 3.075 0.675 3.75 1.5 3.75C2.325 3.75 3 3.075 3 2.25C3 1.425 2.325 0.75 1.5 0.75ZM1.5 5.25C0.675 5.25 0 5.925 0 6.75C0 7.575 0.675 8.25 1.5 8.25C2.325 8.25 3 7.575 3 6.75C3 5.925 2.325 5.25 1.5 5.25ZM1.5 9.75C0.675 9.75 0 10.425 0 11.25C0 12.075 0.675 12.75 1.5 12.75C2.325 12.75 3 12.075 3 11.25C3 10.425 2.325 9.75 1.5 9.75ZM10.5 3.75C11.325 3.75 12 3.075 12 2.25C12 1.425 11.325 0.75 10.5 0.75C9.675 0.75 9 1.425 9 2.25C9 3.075 9.675 3.75 10.5 3.75ZM6 9.75C5.175 9.75 4.5 10.425 4.5 11.25C4.5 12.075 5.175 12.75 6 12.75C6.825 12.75 7.5 12.075 7.5 11.25C7.5 10.425 6.825 9.75 6 9.75ZM10.5 9.75C9.675 9.75 9 10.425 9 11.25C9 12.075 9.675 12.75 10.5 12.75C11.325 12.75 12 12.075 12 11.25C12 10.425 11.325 9.75 10.5 9.75ZM10.5 5.25C9.675 5.25 9 5.925 9 6.75C9 7.575 9.675 8.25 10.5 8.25C11.325 8.25 12 7.575 12 6.75C12 5.925 11.325 5.25 10.5 5.25ZM6 5.25C5.175 5.25 4.5 5.925 4.5 6.75C4.5 7.575 5.175 8.25 6 8.25C6.825 8.25 7.5 7.575 7.5 6.75C7.5 5.925 6.825 5.25 6 5.25ZM6 0.75C5.175 0.75 4.5 1.425 4.5 2.25C4.5 3.075 5.175 3.75 6 3.75C6.825 3.75 7.5 3.075 7.5 2.25C7.5 1.425 6.825 0.75 6 0.75Z" fill="#737D8C"/>
|
||||||
|
</svg>
|
After Width: | Height: | Size: 1.4 KiB |
3
res/img/element-icons/eye.svg
Normal file
|
@ -0,0 +1,3 @@
|
||||||
|
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M14.3094 5.96587C15.3206 7.15704 15.3417 8.85457 14.3412 10.0548C13.0889 11.5571 10.9822 13.3332 8.02104 13.3332C5.05992 13.3332 2.9532 11.5571 1.70087 10.0548C0.700398 8.85457 0.721506 7.15704 1.7327 5.96587C3.01174 4.45918 5.1391 2.6665 8.02104 2.6665C10.903 2.6665 13.0303 4.45918 14.3094 5.96587ZM11.5556 7.99984C11.5556 9.96352 9.96369 11.5554 8.00001 11.5554C6.03633 11.5554 4.44446 9.96352 4.44446 7.99984C4.44446 6.03616 6.03633 4.44428 8.00001 4.44428C9.96369 4.44428 11.5556 6.03616 11.5556 7.99984ZM8.00001 9.77761C8.98185 9.77761 9.77779 8.98168 9.77779 7.99984C9.77779 7.018 8.98185 6.22206 8.00001 6.22206C7.01817 6.22206 6.22224 7.018 6.22224 7.99984C6.22224 8.98168 7.01817 9.77761 8.00001 9.77761Z" fill="white"/>
|
||||||
|
</svg>
|
After Width: | Height: | Size: 887 B |
1
res/img/element-icons/message/chevron-up.svg
Normal file
|
@ -0,0 +1 @@
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-up"><polyline points="18 15 12 9 6 15"></polyline></svg>
|
After Width: | Height: | Size: 268 B |
1
res/img/element-icons/message/corner-up-right.svg
Normal file
|
@ -0,0 +1 @@
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-corner-up-right"><polyline points="15 14 20 9 15 4"></polyline><path d="M4 20v-7a4 4 0 0 1 4-4h12"></path></svg>
|
After Width: | Height: | Size: 316 B |
3
res/img/element-icons/message/fwd.svg
Normal file
|
@ -0,0 +1,3 @@
|
||||||
|
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M10.9454 4.27941C10.653 3.98601 10.6539 3.51114 10.9472 3.21875C11.2406 2.92637 11.7155 2.92719 12.0079 3.22059L15.5312 6.75612C15.8229 7.0488 15.8229 7.52226 15.5312 7.81494L12.0079 11.3505C11.7155 11.6439 11.2407 11.6447 10.9473 11.3523C10.6539 11.06 10.653 10.5851 10.9454 10.2917L13.2292 8H6.36588C4.95064 8 3.75282 9.20272 3.75282 10.75C3.75282 12.2973 4.95064 13.5 6.36588 13.5H7.93524C8.34945 13.5 8.68524 13.8358 8.68524 14.25C8.68524 14.6642 8.34945 15 7.93524 15H6.36588C4.06634 15 2.25282 13.0687 2.25282 10.75C2.25282 8.43128 4.06634 6.5 6.36588 6.5H13.1583L10.9454 4.27941Z" fill="black"/>
|
||||||
|
</svg>
|
After Width: | Height: | Size: 755 B |
1
res/img/element-icons/message/link.svg
Normal file
|
@ -0,0 +1 @@
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-link"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path></svg>
|
After Width: | Height: | Size: 371 B |
1
res/img/element-icons/message/repeat.svg
Normal file
|
@ -0,0 +1 @@
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-repeat"><polyline points="17 1 21 5 17 9"></polyline><path d="M3 11V9a4 4 0 0 1 4-4h14"></path><polyline points="7 23 3 19 7 15"></polyline><path d="M21 13v2a4 4 0 0 1-4 4H3"></path></svg>
|
After Width: | Height: | Size: 392 B |
1
res/img/element-icons/message/share.svg
Normal file
|
@ -0,0 +1 @@
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-share"><path d="M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8"></path><polyline points="16 6 12 2 8 6"></polyline><line x1="12" y1="2" x2="12" y2="15"></line></svg>
|
After Width: | Height: | Size: 364 B |
|
@ -1,3 +1,3 @@
|
||||||
<svg width="12" height="17" viewBox="0 0 12 17" fill="none" xmlns="http://www.w3.org/2000/svg">
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
<path d="M0.857143 14.5C0.857143 15.4491 1.62857 16.5 2.57143 16.5H9.42857C10.3714 16.5 11.1429 15.2542 11.1429 14.3051V5.67692C11.1429 4.72781 10.3714 3.95128 9.42857 3.95128H2.57143C1.62857 3.95128 0.857143 4.72781 0.857143 5.67692V14.5ZM11.1429 1.36282H9L8.39143 0.750218C8.23714 0.59491 8.01429 0.5 7.79143 0.5H4.20857C3.98571 0.5 3.76286 0.59491 3.60857 0.750218L3 1.36282H0.857143C0.385714 1.36282 0 1.75109 0 2.22564C0 2.70019 0.385714 3.08846 0.857143 3.08846H11.1429C11.6143 3.08846 12 2.70019 12 2.22564C12 1.75109 11.6143 1.36282 11.1429 1.36282Z" fill="#737D8C"/>
|
<path d="M6 19C6 20.1 6.9 21 8 21H16C17.1 21 18 20.1 18 19V9C18 7.9 17.1 7 16 7H8C6.9 7 6 7.9 6 9V19ZM18 4H15.5L14.79 3.29C14.61 3.11 14.35 3 14.09 3H9.91C9.65 3 9.39 3.11 9.21 3.29L8.5 4H6C5.45 4 5 4.45 5 5C5 5.55 5.45 6 6 6H18C18.55 6 19 5.55 19 5C19 4.45 18.55 4 18 4Z" fill="#8D99A5"/>
|
||||||
</svg>
|
</svg>
|
||||||
|
|
Before Width: | Height: | Size: 679 B After Width: | Height: | Size: 397 B |
|
@ -1,5 +1,32 @@
|
||||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||||
<circle cx="8" cy="8" r="8" fill="#FF4B55"/>
|
<svg
|
||||||
<rect x="7" y="3" width="2" height="6" rx="1" fill="white"/>
|
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||||
<rect x="7" y="11" width="2" height="2" rx="1" fill="white"/>
|
xmlns:cc="http://creativecommons.org/ns#"
|
||||||
|
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||||
|
xmlns:svg="http://www.w3.org/2000/svg"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
id="svg8"
|
||||||
|
version="1.1"
|
||||||
|
fill="none"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
height="24"
|
||||||
|
width="24">
|
||||||
|
<metadata
|
||||||
|
id="metadata14">
|
||||||
|
<rdf:RDF>
|
||||||
|
<cc:Work
|
||||||
|
rdf:about="">
|
||||||
|
<dc:format>image/svg+xml</dc:format>
|
||||||
|
<dc:type
|
||||||
|
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||||
|
<dc:title></dc:title>
|
||||||
|
</cc:Work>
|
||||||
|
</rdf:RDF>
|
||||||
|
</metadata>
|
||||||
|
<defs
|
||||||
|
id="defs12" />
|
||||||
|
<path
|
||||||
|
id="path2"
|
||||||
|
d="M 12 2 C 6.47715 2 2 6.47715 2 12 C 2 17.5228 6.47715 22 12 22 C 17.5228 22 22 17.5228 22 12 C 22 6.47715 17.5228 2 12 2 z M 11.880859 5.5039062 C 12.720859 5.4439063 13.470547 6.0746875 13.560547 6.9296875 L 13.560547 7.1699219 L 13.080078 13.169922 C 13.035078 13.724922 12.570625 14.144531 12.015625 14.144531 L 11.925781 14.144531 C 11.400781 14.099531 10.996172 13.694922 10.951172 13.169922 L 10.470703 7.1699219 C 10.395703 6.3149219 11.025859 5.5639064 11.880859 5.5039062 z M 12 15.763672 C 12.729 15.763672 13.320312 16.354884 13.320312 17.083984 C 13.320313 17.812984 12.729 18.404297 12 18.404297 C 11.271 18.404297 10.679688 17.812984 10.679688 17.083984 C 10.679688 16.354884 11.271 15.763672 12 15.763672 z "
|
||||||
|
style="fill:#ff4b55;fill-opacity:1" />
|
||||||
</svg>
|
</svg>
|
||||||
|
|
Before Width: | Height: | Size: 283 B After Width: | Height: | Size: 1.5 KiB |
|
@ -118,6 +118,7 @@ $voipcall-plinth-color: #394049;
|
||||||
// ********************
|
// ********************
|
||||||
|
|
||||||
$theme-button-bg-color: #e3e8f0;
|
$theme-button-bg-color: #e3e8f0;
|
||||||
|
$dialpad-button-bg-color: #6F7882;
|
||||||
|
|
||||||
$roomlist-button-bg-color: rgba(141, 151, 165, 0.2); // Buttons include the filter box, explore button, and sublist buttons
|
$roomlist-button-bg-color: rgba(141, 151, 165, 0.2); // Buttons include the filter box, explore button, and sublist buttons
|
||||||
$roomlist-filter-active-bg-color: $bg-color;
|
$roomlist-filter-active-bg-color: $bg-color;
|
||||||
|
@ -212,8 +213,6 @@ $message-body-panel-icon-fg-color: #21262C; // "Separator"
|
||||||
$message-body-panel-icon-bg-color: $tertiary-fg-color;
|
$message-body-panel-icon-bg-color: $tertiary-fg-color;
|
||||||
|
|
||||||
$voice-record-stop-border-color: $quaternary-fg-color;
|
$voice-record-stop-border-color: $quaternary-fg-color;
|
||||||
$voice-record-waveform-bg-color: $message-body-panel-bg-color;
|
|
||||||
$voice-record-waveform-fg-color: $message-body-panel-fg-color;
|
|
||||||
$voice-record-waveform-incomplete-fg-color: $quaternary-fg-color;
|
$voice-record-waveform-incomplete-fg-color: $quaternary-fg-color;
|
||||||
$voice-record-icon-color: $quaternary-fg-color;
|
$voice-record-icon-color: $quaternary-fg-color;
|
||||||
$voice-playback-button-bg-color: $message-body-panel-icon-bg-color;
|
$voice-playback-button-bg-color: $message-body-panel-icon-bg-color;
|
||||||
|
@ -273,24 +272,7 @@ $composer-shadow-color: rgba(0, 0, 0, 0.28);
|
||||||
}
|
}
|
||||||
|
|
||||||
// markdown overrides:
|
// markdown overrides:
|
||||||
.mx_EventTile_content .markdown-body pre:hover {
|
|
||||||
border-color: #808080 !important; // inverted due to rules below
|
|
||||||
scrollbar-color: rgba(0, 0, 0, 0.2) transparent; // copied from light theme due to inversion below
|
|
||||||
// the code above works only in Firefox, this is for other browsers
|
|
||||||
// see https://developer.mozilla.org/en-US/docs/Web/CSS/scrollbar-color
|
|
||||||
&::-webkit-scrollbar-thumb {
|
|
||||||
background-color: rgba(0, 0, 0, 0.2); // copied from light theme due to inversion below
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.mx_EventTile_content .markdown-body {
|
.mx_EventTile_content .markdown-body {
|
||||||
pre, code {
|
|
||||||
filter: invert(1);
|
|
||||||
}
|
|
||||||
|
|
||||||
pre code {
|
|
||||||
filter: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
table {
|
table {
|
||||||
tr {
|
tr {
|
||||||
background-color: #000000;
|
background-color: #000000;
|
||||||
|
@ -300,18 +282,9 @@ $composer-shadow-color: rgba(0, 0, 0, 0.28);
|
||||||
background-color: #080808;
|
background-color: #080808;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
blockquote {
|
|
||||||
color: #919191;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// diff highlight colors
|
// highlight.js overrides
|
||||||
// intentionally swapped to avoid inversion
|
.hljs-tag {
|
||||||
.hljs-addition {
|
color: inherit; // Without this they'd be weirdly blue which doesn't match the theme
|
||||||
background: #fdd;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-deletion {
|
|
||||||
background: #dfd;
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -9,3 +9,4 @@
|
||||||
@import "_dark.scss";
|
@import "_dark.scss";
|
||||||
@import "../../light/css/_mods.scss";
|
@import "../../light/css/_mods.scss";
|
||||||
@import "../../../../res/css/_components.scss";
|
@import "../../../../res/css/_components.scss";
|
||||||
|
@import url("highlight.js/styles/atom-one-dark.css");
|
||||||
|
|
|
@ -20,6 +20,9 @@ $tertiary-fg-color: $primary-fg-color;
|
||||||
$primary-bg-color: $bg-color;
|
$primary-bg-color: $bg-color;
|
||||||
$muted-fg-color: $header-panel-text-primary-color;
|
$muted-fg-color: $header-panel-text-primary-color;
|
||||||
|
|
||||||
|
// Legacy theme backports
|
||||||
|
$quaternary-fg-color: #6F7882;
|
||||||
|
|
||||||
// used for dialog box text
|
// used for dialog box text
|
||||||
$light-fg-color: $header-panel-text-secondary-color;
|
$light-fg-color: $header-panel-text-secondary-color;
|
||||||
|
|
||||||
|
@ -114,6 +117,8 @@ $voipcall-plinth-color: #394049;
|
||||||
// ********************
|
// ********************
|
||||||
|
|
||||||
$theme-button-bg-color: #e3e8f0;
|
$theme-button-bg-color: #e3e8f0;
|
||||||
|
$dialpad-button-bg-color: #6F7882;
|
||||||
|
|
||||||
|
|
||||||
$roomlist-button-bg-color: #1A1D23; // Buttons include the filter box, explore button, and sublist buttons
|
$roomlist-button-bg-color: #1A1D23; // Buttons include the filter box, explore button, and sublist buttons
|
||||||
$roomlist-filter-active-bg-color: $roomlist-button-bg-color;
|
$roomlist-filter-active-bg-color: $roomlist-button-bg-color;
|
||||||
|
@ -207,8 +212,6 @@ $message-body-panel-icon-bg-color: $secondary-fg-color;
|
||||||
|
|
||||||
// See non-legacy dark for variable information
|
// See non-legacy dark for variable information
|
||||||
$voice-record-stop-border-color: #6F7882;
|
$voice-record-stop-border-color: #6F7882;
|
||||||
$voice-record-waveform-bg-color: $message-body-panel-bg-color;
|
|
||||||
$voice-record-waveform-fg-color: $message-body-panel-fg-color;
|
|
||||||
$voice-record-waveform-incomplete-fg-color: #6F7882;
|
$voice-record-waveform-incomplete-fg-color: #6F7882;
|
||||||
$voice-record-icon-color: #6F7882;
|
$voice-record-icon-color: #6F7882;
|
||||||
$voice-playback-button-bg-color: $tertiary-fg-color;
|
$voice-playback-button-bg-color: $tertiary-fg-color;
|
||||||
|
@ -246,7 +249,7 @@ $composer-shadow-color: tranparent;
|
||||||
@define-mixin mx_DialogButton_secondary {
|
@define-mixin mx_DialogButton_secondary {
|
||||||
// flip colours for the secondary ones
|
// flip colours for the secondary ones
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
border: 1px solid $accent-color ! important;
|
border: 1px solid $accent-color !important;
|
||||||
color: $accent-color;
|
color: $accent-color;
|
||||||
background-color: $button-secondary-bg-color;
|
background-color: $button-secondary-bg-color;
|
||||||
}
|
}
|
||||||
|
@ -264,18 +267,7 @@ $composer-shadow-color: tranparent;
|
||||||
}
|
}
|
||||||
|
|
||||||
// markdown overrides:
|
// markdown overrides:
|
||||||
.mx_EventTile_content .markdown-body pre:hover {
|
|
||||||
border-color: #808080 !important; // inverted due to rules below
|
|
||||||
}
|
|
||||||
.mx_EventTile_content .markdown-body {
|
.mx_EventTile_content .markdown-body {
|
||||||
pre, code {
|
|
||||||
filter: invert(1);
|
|
||||||
}
|
|
||||||
|
|
||||||
pre code {
|
|
||||||
filter: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
table {
|
table {
|
||||||
tr {
|
tr {
|
||||||
background-color: #000000;
|
background-color: #000000;
|
||||||
|
@ -287,12 +279,7 @@ $composer-shadow-color: tranparent;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// diff highlight colors
|
// highlight.js overrides:
|
||||||
// intentionally swapped to avoid inversion
|
.hljs-tag {
|
||||||
.hljs-addition {
|
color: inherit; // Without this they'd be weirdly blue which doesn't match the theme
|
||||||
background: #fdd;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-deletion {
|
|
||||||
background: #dfd;
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -4,3 +4,4 @@
|
||||||
@import "../../legacy-light/css/_legacy-light.scss";
|
@import "../../legacy-light/css/_legacy-light.scss";
|
||||||
@import "_legacy-dark.scss";
|
@import "_legacy-dark.scss";
|
||||||
@import "../../../../res/css/_components.scss";
|
@import "../../../../res/css/_components.scss";
|
||||||
|
@import url("highlight.js/styles/atom-one-dark.css");
|
||||||
|
|
|
@ -28,6 +28,9 @@ $tertiary-fg-color: $primary-fg-color;
|
||||||
$primary-bg-color: #ffffff;
|
$primary-bg-color: #ffffff;
|
||||||
$muted-fg-color: #61708b; // Commonly used in headings and relevant alt text
|
$muted-fg-color: #61708b; // Commonly used in headings and relevant alt text
|
||||||
|
|
||||||
|
// Legacy theme backports
|
||||||
|
$quaternary-fg-color: #C1C6CD;
|
||||||
|
|
||||||
// used for dialog box text
|
// used for dialog box text
|
||||||
$light-fg-color: #747474;
|
$light-fg-color: #747474;
|
||||||
|
|
||||||
|
@ -181,6 +184,8 @@ $voipcall-plinth-color: #F4F6FA;
|
||||||
// ********************
|
// ********************
|
||||||
|
|
||||||
$theme-button-bg-color: #e3e8f0;
|
$theme-button-bg-color: #e3e8f0;
|
||||||
|
$dialpad-button-bg-color: #e3e8f0;
|
||||||
|
|
||||||
|
|
||||||
$roomlist-button-bg-color: #fff; // Buttons include the filter box, explore button, and sublist buttons
|
$roomlist-button-bg-color: #fff; // Buttons include the filter box, explore button, and sublist buttons
|
||||||
$roomlist-filter-active-bg-color: $roomlist-button-bg-color;
|
$roomlist-filter-active-bg-color: $roomlist-button-bg-color;
|
||||||
|
@ -332,8 +337,6 @@ $message-body-panel-icon-bg-color: $primary-bg-color;
|
||||||
$voice-record-stop-symbol-color: #ff4b55;
|
$voice-record-stop-symbol-color: #ff4b55;
|
||||||
$voice-record-live-circle-color: #ff4b55;
|
$voice-record-live-circle-color: #ff4b55;
|
||||||
$voice-record-stop-border-color: #E3E8F0;
|
$voice-record-stop-border-color: #E3E8F0;
|
||||||
$voice-record-waveform-bg-color: $message-body-panel-bg-color;
|
|
||||||
$voice-record-waveform-fg-color: $message-body-panel-fg-color;
|
|
||||||
$voice-record-waveform-incomplete-fg-color: #C1C6CD;
|
$voice-record-waveform-incomplete-fg-color: #C1C6CD;
|
||||||
$voice-record-icon-color: $tertiary-fg-color;
|
$voice-record-icon-color: $tertiary-fg-color;
|
||||||
$voice-playback-button-bg-color: $message-body-panel-icon-bg-color;
|
$voice-playback-button-bg-color: $message-body-panel-icon-bg-color;
|
||||||
|
|
|
@ -3,3 +3,4 @@
|
||||||
@import "_fonts.scss";
|
@import "_fonts.scss";
|
||||||
@import "_legacy-light.scss";
|
@import "_legacy-light.scss";
|
||||||
@import "../../../../res/css/_components.scss";
|
@import "../../../../res/css/_components.scss";
|
||||||
|
@import url("highlight.js/styles/atom-one-light.css");
|
||||||
|
|
|
@ -173,6 +173,8 @@ $voipcall-plinth-color: #F4F6FA;
|
||||||
// ********************
|
// ********************
|
||||||
|
|
||||||
$theme-button-bg-color: #e3e8f0;
|
$theme-button-bg-color: #e3e8f0;
|
||||||
|
$dialpad-button-bg-color: #e3e8f0;
|
||||||
|
|
||||||
|
|
||||||
$roomlist-button-bg-color: rgba(141, 151, 165, 0.2); // Buttons include the filter box, explore button, and sublist buttons
|
$roomlist-button-bg-color: rgba(141, 151, 165, 0.2); // Buttons include the filter box, explore button, and sublist buttons
|
||||||
$roomlist-filter-active-bg-color: #ffffff;
|
$roomlist-filter-active-bg-color: #ffffff;
|
||||||
|
@ -333,8 +335,6 @@ $voice-record-stop-symbol-color: #ff4b55;
|
||||||
$voice-record-live-circle-color: #ff4b55;
|
$voice-record-live-circle-color: #ff4b55;
|
||||||
|
|
||||||
$voice-record-stop-border-color: #E3E8F0; // "Separator"
|
$voice-record-stop-border-color: #E3E8F0; // "Separator"
|
||||||
$voice-record-waveform-bg-color: $message-body-panel-bg-color;
|
|
||||||
$voice-record-waveform-fg-color: $message-body-panel-fg-color;
|
|
||||||
$voice-record-waveform-incomplete-fg-color: $quaternary-fg-color;
|
$voice-record-waveform-incomplete-fg-color: $quaternary-fg-color;
|
||||||
$voice-record-icon-color: $tertiary-fg-color;
|
$voice-record-icon-color: $tertiary-fg-color;
|
||||||
$voice-playback-button-bg-color: $message-body-panel-icon-bg-color;
|
$voice-playback-button-bg-color: $message-body-panel-icon-bg-color;
|
||||||
|
|
|
@ -4,3 +4,4 @@
|
||||||
@import "_light.scss";
|
@import "_light.scss";
|
||||||
@import "_mods.scss";
|
@import "_mods.scss";
|
||||||
@import "../../../../res/css/_components.scss";
|
@import "../../../../res/css/_components.scss";
|
||||||
|
@import url("highlight.js/styles/atom-one-light.css");
|
||||||
|
|
|
@ -5,4 +5,4 @@ FROM node:14-buster
|
||||||
RUN apt-get update
|
RUN apt-get update
|
||||||
RUN apt-get -y install jq build-essential python3-dev libffi-dev python-pip python-setuptools sqlite3 libssl-dev python-virtualenv libjpeg-dev libxslt1-dev uuid-runtime
|
RUN apt-get -y install jq build-essential python3-dev libffi-dev python-pip python-setuptools sqlite3 libssl-dev python-virtualenv libjpeg-dev libxslt1-dev uuid-runtime
|
||||||
# dependencies for chrome (installed by puppeteer)
|
# dependencies for chrome (installed by puppeteer)
|
||||||
RUN apt-get -y install gconf-service libasound2 libatk1.0-0 libatk-bridge2.0-0 libc6 libcairo2 libcups2 libdbus-1-3 libexpat1 libfontconfig1 libgcc1 libgconf-2-4 libgdk-pixbuf2.0-0 libglib2.0-0 libgtk-3-0 libnspr4 libpango-1.0-0 libpangocairo-1.0-0 libstdc++6 libx11-6 libx11-xcb1 libxcb1 libxcomposite1 libxcursor1 libxdamage1 libxext6 libxfixes3 libxi6 libxrandr2 libxrender1 libxss1 libxtst6 ca-certificates fonts-liberation libappindicator1 libnss3 lsb-release xdg-utils wget
|
RUN apt-get -y install gconf-service libasound2 libatk1.0-0 libatk-bridge2.0-0 libc6 libcairo2 libcups2 libdbus-1-3 libexpat1 libfontconfig1 libgbm-dev libgcc1 libgconf-2-4 libgdk-pixbuf2.0-0 libglib2.0-0 libgtk-3-0 libnspr4 libpango-1.0-0 libpangocairo-1.0-0 libstdc++6 libx11-6 libx11-xcb1 libxcb1 libxcomposite1 libxcursor1 libxdamage1 libxext6 libxfixes3 libxi6 libxrandr2 libxrender1 libxss1 libxtst6 ca-certificates fonts-liberation libappindicator1 libnss3 lsb-release xdg-utils wget
|
||||||
|
|
|
@ -6,8 +6,8 @@ scripts/fetchdep.sh matrix-org matrix-js-sdk
|
||||||
|
|
||||||
pushd matrix-js-sdk
|
pushd matrix-js-sdk
|
||||||
yarn link
|
yarn link
|
||||||
yarn install $@
|
yarn install --pure-lockfile $@
|
||||||
popd
|
popd
|
||||||
|
|
||||||
yarn link matrix-js-sdk
|
yarn link matrix-js-sdk
|
||||||
yarn install $@
|
yarn install --pure-lockfile $@
|
||||||
|
|
|
@ -13,13 +13,13 @@
|
||||||
scripts/fetchdep.sh matrix-org matrix-js-sdk
|
scripts/fetchdep.sh matrix-org matrix-js-sdk
|
||||||
pushd matrix-js-sdk
|
pushd matrix-js-sdk
|
||||||
yarn link
|
yarn link
|
||||||
yarn install
|
yarn install --pure-lockfile
|
||||||
popd
|
popd
|
||||||
|
|
||||||
# Now set up the react-sdk
|
# Now set up the react-sdk
|
||||||
yarn link matrix-js-sdk
|
yarn link matrix-js-sdk
|
||||||
yarn link
|
yarn link
|
||||||
yarn install
|
yarn install --pure-lockfile
|
||||||
yarn reskindex
|
yarn reskindex
|
||||||
|
|
||||||
# Finally, set up element-web
|
# Finally, set up element-web
|
||||||
|
@ -27,6 +27,6 @@ scripts/fetchdep.sh vector-im element-web
|
||||||
pushd element-web
|
pushd element-web
|
||||||
yarn link matrix-js-sdk
|
yarn link matrix-js-sdk
|
||||||
yarn link matrix-react-sdk
|
yarn link matrix-react-sdk
|
||||||
yarn install
|
yarn install --pure-lockfile
|
||||||
yarn build:res
|
yarn build:res
|
||||||
popd
|
popd
|
||||||
|
|
|
@ -1,8 +1,4 @@
|
||||||
#!/bin/bash
|
#!/bin/bash
|
||||||
#
|
|
||||||
# script which is run by the CI build (after `yarn test`).
|
|
||||||
#
|
|
||||||
# clones element-web develop and runs the tests against our version of react-sdk.
|
|
||||||
|
|
||||||
set -ev
|
set -ev
|
||||||
|
|
||||||
|
@ -19,7 +15,7 @@ cd element-web
|
||||||
element_web_dir=`pwd`
|
element_web_dir=`pwd`
|
||||||
CI_PACKAGE=true yarn build
|
CI_PACKAGE=true yarn build
|
||||||
cd ..
|
cd ..
|
||||||
# run end to end tests
|
# prepare end to end tests
|
||||||
pushd test/end-to-end-tests
|
pushd test/end-to-end-tests
|
||||||
ln -s $element_web_dir element/element-web
|
ln -s $element_web_dir element/element-web
|
||||||
# PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true ./install.sh
|
# PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true ./install.sh
|
||||||
|
@ -28,9 +24,4 @@ echo "--- Install synapse & other dependencies"
|
||||||
./install.sh
|
./install.sh
|
||||||
# install static webserver to server symlinked local copy of element
|
# install static webserver to server symlinked local copy of element
|
||||||
./element/install-webserver.sh
|
./element/install-webserver.sh
|
||||||
rm -r logs || true
|
|
||||||
mkdir logs
|
|
||||||
echo "+++ Running end-to-end tests"
|
|
||||||
TESTS_STARTED=1
|
|
||||||
./run.sh --no-sandbox --log-directory logs/
|
|
||||||
popd
|
popd
|
19
scripts/ci/run-end-to-end-tests.sh
Executable file
|
@ -0,0 +1,19 @@
|
||||||
|
#!/bin/bash
|
||||||
|
|
||||||
|
set -ev
|
||||||
|
|
||||||
|
handle_error() {
|
||||||
|
EXIT_CODE=$?
|
||||||
|
exit $EXIT_CODE
|
||||||
|
}
|
||||||
|
|
||||||
|
trap 'handle_error' ERR
|
||||||
|
|
||||||
|
# run end to end tests
|
||||||
|
pushd test/end-to-end-tests
|
||||||
|
rm -r logs || true
|
||||||
|
mkdir logs
|
||||||
|
echo "--- Running end-to-end tests"
|
||||||
|
TESTS_STARTED=1
|
||||||
|
./run.sh --no-sandbox --log-directory logs/
|
||||||
|
popd
|
|
@ -22,29 +22,51 @@ clone() {
|
||||||
}
|
}
|
||||||
|
|
||||||
# Try the PR author's branch in case it exists on the deps as well.
|
# Try the PR author's branch in case it exists on the deps as well.
|
||||||
# First we check if BUILDKITE_BRANCH is defined,
|
# First we check if GITHUB_HEAD_REF is defined,
|
||||||
# if it isn't we can assume this is a Netlify build
|
# Then we check if BUILDKITE_BRANCH is defined,
|
||||||
if [ -z ${BUILDKITE_BRANCH+x} ]; then
|
# if they aren't we can assume this is a Netlify build
|
||||||
# Netlify doesn't give us info about the fork so we have to get it from GitHub API
|
if [ -n "$GITHUB_HEAD_REF" ]; then
|
||||||
apiEndpoint="https://api.github.com/repos/matrix-org/matrix-react-sdk/pulls/"
|
head=$GITHUB_HEAD_REF
|
||||||
apiEndpoint+=$REVIEW_ID
|
elif [ -n "$BUILDKITE_BRANCH" ]; then
|
||||||
head=$(curl $apiEndpoint | jq -r '.head.label')
|
|
||||||
else
|
|
||||||
head=$BUILDKITE_BRANCH
|
head=$BUILDKITE_BRANCH
|
||||||
|
else
|
||||||
|
# Netlify doesn't give us info about the fork so we have to get it from GitHub API
|
||||||
|
apiEndpoint="https://api.github.com/repos/matrix-org/matrix-react-sdk/pulls/"
|
||||||
|
apiEndpoint+=$REVIEW_ID
|
||||||
|
head=$(curl $apiEndpoint | jq -r '.head.label')
|
||||||
fi
|
fi
|
||||||
|
|
||||||
# If head is set, it will contain either:
|
# If head is set, it will contain on Buildkite either:
|
||||||
# * "branch" when the author's branch and target branch are in the same repo
|
# * "branch" when the author's branch and target branch are in the same repo
|
||||||
# * "fork:branch" when the author's branch is in their fork or if this is a Netlify build
|
# * "fork:branch" when the author's branch is in their fork or if this is a Netlify build
|
||||||
# We can split on `:` into an array to check.
|
# We can split on `:` into an array to check.
|
||||||
|
# For GitHub Actions we need to inspect GITHUB_REPOSITORY and GITHUB_ACTOR
|
||||||
|
# to determine whether the branch is from a fork or not
|
||||||
BRANCH_ARRAY=(${head//:/ })
|
BRANCH_ARRAY=(${head//:/ })
|
||||||
if [[ "${#BRANCH_ARRAY[@]}" == "1" ]]; then
|
if [[ "${#BRANCH_ARRAY[@]}" == "1" ]]; then
|
||||||
clone $deforg $defrepo $BUILDKITE_BRANCH
|
|
||||||
|
if [ -n "$GITHUB_HEAD_REF" ]; then
|
||||||
|
if [[ "$GITHUB_REPOSITORY" == "$deforg"* ]]; then
|
||||||
|
clone $deforg $defrepo $GITHUB_HEAD_REF
|
||||||
|
else
|
||||||
|
REPO_ARRAY=(${GITHUB_REPOSITORY//\// })
|
||||||
|
clone $REPO_ARRAY[0] $defrepo $GITHUB_HEAD_REF
|
||||||
|
fi
|
||||||
|
else
|
||||||
|
clone $deforg $defrepo $BUILDKITE_BRANCH
|
||||||
|
fi
|
||||||
|
|
||||||
elif [[ "${#BRANCH_ARRAY[@]}" == "2" ]]; then
|
elif [[ "${#BRANCH_ARRAY[@]}" == "2" ]]; then
|
||||||
clone ${BRANCH_ARRAY[0]} $defrepo ${BRANCH_ARRAY[1]}
|
clone ${BRANCH_ARRAY[0]} $defrepo ${BRANCH_ARRAY[1]}
|
||||||
fi
|
fi
|
||||||
|
|
||||||
# Try the target branch of the push or PR.
|
# Try the target branch of the push or PR.
|
||||||
clone $deforg $defrepo $BUILDKITE_PULL_REQUEST_BASE_BRANCH
|
if [ -n $GITHUB_BASE_REF ]; then
|
||||||
|
clone $deforg $defrepo $GITHUB_BASE_REF
|
||||||
|
elif [ -n $BUILDKITE_PULL_REQUEST_BASE_BRANCH ]; then
|
||||||
|
clone $deforg $defrepo $BUILDKITE_PULL_REQUEST_BASE_BRANCH
|
||||||
|
fi
|
||||||
|
|
||||||
# Try HEAD which is the branch name in Netlify (not BRANCH which is pull/xxxx/head for PR builds)
|
# Try HEAD which is the branch name in Netlify (not BRANCH which is pull/xxxx/head for PR builds)
|
||||||
clone $deforg $defrepo $HEAD
|
clone $deforg $defrepo $HEAD
|
||||||
# Use the default branch as the last resort.
|
# Use the default branch as the last resort.
|
||||||
|
|
|
@ -1,23 +0,0 @@
|
||||||
#!/bin/sh
|
|
||||||
#
|
|
||||||
# generates .eslintignore.errorfiles to list the files which have errors in,
|
|
||||||
# so that they can be ignored in future automated linting.
|
|
||||||
|
|
||||||
out=.eslintignore.errorfiles
|
|
||||||
|
|
||||||
cd `dirname $0`/..
|
|
||||||
|
|
||||||
echo "generating $out"
|
|
||||||
|
|
||||||
{
|
|
||||||
cat <<EOF
|
|
||||||
# autogenerated file: run scripts/generate-eslint-error-ignore-file to update.
|
|
||||||
|
|
||||||
EOF
|
|
||||||
|
|
||||||
./node_modules/.bin/eslint -f json src test |
|
|
||||||
jq -r '.[] | select((.errorCount + .warningCount) > 0) | .filePath' |
|
|
||||||
sed -e 's/.*matrix-react-sdk\///';
|
|
||||||
} > "$out"
|
|
||||||
# also append rules from eslintignore file
|
|
||||||
cat .eslintignore >> $out
|
|
|
@ -17,7 +17,7 @@ limitations under the License.
|
||||||
import { JSXElementConstructor } from "react";
|
import { JSXElementConstructor } from "react";
|
||||||
|
|
||||||
// Based on https://stackoverflow.com/a/53229857/3532235
|
// Based on https://stackoverflow.com/a/53229857/3532235
|
||||||
export type Without<T, U> = {[P in Exclude<keyof T, keyof U>] ? : never};
|
export type Without<T, U> = {[P in Exclude<keyof T, keyof U>]?: never};
|
||||||
export type XOR<T, U> = (T | U) extends object ? (Without<T, U> & U) | (Without<U, T> & T) : T | U;
|
export type XOR<T, U> = (T | U) extends object ? (Without<T, U> & U) | (Without<U, T> & T) : T | U;
|
||||||
export type Writeable<T> = { -readonly [P in keyof T]: T[P] };
|
export type Writeable<T> = { -readonly [P in keyof T]: T[P] };
|
||||||
|
|
||||||
|
|
38
src/@types/diff-dom.ts
Normal file
|
@ -0,0 +1,38 @@
|
||||||
|
/*
|
||||||
|
Copyright 2021 The Matrix.org Foundation C.I.C.
|
||||||
|
|
||||||
|
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.
|
||||||
|
*/
|
||||||
|
|
||||||
|
declare module "diff-dom" {
|
||||||
|
export interface IDiff {
|
||||||
|
action: string;
|
||||||
|
name: string;
|
||||||
|
text?: string;
|
||||||
|
route: number[];
|
||||||
|
value: string;
|
||||||
|
element: unknown;
|
||||||
|
oldValue: string;
|
||||||
|
newValue: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface IOpts {
|
||||||
|
}
|
||||||
|
|
||||||
|
export class DiffDOM {
|
||||||
|
public constructor(opts?: IOpts);
|
||||||
|
public apply(tree: unknown, diffs: IDiff[]): unknown;
|
||||||
|
public undo(tree: unknown, diffs: IDiff[]): unknown;
|
||||||
|
public diff(a: HTMLElement | string, b: HTMLElement | string): IDiff[];
|
||||||
|
}
|
||||||
|
}
|
47
src/@types/global.d.ts
vendored
|
@ -16,6 +16,7 @@ limitations under the License.
|
||||||
|
|
||||||
import "matrix-js-sdk/src/@types/global"; // load matrix-js-sdk's type extensions first
|
import "matrix-js-sdk/src/@types/global"; // load matrix-js-sdk's type extensions first
|
||||||
import * as ModernizrStatic from "modernizr";
|
import * as ModernizrStatic from "modernizr";
|
||||||
|
|
||||||
import ContentMessages from "../ContentMessages";
|
import ContentMessages from "../ContentMessages";
|
||||||
import { IMatrixClientPeg } from "../MatrixClientPeg";
|
import { IMatrixClientPeg } from "../MatrixClientPeg";
|
||||||
import ToastStore from "../stores/ToastStore";
|
import ToastStore from "../stores/ToastStore";
|
||||||
|
@ -23,28 +24,29 @@ import DeviceListener from "../DeviceListener";
|
||||||
import { RoomListStoreClass } from "../stores/room-list/RoomListStore";
|
import { RoomListStoreClass } from "../stores/room-list/RoomListStore";
|
||||||
import { PlatformPeg } from "../PlatformPeg";
|
import { PlatformPeg } from "../PlatformPeg";
|
||||||
import RoomListLayoutStore from "../stores/room-list/RoomListLayoutStore";
|
import RoomListLayoutStore from "../stores/room-list/RoomListLayoutStore";
|
||||||
import {IntegrationManagers} from "../integrations/IntegrationManagers";
|
import { IntegrationManagers } from "../integrations/IntegrationManagers";
|
||||||
import {ModalManager} from "../Modal";
|
import { ModalManager } from "../Modal";
|
||||||
import SettingsStore from "../settings/SettingsStore";
|
import SettingsStore from "../settings/SettingsStore";
|
||||||
import {ActiveRoomObserver} from "../ActiveRoomObserver";
|
import { ActiveRoomObserver } from "../ActiveRoomObserver";
|
||||||
import {Notifier} from "../Notifier";
|
import { Notifier } from "../Notifier";
|
||||||
import type {Renderer} from "react-dom";
|
import type { Renderer } from "react-dom";
|
||||||
import RightPanelStore from "../stores/RightPanelStore";
|
import RightPanelStore from "../stores/RightPanelStore";
|
||||||
import WidgetStore from "../stores/WidgetStore";
|
import WidgetStore from "../stores/WidgetStore";
|
||||||
import CallHandler from "../CallHandler";
|
import CallHandler from "../CallHandler";
|
||||||
import {Analytics} from "../Analytics";
|
import { Analytics } from "../Analytics";
|
||||||
import CountlyAnalytics from "../CountlyAnalytics";
|
import CountlyAnalytics from "../CountlyAnalytics";
|
||||||
import UserActivity from "../UserActivity";
|
import UserActivity from "../UserActivity";
|
||||||
import {ModalWidgetStore} from "../stores/ModalWidgetStore";
|
import { ModalWidgetStore } from "../stores/ModalWidgetStore";
|
||||||
import { WidgetLayoutStore } from "../stores/widgets/WidgetLayoutStore";
|
import { WidgetLayoutStore } from "../stores/widgets/WidgetLayoutStore";
|
||||||
import VoipUserMapper from "../VoipUserMapper";
|
import VoipUserMapper from "../VoipUserMapper";
|
||||||
import {SpaceStoreClass} from "../stores/SpaceStore";
|
import { SpaceStoreClass } from "../stores/SpaceStore";
|
||||||
import TypingStore from "../stores/TypingStore";
|
import TypingStore from "../stores/TypingStore";
|
||||||
import { EventIndexPeg } from "../indexing/EventIndexPeg";
|
import { EventIndexPeg } from "../indexing/EventIndexPeg";
|
||||||
import {VoiceRecordingStore} from "../stores/VoiceRecordingStore";
|
import { VoiceRecordingStore } from "../stores/VoiceRecordingStore";
|
||||||
import PerformanceMonitor from "../performance";
|
import PerformanceMonitor from "../performance";
|
||||||
import UIStore from "../stores/UIStore";
|
import UIStore from "../stores/UIStore";
|
||||||
import { SetupEncryptionStore } from "../stores/SetupEncryptionStore";
|
import { SetupEncryptionStore } from "../stores/SetupEncryptionStore";
|
||||||
|
import { RoomScrollStateStore } from "../stores/RoomScrollStateStore";
|
||||||
|
|
||||||
declare global {
|
declare global {
|
||||||
interface Window {
|
interface Window {
|
||||||
|
@ -86,6 +88,7 @@ declare global {
|
||||||
mxPerformanceEntryNames: any;
|
mxPerformanceEntryNames: any;
|
||||||
mxUIStore: UIStore;
|
mxUIStore: UIStore;
|
||||||
mxSetupEncryptionStore?: SetupEncryptionStore;
|
mxSetupEncryptionStore?: SetupEncryptionStore;
|
||||||
|
mxRoomScrollStateStore?: RoomScrollStateStore;
|
||||||
}
|
}
|
||||||
|
|
||||||
interface Document {
|
interface Document {
|
||||||
|
@ -113,19 +116,6 @@ declare global {
|
||||||
usageDetails?: {[key: string]: number};
|
usageDetails?: {[key: string]: number};
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface ISettledFulfilled<T> {
|
|
||||||
status: "fulfilled";
|
|
||||||
value: T;
|
|
||||||
}
|
|
||||||
export interface ISettledRejected {
|
|
||||||
status: "rejected";
|
|
||||||
reason: any;
|
|
||||||
}
|
|
||||||
|
|
||||||
interface PromiseConstructor {
|
|
||||||
allSettled<T>(promises: Promise<T>[]): Promise<Array<ISettledFulfilled<T> | ISettledRejected>>;
|
|
||||||
}
|
|
||||||
|
|
||||||
interface HTMLAudioElement {
|
interface HTMLAudioElement {
|
||||||
type?: string;
|
type?: string;
|
||||||
// sinkId & setSinkId are experimental and typescript doesn't know about them
|
// sinkId & setSinkId are experimental and typescript doesn't know about them
|
||||||
|
@ -140,11 +130,24 @@ declare global {
|
||||||
setSinkId(outputId: string);
|
setSinkId(outputId: string);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Add Chrome-specific `instant` ScrollBehaviour
|
||||||
|
type _ScrollBehavior = ScrollBehavior | "instant";
|
||||||
|
|
||||||
|
interface _ScrollOptions {
|
||||||
|
behavior?: _ScrollBehavior;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface _ScrollIntoViewOptions extends _ScrollOptions {
|
||||||
|
block?: ScrollLogicalPosition;
|
||||||
|
inline?: ScrollLogicalPosition;
|
||||||
|
}
|
||||||
|
|
||||||
interface Element {
|
interface Element {
|
||||||
// Safari & IE11 only have this prefixed: we used prefixed versions
|
// Safari & IE11 only have this prefixed: we used prefixed versions
|
||||||
// previously so let's continue to support them for now
|
// previously so let's continue to support them for now
|
||||||
webkitRequestFullScreen(options?: FullscreenOptions): Promise<void>;
|
webkitRequestFullScreen(options?: FullscreenOptions): Promise<void>;
|
||||||
msRequestFullscreen(options?: FullscreenOptions): Promise<void>;
|
msRequestFullscreen(options?: FullscreenOptions): Promise<void>;
|
||||||
|
scrollIntoView(arg?: boolean | _ScrollIntoViewOptions): void;
|
||||||
}
|
}
|
||||||
|
|
||||||
interface Error {
|
interface Error {
|
||||||
|
|
|
@ -16,12 +16,12 @@ See the License for the specific language governing permissions and
|
||||||
limitations under the License.
|
limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import {MatrixClientPeg} from './MatrixClientPeg';
|
import { MatrixClientPeg } from './MatrixClientPeg';
|
||||||
import * as sdk from './index';
|
import * as sdk from './index';
|
||||||
import Modal from './Modal';
|
import Modal from './Modal';
|
||||||
import { _t } from './languageHandler';
|
import { _t } from './languageHandler';
|
||||||
import IdentityAuthClient from './IdentityAuthClient';
|
import IdentityAuthClient from './IdentityAuthClient';
|
||||||
import {SSOAuthEntry} from "./components/views/auth/InteractiveAuthEntryComponents";
|
import { SSOAuthEntry } from "./components/views/auth/InteractiveAuthEntryComponents";
|
||||||
|
|
||||||
function getIdServerDomain() {
|
function getIdServerDomain() {
|
||||||
return MatrixClientPeg.get().idBaseUrl.split("://")[1];
|
return MatrixClientPeg.get().idBaseUrl.split("://")[1];
|
||||||
|
@ -189,7 +189,6 @@ export default class AddThreepid {
|
||||||
// pop up an interactive auth dialog
|
// pop up an interactive auth dialog
|
||||||
const InteractiveAuthDialog = sdk.getComponent("dialogs.InteractiveAuthDialog");
|
const InteractiveAuthDialog = sdk.getComponent("dialogs.InteractiveAuthDialog");
|
||||||
|
|
||||||
|
|
||||||
const dialogAesthetics = {
|
const dialogAesthetics = {
|
||||||
[SSOAuthEntry.PHASE_PREAUTH]: {
|
[SSOAuthEntry.PHASE_PREAUTH]: {
|
||||||
title: _t("Use Single Sign On to continue"),
|
title: _t("Use Single Sign On to continue"),
|
||||||
|
|
|
@ -17,7 +17,7 @@ limitations under the License.
|
||||||
|
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
|
||||||
import {getCurrentLanguage, _t, _td, IVariables} from './languageHandler';
|
import { getCurrentLanguage, _t, _td, IVariables } from './languageHandler';
|
||||||
import PlatformPeg from './PlatformPeg';
|
import PlatformPeg from './PlatformPeg';
|
||||||
import SdkConfig from './SdkConfig';
|
import SdkConfig from './SdkConfig';
|
||||||
import Modal from './Modal';
|
import Modal from './Modal';
|
||||||
|
@ -390,6 +390,7 @@ export class Analytics {
|
||||||
{ expl: _td('Your device resolution'), value: resolution },
|
{ expl: _td('Your device resolution'), value: resolution },
|
||||||
];
|
];
|
||||||
|
|
||||||
|
// FIXME: Using an import will result in test failures
|
||||||
const ErrorDialog = sdk.getComponent('dialogs.ErrorDialog');
|
const ErrorDialog = sdk.getComponent('dialogs.ErrorDialog');
|
||||||
Modal.createTrackedDialog('Analytics Details', '', ErrorDialog, {
|
Modal.createTrackedDialog('Analytics Details', '', ErrorDialog, {
|
||||||
title: _t('Analytics'),
|
title: _t('Analytics'),
|
||||||
|
|
|
@ -77,6 +77,7 @@ export default class AsyncWrapper extends React.Component<IProps, IState> {
|
||||||
const Component = this.state.component;
|
const Component = this.state.component;
|
||||||
return <Component {...this.props} />;
|
return <Component {...this.props} />;
|
||||||
} else if (this.state.error) {
|
} else if (this.state.error) {
|
||||||
|
// FIXME: Using an import will result in test failures
|
||||||
const BaseDialog = sdk.getComponent('views.dialogs.BaseDialog');
|
const BaseDialog = sdk.getComponent('views.dialogs.BaseDialog');
|
||||||
const DialogButtons = sdk.getComponent('views.elements.DialogButtons');
|
const DialogButtons = sdk.getComponent('views.elements.DialogButtons');
|
||||||
return <BaseDialog onFinished={this.props.onFinished} title={_t("Error")}>
|
return <BaseDialog onFinished={this.props.onFinished} title={_t("Error")}>
|
||||||
|
|
|
@ -17,13 +17,12 @@ limitations under the License.
|
||||||
import { RoomMember } from "matrix-js-sdk/src/models/room-member";
|
import { RoomMember } from "matrix-js-sdk/src/models/room-member";
|
||||||
import { User } from "matrix-js-sdk/src/models/user";
|
import { User } from "matrix-js-sdk/src/models/user";
|
||||||
import { Room } from "matrix-js-sdk/src/models/room";
|
import { Room } from "matrix-js-sdk/src/models/room";
|
||||||
|
import { ResizeMethod } from "matrix-js-sdk/src/@types/partials";
|
||||||
|
|
||||||
import DMRoomMap from './utils/DMRoomMap';
|
import DMRoomMap from './utils/DMRoomMap';
|
||||||
import { mediaFromMxc } from "./customisations/Media";
|
import { mediaFromMxc } from "./customisations/Media";
|
||||||
import SettingsStore from "./settings/SettingsStore";
|
import SettingsStore from "./settings/SettingsStore";
|
||||||
|
|
||||||
export type ResizeMethod = "crop" | "scale";
|
|
||||||
|
|
||||||
// Not to be used for BaseAvatar urls as that has similar default avatar fallback already
|
// Not to be used for BaseAvatar urls as that has similar default avatar fallback already
|
||||||
export function avatarUrlForMember(
|
export function avatarUrlForMember(
|
||||||
member: RoomMember,
|
member: RoomMember,
|
||||||
|
|
|
@ -17,16 +17,16 @@ See the License for the specific language governing permissions and
|
||||||
limitations under the License.
|
limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import {MatrixClient} from "matrix-js-sdk/src/client";
|
import { MatrixClient } from "matrix-js-sdk/src/client";
|
||||||
import {encodeUnpaddedBase64} from "matrix-js-sdk/src/crypto/olmlib";
|
import { encodeUnpaddedBase64 } from "matrix-js-sdk/src/crypto/olmlib";
|
||||||
import dis from './dispatcher/dispatcher';
|
import dis from './dispatcher/dispatcher';
|
||||||
import BaseEventIndexManager from './indexing/BaseEventIndexManager';
|
import BaseEventIndexManager from './indexing/BaseEventIndexManager';
|
||||||
import {ActionPayload} from "./dispatcher/payloads";
|
import { ActionPayload } from "./dispatcher/payloads";
|
||||||
import {CheckUpdatesPayload} from "./dispatcher/payloads/CheckUpdatesPayload";
|
import { CheckUpdatesPayload } from "./dispatcher/payloads/CheckUpdatesPayload";
|
||||||
import {Action} from "./dispatcher/actions";
|
import { Action } from "./dispatcher/actions";
|
||||||
import {hideToast as hideUpdateToast} from "./toasts/UpdateToast";
|
import { hideToast as hideUpdateToast } from "./toasts/UpdateToast";
|
||||||
import {MatrixClientPeg} from "./MatrixClientPeg";
|
import { MatrixClientPeg } from "./MatrixClientPeg";
|
||||||
import {idbLoad, idbSave, idbDelete} from "./utils/StorageManager";
|
import { idbLoad, idbSave, idbDelete } from "./utils/StorageManager";
|
||||||
|
|
||||||
export const SSO_HOMESERVER_URL_KEY = "mx_sso_hs_url";
|
export const SSO_HOMESERVER_URL_KEY = "mx_sso_hs_url";
|
||||||
export const SSO_ID_SERVER_URL_KEY = "mx_sso_is_url";
|
export const SSO_ID_SERVER_URL_KEY = "mx_sso_is_url";
|
||||||
|
@ -335,7 +335,7 @@ export default abstract class BasePlatform {
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const key = await crypto.subtle.decrypt(
|
const key = await crypto.subtle.decrypt(
|
||||||
{name: "AES-GCM", iv: data.iv, additionalData}, data.cryptoKey,
|
{ name: "AES-GCM", iv: data.iv, additionalData }, data.cryptoKey,
|
||||||
data.encrypted,
|
data.encrypted,
|
||||||
);
|
);
|
||||||
return encodeUnpaddedBase64(key);
|
return encodeUnpaddedBase64(key);
|
||||||
|
@ -348,7 +348,7 @@ export default abstract class BasePlatform {
|
||||||
/**
|
/**
|
||||||
* Create and store a pickle key for encrypting libolm objects.
|
* Create and store a pickle key for encrypting libolm objects.
|
||||||
* @param {string} userId the user ID for the user that the pickle key is for.
|
* @param {string} userId the user ID for the user that the pickle key is for.
|
||||||
* @param {string} userId the device ID that the pickle key is for.
|
* @param {string} deviceId the device ID that the pickle key is for.
|
||||||
* @returns {string|null} the pickle key, or null if the platform does not
|
* @returns {string|null} the pickle key, or null if the platform does not
|
||||||
* support storing pickle keys.
|
* support storing pickle keys.
|
||||||
*/
|
*/
|
||||||
|
@ -360,7 +360,7 @@ export default abstract class BasePlatform {
|
||||||
const randomArray = new Uint8Array(32);
|
const randomArray = new Uint8Array(32);
|
||||||
crypto.getRandomValues(randomArray);
|
crypto.getRandomValues(randomArray);
|
||||||
const cryptoKey = await crypto.subtle.generateKey(
|
const cryptoKey = await crypto.subtle.generateKey(
|
||||||
{name: "AES-GCM", length: 256}, false, ["encrypt", "decrypt"],
|
{ name: "AES-GCM", length: 256 }, false, ["encrypt", "decrypt"],
|
||||||
);
|
);
|
||||||
const iv = new Uint8Array(32);
|
const iv = new Uint8Array(32);
|
||||||
crypto.getRandomValues(iv);
|
crypto.getRandomValues(iv);
|
||||||
|
@ -375,11 +375,11 @@ export default abstract class BasePlatform {
|
||||||
}
|
}
|
||||||
|
|
||||||
const encrypted = await crypto.subtle.encrypt(
|
const encrypted = await crypto.subtle.encrypt(
|
||||||
{name: "AES-GCM", iv, additionalData}, cryptoKey, randomArray,
|
{ name: "AES-GCM", iv, additionalData }, cryptoKey, randomArray,
|
||||||
);
|
);
|
||||||
|
|
||||||
try {
|
try {
|
||||||
await idbSave("pickleKey", [userId, deviceId], {encrypted, iv, cryptoKey});
|
await idbSave("pickleKey", [userId, deviceId], { encrypted, iv, cryptoKey });
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
|
|
@ -55,7 +55,7 @@ limitations under the License.
|
||||||
|
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
|
||||||
import {MatrixClientPeg} from './MatrixClientPeg';
|
import { MatrixClientPeg } from './MatrixClientPeg';
|
||||||
import PlatformPeg from './PlatformPeg';
|
import PlatformPeg from './PlatformPeg';
|
||||||
import Modal from './Modal';
|
import Modal from './Modal';
|
||||||
import { _t } from './languageHandler';
|
import { _t } from './languageHandler';
|
||||||
|
@ -63,11 +63,11 @@ import dis from './dispatcher/dispatcher';
|
||||||
import WidgetUtils from './utils/WidgetUtils';
|
import WidgetUtils from './utils/WidgetUtils';
|
||||||
import WidgetEchoStore from './stores/WidgetEchoStore';
|
import WidgetEchoStore from './stores/WidgetEchoStore';
|
||||||
import SettingsStore from './settings/SettingsStore';
|
import SettingsStore from './settings/SettingsStore';
|
||||||
import {Jitsi} from "./widgets/Jitsi";
|
import { Jitsi } from "./widgets/Jitsi";
|
||||||
import {WidgetType} from "./widgets/WidgetType";
|
import { WidgetType } from "./widgets/WidgetType";
|
||||||
import {SettingLevel} from "./settings/SettingLevel";
|
import { SettingLevel } from "./settings/SettingLevel";
|
||||||
import { ActionPayload } from "./dispatcher/payloads";
|
import { ActionPayload } from "./dispatcher/payloads";
|
||||||
import {base32} from "rfc4648";
|
import { base32 } from "rfc4648";
|
||||||
|
|
||||||
import QuestionDialog from "./components/views/dialogs/QuestionDialog";
|
import QuestionDialog from "./components/views/dialogs/QuestionDialog";
|
||||||
import ErrorDialog from "./components/views/dialogs/ErrorDialog";
|
import ErrorDialog from "./components/views/dialogs/ErrorDialog";
|
||||||
|
@ -77,10 +77,10 @@ import { ElementWidgetActions } from "./stores/widgets/ElementWidgetActions";
|
||||||
import { MatrixCall, CallErrorCode, CallState, CallEvent, CallParty, CallType } from "matrix-js-sdk/src/webrtc/call";
|
import { MatrixCall, CallErrorCode, CallState, CallEvent, CallParty, CallType } from "matrix-js-sdk/src/webrtc/call";
|
||||||
import Analytics from './Analytics';
|
import Analytics from './Analytics';
|
||||||
import CountlyAnalytics from "./CountlyAnalytics";
|
import CountlyAnalytics from "./CountlyAnalytics";
|
||||||
import {UIFeature} from "./settings/UIFeature";
|
import { UIFeature } from "./settings/UIFeature";
|
||||||
import { CallError } from "matrix-js-sdk/src/webrtc/call";
|
import { CallError } from "matrix-js-sdk/src/webrtc/call";
|
||||||
import { logger } from 'matrix-js-sdk/src/logger';
|
import { logger } from 'matrix-js-sdk/src/logger';
|
||||||
import DesktopCapturerSourcePicker from "./components/views/elements/DesktopCapturerSourcePicker"
|
import DesktopCapturerSourcePicker from "./components/views/elements/DesktopCapturerSourcePicker";
|
||||||
import { Action } from './dispatcher/actions';
|
import { Action } from './dispatcher/actions';
|
||||||
import VoipUserMapper from './VoipUserMapper';
|
import VoipUserMapper from './VoipUserMapper';
|
||||||
import { addManagedHybridWidget, isManagedHybridWidgetEnabled } from './widgets/ManagedHybrid';
|
import { addManagedHybridWidget, isManagedHybridWidgetEnabled } from './widgets/ManagedHybrid';
|
||||||
|
@ -124,9 +124,9 @@ interface ThirdpartyLookupResponseFields {
|
||||||
}
|
}
|
||||||
|
|
||||||
interface ThirdpartyLookupResponse {
|
interface ThirdpartyLookupResponse {
|
||||||
userid: string,
|
userid: string;
|
||||||
protocol: string,
|
protocol: string;
|
||||||
fields: ThirdpartyLookupResponseFields,
|
fields: ThirdpartyLookupResponseFields;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Unlike 'CallType' in js-sdk, this one includes screen sharing
|
// Unlike 'CallType' in js-sdk, this one includes screen sharing
|
||||||
|
@ -166,7 +166,7 @@ export default class CallHandler extends EventEmitter {
|
||||||
|
|
||||||
static sharedInstance() {
|
static sharedInstance() {
|
||||||
if (!window.mxCallHandler) {
|
if (!window.mxCallHandler) {
|
||||||
window.mxCallHandler = new CallHandler()
|
window.mxCallHandler = new CallHandler();
|
||||||
}
|
}
|
||||||
|
|
||||||
return window.mxCallHandler;
|
return window.mxCallHandler;
|
||||||
|
@ -185,7 +185,7 @@ export default class CallHandler extends EventEmitter {
|
||||||
const nativeUser = this.assertedIdentityNativeUsers[call.callId];
|
const nativeUser = this.assertedIdentityNativeUsers[call.callId];
|
||||||
if (nativeUser) {
|
if (nativeUser) {
|
||||||
const room = findDMForUser(MatrixClientPeg.get(), nativeUser);
|
const room = findDMForUser(MatrixClientPeg.get(), nativeUser);
|
||||||
if (room) return room.roomId
|
if (room) return room.roomId;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -238,7 +238,7 @@ export default class CallHandler extends EventEmitter {
|
||||||
this.supportsPstnProtocol = null;
|
this.supportsPstnProtocol = null;
|
||||||
}
|
}
|
||||||
|
|
||||||
dis.dispatch({action: Action.PstnSupportUpdated});
|
dis.dispatch({ action: Action.PstnSupportUpdated });
|
||||||
|
|
||||||
if (protocols[PROTOCOL_SIP_NATIVE] !== undefined && protocols[PROTOCOL_SIP_VIRTUAL] !== undefined) {
|
if (protocols[PROTOCOL_SIP_NATIVE] !== undefined && protocols[PROTOCOL_SIP_VIRTUAL] !== undefined) {
|
||||||
this.supportsSipNativeVirtual = Boolean(
|
this.supportsSipNativeVirtual = Boolean(
|
||||||
|
@ -246,7 +246,7 @@ export default class CallHandler extends EventEmitter {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
dis.dispatch({action: Action.VirtualRoomSupportUpdated});
|
dis.dispatch({ action: Action.VirtualRoomSupportUpdated });
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
if (maxTries === 1) {
|
if (maxTries === 1) {
|
||||||
console.log("Failed to check for protocol support and no retries remain: assuming no support", e);
|
console.log("Failed to check for protocol support and no retries remain: assuming no support", e);
|
||||||
|
@ -299,7 +299,7 @@ export default class CallHandler extends EventEmitter {
|
||||||
action: 'incoming_call',
|
action: 'incoming_call',
|
||||||
call: call,
|
call: call,
|
||||||
}, true);
|
}, true);
|
||||||
}
|
};
|
||||||
|
|
||||||
getCallForRoom(roomId: string): MatrixCall {
|
getCallForRoom(roomId: string): MatrixCall {
|
||||||
return this.calls.get(roomId) || null;
|
return this.calls.get(roomId) || null;
|
||||||
|
@ -711,7 +711,7 @@ export default class CallHandler extends EventEmitter {
|
||||||
|
|
||||||
call.placeScreenSharingCall(
|
call.placeScreenSharingCall(
|
||||||
async (): Promise<DesktopCapturerSource> => {
|
async (): Promise<DesktopCapturerSource> => {
|
||||||
const {finished} = Modal.createDialog(DesktopCapturerSourcePicker);
|
const { finished } = Modal.createDialog(DesktopCapturerSourcePicker);
|
||||||
const [source] = await finished;
|
const [source] = await finished;
|
||||||
return source;
|
return source;
|
||||||
},
|
},
|
||||||
|
@ -816,7 +816,7 @@ export default class CallHandler extends EventEmitter {
|
||||||
|
|
||||||
Analytics.trackEvent('voip', 'receiveCall', 'type', call.type);
|
Analytics.trackEvent('voip', 'receiveCall', 'type', call.type);
|
||||||
console.log("Adding call for room ", mappedRoomId);
|
console.log("Adding call for room ", mappedRoomId);
|
||||||
this.calls.set(mappedRoomId, call)
|
this.calls.set(mappedRoomId, call);
|
||||||
this.emit(CallHandlerEvent.CallsChanged, this.calls);
|
this.emit(CallHandlerEvent.CallsChanged, this.calls);
|
||||||
this.setCallListeners(call);
|
this.setCallListeners(call);
|
||||||
|
|
||||||
|
@ -872,7 +872,7 @@ export default class CallHandler extends EventEmitter {
|
||||||
this.dialNumber(payload.number);
|
this.dialNumber(payload.number);
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
}
|
};
|
||||||
|
|
||||||
private async dialNumber(number: string) {
|
private async dialNumber(number: string) {
|
||||||
const results = await this.pstnLookup(number);
|
const results = await this.pstnLookup(number);
|
||||||
|
@ -966,7 +966,7 @@ export default class CallHandler extends EventEmitter {
|
||||||
confId = 'Jitsi' + random;
|
confId = 'Jitsi' + random;
|
||||||
}
|
}
|
||||||
|
|
||||||
let widgetUrl = WidgetUtils.getLocalJitsiWrapperUrl({auth: jitsiAuth});
|
let widgetUrl = WidgetUtils.getLocalJitsiWrapperUrl({ auth: jitsiAuth });
|
||||||
|
|
||||||
// TODO: Remove URL hacks when the mobile clients eventually support v2 widgets
|
// TODO: Remove URL hacks when the mobile clients eventually support v2 widgets
|
||||||
const parsedUrl = new URL(widgetUrl);
|
const parsedUrl = new URL(widgetUrl);
|
||||||
|
|
|
@ -1,85 +0,0 @@
|
||||||
/*
|
|
||||||
Copyright 2017 Michael Telatynski <7t3chguy@gmail.com>
|
|
||||||
|
|
||||||
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 SettingsStore from "./settings/SettingsStore";
|
|
||||||
import {SettingLevel} from "./settings/SettingLevel";
|
|
||||||
import {setMatrixCallAudioInput, setMatrixCallVideoInput} from "matrix-js-sdk/src/matrix";
|
|
||||||
|
|
||||||
export default {
|
|
||||||
hasAnyLabeledDevices: async function() {
|
|
||||||
const devices = await navigator.mediaDevices.enumerateDevices();
|
|
||||||
return devices.some(d => !!d.label);
|
|
||||||
},
|
|
||||||
|
|
||||||
getDevices: function() {
|
|
||||||
// Only needed for Electron atm, though should work in modern browsers
|
|
||||||
// once permission has been granted to the webapp
|
|
||||||
return navigator.mediaDevices.enumerateDevices().then(function(devices) {
|
|
||||||
const audiooutput = [];
|
|
||||||
const audioinput = [];
|
|
||||||
const videoinput = [];
|
|
||||||
|
|
||||||
devices.forEach((device) => {
|
|
||||||
switch (device.kind) {
|
|
||||||
case 'audiooutput': audiooutput.push(device); break;
|
|
||||||
case 'audioinput': audioinput.push(device); break;
|
|
||||||
case 'videoinput': videoinput.push(device); break;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// console.log("Loaded WebRTC Devices", mediaDevices);
|
|
||||||
return {
|
|
||||||
audiooutput,
|
|
||||||
audioinput,
|
|
||||||
videoinput,
|
|
||||||
};
|
|
||||||
}, (error) => { console.log('Unable to refresh WebRTC Devices: ', error); });
|
|
||||||
},
|
|
||||||
|
|
||||||
loadDevices: function() {
|
|
||||||
const audioDeviceId = SettingsStore.getValue("webrtc_audioinput");
|
|
||||||
const videoDeviceId = SettingsStore.getValue("webrtc_videoinput");
|
|
||||||
|
|
||||||
setMatrixCallAudioInput(audioDeviceId);
|
|
||||||
setMatrixCallVideoInput(videoDeviceId);
|
|
||||||
},
|
|
||||||
|
|
||||||
setAudioOutput: function(deviceId) {
|
|
||||||
SettingsStore.setValue("webrtc_audiooutput", null, SettingLevel.DEVICE, deviceId);
|
|
||||||
},
|
|
||||||
|
|
||||||
setAudioInput: function(deviceId) {
|
|
||||||
SettingsStore.setValue("webrtc_audioinput", null, SettingLevel.DEVICE, deviceId);
|
|
||||||
setMatrixCallAudioInput(deviceId);
|
|
||||||
},
|
|
||||||
|
|
||||||
setVideoInput: function(deviceId) {
|
|
||||||
SettingsStore.setValue("webrtc_videoinput", null, SettingLevel.DEVICE, deviceId);
|
|
||||||
setMatrixCallVideoInput(deviceId);
|
|
||||||
},
|
|
||||||
|
|
||||||
getAudioOutput: function() {
|
|
||||||
return SettingsStore.getValueAt(SettingLevel.DEVICE, "webrtc_audiooutput");
|
|
||||||
},
|
|
||||||
|
|
||||||
getAudioInput: function() {
|
|
||||||
return SettingsStore.getValueAt(SettingLevel.DEVICE, "webrtc_audioinput");
|
|
||||||
},
|
|
||||||
|
|
||||||
getVideoInput: function() {
|
|
||||||
return SettingsStore.getValueAt(SettingLevel.DEVICE, "webrtc_videoinput");
|
|
||||||
},
|
|
||||||
};
|
|
|
@ -17,9 +17,10 @@ limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React from "react";
|
import React from "react";
|
||||||
|
import { encode } from "blurhash";
|
||||||
|
import { MatrixClient } from "matrix-js-sdk/src/client";
|
||||||
|
|
||||||
import dis from './dispatcher/dispatcher';
|
import dis from './dispatcher/dispatcher';
|
||||||
import {MatrixClientPeg} from './MatrixClientPeg';
|
|
||||||
import {MatrixClient} from "matrix-js-sdk/src/client";
|
|
||||||
import * as sdk from './index';
|
import * as sdk from './index';
|
||||||
import { _t } from './languageHandler';
|
import { _t } from './languageHandler';
|
||||||
import Modal from './Modal';
|
import Modal from './Modal';
|
||||||
|
@ -37,7 +38,7 @@ import {
|
||||||
UploadProgressPayload,
|
UploadProgressPayload,
|
||||||
UploadStartedPayload,
|
UploadStartedPayload,
|
||||||
} from "./dispatcher/payloads/UploadPayload";
|
} from "./dispatcher/payloads/UploadPayload";
|
||||||
import {IUpload} from "./models/IUpload";
|
import { IUpload } from "./models/IUpload";
|
||||||
import { IImageInfo } from "matrix-js-sdk/src/@types/partials";
|
import { IImageInfo } from "matrix-js-sdk/src/@types/partials";
|
||||||
|
|
||||||
const MAX_WIDTH = 800;
|
const MAX_WIDTH = 800;
|
||||||
|
@ -47,6 +48,8 @@ const MAX_HEIGHT = 600;
|
||||||
// 5669 px (x-axis) , 5669 px (y-axis) , per metre
|
// 5669 px (x-axis) , 5669 px (y-axis) , per metre
|
||||||
const PHYS_HIDPI = [0x00, 0x00, 0x16, 0x25, 0x00, 0x00, 0x16, 0x25, 0x01];
|
const PHYS_HIDPI = [0x00, 0x00, 0x16, 0x25, 0x00, 0x00, 0x16, 0x25, 0x01];
|
||||||
|
|
||||||
|
export const BLURHASH_FIELD = "xyz.amorgan.blurhash"; // MSC2448
|
||||||
|
|
||||||
export class UploadCanceledError extends Error {}
|
export class UploadCanceledError extends Error {}
|
||||||
|
|
||||||
type ThumbnailableElement = HTMLImageElement | HTMLVideoElement;
|
type ThumbnailableElement = HTMLImageElement | HTMLVideoElement;
|
||||||
|
@ -77,6 +80,7 @@ interface IThumbnail {
|
||||||
};
|
};
|
||||||
w: number;
|
w: number;
|
||||||
h: number;
|
h: number;
|
||||||
|
[BLURHASH_FIELD]: string;
|
||||||
};
|
};
|
||||||
thumbnail: Blob;
|
thumbnail: Blob;
|
||||||
}
|
}
|
||||||
|
@ -124,7 +128,17 @@ function createThumbnail(
|
||||||
const canvas = document.createElement("canvas");
|
const canvas = document.createElement("canvas");
|
||||||
canvas.width = targetWidth;
|
canvas.width = targetWidth;
|
||||||
canvas.height = targetHeight;
|
canvas.height = targetHeight;
|
||||||
canvas.getContext("2d").drawImage(element, 0, 0, targetWidth, targetHeight);
|
const context = canvas.getContext("2d");
|
||||||
|
context.drawImage(element, 0, 0, targetWidth, targetHeight);
|
||||||
|
const imageData = context.getImageData(0, 0, targetWidth, targetHeight);
|
||||||
|
const blurhash = encode(
|
||||||
|
imageData.data,
|
||||||
|
imageData.width,
|
||||||
|
imageData.height,
|
||||||
|
// use 4 components on the longer dimension, if square then both
|
||||||
|
imageData.width >= imageData.height ? 4 : 3,
|
||||||
|
imageData.height >= imageData.width ? 4 : 3,
|
||||||
|
);
|
||||||
canvas.toBlob(function(thumbnail) {
|
canvas.toBlob(function(thumbnail) {
|
||||||
resolve({
|
resolve({
|
||||||
info: {
|
info: {
|
||||||
|
@ -136,8 +150,9 @@ function createThumbnail(
|
||||||
},
|
},
|
||||||
w: inputWidth,
|
w: inputWidth,
|
||||||
h: inputHeight,
|
h: inputHeight,
|
||||||
|
[BLURHASH_FIELD]: blurhash,
|
||||||
},
|
},
|
||||||
thumbnail: thumbnail,
|
thumbnail,
|
||||||
});
|
});
|
||||||
}, mimeType);
|
}, mimeType);
|
||||||
});
|
});
|
||||||
|
@ -189,7 +204,7 @@ async function loadImageElement(imageFile: File) {
|
||||||
const [hidpi] = await Promise.all([parsePromise, imgPromise]);
|
const [hidpi] = await Promise.all([parsePromise, imgPromise]);
|
||||||
const width = hidpi ? (img.width >> 1) : img.width;
|
const width = hidpi ? (img.width >> 1) : img.width;
|
||||||
const height = hidpi ? (img.height >> 1) : img.height;
|
const height = hidpi ? (img.height >> 1) : img.height;
|
||||||
return {width, height, img};
|
return { width, height, img };
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -220,7 +235,8 @@ function infoForImageFile(matrixClient, roomId, imageFile) {
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Load a file into a newly created video element.
|
* Load a file into a newly created video element and pull some strings
|
||||||
|
* in an attempt to guarantee the first frame will be showing.
|
||||||
*
|
*
|
||||||
* @param {File} videoFile The file to load in an video element.
|
* @param {File} videoFile The file to load in an video element.
|
||||||
* @return {Promise} A promise that resolves with the video image element.
|
* @return {Promise} A promise that resolves with the video image element.
|
||||||
|
@ -229,20 +245,25 @@ function loadVideoElement(videoFile): Promise<HTMLVideoElement> {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
// Load the file into an html element
|
// Load the file into an html element
|
||||||
const video = document.createElement("video");
|
const video = document.createElement("video");
|
||||||
|
video.preload = "metadata";
|
||||||
|
video.playsInline = true;
|
||||||
|
video.muted = true;
|
||||||
|
|
||||||
const reader = new FileReader();
|
const reader = new FileReader();
|
||||||
|
|
||||||
reader.onload = function(ev) {
|
reader.onload = function(ev) {
|
||||||
video.src = ev.target.result as string;
|
|
||||||
|
|
||||||
// Once ready, returns its size
|
|
||||||
// Wait until we have enough data to thumbnail the first frame.
|
// Wait until we have enough data to thumbnail the first frame.
|
||||||
video.onloadeddata = function() {
|
video.onloadeddata = async function() {
|
||||||
resolve(video);
|
resolve(video);
|
||||||
|
video.pause();
|
||||||
};
|
};
|
||||||
video.onerror = function(e) {
|
video.onerror = function(e) {
|
||||||
reject(e);
|
reject(e);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
video.src = ev.target.result as string;
|
||||||
|
video.load();
|
||||||
|
video.play();
|
||||||
};
|
};
|
||||||
reader.onerror = function(e) {
|
reader.onerror = function(e) {
|
||||||
reject(e);
|
reject(e);
|
||||||
|
@ -307,7 +328,7 @@ function readFileAsArrayBuffer(file: File | Blob): Promise<ArrayBuffer> {
|
||||||
* If the file is unencrypted then the object will have a "url" key.
|
* If the file is unencrypted then the object will have a "url" key.
|
||||||
* If the file is encrypted then the object will have a "file" key.
|
* If the file is encrypted then the object will have a "file" key.
|
||||||
*/
|
*/
|
||||||
function uploadFile(
|
export function uploadFile(
|
||||||
matrixClient: MatrixClient,
|
matrixClient: MatrixClient,
|
||||||
roomId: string,
|
roomId: string,
|
||||||
file: File | Blob,
|
file: File | Blob,
|
||||||
|
@ -343,11 +364,11 @@ function uploadFile(
|
||||||
if (file.type) {
|
if (file.type) {
|
||||||
encryptInfo.mimetype = file.type;
|
encryptInfo.mimetype = file.type;
|
||||||
}
|
}
|
||||||
return {"file": encryptInfo};
|
return { "file": encryptInfo };
|
||||||
});
|
});
|
||||||
(prom as IAbortablePromise<any>).abort = () => {
|
(prom as IAbortablePromise<any>).abort = () => {
|
||||||
canceled = true;
|
canceled = true;
|
||||||
if (uploadPromise) MatrixClientPeg.get().cancelUpload(uploadPromise);
|
if (uploadPromise) matrixClient.cancelUpload(uploadPromise);
|
||||||
};
|
};
|
||||||
return prom;
|
return prom;
|
||||||
} else {
|
} else {
|
||||||
|
@ -357,11 +378,11 @@ function uploadFile(
|
||||||
const promise1 = basePromise.then(function(url) {
|
const promise1 = basePromise.then(function(url) {
|
||||||
if (canceled) throw new UploadCanceledError();
|
if (canceled) throw new UploadCanceledError();
|
||||||
// If the attachment isn't encrypted then include the URL directly.
|
// If the attachment isn't encrypted then include the URL directly.
|
||||||
return {"url": url};
|
return { url };
|
||||||
});
|
});
|
||||||
(promise1 as any).abort = () => {
|
(promise1 as any).abort = () => {
|
||||||
canceled = true;
|
canceled = true;
|
||||||
MatrixClientPeg.get().cancelUpload(basePromise);
|
matrixClient.cancelUpload(basePromise);
|
||||||
};
|
};
|
||||||
return promise1;
|
return promise1;
|
||||||
}
|
}
|
||||||
|
@ -373,11 +394,11 @@ export default class ContentMessages {
|
||||||
|
|
||||||
sendStickerContentToRoom(url: string, roomId: string, info: IImageInfo, text: string, matrixClient: MatrixClient) {
|
sendStickerContentToRoom(url: string, roomId: string, info: IImageInfo, text: string, matrixClient: MatrixClient) {
|
||||||
const startTime = CountlyAnalytics.getTimestamp();
|
const startTime = CountlyAnalytics.getTimestamp();
|
||||||
const prom = MatrixClientPeg.get().sendStickerMessage(roomId, url, info, text).catch((e) => {
|
const prom = matrixClient.sendStickerMessage(roomId, url, info, text).catch((e) => {
|
||||||
console.warn(`Failed to send content with URL ${url} to room ${roomId}`, e);
|
console.warn(`Failed to send content with URL ${url} to room ${roomId}`, e);
|
||||||
throw e;
|
throw e;
|
||||||
});
|
});
|
||||||
CountlyAnalytics.instance.trackSendMessage(startTime, prom, roomId, false, false, {msgtype: "m.sticker"});
|
CountlyAnalytics.instance.trackSendMessage(startTime, prom, roomId, false, false, { msgtype: "m.sticker" });
|
||||||
return prom;
|
return prom;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -391,14 +412,15 @@ export default class ContentMessages {
|
||||||
|
|
||||||
async sendContentListToRoom(files: File[], roomId: string, matrixClient: MatrixClient) {
|
async sendContentListToRoom(files: File[], roomId: string, matrixClient: MatrixClient) {
|
||||||
if (matrixClient.isGuest()) {
|
if (matrixClient.isGuest()) {
|
||||||
dis.dispatch({action: 'require_registration'});
|
dis.dispatch({ action: 'require_registration' });
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const isQuoting = Boolean(RoomViewStore.getQuotingEvent());
|
const isQuoting = Boolean(RoomViewStore.getQuotingEvent());
|
||||||
if (isQuoting) {
|
if (isQuoting) {
|
||||||
|
// FIXME: Using an import will result in Element crashing
|
||||||
const QuestionDialog = sdk.getComponent("dialogs.QuestionDialog");
|
const QuestionDialog = sdk.getComponent("dialogs.QuestionDialog");
|
||||||
const {finished} = Modal.createTrackedDialog<[boolean]>('Upload Reply Warning', '', QuestionDialog, {
|
const { finished } = Modal.createTrackedDialog<[boolean]>('Upload Reply Warning', '', QuestionDialog, {
|
||||||
title: _t('Replying With Files'),
|
title: _t('Replying With Files'),
|
||||||
description: (
|
description: (
|
||||||
<div>{_t(
|
<div>{_t(
|
||||||
|
@ -415,7 +437,7 @@ export default class ContentMessages {
|
||||||
|
|
||||||
if (!this.mediaConfig) { // hot-path optimization to not flash a spinner if we don't need to
|
if (!this.mediaConfig) { // hot-path optimization to not flash a spinner if we don't need to
|
||||||
const modal = Modal.createDialog(Spinner, null, 'mx_Dialog_spinner');
|
const modal = Modal.createDialog(Spinner, null, 'mx_Dialog_spinner');
|
||||||
await this.ensureMediaConfigFetched();
|
await this.ensureMediaConfigFetched(matrixClient);
|
||||||
modal.close();
|
modal.close();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -431,8 +453,9 @@ export default class ContentMessages {
|
||||||
}
|
}
|
||||||
|
|
||||||
if (tooBigFiles.length > 0) {
|
if (tooBigFiles.length > 0) {
|
||||||
|
// FIXME: Using an import will result in Element crashing
|
||||||
const UploadFailureDialog = sdk.getComponent("dialogs.UploadFailureDialog");
|
const UploadFailureDialog = sdk.getComponent("dialogs.UploadFailureDialog");
|
||||||
const {finished} = Modal.createTrackedDialog<[boolean]>('Upload Failure', '', UploadFailureDialog, {
|
const { finished } = Modal.createTrackedDialog<[boolean]>('Upload Failure', '', UploadFailureDialog, {
|
||||||
badFiles: tooBigFiles,
|
badFiles: tooBigFiles,
|
||||||
totalFiles: files.length,
|
totalFiles: files.length,
|
||||||
contentMessages: this,
|
contentMessages: this,
|
||||||
|
@ -441,7 +464,6 @@ export default class ContentMessages {
|
||||||
if (!shouldContinue) return;
|
if (!shouldContinue) return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const UploadConfirmDialog = sdk.getComponent("dialogs.UploadConfirmDialog");
|
|
||||||
let uploadAll = false;
|
let uploadAll = false;
|
||||||
// Promise to complete before sending next file into room, used for synchronisation of file-sending
|
// Promise to complete before sending next file into room, used for synchronisation of file-sending
|
||||||
// to match the order the files were specified in
|
// to match the order the files were specified in
|
||||||
|
@ -449,7 +471,9 @@ export default class ContentMessages {
|
||||||
for (let i = 0; i < okFiles.length; ++i) {
|
for (let i = 0; i < okFiles.length; ++i) {
|
||||||
const file = okFiles[i];
|
const file = okFiles[i];
|
||||||
if (!uploadAll) {
|
if (!uploadAll) {
|
||||||
const {finished} = Modal.createTrackedDialog<[boolean, boolean]>('Upload Files confirmation',
|
// FIXME: Using an import will result in Element crashing
|
||||||
|
const UploadConfirmDialog = sdk.getComponent("dialogs.UploadConfirmDialog");
|
||||||
|
const { finished } = Modal.createTrackedDialog<[boolean, boolean]>('Upload Files confirmation',
|
||||||
'', UploadConfirmDialog, {
|
'', UploadConfirmDialog, {
|
||||||
file,
|
file,
|
||||||
currentIndex: i,
|
currentIndex: i,
|
||||||
|
@ -470,7 +494,7 @@ export default class ContentMessages {
|
||||||
return this.inprogress.filter(u => !u.canceled);
|
return this.inprogress.filter(u => !u.canceled);
|
||||||
}
|
}
|
||||||
|
|
||||||
cancelUpload(promise: Promise<any>) {
|
cancelUpload(promise: Promise<any>, matrixClient: MatrixClient) {
|
||||||
let upload: IUpload;
|
let upload: IUpload;
|
||||||
for (let i = 0; i < this.inprogress.length; ++i) {
|
for (let i = 0; i < this.inprogress.length; ++i) {
|
||||||
if (this.inprogress[i].promise === promise) {
|
if (this.inprogress[i].promise === promise) {
|
||||||
|
@ -480,8 +504,8 @@ export default class ContentMessages {
|
||||||
}
|
}
|
||||||
if (upload) {
|
if (upload) {
|
||||||
upload.canceled = true;
|
upload.canceled = true;
|
||||||
MatrixClientPeg.get().cancelUpload(upload.promise);
|
matrixClient.cancelUpload(upload.promise);
|
||||||
dis.dispatch<UploadCanceledPayload>({action: Action.UploadCanceled, upload});
|
dis.dispatch<UploadCanceledPayload>({ action: Action.UploadCanceled, upload });
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -542,7 +566,7 @@ export default class ContentMessages {
|
||||||
promise: prom,
|
promise: prom,
|
||||||
};
|
};
|
||||||
this.inprogress.push(upload);
|
this.inprogress.push(upload);
|
||||||
dis.dispatch<UploadStartedPayload>({action: Action.UploadStarted, upload});
|
dis.dispatch<UploadStartedPayload>({ action: Action.UploadStarted, upload });
|
||||||
|
|
||||||
// Focus the composer view
|
// Focus the composer view
|
||||||
dis.fire(Action.FocusComposer);
|
dis.fire(Action.FocusComposer);
|
||||||
|
@ -550,7 +574,7 @@ export default class ContentMessages {
|
||||||
function onProgress(ev) {
|
function onProgress(ev) {
|
||||||
upload.total = ev.total;
|
upload.total = ev.total;
|
||||||
upload.loaded = ev.loaded;
|
upload.loaded = ev.loaded;
|
||||||
dis.dispatch<UploadProgressPayload>({action: Action.UploadProgress, upload});
|
dis.dispatch<UploadProgressPayload>({ action: Action.UploadProgress, upload });
|
||||||
}
|
}
|
||||||
|
|
||||||
let error;
|
let error;
|
||||||
|
@ -577,13 +601,14 @@ export default class ContentMessages {
|
||||||
}, function(err) {
|
}, function(err) {
|
||||||
error = err;
|
error = err;
|
||||||
if (!upload.canceled) {
|
if (!upload.canceled) {
|
||||||
let desc = _t("The file '%(fileName)s' failed to upload.", {fileName: upload.fileName});
|
let desc = _t("The file '%(fileName)s' failed to upload.", { fileName: upload.fileName });
|
||||||
if (err.http_status === 413) {
|
if (err.http_status === 413) {
|
||||||
desc = _t(
|
desc = _t(
|
||||||
"The file '%(fileName)s' exceeds this homeserver's size limit for uploads",
|
"The file '%(fileName)s' exceeds this homeserver's size limit for uploads",
|
||||||
{fileName: upload.fileName},
|
{ fileName: upload.fileName },
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
// FIXME: Using an import will result in Element crashing
|
||||||
const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
|
const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
|
||||||
Modal.createTrackedDialog('Upload failed', '', ErrorDialog, {
|
Modal.createTrackedDialog('Upload failed', '', ErrorDialog, {
|
||||||
title: _t('Upload Failed'),
|
title: _t('Upload Failed'),
|
||||||
|
@ -604,10 +629,10 @@ export default class ContentMessages {
|
||||||
if (error && error.http_status === 413) {
|
if (error && error.http_status === 413) {
|
||||||
this.mediaConfig = null;
|
this.mediaConfig = null;
|
||||||
}
|
}
|
||||||
dis.dispatch<UploadErrorPayload>({action: Action.UploadFailed, upload, error});
|
dis.dispatch<UploadErrorPayload>({ action: Action.UploadFailed, upload, error });
|
||||||
} else {
|
} else {
|
||||||
dis.dispatch<UploadFinishedPayload>({action: Action.UploadFinished, upload});
|
dis.dispatch<UploadFinishedPayload>({ action: Action.UploadFinished, upload });
|
||||||
dis.dispatch({action: 'message_sent'});
|
dis.dispatch({ action: 'message_sent' });
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -621,11 +646,11 @@ export default class ContentMessages {
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
|
|
||||||
private ensureMediaConfigFetched() {
|
private ensureMediaConfigFetched(matrixClient: MatrixClient) {
|
||||||
if (this.mediaConfig !== null) return;
|
if (this.mediaConfig !== null) return;
|
||||||
|
|
||||||
console.log("[Media Config] Fetching");
|
console.log("[Media Config] Fetching");
|
||||||
return MatrixClientPeg.get().getMediaConfig().then((config) => {
|
return matrixClient.getMediaConfig().then((config) => {
|
||||||
console.log("[Media Config] Fetched config:", config);
|
console.log("[Media Config] Fetched config:", config);
|
||||||
return config;
|
return config;
|
||||||
}).catch(() => {
|
}).catch(() => {
|
||||||
|
|
|
@ -14,13 +14,14 @@ See the License for the specific language governing permissions and
|
||||||
limitations under the License.
|
limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import {randomString} from "matrix-js-sdk/src/randomstring";
|
import { randomString } from "matrix-js-sdk/src/randomstring";
|
||||||
|
import { IContent } from "matrix-js-sdk/src/models/event";
|
||||||
|
import { sleep } from "matrix-js-sdk/src/utils";
|
||||||
|
|
||||||
import {getCurrentLanguage} from './languageHandler';
|
import { getCurrentLanguage } from './languageHandler';
|
||||||
import PlatformPeg from './PlatformPeg';
|
import PlatformPeg from './PlatformPeg';
|
||||||
import SdkConfig from './SdkConfig';
|
import SdkConfig from './SdkConfig';
|
||||||
import {MatrixClientPeg} from "./MatrixClientPeg";
|
import { MatrixClientPeg } from "./MatrixClientPeg";
|
||||||
import {sleep} from "./utils/promise";
|
|
||||||
import RoomViewStore from "./stores/RoomViewStore";
|
import RoomViewStore from "./stores/RoomViewStore";
|
||||||
import { Action } from "./dispatcher/actions";
|
import { Action } from "./dispatcher/actions";
|
||||||
|
|
||||||
|
@ -255,7 +256,7 @@ interface ICreateRoomEvent extends IEvent {
|
||||||
num_users: number;
|
num_users: number;
|
||||||
is_encrypted: boolean;
|
is_encrypted: boolean;
|
||||||
is_public: boolean;
|
is_public: boolean;
|
||||||
}
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
interface IJoinRoomEvent extends IEvent {
|
interface IJoinRoomEvent extends IEvent {
|
||||||
|
@ -338,8 +339,8 @@ const getRoomStats = (roomId: string) => {
|
||||||
"is_encrypted": cli?.isRoomEncrypted(roomId),
|
"is_encrypted": cli?.isRoomEncrypted(roomId),
|
||||||
// eslint-disable-next-line camelcase
|
// eslint-disable-next-line camelcase
|
||||||
"is_public": room?.currentState.getStateEvents("m.room.join_rules", "")?.getContent()?.join_rule === "public",
|
"is_public": room?.currentState.getStateEvents("m.room.join_rules", "")?.getContent()?.join_rule === "public",
|
||||||
}
|
};
|
||||||
}
|
};
|
||||||
|
|
||||||
// async wrapper for regex-powered String.prototype.replace
|
// async wrapper for regex-powered String.prototype.replace
|
||||||
const strReplaceAsync = async (str: string, regex: RegExp, fn: (...args: string[]) => Promise<string>) => {
|
const strReplaceAsync = async (str: string, regex: RegExp, fn: (...args: string[]) => Promise<string>) => {
|
||||||
|
@ -414,7 +415,7 @@ export default class CountlyAnalytics {
|
||||||
|
|
||||||
this.anonymous = anonymous;
|
this.anonymous = anonymous;
|
||||||
if (anonymous) {
|
if (anonymous) {
|
||||||
await this.changeUserKey(randomString(64))
|
await this.changeUserKey(randomString(64));
|
||||||
} else {
|
} else {
|
||||||
await this.changeUserKey(await hashHex(MatrixClientPeg.get().getUserId()), true);
|
await this.changeUserKey(await hashHex(MatrixClientPeg.get().getUserId()), true);
|
||||||
}
|
}
|
||||||
|
@ -438,7 +439,7 @@ export default class CountlyAnalytics {
|
||||||
await this.track("Opt-Out" );
|
await this.track("Opt-Out" );
|
||||||
this.endSession();
|
this.endSession();
|
||||||
window.clearInterval(this.heartbeatIntervalId);
|
window.clearInterval(this.heartbeatIntervalId);
|
||||||
window.clearTimeout(this.activityIntervalId)
|
window.clearTimeout(this.activityIntervalId);
|
||||||
this.baseUrl = null;
|
this.baseUrl = null;
|
||||||
// remove listeners bound in trackSessions()
|
// remove listeners bound in trackSessions()
|
||||||
window.removeEventListener("beforeunload", this.endSession);
|
window.removeEventListener("beforeunload", this.endSession);
|
||||||
|
@ -662,14 +663,14 @@ export default class CountlyAnalytics {
|
||||||
}
|
}
|
||||||
|
|
||||||
private queue(args: Omit<IEvent, "timestamp" | "hour" | "dow" | "count"> & Partial<Pick<IEvent, "count">>) {
|
private queue(args: Omit<IEvent, "timestamp" | "hour" | "dow" | "count"> & Partial<Pick<IEvent, "count">>) {
|
||||||
const {count = 1, ...rest} = args;
|
const { count = 1, ...rest } = args;
|
||||||
const ev = {
|
const ev = {
|
||||||
...this.getTimeParams(),
|
...this.getTimeParams(),
|
||||||
...rest,
|
...rest,
|
||||||
count,
|
count,
|
||||||
platform: this.appPlatform,
|
platform: this.appPlatform,
|
||||||
app_version: this.appVersion,
|
app_version: this.appVersion,
|
||||||
}
|
};
|
||||||
|
|
||||||
this.pendingEvents.push(ev);
|
this.pendingEvents.push(ev);
|
||||||
if (this.pendingEvents.length > MAX_PENDING_EVENTS) {
|
if (this.pendingEvents.length > MAX_PENDING_EVENTS) {
|
||||||
|
@ -680,7 +681,7 @@ export default class CountlyAnalytics {
|
||||||
private getOrientation = (): Orientation => {
|
private getOrientation = (): Orientation => {
|
||||||
return window.matchMedia("(orientation: landscape)").matches
|
return window.matchMedia("(orientation: landscape)").matches
|
||||||
? Orientation.Landscape
|
? Orientation.Landscape
|
||||||
: Orientation.Portrait
|
: Orientation.Portrait;
|
||||||
};
|
};
|
||||||
|
|
||||||
private reportOrientation = () => {
|
private reportOrientation = () => {
|
||||||
|
@ -749,7 +750,7 @@ export default class CountlyAnalytics {
|
||||||
const request: Parameters<typeof CountlyAnalytics.prototype.request>[0] = {
|
const request: Parameters<typeof CountlyAnalytics.prototype.request>[0] = {
|
||||||
begin_session: 1,
|
begin_session: 1,
|
||||||
user_details: JSON.stringify(userDetails),
|
user_details: JSON.stringify(userDetails),
|
||||||
}
|
};
|
||||||
|
|
||||||
const metrics = this.getMetrics();
|
const metrics = this.getMetrics();
|
||||||
if (metrics) {
|
if (metrics) {
|
||||||
|
@ -773,7 +774,7 @@ export default class CountlyAnalytics {
|
||||||
|
|
||||||
private endSession = () => {
|
private endSession = () => {
|
||||||
if (this.sessionStarted) {
|
if (this.sessionStarted) {
|
||||||
window.removeEventListener("resize", this.reportOrientation)
|
window.removeEventListener("resize", this.reportOrientation);
|
||||||
|
|
||||||
this.reportViewDuration();
|
this.reportViewDuration();
|
||||||
this.request({
|
this.request({
|
||||||
|
@ -868,7 +869,7 @@ export default class CountlyAnalytics {
|
||||||
roomId: string,
|
roomId: string,
|
||||||
isEdit: boolean,
|
isEdit: boolean,
|
||||||
isReply: boolean,
|
isReply: boolean,
|
||||||
content: {format?: string, msgtype: string},
|
content: IContent,
|
||||||
) {
|
) {
|
||||||
if (this.disabled) return;
|
if (this.disabled) return;
|
||||||
const cli = MatrixClientPeg.get();
|
const cli = MatrixClientPeg.get();
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
/*
|
/*
|
||||||
Copyright 2018 New Vector Ltd
|
Copyright 2018 - 2021 The Matrix.org Foundation C.I.C.
|
||||||
|
|
||||||
Licensed under the Apache License, Version 2.0 (the "License");
|
Licensed under the Apache License, Version 2.0 (the "License");
|
||||||
you may not use this file except in compliance with the License.
|
you may not use this file except in compliance with the License.
|
||||||
|
@ -14,34 +14,40 @@ See the License for the specific language governing permissions and
|
||||||
limitations under the License.
|
limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
import { MatrixError } from "matrix-js-sdk/src/http-api";
|
||||||
|
import { MatrixEvent } from "matrix-js-sdk/src/models/event";
|
||||||
|
|
||||||
export class DecryptionFailure {
|
export class DecryptionFailure {
|
||||||
constructor(failedEventId, errorCode) {
|
public readonly ts: number;
|
||||||
this.failedEventId = failedEventId;
|
|
||||||
this.errorCode = errorCode;
|
constructor(public readonly failedEventId: string, public readonly errorCode: string) {
|
||||||
this.ts = Date.now();
|
this.ts = Date.now();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
type TrackingFn = (count: number, trackedErrCode: string) => void;
|
||||||
|
type ErrCodeMapFn = (errcode: string) => string;
|
||||||
|
|
||||||
export class DecryptionFailureTracker {
|
export class DecryptionFailureTracker {
|
||||||
// Array of items of type DecryptionFailure. Every `CHECK_INTERVAL_MS`, this list
|
// Array of items of type DecryptionFailure. Every `CHECK_INTERVAL_MS`, this list
|
||||||
// is checked for failures that happened > `GRACE_PERIOD_MS` ago. Those that did
|
// is checked for failures that happened > `GRACE_PERIOD_MS` ago. Those that did
|
||||||
// are accumulated in `failureCounts`.
|
// are accumulated in `failureCounts`.
|
||||||
failures = [];
|
public failures: DecryptionFailure[] = [];
|
||||||
|
|
||||||
// A histogram of the number of failures that will be tracked at the next tracking
|
// A histogram of the number of failures that will be tracked at the next tracking
|
||||||
// interval, split by failure error code.
|
// interval, split by failure error code.
|
||||||
failureCounts = {
|
public failureCounts: Record<string, number> = {
|
||||||
// [errorCode]: 42
|
// [errorCode]: 42
|
||||||
};
|
};
|
||||||
|
|
||||||
// Event IDs of failures that were tracked previously
|
// Event IDs of failures that were tracked previously
|
||||||
trackedEventHashMap = {
|
public trackedEventHashMap: Record<string, boolean> = {
|
||||||
// [eventId]: true
|
// [eventId]: true
|
||||||
};
|
};
|
||||||
|
|
||||||
// Set to an interval ID when `start` is called
|
// Set to an interval ID when `start` is called
|
||||||
checkInterval = null;
|
public checkInterval: NodeJS.Timeout = null;
|
||||||
trackInterval = null;
|
public trackInterval: NodeJS.Timeout = null;
|
||||||
|
|
||||||
// Spread the load on `Analytics` by tracking at a low frequency, `TRACK_INTERVAL_MS`.
|
// Spread the load on `Analytics` by tracking at a low frequency, `TRACK_INTERVAL_MS`.
|
||||||
static TRACK_INTERVAL_MS = 60000;
|
static TRACK_INTERVAL_MS = 60000;
|
||||||
|
@ -67,7 +73,7 @@ export class DecryptionFailureTracker {
|
||||||
* @param {function?} errorCodeMapFn The function used to map error codes to the
|
* @param {function?} errorCodeMapFn The function used to map error codes to the
|
||||||
* trackedErrorCode. If not provided, the `.code` of errors will be used.
|
* trackedErrorCode. If not provided, the `.code` of errors will be used.
|
||||||
*/
|
*/
|
||||||
constructor(fn, errorCodeMapFn) {
|
constructor(private readonly fn: TrackingFn, private readonly errorCodeMapFn?: ErrCodeMapFn) {
|
||||||
if (!fn || typeof fn !== 'function') {
|
if (!fn || typeof fn !== 'function') {
|
||||||
throw new Error('DecryptionFailureTracker requires tracking function');
|
throw new Error('DecryptionFailureTracker requires tracking function');
|
||||||
}
|
}
|
||||||
|
@ -75,9 +81,6 @@ export class DecryptionFailureTracker {
|
||||||
if (errorCodeMapFn && typeof errorCodeMapFn !== 'function') {
|
if (errorCodeMapFn && typeof errorCodeMapFn !== 'function') {
|
||||||
throw new Error('DecryptionFailureTracker second constructor argument should be a function');
|
throw new Error('DecryptionFailureTracker second constructor argument should be a function');
|
||||||
}
|
}
|
||||||
|
|
||||||
this._trackDecryptionFailure = fn;
|
|
||||||
this._mapErrorCode = errorCodeMapFn;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// loadTrackedEventHashMap() {
|
// loadTrackedEventHashMap() {
|
||||||
|
@ -88,7 +91,7 @@ export class DecryptionFailureTracker {
|
||||||
// localStorage.setItem('mx-decryption-failure-event-id-hashes', JSON.stringify(this.trackedEventHashMap));
|
// localStorage.setItem('mx-decryption-failure-event-id-hashes', JSON.stringify(this.trackedEventHashMap));
|
||||||
// }
|
// }
|
||||||
|
|
||||||
eventDecrypted(e, err) {
|
public eventDecrypted(e: MatrixEvent, err: MatrixError | Error): void {
|
||||||
if (err) {
|
if (err) {
|
||||||
this.addDecryptionFailure(new DecryptionFailure(e.getId(), err.code));
|
this.addDecryptionFailure(new DecryptionFailure(e.getId(), err.code));
|
||||||
} else {
|
} else {
|
||||||
|
@ -97,18 +100,18 @@ export class DecryptionFailureTracker {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
addDecryptionFailure(failure) {
|
public addDecryptionFailure(failure: DecryptionFailure): void {
|
||||||
this.failures.push(failure);
|
this.failures.push(failure);
|
||||||
}
|
}
|
||||||
|
|
||||||
removeDecryptionFailuresForEvent(e) {
|
public removeDecryptionFailuresForEvent(e: MatrixEvent): void {
|
||||||
this.failures = this.failures.filter((f) => f.failedEventId !== e.getId());
|
this.failures = this.failures.filter((f) => f.failedEventId !== e.getId());
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Start checking for and tracking failures.
|
* Start checking for and tracking failures.
|
||||||
*/
|
*/
|
||||||
start() {
|
public start(): void {
|
||||||
this.checkInterval = setInterval(
|
this.checkInterval = setInterval(
|
||||||
() => this.checkFailures(Date.now()),
|
() => this.checkFailures(Date.now()),
|
||||||
DecryptionFailureTracker.CHECK_INTERVAL_MS,
|
DecryptionFailureTracker.CHECK_INTERVAL_MS,
|
||||||
|
@ -123,7 +126,7 @@ export class DecryptionFailureTracker {
|
||||||
/**
|
/**
|
||||||
* Clear state and stop checking for and tracking failures.
|
* Clear state and stop checking for and tracking failures.
|
||||||
*/
|
*/
|
||||||
stop() {
|
public stop(): void {
|
||||||
clearInterval(this.checkInterval);
|
clearInterval(this.checkInterval);
|
||||||
clearInterval(this.trackInterval);
|
clearInterval(this.trackInterval);
|
||||||
|
|
||||||
|
@ -132,11 +135,11 @@ export class DecryptionFailureTracker {
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Mark failures that occured before nowTs - GRACE_PERIOD_MS as failures that should be
|
* Mark failures that occurred before nowTs - GRACE_PERIOD_MS as failures that should be
|
||||||
* tracked. Only mark one failure per event ID.
|
* tracked. Only mark one failure per event ID.
|
||||||
* @param {number} nowTs the timestamp that represents the time now.
|
* @param {number} nowTs the timestamp that represents the time now.
|
||||||
*/
|
*/
|
||||||
checkFailures(nowTs) {
|
public checkFailures(nowTs: number): void {
|
||||||
const failuresGivenGrace = [];
|
const failuresGivenGrace = [];
|
||||||
const failuresNotReady = [];
|
const failuresNotReady = [];
|
||||||
while (this.failures.length > 0) {
|
while (this.failures.length > 0) {
|
||||||
|
@ -165,7 +168,7 @@ export class DecryptionFailureTracker {
|
||||||
const trackedEventIds = [...dedupedFailuresMap.keys()];
|
const trackedEventIds = [...dedupedFailuresMap.keys()];
|
||||||
|
|
||||||
this.trackedEventHashMap = trackedEventIds.reduce(
|
this.trackedEventHashMap = trackedEventIds.reduce(
|
||||||
(result, eventId) => ({...result, [eventId]: true}),
|
(result, eventId) => ({ ...result, [eventId]: true }),
|
||||||
this.trackedEventHashMap,
|
this.trackedEventHashMap,
|
||||||
);
|
);
|
||||||
|
|
||||||
|
@ -175,10 +178,10 @@ export class DecryptionFailureTracker {
|
||||||
|
|
||||||
const dedupedFailures = dedupedFailuresMap.values();
|
const dedupedFailures = dedupedFailuresMap.values();
|
||||||
|
|
||||||
this._aggregateFailures(dedupedFailures);
|
this.aggregateFailures(dedupedFailures);
|
||||||
}
|
}
|
||||||
|
|
||||||
_aggregateFailures(failures) {
|
private aggregateFailures(failures: DecryptionFailure[]): void {
|
||||||
for (const failure of failures) {
|
for (const failure of failures) {
|
||||||
const errorCode = failure.errorCode;
|
const errorCode = failure.errorCode;
|
||||||
this.failureCounts[errorCode] = (this.failureCounts[errorCode] || 0) + 1;
|
this.failureCounts[errorCode] = (this.failureCounts[errorCode] || 0) + 1;
|
||||||
|
@ -189,12 +192,12 @@ export class DecryptionFailureTracker {
|
||||||
* If there are failures that should be tracked, call the given trackDecryptionFailure
|
* If there are failures that should be tracked, call the given trackDecryptionFailure
|
||||||
* function with the number of failures that should be tracked.
|
* function with the number of failures that should be tracked.
|
||||||
*/
|
*/
|
||||||
trackFailures() {
|
public trackFailures(): void {
|
||||||
for (const errorCode of Object.keys(this.failureCounts)) {
|
for (const errorCode of Object.keys(this.failureCounts)) {
|
||||||
if (this.failureCounts[errorCode] > 0) {
|
if (this.failureCounts[errorCode] > 0) {
|
||||||
const trackedErrorCode = this._mapErrorCode ? this._mapErrorCode(errorCode) : errorCode;
|
const trackedErrorCode = this.errorCodeMapFn ? this.errorCodeMapFn(errorCode) : errorCode;
|
||||||
|
|
||||||
this._trackDecryptionFailure(this.failureCounts[errorCode], trackedErrorCode);
|
this.fn(this.failureCounts[errorCode], trackedErrorCode);
|
||||||
this.failureCounts[errorCode] = 0;
|
this.failureCounts[errorCode] = 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
|
@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
|
||||||
limitations under the License.
|
limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import {MatrixClientPeg} from './MatrixClientPeg';
|
import { MatrixClientPeg } from './MatrixClientPeg';
|
||||||
import dis from "./dispatcher/dispatcher";
|
import dis from "./dispatcher/dispatcher";
|
||||||
import {
|
import {
|
||||||
hideToast as hideBulkUnverifiedSessionsToast,
|
hideToast as hideBulkUnverifiedSessionsToast,
|
||||||
|
@ -160,7 +160,8 @@ export default class DeviceListener {
|
||||||
// which result in account data changes affecting checks below.
|
// which result in account data changes affecting checks below.
|
||||||
if (
|
if (
|
||||||
ev.getType().startsWith('m.secret_storage.') ||
|
ev.getType().startsWith('m.secret_storage.') ||
|
||||||
ev.getType().startsWith('m.cross_signing.')
|
ev.getType().startsWith('m.cross_signing.') ||
|
||||||
|
ev.getType() === 'm.megolm_backup.v1'
|
||||||
) {
|
) {
|
||||||
this._recheck();
|
this._recheck();
|
||||||
}
|
}
|
||||||
|
|
|
@ -19,7 +19,7 @@ import Modal from './Modal';
|
||||||
import * as sdk from './';
|
import * as sdk from './';
|
||||||
import MultiInviter from './utils/MultiInviter';
|
import MultiInviter from './utils/MultiInviter';
|
||||||
import { _t } from './languageHandler';
|
import { _t } from './languageHandler';
|
||||||
import {MatrixClientPeg} from './MatrixClientPeg';
|
import { MatrixClientPeg } from './MatrixClientPeg';
|
||||||
import GroupStore from './stores/GroupStore';
|
import GroupStore from './stores/GroupStore';
|
||||||
import StyledCheckbox from './components/views/elements/StyledCheckbox';
|
import StyledCheckbox from './components/views/elements/StyledCheckbox';
|
||||||
|
|
||||||
|
@ -103,7 +103,7 @@ function _onGroupInviteFinished(groupId, addrs) {
|
||||||
if (errorList.length > 0) {
|
if (errorList.length > 0) {
|
||||||
const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
|
const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
|
||||||
Modal.createTrackedDialog('Failed to invite the following users to the group', '', ErrorDialog, {
|
Modal.createTrackedDialog('Failed to invite the following users to the group', '', ErrorDialog, {
|
||||||
title: _t("Failed to invite the following users to %(groupId)s:", {groupId: groupId}),
|
title: _t("Failed to invite the following users to %(groupId)s:", { groupId: groupId }),
|
||||||
description: errorList.join(", "),
|
description: errorList.join(", "),
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -111,7 +111,7 @@ function _onGroupInviteFinished(groupId, addrs) {
|
||||||
const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
|
const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
|
||||||
Modal.createTrackedDialog('Failed to invite users to group', '', ErrorDialog, {
|
Modal.createTrackedDialog('Failed to invite users to group', '', ErrorDialog, {
|
||||||
title: _t("Failed to invite users to community"),
|
title: _t("Failed to invite users to community"),
|
||||||
description: _t("Failed to invite users to %(groupId)s", {groupId: groupId}),
|
description: _t("Failed to invite users to %(groupId)s", { groupId: groupId }),
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -137,7 +137,7 @@ function _onGroupAddRoomFinished(groupId, addrs, addRoomsPublicly) {
|
||||||
// Add this group as related
|
// Add this group as related
|
||||||
if (!groups.includes(groupId)) {
|
if (!groups.includes(groupId)) {
|
||||||
groups.push(groupId);
|
groups.push(groupId);
|
||||||
return MatrixClientPeg.get().sendStateEvent(roomId, 'm.room.related_groups', {groups}, '');
|
return MatrixClientPeg.get().sendStateEvent(roomId, 'm.room.related_groups', { groups }, '');
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
})).then(() => {
|
})).then(() => {
|
||||||
|
@ -152,7 +152,7 @@ function _onGroupAddRoomFinished(groupId, addrs, addRoomsPublicly) {
|
||||||
{
|
{
|
||||||
title: _t(
|
title: _t(
|
||||||
"Failed to add the following rooms to %(groupId)s:",
|
"Failed to add the following rooms to %(groupId)s:",
|
||||||
{groupId},
|
{ groupId },
|
||||||
),
|
),
|
||||||
description: errorList.join(", "),
|
description: errorList.join(", "),
|
||||||
},
|
},
|
||||||
|
|
|
@ -17,11 +17,10 @@ See the License for the specific language governing permissions and
|
||||||
limitations under the License.
|
limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React from 'react';
|
import React, { ReactNode } from 'react';
|
||||||
import sanitizeHtml from 'sanitize-html';
|
import sanitizeHtml from 'sanitize-html';
|
||||||
import { IExtendedSanitizeOptions } from './@types/sanitize-html';
|
import cheerio from 'cheerio';
|
||||||
import * as linkify from 'linkifyjs';
|
import * as linkify from 'linkifyjs';
|
||||||
import linkifyMatrix from './linkify-matrix';
|
|
||||||
import _linkifyElement from 'linkifyjs/element';
|
import _linkifyElement from 'linkifyjs/element';
|
||||||
import _linkifyString from 'linkifyjs/string';
|
import _linkifyString from 'linkifyjs/string';
|
||||||
import classNames from 'classnames';
|
import classNames from 'classnames';
|
||||||
|
@ -29,13 +28,15 @@ import EMOJIBASE_REGEX from 'emojibase-regex';
|
||||||
import url from 'url';
|
import url from 'url';
|
||||||
import katex from 'katex';
|
import katex from 'katex';
|
||||||
import { AllHtmlEntities } from 'html-entities';
|
import { AllHtmlEntities } from 'html-entities';
|
||||||
import SettingsStore from './settings/SettingsStore';
|
import { IContent } from 'matrix-js-sdk/src/models/event';
|
||||||
import cheerio from 'cheerio';
|
|
||||||
|
|
||||||
import {tryTransformPermalinkToLocalHref} from "./utils/permalinks/Permalinks";
|
import { IExtendedSanitizeOptions } from './@types/sanitize-html';
|
||||||
import {SHORTCODE_TO_EMOJI, getEmojiFromUnicode} from "./emoji";
|
import linkifyMatrix from './linkify-matrix';
|
||||||
|
import SettingsStore from './settings/SettingsStore';
|
||||||
|
import { tryTransformPermalinkToLocalHref } from "./utils/permalinks/Permalinks";
|
||||||
|
import { SHORTCODE_TO_EMOJI, getEmojiFromUnicode } from "./emoji";
|
||||||
import ReplyThread from "./components/views/elements/ReplyThread";
|
import ReplyThread from "./components/views/elements/ReplyThread";
|
||||||
import {mediaFromMxc} from "./customisations/Media";
|
import { mediaFromMxc } from "./customisations/Media";
|
||||||
|
|
||||||
linkifyMatrix(linkify);
|
linkifyMatrix(linkify);
|
||||||
|
|
||||||
|
@ -66,7 +67,7 @@ export const PERMITTED_URL_SCHEMES = ['http', 'https', 'ftp', 'mailto', 'magnet'
|
||||||
* need emojification.
|
* need emojification.
|
||||||
* unicodeToImage uses this function.
|
* unicodeToImage uses this function.
|
||||||
*/
|
*/
|
||||||
function mightContainEmoji(str: string) {
|
function mightContainEmoji(str: string): boolean {
|
||||||
return SURROGATE_PAIR_PATTERN.test(str) || SYMBOL_PATTERN.test(str);
|
return SURROGATE_PAIR_PATTERN.test(str) || SYMBOL_PATTERN.test(str);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -76,7 +77,7 @@ function mightContainEmoji(str: string) {
|
||||||
* @param {String} char The emoji character
|
* @param {String} char The emoji character
|
||||||
* @return {String} The shortcode (such as :thumbup:)
|
* @return {String} The shortcode (such as :thumbup:)
|
||||||
*/
|
*/
|
||||||
export function unicodeToShortcode(char: string) {
|
export function unicodeToShortcode(char: string): string {
|
||||||
const data = getEmojiFromUnicode(char);
|
const data = getEmojiFromUnicode(char);
|
||||||
return (data && data.shortcodes ? `:${data.shortcodes[0]}:` : '');
|
return (data && data.shortcodes ? `:${data.shortcodes[0]}:` : '');
|
||||||
}
|
}
|
||||||
|
@ -87,7 +88,7 @@ export function unicodeToShortcode(char: string) {
|
||||||
* @param {String} shortcode The shortcode (such as :thumbup:)
|
* @param {String} shortcode The shortcode (such as :thumbup:)
|
||||||
* @return {String} The emoji character; null if none exists
|
* @return {String} The emoji character; null if none exists
|
||||||
*/
|
*/
|
||||||
export function shortcodeToUnicode(shortcode: string) {
|
export function shortcodeToUnicode(shortcode: string): string {
|
||||||
shortcode = shortcode.slice(1, shortcode.length - 1);
|
shortcode = shortcode.slice(1, shortcode.length - 1);
|
||||||
const data = SHORTCODE_TO_EMOJI.get(shortcode);
|
const data = SHORTCODE_TO_EMOJI.get(shortcode);
|
||||||
return data ? data.unicode : null;
|
return data ? data.unicode : null;
|
||||||
|
@ -124,20 +125,20 @@ export function processHtmlForSending(html: string): string {
|
||||||
* Given an untrusted HTML string, return a React node with an sanitized version
|
* Given an untrusted HTML string, return a React node with an sanitized version
|
||||||
* of that HTML.
|
* of that HTML.
|
||||||
*/
|
*/
|
||||||
export function sanitizedHtmlNode(insaneHtml: string) {
|
export function sanitizedHtmlNode(insaneHtml: string): ReactNode {
|
||||||
const saneHtml = sanitizeHtml(insaneHtml, sanitizeHtmlParams);
|
const saneHtml = sanitizeHtml(insaneHtml, sanitizeHtmlParams);
|
||||||
|
|
||||||
return <div dangerouslySetInnerHTML={{ __html: saneHtml }} dir="auto" />;
|
return <div dangerouslySetInnerHTML={{ __html: saneHtml }} dir="auto" />;
|
||||||
}
|
}
|
||||||
|
|
||||||
export function getHtmlText(insaneHtml: string) {
|
export function getHtmlText(insaneHtml: string): string {
|
||||||
return sanitizeHtml(insaneHtml, {
|
return sanitizeHtml(insaneHtml, {
|
||||||
allowedTags: [],
|
allowedTags: [],
|
||||||
allowedAttributes: {},
|
allowedAttributes: {},
|
||||||
selfClosing: [],
|
selfClosing: [],
|
||||||
allowedSchemes: [],
|
allowedSchemes: [],
|
||||||
disallowedTagsMode: 'discard',
|
disallowedTagsMode: 'discard',
|
||||||
})
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -148,7 +149,7 @@ export function getHtmlText(insaneHtml: string) {
|
||||||
* other places we need to sanitise URLs.
|
* other places we need to sanitise URLs.
|
||||||
* @return true if permitted, otherwise false
|
* @return true if permitted, otherwise false
|
||||||
*/
|
*/
|
||||||
export function isUrlPermitted(inputUrl: string) {
|
export function isUrlPermitted(inputUrl: string): boolean {
|
||||||
try {
|
try {
|
||||||
const parsed = url.parse(inputUrl);
|
const parsed = url.parse(inputUrl);
|
||||||
if (!parsed.protocol) return false;
|
if (!parsed.protocol) return false;
|
||||||
|
@ -182,7 +183,7 @@ const transformTags: IExtendedSanitizeOptions["transformTags"] = { // custom to
|
||||||
// images" preference is disabled. Future work might expose some UI to reveal them
|
// images" preference is disabled. Future work might expose some UI to reveal them
|
||||||
// like standalone image events have.
|
// like standalone image events have.
|
||||||
if (!attribs.src || !attribs.src.startsWith('mxc://') || !SettingsStore.getValue("showImages")) {
|
if (!attribs.src || !attribs.src.startsWith('mxc://') || !SettingsStore.getValue("showImages")) {
|
||||||
return { tagName, attribs: {}};
|
return { tagName, attribs: {} };
|
||||||
}
|
}
|
||||||
const width = Number(attribs.width) || 800;
|
const width = Number(attribs.width) || 800;
|
||||||
const height = Number(attribs.height) || 600;
|
const height = Number(attribs.height) || 600;
|
||||||
|
@ -351,20 +352,21 @@ class HtmlHighlighter extends BaseHighlighter<string> {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
interface IContent {
|
|
||||||
format?: string;
|
|
||||||
// eslint-disable-next-line camelcase
|
|
||||||
formatted_body?: string;
|
|
||||||
body: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
interface IOpts {
|
interface IOpts {
|
||||||
highlightLink?: string;
|
highlightLink?: string;
|
||||||
disableBigEmoji?: boolean;
|
disableBigEmoji?: boolean;
|
||||||
stripReplyFallback?: boolean;
|
stripReplyFallback?: boolean;
|
||||||
returnString?: boolean;
|
returnString?: boolean;
|
||||||
forComposerQuote?: boolean;
|
forComposerQuote?: boolean;
|
||||||
ref?: React.Ref<any>;
|
ref?: React.Ref<HTMLSpanElement>;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface IOptsReturnNode extends IOpts {
|
||||||
|
returnString: false | undefined;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface IOptsReturnString extends IOpts {
|
||||||
|
returnString: true;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* turn a matrix event body into html
|
/* turn a matrix event body into html
|
||||||
|
@ -380,6 +382,8 @@ interface IOpts {
|
||||||
* opts.forComposerQuote: optional param to lessen the url rewriting done by sanitization, for quoting into composer
|
* opts.forComposerQuote: optional param to lessen the url rewriting done by sanitization, for quoting into composer
|
||||||
* opts.ref: React ref to attach to any React components returned (not compatible with opts.returnString)
|
* opts.ref: React ref to attach to any React components returned (not compatible with opts.returnString)
|
||||||
*/
|
*/
|
||||||
|
export function bodyToHtml(content: IContent, highlights: string[], opts: IOptsReturnString): string;
|
||||||
|
export function bodyToHtml(content: IContent, highlights: string[], opts: IOptsReturnNode): ReactNode;
|
||||||
export function bodyToHtml(content: IContent, highlights: string[], opts: IOpts = {}) {
|
export function bodyToHtml(content: IContent, highlights: string[], opts: IOpts = {}) {
|
||||||
const isHtmlMessage = content.format === "org.matrix.custom.html" && content.formatted_body;
|
const isHtmlMessage = content.format === "org.matrix.custom.html" && content.formatted_body;
|
||||||
let bodyHasEmoji = false;
|
let bodyHasEmoji = false;
|
||||||
|
@ -399,9 +403,14 @@ export function bodyToHtml(content: IContent, highlights: string[], opts: IOpts
|
||||||
try {
|
try {
|
||||||
if (highlights && highlights.length > 0) {
|
if (highlights && highlights.length > 0) {
|
||||||
const highlighter = new HtmlHighlighter("mx_EventTile_searchHighlight", opts.highlightLink);
|
const highlighter = new HtmlHighlighter("mx_EventTile_searchHighlight", opts.highlightLink);
|
||||||
const safeHighlights = highlights.map(function(highlight) {
|
const safeHighlights = highlights
|
||||||
return sanitizeHtml(highlight, sanitizeParams);
|
// sanitizeHtml can hang if an unclosed HTML tag is thrown at it
|
||||||
});
|
// A search for `<foo` will make the browser crash
|
||||||
|
// an alternative would be to escape HTML special characters
|
||||||
|
// but that would bring no additional benefit as the highlighter
|
||||||
|
// does not work with those special chars
|
||||||
|
.filter((highlight: string): boolean => !highlight.includes("<"))
|
||||||
|
.map((highlight: string): string => sanitizeHtml(highlight, sanitizeParams));
|
||||||
// XXX: hacky bodge to temporarily apply a textFilter to the sanitizeParams structure.
|
// XXX: hacky bodge to temporarily apply a textFilter to the sanitizeParams structure.
|
||||||
sanitizeParams.textFilter = function(safeText) {
|
sanitizeParams.textFilter = function(safeText) {
|
||||||
return highlighter.applyHighlights(safeText, safeHighlights).join('');
|
return highlighter.applyHighlights(safeText, safeHighlights).join('');
|
||||||
|
@ -501,7 +510,7 @@ export function bodyToHtml(content: IContent, highlights: string[], opts: IOpts
|
||||||
* @param {object} [options] Options for linkifyString. Default: linkifyMatrix.options
|
* @param {object} [options] Options for linkifyString. Default: linkifyMatrix.options
|
||||||
* @returns {string} Linkified string
|
* @returns {string} Linkified string
|
||||||
*/
|
*/
|
||||||
export function linkifyString(str: string, options = linkifyMatrix.options) {
|
export function linkifyString(str: string, options = linkifyMatrix.options): string {
|
||||||
return _linkifyString(str, options);
|
return _linkifyString(str, options);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -512,7 +521,7 @@ export function linkifyString(str: string, options = linkifyMatrix.options) {
|
||||||
* @param {object} [options] Options for linkifyElement. Default: linkifyMatrix.options
|
* @param {object} [options] Options for linkifyElement. Default: linkifyMatrix.options
|
||||||
* @returns {object}
|
* @returns {object}
|
||||||
*/
|
*/
|
||||||
export function linkifyElement(element: HTMLElement, options = linkifyMatrix.options) {
|
export function linkifyElement(element: HTMLElement, options = linkifyMatrix.options): HTMLElement {
|
||||||
return _linkifyElement(element, options);
|
return _linkifyElement(element, options);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -523,7 +532,7 @@ export function linkifyElement(element: HTMLElement, options = linkifyMatrix.opt
|
||||||
* @param {object} [options] Options for linkifyString. Default: linkifyMatrix.options
|
* @param {object} [options] Options for linkifyString. Default: linkifyMatrix.options
|
||||||
* @returns {string}
|
* @returns {string}
|
||||||
*/
|
*/
|
||||||
export function linkifyAndSanitizeHtml(dirtyHtml: string, options = linkifyMatrix.options) {
|
export function linkifyAndSanitizeHtml(dirtyHtml: string, options = linkifyMatrix.options): string {
|
||||||
return sanitizeHtml(linkifyString(dirtyHtml, options), sanitizeHtmlParams);
|
return sanitizeHtml(linkifyString(dirtyHtml, options), sanitizeHtmlParams);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -534,7 +543,7 @@ export function linkifyAndSanitizeHtml(dirtyHtml: string, options = linkifyMatri
|
||||||
* @param {Node} node
|
* @param {Node} node
|
||||||
* @returns {bool}
|
* @returns {bool}
|
||||||
*/
|
*/
|
||||||
export function checkBlockNode(node: Node) {
|
export function checkBlockNode(node: Node): boolean {
|
||||||
switch (node.nodeName) {
|
switch (node.nodeName) {
|
||||||
case "H1":
|
case "H1":
|
||||||
case "H2":
|
case "H2":
|
||||||
|
|
|
@ -17,7 +17,7 @@ limitations under the License.
|
||||||
import { SERVICE_TYPES } from 'matrix-js-sdk/src/service-types';
|
import { SERVICE_TYPES } from 'matrix-js-sdk/src/service-types';
|
||||||
import { createClient } from 'matrix-js-sdk/src/matrix';
|
import { createClient } from 'matrix-js-sdk/src/matrix';
|
||||||
|
|
||||||
import {MatrixClientPeg} from './MatrixClientPeg';
|
import { MatrixClientPeg } from './MatrixClientPeg';
|
||||||
import Modal from './Modal';
|
import Modal from './Modal';
|
||||||
import * as sdk from './index';
|
import * as sdk from './index';
|
||||||
import { _t } from './languageHandler';
|
import { _t } from './languageHandler';
|
||||||
|
|
|
@ -156,7 +156,7 @@ const messageComposerBindings = (): KeyBinding<MessageComposerAction>[] => {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return bindings;
|
return bindings;
|
||||||
}
|
};
|
||||||
|
|
||||||
const autocompleteBindings = (): KeyBinding<AutocompleteAction>[] => {
|
const autocompleteBindings = (): KeyBinding<AutocompleteAction>[] => {
|
||||||
return [
|
return [
|
||||||
|
@ -207,7 +207,7 @@ const autocompleteBindings = (): KeyBinding<AutocompleteAction>[] => {
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
}
|
};
|
||||||
|
|
||||||
const roomListBindings = (): KeyBinding<RoomListAction>[] => {
|
const roomListBindings = (): KeyBinding<RoomListAction>[] => {
|
||||||
return [
|
return [
|
||||||
|
@ -248,7 +248,7 @@ const roomListBindings = (): KeyBinding<RoomListAction>[] => {
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
}
|
};
|
||||||
|
|
||||||
const roomBindings = (): KeyBinding<RoomAction>[] => {
|
const roomBindings = (): KeyBinding<RoomAction>[] => {
|
||||||
const bindings: KeyBinding<RoomAction>[] = [
|
const bindings: KeyBinding<RoomAction>[] = [
|
||||||
|
@ -312,7 +312,7 @@ const roomBindings = (): KeyBinding<RoomAction>[] => {
|
||||||
}
|
}
|
||||||
|
|
||||||
return bindings;
|
return bindings;
|
||||||
}
|
};
|
||||||
|
|
||||||
const navigationBindings = (): KeyBinding<NavigationAction>[] => {
|
const navigationBindings = (): KeyBinding<NavigationAction>[] => {
|
||||||
return [
|
return [
|
||||||
|
@ -396,7 +396,7 @@ const navigationBindings = (): KeyBinding<NavigationAction>[] => {
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
}
|
};
|
||||||
|
|
||||||
export const defaultBindingsProvider: IKeyBindingsProvider = {
|
export const defaultBindingsProvider: IKeyBindingsProvider = {
|
||||||
getMessageComposerBindings: messageComposerBindings,
|
getMessageComposerBindings: messageComposerBindings,
|
||||||
|
@ -404,4 +404,4 @@ export const defaultBindingsProvider: IKeyBindingsProvider = {
|
||||||
getRoomListBindings: roomListBindings,
|
getRoomListBindings: roomListBindings,
|
||||||
getRoomBindings: roomBindings,
|
getRoomBindings: roomBindings,
|
||||||
getNavigationBindings: navigationBindings,
|
getNavigationBindings: navigationBindings,
|
||||||
}
|
};
|
||||||
|
|
|
@ -140,12 +140,12 @@ export type KeyCombo = {
|
||||||
ctrlKey?: boolean;
|
ctrlKey?: boolean;
|
||||||
metaKey?: boolean;
|
metaKey?: boolean;
|
||||||
shiftKey?: boolean;
|
shiftKey?: boolean;
|
||||||
}
|
};
|
||||||
|
|
||||||
export type KeyBinding<T extends string> = {
|
export type KeyBinding<T extends string> = {
|
||||||
action: T;
|
action: T;
|
||||||
keyCombo: KeyCombo;
|
keyCombo: KeyCombo;
|
||||||
}
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Helper method to check if a KeyboardEvent matches a KeyCombo
|
* Helper method to check if a KeyboardEvent matches a KeyCombo
|
||||||
|
|
|
@ -20,9 +20,9 @@ limitations under the License.
|
||||||
import { createClient } from 'matrix-js-sdk/src/matrix';
|
import { createClient } from 'matrix-js-sdk/src/matrix';
|
||||||
import { InvalidStoreError } from "matrix-js-sdk/src/errors";
|
import { InvalidStoreError } from "matrix-js-sdk/src/errors";
|
||||||
import { MatrixClient } from "matrix-js-sdk/src/client";
|
import { MatrixClient } from "matrix-js-sdk/src/client";
|
||||||
import {decryptAES, encryptAES} from "matrix-js-sdk/src/crypto/aes";
|
import { decryptAES, encryptAES, IEncryptedPayload } from "matrix-js-sdk/src/crypto/aes";
|
||||||
|
|
||||||
import {IMatrixClientCreds, MatrixClientPeg} from './MatrixClientPeg';
|
import { IMatrixClientCreds, MatrixClientPeg } from './MatrixClientPeg';
|
||||||
import SecurityCustomisations from "./customisations/Security";
|
import SecurityCustomisations from "./customisations/Security";
|
||||||
import EventIndexPeg from './indexing/EventIndexPeg';
|
import EventIndexPeg from './indexing/EventIndexPeg';
|
||||||
import createMatrixClient from './utils/createMatrixClient';
|
import createMatrixClient from './utils/createMatrixClient';
|
||||||
|
@ -33,7 +33,6 @@ import Presence from './Presence';
|
||||||
import dis from './dispatcher/dispatcher';
|
import dis from './dispatcher/dispatcher';
|
||||||
import DMRoomMap from './utils/DMRoomMap';
|
import DMRoomMap from './utils/DMRoomMap';
|
||||||
import Modal from './Modal';
|
import Modal from './Modal';
|
||||||
import * as sdk from './index';
|
|
||||||
import ActiveWidgetStore from './stores/ActiveWidgetStore';
|
import ActiveWidgetStore from './stores/ActiveWidgetStore';
|
||||||
import PlatformPeg from "./PlatformPeg";
|
import PlatformPeg from "./PlatformPeg";
|
||||||
import { sendLoginRequest } from "./Login";
|
import { sendLoginRequest } from "./Login";
|
||||||
|
@ -41,17 +40,21 @@ import * as StorageManager from './utils/StorageManager';
|
||||||
import SettingsStore from "./settings/SettingsStore";
|
import SettingsStore from "./settings/SettingsStore";
|
||||||
import TypingStore from "./stores/TypingStore";
|
import TypingStore from "./stores/TypingStore";
|
||||||
import ToastStore from "./stores/ToastStore";
|
import ToastStore from "./stores/ToastStore";
|
||||||
import {IntegrationManagers} from "./integrations/IntegrationManagers";
|
import { IntegrationManagers } from "./integrations/IntegrationManagers";
|
||||||
import {Mjolnir} from "./mjolnir/Mjolnir";
|
import { Mjolnir } from "./mjolnir/Mjolnir";
|
||||||
import DeviceListener from "./DeviceListener";
|
import DeviceListener from "./DeviceListener";
|
||||||
import {Jitsi} from "./widgets/Jitsi";
|
import { Jitsi } from "./widgets/Jitsi";
|
||||||
import {SSO_HOMESERVER_URL_KEY, SSO_ID_SERVER_URL_KEY, SSO_IDP_ID_KEY} from "./BasePlatform";
|
import { SSO_HOMESERVER_URL_KEY, SSO_ID_SERVER_URL_KEY, SSO_IDP_ID_KEY } from "./BasePlatform";
|
||||||
import ThreepidInviteStore from "./stores/ThreepidInviteStore";
|
import ThreepidInviteStore from "./stores/ThreepidInviteStore";
|
||||||
import CountlyAnalytics from "./CountlyAnalytics";
|
import CountlyAnalytics from "./CountlyAnalytics";
|
||||||
import CallHandler from './CallHandler';
|
import CallHandler from './CallHandler';
|
||||||
import LifecycleCustomisations from "./customisations/Lifecycle";
|
import LifecycleCustomisations from "./customisations/Lifecycle";
|
||||||
import ErrorDialog from "./components/views/dialogs/ErrorDialog";
|
import ErrorDialog from "./components/views/dialogs/ErrorDialog";
|
||||||
import {_t} from "./languageHandler";
|
import { _t } from "./languageHandler";
|
||||||
|
import LazyLoadingResyncDialog from "./components/views/dialogs/LazyLoadingResyncDialog";
|
||||||
|
import LazyLoadingDisabledDialog from "./components/views/dialogs/LazyLoadingDisabledDialog";
|
||||||
|
import SessionRestoreErrorDialog from "./components/views/dialogs/SessionRestoreErrorDialog";
|
||||||
|
import StorageEvictedDialog from "./components/views/dialogs/StorageEvictedDialog";
|
||||||
|
|
||||||
const HOMESERVER_URL_KEY = "mx_hs_url";
|
const HOMESERVER_URL_KEY = "mx_hs_url";
|
||||||
const ID_SERVER_URL_KEY = "mx_is_url";
|
const ID_SERVER_URL_KEY = "mx_is_url";
|
||||||
|
@ -154,7 +157,7 @@ export async function loadSession(opts: ILoadSessionOpts = {}): Promise<boolean>
|
||||||
* return [null, null].
|
* return [null, null].
|
||||||
*/
|
*/
|
||||||
export async function getStoredSessionOwner(): Promise<[string, boolean]> {
|
export async function getStoredSessionOwner(): Promise<[string, boolean]> {
|
||||||
const {hsUrl, userId, hasAccessToken, isGuest} = await getStoredSessionVars();
|
const { hsUrl, userId, hasAccessToken, isGuest } = await getStoredSessionVars();
|
||||||
return hsUrl && userId && hasAccessToken ? [userId, isGuest] : [null, null];
|
return hsUrl && userId && hasAccessToken ? [userId, isGuest] : [null, null];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -238,8 +241,6 @@ export function handleInvalidStoreError(e: InvalidStoreError): Promise<void> {
|
||||||
return Promise.resolve().then(() => {
|
return Promise.resolve().then(() => {
|
||||||
const lazyLoadEnabled = e.value;
|
const lazyLoadEnabled = e.value;
|
||||||
if (lazyLoadEnabled) {
|
if (lazyLoadEnabled) {
|
||||||
const LazyLoadingResyncDialog =
|
|
||||||
sdk.getComponent("views.dialogs.LazyLoadingResyncDialog");
|
|
||||||
return new Promise((resolve) => {
|
return new Promise((resolve) => {
|
||||||
Modal.createDialog(LazyLoadingResyncDialog, {
|
Modal.createDialog(LazyLoadingResyncDialog, {
|
||||||
onFinished: resolve,
|
onFinished: resolve,
|
||||||
|
@ -250,8 +251,6 @@ export function handleInvalidStoreError(e: InvalidStoreError): Promise<void> {
|
||||||
// between LL/non-LL version on same host.
|
// between LL/non-LL version on same host.
|
||||||
// as disabling LL when previously enabled
|
// as disabling LL when previously enabled
|
||||||
// is a strong indicator of this (/develop & /app)
|
// is a strong indicator of this (/develop & /app)
|
||||||
const LazyLoadingDisabledDialog =
|
|
||||||
sdk.getComponent("views.dialogs.LazyLoadingDisabledDialog");
|
|
||||||
return new Promise((resolve) => {
|
return new Promise((resolve) => {
|
||||||
Modal.createDialog(LazyLoadingDisabledDialog, {
|
Modal.createDialog(LazyLoadingDisabledDialog, {
|
||||||
onFinished: resolve,
|
onFinished: resolve,
|
||||||
|
@ -303,7 +302,7 @@ export interface IStoredSession {
|
||||||
hsUrl: string;
|
hsUrl: string;
|
||||||
isUrl: string;
|
isUrl: string;
|
||||||
hasAccessToken: boolean;
|
hasAccessToken: boolean;
|
||||||
accessToken: string | object;
|
accessToken: string | IEncryptedPayload;
|
||||||
userId: string;
|
userId: string;
|
||||||
deviceId: string;
|
deviceId: string;
|
||||||
isGuest: boolean;
|
isGuest: boolean;
|
||||||
|
@ -346,11 +345,11 @@ export async function getStoredSessionVars(): Promise<IStoredSession> {
|
||||||
isGuest = localStorage.getItem("matrix-is-guest") === "true";
|
isGuest = localStorage.getItem("matrix-is-guest") === "true";
|
||||||
}
|
}
|
||||||
|
|
||||||
return {hsUrl, isUrl, hasAccessToken, accessToken, userId, deviceId, isGuest};
|
return { hsUrl, isUrl, hasAccessToken, accessToken, userId, deviceId, isGuest };
|
||||||
}
|
}
|
||||||
|
|
||||||
// The pickle key is a string of unspecified length and format. For AES, we
|
// The pickle key is a string of unspecified length and format. For AES, we
|
||||||
// need a 256-bit Uint8Array. So we HKDF the pickle key to generate the AES
|
// need a 256-bit Uint8Array. So we HKDF the pickle key to generate the AES
|
||||||
// key. The AES key should be zeroed after it is used.
|
// key. The AES key should be zeroed after it is used.
|
||||||
async function pickleKeyToAesKey(pickleKey: string): Promise<Uint8Array> {
|
async function pickleKeyToAesKey(pickleKey: string): Promise<Uint8Array> {
|
||||||
const pickleKeyBuffer = new Uint8Array(pickleKey.length);
|
const pickleKeyBuffer = new Uint8Array(pickleKey.length);
|
||||||
|
@ -402,7 +401,7 @@ export async function restoreFromLocalStorage(opts?: { ignoreGuest?: boolean }):
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
const {hsUrl, isUrl, hasAccessToken, accessToken, userId, deviceId, isGuest} = await getStoredSessionVars();
|
const { hsUrl, isUrl, hasAccessToken, accessToken, userId, deviceId, isGuest } = await getStoredSessionVars();
|
||||||
|
|
||||||
if (hasAccessToken && !accessToken) {
|
if (hasAccessToken && !accessToken) {
|
||||||
abortLogin();
|
abortLogin();
|
||||||
|
@ -451,9 +450,6 @@ export async function restoreFromLocalStorage(opts?: { ignoreGuest?: boolean }):
|
||||||
async function handleLoadSessionFailure(e: Error): Promise<boolean> {
|
async function handleLoadSessionFailure(e: Error): Promise<boolean> {
|
||||||
console.error("Unable to load session", e);
|
console.error("Unable to load session", e);
|
||||||
|
|
||||||
const SessionRestoreErrorDialog =
|
|
||||||
sdk.getComponent('views.dialogs.SessionRestoreErrorDialog');
|
|
||||||
|
|
||||||
const modal = Modal.createTrackedDialog('Session Restore Error', '', SessionRestoreErrorDialog, {
|
const modal = Modal.createTrackedDialog('Session Restore Error', '', SessionRestoreErrorDialog, {
|
||||||
error: e.message,
|
error: e.message,
|
||||||
});
|
});
|
||||||
|
@ -495,7 +491,7 @@ export async function setLoggedIn(credentials: IMatrixClientCreds): Promise<Matr
|
||||||
console.log("Pickle key not created");
|
console.log("Pickle key not created");
|
||||||
}
|
}
|
||||||
|
|
||||||
return doSetLoggedIn(Object.assign({}, credentials, {pickleKey}), true);
|
return doSetLoggedIn(Object.assign({}, credentials, { pickleKey }), true);
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -562,7 +558,7 @@ async function doSetLoggedIn(
|
||||||
//
|
//
|
||||||
// we fire it *synchronously* to make sure it fires before on_logged_in.
|
// we fire it *synchronously* to make sure it fires before on_logged_in.
|
||||||
// (dis.dispatch uses `setTimeout`, which does not guarantee ordering.)
|
// (dis.dispatch uses `setTimeout`, which does not guarantee ordering.)
|
||||||
dis.dispatch({action: 'on_logging_in'}, true);
|
dis.dispatch({ action: 'on_logging_in' }, true);
|
||||||
|
|
||||||
if (clearStorageEnabled) {
|
if (clearStorageEnabled) {
|
||||||
await clearStorage();
|
await clearStorage();
|
||||||
|
@ -612,7 +608,6 @@ async function doSetLoggedIn(
|
||||||
}
|
}
|
||||||
|
|
||||||
function showStorageEvictedDialog(): Promise<boolean> {
|
function showStorageEvictedDialog(): Promise<boolean> {
|
||||||
const StorageEvictedDialog = sdk.getComponent('views.dialogs.StorageEvictedDialog');
|
|
||||||
return new Promise(resolve => {
|
return new Promise(resolve => {
|
||||||
Modal.createTrackedDialog('Storage evicted', '', StorageEvictedDialog, {
|
Modal.createTrackedDialog('Storage evicted', '', StorageEvictedDialog, {
|
||||||
onFinished: resolve,
|
onFinished: resolve,
|
||||||
|
@ -745,7 +740,7 @@ export function softLogout(): void {
|
||||||
// Ensure that we dispatch a view change **before** stopping the client so
|
// Ensure that we dispatch a view change **before** stopping the client so
|
||||||
// so that React components unmount first. This avoids React soft crashes
|
// so that React components unmount first. This avoids React soft crashes
|
||||||
// that can occur when components try to use a null client.
|
// that can occur when components try to use a null client.
|
||||||
dis.dispatch({action: 'on_client_not_viable'}); // generic version of on_logged_out
|
dis.dispatch({ action: 'on_client_not_viable' }); // generic version of on_logged_out
|
||||||
stopMatrixClient(/*unsetClient=*/false);
|
stopMatrixClient(/*unsetClient=*/false);
|
||||||
|
|
||||||
// DO NOT CALL LOGOUT. A soft logout preserves data, logout does not.
|
// DO NOT CALL LOGOUT. A soft logout preserves data, logout does not.
|
||||||
|
@ -772,7 +767,7 @@ async function startMatrixClient(startSyncing = true): Promise<void> {
|
||||||
// to add listeners for the 'sync' event so otherwise we'd have
|
// to add listeners for the 'sync' event so otherwise we'd have
|
||||||
// a race condition (and we need to dispatch synchronously for this
|
// a race condition (and we need to dispatch synchronously for this
|
||||||
// to work).
|
// to work).
|
||||||
dis.dispatch({action: 'will_start_client'}, true);
|
dis.dispatch({ action: 'will_start_client' }, true);
|
||||||
|
|
||||||
// reset things first just in case
|
// reset things first just in case
|
||||||
TypingStore.sharedInstance().reset();
|
TypingStore.sharedInstance().reset();
|
||||||
|
@ -814,7 +809,7 @@ async function startMatrixClient(startSyncing = true): Promise<void> {
|
||||||
|
|
||||||
// dispatch that we finished starting up to wire up any other bits
|
// dispatch that we finished starting up to wire up any other bits
|
||||||
// of the matrix client that cannot be set prior to starting up.
|
// of the matrix client that cannot be set prior to starting up.
|
||||||
dis.dispatch({action: 'client_started'});
|
dis.dispatch({ action: 'client_started' });
|
||||||
|
|
||||||
if (isSoftLogout()) {
|
if (isSoftLogout()) {
|
||||||
softLogout();
|
softLogout();
|
||||||
|
@ -830,9 +825,9 @@ export async function onLoggedOut(): Promise<void> {
|
||||||
// Ensure that we dispatch a view change **before** stopping the client so
|
// Ensure that we dispatch a view change **before** stopping the client so
|
||||||
// so that React components unmount first. This avoids React soft crashes
|
// so that React components unmount first. This avoids React soft crashes
|
||||||
// that can occur when components try to use a null client.
|
// that can occur when components try to use a null client.
|
||||||
dis.dispatch({action: 'on_logged_out'}, true);
|
dis.dispatch({ action: 'on_logged_out' }, true);
|
||||||
stopMatrixClient();
|
stopMatrixClient();
|
||||||
await clearStorage({deleteEverything: true});
|
await clearStorage({ deleteEverything: true });
|
||||||
LifecycleCustomisations.onLoggedOutAndStorageCleared?.();
|
LifecycleCustomisations.onLoggedOutAndStorageCleared?.();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -16,7 +16,7 @@ limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
// @ts-ignore - XXX: tsc doesn't like this: our js-sdk imports are complex so this isn't surprising
|
// @ts-ignore - XXX: tsc doesn't like this: our js-sdk imports are complex so this isn't surprising
|
||||||
import {createClient} from "matrix-js-sdk/src/matrix";
|
import { createClient } from "matrix-js-sdk/src/matrix";
|
||||||
import { MatrixClient } from "matrix-js-sdk/src/client";
|
import { MatrixClient } from "matrix-js-sdk/src/client";
|
||||||
import { IMatrixClientCreds } from "./MatrixClientPeg";
|
import { IMatrixClientCreds } from "./MatrixClientPeg";
|
||||||
import SecurityCustomisations from "./customisations/Security";
|
import SecurityCustomisations from "./customisations/Security";
|
||||||
|
@ -190,7 +190,6 @@ export default class Login {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Send a login request to the given server, and format the response
|
* Send a login request to the given server, and format the response
|
||||||
* as a MatrixClientCreds
|
* as a MatrixClientCreds
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
/*
|
/*
|
||||||
Copyright 2016 OpenMarket Ltd
|
Copyright 2016 OpenMarket Ltd
|
||||||
|
Copyright 2021 The Matrix.org Foundation C.I.C.
|
||||||
|
|
||||||
Licensed under the Apache License, Version 2.0 (the "License");
|
Licensed under the Apache License, Version 2.0 (the "License");
|
||||||
you may not use this file except in compliance with the License.
|
you may not use this file except in compliance with the License.
|
||||||
|
@ -15,16 +16,24 @@ limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import * as commonmark from 'commonmark';
|
import * as commonmark from 'commonmark';
|
||||||
import {escape} from "lodash";
|
import { escape } from "lodash";
|
||||||
|
|
||||||
const ALLOWED_HTML_TAGS = ['sub', 'sup', 'del', 'u'];
|
const ALLOWED_HTML_TAGS = ['sub', 'sup', 'del', 'u'];
|
||||||
|
|
||||||
// These types of node are definitely text
|
// These types of node are definitely text
|
||||||
const TEXT_NODES = ['text', 'softbreak', 'linebreak', 'paragraph', 'document'];
|
const TEXT_NODES = ['text', 'softbreak', 'linebreak', 'paragraph', 'document'];
|
||||||
|
|
||||||
function is_allowed_html_tag(node) {
|
// As far as @types/commonmark is concerned, these are not public, so add them
|
||||||
|
interface CommonmarkHtmlRendererInternal extends commonmark.HtmlRenderer {
|
||||||
|
paragraph: (node: commonmark.Node, entering: boolean) => void;
|
||||||
|
link: (node: commonmark.Node, entering: boolean) => void;
|
||||||
|
html_inline: (node: commonmark.Node) => void; // eslint-disable-line camelcase
|
||||||
|
html_block: (node: commonmark.Node) => void; // eslint-disable-line camelcase
|
||||||
|
}
|
||||||
|
|
||||||
|
function isAllowedHtmlTag(node: commonmark.Node): boolean {
|
||||||
if (node.literal != null &&
|
if (node.literal != null &&
|
||||||
node.literal.match('^<((div|span) data-mx-maths="[^"]*"|\/(div|span))>$') != null) {
|
node.literal.match('^<((div|span) data-mx-maths="[^"]*"|/(div|span))>$') != null) {
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -39,21 +48,12 @@ function is_allowed_html_tag(node) {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
function html_if_tag_allowed(node) {
|
|
||||||
if (is_allowed_html_tag(node)) {
|
|
||||||
this.lit(node.literal);
|
|
||||||
return;
|
|
||||||
} else {
|
|
||||||
this.lit(escape(node.literal));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/*
|
/*
|
||||||
* Returns true if the parse output containing the node
|
* Returns true if the parse output containing the node
|
||||||
* comprises multiple block level elements (ie. lines),
|
* comprises multiple block level elements (ie. lines),
|
||||||
* or false if it is only a single line.
|
* or false if it is only a single line.
|
||||||
*/
|
*/
|
||||||
function is_multi_line(node) {
|
function isMultiLine(node: commonmark.Node): boolean {
|
||||||
let par = node;
|
let par = node;
|
||||||
while (par.parent) {
|
while (par.parent) {
|
||||||
par = par.parent;
|
par = par.parent;
|
||||||
|
@ -67,6 +67,9 @@ function is_multi_line(node) {
|
||||||
* it's plain text.
|
* it's plain text.
|
||||||
*/
|
*/
|
||||||
export default class Markdown {
|
export default class Markdown {
|
||||||
|
private input: string;
|
||||||
|
private parsed: commonmark.Node;
|
||||||
|
|
||||||
constructor(input) {
|
constructor(input) {
|
||||||
this.input = input;
|
this.input = input;
|
||||||
|
|
||||||
|
@ -74,7 +77,7 @@ export default class Markdown {
|
||||||
this.parsed = parser.parse(this.input);
|
this.parsed = parser.parse(this.input);
|
||||||
}
|
}
|
||||||
|
|
||||||
isPlainText() {
|
isPlainText(): boolean {
|
||||||
const walker = this.parsed.walker();
|
const walker = this.parsed.walker();
|
||||||
|
|
||||||
let ev;
|
let ev;
|
||||||
|
@ -87,7 +90,7 @@ export default class Markdown {
|
||||||
// if it's an allowed html tag, we need to render it and therefore
|
// if it's an allowed html tag, we need to render it and therefore
|
||||||
// we will need to use HTML. If it's not allowed, it's not HTML since
|
// we will need to use HTML. If it's not allowed, it's not HTML since
|
||||||
// we'll just be treating it as text.
|
// we'll just be treating it as text.
|
||||||
if (is_allowed_html_tag(node)) {
|
if (isAllowedHtmlTag(node)) {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
|
@ -97,7 +100,7 @@ export default class Markdown {
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
|
|
||||||
toHTML({ externalLinks = false } = {}) {
|
toHTML({ externalLinks = false } = {}): string {
|
||||||
const renderer = new commonmark.HtmlRenderer({
|
const renderer = new commonmark.HtmlRenderer({
|
||||||
safe: false,
|
safe: false,
|
||||||
|
|
||||||
|
@ -107,7 +110,7 @@ export default class Markdown {
|
||||||
// block quote ends up all on one line
|
// block quote ends up all on one line
|
||||||
// (https://github.com/vector-im/element-web/issues/3154)
|
// (https://github.com/vector-im/element-web/issues/3154)
|
||||||
softbreak: '<br />',
|
softbreak: '<br />',
|
||||||
});
|
}) as CommonmarkHtmlRendererInternal;
|
||||||
|
|
||||||
// Trying to strip out the wrapping <p/> causes a lot more complication
|
// Trying to strip out the wrapping <p/> causes a lot more complication
|
||||||
// than it's worth, i think. For instance, this code will go and strip
|
// than it's worth, i think. For instance, this code will go and strip
|
||||||
|
@ -118,16 +121,16 @@ export default class Markdown {
|
||||||
//
|
//
|
||||||
// Let's try sending with <p/>s anyway for now, though.
|
// Let's try sending with <p/>s anyway for now, though.
|
||||||
|
|
||||||
const real_paragraph = renderer.paragraph;
|
const realParagraph = renderer.paragraph;
|
||||||
|
|
||||||
renderer.paragraph = function(node, entering) {
|
renderer.paragraph = function(node: commonmark.Node, entering: boolean) {
|
||||||
// If there is only one top level node, just return the
|
// If there is only one top level node, just return the
|
||||||
// bare text: it's a single line of text and so should be
|
// bare text: it's a single line of text and so should be
|
||||||
// 'inline', rather than unnecessarily wrapped in its own
|
// 'inline', rather than unnecessarily wrapped in its own
|
||||||
// p tag. If, however, we have multiple nodes, each gets
|
// p tag. If, however, we have multiple nodes, each gets
|
||||||
// its own p tag to keep them as separate paragraphs.
|
// its own p tag to keep them as separate paragraphs.
|
||||||
if (is_multi_line(node)) {
|
if (isMultiLine(node)) {
|
||||||
real_paragraph.call(this, node, entering);
|
realParagraph.call(this, node, entering);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -150,19 +153,26 @@ export default class Markdown {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
renderer.html_inline = html_if_tag_allowed;
|
renderer.html_inline = function(node: commonmark.Node) {
|
||||||
|
if (isAllowedHtmlTag(node)) {
|
||||||
|
this.lit(node.literal);
|
||||||
|
return;
|
||||||
|
} else {
|
||||||
|
this.lit(escape(node.literal));
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
renderer.html_block = function(node) {
|
renderer.html_block = function(node: commonmark.Node) {
|
||||||
/*
|
/*
|
||||||
// as with `paragraph`, we only insert line breaks
|
// as with `paragraph`, we only insert line breaks
|
||||||
// if there are multiple lines in the markdown.
|
// if there are multiple lines in the markdown.
|
||||||
const isMultiLine = is_multi_line(node);
|
const isMultiLine = is_multi_line(node);
|
||||||
if (isMultiLine) this.cr();
|
if (isMultiLine) this.cr();
|
||||||
*/
|
*/
|
||||||
html_if_tag_allowed.call(this, node);
|
renderer.html_inline(node);
|
||||||
/*
|
/*
|
||||||
if (isMultiLine) this.cr();
|
if (isMultiLine) this.cr();
|
||||||
*/
|
*/
|
||||||
};
|
};
|
||||||
|
|
||||||
return renderer.render(this.parsed);
|
return renderer.render(this.parsed);
|
||||||
|
@ -177,23 +187,22 @@ export default class Markdown {
|
||||||
* N.B. this does **NOT** render arbitrary MD to plain text - only MD
|
* N.B. this does **NOT** render arbitrary MD to plain text - only MD
|
||||||
* which has no formatting. Otherwise it emits HTML(!).
|
* which has no formatting. Otherwise it emits HTML(!).
|
||||||
*/
|
*/
|
||||||
toPlaintext() {
|
toPlaintext(): string {
|
||||||
const renderer = new commonmark.HtmlRenderer({safe: false});
|
const renderer = new commonmark.HtmlRenderer({ safe: false }) as CommonmarkHtmlRendererInternal;
|
||||||
const real_paragraph = renderer.paragraph;
|
|
||||||
|
|
||||||
renderer.paragraph = function(node, entering) {
|
renderer.paragraph = function(node: commonmark.Node, entering: boolean) {
|
||||||
// as with toHTML, only append lines to paragraphs if there are
|
// as with toHTML, only append lines to paragraphs if there are
|
||||||
// multiple paragraphs
|
// multiple paragraphs
|
||||||
if (is_multi_line(node)) {
|
if (isMultiLine(node)) {
|
||||||
if (!entering && node.next) {
|
if (!entering && node.next) {
|
||||||
this.lit('\n\n');
|
this.lit('\n\n');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
renderer.html_block = function(node) {
|
renderer.html_block = function(node: commonmark.Node) {
|
||||||
this.lit(node.literal);
|
this.lit(node.literal);
|
||||||
if (is_multi_line(node) && node.next) this.lit('\n\n');
|
if (isMultiLine(node) && node.next) this.lit('\n\n');
|
||||||
};
|
};
|
||||||
|
|
||||||
return renderer.render(this.parsed);
|
return renderer.render(this.parsed);
|
|
@ -18,22 +18,22 @@ limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import { ICreateClientOpts } from 'matrix-js-sdk/src/matrix';
|
import { ICreateClientOpts } from 'matrix-js-sdk/src/matrix';
|
||||||
import {MatrixClient} from 'matrix-js-sdk/src/client';
|
import { MatrixClient } from 'matrix-js-sdk/src/client';
|
||||||
import {MemoryStore} from 'matrix-js-sdk/src/store/memory';
|
import { MemoryStore } from 'matrix-js-sdk/src/store/memory';
|
||||||
import * as utils from 'matrix-js-sdk/src/utils';
|
import * as utils from 'matrix-js-sdk/src/utils';
|
||||||
import {EventTimeline} from 'matrix-js-sdk/src/models/event-timeline';
|
import { EventTimeline } from 'matrix-js-sdk/src/models/event-timeline';
|
||||||
import {EventTimelineSet} from 'matrix-js-sdk/src/models/event-timeline-set';
|
import { EventTimelineSet } from 'matrix-js-sdk/src/models/event-timeline-set';
|
||||||
import * as sdk from './index';
|
import * as sdk from './index';
|
||||||
import createMatrixClient from './utils/createMatrixClient';
|
import createMatrixClient from './utils/createMatrixClient';
|
||||||
import SettingsStore from './settings/SettingsStore';
|
import SettingsStore from './settings/SettingsStore';
|
||||||
import MatrixActionCreators from './actions/MatrixActionCreators';
|
import MatrixActionCreators from './actions/MatrixActionCreators';
|
||||||
import Modal from './Modal';
|
import Modal from './Modal';
|
||||||
import {verificationMethods} from 'matrix-js-sdk/src/crypto';
|
import { verificationMethods } from 'matrix-js-sdk/src/crypto';
|
||||||
import MatrixClientBackedSettingsHandler from "./settings/handlers/MatrixClientBackedSettingsHandler";
|
import MatrixClientBackedSettingsHandler from "./settings/handlers/MatrixClientBackedSettingsHandler";
|
||||||
import * as StorageManager from './utils/StorageManager';
|
import * as StorageManager from './utils/StorageManager';
|
||||||
import IdentityAuthClient from './IdentityAuthClient';
|
import IdentityAuthClient from './IdentityAuthClient';
|
||||||
import { crossSigningCallbacks, tryToUnlockSecretStorageWithDehydrationKey } from './SecurityManager';
|
import { crossSigningCallbacks, tryToUnlockSecretStorageWithDehydrationKey } from './SecurityManager';
|
||||||
import {SHOW_QR_CODE_METHOD} from "matrix-js-sdk/src/crypto/verification/QRCode";
|
import { SHOW_QR_CODE_METHOD } from "matrix-js-sdk/src/crypto/verification/QRCode";
|
||||||
import SecurityCustomisations from "./customisations/Security";
|
import SecurityCustomisations from "./customisations/Security";
|
||||||
|
|
||||||
export interface IMatrixClientCreds {
|
export interface IMatrixClientCreds {
|
||||||
|
@ -219,6 +219,7 @@ class _MatrixClientPeg implements IMatrixClientPeg {
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
if (e && e.name === 'InvalidCryptoStoreError') {
|
if (e && e.name === 'InvalidCryptoStoreError') {
|
||||||
// The js-sdk found a crypto DB too new for it to use
|
// The js-sdk found a crypto DB too new for it to use
|
||||||
|
// FIXME: Using an import will result in test failures
|
||||||
const CryptoStoreTooNewDialog =
|
const CryptoStoreTooNewDialog =
|
||||||
sdk.getComponent("views.dialogs.CryptoStoreTooNewDialog");
|
sdk.getComponent("views.dialogs.CryptoStoreTooNewDialog");
|
||||||
Modal.createDialog(CryptoStoreTooNewDialog);
|
Modal.createDialog(CryptoStoreTooNewDialog);
|
||||||
|
|
120
src/MediaDeviceHandler.ts
Normal file
|
@ -0,0 +1,120 @@
|
||||||
|
/*
|
||||||
|
Copyright 2017 Michael Telatynski <7t3chguy@gmail.com>
|
||||||
|
Copyright 2021 Šimon Brandner <simon.bra.ag@gmail.com>
|
||||||
|
|
||||||
|
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 SettingsStore from "./settings/SettingsStore";
|
||||||
|
import { SettingLevel } from "./settings/SettingLevel";
|
||||||
|
import { setMatrixCallAudioInput, setMatrixCallVideoInput } from "matrix-js-sdk/src/matrix";
|
||||||
|
import EventEmitter from 'events';
|
||||||
|
|
||||||
|
interface IMediaDevices {
|
||||||
|
audioOutput: Array<MediaDeviceInfo>;
|
||||||
|
audioInput: Array<MediaDeviceInfo>;
|
||||||
|
videoInput: Array<MediaDeviceInfo>;
|
||||||
|
}
|
||||||
|
|
||||||
|
export enum MediaDeviceHandlerEvent {
|
||||||
|
AudioOutputChanged = "audio_output_changed",
|
||||||
|
}
|
||||||
|
|
||||||
|
export default class MediaDeviceHandler extends EventEmitter {
|
||||||
|
private static internalInstance;
|
||||||
|
|
||||||
|
public static get instance(): MediaDeviceHandler {
|
||||||
|
if (!MediaDeviceHandler.internalInstance) {
|
||||||
|
MediaDeviceHandler.internalInstance = new MediaDeviceHandler();
|
||||||
|
}
|
||||||
|
return MediaDeviceHandler.internalInstance;
|
||||||
|
}
|
||||||
|
|
||||||
|
public static async hasAnyLabeledDevices(): Promise<boolean> {
|
||||||
|
const devices = await navigator.mediaDevices.enumerateDevices();
|
||||||
|
return devices.some(d => Boolean(d.label));
|
||||||
|
}
|
||||||
|
|
||||||
|
public static async getDevices(): Promise<IMediaDevices> {
|
||||||
|
// Only needed for Electron atm, though should work in modern browsers
|
||||||
|
// once permission has been granted to the webapp
|
||||||
|
|
||||||
|
try {
|
||||||
|
const devices = await navigator.mediaDevices.enumerateDevices();
|
||||||
|
|
||||||
|
const audioOutput = [];
|
||||||
|
const audioInput = [];
|
||||||
|
const videoInput = [];
|
||||||
|
|
||||||
|
devices.forEach((device) => {
|
||||||
|
switch (device.kind) {
|
||||||
|
case 'audiooutput': audioOutput.push(device); break;
|
||||||
|
case 'audioinput': audioInput.push(device); break;
|
||||||
|
case 'videoinput': videoInput.push(device); break;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
return { audioOutput, audioInput, videoInput };
|
||||||
|
} catch (error) {
|
||||||
|
console.warn('Unable to refresh WebRTC Devices: ', error);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Retrieves devices from the SettingsStore and tells the js-sdk to use them
|
||||||
|
*/
|
||||||
|
public static loadDevices(): void {
|
||||||
|
const audioDeviceId = SettingsStore.getValue("webrtc_audioinput");
|
||||||
|
const videoDeviceId = SettingsStore.getValue("webrtc_videoinput");
|
||||||
|
|
||||||
|
setMatrixCallAudioInput(audioDeviceId);
|
||||||
|
setMatrixCallVideoInput(videoDeviceId);
|
||||||
|
}
|
||||||
|
|
||||||
|
public setAudioOutput(deviceId: string): void {
|
||||||
|
SettingsStore.setValue("webrtc_audiooutput", null, SettingLevel.DEVICE, deviceId);
|
||||||
|
this.emit(MediaDeviceHandlerEvent.AudioOutputChanged, deviceId);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* This will not change the device that a potential call uses. The call will
|
||||||
|
* need to be ended and started again for this change to take effect
|
||||||
|
* @param {string} deviceId
|
||||||
|
*/
|
||||||
|
public setAudioInput(deviceId: string): void {
|
||||||
|
SettingsStore.setValue("webrtc_audioinput", null, SettingLevel.DEVICE, deviceId);
|
||||||
|
setMatrixCallAudioInput(deviceId);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* This will not change the device that a potential call uses. The call will
|
||||||
|
* need to be ended and started again for this change to take effect
|
||||||
|
* @param {string} deviceId
|
||||||
|
*/
|
||||||
|
public setVideoInput(deviceId: string): void {
|
||||||
|
SettingsStore.setValue("webrtc_videoinput", null, SettingLevel.DEVICE, deviceId);
|
||||||
|
setMatrixCallVideoInput(deviceId);
|
||||||
|
}
|
||||||
|
|
||||||
|
public static getAudioOutput(): string {
|
||||||
|
return SettingsStore.getValueAt(SettingLevel.DEVICE, "webrtc_audiooutput");
|
||||||
|
}
|
||||||
|
|
||||||
|
public static getAudioInput(): string {
|
||||||
|
return SettingsStore.getValueAt(SettingLevel.DEVICE, "webrtc_audioinput");
|
||||||
|
}
|
||||||
|
|
||||||
|
public static getVideoInput(): string {
|
||||||
|
return SettingsStore.getValueAt(SettingLevel.DEVICE, "webrtc_videoinput");
|
||||||
|
}
|
||||||
|
}
|
|
@ -15,14 +15,13 @@ See the License for the specific language governing permissions and
|
||||||
limitations under the License.
|
limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import ReactDOM from 'react-dom';
|
import ReactDOM from 'react-dom';
|
||||||
import classNames from 'classnames';
|
import classNames from 'classnames';
|
||||||
|
import { defer } from "matrix-js-sdk/src/utils";
|
||||||
|
|
||||||
import Analytics from './Analytics';
|
import Analytics from './Analytics';
|
||||||
import dis from './dispatcher/dispatcher';
|
import dis from './dispatcher/dispatcher';
|
||||||
import {defer} from './utils/promise';
|
|
||||||
import AsyncWrapper from './AsyncWrapper';
|
import AsyncWrapper from './AsyncWrapper';
|
||||||
|
|
||||||
const DIALOG_CONTAINER_ID = "mx_Dialog_Container";
|
const DIALOG_CONTAINER_ID = "mx_Dialog_Container";
|
||||||
|
@ -193,7 +192,7 @@ export class ModalManager {
|
||||||
modal.elem = <AsyncWrapper key={modalCount} prom={prom} {...props} onFinished={closeDialog} />;
|
modal.elem = <AsyncWrapper key={modalCount} prom={prom} {...props} onFinished={closeDialog} />;
|
||||||
modal.close = closeDialog;
|
modal.close = closeDialog;
|
||||||
|
|
||||||
return {modal, closeDialog, onFinishedProm};
|
return { modal, closeDialog, onFinishedProm };
|
||||||
}
|
}
|
||||||
|
|
||||||
private getCloseFn<T extends any[]>(
|
private getCloseFn<T extends any[]>(
|
||||||
|
@ -282,7 +281,7 @@ export class ModalManager {
|
||||||
isStaticModal = false,
|
isStaticModal = false,
|
||||||
options: IOptions<T> = {},
|
options: IOptions<T> = {},
|
||||||
): IHandle<T> {
|
): IHandle<T> {
|
||||||
const {modal, closeDialog, onFinishedProm} = this.buildModal<T>(prom, props, className, options);
|
const { modal, closeDialog, onFinishedProm } = this.buildModal<T>(prom, props, className, options);
|
||||||
if (isPriorityModal) {
|
if (isPriorityModal) {
|
||||||
// XXX: This is destructive
|
// XXX: This is destructive
|
||||||
this.priorityModal = modal;
|
this.priorityModal = modal;
|
||||||
|
@ -305,7 +304,7 @@ export class ModalManager {
|
||||||
props?: IProps<T>,
|
props?: IProps<T>,
|
||||||
className?: string,
|
className?: string,
|
||||||
): IHandle<T> {
|
): IHandle<T> {
|
||||||
const {modal, closeDialog, onFinishedProm} = this.buildModal<T>(prom, props, className, {});
|
const { modal, closeDialog, onFinishedProm } = this.buildModal<T>(prom, props, className, {});
|
||||||
|
|
||||||
this.modals.push(modal);
|
this.modals.push(modal);
|
||||||
this.reRender();
|
this.reRender();
|
||||||
|
@ -385,7 +384,7 @@ export class ModalManager {
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
||||||
ReactDOM.render(dialog, ModalManager.getOrCreateContainer());
|
setImmediate(() => ReactDOM.render(dialog, ModalManager.getOrCreateContainer()));
|
||||||
} else {
|
} else {
|
||||||
// This is safe to call repeatedly if we happen to do that
|
// This is safe to call repeatedly if we happen to do that
|
||||||
ReactDOM.unmountComponentAtNode(ModalManager.getOrCreateContainer());
|
ReactDOM.unmountComponentAtNode(ModalManager.getOrCreateContainer());
|
||||||
|
|
|
@ -27,16 +27,16 @@ import * as TextForEvent from './TextForEvent';
|
||||||
import Analytics from './Analytics';
|
import Analytics from './Analytics';
|
||||||
import * as Avatar from './Avatar';
|
import * as Avatar from './Avatar';
|
||||||
import dis from './dispatcher/dispatcher';
|
import dis from './dispatcher/dispatcher';
|
||||||
import * as sdk from './index';
|
|
||||||
import { _t } from './languageHandler';
|
import { _t } from './languageHandler';
|
||||||
import Modal from './Modal';
|
import Modal from './Modal';
|
||||||
import SettingsStore from "./settings/SettingsStore";
|
import SettingsStore from "./settings/SettingsStore";
|
||||||
import { hideToast as hideNotificationsToast } from "./toasts/DesktopNotificationsToast";
|
import { hideToast as hideNotificationsToast } from "./toasts/DesktopNotificationsToast";
|
||||||
import {SettingLevel} from "./settings/SettingLevel";
|
import { SettingLevel } from "./settings/SettingLevel";
|
||||||
import {isPushNotifyDisabled} from "./settings/controllers/NotificationControllers";
|
import { isPushNotifyDisabled } from "./settings/controllers/NotificationControllers";
|
||||||
import RoomViewStore from "./stores/RoomViewStore";
|
import RoomViewStore from "./stores/RoomViewStore";
|
||||||
import UserActivity from "./UserActivity";
|
import UserActivity from "./UserActivity";
|
||||||
import {mediaFromMxc} from "./customisations/Media";
|
import { mediaFromMxc } from "./customisations/Media";
|
||||||
|
import ErrorDialog from "./components/views/dialogs/ErrorDialog";
|
||||||
|
|
||||||
/*
|
/*
|
||||||
* Dispatches:
|
* Dispatches:
|
||||||
|
@ -68,7 +68,7 @@ export const Notifier = {
|
||||||
// or not
|
// or not
|
||||||
pendingEncryptedEventIds: [],
|
pendingEncryptedEventIds: [],
|
||||||
|
|
||||||
notificationMessageForEvent: function(ev: MatrixEvent) {
|
notificationMessageForEvent: function(ev: MatrixEvent): string {
|
||||||
if (typehandlers.hasOwnProperty(ev.getContent().msgtype)) {
|
if (typehandlers.hasOwnProperty(ev.getContent().msgtype)) {
|
||||||
return typehandlers[ev.getContent().msgtype](ev);
|
return typehandlers[ev.getContent().msgtype](ev);
|
||||||
}
|
}
|
||||||
|
@ -240,7 +240,6 @@ export const Notifier = {
|
||||||
? _t('%(brand)s does not have permission to send you notifications - ' +
|
? _t('%(brand)s does not have permission to send you notifications - ' +
|
||||||
'please check your browser settings', { brand })
|
'please check your browser settings', { brand })
|
||||||
: _t('%(brand)s was not given permission to send notifications - please try again', { brand });
|
: _t('%(brand)s was not given permission to send notifications - please try again', { brand });
|
||||||
const ErrorDialog = sdk.getComponent('dialogs.ErrorDialog');
|
|
||||||
Modal.createTrackedDialog('Unable to enable Notifications', result, ErrorDialog, {
|
Modal.createTrackedDialog('Unable to enable Notifications', result, ErrorDialog, {
|
||||||
title: _t('Unable to enable Notifications'),
|
title: _t('Unable to enable Notifications'),
|
||||||
description,
|
description,
|
||||||
|
|
|
@ -16,10 +16,10 @@ See the License for the specific language governing permissions and
|
||||||
limitations under the License.
|
limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import {MatrixClientPeg} from "./MatrixClientPeg";
|
import { MatrixClientPeg } from "./MatrixClientPeg";
|
||||||
import dis from "./dispatcher/dispatcher";
|
import dis from "./dispatcher/dispatcher";
|
||||||
import Timer from './utils/Timer';
|
import Timer from './utils/Timer';
|
||||||
import {ActionPayload} from "./dispatcher/payloads";
|
import { ActionPayload } from "./dispatcher/payloads";
|
||||||
|
|
||||||
// Time in ms after that a user is considered as unavailable/away
|
// Time in ms after that a user is considered as unavailable/away
|
||||||
const UNAVAILABLE_TIME_MS = 3 * 60 * 1000; // 3 mins
|
const UNAVAILABLE_TIME_MS = 3 * 60 * 1000; // 3 mins
|
||||||
|
@ -78,7 +78,7 @@ class Presence {
|
||||||
this.setState(State.Online);
|
this.setState(State.Online);
|
||||||
this.unavailableTimer.restart();
|
this.unavailableTimer.restart();
|
||||||
}
|
}
|
||||||
}
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Set the presence state.
|
* Set the presence state.
|
||||||
|
@ -98,7 +98,7 @@ class Presence {
|
||||||
}
|
}
|
||||||
|
|
||||||
try {
|
try {
|
||||||
await MatrixClientPeg.get().setPresence({presence: this.state});
|
await MatrixClientPeg.get().setPresence({ presence: this.state });
|
||||||
console.info("Presence:", newState);
|
console.info("Presence:", newState);
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
console.error("Failed to set presence:", err);
|
console.error("Failed to set presence:", err);
|
||||||
|
|
|
@ -53,16 +53,16 @@ export async function startAnyRegistrationFlow(options) {
|
||||||
extraButtons: [
|
extraButtons: [
|
||||||
<button key="start_login" onClick={() => {
|
<button key="start_login" onClick={() => {
|
||||||
modal.close();
|
modal.close();
|
||||||
dis.dispatch({action: 'start_login', screenAfterLogin: options.screen_after});
|
dis.dispatch({ action: 'start_login', screenAfterLogin: options.screen_after });
|
||||||
}}>{ _t('Sign In') }</button>,
|
}}>{ _t('Sign In') }</button>,
|
||||||
],
|
],
|
||||||
onFinished: (proceed) => {
|
onFinished: (proceed) => {
|
||||||
if (proceed) {
|
if (proceed) {
|
||||||
dis.dispatch({action: 'start_registration', screenAfterLogin: options.screen_after});
|
dis.dispatch({ action: 'start_registration', screenAfterLogin: options.screen_after });
|
||||||
} else if (options.go_home_on_cancel) {
|
} else if (options.go_home_on_cancel) {
|
||||||
dis.dispatch({action: 'view_home_page'});
|
dis.dispatch({ action: 'view_home_page' });
|
||||||
} else if (options.go_welcome_on_cancel) {
|
} else if (options.go_welcome_on_cancel) {
|
||||||
dis.dispatch({action: 'view_welcome_page'});
|
dis.dispatch({ action: 'view_welcome_page' });
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
|
@ -31,6 +31,6 @@ export function textualPowerLevel(level: number, usersDefault: number): string {
|
||||||
if (LEVEL_ROLE_MAP[level]) {
|
if (LEVEL_ROLE_MAP[level]) {
|
||||||
return LEVEL_ROLE_MAP[level];
|
return LEVEL_ROLE_MAP[level];
|
||||||
} else {
|
} else {
|
||||||
return _t("Custom (%(level)s)", {level});
|
return _t("Custom (%(level)s)", { level });
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,7 +1,5 @@
|
||||||
/*
|
/*
|
||||||
Copyright 2016 OpenMarket Ltd
|
Copyright 2016 - 2021 The Matrix.org Foundation C.I.C.
|
||||||
Copyright 2017, 2018 New Vector Ltd
|
|
||||||
Copyright 2020 The Matrix.org Foundation C.I.C.
|
|
||||||
|
|
||||||
Licensed under the Apache License, Version 2.0 (the "License");
|
Licensed under the Apache License, Version 2.0 (the "License");
|
||||||
you may not use this file except in compliance with the License.
|
you may not use this file except in compliance with the License.
|
||||||
|
@ -16,15 +14,26 @@ See the License for the specific language governing permissions and
|
||||||
limitations under the License.
|
limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React from 'react';
|
import React from "react";
|
||||||
import {MatrixClientPeg} from './MatrixClientPeg';
|
import { Room } from "matrix-js-sdk/src/models/room";
|
||||||
import MultiInviter from './utils/MultiInviter';
|
import { MatrixEvent } from "matrix-js-sdk/src/models/event";
|
||||||
|
import { User } from "matrix-js-sdk/src/models/user";
|
||||||
|
|
||||||
|
import { MatrixClientPeg } from './MatrixClientPeg';
|
||||||
|
import MultiInviter, { CompletionStates } from './utils/MultiInviter';
|
||||||
import Modal from './Modal';
|
import Modal from './Modal';
|
||||||
import * as sdk from './';
|
|
||||||
import { _t } from './languageHandler';
|
import { _t } from './languageHandler';
|
||||||
import InviteDialog, {KIND_DM, KIND_INVITE} from "./components/views/dialogs/InviteDialog";
|
import InviteDialog, { KIND_DM, KIND_INVITE, Member } from "./components/views/dialogs/InviteDialog";
|
||||||
import CommunityPrototypeInviteDialog from "./components/views/dialogs/CommunityPrototypeInviteDialog";
|
import CommunityPrototypeInviteDialog from "./components/views/dialogs/CommunityPrototypeInviteDialog";
|
||||||
import {CommunityPrototypeStore} from "./stores/CommunityPrototypeStore";
|
import { CommunityPrototypeStore } from "./stores/CommunityPrototypeStore";
|
||||||
|
import BaseAvatar from "./components/views/avatars/BaseAvatar";
|
||||||
|
import { mediaFromMxc } from "./customisations/Media";
|
||||||
|
import ErrorDialog from "./components/views/dialogs/ErrorDialog";
|
||||||
|
|
||||||
|
export interface IInviteResult {
|
||||||
|
states: CompletionStates;
|
||||||
|
inviter: MultiInviter;
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Invites multiple addresses to a room
|
* Invites multiple addresses to a room
|
||||||
|
@ -32,24 +41,23 @@ import {CommunityPrototypeStore} from "./stores/CommunityPrototypeStore";
|
||||||
* no option to cancel.
|
* no option to cancel.
|
||||||
*
|
*
|
||||||
* @param {string} roomId The ID of the room to invite to
|
* @param {string} roomId The ID of the room to invite to
|
||||||
* @param {string[]} addrs Array of strings of addresses to invite. May be matrix IDs or 3pids.
|
* @param {string[]} addresses Array of strings of addresses to invite. May be matrix IDs or 3pids.
|
||||||
* @returns {Promise} Promise
|
* @returns {Promise} Promise
|
||||||
*/
|
*/
|
||||||
export function inviteMultipleToRoom(roomId, addrs) {
|
export function inviteMultipleToRoom(roomId: string, addresses: string[]): Promise<IInviteResult> {
|
||||||
const inviter = new MultiInviter(roomId);
|
const inviter = new MultiInviter(roomId);
|
||||||
return inviter.invite(addrs).then(states => Promise.resolve({states, inviter}));
|
return inviter.invite(addresses).then(states => Promise.resolve({ states, inviter }));
|
||||||
}
|
}
|
||||||
|
|
||||||
export function showStartChatInviteDialog(initialText) {
|
export function showStartChatInviteDialog(initialText = ""): void {
|
||||||
// This dialog handles the room creation internally - we don't need to worry about it.
|
// This dialog handles the room creation internally - we don't need to worry about it.
|
||||||
const InviteDialog = sdk.getComponent("dialogs.InviteDialog");
|
|
||||||
Modal.createTrackedDialog(
|
Modal.createTrackedDialog(
|
||||||
'Start DM', '', InviteDialog, {kind: KIND_DM, initialText},
|
'Start DM', '', InviteDialog, { kind: KIND_DM, initialText },
|
||||||
/*className=*/null, /*isPriority=*/false, /*isStatic=*/true,
|
/*className=*/null, /*isPriority=*/false, /*isStatic=*/true,
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
export function showRoomInviteDialog(roomId, initialText = "") {
|
export function showRoomInviteDialog(roomId: string, initialText = ""): void {
|
||||||
// This dialog handles the room creation internally - we don't need to worry about it.
|
// This dialog handles the room creation internally - we don't need to worry about it.
|
||||||
Modal.createTrackedDialog(
|
Modal.createTrackedDialog(
|
||||||
"Invite Users", "", InviteDialog, {
|
"Invite Users", "", InviteDialog, {
|
||||||
|
@ -61,14 +69,14 @@ export function showRoomInviteDialog(roomId, initialText = "") {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
export function showCommunityRoomInviteDialog(roomId, communityName) {
|
export function showCommunityRoomInviteDialog(roomId: string, communityName: string): void {
|
||||||
Modal.createTrackedDialog(
|
Modal.createTrackedDialog(
|
||||||
'Invite Users to Community', '', CommunityPrototypeInviteDialog, {communityName, roomId},
|
'Invite Users to Community', '', CommunityPrototypeInviteDialog, { communityName, roomId },
|
||||||
/*className=*/null, /*isPriority=*/false, /*isStatic=*/true,
|
/*className=*/null, /*isPriority=*/false, /*isStatic=*/true,
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
export function showCommunityInviteDialog(communityId) {
|
export function showCommunityInviteDialog(communityId: string): void {
|
||||||
const chat = CommunityPrototypeStore.instance.getGeneralChat(communityId);
|
const chat = CommunityPrototypeStore.instance.getGeneralChat(communityId);
|
||||||
if (chat) {
|
if (chat) {
|
||||||
const name = CommunityPrototypeStore.instance.getCommunityName(communityId);
|
const name = CommunityPrototypeStore.instance.getCommunityName(communityId);
|
||||||
|
@ -83,7 +91,7 @@ export function showCommunityInviteDialog(communityId) {
|
||||||
* @param {MatrixEvent} event The event to check
|
* @param {MatrixEvent} event The event to check
|
||||||
* @returns {boolean} True if valid, false otherwise
|
* @returns {boolean} True if valid, false otherwise
|
||||||
*/
|
*/
|
||||||
export function isValid3pidInvite(event) {
|
export function isValid3pidInvite(event: MatrixEvent): boolean {
|
||||||
if (!event || event.getType() !== "m.room.third_party_invite") return false;
|
if (!event || event.getType() !== "m.room.third_party_invite") return false;
|
||||||
|
|
||||||
// any events without these keys are not valid 3pid invites, so we ignore them
|
// any events without these keys are not valid 3pid invites, so we ignore them
|
||||||
|
@ -96,13 +104,12 @@ export function isValid3pidInvite(event) {
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
|
|
||||||
export function inviteUsersToRoom(roomId, userIds) {
|
export function inviteUsersToRoom(roomId: string, userIds: string[]): Promise<void> {
|
||||||
return inviteMultipleToRoom(roomId, userIds).then((result) => {
|
return inviteMultipleToRoom(roomId, userIds).then((result) => {
|
||||||
const room = MatrixClientPeg.get().getRoom(roomId);
|
const room = MatrixClientPeg.get().getRoom(roomId);
|
||||||
showAnyInviteErrors(result.states, room, result.inviter);
|
showAnyInviteErrors(result.states, room, result.inviter);
|
||||||
}).catch((err) => {
|
}).catch((err) => {
|
||||||
console.error(err.stack);
|
console.error(err.stack);
|
||||||
const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
|
|
||||||
Modal.createTrackedDialog('Failed to invite', '', ErrorDialog, {
|
Modal.createTrackedDialog('Failed to invite', '', ErrorDialog, {
|
||||||
title: _t("Failed to invite"),
|
title: _t("Failed to invite"),
|
||||||
description: ((err && err.message) ? err.message : _t("Operation failed")),
|
description: ((err && err.message) ? err.message : _t("Operation failed")),
|
||||||
|
@ -110,35 +117,66 @@ export function inviteUsersToRoom(roomId, userIds) {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
export function showAnyInviteErrors(addrs, room, inviter) {
|
export function showAnyInviteErrors(
|
||||||
|
states: CompletionStates,
|
||||||
|
room: Room,
|
||||||
|
inviter: MultiInviter,
|
||||||
|
userMap?: Map<string, Member>,
|
||||||
|
): boolean {
|
||||||
// Show user any errors
|
// Show user any errors
|
||||||
const failedUsers = Object.keys(addrs).filter(a => addrs[a] === 'error');
|
const failedUsers = Object.keys(states).filter(a => states[a] === 'error');
|
||||||
if (failedUsers.length === 1 && inviter.fatal) {
|
if (failedUsers.length === 1 && inviter.fatal) {
|
||||||
// Just get the first message because there was a fatal problem on the first
|
// Just get the first message because there was a fatal problem on the first
|
||||||
// user. This usually means that no other users were attempted, making it
|
// user. This usually means that no other users were attempted, making it
|
||||||
// pointless for us to list who failed exactly.
|
// pointless for us to list who failed exactly.
|
||||||
const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
|
|
||||||
Modal.createTrackedDialog('Failed to invite users to the room', '', ErrorDialog, {
|
Modal.createTrackedDialog('Failed to invite users to the room', '', ErrorDialog, {
|
||||||
title: _t("Failed to invite users to the room:", {roomName: room.name}),
|
title: _t("Failed to invite users to the room:", { roomName: room.name }),
|
||||||
description: inviter.getErrorText(failedUsers[0]),
|
description: inviter.getErrorText(failedUsers[0]),
|
||||||
});
|
});
|
||||||
return false;
|
return false;
|
||||||
} else {
|
} else {
|
||||||
const errorList = [];
|
const errorList = [];
|
||||||
for (const addr of failedUsers) {
|
for (const addr of failedUsers) {
|
||||||
if (addrs[addr] === "error") {
|
if (states[addr] === "error") {
|
||||||
const reason = inviter.getErrorText(addr);
|
const reason = inviter.getErrorText(addr);
|
||||||
errorList.push(addr + ": " + reason);
|
errorList.push(addr + ": " + reason);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const cli = MatrixClientPeg.get();
|
||||||
if (errorList.length > 0) {
|
if (errorList.length > 0) {
|
||||||
// React 16 doesn't let us use `errorList.join(<br />)` anymore, so this is our solution
|
// React 16 doesn't let us use `errorList.join(<br />)` anymore, so this is our solution
|
||||||
const description = <div>{errorList.map(e => <div key={e}>{e}</div>)}</div>;
|
const description = <div className="mx_InviteDialog_multiInviterError">
|
||||||
|
<h4>{ _t("We sent the others, but the below people couldn't be invited to <RoomName/>", {}, {
|
||||||
|
RoomName: () => <b>{ room.name }</b>,
|
||||||
|
}) }</h4>
|
||||||
|
<div>
|
||||||
|
{ failedUsers.map(addr => {
|
||||||
|
const user = userMap?.get(addr) || cli.getUser(addr);
|
||||||
|
const name = (user as Member).name || (user as User).rawDisplayName;
|
||||||
|
const avatarUrl = (user as Member).getMxcAvatarUrl?.() || (user as User).avatarUrl;
|
||||||
|
return <div key={addr} className="mx_InviteDialog_multiInviterError_entry">
|
||||||
|
<div className="mx_InviteDialog_multiInviterError_entry_userProfile">
|
||||||
|
<BaseAvatar
|
||||||
|
url={avatarUrl ? mediaFromMxc(avatarUrl).getSquareThumbnailHttp(24) : null}
|
||||||
|
name={name}
|
||||||
|
idName={user.userId}
|
||||||
|
width={24}
|
||||||
|
height={24}
|
||||||
|
/>
|
||||||
|
<span className="mx_InviteDialog_multiInviterError_entry_name">{ name }</span>
|
||||||
|
<span className="mx_InviteDialog_multiInviterError_entry_userId">{ user.userId }</span>
|
||||||
|
</div>
|
||||||
|
<div className="mx_InviteDialog_multiInviterError_entry_error">
|
||||||
|
{ inviter.getErrorText(addr) }
|
||||||
|
</div>
|
||||||
|
</div>;
|
||||||
|
}) }
|
||||||
|
</div>
|
||||||
|
</div>;
|
||||||
|
|
||||||
const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
|
Modal.createTrackedDialog("Some invites could not be sent", "", ErrorDialog, {
|
||||||
Modal.createTrackedDialog('Failed to invite the following users to the room', '', ErrorDialog, {
|
title: _t("Some invites couldn't be sent"),
|
||||||
title: _t("Failed to invite the following users to the %(roomName)s room:", {roomName: room.name}),
|
|
||||||
description,
|
description,
|
||||||
});
|
});
|
||||||
return false;
|
return false;
|