Implement updated open dialog method of the Module API (#11395)

* Implement updated open dialog method

Signed-off-by: Dominik Henneke <dominik.henneke@nordeck.net>

* Apply the review comments

Signed-off-by: Dominik Henneke <dominik.henneke@nordeck.net>

* Add unit tests for the module system dialog

Signed-off-by: Dominik Henneke <dominik.henneke@nordeck.net>

* Bump @matrix-org/react-sdk-module-api from 1.0.0 to 2.0.0

Signed-off-by: Dominik Henneke <dominik.henneke@nordeck.net>

* Run prettier

Signed-off-by: Dominik Henneke <dominik.henneke@nordeck.net>

* Apply review comments

Signed-off-by: Dominik Henneke <dominik.henneke@nordeck.net>

---------

Signed-off-by: Dominik Henneke <dominik.henneke@nordeck.net>
This commit is contained in:
Dominik Henneke 2023-08-21 14:09:17 +02:00 committed by GitHub
parent 3a647229ad
commit 5c43054bfe
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 299 additions and 129 deletions

View file

@ -17,15 +17,18 @@ limitations under the License.
import React, { createRef } from "react";
import { DialogContent, DialogProps } from "@matrix-org/react-sdk-module-api/lib/components/DialogContent";
import { logger } from "matrix-js-sdk/src/logger";
import { ModuleApi } from "@matrix-org/react-sdk-module-api/lib/ModuleApi";
import { ModuleUiDialogOptions } from "@matrix-org/react-sdk-module-api/lib/types/ModuleUiDialogOptions";
import ScrollableBaseModal, { IScrollableBaseState } from "./ScrollableBaseModal";
import { _t } from "../../../languageHandler";
interface IProps<P extends DialogProps, C extends DialogContent<P>> {
contentFactory: (props: P, ref: React.RefObject<C>) => React.ReactNode;
contentProps: P;
title: string;
onFinished(ok?: boolean, model?: Awaited<ReturnType<DialogContent<P>["trySubmit"]>>): void;
additionalContentProps: Omit<P, keyof DialogProps> | undefined;
initialOptions: ModuleUiDialogOptions;
moduleApi: ModuleApi;
onFinished(ok?: boolean, model?: Awaited<ReturnType<DialogContent<P & DialogProps>["trySubmit"]>>): void;
}
interface IState extends IScrollableBaseState {
@ -42,9 +45,10 @@ export class ModuleUiDialog<P extends DialogProps, C extends DialogContent<P>> e
super(props);
this.state = {
title: this.props.title,
canSubmit: true,
actionLabel: _t("OK"),
title: this.props.initialOptions.title,
actionLabel: this.props.initialOptions.actionLabel ?? _t("OK"),
cancelLabel: this.props.initialOptions.cancelLabel,
canSubmit: this.props.initialOptions.canSubmit ?? true,
};
}
@ -61,11 +65,23 @@ export class ModuleUiDialog<P extends DialogProps, C extends DialogContent<P>> e
this.props.onFinished(false);
}
private setOptions(options: ModuleUiDialogOptions): void {
this.setState((state) => ({ ...state, ...options }));
}
protected renderContent(): React.ReactNode {
return (
<div className="mx_ModuleUiDialog">
{this.props.contentFactory(this.props.contentProps, this.contentRef)}
</div>
);
const dialogProps: DialogProps = {
moduleApi: this.props.moduleApi,
setOptions: this.setOptions.bind(this),
cancel: this.cancel.bind(this),
};
// Typescript isn't very happy understanding that `contentProps` satisfies `P`
const contentProps: P = {
...this.props.additionalContentProps,
...dialogProps,
} as unknown as P;
return <div className="mx_ModuleUiDialog">{this.props.contentFactory(contentProps, this.contentRef)}</div>;
}
}