fix/simplify arrow/up down logic

This commit is contained in:
Red Adaya 2024-05-09 18:32:51 +08:00
parent bcf6e91f48
commit 7d9f429ee1
3 changed files with 51 additions and 40 deletions

View File

@ -45,12 +45,12 @@ class CodeBlockMarkdown extends React.Component<
@boundMethod
handleClick(e: React.MouseEvent<HTMLPreElement>) {
console.log("this.blockIndex", this.blockIndex);
// console.log("this.blockIndex", this.blockIndex);
GlobalModel.inputModel.setCodeSelectSelectedCodeBlock(this.blockIndex);
}
render() {
console.log("this.blockIndex", this.blockIndex);
// console.log("this.blockIndex", this.blockIndex);
let selected = this.blockIndex == this.props.codeSelectSelectedIndex;
return (
<pre ref={this.blockRef} className={clsx({ selected: selected })} onClick={this.handleClick}>

View File

@ -64,10 +64,10 @@ class ChatContent extends React.Component<{ chatWindowRef }, {}> {
this.chatListKeyCount = 0;
if (this.containerRef?.current && this.osInstance) {
const { viewport } = this.osInstance.elements();
viewport.scrollTo({
behavior: "auto",
top: this.props.chatWindowRef.current.scrollHeight,
});
// viewport.scrollTo({
// behavior: "auto",
// top: this.props.chatWindowRef.current.scrollHeight,
// });
}
}
@ -274,15 +274,18 @@ class AIChat extends React.Component<{}, {}> {
}
onArrowUpPressed(): boolean {
console.log("arrow up pressed==================");
const currentRef = this.textAreaRef.current;
console.log("inputModel.getCodeSelectSelectedIndex()", GlobalModel.inputModel.getCodeSelectSelectedIndex());
if (currentRef == null) {
return false;
}
if (this.getLinePos(currentRef).linePos > 1) {
// normal up arrow
GlobalModel.inputModel.codeSelectDeselectAll();
return false;
}
// if (this.getLinePos(currentRef).linePos > 1) {
// // normal up arrow
// // GlobalModel.inputModel.codeSelectDeselectAll();
// // return false;
// }
GlobalModel.inputModel.codeSelectSelectNextOldestCodeBlock();
return true;
}

View File

@ -32,16 +32,15 @@ class InputModel {
aiChatWindowRef: React.RefObject<HTMLDivElement>;
chatOsInstance: OverlayScrollbars;
codeSelectBlockRefArray: Array<React.RefObject<HTMLElement>>;
codeSelectSelectedIndex: OV<number> = mobx.observable.box(-1);
codeSelectSelectedIndex: OV<number> = mobx.observable.box(null, {
name: "codeSelectSelectedIndex",
});
codeSelectUuid: string;
inputPopUpType: OV<string> = mobx.observable.box("none");
AICmdInfoChatItems: mobx.IObservableArray<OpenAICmdInfoChatMessageType> = mobx.observable.array([], {
name: "aicmdinfo-chat",
});
readonly codeSelectTop: number = -2;
readonly codeSelectBottom: number = -1;
historyType: mobx.IObservableValue<HistoryTypeStrs> = mobx.observable.box("screen");
historyLoading: mobx.IObservableValue<boolean> = mobx.observable.box(false);
historyAfterLoadIndex: number = 0;
@ -665,18 +664,21 @@ class InputModel {
codeSelectSelectNextNewestCodeBlock() {
// oldest code block = index 0 in array
// this decrements codeSelectSelected index
if (this.codeSelectSelectedIndex.get() == this.codeSelectTop) {
this.codeSelectSelectedIndex.set(this.codeSelectBottom);
} else if (this.codeSelectSelectedIndex.get() == this.codeSelectBottom) {
return;
}
// if (this.codeSelectSelectedIndex.get() == this.codeSelectTop) {
// this.codeSelectSelectedIndex.set(this.codeSelectBottom);
// } else if (this.codeSelectSelectedIndex.get() == this.codeSelectBottom) {
// return;
// }
const incBlockIndex = this.codeSelectSelectedIndex.get() + 1;
if (this.codeSelectSelectedIndex.get() == this.codeSelectBlockRefArray.length - 1) {
this.codeSelectDeselectAll();
if (this.aiChatWindowRef?.current != null) {
this.aiChatWindowRef.current.scrollTop = this.aiChatWindowRef.current.scrollHeight;
}
}
// if (this.codeSelectSelectedIndex.get() == this.codeSelectBlockRefArray.length - 1) {
// // this.codeSelectDeselectAll();
// // if (this.aiChatWindowRef?.current != null) {
// // this.aiChatWindowRef.current.scrollTop = this.aiChatWindowRef.current.scrollHeight;
// // }
// }
// console.log("incBlockIndex", incBlockIndex);
// console.log("this.codeSelectBlockRefArray.length", this.codeSelectBlockRefArray.length);
if (incBlockIndex >= 0 && incBlockIndex < this.codeSelectBlockRefArray.length) {
this.setCodeSelectSelectedCodeBlock(incBlockIndex);
}
@ -684,23 +686,29 @@ class InputModel {
@mobx.action
codeSelectSelectNextOldestCodeBlock() {
if (this.codeSelectSelectedIndex.get() == this.codeSelectBottom) {
if (this.codeSelectBlockRefArray.length > 0) {
this.codeSelectSelectedIndex.set(this.codeSelectBlockRefArray.length);
} else {
return;
}
} else if (this.codeSelectSelectedIndex.get() == this.codeSelectTop) {
if (this.codeSelectSelectedIndex.get() == null && this.codeSelectBlockRefArray.length > 0) {
console.log("triggered====== 1");
// if (this.codeSelectBlockRefArray.length > 0) {
// this.codeSelectSelectedIndex.set(this.codeSelectBlockRefArray.length - 1);
// }
this.setCodeSelectSelectedCodeBlock(this.codeSelectBlockRefArray.length - 1);
return;
// } else if (this.codeSelectSelectedIndex.get() == this.codeSelectTop) {
// console.log("triggered====== 2");
// return;
}
const decBlockIndex = this.codeSelectSelectedIndex.get() - 1;
if (decBlockIndex < 0) {
this.codeSelectDeselectAll(this.codeSelectTop);
if (this.aiChatWindowRef?.current != null) {
this.aiChatWindowRef.current.scrollTop = 0;
}
}
// if (decBlockIndex < 0) {
// console.log("triggered====== 3");
// this.codeSelectDeselectAll(this.codeSelectTop);
// if (this.aiChatWindowRef?.current != null) {
// this.aiChatWindowRef.current.scrollTop = 0;
// }
// }
if (decBlockIndex >= 0 && decBlockIndex < this.codeSelectBlockRefArray.length) {
console.log("triggered====== 4");
this.setCodeSelectSelectedCodeBlock(decBlockIndex);
}
}
@ -717,7 +725,7 @@ class InputModel {
return blockIndex == this.codeSelectSelectedIndex.get();
}
codeSelectDeselectAll(direction: number = this.codeSelectBottom) {
codeSelectDeselectAll(direction: number) {
if (this.codeSelectSelectedIndex.get() == direction) {
return;
}