+ {_t("Got an account? Sign in", {}, {
+ a: sub => (
+
+ {sub}
+
+ ),
+ })}
+ {_t("New here? Create an account", {}, {
+ a: sub => (
+
+ {sub}
+
+ ),
+ })}
+
+ )
+ } else if (signupLink) {
+ topSection = (
{_t(
"Upgrade to your own domain", {},
@@ -422,6 +451,20 @@ export default class UserMenu extends React.Component {
)
+ } else if (MatrixClientPeg.get().isGuest()) {
+ primaryOptionList = (
+
+
+ { homeButton }
+ this.onSettingsOpen(e, null)}
+ />
+ { feedbackButton }
+
+
+ );
}
const classes = classNames({
@@ -451,7 +494,7 @@ export default class UserMenu extends React.Component {
/>
- {hostingLink}
+ {topSection}
{primaryOptionList}
{secondarySection}
;
diff --git a/src/components/structures/auth/ForgotPassword.js b/src/components/structures/auth/ForgotPassword.js
index f9f5263f7e..5a39fe9fd9 100644
--- a/src/components/structures/auth/ForgotPassword.js
+++ b/src/components/structures/auth/ForgotPassword.js
@@ -21,16 +21,14 @@ import PropTypes from 'prop-types';
import { _t } from '../../../languageHandler';
import * as sdk from '../../../index';
import Modal from "../../../Modal";
-import SdkConfig from "../../../SdkConfig";
import PasswordReset from "../../../PasswordReset";
import AutoDiscoveryUtils, {ValidatedServerConfig} from "../../../utils/AutoDiscoveryUtils";
import classNames from 'classnames';
import AuthPage from "../../views/auth/AuthPage";
import CountlyAnalytics from "../../../CountlyAnalytics";
+import ServerPicker from "../../views/elements/ServerPicker";
// Phases
-// Show controls to configure server details
-const PHASE_SERVER_DETAILS = 0;
// Show the forgot password inputs
const PHASE_FORGOT = 1;
// Email is in the process of being sent
@@ -62,7 +60,6 @@ export default class ForgotPassword extends React.Component {
serverIsAlive: true,
serverErrorIsFatal: false,
serverDeadError: "",
- serverRequiresIdServer: null,
};
constructor(props) {
@@ -93,12 +90,8 @@ export default class ForgotPassword extends React.Component {
serverConfig.isUrl,
);
- const pwReset = new PasswordReset(serverConfig.hsUrl, serverConfig.isUrl);
- const serverRequiresIdServer = await pwReset.doesServerRequireIdServerParam();
-
this.setState({
serverIsAlive: true,
- serverRequiresIdServer,
});
} catch (e) {
this.setState(AutoDiscoveryUtils.authComponentStateForError(e, "forgot_password"));
@@ -177,20 +170,6 @@ export default class ForgotPassword extends React.Component {
});
};
- onServerDetailsNextPhaseClick = async () => {
- this.setState({
- phase: PHASE_FORGOT,
- });
- };
-
- onEditServerDetailsClick = ev => {
- ev.preventDefault();
- ev.stopPropagation();
- this.setState({
- phase: PHASE_SERVER_DETAILS,
- });
- };
-
onLoginClick = ev => {
ev.preventDefault();
ev.stopPropagation();
@@ -205,24 +184,6 @@ export default class ForgotPassword extends React.Component {
});
}
- renderServerDetails() {
- const ServerConfig = sdk.getComponent("auth.ServerConfig");
-
- if (SdkConfig.get()['disable_custom_urls']) {
- return null;
- }
-
- return
-
;
- }
-
return - {yourMatrixAccountText} - {editLink} -
- {_t( - "No identity server is configured: " + - "add one in server settings to reset your password.", - )} - - {_t('Sign in instead')} - -
{errorText}
{serverDeadSection}
-
;
} else if (SettingsStore.getValue(UIFeature.Registration)) {
footer = (
-
- { _t('Create account') }
-
+
+ {_t("New? Create account", {}, {
+ a: sub => { sub },
+ })}
+
);
}
@@ -686,8 +596,11 @@ export default class LoginComponent extends React.Component- {yourMatrixAccountText} - {editLink} -
+
-
;
- }
-
- const serverDetailsProps: ComponentProps
-
;
- }
-
private renderRegisterComponent() {
- if (PHASES_ENABLED && this.state.phase !== Phase.Registration) {
- return null;
- }
-
const InteractiveAuth = sdk.getComponent('structures.InteractiveAuth');
const Spinner = sdk.getComponent('elements.Spinner');
const RegistrationForm = sdk.getComponent('auth.RegistrationForm');
@@ -610,18 +460,48 @@ export default class Registration extends React.Component+ { _t("Continue with %(ssoButtons)s", { ssoButtons: "" }).trim() } +
; + } + + // i18n: ssoButtons & usernamePassword are placeholders to help translators understand context + ssoSection =+ { _t("%(ssoButtons)s Or %(usernamePassword)s", { ssoButtons: "", usernamePassword: ""}).trim() } +
+
- flow.type === "m.login.password")}
/>
);
diff --git a/src/components/views/auth/CustomServerDialog.js b/src/components/views/auth/CustomServerDialog.js
deleted file mode 100644
index 138f8c4689..0000000000
--- a/src/components/views/auth/CustomServerDialog.js
+++ /dev/null
@@ -1,47 +0,0 @@
-/*
-Copyright 2015, 2016 OpenMarket Ltd
-Copyright 2019, 2020 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.
-*/
-
-import React from 'react';
-import { _t } from '../../../languageHandler';
-import SdkConfig from '../../../SdkConfig';
-
-export default class CustomServerDialog extends React.Component {
- render() {
- const brand = SdkConfig.get().brand;
- return (
- {this.props.submitText}
- : null;
-
- return (
- {
static defaultProps = {
- onEditServerDetailsClick: null,
onUsernameChanged: function() {},
onUsernameBlur: function() {},
onPhoneCountryChanged: function() {},
@@ -296,7 +293,7 @@ export default class PasswordLogin extends React.PureComponent {
}, {
key: "number",
test: ({ value }) => !value || PHONE_NUMBER_REGEX.test(value),
- invalid: () => _t("Doesn't look like a valid phone number"),
+ invalid: () => _t("That phone number doesn't look quite right, please check and try again"),
},
],
});
@@ -357,6 +354,7 @@ export default class PasswordLogin extends React.PureComponent {
key="username_input"
type="text"
label={_t("Username")}
+ placeholder={_t("Username").toLocaleLowerCase()}
value={this.props.username}
onChange={this.onUsernameChanged}
onFocus={this.onUsernameFocus}
@@ -410,20 +408,14 @@ export default class PasswordLogin extends React.PureComponent {
let forgotPasswordJsx;
if (this.props.onForgotPasswordClick) {
- forgotPasswordJsx =
- {_t('Not sure of your password? Set a new one', {}, {
- a: sub => (
-
- {sub}
-
- ),
- })}
- ;
+ forgotPasswordJsx =
+ {_t("Forgot password?")}
+ ;
}
const pwFieldClass = classNames({
@@ -465,8 +457,6 @@ export default class PasswordLogin extends React.PureComponent {
return (
{this.props.submitText}
- : null;
-
- return (
-
- );
- }
-}
diff --git a/src/components/views/auth/ServerTypeSelector.js b/src/components/views/auth/ServerTypeSelector.js
deleted file mode 100644
index 71e7ac7f0e..0000000000
--- a/src/components/views/auth/ServerTypeSelector.js
+++ /dev/null
@@ -1,153 +0,0 @@
-/*
-Copyright 2019 New Vector Ltd
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
- http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
-*/
-
-import React from 'react';
-import PropTypes from 'prop-types';
-import { _t } from '../../../languageHandler';
-import * as sdk from '../../../index';
-import classnames from 'classnames';
-import {ValidatedServerConfig} from "../../../utils/AutoDiscoveryUtils";
-import {makeType} from "../../../utils/TypeUtils";
-
-const MODULAR_URL = 'https://element.io/matrix-services' +
- '?utm_source=element-web&utm_medium=web&utm_campaign=element-web-authentication';
-
-export const FREE = 'Free';
-export const PREMIUM = 'Premium';
-export const ADVANCED = 'Advanced';
-
-export const TYPES = {
- FREE: {
- id: FREE,
- label: () => _t('Free'),
- logo: () => })
,
- description: () => _t('Join millions for free on the largest public server'),
- serverConfig: makeType(ValidatedServerConfig, {
- hsUrl: "https://matrix-client.matrix.org",
- hsName: "matrix.org",
- hsNameIsDifferent: false,
- isUrl: "https://vector.im",
- }),
- },
- PREMIUM: {
- id: PREMIUM,
- label: () => _t('Premium'),
- logo: () => })
,
- description: () => _t('Premium hosting for organisations Learn more', {}, {
- a: sub =>
- {sub}
- ,
- }),
- identityServerUrl: "https://vector.im",
- },
- ADVANCED: {
- id: ADVANCED,
- label: () => _t('Advanced'),
- logo: () =>
- {this.props.serverConfig.hsName}
- ;
- },
- });
- }
-
- let editLink = null;
- if (this.props.onEditServerDetailsClick) {
- editLink =
- {_t('Change')}
- ;
- }
-
- return = ({
let unpinButton;
if (showUnpin) {
const onUnpinClick = () => {
- WidgetStore.instance.unpinWidget(app.id);
+ WidgetStore.instance.unpinWidget(room.roomId, app.id);
onFinished();
};
@@ -143,7 +143,7 @@ const WidgetContextMenu: React.FC = ({
let moveLeftButton;
if (showUnpin && widgetIndex > 0) {
const onClick = () => {
- WidgetStore.instance.movePinnedWidget(app.id, -1);
+ WidgetStore.instance.movePinnedWidget(roomId, app.id, -1);
onFinished();
};
@@ -153,7 +153,7 @@ const WidgetContextMenu: React.FC = ({
let moveRightButton;
if (showUnpin && widgetIndex < pinnedWidgets.length - 1) {
const onClick = () => {
- WidgetStore.instance.movePinnedWidget(app.id, 1);
+ WidgetStore.instance.movePinnedWidget(roomId, app.id, 1);
onFinished();
};
diff --git a/src/components/views/dialogs/ConfirmRedactDialog.js b/src/components/views/dialogs/ConfirmRedactDialog.js
index 3106df1d5b..2216f9a93a 100644
--- a/src/components/views/dialogs/ConfirmRedactDialog.js
+++ b/src/components/views/dialogs/ConfirmRedactDialog.js
@@ -23,15 +23,17 @@ import { _t } from '../../../languageHandler';
*/
export default class ConfirmRedactDialog extends React.Component {
render() {
- const QuestionDialog = sdk.getComponent('views.dialogs.QuestionDialog');
+ const TextInputDialog = sdk.getComponent('views.dialogs.TextInputDialog');
return (
-
-
+
);
}
}
diff --git a/src/components/views/dialogs/InfoDialog.js b/src/components/views/dialogs/InfoDialog.js
index 8125bc3edd..97ae968ff3 100644
--- a/src/components/views/dialogs/InfoDialog.js
+++ b/src/components/views/dialogs/InfoDialog.js
@@ -31,6 +31,7 @@ export default class InfoDialog extends React.Component {
onFinished: PropTypes.func,
hasCloseButton: PropTypes.bool,
onKeyDown: PropTypes.func,
+ fixedWidth: PropTypes.bool,
};
static defaultProps = {
@@ -54,6 +55,7 @@ export default class InfoDialog extends React.Component {
contentId='mx_Dialog_content'
hasCancel={this.props.hasCloseButton}
onKeyDown={this.props.onKeyDown}
+ fixedWidth={this.props.fixedWidth}
>
= ({ roomWidth }) => {
+ const canvasRef = useRef(null);
+ const effectsRef = useRef>(new Map());
+
+ const lazyLoadEffectModule = async (name: string): Promise => {
+ if (!name) return null;
+ let effect: ICanvasEffect | null = effectsRef.current[name] || null;
+ if (effect === null) {
+ const options = CHAT_EFFECTS.find((e) => e.command === name)?.options
+ try {
+ const { default: Effect } = await import(`../../../effects/${name}`);
+ effect = new Effect(options);
+ effectsRef.current[name] = effect;
+ } catch (err) {
+ console.warn('Unable to load effect module at \'../../../effects/${name}\'.', err);
+ }
+ }
+ return effect;
+ };
+
+ useEffect(() => {
+ const resize = () => {
+ if (canvasRef.current) {
+ canvasRef.current.height = window.innerHeight;
+ }
+ };
+ const onAction = (payload: { action: string }) => {
+ const actionPrefix = 'effects.';
+ if (payload.action.indexOf(actionPrefix) === 0) {
+ const effect = payload.action.substr(actionPrefix.length);
+ lazyLoadEffectModule(effect).then((module) => module?.start(canvasRef.current));
+ }
+ }
+ const dispatcherRef = dis.register(onAction);
+ const canvas = canvasRef.current;
+ canvas.height = window.innerHeight;
+ window.addEventListener('resize', resize, true);
+
+ return () => {
+ dis.unregister(dispatcherRef);
+ window.removeEventListener('resize', resize);
+ // eslint-disable-next-line react-hooks/exhaustive-deps
+ const currentEffects = effectsRef.current; // this is not a react node ref, warning can be safely ignored
+ for (const effect in currentEffects) {
+ const effectModule: ICanvasEffect = currentEffects[effect];
+ if (effectModule && effectModule.isRunning) {
+ effectModule.stop();
+ }
+ }
+ };
+ }, []);
+
+ return (
+
+ )
+}
+
+export default EffectsOverlay;
diff --git a/src/components/views/elements/Field.tsx b/src/components/views/elements/Field.tsx
index fb34f51b60..f5754da9ae 100644
--- a/src/components/views/elements/Field.tsx
+++ b/src/components/views/elements/Field.tsx
@@ -61,6 +61,10 @@ interface IProps {
tooltipClassName?: string;
// If specified, an additional class name to apply to the field container
className?: string;
+ // On what events should validation occur; by default on all
+ validateOnFocus?: boolean;
+ validateOnBlur?: boolean;
+ validateOnChange?: boolean;
// All other props pass through to the .
}
@@ -100,6 +104,9 @@ export default class Field extends React.PureComponent {
public static readonly defaultProps = {
element: "input",
type: "text",
+ validateOnFocus: true,
+ validateOnBlur: true,
+ validateOnChange: true,
};
/*
@@ -137,9 +144,11 @@ export default class Field extends React.PureComponent {
this.setState({
focused: true,
});
- this.validate({
- focused: true,
- });
+ if (this.props.validateOnFocus) {
+ this.validate({
+ focused: true,
+ });
+ }
// Parent component may have supplied its own `onFocus` as well
if (this.props.onFocus) {
this.props.onFocus(ev);
@@ -147,7 +156,9 @@ export default class Field extends React.PureComponent {
};
private onChange = (ev) => {
- this.validateOnChange();
+ if (this.props.validateOnChange) {
+ this.validateOnChange();
+ }
// Parent component may have supplied its own `onChange` as well
if (this.props.onChange) {
this.props.onChange(ev);
@@ -158,16 +169,18 @@ export default class Field extends React.PureComponent {
this.setState({
focused: false,
});
- this.validate({
- focused: false,
- });
+ if (this.props.validateOnBlur) {
+ this.validate({
+ focused: false,
+ });
+ }
// Parent component may have supplied its own `onBlur` as well
if (this.props.onBlur) {
this.props.onBlur(ev);
}
};
- private async validate({ focused, allowEmpty = true }: {focused: boolean, allowEmpty?: boolean}) {
+ public async validate({ focused, allowEmpty = true }: {focused?: boolean, allowEmpty?: boolean}) {
if (!this.props.onValidate) {
return;
}
@@ -196,12 +209,15 @@ export default class Field extends React.PureComponent {
feedbackVisible: false,
});
}
+
+ return valid;
}
public render() {
/* eslint @typescript-eslint/no-unused-vars: ["error", { "ignoreRestSiblings": true }] */
const { element, prefixComponent, postfixComponent, className, onValidate, children,
- tooltipContent, forceValidity, tooltipClassName, list, ...inputProps} = this.props;
+ tooltipContent, forceValidity, tooltipClassName, list, validateOnBlur, validateOnChange, validateOnFocus,
+ ...inputProps} = this.props;
// Set some defaults for the element
const ref = input => this.input = input;
diff --git a/src/components/views/elements/SSOButton.js b/src/components/views/elements/SSOButton.js
deleted file mode 100644
index 1126ae3cd7..0000000000
--- a/src/components/views/elements/SSOButton.js
+++ /dev/null
@@ -1,42 +0,0 @@
-/*
-Copyright 2020 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.
-*/
-
-import React from 'react';
-import PropTypes from 'prop-types';
-
-import PlatformPeg from "../../../PlatformPeg";
-import AccessibleButton from "./AccessibleButton";
-import {_t} from "../../../languageHandler";
-
-const SSOButton = ({matrixClient, loginType, fragmentAfterLogin, ...props}) => {
- const onClick = () => {
- PlatformPeg.get().startSingleSignOn(matrixClient, loginType, fragmentAfterLogin);
- };
-
- return (
-
- {_t("Sign in with single sign-on")}
-
- );
-};
-
-SSOButton.propTypes = {
- matrixClient: PropTypes.object.isRequired, // does not use context as may use a temporary client
- loginType: PropTypes.oneOf(["sso", "cas"]), // defaults to "sso" in base-apis
- fragmentAfterLogin: PropTypes.string,
-};
-
-export default SSOButton;
diff --git a/src/components/views/elements/SSOButtons.tsx b/src/components/views/elements/SSOButtons.tsx
new file mode 100644
index 0000000000..f819b48cf6
--- /dev/null
+++ b/src/components/views/elements/SSOButtons.tsx
@@ -0,0 +1,110 @@
+/*
+Copyright 2020 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.
+*/
+
+import React from "react";
+import {MatrixClient} from "matrix-js-sdk/src/client";
+
+import PlatformPeg from "../../../PlatformPeg";
+import AccessibleButton from "./AccessibleButton";
+import {_t} from "../../../languageHandler";
+import {IIdentityProvider, ISSOFlow} from "../../../Login";
+import classNames from "classnames";
+
+interface ISSOButtonProps extends Omit {
+ idp: IIdentityProvider;
+ mini?: boolean;
+}
+
+const SSOButton: React.FC = ({
+ matrixClient,
+ loginType,
+ fragmentAfterLogin,
+ idp,
+ primary,
+ mini,
+ ...props
+}) => {
+ const kind = primary ? "primary" : "primary_outline";
+ const label = idp ? _t("Continue with %(provider)s", { provider: idp.name }) : _t("Sign in with single sign-on");
+
+ const onClick = () => {
+ PlatformPeg.get().startSingleSignOn(matrixClient, loginType, fragmentAfterLogin, idp?.id);
+ };
+
+ let icon;
+ if (idp && idp.icon && idp.icon.startsWith("https://")) {
+ icon = 
;
+ }
+
+ const classes = classNames("mx_SSOButton", {
+ mx_SSOButton_mini: mini,
+ });
+
+ if (mini) {
+ // TODO fallback icon
+ return (
+
+ { icon }
+
+ );
+ }
+
+ return (
+
+ { icon }
+ { label }
+
+ );
+};
+
+interface IProps {
+ matrixClient: MatrixClient;
+ flow: ISSOFlow;
+ loginType?: "sso" | "cas";
+ fragmentAfterLogin?: string;
+ primary?: boolean;
+}
+
+const SSOButtons: React.FC = ({matrixClient, flow, loginType, fragmentAfterLogin, primary}) => {
+ const providers = flow.identity_providers || flow["org.matrix.msc2858.identity_providers"] || [];
+ if (providers.length < 2) {
+ return
+ {_t("Edit")}
+ ;
+ }
+
+ let serverName = serverConfig.isNameResolvable ? serverConfig.hsName : serverConfig.hsUrl;
+ if (serverConfig.hsNameIsDifferent) {
+ serverName =
+ {serverConfig.hsName}
+ ;
+ }
+
+ let desc;
+ if (serverConfig.hsName === "matrix.org") {
+ desc =
+ {_t("Join millions for free on the largest public server")}
+ ;
+ }
+
+ return {
const senderName = this.props.mxEvent.sender?.name || this.props.mxEvent.getSender();
let joinCopy = _t('Join the conference at the top of this room');
- if (!WidgetStore.instance.isPinned(this.props.mxEvent.getStateKey())) {
+ if (!WidgetStore.instance.isPinned(this.props.mxEvent.getRoomId(), this.props.mxEvent.getStateKey())) {
joinCopy = _t('Join the conference from the room information card on the right');
}
diff --git a/src/components/views/right_panel/RoomSummaryCard.tsx b/src/components/views/right_panel/RoomSummaryCard.tsx
index 621e85e1d4..ebc07e76b8 100644
--- a/src/components/views/right_panel/RoomSummaryCard.tsx
+++ b/src/components/views/right_panel/RoomSummaryCard.tsx
@@ -43,6 +43,7 @@ import RoomContext from "../../../contexts/RoomContext";
import {UIFeature} from "../../../settings/UIFeature";
import {ChevronFace, ContextMenuTooltipButton, useContextMenu} from "../../structures/ContextMenu";
import WidgetContextMenu from "../context_menus/WidgetContextMenu";
+import {useRoomMemberCount} from "../../../hooks/useRoomMembers";
interface IProps {
room: Room;
@@ -83,9 +84,10 @@ export const useWidgets = (room: Room) => {
interface IAppRowProps {
app: IApp;
+ room: Room;
}
-const AppRow: React.FC = ({ app }) => {
+const AppRow: React.FC = ({ app, room }) => {
const name = WidgetUtils.getWidgetName(app);
const dataTitle = WidgetUtils.getWidgetDataTitle(app);
const subtitle = dataTitle && " - " + dataTitle;
@@ -100,10 +102,10 @@ const AppRow: React.FC = ({ app }) => {
});
};
- const isPinned = WidgetStore.instance.isPinned(app.id);
+ const isPinned = WidgetStore.instance.isPinned(room.roomId, app.id);
const togglePin = isPinned
- ? () => { WidgetStore.instance.unpinWidget(app.id); }
- : () => { WidgetStore.instance.pinWidget(app.id); };
+ ? () => { WidgetStore.instance.unpinWidget(room.roomId, app.id); }
+ : () => { WidgetStore.instance.pinWidget(room.roomId, app.id); };
const [menuDisplayed, handle, openMenu, closeMenu] = useContextMenu();
let contextMenu;
@@ -118,7 +120,7 @@ const AppRow: React.FC = ({ app }) => {
/>;
}
- const cannotPin = !isPinned && !WidgetStore.instance.canPin(app.id);
+ const cannotPin = !isPinned && !WidgetStore.instance.canPin(room.roomId, app.id);
let pinTitle: string;
if (cannotPin) {
@@ -183,7 +185,7 @@ const AppsSection: React.FC = ({ room }) => {
};
return
- { apps.map(app =>
{ apps.length > 0 ? _t("Edit widgets, bridges & bots") : _t("Add widgets, bridges & bots") }
@@ -209,14 +211,6 @@ const onRoomSettingsClick = () => {
defaultDispatcher.dispatch({ action: "open_room_settings" });
};
-const useMemberCount = (room: Room) => {
- const [count, setCount] = useState(room.getJoinedMembers().length);
- useEventEmitter(room.currentState, "RoomState.members", () => {
- setCount(room.getJoinedMembers().length);
- });
- return count;
-};
-
const RoomSummaryCard: React.FC = ({ room, onClose }) => {
const cli = useContext(MatrixClientContext);
@@ -250,7 +244,7 @@ const RoomSummaryCard: React.FC = ({ room, onClose }) => {
;
- const memberCount = useMemberCount(room);
+ const memberCount = useRoomMemberCount(room);
return { _t('Create your account') }
+{ _t('Create account') }
{ errorText } { serverDeadSection } - { this.renderServerComponent() } - { this.state.phase !== Phase.ServerDetails &&- {yourMatrixAccountText} - {editLink} -
} +{introText}
-
-
- );
- }
-}
diff --git a/src/components/views/auth/InteractiveAuthEntryComponents.js b/src/components/views/auth/InteractiveAuthEntryComponents.js
index 6628ca7120..60e57afc98 100644
--- a/src/components/views/auth/InteractiveAuthEntryComponents.js
+++ b/src/components/views/auth/InteractiveAuthEntryComponents.js
@@ -18,7 +18,6 @@ limitations under the License.
import React, {createRef} from 'react';
import PropTypes from 'prop-types';
-import url from 'url';
import classnames from 'classnames';
import * as sdk from '../../../index';
@@ -500,17 +499,11 @@ export class MsisdnAuthEntry extends React.Component {
});
try {
- const requiresIdServerParam =
- await this.props.matrixClient.doesServerRequireIdServerParam();
let result;
if (this._submitUrl) {
result = await this.props.matrixClient.submitMsisdnTokenOtherUrl(
this._submitUrl, this._sid, this.props.clientSecret, this.state.token,
);
- } else if (requiresIdServerParam) {
- result = await this.props.matrixClient.submitMsisdnToken(
- this._sid, this.props.clientSecret, this.state.token,
- );
} else {
throw new Error("The registration with MSISDN flow is misconfigured");
}
@@ -519,12 +512,6 @@ export class MsisdnAuthEntry extends React.Component {
sid: this._sid,
client_secret: this.props.clientSecret,
};
- if (requiresIdServerParam) {
- const idServerParsedUrl = url.parse(
- this.props.matrixClient.getIdentityServerUrl(),
- );
- creds.id_server = idServerParsedUrl.host;
- }
this.props.submitAuthDict({
type: MsisdnAuthEntry.LOGIN_TYPE,
// TODO: Remove `threepid_creds` once servers support proper UIA
diff --git a/src/components/views/auth/ModularServerConfig.js b/src/components/views/auth/ModularServerConfig.js
deleted file mode 100644
index 28fd16379d..0000000000
--- a/src/components/views/auth/ModularServerConfig.js
+++ /dev/null
@@ -1,124 +0,0 @@
-/*
-Copyright 2019 New Vector Ltd
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
- http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
-*/
-
-import React from 'react';
-import * as sdk from '../../../index';
-import { _t } from '../../../languageHandler';
-import {ValidatedServerConfig} from "../../../utils/AutoDiscoveryUtils";
-import SdkConfig from "../../../SdkConfig";
-import AutoDiscoveryUtils from "../../../utils/AutoDiscoveryUtils";
-import * as ServerType from '../../views/auth/ServerTypeSelector';
-import ServerConfig from "./ServerConfig";
-
-const MODULAR_URL = 'https://element.io/matrix-services' +
- '?utm_source=element-web&utm_medium=web&utm_campaign=element-web-authentication';
-
-// TODO: TravisR - Can this extend ServerConfig for most things?
-
-/*
- * Configure the Modular server name.
- *
- * This is a variant of ServerConfig with only the HS field and different body
- * text that is specific to the Modular case.
- */
-export default class ModularServerConfig extends ServerConfig {
- static propTypes = ServerConfig.propTypes;
-
- async validateAndApplyServer(hsUrl, isUrl) {
- // Always try and use the defaults first
- const defaultConfig: ValidatedServerConfig = SdkConfig.get()["validated_server_config"];
- if (defaultConfig.hsUrl === hsUrl && defaultConfig.isUrl === isUrl) {
- this.setState({busy: false, errorText: ""});
- this.props.onServerConfigChange(defaultConfig);
- return defaultConfig;
- }
-
- this.setState({
- hsUrl,
- isUrl,
- busy: true,
- errorText: "",
- });
-
- try {
- const result = await AutoDiscoveryUtils.validateServerConfigWithStaticUrls(hsUrl, isUrl);
- this.setState({busy: false, errorText: ""});
- this.props.onServerConfigChange(result);
- return result;
- } catch (e) {
- console.error(e);
- let message = _t("Unable to validate homeserver/identity server");
- if (e.translatedMessage) {
- message = e.translatedMessage;
- }
- this.setState({
- busy: false,
- errorText: message,
- });
-
- return null;
- }
- }
-
- async validateServer() {
- // TODO: Do we want to support .well-known lookups here?
- // If for some reason someone enters "matrix.org" for a URL, we could do a lookup to
- // find their homeserver without demanding they use "https://matrix.org"
- return this.validateAndApplyServer(this.state.hsUrl, ServerType.TYPES.PREMIUM.identityServerUrl);
- }
-
- render() {
- const Field = sdk.getComponent('elements.Field');
- const AccessibleButton = sdk.getComponent('elements.AccessibleButton');
-
- const submitButton = this.props.submitText
- ?
- { _t("Custom Server Options") }
-
-
-
- {_t( - "You can use the custom server options to sign into other " + - "Matrix servers by specifying a different homeserver URL. This " + - "allows you to use %(brand)s with an existing Matrix account on a " + - "different homeserver.", - { brand }, - )}
-
-
-
-
-
- );
- }
-}
diff --git a/src/components/views/auth/PasswordLogin.tsx b/src/components/views/auth/PasswordLogin.tsx
index fced2e08d0..84e583c3a5 100644
--- a/src/components/views/auth/PasswordLogin.tsx
+++ b/src/components/views/auth/PasswordLogin.tsx
@@ -1,5 +1,5 @@
/*
-Copyright 2015, 2016, 2017, 2019 New Vector Ltd.
+Copyright 2015, 2016, 2017, 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.
@@ -26,7 +26,6 @@ import withValidation from "../elements/Validation";
import * as Email from "../../../email";
import Field from "../elements/Field";
import CountryDropdown from "./CountryDropdown";
-import SignInToText from "./SignInToText";
// For validating phone numbers without country codes
const PHONE_NUMBER_REGEX = /^[0-9()\-\s]*$/;
@@ -47,7 +46,6 @@ interface IProps {
onUsernameBlur?(username: string): void;
onPhoneCountryChanged?(phoneCountry: string): void;
onPhoneNumberChanged?(phoneNumber: string): void;
- onEditServerDetailsClick?(): void;
onForgotPasswordClick?(): void;
}
@@ -70,7 +68,6 @@ enum LoginField {
*/
export default class PasswordLogin extends React.PureComponent{_t("Your server")}
- {_t( - "Enter the location of your Element Matrix Services homeserver. It may use your own " + - "domain name or be a subdomain of element.io.", - {}, { - a: sub => - {sub} - , - }, - )} - -
-
;
} else {
emailHelperText =
- {_t(
- "Set an email for account recovery. " +
- "Use email to optionally be discoverable by existing contacts.",
- )}
+ {
+ _t("Add an email to be able to reset your password.")
+ } {
+ _t("Use email to optionally be discoverable by existing contacts.")
+ }
;
}
}
- const haveIs = Boolean(this.props.serverConfig.isUrl);
- let noIsText = null;
- if (this.props.serverRequiresIdServer && !haveIs) {
- noIsText =
- {_t(
- "No identity server is configured so you cannot add an email address in order to " +
- "reset your password in the future.",
- )}
-
;
- }
return (
@@ -579,7 +547,6 @@ export default class RegistrationForm extends React.PureComponent
{ emailHelperText }
- { noIsText }
{ registerButton }
diff --git a/src/components/views/auth/ServerConfig.js b/src/components/views/auth/ServerConfig.js
deleted file mode 100644
index e04bf9e25a..0000000000
--- a/src/components/views/auth/ServerConfig.js
+++ /dev/null
@@ -1,291 +0,0 @@
-/*
-Copyright 2015, 2016 OpenMarket Ltd
-Copyright 2019 New Vector Ltd
-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.
-*/
-
-import React from 'react';
-import PropTypes from 'prop-types';
-import Modal from '../../../Modal';
-import * as sdk from '../../../index';
-import { _t } from '../../../languageHandler';
-import {ValidatedServerConfig} from "../../../utils/AutoDiscoveryUtils";
-import AutoDiscoveryUtils from "../../../utils/AutoDiscoveryUtils";
-import SdkConfig from "../../../SdkConfig";
-import { createClient } from 'matrix-js-sdk/src/matrix';
-import classNames from 'classnames';
-import CountlyAnalytics from "../../../CountlyAnalytics";
-
-/*
- * A pure UI component which displays the HS and IS to use.
- */
-
-export default class ServerConfig extends React.PureComponent {
- static propTypes = {
- onServerConfigChange: PropTypes.func.isRequired,
-
- // The current configuration that the user is expecting to change.
- serverConfig: PropTypes.instanceOf(ValidatedServerConfig).isRequired,
-
- delayTimeMs: PropTypes.number, // time to wait before invoking onChanged
-
- // Called after the component calls onServerConfigChange
- onAfterSubmit: PropTypes.func,
-
- // Optional text for the submit button. If falsey, no button will be shown.
- submitText: PropTypes.string,
-
- // Optional class for the submit button. Only applies if the submit button
- // is to be rendered.
- submitClass: PropTypes.string,
-
- // Whether the flow this component is embedded in requires an identity
- // server when the homeserver says it will need one. Default false.
- showIdentityServerIfRequiredByHomeserver: PropTypes.bool,
- };
-
- static defaultProps = {
- onServerConfigChange: function() {},
- delayTimeMs: 0,
- };
-
- constructor(props) {
- super(props);
-
- this.state = {
- busy: false,
- errorText: "",
- hsUrl: props.serverConfig.hsUrl,
- isUrl: props.serverConfig.isUrl,
- showIdentityServer: false,
- };
-
- CountlyAnalytics.instance.track("onboarding_custom_server");
- }
-
- // TODO: [REACT-WARNING] Replace with appropriate lifecycle event
- UNSAFE_componentWillReceiveProps(newProps) { // eslint-disable-line camelcase
- if (newProps.serverConfig.hsUrl === this.state.hsUrl &&
- newProps.serverConfig.isUrl === this.state.isUrl) return;
-
- this.validateAndApplyServer(newProps.serverConfig.hsUrl, newProps.serverConfig.isUrl);
- }
-
- async validateServer() {
- // TODO: Do we want to support .well-known lookups here?
- // If for some reason someone enters "matrix.org" for a URL, we could do a lookup to
- // find their homeserver without demanding they use "https://matrix.org"
- const result = this.validateAndApplyServer(this.state.hsUrl, this.state.isUrl);
- if (!result) {
- return result;
- }
-
- // If the UI flow this component is embedded in requires an identity
- // server when the homeserver says it will need one, check first and
- // reveal this field if not already shown.
- // XXX: This a backward compatibility path for homeservers that require
- // an identity server to be passed during certain flows.
- // See also https://github.com/matrix-org/synapse/pull/5868.
- if (
- this.props.showIdentityServerIfRequiredByHomeserver &&
- !this.state.showIdentityServer &&
- await this.isIdentityServerRequiredByHomeserver()
- ) {
- this.setState({
- showIdentityServer: true,
- });
- return null;
- }
-
- return result;
- }
-
- async validateAndApplyServer(hsUrl, isUrl) {
- // Always try and use the defaults first
- const defaultConfig: ValidatedServerConfig = SdkConfig.get()["validated_server_config"];
- if (defaultConfig.hsUrl === hsUrl && defaultConfig.isUrl === isUrl) {
- this.setState({
- hsUrl: defaultConfig.hsUrl,
- isUrl: defaultConfig.isUrl,
- busy: false,
- errorText: "",
- });
- this.props.onServerConfigChange(defaultConfig);
- return defaultConfig;
- }
-
- this.setState({
- hsUrl,
- isUrl,
- busy: true,
- errorText: "",
- });
-
- try {
- const result = await AutoDiscoveryUtils.validateServerConfigWithStaticUrls(hsUrl, isUrl);
- this.setState({busy: false, errorText: ""});
- this.props.onServerConfigChange(result);
- return result;
- } catch (e) {
- console.error(e);
-
- const stateForError = AutoDiscoveryUtils.authComponentStateForError(e);
- if (!stateForError.isFatalError) {
- this.setState({
- busy: false,
- });
- // carry on anyway
- const result = await AutoDiscoveryUtils.validateServerConfigWithStaticUrls(hsUrl, isUrl, true);
- this.props.onServerConfigChange(result);
- return result;
- } else {
- let message = _t("Unable to validate homeserver/identity server");
- if (e.translatedMessage) {
- message = e.translatedMessage;
- }
- this.setState({
- busy: false,
- errorText: message,
- });
-
- return null;
- }
- }
- }
-
- async isIdentityServerRequiredByHomeserver() {
- // XXX: We shouldn't have to create a whole new MatrixClient just to
- // check if the homeserver requires an identity server... Should it be
- // extracted to a static utils function...?
- return createClient({
- baseUrl: this.state.hsUrl,
- }).doesServerRequireIdServerParam();
- }
-
- onHomeserverBlur = (ev) => {
- this._hsTimeoutId = this._waitThenInvoke(this._hsTimeoutId, () => {
- this.validateServer();
- });
- };
-
- onHomeserverChange = (ev) => {
- const hsUrl = ev.target.value;
- this.setState({ hsUrl });
- };
-
- onIdentityServerBlur = (ev) => {
- this._isTimeoutId = this._waitThenInvoke(this._isTimeoutId, () => {
- this.validateServer();
- });
- };
-
- onIdentityServerChange = (ev) => {
- const isUrl = ev.target.value;
- this.setState({ isUrl });
- };
-
- onSubmit = async (ev) => {
- ev.preventDefault();
- ev.stopPropagation();
- const result = await this.validateServer();
- if (!result) return; // Do not continue.
-
- if (this.props.onAfterSubmit) {
- this.props.onAfterSubmit();
- }
- };
-
- _waitThenInvoke(existingTimeoutId, fn) {
- if (existingTimeoutId) {
- clearTimeout(existingTimeoutId);
- }
- return setTimeout(fn.bind(this), this.props.delayTimeMs);
- }
-
- showHelpPopup = () => {
- const CustomServerDialog = sdk.getComponent('auth.CustomServerDialog');
- Modal.createTrackedDialog('Custom Server Dialog', '', CustomServerDialog);
- };
-
- _renderHomeserverSection() {
- const Field = sdk.getComponent('elements.Field');
- return
- {_t("Enter your custom homeserver URL What does this mean?", {}, {
- a: sub =>
- {sub}
- ,
- })}
-
;
- }
-
- _renderIdentityServerSection() {
- const Field = sdk.getComponent('elements.Field');
- const classes = classNames({
- "mx_ServerConfig_identityServer": true,
- "mx_ServerConfig_identityServer_shown": this.state.showIdentityServer,
- });
- return
- {_t("Enter your custom identity server URL What does this mean?", {}, {
- a: sub =>
- {sub}
- ,
- })}
-
;
- }
-
- render() {
- const AccessibleButton = sdk.getComponent('elements.AccessibleButton');
-
- const errorText = this.state.errorText
- ? {this.state.errorText}
- : null;
-
- const submitButton = this.props.submitText
- ? ,
- description: () => _t('Join millions for free on the largest public server'),
- serverConfig: makeType(ValidatedServerConfig, {
- hsUrl: "https://matrix-client.matrix.org",
- hsName: "matrix.org",
- hsNameIsDifferent: false,
- isUrl: "https://vector.im",
- }),
- },
- PREMIUM: {
- id: PREMIUM,
- label: () => _t('Premium'),
- logo: () => ,
- description: () => _t('Premium hosting for organisations Learn more', {}, {
- a: sub =>
- {sub}
- ,
- }),
- identityServerUrl: "https://vector.im",
- },
- ADVANCED: {
- id: ADVANCED,
- label: () => _t('Advanced'),
- logo: () =>
- })
- {_t('Other')}
-
,
- description: () => _t('Find other public servers or use a custom server'),
- },
-};
-
-export function getTypeFromServerConfig(config) {
- const {hsUrl} = config;
- if (!hsUrl) {
- return null;
- } else if (hsUrl === TYPES.FREE.serverConfig.hsUrl) {
- return FREE;
- } else if (new URL(hsUrl).hostname.endsWith('.modular.im')) {
- // This is an unlikely case to reach, as Modular defaults to hiding the
- // server type selector.
- return PREMIUM;
- } else {
- return ADVANCED;
- }
-}
-
-export default class ServerTypeSelector extends React.PureComponent {
- static propTypes = {
- // The default selected type.
- selected: PropTypes.string,
- // Handler called when the selected type changes.
- onChange: PropTypes.func.isRequired,
- };
-
- constructor(props) {
- super(props);
-
- const {
- selected,
- } = props;
-
- this.state = {
- selected,
- };
- }
-
- updateSelectedType(type) {
- if (this.state.selected === type) {
- return;
- }
- this.setState({
- selected: type,
- });
- if (this.props.onChange) {
- this.props.onChange(type);
- }
- }
-
- onClick = (e) => {
- e.stopPropagation();
- const type = e.currentTarget.dataset.id;
- this.updateSelectedType(type);
- };
-
- render() {
- const AccessibleButton = sdk.getComponent('elements.AccessibleButton');
-
- const serverTypes = [];
- for (const type of Object.values(TYPES)) {
- const { id, label, logo, description } = type;
- const classes = classnames(
- "mx_ServerTypeSelector_type",
- `mx_ServerTypeSelector_type_${id}`,
- {
- "mx_ServerTypeSelector_type_selected": id === this.state.selected,
- },
- );
-
- serverTypes.push(
- {_t('Other')}
-
-
-
-
);
- }
-
- return
- {label()}
-
-
- {logo()}
-
-
- {description()}
-
-
- {serverTypes}
-
;
- }
-}
diff --git a/src/components/views/auth/SignInToText.js b/src/components/views/auth/SignInToText.js
deleted file mode 100644
index 7564096b7d..0000000000
--- a/src/components/views/auth/SignInToText.js
+++ /dev/null
@@ -1,62 +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.
-*/
-
-import React from 'react';
-import {_t} from "../../../languageHandler";
-import * as sdk from "../../../index";
-import PropTypes from "prop-types";
-import {ValidatedServerConfig} from "../../../utils/AutoDiscoveryUtils";
-
-export default class SignInToText extends React.PureComponent {
- static propTypes = {
- serverConfig: PropTypes.instanceOf(ValidatedServerConfig).isRequired,
- onEditServerDetailsClick: PropTypes.func,
- };
-
- render() {
- let signInToText = _t('Sign in to your Matrix account on %(serverName)s', {
- serverName: this.props.serverConfig.hsName,
- });
- if (this.props.serverConfig.hsNameIsDifferent) {
- const TextWithTooltip = sdk.getComponent("elements.TextWithTooltip");
-
- signInToText = _t('Sign in to your Matrix account on - {signInToText} - {editLink} -
; - } -} diff --git a/src/components/views/context_menus/MessageContextMenu.js b/src/components/views/context_menus/MessageContextMenu.js index bc4514f8a6..6b871e4f24 100644 --- a/src/components/views/context_menus/MessageContextMenu.js +++ b/src/components/views/context_menus/MessageContextMenu.js @@ -149,7 +149,7 @@ export default class MessageContextMenu extends React.Component { onRedactClick = () => { const ConfirmRedactDialog = sdk.getComponent("dialogs.ConfirmRedactDialog"); Modal.createTrackedDialog('Confirm Redact Dialog', '', ConfirmRedactDialog, { - onFinished: async (proceed) => { + onFinished: async (proceed, reason) => { if (!proceed) return; const cli = MatrixClientPeg.get(); @@ -157,6 +157,8 @@ export default class MessageContextMenu extends React.Component { await cli.redactEvent( this.props.mxEvent.getRoomId(), this.props.mxEvent.getId(), + undefined, + reason ? { reason } : {}, ); } catch (e) { const code = e.errcode || e.statusCode; diff --git a/src/components/views/context_menus/WidgetContextMenu.tsx b/src/components/views/context_menus/WidgetContextMenu.tsx index 7656e70341..8026942038 100644 --- a/src/components/views/context_menus/WidgetContextMenu.tsx +++ b/src/components/views/context_menus/WidgetContextMenu.tsx @@ -57,7 +57,7 @@ const WidgetContextMenu: React.FC
{ this.props.description }
diff --git a/src/components/views/dialogs/ModalWidgetDialog.tsx b/src/components/views/dialogs/ModalWidgetDialog.tsx
index e722374555..484e8f0dcf 100644
--- a/src/components/views/dialogs/ModalWidgetDialog.tsx
+++ b/src/components/views/dialogs/ModalWidgetDialog.tsx
@@ -38,6 +38,7 @@ import {MatrixClientPeg} from "../../../MatrixClientPeg";
import RoomViewStore from "../../../stores/RoomViewStore";
import {OwnProfileStore} from "../../../stores/OwnProfileStore";
import { arrayFastClone } from "../../../utils/arrays";
+import { ElementWidget } from "../../../stores/widgets/StopGapWidget";
interface IProps {
widgetDefinition: IModalWidgetOpenRequestData;
@@ -64,7 +65,7 @@ export default class ModalWidgetDialog extends React.PureComponent
+ const isDisabled = this.state.disabledButtonIds.includes(def.id);
+
+ return
{ def.label }
;
});
diff --git a/src/components/views/dialogs/RegistrationEmailPromptDialog.tsx b/src/components/views/dialogs/RegistrationEmailPromptDialog.tsx
new file mode 100644
index 0000000000..b7cc81c113
--- /dev/null
+++ b/src/components/views/dialogs/RegistrationEmailPromptDialog.tsx
@@ -0,0 +1,96 @@
+/*
+Copyright 2020 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.
+*/
+
+import * as React from "react";
+
+import { _t } from '../../../languageHandler';
+import { IDialogProps } from "./IDialogProps";
+import {useRef, useState} from "react";
+import Field from "../elements/Field";
+import CountlyAnalytics from "../../../CountlyAnalytics";
+import withValidation from "../elements/Validation";
+import * as Email from "../../../email";
+import BaseDialog from "./BaseDialog";
+import DialogButtons from "../elements/DialogButtons";
+
+interface IProps extends IDialogProps {
+ onFinished(continued: boolean, email?: string): void;
+}
+
+const validation = withValidation({
+ rules: [
+ {
+ key: "email",
+ test: ({ value }) => !value || Email.looksValid(value),
+ invalid: () => _t("Doesn't look like a valid email address"),
+ },
+ ],
+});
+
+const RegistrationEmailPromptDialog: React.FC = ({onFinished}) => {
+ const [email, setEmail] = useState("");
+ const fieldRef = useRef();
+
+ const onSubmit = async () => {
+ if (email) {
+ const valid = await fieldRef.current.validate({ allowEmpty: false });
+
+ if (!valid) {
+ fieldRef.current.focus();
+ fieldRef.current.validate({ allowEmpty: false, focused: true });
+ return;
+ }
+ }
+
+ onFinished(true, email);
+ };
+
+ return onFinished(false)}
+ fixedWidth={false}
+ >
+ ;
+};
+
+export default RegistrationEmailPromptDialog;
diff --git a/src/components/views/dialogs/RoomSettingsDialog.js b/src/components/views/dialogs/RoomSettingsDialog.js
index a43b284c42..9d9313f08f 100644
--- a/src/components/views/dialogs/RoomSettingsDialog.js
+++ b/src/components/views/dialogs/RoomSettingsDialog.js
@@ -53,9 +53,9 @@ export default class RoomSettingsDialog extends React.Component {
}
_onAction = (payload) => {
- // When room changes below us, close the room settings
+ // When view changes below us, close the room settings
// whilst the modal is open this can only be triggered when someone hits Leave Room
- if (payload.action === 'view_next_room') {
+ if (payload.action === 'view_home_page') {
this.props.onFinished();
}
};
diff --git a/src/components/views/dialogs/ServerPickerDialog.tsx b/src/components/views/dialogs/ServerPickerDialog.tsx
new file mode 100644
index 0000000000..65d53f0870
--- /dev/null
+++ b/src/components/views/dialogs/ServerPickerDialog.tsx
@@ -0,0 +1,235 @@
+/*
+Copyright 2020 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.
+*/
+
+import React, {createRef} from "react";
+import {AutoDiscovery} from "matrix-js-sdk/src/autodiscovery";
+
+import AutoDiscoveryUtils, {ValidatedServerConfig} from "../../../utils/AutoDiscoveryUtils";
+import BaseDialog from './BaseDialog';
+import { _t } from '../../../languageHandler';
+import AccessibleButton from "../elements/AccessibleButton";
+import SdkConfig from "../../../SdkConfig";
+import Field from "../elements/Field";
+import StyledRadioButton from "../elements/StyledRadioButton";
+import TextWithTooltip from "../elements/TextWithTooltip";
+import withValidation, {IFieldState} from "../elements/Validation";
+
+interface IProps {
+ title?: string;
+ serverConfig: ValidatedServerConfig;
+ onFinished(config?: ValidatedServerConfig): void;
+}
+
+interface IState {
+ defaultChosen: boolean;
+ otherHomeserver: string;
+}
+
+export default class ServerPickerDialog extends React.PureComponent {
+ private readonly defaultServer: ValidatedServerConfig;
+ private readonly fieldRef = createRef();
+ private validatedConf: ValidatedServerConfig;
+
+ constructor(props) {
+ super(props);
+
+ const config = SdkConfig.get();
+ this.defaultServer = config["validated_server_config"] as ValidatedServerConfig;
+ const { serverConfig } = this.props;
+
+ let otherHomeserver = "";
+ if (!serverConfig.isDefault) {
+ if (serverConfig.isNameResolvable && serverConfig.hsName) {
+ otherHomeserver = serverConfig.hsName;
+ } else {
+ otherHomeserver = serverConfig.hsUrl;
+ }
+ }
+
+ this.state = {
+ defaultChosen: serverConfig.isDefault,
+ otherHomeserver,
+ };
+ }
+
+ private onDefaultChosen = () => {
+ this.setState({ defaultChosen: true });
+ };
+
+ private onOtherChosen = () => {
+ this.setState({ defaultChosen: false });
+ };
+
+ private onHomeserverChange = (ev) => {
+ this.setState({ otherHomeserver: ev.target.value });
+ };
+
+ // TODO: Do we want to support .well-known lookups here?
+ // If for some reason someone enters "matrix.org" for a URL, we could do a lookup to
+ // find their homeserver without demanding they use "https://matrix.org"
+ private validate = withValidation({
+ deriveData: async ({ value }) => {
+ let hsUrl = value.trim(); // trim to account for random whitespace
+
+ // if the URL has no protocol, try validate it as a serverName via well-known
+ if (!hsUrl.includes("://")) {
+ try {
+ const discoveryResult = await AutoDiscovery.findClientConfig(hsUrl);
+ this.validatedConf = AutoDiscoveryUtils.buildValidatedConfigFromDiscovery(hsUrl, discoveryResult);
+ return {}; // we have a validated config, we don't need to try the other paths
+ } catch (e) {
+ console.error(`Attempted ${hsUrl} as a server_name but it failed`, e);
+ }
+ }
+
+ // if we got to this stage then either the well-known failed or the URL had a protocol specified,
+ // so validate statically only. If the URL has no protocol, default to https.
+ if (!hsUrl.includes("://")) {
+ hsUrl = "https://" + hsUrl;
+ }
+
+ try {
+ this.validatedConf = await AutoDiscoveryUtils.validateServerConfigWithStaticUrls(hsUrl);
+ return {};
+ } catch (e) {
+ console.error(e);
+
+ const stateForError = AutoDiscoveryUtils.authComponentStateForError(e);
+ if (stateForError.isFatalError) {
+ let error = _t("Unable to validate homeserver");
+ if (e.translatedMessage) {
+ error = e.translatedMessage;
+ }
+ return { error };
+ }
+
+ // try to carry on anyway
+ try {
+ this.validatedConf = await AutoDiscoveryUtils.validateServerConfigWithStaticUrls(hsUrl, null, true);
+ return {};
+ } catch (e) {
+ console.error(e);
+ return { error: _t("Invalid URL") };
+ }
+ }
+ },
+ rules: [
+ {
+ key: "required",
+ test: ({ value, allowEmpty }) => allowEmpty || !!value,
+ invalid: () => _t("Specify a homeserver"),
+ }, {
+ key: "valid",
+ test: async function({ value }, { error }) {
+ if (!value) return true;
+ return !error;
+ },
+ invalid: function({ error }) {
+ return error;
+ },
+ },
+ ],
+ });
+
+ private onHomeserverValidate = (fieldState: IFieldState) => this.validate(fieldState);
+
+ private onSubmit = async (ev) => {
+ ev.preventDefault();
+
+ const valid = await this.fieldRef.current.validate({ allowEmpty: false });
+
+ if (!valid) {
+ this.fieldRef.current.focus();
+ this.fieldRef.current.validate({ allowEmpty: false, focused: true });
+ return;
+ }
+
+ this.props.onFinished(this.validatedConf);
+ };
+
+ public render() {
+ let text;
+ if (this.defaultServer.hsName === "matrix.org") {
+ text = _t("Matrix.org is the biggest public homeserver in the world, so it’s a good place for many.");
+ }
+
+ let defaultServerName = this.defaultServer.hsName;
+ if (this.defaultServer.hsNameIsDifferent) {
+ defaultServerName = (
+
+ {this.defaultServer.hsName}
+
+ );
+ }
+
+ return
+
+ ;
+ }
+}
diff --git a/src/components/views/dialogs/ShareDialog.tsx b/src/components/views/dialogs/ShareDialog.tsx
index 1569977d58..5264031cc6 100644
--- a/src/components/views/dialogs/ShareDialog.tsx
+++ b/src/components/views/dialogs/ShareDialog.tsx
@@ -146,7 +146,7 @@ export default class ShareDialog extends React.PureComponent {
const events = this.props.target.getLiveTimeline().getEvents();
matrixToUrl = this.state.permalinkCreator.forEvent(events[events.length - 1].getId());
} else {
- matrixToUrl = this.state.permalinkCreator.forRoom();
+ matrixToUrl = this.state.permalinkCreator.forShareableRoom();
}
} else if (this.props.target instanceof User || this.props.target instanceof RoomMember) {
matrixToUrl = makeUserPermalink(this.props.target.userId);
diff --git a/src/components/views/dialogs/WidgetOpenIDPermissionsDialog.js b/src/components/views/dialogs/WidgetOpenIDPermissionsDialog.js
index e793b85079..7ed3d04318 100644
--- a/src/components/views/dialogs/WidgetOpenIDPermissionsDialog.js
+++ b/src/components/views/dialogs/WidgetOpenIDPermissionsDialog.js
@@ -17,18 +17,17 @@ limitations under the License.
import React from 'react';
import PropTypes from 'prop-types';
import {_t} from "../../../languageHandler";
-import SettingsStore from "../../../settings/SettingsStore";
import * as sdk from "../../../index";
import LabelledToggleSwitch from "../elements/LabelledToggleSwitch";
-import WidgetUtils from "../../../utils/WidgetUtils";
-import {SettingLevel} from "../../../settings/SettingLevel";
+import {Widget} from "matrix-widget-api";
+import {OIDCState, WidgetPermissionStore} from "../../../stores/widgets/WidgetPermissionStore";
export default class WidgetOpenIDPermissionsDialog extends React.Component {
static propTypes = {
onFinished: PropTypes.func.isRequired,
- widgetUrl: PropTypes.string.isRequired,
- widgetId: PropTypes.string.isRequired,
- isUserWidget: PropTypes.bool.isRequired,
+ widget: PropTypes.objectOf(Widget).isRequired,
+ widgetKind: PropTypes.string.isRequired, // WidgetKind from widget-api
+ inRoomId: PropTypes.string,
};
constructor() {
@@ -51,16 +50,10 @@ export default class WidgetOpenIDPermissionsDialog extends React.Component {
if (this.state.rememberSelection) {
console.log(`Remembering ${this.props.widgetId} as allowed=${allowed} for OpenID`);
- const currentValues = SettingsStore.getValue("widgetOpenIDPermissions");
- if (!currentValues.allow) currentValues.allow = [];
- if (!currentValues.deny) currentValues.deny = [];
-
- const securityKey = WidgetUtils.getWidgetSecurityKey(
- this.props.widgetId,
- this.props.widgetUrl,
- this.props.isUserWidget);
- (allowed ? currentValues.allow : currentValues.deny).push(securityKey);
- SettingsStore.setValue("widgetOpenIDPermissions", null, SettingLevel.DEVICE, currentValues);
+ WidgetPermissionStore.instance.setOIDCState(
+ this.props.widget, this.props.widgetKind, this.props.inRoomId,
+ allowed ? OIDCState.Allowed : OIDCState.Denied,
+ );
}
this.props.onFinished(allowed);
@@ -84,7 +77,7 @@ export default class WidgetOpenIDPermissionsDialog extends React.Component {
"A widget located at %(widgetUrl)s would like to verify your identity. " +
"By allowing this, the widget will be able to verify your user ID, but not " +
"perform actions as you.", {
- widgetUrl: this.props.widgetUrl.split("?")[0],
+ widgetUrl: this.props.widget.templateUrl.split("?")[0],
},
)}
diff --git a/src/components/views/elements/AppTile.js b/src/components/views/elements/AppTile.js
index b862a1e912..7e0ae965bb 100644
--- a/src/components/views/elements/AppTile.js
+++ b/src/components/views/elements/AppTile.js
@@ -375,17 +375,20 @@ export default class AppTile extends React.Component {
);
- // all widgets can theoretically be allowed to remain on screen, so we wrap
- // them all in a PersistedElement from the get-go. If we wait, the iframe will
- // be re-mounted later, which means the widget has to start over, which is bad.
+ if (!this.props.userWidget) {
+ // All room widgets can theoretically be allowed to remain on screen, so we
+ // wrap them all in a PersistedElement from the get-go. If we wait, the iframe
+ // will be re-mounted later, which means the widget has to start over, which is
+ // bad.
- // Also wrap the PersistedElement in a div to fix the height, otherwise
- // AppTile's border is in the wrong place
- appTileBody =
+
+ {_t("Just a heads up, if you don't add an email and forget your password, you could " + + "permanently lose access to your account.", {}, { + b: sub => {sub}, + })}
+ +
-
- {appTileBody}
-
-
;
+ // Also wrap the PersistedElement in a div to fix the height, otherwise
+ // AppTile's border is in the wrong place
+ appTileBody =
+
+ {appTileBody}
+
+
;
+ }
}
}
diff --git a/src/components/views/elements/EffectsOverlay.tsx b/src/components/views/elements/EffectsOverlay.tsx
new file mode 100644
index 0000000000..38be8da9a8
--- /dev/null
+++ b/src/components/views/elements/EffectsOverlay.tsx
@@ -0,0 +1,94 @@
+/*
+ Copyright 2020 Nurjin Jafar
+ Copyright 2020 Nordeck IT + Consulting GmbH.
+
+ 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 React, { FunctionComponent, useEffect, useRef } from 'react';
+import dis from '../../../dispatcher/dispatcher';
+import ICanvasEffect from '../../../effects/ICanvasEffect';
+import {CHAT_EFFECTS} from '../../../effects'
+
+interface IProps {
+ roomWidth: number;
+}
+
+const EffectsOverlay: FunctionComponent
+
;
+ }
+
+ return
+ { providers.map(idp => (
+
;
+};
+
+export default SSOButtons;
diff --git a/src/components/views/elements/ServerPicker.tsx b/src/components/views/elements/ServerPicker.tsx
new file mode 100644
index 0000000000..4551a49deb
--- /dev/null
+++ b/src/components/views/elements/ServerPicker.tsx
@@ -0,0 +1,93 @@
+/*
+Copyright 2020 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.
+*/
+
+import React from 'react';
+
+import AccessibleButton from "./AccessibleButton";
+import {ValidatedServerConfig} from "../../../utils/AutoDiscoveryUtils";
+import {_t} from "../../../languageHandler";
+import TextWithTooltip from "./TextWithTooltip";
+import SdkConfig from "../../../SdkConfig";
+import Modal from "../../../Modal";
+import ServerPickerDialog from "../dialogs/ServerPickerDialog";
+import InfoDialog from "../dialogs/InfoDialog";
+
+interface IProps {
+ title?: string;
+ dialogTitle?: string;
+ serverConfig: ValidatedServerConfig;
+ onServerConfigChange?(config: ValidatedServerConfig): void;
+}
+
+const showPickerDialog = (
+ title: string,
+ serverConfig: ValidatedServerConfig,
+ onFinished: (config: ValidatedServerConfig) => void,
+) => {
+ Modal.createTrackedDialog("Server Picker", "", ServerPickerDialog, { title, serverConfig, onFinished });
+};
+
+const onHelpClick = () => {
+ Modal.createTrackedDialog('Custom Server Dialog', '', InfoDialog, {
+ title: _t("Server Options"),
+ description: _t("You can use the custom server options to sign into other Matrix servers by specifying " +
+ "a different homeserver URL. This allows you to use Element with an existing Matrix account on " +
+ "a different homeserver."),
+ button: _t("Dismiss"),
+ hasCloseButton: false,
+ fixedWidth: false,
+ }, "mx_ServerPicker_helpDialog");
+};
+
+const ServerPicker = ({ title, dialogTitle, serverConfig, onServerConfigChange }: IProps) => {
+ let editBtn;
+ if (!SdkConfig.get()["disable_custom_urls"] && onServerConfigChange) {
+ const onClick = () => {
+ showPickerDialog(dialogTitle, serverConfig, (config?: ValidatedServerConfig) => {
+ if (config) {
+ onServerConfigChange(config);
+ }
+ });
+ };
+ editBtn =
+
+}
+
+export default ServerPicker;
diff --git a/src/components/views/messages/MJitsiWidgetEvent.tsx b/src/components/views/messages/MJitsiWidgetEvent.tsx
index 82aa32d3b7..b87efd472a 100644
--- a/src/components/views/messages/MJitsiWidgetEvent.tsx
+++ b/src/components/views/messages/MJitsiWidgetEvent.tsx
@@ -35,7 +35,7 @@ export default class MJitsiWidgetEvent extends React.PureComponent{title || _t("Homeserver")}
+
-
+
+
);
}
diff --git a/src/components/views/rooms/NewRoomIntro.tsx b/src/components/views/rooms/NewRoomIntro.tsx
index be4ecaffb3..9be3d6be18 100644
--- a/src/components/views/rooms/NewRoomIntro.tsx
+++ b/src/components/views/rooms/NewRoomIntro.tsx
@@ -60,8 +60,9 @@ const NewRoomIntro = () => {
{ caption && { caption }
} ; } else { + const inRoom = room && room.getMyMembership() === "join"; const topic = room.currentState.getStateEvents(EventType.RoomTopic, "")?.getContent()?.topic; - const canAddTopic = room.currentState.maySendStateEvent(EventType.RoomTopic, cli.getUserId()); + const canAddTopic = inRoom && room.currentState.maySendStateEvent(EventType.RoomTopic, cli.getUserId()); const onTopicClick = () => { dis.dispatch({ @@ -99,9 +100,25 @@ const NewRoomIntro = () => { }); } - const onInviteClick = () => { - dis.dispatch({ action: "view_invite", roomId }); - }; + let canInvite = inRoom; + const powerLevels = room.currentState.getStateEvents(EventType.RoomPowerLevels, "")?.getContent(); + const me = room.getMember(cli.getUserId()); + if (powerLevels && me && powerLevels.invite > me.powerLevel) { + canInvite = false; + } + + let buttons; + if (canInvite) { + const onInviteClick = () => { + dis.dispatch({ action: "view_invite", roomId }); + }; + + buttons =
+
+ {_t("Invite to this room")}
+
+
+ }
const avatarUrl = room.currentState.getStateEvents(EventType.RoomAvatar, "")?.getContent()?.url;
body = {topicText}
-
-
- {_t("Invite to this room")}
-
-
+ { buttons }