got really simple openai support hacked in

src/model.ts

@@ -3606,20 +3606,36 @@ class CommandRunner {
         GlobalModel.submitCommand("history", "viewall", null, kwargs, true);
     }
 
-    telemetryOff() {
-        GlobalModel.submitCommand("telemetry", "off", null, {"nohist": "1"}, true);
+    telemetryOff(interactive : boolean) : Promise<CommandRtnType> {
+        return GlobalModel.submitCommand("telemetry", "off", null, {"nohist": "1"}, interactive);
     }
 
-    telemetryOn() {
-        GlobalModel.submitCommand("telemetry", "on", null, {"nohist": "1"}, true);
+    telemetryOn(interactive : boolean) : Promise<CommandRtnType> {
+        return GlobalModel.submitCommand("telemetry", "on", null, {"nohist": "1"}, interactive);
     }
 
-    setTermFontSize(fsize : number) {
+    setTermFontSize(fsize : number, interactive : boolean) : Promise<CommandRtnType> {
         let kwargs = {
             "nohist": "1",
             "termfontsize": String(fsize),
         };
-        GlobalModel.submitCommand("client", "set", null, kwargs, true);
+        return GlobalModel.submitCommand("client", "set", null, kwargs, interactive);
+    }
+
+    setClientOpenAISettings(opts : {model? : string, apitoken? : string, maxtokens? : string}) : Promise<CommandRtnType> {
+        let kwargs = {
+            "nohist": "1",
+        };
+        if (opts.model != null) {
+            kwargs["openaimodel"] = opts.model;
+        }
+        if (opts.apitoken != null) {
+            kwargs["openaiapitoken"] = opts.apitoken;
+        }
+        if (opts.maxtokens != null) {
+            kwargs["openaimaxtokens"] = opts.maxtokens;
+        }
+        return GlobalModel.submitCommand("client", "set", null, kwargs, false);
     }
 
     clientAcceptTos() : void {

src/ptydata.ts

@@ -97,14 +97,17 @@ class PacketDataBuffer extends PtyDataBuffer {
                 console.log("invalid line packet", line);
             }
         }
+        let packet : any = null;
         try {
-            let packet = JSON.parse(packetStr);
-            this.callback(packet);
+            packet = JSON.parse(packetStr);
         }
         catch (e) {
-            console.log("invalid line packet (bad json)", line);
+            console.log("invalid line packet (bad json)", line, e);
             return;
         }
+        if (packet != null) {
+            this.callback(packet);
+        }
     }
 
     parseData() {

src/settings.tsx

@@ -18,6 +18,7 @@ type CV<V> = mobx.IComputedValue<V>;
 
 const RemotePtyRows = 8;
 const RemotePtyCols = 80;
+const APITokenSentinel = "--apitoken--";
 
 // @ts-ignore
 const VERSION = __PROMPT_VERSION__;
@@ -178,13 +179,6 @@ class ScreenSettingsModal extends React.Component<{sessionId : string, screenId
         commandRtnHandler(prtn, this.errorMessage);
     }
 
-    @boundMethod
-    setErrorMessage(msg : string) : void {
-        mobx.action(() => {
-            this.errorMessage.set(msg);
-        })();
-    }
-
     @boundMethod
     dismissError() : void {
         mobx.action(() => {
@@ -407,13 +401,6 @@ class SessionSettingsModal extends React.Component<{sessionId : string}, {}> {
         });
     }
 
-    @boundMethod
-    setErrorMessage(msg : string) : void {
-        mobx.action(() => {
-            this.errorMessage.set(msg);
-        })();
-    }
-
     @boundMethod
     dismissError() : void {
         mobx.action(() => {
@@ -610,14 +597,13 @@ class LineSettingsModal extends React.Component<{linenum : number}, {}> {
 @mobxReact.observer
 class ClientSettingsModal extends React.Component<{}, {}> {
     tempFontSize : OV<number>;
-    tempTelemetry : OV<boolean>;
     fontSizeDropdownActive : OV<boolean> = mobx.observable.box(false, {name: "clientSettings-fontSizeDropdownActive"});
+    errorMessage : OV<string> = mobx.observable.box(null, {name: "ClientSettings-errorMessage"});
 
     constructor(props : any) {
         super(props);
         let cdata = GlobalModel.clientData.get();
         this.tempFontSize = mobx.observable.box(GlobalModel.termFontSize.get(), {name: "clientSettings-tempFontSize"});
-        this.tempTelemetry = mobx.observable.box(!cdata.clientopts.notelemetry, {name: "clientSettings-telemetry"});
     }
     
     @boundMethod
@@ -628,31 +614,19 @@ class ClientSettingsModal extends React.Component<{}, {}> {
     }
 
     @boundMethod
-    handleOK() : void {
+    dismissError() : void {
         mobx.action(() => {
-            GlobalModel.clientSettingsModal.set(false);
+            this.errorMessage.set(null);
         })();
-        let cdata = GlobalModel.clientData.get();
-        let curTel = !cdata.clientopts.notelemetry;
-        if (this.tempTelemetry.get() != curTel) {
-            if (this.tempTelemetry.get()) {
-                GlobalCommandRunner.telemetryOn();
-            }
-            else {
-                GlobalCommandRunner.telemetryOff();
-            }
-        }
-        if (GlobalModel.termFontSize.get() != this.tempFontSize.get()) {
-            GlobalCommandRunner.setTermFontSize(this.tempFontSize.get());
-        }
     }
 
     @boundMethod
     handleChangeFontSize(newFontSize : number) : void {
-        mobx.action(() => {
-            this.fontSizeDropdownActive.set(false);
-            this.tempFontSize.set(newFontSize);
-        })();
+        if (GlobalModel.termFontSize.get() == newFontSize) {
+            return;
+        }
+        let prtn = GlobalCommandRunner.setTermFontSize(newFontSize, false);
+        commandRtnHandler(prtn, this.errorMessage);
     }
 
     @boundMethod
@@ -664,9 +638,14 @@ class ClientSettingsModal extends React.Component<{}, {}> {
 
     @boundMethod
     handleChangeTelemetry(val : boolean) : void {
-        mobx.action(() => {
-            this.tempTelemetry.set(val);
-        })();
+        let prtn : Promise<CommandRtnType> = null;
+        if (val) {
+            prtn = GlobalCommandRunner.telemetryOn(false);
+        }
+        else {
+            prtn = GlobalCommandRunner.telemetryOff(false);
+        }
+        commandRtnHandler(prtn, this.errorMessage);
     }
 
     renderFontSizeDropdown() : any {
@@ -693,8 +672,36 @@ class ClientSettingsModal extends React.Component<{}, {}> {
         );
     }
 
+    @boundMethod
+    inlineUpdateOpenAIModel(newModel : string) : void {
+        let prtn = GlobalCommandRunner.setClientOpenAISettings({model: newModel});
+        commandRtnHandler(prtn, this.errorMessage);
+    }
+
+    @boundMethod
+    inlineUpdateOpenAIToken(newToken : string) : void {
+        let prtn = GlobalCommandRunner.setClientOpenAISettings({apitoken: newToken});
+        commandRtnHandler(prtn, this.errorMessage);
+    }
+
+    @boundMethod
+    inlineUpdateOpenAIMaxTokens(newMaxTokensStr : string) : void {
+        let prtn = GlobalCommandRunner.setClientOpenAISettings({maxtokens: newMaxTokensStr});
+        commandRtnHandler(prtn, this.errorMessage);
+    }
+
+    @boundMethod
+    setErrorMessage(msg : string) : void {
+        mobx.action(() => {
+            this.errorMessage.set(msg);
+        })();
+    }
+
     render() {
         let cdata : ClientDataType = GlobalModel.clientData.get();
+        let openAIOpts = cdata.openaiopts ?? {};
+        let apiTokenStr = (util.isBlank(openAIOpts.apitoken) ? "(not set)" : "********");
+        let maxTokensStr = String(openAIOpts.maxtokens == null || openAIOpts.maxtokens == 0 ? 1000 : openAIOpts.maxtokens);
         return (
             <div className={cn("modal client-settings-modal settings-modal prompt-modal is-active")}>
                 <div className="modal-background"/>
@@ -743,13 +750,37 @@ class ClientSettingsModal extends React.Component<{}, {}> {
                                 Basic Telemetry
                             </div>
                             <div className="settings-input">
-                                <Toggle checked={this.tempTelemetry.get()} onChange={this.handleChangeTelemetry}/>
+                                <Toggle checked={!cdata.clientopts.notelemetry} onChange={this.handleChangeTelemetry}/>
                             </div>
                         </div>
+                        <div className="settings-field">
+                            <div className="settings-label">
+                                OpenAI Token
+                            </div>
+                            <div className="settings-input">
+                                <InlineSettingsTextEdit placeholder="" text={apiTokenStr} value={""} onChange={this.inlineUpdateOpenAIToken} maxLength={100} showIcon={true}/>
+                            </div>
+                        </div>
+                        <div className="settings-field">
+                            <div className="settings-label">
+                                OpenAI Model
+                            </div>
+                            <div className="settings-input">
+                                <InlineSettingsTextEdit placeholder="gpt-3.5-turbo" text={util.isBlank(openAIOpts.model) ? "gpt-3.5-turbo" : openAIOpts.model} value={openAIOpts.model ?? ""} onChange={this.inlineUpdateOpenAIModel} maxLength={100} showIcon={true}/>
+                            </div>
+                        </div>
+                        <div className="settings-field">
+                            <div className="settings-label">
+                                OpenAI MaxTokens
+                            </div>
+                            <div className="settings-input">
+                                <InlineSettingsTextEdit placeholder="" text={maxTokensStr} value={maxTokensStr} onChange={this.inlineUpdateOpenAIMaxTokens} maxLength={10} showIcon={true}/>
+                            </div>
+                        </div>
+                        <SettingsError errorMessage={this.errorMessage}/>
                     </div>
                     <footer>
-                        <div onClick={this.closeModal} className="button is-prompt-cancel is-outlined is-small">Cancel</div>
-                        <div onClick={this.handleOK} className="button is-prompt-green is-outlined is-small">OK</div>
+                        <div onClick={this.closeModal} className="button is-prompt-green is-outlined is-small">Close</div>
                     </footer>
                 </div>
             </div>

src/sh2.less

@@ -285,5 +285,13 @@ input[type=checkbox] {
         .openai-content-assistant {
             color: white;
         }
+
+        .openai-role-error {
+            color: @term-bright-red;
+        }
+
+        .openai-content-error {
+            color: @term-bright-red;
+        }
     }
 }

src/types.ts

@@ -450,6 +450,14 @@ type ClientDataType = {
     cmdstoretype : "session" | "screen";
     dbversion : number,
     migration? : ClientMigrationInfo;
+    openaiopts? : OpenAIOptsType,
+};
+
+type OpenAIOptsType = {
+    model? : string,
+    apitoken? : string,
+    maxtokens? : number,
+    maxchoices? : number,
 };
 
 type ClientMigrationInfo = {
@@ -603,6 +611,7 @@ type OpenAIPacketType = {
     usage : Record<string, number>,
     index : number,
     text : string,
+    error : string,
 };
 
-export type {SessionDataType, LineType, RemoteType, RemoteStateType, RemoteInstanceType, HistoryItem, CmdRemoteStateType, FeCmdPacketType, TermOptsType, CmdStartPacketType, CmdDataType, ScreenDataType, ScreenOptsType, PtyDataUpdateType, ModelUpdateType, UpdateMessage, InfoType, CmdLineUpdateType, RemotePtrType, UIContextType, HistoryInfoType, HistoryQueryOpts, WatchScreenPacketType, TermWinSize, FeInputPacketType, RemoteInputPacketType, RemoteEditType, ContextMenuOpts, RendererContext, WindowSize, RendererModel, PtyDataType, BookmarkType, ClientDataType, PlaybookType, PlaybookEntryType, HistoryViewDataType, RenderModeType, AlertMessageType, HistorySearchParams, ScreenLinesType, FocusTypeStrs, HistoryTypeStrs, RendererOpts, RendererPluginType, SimpleBlobRendererComponent, RendererModelContainerApi, RendererModelInitializeParams, RendererOptsUpdate, ClientMigrationInfo, WebShareOpts, RemoteStatusTypeStrs, WebFullScreen, WebScreen, WebLine, WebCmd, RemoteTermContext, TermContextUnion, WebRemote, PtyDataUpdate, WebShareWSMessage, LineHeightChangeCallbackType, LineFactoryProps, LineInterface, RendererContainerType, RemoteViewType, CommandRtnType};
+export type {SessionDataType, LineType, RemoteType, RemoteStateType, RemoteInstanceType, HistoryItem, CmdRemoteStateType, FeCmdPacketType, TermOptsType, CmdStartPacketType, CmdDataType, ScreenDataType, ScreenOptsType, PtyDataUpdateType, ModelUpdateType, UpdateMessage, InfoType, CmdLineUpdateType, RemotePtrType, UIContextType, HistoryInfoType, HistoryQueryOpts, WatchScreenPacketType, TermWinSize, FeInputPacketType, RemoteInputPacketType, RemoteEditType, ContextMenuOpts, RendererContext, WindowSize, RendererModel, PtyDataType, BookmarkType, ClientDataType, PlaybookType, PlaybookEntryType, HistoryViewDataType, RenderModeType, AlertMessageType, HistorySearchParams, ScreenLinesType, FocusTypeStrs, HistoryTypeStrs, RendererOpts, RendererPluginType, SimpleBlobRendererComponent, RendererModelContainerApi, RendererModelInitializeParams, RendererOptsUpdate, ClientMigrationInfo, WebShareOpts, RemoteStatusTypeStrs, WebFullScreen, WebScreen, WebLine, WebCmd, RemoteTermContext, TermContextUnion, WebRemote, PtyDataUpdate, WebShareWSMessage, LineHeightChangeCallbackType, LineFactoryProps, LineInterface, RendererContainerType, RemoteViewType, CommandRtnType, OpenAIPacketType};

src/view/openai.tsx

@@ -34,11 +34,13 @@ class OpenAIRendererModel {
     packetData : PacketDataBuffer;
     rawCmd : T.WebCmd;
     output : OV<OpenAIOutputType>;
+    version : OV<number>;
     
     constructor() {
         this.updateHeight_debounced = debounce(1000, this.updateHeight.bind(this));
         this.packetData = new PacketDataBuffer(this.packetCallback);
         this.output = mobx.observable.box(null, {name: "openai-output"});
+        this.version = mobx.observable.box(0);
     }
 
     initialize(params : T.RendererModelInitializeParams) : void {
@@ -50,9 +52,7 @@ class OpenAIRendererModel {
         this.savedHeight = params.savedHeight;
         this.ptyDataSource = params.ptyDataSource;
         this.rawCmd = params.rawCmd;
-        if (this.isDone.get()) {
-            setTimeout(() => this.reload(0), 10);
-        }
+        setTimeout(() => this.reload(0), 10);
     }
 
     @boundMethod
@@ -61,6 +61,15 @@ class OpenAIRendererModel {
         if (packet == null) {
             return;
         }
+        // console.log("got packet", packet);
+        if (packet.error != null) {
+            mobx.action(() => {
+                this.loadError.set(packet.error);
+                this.version.set(this.version.get()+1);
+                console.log("set error", this.loadError.get());
+            })();
+            return;
+        }
         if (packet.model != null && (packet.index ?? 0) == 0) {
             let output = {
                 model: packet.model,
@@ -75,12 +84,17 @@ class OpenAIRendererModel {
         }
         if ((packet.index ?? 0) == 0) {
             mobx.action(() => {
+                let output = this.output.get();
+                if (output == null) {
+                    return;
+                }
                 if (packet.finish_reason != null) {
                     this.output.get().finish_reason = packet.finish_reason;
                 }
                 if (packet.text != null) {
                     this.output.get().message += packet.text;
                 }
+                this.version.set(this.version.get()+1);
             })();
         }
     }
@@ -111,12 +125,13 @@ class OpenAIRendererModel {
         mobx.action(() => {
             this.isDone.set(true);
         })();
-        this.reload(0);
+        // this.reload(0);
     }
 
     reload(delayMs : number) : void {
         mobx.action(() => {
             this.loading.set(true);
+            this.loadError.set(null);
         })();
         let rtnp = this.ptyDataSource(this.context);
         if (rtnp == null) {
@@ -129,7 +144,6 @@ class OpenAIRendererModel {
                 this.receiveData(ptydata.pos, ptydata.data, "reload");
                 mobx.action(() => {
                     this.loading.set(false);
-                    this.loadError.set(null);
                 })();
             }, delayMs);
         }).catch((e) => {
@@ -165,6 +179,18 @@ class OpenAIRenderer extends React.Component<{model : OpenAIRendererModel}> {
         );
     }
 
+    renderError() {
+        let model : OpenAIRendererModel = this.props.model;
+        return (
+            <div className="openai-message">
+                <span className="openai-role openai-role-error">[error]</span>
+                <div className="openai-content-error">
+                    {model.loadError.get()}
+                </div>
+            </div>
+        );
+    }
+
     renderOutput(cmd : T.WebCmd) {
         let output = this.props.model.output.get();
         let message = "";
@@ -194,9 +220,21 @@ class OpenAIRenderer extends React.Component<{model : OpenAIRendererModel}> {
         let model : OpenAIRendererModel = this.props.model;
         let cmd = model.rawCmd;
         let styleVal : Record<string, any> = null;
-        if (model.loading.get() && model.savedHeight >= 0) {
+        if (model.loading.get() && model.savedHeight >= 0 && model.isDone) {
             styleVal = {height: model.savedHeight};
         }
+        console.log("render again", mobx.toJS(model.output.get()));
+        let version = model.version.get();
+        let loadError = model.loadError.get();
+        console.log(model.context.lineNum, "got load error", loadError);
+        if (loadError != null) {
+            return (
+                <div className="renderer-container openai-renderer openai-error" style={styleVal}>
+                    {this.renderPrompt(cmd)}
+                    {this.renderError()}
+                </div>
+            );
+        }
         return (
             <div className="renderer-container openai-renderer" style={styleVal}>
                 {this.renderPrompt(cmd)}