mirror of
https://github.com/Mintplex-Labs/anything-llm.git
synced 2024-09-28 15:10:10 +02:00
auto highlight slash command on typing (#743)
This commit is contained in:
parent
17c1913ccc
commit
755df4dbba
@ -2,7 +2,6 @@ import { CircleNotch, PaperPlaneRight } from "@phosphor-icons/react";
|
|||||||
import React, { useState, useRef } from "react";
|
import React, { useState, useRef } from "react";
|
||||||
|
|
||||||
export default function PromptInput({
|
export default function PromptInput({
|
||||||
setttings,
|
|
||||||
message,
|
message,
|
||||||
submit,
|
submit,
|
||||||
onChange,
|
onChange,
|
||||||
|
@ -79,7 +79,6 @@ export default function ChatContainer({
|
|||||||
<div className="h-full w-full relative">
|
<div className="h-full w-full relative">
|
||||||
<ChatHistory settings={settings} history={chatHistory} />
|
<ChatHistory settings={settings} history={chatHistory} />
|
||||||
<PromptInput
|
<PromptInput
|
||||||
settings={settings}
|
|
||||||
message={message}
|
message={message}
|
||||||
submit={handleSubmit}
|
submit={handleSubmit}
|
||||||
onChange={handleMessageChange}
|
onChange={handleMessageChange}
|
||||||
|
@ -5,6 +5,7 @@ import SlashCommandsButton, {
|
|||||||
useSlashCommands,
|
useSlashCommands,
|
||||||
} from "./SlashCommands";
|
} from "./SlashCommands";
|
||||||
import { isMobile } from "react-device-detect";
|
import { isMobile } from "react-device-detect";
|
||||||
|
import debounce from "lodash.debounce";
|
||||||
|
|
||||||
export default function PromptInput({
|
export default function PromptInput({
|
||||||
workspace,
|
workspace,
|
||||||
@ -24,6 +25,13 @@ export default function PromptInput({
|
|||||||
submit(e);
|
submit(e);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const checkForSlash = (e) => {
|
||||||
|
const input = e.target.value;
|
||||||
|
if (input === "/") setShowSlashCommand(true);
|
||||||
|
if (showSlashCommand) setShowSlashCommand(false);
|
||||||
|
return;
|
||||||
|
};
|
||||||
|
|
||||||
const captureEnter = (event) => {
|
const captureEnter = (event) => {
|
||||||
if (event.keyCode == 13) {
|
if (event.keyCode == 13) {
|
||||||
if (!event.shiftKey) {
|
if (!event.shiftKey) {
|
||||||
@ -42,6 +50,7 @@ export default function PromptInput({
|
|||||||
: "1px";
|
: "1px";
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const watchForSlash = debounce(checkForSlash, 300);
|
||||||
return (
|
return (
|
||||||
<div className="w-full fixed md:absolute bottom-0 left-0 z-10 md:z-0 flex justify-center items-center">
|
<div className="w-full fixed md:absolute bottom-0 left-0 z-10 md:z-0 flex justify-center items-center">
|
||||||
<SlashCommands
|
<SlashCommands
|
||||||
@ -59,7 +68,10 @@ export default function PromptInput({
|
|||||||
<textarea
|
<textarea
|
||||||
onKeyUp={adjustTextArea}
|
onKeyUp={adjustTextArea}
|
||||||
onKeyDown={captureEnter}
|
onKeyDown={captureEnter}
|
||||||
onChange={onChange}
|
onChange={(e) => {
|
||||||
|
onChange(e);
|
||||||
|
watchForSlash(e);
|
||||||
|
}}
|
||||||
required={true}
|
required={true}
|
||||||
disabled={inputDisabled}
|
disabled={inputDisabled}
|
||||||
onFocus={() => setFocused(true)}
|
onFocus={() => setFocused(true)}
|
||||||
|
Loading…
Reference in New Issue
Block a user