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 @boundMethod
handleClick(e: React.MouseEvent<HTMLPreElement>) { handleClick(e: React.MouseEvent<HTMLPreElement>) {
console.log("this.blockIndex", this.blockIndex); // console.log("this.blockIndex", this.blockIndex);
GlobalModel.inputModel.setCodeSelectSelectedCodeBlock(this.blockIndex); GlobalModel.inputModel.setCodeSelectSelectedCodeBlock(this.blockIndex);
} }
render() { render() {
console.log("this.blockIndex", this.blockIndex); // console.log("this.blockIndex", this.blockIndex);
let selected = this.blockIndex == this.props.codeSelectSelectedIndex; let selected = this.blockIndex == this.props.codeSelectSelectedIndex;
return ( return (
<pre ref={this.blockRef} className={clsx({ selected: selected })} onClick={this.handleClick}> <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; this.chatListKeyCount = 0;
if (this.containerRef?.current && this.osInstance) { if (this.containerRef?.current && this.osInstance) {
const { viewport } = this.osInstance.elements(); const { viewport } = this.osInstance.elements();
viewport.scrollTo({ // viewport.scrollTo({
behavior: "auto", // behavior: "auto",
top: this.props.chatWindowRef.current.scrollHeight, // top: this.props.chatWindowRef.current.scrollHeight,
}); // });
} }
} }
@ -274,15 +274,18 @@ class AIChat extends React.Component<{}, {}> {
} }
onArrowUpPressed(): boolean { onArrowUpPressed(): boolean {
console.log("arrow up pressed==================");
const currentRef = this.textAreaRef.current; const currentRef = this.textAreaRef.current;
console.log("inputModel.getCodeSelectSelectedIndex()", GlobalModel.inputModel.getCodeSelectSelectedIndex());
if (currentRef == null) { if (currentRef == null) {
return false; return false;
} }
if (this.getLinePos(currentRef).linePos > 1) { // if (this.getLinePos(currentRef).linePos > 1) {
// normal up arrow // // normal up arrow
GlobalModel.inputModel.codeSelectDeselectAll(); // // GlobalModel.inputModel.codeSelectDeselectAll();
return false; // // return false;
} // }
GlobalModel.inputModel.codeSelectSelectNextOldestCodeBlock(); GlobalModel.inputModel.codeSelectSelectNextOldestCodeBlock();
return true; return true;
} }

View File

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