diff --git a/src/frontend/package-lock.json b/src/frontend/package-lock.json index 0ee08125c419..8cbae7c90ff5 100644 --- a/src/frontend/package-lock.json +++ b/src/frontend/package-lock.json @@ -1079,7 +1079,6 @@ }, "node_modules/@clack/prompts/node_modules/is-unicode-supported": { "version": "1.3.0", - "extraneous": true, "inBundle": true, "license": "MIT", "engines": { diff --git a/src/frontend/src/modals/apiModal/utils/get-js-api-code.tsx b/src/frontend/src/modals/apiModal/utils/get-js-api-code.tsx index a61744c7a6fb..525c899957e6 100644 --- a/src/frontend/src/modals/apiModal/utils/get-js-api-code.tsx +++ b/src/frontend/src/modals/apiModal/utils/get-js-api-code.tsx @@ -21,8 +21,9 @@ export default function getJsApiCode( this.baseURL = baseURL; this.apiKey = apiKey; } + async post(endpoint, body, headers = {"Content-Type": "application/json"}) { - if (this.apiKey) { + if (this.apiKey) { headers["Authorization"] = \`Bearer \${this.apiKey}\`; } const url = \`\${this.baseURL}\${endpoint}\`; @@ -32,84 +33,97 @@ export default function getJsApiCode( headers: headers, body: JSON.stringify(body) }); + + const responseMessage = await response.json(); if (!response.ok) { - throw new Error(\`HTTP error! Status: \${response.status}\`); + throw new Error(\`\${response.status} \${response.statusText} - \${JSON.stringify(responseMessage)}\`); } - return await response.json(); + return responseMessage; } catch (error) { - console.error('Request Error:', error); + console.error(\`Error during POST request: \${error.message}\`); throw error; } } - - async initiateSession(flowId, inputValue, stream = false, tweaks = {}) { + + async initiateSession(flowId, inputValue, inputType = 'chat', outputType = 'chat', stream = false, tweaks = {}) { const endpoint = \`/api/v1/run/\${flowId}?stream=\${stream}\`; - return this.post(endpoint, { input_value: inputValue, tweaks: tweaks }); + return this.post(endpoint, { input_value: inputValue, input_type: inputType, output_type: outputType, tweaks: tweaks }); } - + handleStream(streamUrl, onUpdate, onClose, onError) { const eventSource = new EventSource(streamUrl); - + eventSource.onmessage = event => { const data = JSON.parse(event.data); onUpdate(data); }; - + eventSource.onerror = event => { console.error('Stream Error:', event); onError(event); eventSource.close(); }; - + eventSource.addEventListener("close", () => { onClose('Stream closed'); eventSource.close(); }); - + return eventSource; } - - async runFlow(flowIdOrName, inputValue, tweaks, stream = false, onUpdate, onClose, onError) { + + async runFlow(flowIdOrName, inputValue, inputType = 'chat', outputType = 'chat', tweaks, stream = false, onUpdate, onClose, onError) { try { - const initResponse = await this.initiateSession(flowIdOrName, inputValue, stream, tweaks); - console.log('Init Response:', initResponse); - if (stream && initResponse && initResponse.outputs && initResponse.outputs[0].outputs[0].artifacts.stream_url) { + const initResponse = await this.initiateSession(flowIdOrName, inputValue, inputType, outputType, stream, tweaks); + if (stream && initResponse?.outputs?.[0]?.outputs?.[0]?.artifacts?.stream_url) { const streamUrl = initResponse.outputs[0].outputs[0].artifacts.stream_url; console.log(\`Streaming from: \${streamUrl}\`); this.handleStream(streamUrl, onUpdate, onClose, onError); } return initResponse; } catch (error) { - console.error('Error running flow:', error); - onError('Error initiating session'); + onError('Error initiating session'); } } -} - -async function main() { + } + + async function main(inputValue, inputType = 'chat', outputType = 'chat', stream = false) { const flowIdOrName = '${endpointName || flowId}'; - const inputValue = 'User message'; - const stream = false; const langflowClient = new LangflowClient('${window.location.protocol}//${window.location.host}', - ${isAuth ? "'your-api-key'" : "null"}); + ${isAuth ? "'your-api-key'" : "null"}); const tweaks = ${tweaksString}; - response = await langflowClient.runFlow( - flowIdOrName, - inputValue, - tweaks, - stream, - (data) => console.log("Received:", data.chunk), // onUpdate - (message) => console.log("Stream Closed:", message), // onClose - (error) => console.log("Stream Error:", error) // onError - ); - if (!stream) { - const flowOutputs = response.outputs[0]; - const firstComponentOutputs = flowOutputs.outputs[0]; - const output = firstComponentOutputs.outputs.message; - - console.log("Final Output:", output.message.text); + + try { + const response = await langflowClient.runFlow( + flowIdOrName, + inputValue, + inputType, + outputType, + tweaks, + stream, + (data) => console.log("Received:", data.chunk), // onUpdate + (message) => console.log("Stream Closed:", message), // onClose + (error) => console.error("Stream Error:", error) // onError + ); + + if (!stream && response) { + const flowOutputs = response.outputs[0]; + const firstComponentOutputs = flowOutputs.outputs[0]; + const output = firstComponentOutputs.outputs.message; + + console.log("Final Output:", output.message.text); + } + } catch (error) { + console.error('Main Error:', error.message); } -} - -main();`; + } + + const args = process.argv.slice(2); + main( + args[0], // inputValue + args[1], // inputType + args[2], // outputType + args[3] === 'true' // stream + ); + `; }