Skip to content

Commit

Permalink
slate chat -- shift+enter to submit; alt+enter to switch to editing m…
Browse files Browse the repository at this point in the history
…arkdown.
  • Loading branch information
williamstein committed Feb 9, 2022
1 parent fc072d2 commit dab3b5a
Show file tree
Hide file tree
Showing 6 changed files with 51 additions and 7 deletions.
12 changes: 12 additions & 0 deletions src/packages/frontend/editors/markdown-input/multimode.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -123,10 +123,22 @@ export default function MultiMarkdownInput({
padding: "5px 15px",
height: height ?? "100%",
}}
saveDebounceMs={0}
actions={{
set_value: (value) => {
onChange?.(value);
},
shiftEnter:
onShiftEnter == null
? undefined
: (value) => {
onChange?.(value);
onShiftEnter();
},
altEnter: (value) => {
onChange?.(value);
setMode("markdown");
},
}}
font_size={fontSize}
autoFocus={autoFocus}
Expand Down
18 changes: 14 additions & 4 deletions src/packages/frontend/editors/slate/editable-markdown.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -119,6 +119,7 @@ interface Props {
onBlur?: () => void;
autoFocus?: boolean;
hideSearch?: boolean;
saveDebounceMs?: number;
}

export const EditableMarkdown: React.FC<Props> = React.memo(
Expand All @@ -141,6 +142,7 @@ export const EditableMarkdown: React.FC<Props> = React.memo(
onBlur,
autoFocus,
hideSearch,
saveDebounceMs,
}) => {
if (disableWindowing == null) {
disableWindowing = !USE_WINDOWING;
Expand Down Expand Up @@ -322,10 +324,18 @@ export const EditableMarkdown: React.FC<Props> = React.memo(
// We don't want to do saveValue too much, since it presumably can be slow,
// especially if the document is large. By debouncing, we only do this when
// the user pauses typing for a moment. Also, this avoids making too many commits.
const saveValueDebounce = useMemo(
() => debounce(() => editor.saveValue(), SAVE_DEBOUNCE_MS),
[]
);
// For tiny documents, user can make this small or even 0 to not dbounce.
const saveValueDebounce =
saveDebounceMs != null && !saveDebounceMs
? () => editor.saveValue()
: useMemo(
() =>
debounce(
() => editor.saveValue(),
saveDebounceMs ?? SAVE_DEBOUNCE_MS
),
[]
);

function onKeyDown(e) {
if (read_only) {
Expand Down
1 change: 1 addition & 0 deletions src/packages/frontend/editors/slate/keyboard/actions.ts
Original file line number Diff line number Diff line change
Expand Up @@ -69,3 +69,4 @@ register(
return true;
}
);

18 changes: 16 additions & 2 deletions src/packages/frontend/editors/slate/keyboard/shift-enter.ts
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,19 @@ import { register } from "./register";
import { hardbreak } from "../elements/break";
import { isWhitespaceParagraph, isWhitespaceText } from "../padding";

register({ key: "Enter", shift: true }, ({ editor }) => {
register({ key: "Enter", shift: true }, ({ editor, extra }) => {
// Configured editor so shift+enter does some action, e.g., "submit chat".
// In this case, we do that instead of the various things below involving
// newlines, which can instead be done with control+enter.
const shiftEnter = extra?.actions?.shiftEnter;
if (shiftEnter != null) {
shiftEnter(editor.getMarkdownValue());
return true;
}
return softBreak({ editor });
});

function softBreak({ editor }) {
// In a table, the only option is to insert a <br/>.
const fragment = editor.getFragment();
if (isElementOfType(fragment?.[0], "table")) {
Expand Down Expand Up @@ -50,4 +62,6 @@ register({ key: "Enter", shift: true }, ({ editor }) => {
Transforms.insertNodes(editor, [hardbreak()]);
Transforms.move(editor, { distance: 1 });
return true;
});
}

register({ key: "Enter", ctrl: true }, softBreak);
7 changes: 6 additions & 1 deletion src/packages/frontend/editors/slate/keyboard/sync.ts
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,12 @@ register(
{ key: "Enter", alt: true },
{ key: "Enter", meta: true },
],
({ editor }) => {
({ editor, extra }) => {
const altEnter = extra?.actions?.altEnter;
if (altEnter != null) {
altEnter(editor.getMarkdownValue());
return true;
}
editor.inverseSearch(true);
return true;
}
Expand Down
2 changes: 2 additions & 0 deletions src/packages/frontend/editors/slate/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -46,4 +46,6 @@ export interface Actions {
change_font_size?: (delta?: number, id?: string, zoom?: number) => void;
undo?: (id: string) => void;
redo?: (id: string) => void;
shiftEnter?: (value: string) => void;
altEnter?: (value: string) => void;
}

0 comments on commit dab3b5a

Please sign in to comment.