PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Rename ReplyThread to ReplyChain to avoid confusion with m.thread

Browse source
This commit is contained in:
Germain Souquet 2021-10-15 17:42:44 +01:00
parent 4fb0d021ae
commit 5a7c0d87b6
15 changed files with 77 additions and 77 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
res/css/_components.scss
View file

@ -148,7 +148,7 @@
@import "./views/elements/_PowerSelector.scss";
@import "./views/elements/_ProgressBar.scss";
@import "./views/elements/_QRCode.scss";
@import "./views/elements/_ReplyThread.scss";
@import "./views/elements/_ReplyChain.scss";
@import "./views/elements/_ResizeHandle.scss";
@import "./views/elements/_RichText.scss";
@import "./views/elements/_RoleButton.scss";

22
res/css/views/elements/_ReplyThread.scss → res/css/views/elements/_ReplyChain.scss
View file

@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_ReplyThread {
.mx_ReplyChain {
margin-top: 0;
margin-left: 0;
margin-right: 0;
@ -23,44 +23,44 @@ limitations under the License.
border-left: 2px solid $button-bg-color;
border-radius: 2px;
.mx_ReplyThread_show {
.mx_ReplyChain_show {
cursor: pointer;
}
&.mx_ReplyThread_color1 {
&.mx_ReplyChain_color1 {
border-left-color: $username-variant1-color;
}
&.mx_ReplyThread_color2 {
&.mx_ReplyChain_color2 {
border-left-color: $username-variant2-color;
}
&.mx_ReplyThread_color3 {
&.mx_ReplyChain_color3 {
border-left-color: $username-variant3-color;
}
&.mx_ReplyThread_color4 {
&.mx_ReplyChain_color4 {
border-left-color: $username-variant4-color;
}
&.mx_ReplyThread_color5 {
&.mx_ReplyChain_color5 {
border-left-color: $username-variant5-color;
}
&.mx_ReplyThread_color6 {
&.mx_ReplyChain_color6 {
border-left-color: $username-variant6-color;
}
&.mx_ReplyThread_color7 {
&.mx_ReplyChain_color7 {
border-left-color: $username-variant7-color;
}
&.mx_ReplyThread_color8 {
&.mx_ReplyChain_color8 {
border-left-color: $username-variant8-color;
}
}
.mx_ReplyThread--expanded {
.mx_ReplyChain--expanded {
.mx_EventTile_body {
display: block;
overflow-y: scroll !important;

6
res/css/views/rooms/_EventBubbleTile.scss
View file

@ -192,11 +192,11 @@ limitations under the License.
flex-direction: column;
}
.mx_ReplyThread_show {
.mx_ReplyChain_show {
order: 99999;
}
.mx_ReplyThread {
.mx_ReplyChain {
.mx_EventTile_reply {
max-width: 90%;
padding: 0;
@ -247,7 +247,7 @@ limitations under the License.
.mx_EventTile_keyRequestInfo {
grid-area: link;
}
.mx_ReplyThread_wrapper {
.mx_ReplyChain_wrapper {
grid-area: reply;
}
}

2
res/css/views/rooms/_IRCLayout.scss
View file

@ -200,7 +200,7 @@ $irc-line-height: $font-18px;
}
}
.mx_ReplyThread {
.mx_ReplyChain {
margin: 0;
.mx_SenderProfile {
order: unset;

6
src/HtmlUtils.tsx
View file

@ -34,7 +34,7 @@ import linkifyMatrix from './linkify-matrix';
import SettingsStore from './settings/SettingsStore';
import { tryTransformPermalinkToLocalHref } from "./utils/permalinks/Permalinks";
import { getEmojiFromUnicode } from "./emoji";
import ReplyThread from "./components/views/elements/ReplyThread";
import ReplyChain from "./components/views/elements/ReplyChain";
import { mediaFromMxc } from "./customisations/Media";
linkifyMatrix(linkify);
@ -446,8 +446,8 @@ export function bodyToHtml(content: IContent, highlights: string[], opts: IOpts
let formattedBody = typeof content.formatted_body === 'string' ? content.formatted_body : null;
const plainBody = typeof content.body === 'string' ? content.body : "";
if (opts.stripReplyFallback && formattedBody) formattedBody = ReplyThread.stripHTMLReply(formattedBody);
strippedBody = opts.stripReplyFallback ? ReplyThread.stripPlainReply(plainBody) : plainBody;
if (opts.stripReplyFallback && formattedBody) formattedBody = ReplyChain.stripHTMLReply(formattedBody);
strippedBody = opts.stripReplyFallback ? ReplyChain.stripPlainReply(plainBody) : plainBody;
bodyHasEmoji = mightContainEmoji(isHtmlMessage ? formattedBody : plainBody);

16
src/components/views/context_menus/MessageContextMenu.tsx
View file

@ -60,7 +60,7 @@ interface IProps extends IPosition {
eventTileOps?: IEventTileOps;
permalinkCreator?: RoomPermalinkCreator;
/* an optional function to be called when the user clicks collapse thread, if not provided hide button */
collapseReplyThread?(): void;
collapseReplyChain?(): void;
/* callback called when the menu is dismissed */
onFinished(): void;
/* if the menu is inside a dialog, we sometimes need to close that dialog after click (forwarding) */
@ -203,8 +203,8 @@ export default class MessageContextMenu extends React.Component<IProps, IState>
this.closeMenu();
};
private onCollapseReplyThreadClick = (): void => {
this.props.collapseReplyThread();
private onCollapseReplyChainClick = (): void => {
this.props.collapseReplyChain();
this.closeMenu();
};
@ -240,7 +240,7 @@ export default class MessageContextMenu extends React.Component<IProps, IState>
let unhidePreviewButton: JSX.Element;
let externalURLButton: JSX.Element;
let quoteButton: JSX.Element;
let collapseReplyThread: JSX.Element;
let collapseReplyChain: JSX.Element;
let redactItemList: JSX.Element;
// status is SENT before remote-echo, null after
@ -360,12 +360,12 @@ export default class MessageContextMenu extends React.Component<IProps, IState>
);
}
if (this.props.collapseReplyThread) {
collapseReplyThread = (
if (this.props.collapseReplyChain) {
collapseReplyChain = (
<IconizedContextMenuOption
iconClassName="mx_MessageContextMenu_iconCollapse"
label={_t("Collapse reply thread")}
onClick={this.onCollapseReplyThreadClick}
onClick={this.onCollapseReplyChainClick}
/>
);
}
@ -392,7 +392,7 @@ export default class MessageContextMenu extends React.Component<IProps, IState>
{ unhidePreviewButton }
{ viewSourceButton }
{ resendReactionsButton }
{ collapseReplyThread }
{ collapseReplyChain }
</IconizedContextMenuOptionList>
);

38
src/components/views/elements/ReplyThread.tsx → src/components/views/elements/ReplyChain.tsx
View file

@ -46,7 +46,7 @@ const SHOW_EXPAND_QUOTE_PIXELS = 60;
interface IProps {
// the latest event in this chain of replies
parentEv?: MatrixEvent;
// called when the ReplyThread contents has changed, including EventTiles thereof
// called when the ReplyChain contents has changed, including EventTiles thereof
onHeightChanged: () => void;
permalinkCreator: RoomPermalinkCreator;
// Specifies which layout to use.
@ -72,8 +72,8 @@ interface IState {
// This component does no cycle detection, simply because the only way to make such a cycle would be to
// craft event_id's, using a homeserver that generates predictable event IDs; even then the impact would
// be low as each event being loaded (after the first) is triggered by an explicit user action.
@replaceableComponent("views.elements.ReplyThread")
export default class ReplyThread extends React.Component<IProps, IState> {
@replaceableComponent("views.elements.ReplyChain")
export default class ReplyChain extends React.Component<IProps, IState> {
static contextType = MatrixClientContext;
private unmounted = false;
private room: Room;
@ -253,8 +253,8 @@ export default class ReplyThread extends React.Component<IProps, IState> {
return mixin;
}
public static hasThreadReply(event: MatrixEvent) {
return Boolean(ReplyThread.getParentEventId(event));
public static hasReply(event: MatrixEvent) {
return Boolean(ReplyChain.getParentEventId(event));
}
componentDidMount() {
@ -288,7 +288,7 @@ export default class ReplyThread extends React.Component<IProps, IState> {
private async initialize(): Promise<void> {
const { parentEv } = this.props;
// at time of making this component we checked that props.parentEv has a parentEventId
const ev = await this.getEvent(ReplyThread.getParentEventId(parentEv));
const ev = await this.getEvent(ReplyChain.getParentEventId(parentEv));
if (this.unmounted) return;
@ -306,7 +306,7 @@ export default class ReplyThread extends React.Component<IProps, IState> {
private async getNextEvent(ev: MatrixEvent): Promise<MatrixEvent> {
try {
const inReplyToEventId = ReplyThread.getParentEventId(ev);
const inReplyToEventId = ReplyChain.getParentEventId(ev);
return await this.getEvent(inReplyToEventId);
} catch (e) {
return null;
@ -354,15 +354,15 @@ export default class ReplyThread extends React.Component<IProps, IState> {
dis.fire(Action.FocusSendMessageComposer);
};
private getReplyThreadColorClass(ev: MatrixEvent): string {
return getUserNameColorClass(ev.getSender()).replace("Username", "ReplyThread");
private getReplyChainColorClass(ev: MatrixEvent): string {
return getUserNameColorClass(ev.getSender()).replace("Username", "ReplyChain");
}
render() {
let header = null;
if (this.state.err) {
header = <blockquote className="mx_ReplyThread mx_ReplyThread_error">
header = <blockquote className="mx_ReplyChain mx_ReplyChain_error">
{
_t('Unable to load event that was replied to, ' +
'it either does not exist or you do not have permission to view it.')
@ -371,10 +371,10 @@ export default class ReplyThread extends React.Component<IProps, IState> {
} else if (this.state.loadedEv) {
const ev = this.state.loadedEv;
const room = this.context.getRoom(ev.getRoomId());
header = <blockquote className={`mx_ReplyThread ${this.getReplyThreadColorClass(ev)}`}>
header = <blockquote className={`mx_ReplyChain ${this.getReplyChainColorClass(ev)}`}>
{
_t('<a>In reply to</a> <pill>', {}, {
'a': (sub) => <a onClick={this.onQuoteClick} className="mx_ReplyThread_show">{ sub }</a>,
'a': (sub) => <a onClick={this.onQuoteClick} className="mx_ReplyChain_show">{ sub }</a>,
'pill': (
<Pill
type={Pill.TYPE_USER_MENTION}
@ -387,8 +387,8 @@ export default class ReplyThread extends React.Component<IProps, IState> {
}
</blockquote>;
} else if (this.props.forExport) {
const eventId = ReplyThread.getParentEventId(this.props.parentEv);
header = <p className="mx_ReplyThread_Export">
const eventId = ReplyChain.getParentEventId(this.props.parentEv);
header = <p className="mx_ReplyChain_Export">
{ _t("In reply to <a>this message</a>",
{},
{ a: (sub) => (
@ -404,12 +404,12 @@ export default class ReplyThread extends React.Component<IProps, IState> {
const { isQuoteExpanded } = this.props;
const evTiles = this.state.events.map((ev) => {
const classname = classNames({
'mx_ReplyThread': true,
[this.getReplyThreadColorClass(ev)]: true,
'mx_ReplyChain': true,
[this.getReplyChainColorClass(ev)]: true,
// We don't want to add the class if it's undefined, it should only be expanded/collapsed when it's true/false
'mx_ReplyThread--expanded': isQuoteExpanded === true,
'mx_ReplyChain--expanded': isQuoteExpanded === true,
// We don't want to add the class if it's undefined, it should only be expanded/collapsed when it's true/false
'mx_ReplyThread--collapsed': isQuoteExpanded === false,
'mx_ReplyChain--collapsed': isQuoteExpanded === false,
});
return (
<blockquote ref={this.blockquoteRef} className={classname} key={ev.getId()}>
@ -423,7 +423,7 @@ export default class ReplyThread extends React.Component<IProps, IState> {
);
});
return <div className="mx_ReplyThread_wrapper">
return <div className="mx_ReplyChain_wrapper">
<div>{ header }</div>
<div>{ evTiles }</div>
</div>;

16
src/components/views/messages/MessageActionBar.tsx
View file

@ -41,19 +41,19 @@ import classNames from 'classnames';
import SettingsStore from '../../../settings/SettingsStore';
import { RoomPermalinkCreator } from '../../../utils/permalinks/Permalinks';
import ReplyThread from '../elements/ReplyThread';
import ReplyChain from '../elements/ReplyChain';
interface IOptionsButtonProps {
mxEvent: MatrixEvent;
// TODO: Types
getTile: () => any | null;
getReplyThread: () => ReplyThread;
getReplyChain: () => ReplyChain;
permalinkCreator: RoomPermalinkCreator;
onFocusChange: (menuDisplayed: boolean) => void;
}
const OptionsButton: React.FC<IOptionsButtonProps> =
({ mxEvent, getTile, getReplyThread, permalinkCreator, onFocusChange }) => {
({ mxEvent, getTile, getReplyChain, permalinkCreator, onFocusChange }) => {
const [menuDisplayed, button, openMenu, closeMenu] = useContextMenu();
const [onFocus, isActive, ref] = useRovingTabIndex(button);
useEffect(() => {
@ -63,7 +63,7 @@ const OptionsButton: React.FC<IOptionsButtonProps> =
let contextMenu;
if (menuDisplayed) {
const tile = getTile && getTile();
const replyThread = getReplyThread && getReplyThread();
const replyThread = getReplyChain && getReplyChain();
const buttonRect = button.current.getBoundingClientRect();
contextMenu = <MessageContextMenu
@ -71,7 +71,7 @@ const OptionsButton: React.FC<IOptionsButtonProps> =
mxEvent={mxEvent}
permalinkCreator={permalinkCreator}
eventTileOps={tile && tile.getEventTileOps ? tile.getEventTileOps() : undefined}
collapseReplyThread={replyThread && replyThread.canCollapse() ? replyThread.collapse : undefined}
collapseReplyChain={replyThread && replyThread.canCollapse() ? replyThread.collapse : undefined}
onFinished={closeMenu}
/>;
}
@ -133,7 +133,7 @@ interface IMessageActionBarProps {
reactions?: Relations;
// TODO: Types
getTile: () => any | null;
getReplyThread: () => ReplyThread | undefined;
getReplyChain: () => ReplyChain | undefined;
permalinkCreator?: RoomPermalinkCreator;
onFocusChange?: (menuDisplayed: boolean) => void;
toggleThreadExpanded: () => void;
@ -343,7 +343,7 @@ export default class MessageActionBar extends React.PureComponent<IMessageAction
toolbarOpts.push(cancelSendingButton);
}
if (this.props.isQuoteExpanded !== undefined && ReplyThread.hasThreadReply(this.props.mxEvent)) {
if (this.props.isQuoteExpanded !== undefined && ReplyChain.hasReply(this.props.mxEvent)) {
const expandClassName = classNames({
'mx_MessageActionBar_maskButton': true,
'mx_MessageActionBar_expandMessageButton': !this.props.isQuoteExpanded,
@ -360,7 +360,7 @@ export default class MessageActionBar extends React.PureComponent<IMessageAction
// The menu button should be last, so dump it there.
toolbarOpts.push(<OptionsButton
mxEvent={this.props.mxEvent}
getReplyThread={this.props.getReplyThread}
getReplyChain={this.props.getReplyChain}
getTile={this.props.getTile}
permalinkCreator={this.props.permalinkCreator}
onFocusChange={this.onFocusChange}

4
src/components/views/messages/TextualBody.tsx
View file

@ -27,7 +27,7 @@ import { _t } from '../../../languageHandler';
import * as ContextMenu from '../../structures/ContextMenu';
import { toRightOf } from '../../structures/ContextMenu';
import SettingsStore from "../../../settings/SettingsStore";
import ReplyThread from "../elements/ReplyThread";
import ReplyChain from "../elements/ReplyChain";
import { pillifyLinks, unmountPills } from '../../../utils/pillify';
import { IntegrationManagers } from "../../../integrations/IntegrationManagers";
import { isPermalinkHost } from "../../../utils/permalinks/Permalinks";
@ -479,7 +479,7 @@ export default class TextualBody extends React.Component<IBodyProps, IState> {
const content = mxEvent.getContent();
// only strip reply if this is the original replying event, edits thereafter do not have the fallback
const stripReply = !mxEvent.replacingEvent() && !!ReplyThread.getParentEventId(mxEvent);
const stripReply = !mxEvent.replacingEvent() && !!ReplyChain.getParentEventId(mxEvent);
let body = HtmlUtils.bodyToHtml(content, this.props.highlights, {
disableBigEmoji: content.msgtype === MsgType.Emote
|| !SettingsStore.getValue<boolean>('TextualBody.enableBigEmoji'),

12
src/components/views/rooms/EventTile.tsx
View file

@ -23,7 +23,7 @@ import { Relations } from "matrix-js-sdk/src/models/relations";
import { RoomMember } from "matrix-js-sdk/src/models/room-member";
import { Thread, ThreadEvent } from 'matrix-js-sdk/src/models/thread';
import ReplyThread from "../elements/ReplyThread";
import ReplyChain from "../elements/ReplyChain";
import { _t } from '../../../languageHandler';
import { hasText } from "../../../TextForEvent";
import * as sdk from "../../../index";
@ -337,7 +337,7 @@ export default class EventTile extends React.Component<IProps, IState> {
private isListeningForReceipts: boolean;
// TODO: Types
private tile = React.createRef<unknown>();
private replyThread = React.createRef<ReplyThread>();
private replyThread = React.createRef<ReplyChain>();
public readonly ref = createRef<HTMLElement>();
@ -931,7 +931,7 @@ export default class EventTile extends React.Component<IProps, IState> {
// TODO: Types
getTile: () => any | null = () => this.tile.current;
getReplyThread = () => this.replyThread.current;
getReplyChain = () => this.replyThread.current;
getReactions = () => {
if (
@ -1100,7 +1100,7 @@ export default class EventTile extends React.Component<IProps, IState> {
reactions={this.state.reactions}
permalinkCreator={this.props.permalinkCreator}
getTile={this.getTile}
getReplyThread={this.getReplyThread}
getReplyChain={this.getReplyChain}
onFocusChange={this.onActionBarFocusChange}
isQuoteExpanded={isQuoteExpanded}
toggleThreadExpanded={() => this.setQuoteExpanded(!isQuoteExpanded)}
@ -1281,8 +1281,8 @@ export default class EventTile extends React.Component<IProps, IState> {
default: {
const thread = haveTileForEvent(this.props.mxEvent) &&
ReplyThread.hasThreadReply(this.props.mxEvent) ? (
<ReplyThread
ReplyChain.hasReply(this.props.mxEvent) ? (
<ReplyChain
parentEv={this.props.mxEvent}
onHeightChanged={this.props.onHeightChanged}
ref={this.replyThread}

6
src/components/views/rooms/SendMessageComposer.tsx
View file

@ -34,7 +34,7 @@ import {
} from '../../../editor/serialize';
import BasicMessageComposer, { REGEX_EMOTICON } from "./BasicMessageComposer";
import { CommandPartCreator, Part, PartCreator, SerializedPart, Type } from '../../../editor/parts';
import ReplyThread from "../elements/ReplyThread";
import ReplyChain from "../elements/ReplyChain";
import { findEditableEvent } from '../../../utils/EventUtils';
import SendHistoryManager from "../../../SendHistoryManager";
import { Command, CommandCategories, getCommand } from '../../../SlashCommands';
@ -64,12 +64,12 @@ function addReplyToMessageContent(
permalinkCreator: RoomPermalinkCreator,
relation?: IEventRelation,
): void {
const replyContent = ReplyThread.makeReplyMixIn(replyToEvent);
const replyContent = ReplyChain.makeReplyMixIn(replyToEvent);
Object.assign(content, replyContent);
// Part of Replies fallback support - prepend the text we're sending
// with the text we're replying to
const nestedReply = ReplyThread.getNestedReplyText(replyToEvent, permalinkCreator);
const nestedReply = ReplyChain.getNestedReplyText(replyToEvent, permalinkCreator);
if (nestedReply) {
if (content.formatted_body) {
content.formatted_body = nestedReply.html + content.formatted_body;

6
src/stores/room-list/previews/MessageEventPreview.ts
View file

@ -19,7 +19,7 @@ import { TagID } from "../models";
import { MatrixEvent } from "matrix-js-sdk/src/models/event";
import { _t, sanitizeForTranslation } from "../../../languageHandler";
import { getSenderName, isSelf, shouldPrefixMessagesIn } from "./utils";
import ReplyThread from "../../../components/views/elements/ReplyThread";
import ReplyChain from "../../../components/views/elements/ReplyChain";
import { getHtmlText } from "../../../HtmlUtils";
export class MessageEventPreview implements IPreview {
@ -47,9 +47,9 @@ export class MessageEventPreview implements IPreview {
if (mRelatesTo && mRelatesTo['m.in_reply_to']) {
// If this is a reply, get the real reply and use that
if (hasHtml) {
body = (ReplyThread.stripHTMLReply(body) || '').trim();
body = (ReplyChain.stripHTMLReply(body) || '').trim();
} else {
body = (ReplyThread.stripPlainReply(body) || '').trim();
body = (ReplyChain.stripPlainReply(body) || '').trim();
}
if (!body) return null; // invalid event, no preview
}

2
src/utils/exportUtils/exportCustomCSS.css
View file

@ -119,7 +119,7 @@ a.mx_reply_anchor:hover {
}
}
.mx_ReplyThread_Export {
.mx_ReplyChain_Export {
margin-top: 0px;
margin-bottom: 5px;
}

2
test/components/views/dialogs/ForwardDialog-test.js
View file

@ -142,7 +142,7 @@ describe("ForwardDialog", () => {
});
const wrapper = await mountForwardDialog(replyMessage);
expect(wrapper.find("ReplyThread")).toBeTruthy();
expect(wrapper.find("ReplyChain")).toBeTruthy();
});
it("disables buttons for rooms without send permissions", async () => {

14
test/components/views/elements/ReplyThread-test.js → test/components/views/elements/ReplyChain-test.js
View file

@ -1,8 +1,8 @@
import "../../../skinned-sdk";
import * as testUtils from '../../../test-utils';
import ReplyThread from '../../../../src/components/views/elements/ReplyThread';
import ReplyChain from '../../../../src/components/views/elements/ReplyChain';
describe("ReplyThread", () => {
describe("ReplyChain", () => {
describe('getParentEventId', () => {
it('retrieves relation reply from unedited event', () => {
const originalEventWithRelation = testUtils.mkEvent({
@ -21,7 +21,7 @@ describe("ReplyThread", () => {
room: "room_id",
});
expect(ReplyThread.getParentEventId(originalEventWithRelation))
expect(ReplyChain.getParentEventId(originalEventWithRelation))
.toStrictEqual('$qkjmFBTEc0VvfVyzq1CJuh1QZi_xDIgNEFjZ4Pq34og');
});
@ -65,7 +65,7 @@ describe("ReplyThread", () => {
originalEventWithRelation.makeReplaced(editEvent);
// The relation should be pulled from the original event
expect(ReplyThread.getParentEventId(originalEventWithRelation))
expect(ReplyChain.getParentEventId(originalEventWithRelation))
.toStrictEqual('$qkjmFBTEc0VvfVyzq1CJuh1QZi_xDIgNEFjZ4Pq34og');
});
@ -109,7 +109,7 @@ describe("ReplyThread", () => {
originalEvent.makeReplaced(editEvent);
// The relation should be pulled from the edit event
expect(ReplyThread.getParentEventId(originalEvent))
expect(ReplyChain.getParentEventId(originalEvent))
.toStrictEqual('$qkjmFBTEc0VvfVyzq1CJuh1QZi_xDIgNEFjZ4Pq34og');
});
@ -158,7 +158,7 @@ describe("ReplyThread", () => {
originalEventWithRelation.makeReplaced(editEvent);
// The relation should be pulled from the edit event
expect(ReplyThread.getParentEventId(originalEventWithRelation)).toStrictEqual('$999');
expect(ReplyChain.getParentEventId(originalEventWithRelation)).toStrictEqual('$999');
});
it('able to clear relation reply from original event by providing empty relation field', () => {
@ -203,7 +203,7 @@ describe("ReplyThread", () => {
originalEventWithRelation.makeReplaced(editEvent);
// The relation should be pulled from the edit event
expect(ReplyThread.getParentEventId(originalEventWithRelation)).toStrictEqual(undefined);
expect(ReplyChain.getParentEventId(originalEventWithRelation)).toStrictEqual(undefined);
});
});
});