1
0
mirror of https://github.com/lencx/ChatGPT.git synced 2024-10-01 01:06:13 -04:00

fix: slash command does not work (#207)

This commit is contained in:
lencx 2023-01-15 16:14:37 +08:00
parent 6d950c09e6
commit f0c635bd3b
7 changed files with 184 additions and 166 deletions

View File

@ -1,5 +1,9 @@
# UPDATE LOG # UPDATE LOG
## v0.9.1
fix: slash command does not work
## v0.9.0 ## v0.9.0
fix: fix:

View File

@ -87,185 +87,198 @@ $(function() {
clearInterval(window.formInterval); clearInterval(window.formInterval);
} }
window.formInterval = setInterval(() => { window.formInterval = setInterval(() => {
const form = document.querySelector("form"); const form = document.querySelector("form textarea");
if (!form) return; if (!form) return;
clearInterval(window.formInterval); clearInterval(window.formInterval);
cmdTip(); cmdTip();
}, 200); new MutationObserver(function (mutationsList) {
for (const mutation of mutationsList) {
if (mutation.target.getAttribute('id') === '__next') {
cmdTip();
}
if (mutation.target.getAttribute('class') === 'chat-model-cmd-list') {
// The `chatgpt prompt` fill can be done by clicking on the event.
const searchDom = document.querySelector("form .chat-model-cmd-list>div");
const searchInput = document.querySelector('form textarea');
if (!searchDom) return;
searchDom.addEventListener('click', (event) => {
const item = event.target.closest("div");
if (item) {
const val = decodeURIComponent(item.getAttribute('data-prompt'));
searchInput.value = val;
document.querySelector('form textarea').focus();
initDom();
}
});
}
}
}).observe(document.body, {
childList: true,
subtree: true,
});
}, 300);
}); });
async function cmdTip() { async function cmdTip() {
initDom();
const chatModelJson = await invoke('get_chat_model_cmd') || {}; const chatModelJson = await invoke('get_chat_model_cmd') || {};
const data = chatModelJson.data; const data = chatModelJson.data;
if (data.length <= 0) return; if (data.length <= 0) return;
const modelDom = document.createElement('div'); let modelDom = document.querySelector('.chat-model-cmd-list');
modelDom.classList.add('chat-model-cmd-list'); if (!modelDom) {
const dom = document.createElement('div');
dom.classList.add('chat-model-cmd-list');
document.querySelector('form').appendChild(dom);
modelDom = document.querySelector('.chat-model-cmd-list');
// fix: tray window // fix: tray window
if (__TAURI_METADATA__.__currentWindow.label === 'tray') { if (__TAURI_METADATA__.__currentWindow.label === 'tray') {
modelDom.style.bottom = '54px'; modelDom.style.bottom = '54px';
}
document.querySelector('form').appendChild(modelDom);
const itemDom = (v) => `<div class="cmd-item" title="${v.prompt}" data-cmd="${v.cmd}" data-prompt="${encodeURIComponent(v.prompt)}"><b title="${v.cmd}">/${v.cmd}</b><i>${v.act}</i></div>`;
const renderList = (v) => {
modelDom.innerHTML = `<div>${v.map(itemDom).join('')}</div>`;
window.__CHAT_MODEL_CMD_PROMPT__ = v[0]?.prompt.trim();
window.__CHAT_MODEL_CMD__ = v[0]?.cmd.trim();
window.__list = modelDom.querySelectorAll('.cmd-item');
window.__index = 0;
window.__list[window.__index].classList.add('selected');
};
const setPrompt = (v = '') => {
if (v.trim()) {
window.__CHAT_MODEL_CMD_PROMPT__ = window.__CHAT_MODEL_CMD_PROMPT__?.replace(/\{([^{}]*)\}/, `{${v.trim()}}`);
}
}
const searchInput = document.querySelector('form textarea');
// Enter a command starting with `/` and press a space to automatically fill `chatgpt prompt`.
// If more than one command appears in the search results, the first one will be used by default.
searchInput.addEventListener('keydown', (event) => {
if (!window.__CHAT_MODEL_CMD_PROMPT__) {
return;
} }
// ------------------ Keyboard scrolling (ArrowUp | ArrowDown) -------------------------- const itemDom = (v) => `<div class="cmd-item" title="${v.prompt}" data-cmd="${v.cmd}" data-prompt="${encodeURIComponent(v.prompt)}"><b title="${v.cmd}">/${v.cmd}</b><i>${v.act}</i></div>`;
if (event.keyCode === 38 && window.__index > 0) { // ArrowUp const renderList = (v) => {
window.__list[window.__index].classList.remove('selected'); initDom();
window.__index = window.__index - 1; modelDom.innerHTML = `<div>${v.map(itemDom).join('')}</div>`;
window.__CHAT_MODEL_CMD_PROMPT__ = v[0]?.prompt.trim();
window.__CHAT_MODEL_CMD__ = v[0]?.cmd.trim();
window.__list = modelDom.querySelectorAll('.cmd-item');
window.__index = 0;
window.__list[window.__index].classList.add('selected'); window.__list[window.__index].classList.add('selected');
window.__CHAT_MODEL_CMD_PROMPT__ = decodeURIComponent(window.__list[window.__index].getAttribute('data-prompt')); };
searchInput.value = `/${window.__list[window.__index].getAttribute('data-cmd')}`; const setPrompt = (v = '') => {
event.preventDefault(); if (v.trim()) {
} window.__CHAT_MODEL_CMD_PROMPT__ = window.__CHAT_MODEL_CMD_PROMPT__?.replace(/\{([^{}]*)\}/, `{${v.trim()}}`);
if (event.keyCode === 40 && window.__index < window.__list.length - 1) { // ArrowDown
window.__list[window.__index].classList.remove('selected');
window.__index = window.__index + 1;
window.__list[window.__index].classList.add('selected');
window.__CHAT_MODEL_CMD_PROMPT__ = decodeURIComponent(window.__list[window.__index].getAttribute('data-prompt'));
searchInput.value = `/${window.__list[window.__index].getAttribute('data-cmd')}`;
event.preventDefault();
}
const containerHeight = modelDom.offsetHeight;
const itemHeight = window.__list[0].offsetHeight + 1;
const itemTop = window.__list[window.__index].offsetTop;
const itemBottom = itemTop + itemHeight;
if (itemTop < modelDom.scrollTop || itemBottom > modelDom.scrollTop + containerHeight) {
modelDom.scrollTop = itemTop;
}
// ------------------ TAB key replaces `{q}` tag content -------------------------------
// feat: https://github.com/lencx/ChatGPT/issues/54
if (event.keyCode === 9 && !window.__CHAT_MODEL_STATUS__) {
const strGroup = window.__CHAT_MODEL_CMD_PROMPT__.match(/\{([^{}]*)\}/) || [];
if (strGroup[1]) {
searchInput.value = `/${window.__CHAT_MODEL_CMD__}` + ` {${strGroup[1]}}` + ' |-> ';
window.__CHAT_MODEL_STATUS__ = 1;
} }
event.preventDefault();
} }
const searchInput = document.querySelector('form textarea');
if (window.__CHAT_MODEL_STATUS__ === 1 && event.keyCode === 9) { // TAB // Enter a command starting with `/` and press a space to automatically fill `chatgpt prompt`.
const data = searchInput.value.split('|->'); // If more than one command appears in the search results, the first one will be used by default.
if (data[1]?.trim()) { function cmdKeydown(event) {
setPrompt(data[1]); if (!window.__CHAT_MODEL_CMD_PROMPT__) {
window.__CHAT_MODEL_STATUS__ = 2; return;
} }
event.preventDefault();
}
// input text // ------------------ Keyboard scrolling (ArrowUp | ArrowDown) --------------------------
if (window.__CHAT_MODEL_STATUS__ === 2 && event.keyCode === 9) { // TAB if (event.keyCode === 38 && window.__index > 0) { // ArrowUp
searchInput.value = window.__CHAT_MODEL_CMD_PROMPT__; window.__list[window.__index].classList.remove('selected');
modelDom.innerHTML = ''; window.__index = window.__index - 1;
delete window.__CHAT_MODEL_STATUS__; window.__list[window.__index].classList.add('selected');
event.preventDefault(); window.__CHAT_MODEL_CMD_PROMPT__ = decodeURIComponent(window.__list[window.__index].getAttribute('data-prompt'));
} searchInput.value = `/${window.__list[window.__index].getAttribute('data-cmd')}`;
event.preventDefault();
}
// ------------------ type in a space to complete the fill ------------------------------------ if (event.keyCode === 40 && window.__index < window.__list.length - 1) { // ArrowDown
if (event.keyCode === 32) { window.__list[window.__index].classList.remove('selected');
searchInput.value = window.__CHAT_MODEL_CMD_PROMPT__; window.__index = window.__index + 1;
modelDom.innerHTML = ''; window.__list[window.__index].classList.add('selected');
delete window.__CHAT_MODEL_CMD_PROMPT__; window.__CHAT_MODEL_CMD_PROMPT__ = decodeURIComponent(window.__list[window.__index].getAttribute('data-prompt'));
} searchInput.value = `/${window.__list[window.__index].getAttribute('data-cmd')}`;
event.preventDefault();
}
// ------------------ send -------------------------------------------------------------------- const containerHeight = modelDom.offsetHeight;
if (event.keyCode === 13 && window.__CHAT_MODEL_CMD_PROMPT__) { // Enter const itemHeight = window.__list[0].offsetHeight + 1;
const data = searchInput.value.split('|->');
setPrompt(data[1]);
searchInput.value = window.__CHAT_MODEL_CMD_PROMPT__; const itemTop = window.__list[window.__index].offsetTop;
modelDom.innerHTML = ''; const itemBottom = itemTop + itemHeight;
delete window.__CHAT_MODEL_CMD_PROMPT__; if (itemTop < modelDom.scrollTop || itemBottom > modelDom.scrollTop + containerHeight) {
delete window.__CHAT_MODEL_CMD__; modelDom.scrollTop = itemTop;
delete window.__CHAT_MODEL_STATUS__; }
event.preventDefault();
}
});
searchInput.addEventListener('input', () => { // ------------------ TAB key replaces `{q}` tag content -------------------------------
if (searchInput.value === '') { // feat: https://github.com/lencx/ChatGPT/issues/54
delete window.__CHAT_MODEL_CMD_PROMPT__; if (event.keyCode === 9 && !window.__CHAT_MODEL_STATUS__) {
delete window.__CHAT_MODEL_CMD__; const strGroup = window.__CHAT_MODEL_CMD_PROMPT__.match(/\{([^{}]*)\}/) || [];
delete window.__CHAT_MODEL_STATUS__;
}
if (window.__CHAT_MODEL_STATUS__) return; if (strGroup[1]) {
searchInput.value = `/${window.__CHAT_MODEL_CMD__}` + ` {${strGroup[1]}}` + ' |-> ';
window.__CHAT_MODEL_STATUS__ = 1;
} else {
searchInput.value = window.__CHAT_MODEL_CMD_PROMPT__;
initDom();
}
event.preventDefault();
}
const query = searchInput.value; if (window.__CHAT_MODEL_STATUS__ === 1 && event.keyCode === 9) { // TAB
if (!query || !/^\//.test(query)) { const data = searchInput.value.split('|->');
modelDom.innerHTML = ''; if (data[1]?.trim()) {
return; setPrompt(data[1]);
} window.__CHAT_MODEL_STATUS__ = 2;
}
event.preventDefault();
}
// all cmd result // input text
if (query === '/') { if (window.__CHAT_MODEL_STATUS__ === 2 && event.keyCode === 9) { // TAB
renderList(data); searchInput.value = window.__CHAT_MODEL_CMD_PROMPT__;
return;
}
const result = data.filter(i => new RegExp(query.substring(1)).test(i.cmd));
if (result.length > 0) {
renderList(result);
} else {
modelDom.innerHTML = '';
delete window.__CHAT_MODEL_CMD_PROMPT__;
delete window.__CHAT_MODEL_CMD__;
delete window.__CHAT_MODEL_STATUS__;
}
}, {
capture: false,
passive: true,
once: false
});
if (window.searchInterval) {
clearInterval(window.searchInterval);
}
window.searchInterval = setInterval(() => {
// The `chatgpt prompt` fill can be done by clicking on the event.
const searchDom = document.querySelector("form .chat-model-cmd-list>div");
if (!searchDom) return;
searchDom.addEventListener('click', (event) => {
// .cmd-item
const item = event.target.closest("div");
if (item) {
const val = decodeURIComponent(item.getAttribute('data-prompt'));
searchInput.value = val;
document.querySelector('form textarea').focus();
window.__CHAT_MODEL_CMD_PROMPT__ = val;
modelDom.innerHTML = ''; modelDom.innerHTML = '';
delete window.__CHAT_MODEL_STATUS__;
event.preventDefault();
} }
}, {
capture: false, // ------------------ type in a space to complete the fill ------------------------------------
passive: true, if (event.keyCode === 32) {
once: false searchInput.value = window.__CHAT_MODEL_CMD_PROMPT__;
}); modelDom.innerHTML = '';
}, 200); delete window.__CHAT_MODEL_CMD_PROMPT__;
}
// ------------------ send --------------------------------------------------------------------
if (event.keyCode === 13 && window.__CHAT_MODEL_CMD_PROMPT__) { // Enter
const data = searchInput.value.split('|->');
setPrompt(data[1]);
searchInput.value = window.__CHAT_MODEL_CMD_PROMPT__;
initDom();
event.preventDefault();
}
}
searchInput.removeEventListener('keydown', cmdKeydown);
searchInput.addEventListener('keydown', cmdKeydown);
function cmdInput() {
if (searchInput.value === '') {
initDom();
}
if (window.__CHAT_MODEL_STATUS__) return;
const query = searchInput.value;
if (!query || !/^\//.test(query)) {
initDom();
return;
}
// all cmd result
if (query === '/') {
renderList(data);
return;
}
const result = data.filter(i => new RegExp(query.substring(1)).test(i.cmd));
if (result.length > 0) {
renderList(result);
} else {
initDom();
}
}
searchInput.removeEventListener('input', cmdInput);
searchInput.addEventListener('input', cmdInput);
}
}
function initDom() {
const modelDom = document.querySelector('.chat-model-cmd-list');
if (modelDom) {
modelDom.innerHTML = '';
delete window.__CHAT_MODEL_CMD_PROMPT__;
delete window.__CHAT_MODEL_CMD__;
delete window.__CHAT_MODEL_STATUS__;
}
} }

