imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Settings toggle to disable Composer Markdown (#8358)

Browse source
This commit is contained in:
Janne Mareike Koschinski 2022-04-19 15:53:59 +02:00 • committed by GitHub
parent f4d935d88d
commit bca9caa98e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
12 changed files with 260 additions and 98 deletions
Download patch file Download diff file Expand all files Collapse all files

20
src/components/views/rooms/BasicMessageComposer.tsx
View file

@ -103,6 +103,7 @@ interface IProps {
}
interface IState {
useMarkdown: boolean;
showPillAvatar: boolean;
query?: string;
showVisualBell?: boolean;
@ -124,6 +125,7 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
private lastCaret: DocumentOffset;
private lastSelection: ReturnType<typeof cloneSelection>;
private readonly useMarkdownHandle: string;
private readonly emoticonSettingHandle: string;
private readonly shouldShowPillAvatarSettingHandle: string;
private readonly surroundWithHandle: string;
@ -133,10 +135,13 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
super(props);
this.state = {
showPillAvatar: SettingsStore.getValue("Pill.shouldShowPillAvatar"),
useMarkdown: SettingsStore.getValue("MessageComposerInput.useMarkdown"),
surroundWith: SettingsStore.getValue("MessageComposerInput.surroundWith"),
showVisualBell: false,
};
this.useMarkdownHandle = SettingsStore.watchSetting('MessageComposerInput.useMarkdown', null,
this.configureUseMarkdown);
this.emoticonSettingHandle = SettingsStore.watchSetting('MessageComposerInput.autoReplaceEmoji', null,
this.configureEmoticonAutoReplace);
this.configureEmoticonAutoReplace();
@ -442,7 +447,7 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
}
} else if (!selection.isCollapsed && !isEmpty) {
this.hasTextSelected = true;
if (this.formatBarRef.current) {
if (this.formatBarRef.current && this.state.useMarkdown) {
const selectionRect = selection.getRangeAt(0).getBoundingClientRect();
this.formatBarRef.current.showAt(selectionRect);
}
@ -630,6 +635,14 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
this.setState({ completionIndex });
};
private configureUseMarkdown = (): void => {
const useMarkdown = SettingsStore.getValue("MessageComposerInput.useMarkdown");
this.setState({ useMarkdown });
if (!useMarkdown && this.formatBarRef.current) {
this.formatBarRef.current.hide();
}
};
private configureEmoticonAutoReplace = (): void => {
this.props.model.setTransformCallback(this.transform);
};
@ -654,6 +667,7 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
this.editorRef.current.removeEventListener("input", this.onInput, true);
this.editorRef.current.removeEventListener("compositionstart", this.onCompositionStart, true);
this.editorRef.current.removeEventListener("compositionend", this.onCompositionEnd, true);
SettingsStore.unwatchSetting(this.useMarkdownHandle);
SettingsStore.unwatchSetting(this.emoticonSettingHandle);
SettingsStore.unwatchSetting(this.shouldShowPillAvatarSettingHandle);
SettingsStore.unwatchSetting(this.surroundWithHandle);
@ -694,6 +708,10 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
}
public onFormatAction = (action: Formatting): void => {
if (!this.state.useMarkdown) {
return;
}
const range: Range = getRangeForSelection(this.editorRef.current, this.props.model, document.getSelection());
this.historyManager.ensureLastChangesPushed(this.props.model);

9
src/components/views/rooms/EditMessageComposer.tsx
View file

@ -95,7 +95,10 @@ function createEditContent(
body: `${plainPrefix} * ${body}`,
};
const formattedBody = htmlSerializeIfNeeded(model, { forceHTML: isReply });
const formattedBody = htmlSerializeIfNeeded(model, {
forceHTML: isReply,
useMarkdown: SettingsStore.getValue("MessageComposerInput.useMarkdown"),
});
if (formattedBody) {
newContent.format = "org.matrix.custom.html";
newContent.formatted_body = formattedBody;
@ -404,7 +407,9 @@ class EditMessageComposer extends React.Component<IEditMessageComposerProps, ISt
} else {
// otherwise, either restore serialized parts from localStorage or parse the body of the event
const restoredParts = this.restoreStoredEditorState(partCreator);
parts = restoredParts || parseEvent(editState.getEvent(), partCreator);
parts = restoredParts || parseEvent(editState.getEvent(), partCreator, {
shouldEscape: SettingsStore.getValue("MessageComposerInput.useMarkdown"),
});
isRestored = !!restoredParts;
}
this.model = new EditorModel(parts, partCreator);

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

@ -91,7 +91,10 @@ export function createMessageContent(
msgtype: isEmote ? "m.emote" : "m.text",
body: body,
};
const formattedBody = htmlSerializeIfNeeded(model, { forceHTML: !!replyToEvent });
const formattedBody = htmlSerializeIfNeeded(model, {
forceHTML: !!replyToEvent,
useMarkdown: SettingsStore.getValue("MessageComposerInput.useMarkdown"),
});
if (formattedBody) {
content.format = "org.matrix.custom.html";
content.formatted_body = formattedBody;

1
src/components/views/settings/tabs/user/PreferencesUserSettingsTab.tsx
View file

@ -63,6 +63,7 @@ export default class PreferencesUserSettingsTab extends React.Component<IProps,
static COMPOSER_SETTINGS = [
'MessageComposerInput.autoReplaceEmoji',
'MessageComposerInput.useMarkdown',
'MessageComposerInput.suggestEmoji',
'sendTypingNotifications',
'MessageComposerInput.ctrlEnterToSend',