agora-appbuilder-core 4.1.2 → 4.1.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "agora-appbuilder-core",
-  "version": "4.1.2",
+  "version": "4.1.3",
   "description": "React Native template for RTE app builder",
   "main": "index.js",
   "files": [

package/template/customization-implementation/dummyConfig.ts

@@ -12,7 +12,7 @@
 /**
  * Dummy Config used to load when project doesn't have the customization.
  */
-import {isSDK, customize} from 'customization-api';
+import {customize} from 'customization-api';
 
-const dummyConfig = isSDK() ? {} : customize({});
+const dummyConfig = customize({});
 export default dummyConfig;

package/template/defaultConfig.js

@@ -76,8 +76,8 @@ const DefaultConfig = {
   CHAT_ORG_NAME: '',
   CHAT_APP_NAME: '',
   CHAT_URL: '',
-  CLI_VERSION: '3.1.2',
-  CORE_VERSION: '4.1.2',
+  CLI_VERSION: '3.1.3',
+  CORE_VERSION: '4.1.3',
   DISABLE_LANDSCAPE_MODE: false,
   STT_AUTO_START: false,
   CLOUD_RECORDING_AUTO_START: false,

package/template/src/ai-agent/components/AgentControls/AgentContext.tsx

@@ -9,6 +9,7 @@ import {
   Toast,
   useRtc,
   isWebInternal,
+  useHistory,
 } from 'customization-api';
 import LocalEventEmitter, {
   LocalEventsEnum,
@@ -47,7 +48,7 @@ export interface AIAgentContextInterface {
   setLanguage: (language: keyof typeof ASR_LANGUAGES) => void;
   prompt?: string;
   setPrompt: (prompt: string) => void;
-  isInterruptionHandlingEnabled: boolean;
+  isInterruptionHandlingEnabled?: boolean;
   setIsInterruptionHandlingEnabled: (value: boolean) => void;
   chatHistory: IMessageListItem[];
   setChatHistory: (history: IMessageListItem[]) => void;
@@ -84,6 +85,7 @@ export const AgentContext = createContext<AIAgentContextInterface>({
 export const AgentProvider: React.FC<{children: React.ReactNode}> = ({
   children,
 }) => {
+  const history = useHistory();
   const [agentConnectionState, setAgentConnectionState] =
     useState<AIAgentState>(AgentState.NOT_CONNECTED);
   const [agentAuthToken, setAgentAuthToken] = useState<string | null>(null);
@@ -98,7 +100,7 @@ export const AgentProvider: React.FC<{children: React.ReactNode}> = ({
   const [isStartAPICalled, setStartAPICalled] = useState(false);
   const [isStopAPICalled, setStopAPICalled] = useState(false);
   const [isInterruptionHandlingEnabled, setIsInterruptionHandlingEnabled] =
-    useState(false);
+    useState(undefined);
   const [language, setLanguage] =
     useState<AIAgentContextInterface['language']>('');
 
@@ -112,6 +114,22 @@ export const AgentProvider: React.FC<{children: React.ReactNode}> = ({
   const messageCache = {};
   const TIMEOUT_MS = 5000; // Timeout for incomplete messages
 
+  useEffect(() => {
+    const extraRemoteUser = users
+      // filter local user
+      ?.filter(i => i !== localUid)
+      // filter agent user
+      ?.filter(i => !i?.toString()?.startsWith('3'));
+    if (
+      extraRemoteUser &&
+      extraRemoteUser?.length &&
+      extraRemoteUser[0] !== localUid
+    ) {
+      //navigate extra user to new meeting
+      history.push('/');
+    }
+  }, [users, localUid]);
+
   //set agent uid when user refresh the page - to maintain the app state
   useEffect(() => {
     //@ts-ignore
@@ -124,11 +142,17 @@ export const AgentProvider: React.FC<{children: React.ReactNode}> = ({
   //set agent id when user refresh the page - to maintain the app state
   useEffect(() => {
     //@ts-ignore
-    if (store?.agentId && store?.agentId !== agentId) {
+    if (
+      //@ts-ignore
+      store?.agentId &&
+      //@ts-ignore
+      store?.agentId !== agentId &&
+      agents.filter(i => i?.id === agentId)?.length
+    ) {
       //@ts-ignore
       setAgentId(store.agentId);
     }
-  }, [store, agentId]);
+  }, [store, agentId, agents]);
 
   React.useEffect(() => {
     if (!isSubscribedForStreams) {

package/template/src/ai-agent/components/CustomSettingsPanel.tsx

@@ -123,17 +123,23 @@ const AdvancedSettings = () => {
 
   //when user switchs agent then update the toggle value for that agent
   useEffect(() => {
-    if (agentId && agents?.length) {
+    if (
+      isInterruptionHandlingEnabled === undefined &&
+      agentId &&
+      agents?.length
+    ) {
       setIsInterruptionHandlingEnabled(
         agents?.find(a => a?.id === agentId)?.config?.enable_aivad,
       );
     }
-  }, [agentId, agents, setIsInterruptionHandlingEnabled]);
+  }, [agentId, agents, isInterruptionHandlingEnabled]);
+
   const disabled = $config.ENABLE_CONVERSATIONAL_AI
     ? agentConnectionState === 'AGENT_CONNECTED'
       ? true
       : false
     : true;
+
   return (
     <View style={[{flexDirection: 'row', justifyContent: 'space-between'}]}>
       <Text

package/template/src/ai-agent/components/SelectAiAgent.tsx

@@ -14,7 +14,14 @@ const SelectAiAgent = () => {
     data: {agents},
   } = useRoomInfo();
   const {setStore} = useStorageContext();
-  const {agentId, setAgentId, agentConnectionState} = useContext(AgentContext);
+  const {
+    agentId,
+    setAgentId,
+    agentConnectionState,
+    setIsInterruptionHandlingEnabled,
+    setLanguage,
+    setPrompt,
+  } = useContext(AgentContext);
 
   const data = useMemo(() => {
     return agents
@@ -30,7 +37,13 @@ const SelectAiAgent = () => {
   useEffect(() => {
     if (!agentId && data && data.length) {
       //set default agent
-      setAgentId(data[0].value);
+      setAgentId(data[0]?.value);
+      setStore(prevState => {
+        return {
+          ...prevState,
+          agentId: data[0]?.value,
+        };
+      });
     }
   }, [agentId, data]);
 
@@ -59,6 +72,9 @@ const SelectAiAgent = () => {
         data={data}
         onSelect={async ({label, value}) => {
           if (agentId !== value) {
+            setIsInterruptionHandlingEnabled(undefined);
+            setLanguage(null);
+            setPrompt('');
             setAgentId(value);
             //setting agent uid in the store so we can retrive it if user refresh the page
             setStore(prevState => {

package/template/src/ai-agent/components/SelectUserLanguage.tsx

@@ -21,14 +21,16 @@ const SelectUserLanguage = () => {
   });
 
   useEffect(() => {
-    if (agentId && agents?.length) {
+    if (!language && agentId && agents?.length) {
       //@ts-ignore
       setLanguage(
         agents?.find((agent: any) => agent.id === agentId)?.config
           ?.asr_language,
       );
+    } else if (language) {
+      setLanguage(language);
     }
-  }, [agentId, setLanguage, agents]);
+  }, [agentId, agents, language]);
 
   return (
     <View>

package/template/src/ai-agent/components/UserPrompt.tsx

@@ -39,10 +39,12 @@ const UserPrompt = () => {
   }, [prompt]);
 
   useEffect(() => {
-    if (agentId && agents?.length) {
+    if (!prompt && agentId && agents?.length) {
       setPrompt(agents?.find(a => a?.id === agentId)?.config?.llm?.prompt);
+    } else if (prompt) {
+      setPrompt(prompt);
     }
-  }, [agentId, agents, setPrompt]);
+  }, [agentId, agents, setPrompt, prompt]);
   return (
     <>
       <View

package/template/src/pages/video-call/VideoRenderer.tsx

@@ -401,7 +401,7 @@ const VideoRenderer: React.FC<VideoRendererProps> = ({
                   CustomChild ? $config.VIDEO_AUDIO_TILE_OVERLAY_COLOR : null
                 }
                 customTextColor={
-                  CustomChild
+                  CustomChild && !$config.ENABLE_CONVERSATIONAL_AI
                     ? $config.FONT_COLOR + hexadecimalTransparency['80%']
                     : null
                 }