View File

@ -1,8 +1,7 @@
// *** Core Script - Export *** // *** Core Script - Export ***
const buttonOuterHTMLFallback = `<button class="btn flex justify-center gap-2 btn-neutral" id="download-png-button">Try Again</button>`;
$(async function () { $(async function () {
const buttonOuterHTMLFallback = `<button class="btn flex justify-center gap-2 btn-neutral" id="download-png-button">Try Again</button>`;
if (window.innerWidth < 767) return; if (window.innerWidth < 767) return;
const chatConf = await invoke('get_chat_conf') || {}; const chatConf = await invoke('get_chat_conf') || {};
if (window.buttonsInterval) { if (window.buttonsInterval) {
@ -190,7 +189,7 @@ async function handlePdf(imgData, canvas, pixelRatio) {
} }
function getName() { function getName() {
const id = uid().toString(36); const id = window.crypto.getRandomValues(new Uint32Array(1))[0].toString(36);
const name = document.querySelector('nav .overflow-y-auto a.hover\\:bg-gray-800')?.innerText?.trim() || ''; const name = document.querySelector('nav .overflow-y-auto a.hover\\:bg-gray-800')?.innerText?.trim() || '';
return { filename: name ? name : id, id, pathname: 'chat.download.json' }; return { filename: name ? name : id, id, pathname: 'chat.download.json' };
} }

View File

@ -16,9 +16,9 @@ $(async function () {
background: #4a4a4a; background: #4a4a4a;
color: white; color: white;
font-weight: bold; font-weight: bold;
padding: 5px 8px; padding: 3px 5px;
border-radius: 4px; border-radius: 2px;
font-size: 12px; font-size: 10px;
cursor: pointer; cursor: pointer;
} }
`; `;
@ -31,6 +31,7 @@ $(async function () {
const { computePosition, flip, offset, shift } = window.FloatingUIDOM; const { computePosition, flip, offset, shift } = window.FloatingUIDOM;
document.body.addEventListener('mousedown', async (e) => { document.body.addEventListener('mousedown', async (e) => {
selectionMenu.style.display = 'none';
if (e.target.id === 'chagpt-selection-menu') { if (e.target.id === 'chagpt-selection-menu') {
await invoke('dalle2_window', { query: encodeURIComponent(window.__DALLE2_CONTENT__) }); await invoke('dalle2_window', { query: encodeURIComponent(window.__DALLE2_CONTENT__) });
} else { } else {

View File

@ -53,25 +53,25 @@ interface EditRowProps {
} }
export const EditRow: FC<EditRowProps> = ({ rowKey, row, actions }) => { export const EditRow: FC<EditRowProps> = ({ rowKey, row, actions }) => {
const [isEdit, setEdit] = useState(false); const [isEdit, setEdit] = useState(false);
const [val, setVal] = useState(row[rowKey]); const [val, setVal] = useState(row[rowKey] || '');
const handleEdit = () => { const handleEdit = () => {
setEdit(true); setEdit(true);
}; };
const handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => { const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
setVal(e.target.value) setVal(e.target.value)
}; };
const handleSave = () => { const handleSave = () => {
setEdit(false); setEdit(false);
row[rowKey] = val; row[rowKey] = val?.trim();
actions?.setRecord(row, 'rowedit') actions?.setRecord(row, 'rowedit')
}; };
return isEdit return isEdit
? ( ? (
<Input.TextArea <Input
value={val} value={val}
rows={1} autoFocus
onChange={handleChange} onChange={handleChange}
{...DISABLE_AUTO_COMPLETE} {...DISABLE_AUTO_COMPLETE}
onPressEnter={handleSave} onPressEnter={handleSave}

View File

@ -69,7 +69,6 @@ export default function Download() {
const downloadDir = await path.join(await chatRoot(), 'download'); const downloadDir = await path.join(await chatRoot(), 'download');
await fs.removeDir(downloadDir, { recursive: true }); await fs.removeDir(downloadDir, { recursive: true });
await handleRefresh(); await handleRefresh();
rowReset();
message.success('All files have been cleared!'); message.success('All files have been cleared!');
return; return;
} }
@ -88,6 +87,7 @@ export default function Download() {
const handleRefresh = async () => { const handleRefresh = async () => {
await invoke('download_list', { pathname: CHAT_DOWNLOAD_JSON, dir: 'download' }); await invoke('download_list', { pathname: CHAT_DOWNLOAD_JSON, dir: 'download' });
rowReset();
const data = await refreshJson(); const data = await refreshJson();
opInit(data); opInit(data);
}; };

View File

@ -65,7 +65,6 @@ export default function Notes() {
const notesDir = await path.join(await chatRoot(), 'notes'); const notesDir = await path.join(await chatRoot(), 'notes');
await fs.removeDir(notesDir, { recursive: true }); await fs.removeDir(notesDir, { recursive: true });
await handleRefresh(); await handleRefresh();
rowReset();
message.success('All files have been cleared!'); message.success('All files have been cleared!');
return; return;
} }
@ -83,6 +82,7 @@ export default function Notes() {
const handleRefresh = async () => { const handleRefresh = async () => {
await invoke('download_list', { pathname: CHAT_NOTES_JSON, dir: 'notes' }); await invoke('download_list', { pathname: CHAT_NOTES_JSON, dir: 'notes' });
rowReset();
const data = await refreshJson(); const data = await refreshJson();
opInit(data); opInit(data);
}; };
@ -135,6 +135,7 @@ export default function Notes() {
> >
<ReactMarkdown <ReactMarkdown
children={source} children={source}
linkTarget="_blank"
components={{ components={{
code({node, inline, className, children, ...props}) { code({node, inline, className, children, ...props}) {
const match = /language-(\w+)/.exec(className || '') const match = /language-(\w+)/.exec(className || '')