Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix: API JS generated code #3461

Merged
merged 5 commits into from
Aug 22, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion src/frontend/package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

100 changes: 57 additions & 43 deletions src/frontend/src/modals/apiModal/utils/get-js-api-code.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -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}\`;
Expand All @@ -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
);
`;
}
Loading