feat: chat app struct into installed

web/app/(commonLayout)/explore/installed/[appId]/page.tsx

@@ -1,12 +1,15 @@
 import React, { FC } from 'react'
+import Main from '@/app/components/explore/installed-app'
 
-export interface IInstalledAppProps { }
+export interface IInstalledAppProps { 
+  params: {
+    appId: string
+  }
+}
 
-const InstalledApp: FC<IInstalledAppProps> = ({ }) => {
+const InstalledApp: FC<IInstalledAppProps> = ({ params: {appId} }) => {
   return (
-    <div>
-      InstalledApp
-    </div>
+    <Main id={appId} />
   )
 }
 export default React.memo(InstalledApp)

web/app/(shareLayout)/chat/[token]/page.tsx

@@ -4,12 +4,10 @@ import React from 'react'
 import type { IMainProps } from '@/app/components/share/chat'
 import Main from '@/app/components/share/chat'
 
-const Chat: FC<IMainProps> = ({
-  params,
-}: any) => {
+const Chat: FC<IMainProps> = () => {
 
   return (
-    <Main params={params} />
+    <Main />
   )
 }
 

web/app/components/explore/installed-app/index.tsx

@@ -0,0 +1,63 @@
+'use client'
+import React, { FC, useEffect } from 'react'
+import { App } from '@/types/app'
+import ChatApp from '@/app/components/share/chat'
+
+export interface IInstalledAppProps {
+  id: string
+}
+
+const isMock = true
+const appDetail = {
+  "id": "4dcc2bac-0a48-4633-8e0b-0f4335669335",
+  "name": "Interviewer",
+  "mode": "chat",
+  "icon": null,
+  "icon_background": null,
+  "app_model_config": {
+      "opening_statement": null,
+      "suggested_questions": [],
+      "suggested_questions_after_answer": {
+          "enabled": false
+      },
+      "more_like_this": {
+          "enabled": false
+      },
+      "model": {
+          "provider": "openai",
+          "name": "gpt-3.5-turbo",
+          "completion_params": {
+              "max_tokens": 512,
+              "temperature": 1,
+              "top_p": 1,
+              "presence_penalty": 0,
+              "frequency_penalty": 0
+          }
+      },
+      "user_input_form": [],
+      "pre_prompt": null,
+      "agent_mode": {
+          "enabled": false,
+          "tools": []
+      }
+  },
+} as any
+
+const InstalledApp: FC<IInstalledAppProps> = ({
+  id,
+}) => {
+  const [app, setApp] = React.useState<App | null>(isMock ? appDetail : null)
+
+  useEffect(() => {
+    // TODO
+    if(!isMock) {
+      setApp(appDetail)
+    }
+  })
+  return (
+    <div className='h-full'>
+      <ChatApp isInstalledApp installedAppInfo={appDetail}/>
+    </div>
+  )
+}
+export default React.memo(InstalledApp)

web/app/components/share/chat/index.tsx

@@ -23,16 +23,17 @@ import { replaceStringWithValues } from '@/app/components/app/configuration/prom
 import AppUnavailable from '../../base/app-unavailable'
 import { userInputsFormToPromptVariables } from '@/utils/model-config'
 import { SuggestedQuestionsAfterAnswerConfig } from '@/models/debug'
+import { App } from '@/types/app'
+
 export type IMainProps = {
-  params: {
-    locale: string
-    appId: string
-    conversationId: string
-    token: string
-  }
+  isInstalledApp?: boolean,
+  installedAppInfo? : App
 }
 
-const Main: FC<IMainProps> = () => {
+const Main: FC<IMainProps> = ({
+  isInstalledApp,
+  installedAppInfo
+}) => {
   const { t } = useTranslation()
   const media = useBreakpoints()
   const isMobile = media === MediaType.mobile
@@ -222,19 +223,39 @@ const Main: FC<IMainProps> = () => {
     return []
   }
 
+  const fetchInitData = () => {
+    if(isInstalledApp) {
+      return new Promise((resolve) => {
+        // TODO: fetchConversations
+        resolve([{
+          app_id: installedAppInfo?.id, 
+          site: {
+            title: installedAppInfo?.name,
+            prompt_public: false,
+            copyright: ''
+          },
+          model_config: installedAppInfo?.app_model_config,
+          plan: 'basic',
+        }, {
+          data: []
+        }, installedAppInfo?.app_model_config])
+      })
+    }
+    return Promise.all([fetchAppInfo(), fetchConversations(), fetchAppParams()])
+  }
+
 
   // init
   useEffect(() => {
     (async () => {
       try {
-        const [appData, conversationData, appParams] = await Promise.all([fetchAppInfo(), fetchConversations(), fetchAppParams()])
+        const [appData, conversationData, appParams]: any = await fetchInitData()
         const { app_id: appId, site: siteInfo, model_config, plan }: any = appData
         setAppId(appId)
         setPlan(plan)
         const tempIsPublicVersion = siteInfo.prompt_public
         setIsPublicVersion(tempIsPublicVersion)
         const prompt_template = tempIsPublicVersion ? model_config.pre_prompt : ''
-
         // handle current conversation id
         const { data: conversations } = conversationData as { data: ConversationItem[] }
         const _conversationId = getConversationIdFromStorage(appId)
@@ -243,7 +264,9 @@ const Main: FC<IMainProps> = () => {
         // fetch new conversation info
         const { user_input_form, opening_statement: introduction, suggested_questions_after_answer }: any = appParams
         const prompt_variables = userInputsFormToPromptVariables(user_input_form)
-        changeLanguage(siteInfo.default_language)
+        if(siteInfo.default_language) {
+          changeLanguage(siteInfo.default_language)
+        }
         setNewConversationInfo({
           name: t('share.chat.newChatDefaultName'),
           introduction,

web/types/app.ts

@@ -204,6 +204,7 @@ export type App = {
   is_demo: boolean
   /** Model configuration */
   model_config: ModelConfig
+  app_model_config: ModelConfig
   /** Timestamp of creation */
   created_at: number
   /** Web Application Configuration */