From 10ae244338383662992350b2b6f6ef80106558c3 Mon Sep 17 00:00:00 2001 From: aidahosa1 Date: Fri, 17 May 2024 14:28:09 -0400 Subject: yay git add -A --- .../views/collections/CollectionCardDeckView.tsx | 52 +++++++- src/client/views/pdf/GPTPopup/GPTPopup.scss | 33 +++++ src/client/views/pdf/GPTPopup/GPTPopup.tsx | 138 ++++++++++++++++++++- 3 files changed, 215 insertions(+), 8 deletions(-) (limited to 'src') diff --git a/src/client/views/collections/CollectionCardDeckView.tsx b/src/client/views/collections/CollectionCardDeckView.tsx index e64c013f1..e96fbc161 100644 --- a/src/client/views/collections/CollectionCardDeckView.tsx +++ b/src/client/views/collections/CollectionCardDeckView.tsx @@ -21,7 +21,9 @@ import { List } from '../../../fields/List'; import { gptAPICall, gptImageLabel } from '../../apis/gpt/GPT'; import { GPTCallType } from '../../apis/gpt/GPT'; import { ImageField, PdfField, URLField } from '../../../fields/URLField'; - +import { GPTPopup } from '../pdf/GPTPopup/GPTPopup'; +import { GPTPopupMode } from '../pdf/GPTPopup/GPTPopup'; +import { reaction } from 'mobx'; @observer export class CollectionCardView extends CollectionSubView() { @@ -88,6 +90,15 @@ export class CollectionCardView extends CollectionSubView() { if (this._props.Document.customHashMap != undefined){ this.customGroupDictionary = this.getCustoms(StrListCast(this._props.Document.customHashMap)) } + + reaction( + () => this._props.Document.cardSort, + (cardSort) => { + if (cardSort === 'chat') { + this.openChatPopup(); + } + } + ); } @observable customGroupDictionary: Map[] = [new Map(), new Map(), new Map()]; @@ -230,10 +241,18 @@ export class CollectionCardView extends CollectionSubView() { @computed get sortedDocsType() { - if (this._props.Document.cardSort === 'chat' && this.sortedDocs.length === 0) { - this.smartSort(); // Trigger the sorting if it hasn't been done yet - return { docs: [] }; // Return an empty array or a loading state - } + // if (this._props.Document.cardSort === 'chat'){ + // this.openChatPopup() + // const textDesc = await this.childPairStringList(); + // GPTPopup.Instance.setSortDesc(textDesc) + // } + + // if (this._props.Document.cardSort === 'chat' && this.sortedDocs.length === 0) { + + // this.smartSort(); // Trigger the sorting if it hasn't been done yet + // return { docs: [] }; // Return an empty array or a loading state + // } + const desc = BoolCast(this.layoutDoc.sortDesc); let sorted = []; @@ -253,7 +272,7 @@ export class CollectionCardView extends CollectionSubView() { case 'custom': return this.sort(sorted, 'custom', desc); case 'chat': - return { docs: this.sortedDocs }; // Use the sorted docs from the observable + return { docs: this.sortedDocs || this.myChildLayoutPairs}; // Use the sorted docs from the observable default: docs = this.myChildLayoutPairs; return { docs }; @@ -656,6 +675,25 @@ export class CollectionCardView extends CollectionSubView() { }); } + @observable isChatPopupOpen = false; + + @action openChatPopup = async () => { + this.isChatPopupOpen = true; + GPTPopup.Instance.setVisible(true); + GPTPopup.Instance.setMode(GPTPopupMode.SORT); + + // Await the promise to get the string result + const sortDesc = await this.childPairStringList(); + GPTPopup.Instance.setSortDesc(sortDesc); + GPTPopup.Instance.onSortComplete = this.handleGptSortResult; +}; + @action handleGptSortResult = (sortResult: string) => { + this.processGptOutput(sortResult); + this.sortedDocs = this.sort(this.myChildLayoutPairs, 'gpt', BoolCast(this.layoutDoc.sortDesc)).docs; + }; + + + renderButtons(childPairIndex: number) { @@ -708,6 +746,8 @@ export class CollectionCardView extends CollectionSubView() { // } // } + + render() { return (
{ private done: boolean = false; @action public setDone = (done: boolean) => { + console.log("HIIIIIIIII") this.done = done; this.chatMode = false; }; + @observable + private sortDone: boolean = false // this is so redundant but the og done variable was causing weird unknown problems and im just a girl + + @action + public setSortDone = (done: boolean) => { + console.log("HIIIIIIIII") + this.sortDone = done; + }; + + // change what can be a ref into a ref @observable private sidebarId: string = ''; @@ -120,9 +132,61 @@ export class GPTPopup extends ObservableReactComponent { this.textAnchor = anchor; }; + @observable + public sortPrompt: string = ''; + @action + public setSortPrompt = ((e: React.ChangeEvent) => { + this.sortPrompt = e.target.value; + }); + + @observable + public sortText: string = '' + @action + public setSortText = (t: string) => { + this.sortText = t + } + + @observable + public sortDesc: string = '' + + @action public setSortDesc = (t:string) => { + this.sortDesc = t + } + + @observable onSortComplete?: (sortResult: string) => void; + + + + + + public addDoc: (doc: Doc | Doc[], sidebarKey?: string | undefined) => boolean = () => false; public addToCollection: ((doc: Doc | Doc[], annotationKey?: string | undefined) => boolean) | undefined; + + generateSort = async () => { + this.setLoading(true); + this.setSortDone(false); + + try { + const res = await gptAPICall(this.sortPrompt + this.sortDesc, GPTCallType.SORT); + this.setSortText(res || 'Something went wrong :('); + + // Trigger the callback with the result + if (this.onSortComplete) { + this.onSortComplete(res || 'Something went wrong :('); + } + } catch (err) { + console.error(err); + this.setSortText('Something went wrong :('); + } + + this.setLoading(false); + this.setSortDone(true); + } + + + /** * Generates a Dalle image and uploads it to the server. */ @@ -243,6 +307,74 @@ export class GPTPopup extends ObservableReactComponent { } }; + sortBox = () => ( + <> +
+ {this.heading("SORTING")} + {this.loading ? ( +
+
+ + Loading... +
+
+ ) : !this.sortDone && ( +
+ { + if (e.key === 'Enter') { + this.generateSort(); + } + e.stopPropagation(); + }} + type="text" + placeholder="Enter sorting instructions..." + id="search-input" + className="searchBox-input" + style={{ width: "100%" }} + /> +
+ )} + + {this.sortDone && ( +
+
+ +

{this.text== "Something went wrong :(" ? "Something went wrong :(" : "Sorting done! Feel free to move things around / regenerate :) !"}

+ + + this.setSortDone(false)} + icon={} + color={StrCast(Doc.UserDoc().userVariantColor)} + /> + +
+
+ )} +
+ + ); + + + + +// <> +//
+// )} + imageBox = () => { return (
@@ -396,8 +528,10 @@ export class GPTPopup extends ObservableReactComponent { render() { return (
- {this.mode === GPTPopupMode.SUMMARY? this.summaryBox() : this.mode === GPTPopupMode.DATA? this.dataAnalysisBox() : this.mode === GPTPopupMode.IMAGE ? this.imageBox() : <>} -
+ {this.mode === GPTPopupMode.SUMMARY ? this.summaryBox() : + this.mode === GPTPopupMode.DATA ? this.dataAnalysisBox() : + this.mode === GPTPopupMode.IMAGE ? this.imageBox() : + this.mode === GPTPopupMode.SORT ? this.sortBox() : <>}
); } } -- cgit v1.2.3-70-g09d2