How to use the platform/components/ui/overlay.getOverlaySystem function in platform

function showAlignmentRelationDialog(params: {
  sourceNode: Node,
  targetNode: Node,
  onSubmit: (kind: AlignKind) => void;
}) {
  const {sourceNode, targetNode, onSubmit} = params;
  const onDialogClose = () => {
    getOverlaySystem().hide(ConfirmAlignDialog.KEY);
  };
  const onDialogSubmit = (kind: AlignKind) => {
    onDialogClose();
    onSubmit(kind);
  };
  getOverlaySystem().show(
    ConfirmAlignDialog.KEY,
    
  );
}

private onClickDeleteSelected = () => {
    const dialogRef = 'deletion-confirmation';
    const onHide = () => getOverlaySystem().hide(dialogRef);
    const props = {
      message: 'Do you want to delete the selected templates?',
      onHide,
      onConfirm: confirm => {
        onHide();
        if (confirm) {
          this.deleteSelectedPages();
        }
      },
    };

    getOverlaySystem().show(
      dialogRef,
      createElement(ConfirmationDialog, props)
    );
  }

private onRemoveItem(item: Item) {
    const removeItem = () => {
      if (item.linkedBy) {
        this.state.items.forEach(({id, linkedBy}) => {
          if (linkedBy === item.linkedBy) {
            this.removeItem(id);
          }
        });
      } else {
        this.removeItem(item.id);
      }
    };
    if (item.isDirty) {
      const dialogRef = 'removing-confirmation';
      const onHide = () => getOverlaySystem().hide(dialogRef);
      getOverlaySystem().show(
        dialogRef,
         {
            onHide();
            if (confirm) {
              removeItem();
            }
          }}/>
      );
    } else {
      removeItem();
    }
  }

      onHide={() => getOverlaySystem().hide(ACTION_DIALOG_REF)}
    >

    const hideDialog = () => getOverlaySystem().hide(dialogRef);
    getOverlaySystem().show(

onClick: () => {
            const dialogRef = 'create-overlay-image';
            getOverlaySystem().show(
              dialogRef,
              createElement(CreateResourceDialog, {
                onSave: this.createOverlayImage,
                onHide: () => getOverlaySystem().hide(dialogRef),
                show: true,
                title: 'Create overlay image',
                placeholder: 'Enter image title',
              })
            );
          },
        }, 'Create overlayed image')

const onDialogClose = () => {
    getOverlaySystem().hide(ConfirmAlignDialog.KEY);
  };
  const onDialogSubmit = (kind: AlignKind) => {

        onHide: () => getOverlaySystem().hide(dialogRef),
        show: true,

    const onHide = () => getOverlaySystem().hide(dialogRef);
    const props = {

onDeleteRepository = (id: string) => {
    const dialogRef = 'delete-repository-confirmation';
    const hideDialog = () => getOverlaySystem().hide(dialogRef);
    const props = {
      message: `Do you want to delete the "${id}" repository?`,
      onHide: () => {
        hideDialog();
      },
      onConfirm: confirm => {
        hideDialog();
        if (confirm) {
          this.executeDeleteRepository(id);
        } 
      },
    };
    getOverlaySystem().show(
      dialogRef,
      createElement(ConfirmationDialog, props)
    );
  }