Convert TabbedIntegrationManagerDialog to TS
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>pull/21833/head
parent
37099fd188
commit
161937ac92
|
@ -15,42 +15,53 @@ limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import PropTypes from 'prop-types';
|
|
||||||
import { IntegrationManagers } from "../../../integrations/IntegrationManagers";
|
import { IntegrationManagers } from "../../../integrations/IntegrationManagers";
|
||||||
import { Room } from "matrix-js-sdk/src/models/room";
|
import { Room } from "matrix-js-sdk/src/models/room";
|
||||||
import * as sdk from '../../../index';
|
|
||||||
import { dialogTermsInteractionCallback, TermsNotSignedError } from "../../../Terms";
|
import { dialogTermsInteractionCallback, TermsNotSignedError } from "../../../Terms";
|
||||||
import classNames from 'classnames';
|
import classNames from 'classnames';
|
||||||
import * as ScalarMessaging from "../../../ScalarMessaging";
|
import * as ScalarMessaging from "../../../ScalarMessaging";
|
||||||
import { replaceableComponent } from "../../../utils/replaceableComponent";
|
import { replaceableComponent } from "../../../utils/replaceableComponent";
|
||||||
|
import { IntegrationManagerInstance } from "../../../integrations/IntegrationManagerInstance";
|
||||||
|
import ScalarAuthClient from "../../../ScalarAuthClient";
|
||||||
|
import AccessibleButton from "../elements/AccessibleButton";
|
||||||
|
import IntegrationManager from "../settings/IntegrationManager";
|
||||||
|
|
||||||
|
interface IProps {
|
||||||
|
/**
|
||||||
|
* Called with:
|
||||||
|
* * success {bool} True if the user accepted any douments, false if cancelled
|
||||||
|
* * agreedUrls {string[]} List of agreed URLs
|
||||||
|
*/
|
||||||
|
onFinished: () => void;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Optional room where the integration manager should be open to
|
||||||
|
*/
|
||||||
|
room: Room;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Optional screen to open on the integration manager
|
||||||
|
*/
|
||||||
|
screen?: string;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Optional integration ID to open in the integration manager
|
||||||
|
*/
|
||||||
|
integrationId?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface IState {
|
||||||
|
managers: IntegrationManagerInstance[];
|
||||||
|
busy: boolean;
|
||||||
|
currentIndex: number;
|
||||||
|
currentConnected: boolean;
|
||||||
|
currentLoading: boolean;
|
||||||
|
currentScalarClient: ScalarAuthClient;
|
||||||
|
}
|
||||||
|
|
||||||
@replaceableComponent("views.dialogs.TabbedIntegrationManagerDialog")
|
@replaceableComponent("views.dialogs.TabbedIntegrationManagerDialog")
|
||||||
export default class TabbedIntegrationManagerDialog extends React.Component {
|
export default class TabbedIntegrationManagerDialog extends React.Component<IProps, IState> {
|
||||||
static propTypes = {
|
constructor(props: IProps) {
|
||||||
/**
|
|
||||||
* Called with:
|
|
||||||
* * success {bool} True if the user accepted any douments, false if cancelled
|
|
||||||
* * agreedUrls {string[]} List of agreed URLs
|
|
||||||
*/
|
|
||||||
onFinished: PropTypes.func.isRequired,
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Optional room where the integration manager should be open to
|
|
||||||
*/
|
|
||||||
room: PropTypes.instanceOf(Room),
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Optional screen to open on the integration manager
|
|
||||||
*/
|
|
||||||
screen: PropTypes.string,
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Optional integration ID to open in the integration manager
|
|
||||||
*/
|
|
||||||
integrationId: PropTypes.string,
|
|
||||||
};
|
|
||||||
|
|
||||||
constructor(props) {
|
|
||||||
super(props);
|
super(props);
|
||||||
|
|
||||||
this.state = {
|
this.state = {
|
||||||
|
@ -63,11 +74,11 @@ export default class TabbedIntegrationManagerDialog extends React.Component {
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
componentDidMount() {
|
public componentDidMount(): void {
|
||||||
this.openManager(0, true);
|
this.openManager(0, true);
|
||||||
}
|
}
|
||||||
|
|
||||||
openManager = async (i, force = false) => {
|
private openManager = async (i: number, force = false): Promise<void> => {
|
||||||
if (i === this.state.currentIndex && !force) return;
|
if (i === this.state.currentIndex && !force) return;
|
||||||
|
|
||||||
const manager = this.state.managers[i];
|
const manager = this.state.managers[i];
|
||||||
|
@ -120,8 +131,7 @@ export default class TabbedIntegrationManagerDialog extends React.Component {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
_renderTabs() {
|
private renderTabs(): JSX.Element[] {
|
||||||
const AccessibleButton = sdk.getComponent("views.elements.AccessibleButton");
|
|
||||||
return this.state.managers.map((m, i) => {
|
return this.state.managers.map((m, i) => {
|
||||||
const classes = classNames({
|
const classes = classNames({
|
||||||
'mx_TabbedIntegrationManagerDialog_tab': true,
|
'mx_TabbedIntegrationManagerDialog_tab': true,
|
||||||
|
@ -140,8 +150,7 @@ export default class TabbedIntegrationManagerDialog extends React.Component {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
_renderTab() {
|
public renderTab(): JSX.Element {
|
||||||
const IntegrationManager = sdk.getComponent("views.settings.IntegrationManager");
|
|
||||||
let uiUrl = null;
|
let uiUrl = null;
|
||||||
if (this.state.currentScalarClient) {
|
if (this.state.currentScalarClient) {
|
||||||
uiUrl = this.state.currentScalarClient.getScalarInterfaceUrlForRoom(
|
uiUrl = this.state.currentScalarClient.getScalarInterfaceUrlForRoom(
|
||||||
|
@ -151,7 +160,6 @@ export default class TabbedIntegrationManagerDialog extends React.Component {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
return <IntegrationManager
|
return <IntegrationManager
|
||||||
configured={true}
|
|
||||||
loading={this.state.currentLoading}
|
loading={this.state.currentLoading}
|
||||||
connected={this.state.currentConnected}
|
connected={this.state.currentConnected}
|
||||||
url={uiUrl}
|
url={uiUrl}
|
||||||
|
@ -159,14 +167,14 @@ export default class TabbedIntegrationManagerDialog extends React.Component {
|
||||||
/>;
|
/>;
|
||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
public render(): JSX.Element {
|
||||||
return (
|
return (
|
||||||
<div className='mx_TabbedIntegrationManagerDialog_container'>
|
<div className='mx_TabbedIntegrationManagerDialog_container'>
|
||||||
<div className='mx_TabbedIntegrationManagerDialog_tabs'>
|
<div className='mx_TabbedIntegrationManagerDialog_tabs'>
|
||||||
{ this._renderTabs() }
|
{ this.renderTabs() }
|
||||||
</div>
|
</div>
|
||||||
<div className='mx_TabbedIntegrationManagerDialog_currentManager'>
|
<div className='mx_TabbedIntegrationManagerDialog_currentManager'>
|
||||||
{ this._renderTab() }
|
{ this.renderTab() }
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
Loading…
Reference in New Issue