add option to call Promptflow Endpoint

src/.env.example

@@ -50,4 +50,8 @@ AZURE_SPEECH_REGION=
 AZURE_SPEECH_KEY=
 
 # Enabled must be set to "true" any other value will disable the feature
-PUBLIC_SPEECH_ENABLED=true
+PUBLIC_SPEECH_ENABLED=true
+
+# Promptflow API
+PROMPT_FLOW_API_URL=
+PROMPT_FLOW_API_KEY=

src/features/chat/chat-services/chat-api-entry.ts

@@ -1,5 +1,6 @@
 import { ChatAPIData } from "./chat-api-data";
 import { ChatAPISimple } from "./chat-api-simple";
+import { ChatAPIPromptFlow } from  "./chat-api-pf"
 import { PromptGPTProps } from "./models";
 
 export const chatAPIEntry = async (props: PromptGPTProps) => {
@@ -9,6 +10,8 @@ export const chatAPIEntry = async (props: PromptGPTProps) => {
     return await ChatAPIData(props);
   } else if (props.chatType === "mssql") {
     return await ChatAPIData(props);
+  } else if (props.chatType === "promptflow") {
+    return await ChatAPIPromptFlow(props);
   } else {
     return await ChatAPISimple(props);
   }

src/features/chat/chat-services/chat-api-pf.ts

@@ -0,0 +1,77 @@
+import { userHashedId } from "@/features/auth/helpers";
+import { StreamingTextResponse } from "ai";
+import { initAndGuardChatSession } from "./chat-thread-service";
+import { CosmosDBChatMessageHistory } from "./cosmosdb/cosmosdb";
+import { PromptGPTProps, PromptflowChatMessage } from "./models";
+import axios from "axios";
+import { ChatCompletionMessage } from "openai/resources";
+
+export const ChatAPIPromptFlow = async (props: PromptGPTProps) => {
+  const { lastHumanMessage, chatThread } = await initAndGuardChatSession(props);
+  const userId = await userHashedId();
+
+  const chatHistory = new CosmosDBChatMessageHistory({
+    sessionId: chatThread.id,
+    userId: userId,
+  });
+
+  const history = await chatHistory.getMessages();
+  const topHistory = history.slice(history.length - 30, history.length);
+
+  try {
+    const pfHistory = topHistory.reduce(
+      (acc: PromptflowChatMessage[], message: ChatCompletionMessage) => {
+        if (message.role === "user") {
+          acc.push({
+            inputs: {
+              question: message.content || "",
+            },
+            outputs: {},
+          });
+        } else if (message.role === "assistant" && acc.length > 0) {
+          acc[acc.length - 1].outputs.answer = message.content || "";
+        }
+        return acc;
+      },
+      []
+    );
+
+    const response = await axios.post(
+      `${process.env.PROMPT_FLOW_API_URL}`,
+      {
+        question: lastHumanMessage.content,
+        chat_history: pfHistory,
+      },
+      {
+        headers: {
+          Authorization: `Bearer ${process.env.PROMPT_FLOW_API_KEY}`,
+        },
+      }
+    );
+
+
+    await chatHistory.addMessage({
+      content: lastHumanMessage.content,
+      role: "user",
+    });
+
+    await chatHistory.addMessage({
+      content: response.data.answer,
+      role: "assistant",
+    });
+
+    return new StreamingTextResponse(response.data.answer);
+  } catch (e: unknown) {
+    if (e instanceof Error) {
+      return new Response(e.message, {
+        status: 500,
+        statusText: e.toString(),
+      });
+    } else {
+      return new Response("An unknown error occurred.", {
+        status: 500,
+        statusText: "Unknown Error",
+      });
+    }
+  }
+};

src/features/chat/chat-services/models.ts

@@ -17,7 +17,7 @@ export interface ChatMessageModel {
 }
 
 export type ConversationStyle = "creative" | "balanced" | "precise";
-export type ChatType = "simple" | "data" | "mssql";
+export type ChatType = "simple" | "data" | "mssql" | "promptflow";
 
 export type ChatRole = "system" | "user" | "assistant" | "function";
 
@@ -60,3 +60,16 @@ export interface ServerActionResponse<T> {
   error: string;
   response: T;
 }
+
+export interface PromptflowChatMessageMessageInput {
+  question: string;
+}
+
+export interface PromptflowChatMessageMessageOutput {
+  answer?: string;
+}
+
+export interface PromptflowChatMessage {
+  inputs: PromptflowChatMessageMessageInput;
+  outputs: PromptflowChatMessageMessageOutput;
+}

src/features/chat/chat-ui/chat-empty-state/chat-type-selector.tsx

@@ -1,5 +1,5 @@
 import { Tabs, TabsList, TabsTrigger } from "@/components/ui/tabs";
-import { FileText, MessageCircle } from "lucide-react";
+import { FileText, MessageCircle, Globe } from "lucide-react";
 import { FC } from "react";
 import { ChatType } from "../../chat-services/models";
 import { useChatContext } from "../chat-context";
@@ -16,7 +16,7 @@ export const ChatTypeSelector: FC<Prop> = (props) => {
       defaultValue={chatBody.chatType}
       onValueChange={(value) => onChatTypeChange(value as ChatType)}
     >
-      <TabsList className="grid w-full grid-cols-2 h-12 items-stretch">
+      <TabsList className="grid w-full grid-cols-3 h-12 items-stretch">
         <TabsTrigger
           value="simple"
           className="flex gap-2"
@@ -31,6 +31,13 @@ export const ChatTypeSelector: FC<Prop> = (props) => {
         >
           <FileText size={20} /> File
         </TabsTrigger>
+        <TabsTrigger
+          value="promptflow"
+          className="flex gap-2"
+          disabled={props.disable}
+        >
+          <Globe size={20} /> PF API
+        </TabsTrigger>
       </TabsList>
     </Tabs>
   );

src/package.json

@@ -26,6 +26,7 @@
     "@types/react-dom": "^18.2.14",
     "ai": "^2.2.20",
     "autoprefixer": "^10.4.16",
+    "axios": "^1.6.4",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.0.0",
     "eslint": "^8.52.0",

src/type.ts

@@ -25,6 +25,8 @@ const azureEnvVars = [
   "AZURE_SPEECH_REGION",
   "AZURE_SPEECH_KEY",
   "PUBLIC_PUBLIC_SPEECH_ENABLED",
+  "PROMPT_FLOW_API_URL",
+  "PROMPT_FLOW_API_KEY",
 ] as const;
 
 type RequiredServerEnvKeys = (typeof azureEnvVars)[number];