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:
parent
3a647229ad
commit
5c43054bfe
7 changed files with 299 additions and 129 deletions
|
@ -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>;
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue