@magmamath/students-features 0.3.0-rc.9 → 0.3.0

package/src/features/chatbot/model/ChatBotModel.ts

@@ -4,9 +4,9 @@ import {
   restore,
   sample,
   type Store,
-  type Effect,
   createStore,
   createEffect,
+  combine,
 } from 'effector'
 import { createControllerEffect, createEntityFieldStore } from '../../../lib/effector'
 import {
@@ -17,12 +17,12 @@ import {
   SetHintMessageProps,
   StartConversationFxData,
 } from '../types/model.types'
-import { GetAlternativesResponse, PostMessageResponse } from '../types/api.types'
-import { generateRandomId } from '../../../lib/helpers/helpers'
+import { GetAlternativesResponse } from '../types/api.types'
 import { ChatbotAPI } from './api'
 import { ChatbotTranslation } from './translation'
 import { ChatTextToSpeechModel } from './t2s'
 import { AudioProvider } from '../types/t2s.types'
+import { messagesHelper } from './messagesHelper'
 
 type ReinitConversationProps = {
   key: string
@@ -43,7 +43,6 @@ export class ChatbotModel {
   readonly toggleOpen = createEvent()
   readonly $isOpen = restore(this.setIsOpen, false).on(this.toggleOpen, (isOpen) => !isOpen)
 
-  // separate messages and alternatives class?
   public readonly removeLastMessage = createEvent()
   private readonly setLastMessageKey = createEvent<string>()
   public readonly $lastMessageKey = restore(this.setLastMessageKey, null)
@@ -51,7 +50,7 @@ export class ChatbotModel {
   readonly setScrollActive = createEvent<boolean>()
   readonly $isScrollActive = restore(this.setScrollActive, false)
 
-  readonly sendHelpRequestFx: Effect<SendHelpParams, PostMessageResponse | ConversationMessage>
+  readonly sendHelpRequestFx
 
   readonly defaultMessages: ChatbotModelProps['messages']
 
@@ -59,16 +58,28 @@ export class ChatbotModel {
   readonly threadIds = createEntityFieldStore<string>()
   readonly availableChats = createEntityFieldStore<boolean>()
 
+  public readonly $currentChatData = combine(
+    {
+      messages: this.messages.$state,
+      threadIds: this.threadIds.$state,
+      availableChats: this.availableChats.$state,
+      key: this.$currentKey,
+    },
+    ({ messages, threadIds, availableChats, key }) => {
+      return {
+        messages: messages[key] ?? [],
+        threadId: threadIds[key] ?? null,
+        isAvailable: availableChats[key] ?? false,
+        key,
+      }
+    },
+  )
+
   constructor({ api, messages, $key }: ChatbotModelProps) {
     this.api = new ChatbotAPI(api)
 
     this.defaultMessages = messages
-    if ($key) {
-      sample({
-        source: $key,
-        target: this.$currentKey,
-      })
-    }
+    if ($key) sample({ source: $key, target: this.$currentKey })
 
     this.$alternatives = restore(this.api.getAlternativesFx.doneData, null)
       .on(this.setAlternatives, (_, payload) => payload)
@@ -92,102 +103,67 @@ export class ChatbotModel {
   }
 
   private createSendHelpRequestFx() {
-    return attach({
-      source: [this.$currentKey, this.messages.$state, this.translation.$isTranslated],
-      mapParams: (params: SendHelpParams, [key, messages, isTranslated]) => ({
+    const effect = attach({
+      source: [this.$currentKey, this.translation.$isTranslated],
+      mapParams: (params: SendHelpParams, [key, isTranslated]) => ({
         ...params,
         key,
-        messages,
         isTranslated,
       }),
       effect: createControllerEffect(
         async ({
           payload,
-          message = '',
-          translationTargetLanguage,
+          message,
+          translationTargetLanguage: targetLanguage,
           translatedMessage,
           key,
-          messages,
           isTranslated,
         }: SendHelpProps) => {
           this.setLastMessageKey(key)
-
-          const currentMessages = messages[key] || []
-
           this.messages.setField({
             key,
-            data: [
-              ...currentMessages,
-              {
-                id: generateRandomId(),
-                message: message ?? '',
-                translatedMessage,
-                isOwnMessage: true,
-                threadId: payload.threadId ?? '',
-                options: [],
-              },
+            fn: (currentMessages) => [
+              ...(currentMessages || []),
+              messagesHelper.createOwn({ message, translatedMessage, threadId: payload.threadId }),
             ],
           })
 
           const response = await this.api.postMessageFx(payload)
+          let messages = [messagesHelper.createAnswer(response)]
+          if (response.endMessage) {
+            messages.push(messagesHelper.createLast(this.defaultMessages.endMessage))
+          }
           if (isTranslated) {
-            return await this.translation.translateMessageFx({
-              targetLanguage: translationTargetLanguage as string,
-              message: {
-                ...response,
-                id: generateRandomId(),
-                isOwnMessage: false,
-              },
-            })
+            messages = await this.translation.translateMessagesFx({ targetLanguage, messages })
           }
 
-          return response
+          this.messages.setField({
+            key,
+            fn: (currentMessages) => [...(currentMessages || []), ...messages],
+          })
+          this.threadIds.setField({ key, data: response.threadId })
         },
       ),
     })
-  }
 
-  private initChatReplyWatcher() {
     sample({
-      clock: this.sendHelpRequestFx.doneData,
-      source: [this.$currentKey, this.messages.$state] as const,
-      fn: ([key, messages], response) => ({ key, messages: messages[key] || [], response }),
-    }).watch(({ key, messages, response }) => {
-      this.messages.setField({
-        key,
-        data: [
-          ...messages,
-          {
-            id: generateRandomId(),
-            message: response.message,
-            isOwnMessage: false,
-            threadId: response.threadId,
-            options: response.options,
-            translatedMessage:
-              'translatedMessage' in response ? response.translatedMessage : undefined,
-          },
-        ],
-      })
-
-      this.threadIds.setField({ key, data: response.threadId })
-    })
-
-    sample({
-      clock: this.sendHelpRequestFx.fail,
-      source: [this.$currentKey, this.messages.$state] as const,
-      fn: ([key, messages]) => ({ key, data: [...messages[key], this.defaultMessages.error] }),
+      clock: effect.fail,
+      source: this.$currentChatData,
+      fn: ({ key, messages }) => ({ key, data: [...messages, this.defaultMessages.error] }),
       filter: (_, { error }) => error.message !== 'Request aborted manually',
       target: this.messages.setField,
     })
 
+    return effect
+  }
+
+  private initChatReplyWatcher() {
     sample({
       clock: this.removeLastMessage,
       source: [this.$lastMessageKey, this.messages.$state] as const,
       fn: ([lastMessageKey, messages]) => {
-        const mockData = { key: '', data: [] }
-        if (!lastMessageKey) return mockData
-        const updatedMessages = messages[lastMessageKey]
-        if (!updatedMessages?.length) return mockData
+        if (!lastMessageKey) return { key: '', data: [] }
+        const updatedMessages = [...messages[lastMessageKey]]
         updatedMessages.pop()
         return { key: lastMessageKey, data: updatedMessages }
       },
@@ -197,26 +173,19 @@ export class ChatbotModel {
   }
 
   public readonly startConversation = attach({
-    source: {
-      key: this.$currentKey,
-      messages: this.messages.$state,
-    },
-    mapParams: (_: void, source) => ({
-      key: source.key,
-      messages: source.messages[source.key] ?? [],
-    }),
+    source: this.$currentChatData,
+    mapParams: (_: void, source) => source,
     effect: createEffect(({ key, messages }: StartConversationFxData) => {
       if (messages.length) return this.reinitConversation({ key })
-
       this.messages.setField({ key, data: [this.defaultMessages.start] })
       this.availableChats.setField({ key, data: true })
     }),
   })
 
-  public setHintMessage({ entityId, fieldId, ...message }: SetHintMessageProps) {
+  public setHintMessage({ key, ...message }: SetHintMessageProps) {
     const options = this.$alternatives.getState()?.options.hints ?? message.options
     this.messages.setField({
-      key: `${entityId}-${fieldId}`,
+      key,
       fn: (messages) => {
         if (!messages || messages.length > 1) return
         return [{ ...message, options }]
@@ -228,12 +197,18 @@ export class ChatbotModel {
     this.messages.setField({
       key,
       fn: (messages) => {
-        if (!messages?.length || messages.length > 1) return
-        const lastMessage = messages[messages.length - 1]
+        if (!messages?.length || messages.length === 1) return
         const copy = [...messages]
-        copy.splice(messages.length - 1, 1, {
+        while (copy.at(-1)?.endMessage) {
+          copy.pop()
+        }
+
+        const lastMessage = copy.at(-1)
+        if (!lastMessage) return
+
+        copy.splice(copy.length - 1, 1, {
           ...lastMessage,
-          options: [{ text: 'Give me another hint', promptKey: '' }],
+          options: [this.defaultMessages.anotherHintOption],
         })
         return copy
       },

package/src/features/chatbot/model/api.ts

@@ -1,46 +1,37 @@
-import { createEffect, Effect } from 'effector'
-
+import { createEffect } from 'effector'
 import { createControllerEffect } from '../../../lib/effector'
-import { ControlledEffect } from '../../../lib/effector/createControllerEffect'
 import { ChatbotModelProps } from '../types/model.types'
-import {
-  GetAlternativesResponse,
-  PostMessagePayload,
-  PostMessageResponse,
-  GoogleTranslatePayload,
-  GoogleTranslateResponse,
-  GoogleText2SpeechPayload,
-  GoogleText2SpeechResponse,
-  GetAlternativesPayload,
-} from '../types/api.types'
+import { GoogleTranslatePayload, GoogleTranslateResponse } from '../types/api.types'
 import { replaceKatexSyntax } from '../helpers'
 
 export class ChatbotAPI {
-  postMessageFx: ControlledEffect<PostMessagePayload, PostMessageResponse>
-  getAlternativesFx: Effect<GetAlternativesPayload, GetAlternativesResponse>
-  translateTextFx: Effect<GoogleTranslatePayload, GoogleTranslateResponse>
-  textToSpeechTextFx: Effect<GoogleText2SpeechPayload, GoogleText2SpeechResponse>
+  public readonly postMessageFx
+  public readonly getAlternativesFx
+  public readonly translateTextFx
+  public readonly textToSpeechTextFx
 
   constructor(api: ChatbotModelProps['api']) {
     this.postMessageFx = createControllerEffect(api.postMessage)
     this.getAlternativesFx = createEffect(api.getAlternatives)
-    this.translateTextFx = createEffect(async (payload: GoogleTranslatePayload) => {
-      const response = await api.postTranslateText({
-        ...payload,
-        text: replaceKatexSyntax(payload.text),
-      })
+    this.translateTextFx = createEffect(
+      async (payload: GoogleTranslatePayload): Promise<GoogleTranslateResponse> => {
+        const response = await api.postTranslateText({
+          ...payload,
+          text: replaceKatexSyntax(payload.text),
+        })
 
-      return {
-        ...response,
-        data: {
-          ...response.data,
-          translations: response.data.translations.map(translation => ({
-            ...translation,
-            translatedText: replaceKatexSyntax([translation.translatedText], true)[0],
-          })),
-        },
-      }
-    })
+        return {
+          ...response,
+          data: {
+            ...response.data,
+            translations: response.data.translations.map((translation) => ({
+              ...translation,
+              translatedText: replaceKatexSyntax([translation.translatedText], true)[0],
+            })),
+          },
+        }
+      },
+    )
     this.textToSpeechTextFx = createEffect(api.postTextToSpeech)
   }
 }

package/src/features/chatbot/model/messagesHelper.ts

@@ -0,0 +1,48 @@
+import { generateRandomId } from '../../../lib/helpers/helpers'
+import { ConversationMessage, CreateMessageResponse } from '../types/model.types'
+
+type OwnMessageProps = {
+  message?: string
+  translatedMessage?: string
+  threadId?: string | null
+}
+
+export class messagesHelper {
+  public static createAnswer(data: CreateMessageResponse): ConversationMessage {
+    return {
+      id: generateRandomId(),
+      isOwnMessage: false,
+      message: data.message,
+      threadId: data.threadId,
+      options: data.options,
+      translatedMessage: data.translatedMessage,
+    }
+  }
+
+  public static createLast(data: CreateMessageResponse) {
+    return {
+      id: generateRandomId(),
+      message: data.message,
+      translatedMessage: data.translatedMessage,
+      isOwnMessage: false,
+      options: [],
+      threadId: '',
+      endMessage: true,
+    }
+  }
+
+  public static createOwn({
+    message = '',
+    translatedMessage,
+    threadId,
+  }: OwnMessageProps): ConversationMessage {
+    return {
+      id: generateRandomId(),
+      message,
+      translatedMessage,
+      threadId: threadId || '',
+      isOwnMessage: true,
+      options: [],
+    }
+  }
+}

package/src/features/chatbot/model/translation.helpers.ts

@@ -0,0 +1,58 @@
+import {
+  AddTranslationToAlternativesProps,
+  GetOptionsProps,
+  GetOptionsResult,
+} from '../types/translation.types'
+import { ChatAnswer, GetAlternativesResponse } from '../types/api.types'
+
+export function getOptionsForTranslation({
+  lastMessage,
+  alternatives,
+}: GetOptionsProps): GetOptionsResult {
+  if (!lastMessage) return { lastMessage: null, alternatives: null }
+  if (!lastMessage.options.length) {
+    if (!alternatives) return { lastMessage: null, alternatives: null }
+    const hintAlternatives = alternatives.options.hints ?? []
+    const defaultAlternatives = alternatives.options.default ?? []
+    return {
+      lastMessage: null,
+      alternatives: {
+        hints: hintAlternatives.map(({ text }) => text),
+        default: defaultAlternatives.map(({ text }) => text),
+      },
+    }
+  }
+
+  return {
+    lastMessage: lastMessage.options.map(({ text }) => text),
+    alternatives: null,
+  }
+}
+
+export function addTranslationsToAlternative({
+  alternatives,
+  translatedHints,
+  translatedDefaults,
+}: AddTranslationToAlternativesProps): GetAlternativesResponse {
+  return {
+    ...alternatives,
+    options: {
+      ...alternatives.options,
+      hints: translatedHints.map((translatedText, index) => ({
+        ...alternatives.options.hints[index],
+        translatedText,
+      })),
+      default: translatedDefaults.map((translatedText, index) => ({
+        ...alternatives.options.default[index],
+        translatedText,
+      })),
+    },
+  }
+}
+
+export function addTranslationToOptions(options: ChatAnswer[], translations: string[]) {
+  return options.map((option, index) => ({
+    ...option,
+    translatedText: translations[index],
+  }))
+}