quickblox-react-ui-kit 0.2.3 → 0.2.5

package/src/Presentation/Views/Dialogs/useDialogsViewModel.ts

@@ -28,6 +28,9 @@ import { DialogType } from '../../../Domain/entity/DialogTypes';
 import { RemoveUsersFromTheDialogUseCase } from '../../../Domain/use_cases/RemoveUsersFromTheDialogUseCase';
 import { DialogEventInfo } from '../../../Domain/entity/DialogEventInfo';
 import { RemoteDataSource } from '../../../Data/source/remote/RemoteDataSource';
+import { GetUsersByIdsUseCase } from '../../../Domain/use_cases/GetUsersByIdsUseCase';
+import UsersRepository from '../../../Data/repository/UsersRepository';
+import { UserEntity } from '../../../Domain/entity/UserEntity';
 
 export default function useDialogsViewModel(
   currentContext: QBDataContextType,
@@ -43,7 +46,9 @@ export default function useDialogsViewModel(
 
   //
   const currentUserId =
-    currentContext.storage.REMOTE_DATA_SOURCE.authInformation?.userId;
+    currentContext.storage.REMOTE_DATA_SOURCE.authInformation?.userId || -1;
+  const currentUserName =
+    currentContext.storage.REMOTE_DATA_SOURCE.authInformation?.userName || '';
   // const currentContext = useQbInitializedDataContext();
   const remoteDataSourceMock: RemoteDataSource =
     currentContext.storage.REMOTE_DATA_SOURCE;
@@ -65,6 +70,49 @@ export default function useDialogsViewModel(
       'DialogsViewModel',
     );
 
+  async function getDialogs(currentPagination: Pagination) {
+    console.log('getDialogs in useDialogsViewModel');
+    console.log(
+      'EXECUTE USE CASES GET DIALOG WITH PAGINATION: ',
+      JSON.stringify(currentPagination),
+    );
+    setLoading(true);
+    const useCaseGetAllDialogs: GetAllDialogsUseCaseWithMock =
+      new GetAllDialogsUseCaseWithMock(
+        new DialogsRepository(
+          currentContext.storage.LOCAL_DATA_SOURCE,
+          remoteDataSourceMock,
+        ),
+        currentPagination,
+      );
+
+    await useCaseGetAllDialogs
+      ?.execute()
+      // eslint-disable-next-line promise/always-return
+      .then((result) => {
+        console.log('EXECUTE COMPLETED: ', JSON.stringify(currentPagination));
+        setDialogs([...(result.ResultData as PublicDialogEntity[])]);
+        setLoading(false);
+        setPagination(result.CurrentPagination);
+      })
+      .catch((e) => {
+        console.log('call catch....', JSON.stringify(e));
+        setError(`${(e as unknown as Error).message}`);
+        setLoading(false);
+      });
+    await useCaseSubscribeToDialogsUpdates?.execute((data) => {
+      try {
+        console.log('3.SUBSCRIBE EXECUTE in useDialogsViewModel:', data);
+        setDialogs([...(data as PublicDialogEntity[])]);
+        setLoading(false);
+        setError('');
+      } catch (e) {
+        console.log('catch error2');
+        setError('ERROR2!!!');
+      }
+    });
+  }
+
   const dialogUpdateHandler = (dialogInfo: DialogEventInfo) => {
     console.log('call dialogUpdateHandler in useDialogsViewModel');
     if (
@@ -89,9 +137,7 @@ export default function useDialogsViewModel(
             setNewDialog(updatedDialog);
           });
         }
-      }
-      //
-      if (
+      } else if (
         dialogInfo.notificationTypes === NotificationTypes.DELETE_LEAVE_DIALOG
       ) {
         if (
@@ -100,8 +146,23 @@ export default function useDialogsViewModel(
         ) {
           setNewDialog(undefined);
         }
+      } else if (
+        dialogInfo.notificationTypes === NotificationTypes.REMOVE_USER
+      ) {
+        if (
+          dialogInfo.messageInfo &&
+          dialogInfo.messageInfo.dialogId === newDialog?.id
+        ) {
+          setNewDialog(undefined);
+        }
+        getDialogs(pagination);
+      } else if (
+        dialogInfo.notificationTypes === NotificationTypes.NEW_DIALOG
+      ) {
+        // const pagination: Pagination = new Pagination();
+
+        getDialogs(pagination).catch();
       }
-      //
     }
   };
 
@@ -112,48 +173,6 @@ export default function useDialogsViewModel(
     });
 
   // eslint-disable-next-line @typescript-eslint/require-await
-  async function getDialogs(currentPagination: Pagination) {
-    console.log('getDialogs in useDialogsViewModel');
-    console.log(
-      'EXECUTE USE CASES GET DIALOG WITH PAGINATION: ',
-      JSON.stringify(currentPagination),
-    );
-    setLoading(true);
-    const useCaseGetAllDialogs: GetAllDialogsUseCaseWithMock =
-      new GetAllDialogsUseCaseWithMock(
-        new DialogsRepository(
-          currentContext.storage.LOCAL_DATA_SOURCE,
-          remoteDataSourceMock,
-        ),
-        currentPagination,
-      );
-
-    await useCaseGetAllDialogs
-      ?.execute()
-      // eslint-disable-next-line promise/always-return
-      .then((result) => {
-        console.log('EXECUTE COMPLETED: ', JSON.stringify(currentPagination));
-        setDialogs([...(result.ResultData as PublicDialogEntity[])]);
-        setLoading(false);
-        setPagination(result.CurrentPagination);
-      })
-      .catch((e) => {
-        console.log('call catch....', JSON.stringify(e));
-        setError(`${(e as unknown as Error).message}`);
-        setLoading(false);
-      });
-    await useCaseSubscribeToDialogsUpdates?.execute((data) => {
-      try {
-        console.log('3.SUBSCRIBE EXECUTE in useDialogsViewModel:', data);
-        setDialogs([...(data as PublicDialogEntity[])]);
-        setLoading(false);
-        setError('');
-      } catch (e) {
-        console.log('catch error2');
-        setError('ERROR2!!!');
-      }
-    });
-  }
 
   const release = () => {
     useCaseSubscribeToDialogsUpdates.release();
@@ -163,6 +182,31 @@ export default function useDialogsViewModel(
     setLoading(status);
   };
 
+  const getSenders = async (senders: number[]) => {
+    const getUsers: GetUsersByIdsUseCase = new GetUsersByIdsUseCase(
+      new UsersRepository(
+        currentContext.storage.LOCAL_DATA_SOURCE,
+        currentContext.storage.REMOTE_DATA_SOURCE,
+      ),
+      [...senders],
+    );
+
+    let userEntites: UserEntity[] = [];
+
+    await getUsers
+      .execute()
+      // eslint-disable-next-line promise/always-return
+      .then((data) => {
+        // eslint-disable-next-line prefer-destructuring
+        userEntites = data;
+      })
+      .catch((e) => {
+        console.log('have ERROR get users :', JSON.stringify(e));
+      });
+
+    return userEntites;
+  };
+
   const createDialog = async (
     dialogInfo: GroupDialogEntity,
   ): Promise<DialogEntity> => {
@@ -170,7 +214,7 @@ export default function useDialogsViewModel(
       'call createDialog in use case with params: ',
       JSON.stringify(dialogInfo),
     );
-
+    const textInformationMessage = `${currentUserName} create the chat`;
     const createDialogUseCase: CreateDialogUseCase = new CreateDialogUseCase(
       eventMessageRepository,
       new DialogsRepository(
@@ -178,6 +222,7 @@ export default function useDialogsViewModel(
         remoteDataSourceMock,
       ),
       dialogInfo,
+      textInformationMessage,
     );
     const resultDialog: DialogEntity = await createDialogUseCase
       .execute()
@@ -201,6 +246,7 @@ export default function useDialogsViewModel(
     // eslint-disable-next-line @typescript-eslint/no-shadow,@typescript-eslint/no-unused-vars
     dialog: GroupDialogEntity,
   ): Promise<DialogEntity> => {
+    const textInformationMessage = `${currentUserName} has updated dialog`;
     const updateDialogUseCase: UpdateDialogUseCase = new UpdateDialogUseCase(
       eventMessageRepository,
       new DialogsRepository(
@@ -208,6 +254,7 @@ export default function useDialogsViewModel(
         remoteDataSourceMock,
       ),
       dialog,
+      textInformationMessage,
     );
 
     const resultDialog: DialogEntity = await updateDialogUseCase
@@ -242,6 +289,7 @@ export default function useDialogsViewModel(
     let leaveResult = false;
 
     if (dialogToDelete.type === DialogType.private) {
+      const textInformationMessage = `${currentUserName} has left dialog`;
       const leaveDialogUseCase: LeaveDialogUseCase = new LeaveDialogUseCase(
         eventMessageRepository,
         new DialogsRepository(
@@ -250,6 +298,7 @@ export default function useDialogsViewModel(
         ),
         dialogToDelete,
         DialogLeaveType.delete,
+        textInformationMessage,
       );
 
       leaveResult = await leaveDialogUseCase.execute().catch((e) => {
@@ -263,6 +312,7 @@ export default function useDialogsViewModel(
         remoteDataSourceMock?.authInformation?.userId || 0;
 
       usersForDeleteFromDialog.push(userToDeleteId);
+      const textInformationMessage = `${currentUserName} has left dialog`;
       const deleteUsersFromDialog: RemoveUsersFromTheDialogUseCase =
         new RemoveUsersFromTheDialogUseCase(
           eventMessageRepository,
@@ -272,6 +322,7 @@ export default function useDialogsViewModel(
           ),
           dialogToDelete,
           usersForDeleteFromDialog,
+          textInformationMessage,
         );
 
       leaveResult = await deleteUsersFromDialog.execute().catch((e) => {
@@ -297,6 +348,15 @@ export default function useDialogsViewModel(
       dialog.participantsToRemoveIds &&
       dialog.participantsToRemoveIds.length > 0
     ) {
+      const usersToDelete: UserEntity[] = await getSenders(
+        dialog.participantsToRemoveIds,
+      );
+      let userNames = '';
+
+      usersToDelete.forEach((u) => {
+        userNames += u.login || u.full_name || u.email;
+      });
+      const textInformationMessage = `${currentUserName} remove ${userNames}`;
       const deleteUsersFromDialog: RemoveUsersFromTheDialogUseCase =
         new RemoveUsersFromTheDialogUseCase(
           eventMessageRepository,
@@ -306,6 +366,7 @@ export default function useDialogsViewModel(
           ),
           dialog,
           dialog.participantsToRemoveIds,
+          textInformationMessage,
         );
 
       leaveResult = await deleteUsersFromDialog.execute().catch((e) => {

package/src/Presentation/assets/styles/_variables.scss

@@ -1,2 +1,21 @@
 @import "theme_light";
 @import "theme_dark";
+
+/* Fonts */
+:root{
+  --title-title-large: 500 20px/24px "Roboto", sans-serif;
+  --title-title-medium: 500 16px/24px "Roboto", sans-serif;
+  --title-title-small: 500 14px/20px "Roboto", sans-serif;
+  --label-label-large: 500 14px/20px "Roboto", sans-serif;
+  --label-label-medium: 500 12px/16px "Roboto", sans-serif;
+  --label-label-small: 500 11px/16px "Roboto", sans-serif;
+  --body-body-large: 400 16px/24px "Roboto", sans-serif;
+  --body-body-medium: 400 14px/20px "Roboto", sans-serif;
+  --body-body-small: 400 12px/16px "Roboto", sans-serif;
+  --button-fab: 500 14px/16px "Roboto", sans-serif;
+  --button-default: 700 14px/16px "Roboto", sans-serif;
+  --ui-kit-header: 500 48px "Roboto Mono", sans-serif;
+  --ui-kit-title: 500 32px "Roboto Mono", sans-serif;
+  --ui-kit-body: 400 17px "Roboto Mono", sans-serif;
+}
+

package/src/Presentation/components/UI/Buttons/MainButton/MainButton.scss

@@ -31,6 +31,9 @@
 
   /* Light UiKitTheme/System */
   color: var(--main-background);
+
+  border: none;
+  outline: none;
 }
 
 .danger-button {
@@ -61,6 +64,9 @@
   letter-spacing: 0.4px;
   /* Light UiKitTheme/System */
   color: var(--main-background);
+
+  border: none;
+  outline: none;
 }
 
 .secondary-button{
@@ -124,4 +130,7 @@
   letter-spacing: 0.4px;
   /* Light UiKitTheme/Secondary text */
   color: var(--secondary-text);
+
+  border: none;
+  outline: none;
 }

package/src/Presentation/components/UI/Dialogs/EditDialog/EditDialog.scss

@@ -190,6 +190,9 @@ $create-dialog-container-height: 180px;
         display: flex;
         align-items: center;
         letter-spacing: 0.15px;
+
+        border: none;
+        outline: none;
       }
     }
   }

package/src/Presentation/components/UI/Dialogs/InviteMembers/InviteMembers.scss

@@ -114,6 +114,9 @@ $create-dialog-container-height: 412px;
           display: flex;
           align-items: center;
           letter-spacing: 0.15px;
+
+          border: none;
+          outline: none;
         }
 
       }

package/src/Presentation/components/UI/Dialogs/MembersList/MembersList.scss

@@ -114,6 +114,9 @@ $members-list-container-height: 800px;
         display: flex;
         align-items: center;
         letter-spacing: 0.15px;
+
+        border: none;
+        outline: none;
       }
 
     }

package/src/Presentation/components/UI/Dialogs/MessagesView/AIWidgets/AIMessageWidget.ts

@@ -1,8 +1,9 @@
 import {
   FunctionTypeFileWithContextToToVoid,
   FunctionTypeJSXElement,
-  FunctionTypeStringWithContextToString,
+  FunctionTypeStringWithContextToString, FunctionTypeVoidToTones,
 } from '../../../../../Views/Base/BaseViewModel';
+import {Tone} from "./Tone";
 
 export interface MessageWidgetProps {
   // https://api.openai.com/v1/chat/completions'
@@ -29,7 +30,11 @@ export interface AIFileWidget extends AIWidget {
 export interface AIMessageWidget extends AITextWidget {
   textToWidget: FunctionTypeStringWithContextToString;
 }
-
+//
+export interface AIRephraseWidget extends AIMessageWidget {
+  tonesToWidget: FunctionTypeVoidToTones;
+}
+//
 export interface AIAttachmentWidget extends AIFileWidget {
   fileToWidget: FunctionTypeFileWithContextToToVoid;
 }

package/src/Presentation/components/UI/Dialogs/MessagesView/AIWidgets/AIWidgetActions/AIWidgetActions.tsx

@@ -2,7 +2,7 @@ import React, { useState, CSSProperties, useRef, useEffect } from 'react';
 import './AIWidgetActions.scss';
 import EditDots from '../../../../svgs/Icons/Actions/EditDots';
 
-type MenuItem = {
+export type MenuItem = {
   title: string;
   icon?: JSX.Element; // Добавлено поле для иконки пункта меню
   action: () => void;
@@ -12,6 +12,7 @@ type ContextMenuProps = {
   widgetToRender?: JSX.Element;
   items?: MenuItem[];
   title?: string | null;
+  disabled?: boolean;
 };
 
 const ContextMenuStyles: { [key: string]: CSSProperties } = {
@@ -20,7 +21,7 @@ const ContextMenuStyles: { [key: string]: CSSProperties } = {
     position: 'relative',
     maxWidth: '42px',
     maxHeight: '42px',
-    cursor: 'pointer',
+    // cursor: 'pointer',
   },
   contextMenuContent: {
     position: 'absolute',
@@ -50,12 +51,13 @@ function AIWidgetActions({
   items,
   widgetToRender,
   title = null,
+  disabled = true,
 }: ContextMenuProps) {
   const [menuVisible, setMenuVisible] = useState(false);
   const contextMenuRef = useRef<HTMLDivElement | null>(null);
 
   const handleClick = () => {
-    setMenuVisible(!menuVisible);
+    if (disabled) setMenuVisible(!menuVisible);
   };
 
   const handleMenuItemClick = (action: () => void) => {
@@ -85,7 +87,11 @@ function AIWidgetActions({
       <div onClick={handleClick}>{widgetToRender || <EditDots />}</div>
       {menuVisible && (
         // <div ref={contextMenuRef} style={ContextMenuStyles.contextMenuContent}>
-        <div ref={contextMenuRef} className="dropdown-context-menu-tone">
+        <div
+          ref={contextMenuRef}
+          className="dropdown-context-menu-tone"
+          style={{ cursor: 'pointer' }}
+        >
           {title && <div style={ContextMenuStyles.menuTitle}>{title}</div>}
           {items?.map((item, index) => (
             <div

package/src/Presentation/components/UI/Dialogs/MessagesView/AIWidgets/Tone.ts

@@ -1,21 +1,35 @@
-export enum Tone {
-  Professional = 'Professional Tone',
-  Friendly = 'Friendly Tone',
-  Encouraging = 'Encouraging Tone',
-  Empathetic = 'Empathetic Tone',
-  Neutral = 'Neutral Tone',
-  Assertive = 'Assertive Tone',
-  Instructive = 'Instructive Tone',
-  Persuasive = 'Persuasive Tone',
-  Sarcastic = 'Sarcastic/Ironic Tone',
-  Poetic = 'Poetic Tone',
-  Unchanged = 'Unchanged',
+// export enum Tone {
+//   Professional = 'Professional Tone',
+//   Friendly = 'Friendly Tone',
+//   Encouraging = 'Encouraging Tone',
+//   Empathetic = 'Empathetic Tone',
+//   Neutral = 'Neutral Tone',
+//   Assertive = 'Assertive Tone',
+//   Instructive = 'Instructive Tone',
+//   Persuasive = 'Persuasive Tone',
+//   Sarcastic = 'Sarcastic/Ironic Tone',
+//   Poetic = 'Poetic Tone',
+//   Unchanged = 'Unchanged',
+// }
+
+export interface Tone {
+  name: string;
+  description: string;
+  iconEmoji: string;
 }
 
 export const toneToString = (tone: Tone): string => {
-  return tone;
+  return tone.name;
 };
 
-export const stringToTone = (toneStr: string): Tone | undefined => {
-  return Tone[toneStr as keyof typeof Tone];
+export const stringToTone = (
+  toneStr: string,
+  description?: string,
+  emoji?: string,
+): Tone | undefined => {
+  return {
+    name: toneStr,
+    description: description || '',
+    iconEmoji: emoji || '',
+  };
 };

package/src/Presentation/components/UI/Dialogs/MessagesView/AIWidgets/UseDefaultAIAssistAnswerWidget.tsx

@@ -2,7 +2,8 @@ import { useState } from 'react';
 import { AIMessageWidget, MessageWidgetProps } from './AIMessageWidget';
 import AIWidgetIcon from '../../../svgs/Icons/AIWidgets/AIWidget';
 import ErrorMessageIcon from './ErrorMessageIcon';
-import { AISource, IChatMessage } from '../../../../../../Data/source/AISource';
+import { IChatMessage } from '../../../../../../Data/source/AISource';
+import { AIAnswerAssistUseCase } from '../../../../../../Domain/use_cases/ai/AIAnswerAssistUseCase';
 
 // interface MessageWidgetProps {
 //   // https://api.openai.com/v1/chat/completions'
@@ -50,18 +51,21 @@ export default function UseDefaultAIAssistAnswerWidget({
     context: IChatMessage[],
   ): Promise<string> => {
     if (textToSend && textToSend.length > 0) {
-      const prompt = `You are a customer support chat operator. Your goal is to provide helpful and informative responses to customer inquiries. Give a response to the next user's query, considering the entire conversation context, and use grammar and vocabulary at the A2-B2 level. Answer in the format of simple sentences. Do not include question in answer. Please, provide answer for this issue:"${textToSend}"`;
+      const openAIModel = 'gpt-3.5-turbo';
 
-      // eslint-disable-next-line no-return-await
-      return await AISource.getData(
-        prompt,
+      const useCaseAIAnswerAssist = new AIAnswerAssistUseCase(
+        textToSend,
         // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
         context,
         servername,
         api,
         port,
         apiKeyOrSessionToken,
-      ).then((data) => {
+        openAIModel,
+      );
+
+      // eslint-disable-next-line no-return-await
+      return await useCaseAIAnswerAssist.execute().then((data) => {
         setTextFromWidgetToContent(data);
 
         return data;

package/src/Presentation/components/UI/Dialogs/MessagesView/AIWidgets/UseDefaultAIAssistAnswerWidgetWithProxy.tsx

@@ -2,7 +2,8 @@ import { useState } from 'react';
 import { AIMessageWidget, MessageWidgetProps } from './AIMessageWidget';
 import AIWidgetIcon from '../../../svgs/Icons/AIWidgets/AIWidget';
 import ErrorMessageIcon from './ErrorMessageIcon';
-import { AISource, IChatMessage } from '../../../../../../Data/source/AISource';
+import { IChatMessage } from '../../../../../../Data/source/AISource';
+import { AIAnswerAssistWithProxyUseCase } from '../../../../../../Domain/use_cases/ai/AIAnswerAssistWithProxyUseCase';
 
 // interface MessageWidgetProps {
 //   // https://api.openai.com/v1/chat/completions'
@@ -50,18 +51,21 @@ export default function UseDefaultAIAssistAnswerWidgetWithProxy({
     context: IChatMessage[],
   ): Promise<string> => {
     if (textToSend && textToSend.length > 0) {
-      const prompt = `You are a customer support chat operator. Your goal is to provide helpful and informative responses to customer inquiries. Give a response to the next user's query, considering the entire conversation context, and use grammar and vocabulary at the A2-B2 level. Answer in the format of simple sentences. Do not include question in answer. Please, provide answer for this issue:"${textToSend}"`;
+      const openAIModel = 'gpt-3.5-turbo';
 
-      // eslint-disable-next-line no-return-await
-      return await AISource.getDataWithProxyServer(
-        prompt,
+      const useCaseAIAnswerAssist = new AIAnswerAssistWithProxyUseCase(
+        textToSend,
         // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
         context,
         servername,
         api,
         port,
         apiKeyOrSessionToken,
-      ).then((data) => {
+        openAIModel,
+      );
+
+      // eslint-disable-next-line no-return-await
+      return await useCaseAIAnswerAssist.execute().then((data) => {
         setTextFromWidgetToContent(data);
 
         return data;

package/src/Presentation/components/UI/Dialogs/MessagesView/AIWidgets/UseDefaultAIRephraseMessageWidget.tsx

@@ -79,9 +79,26 @@ export default function UseDefaultAIRephraseMessageWidget({
     return '';
   };
 
+  // const tonesToWidget = (): Tone[] => {
+  //   return [
+  //     Tone.Professional,
+  //     Tone.Friendly,
+  //     Tone.Encouraging,
+  //     Tone.Empathetic,
+  //     Tone.Assertive,
+  //     Tone.Neutral,
+  //     Tone.Instructive,
+  //     Tone.Persuasive,
+  //     Tone.Sarcastic,
+  //     Tone.Poetic,
+  //     Tone.Unchanged,
+  //   ];
+  // };
+
   return {
     textToContent: textFromWidgetToContent,
     renderWidget,
     textToWidget,
+    // tonesToWidget,
   };
 }

package/src/Presentation/components/UI/Dialogs/MessagesView/AIWidgets/UseDefaultAIRephraseMessageWidgetWithProxy.tsx

@@ -77,10 +77,26 @@ export default function UseDefaultAIRephraseMessageWidgetWithProxy({
     //
     return '';
   };
+  // const tonesToWidget = (): Tone[] => {
+  //   return [
+  //     Tone.Professional,
+  //     Tone.Friendly,
+  //     Tone.Encouraging,
+  //     Tone.Empathetic,
+  //     Tone.Assertive,
+  //     Tone.Neutral,
+  //     Tone.Instructive,
+  //     Tone.Persuasive,
+  //     Tone.Sarcastic,
+  //     Tone.Poetic,
+  //     Tone.Unchanged,
+  //   ];
+  // };
 
   return {
     textToContent: textFromWidgetToContent,
     renderWidget,
     textToWidget,
+    // tonesToWidget,
   };
 }

package/src/Presentation/components/UI/Dialogs/MessagesView/AIWidgets/UseDefaultAITranslateWidget.tsx

@@ -2,7 +2,8 @@ import { useState } from 'react';
 import AIWidgetIcon from '../../../svgs/Icons/AIWidgets/AIWidget';
 import ErrorMessageIcon from './ErrorMessageIcon';
 import { AIMessageWidget, MessageWidgetProps } from './AIMessageWidget';
-import { AISource, IChatMessage } from '../../../../../../Data/source/AISource';
+import { IChatMessage } from '../../../../../../Data/source/AISource';
+import { AITranslateUseCase } from '../../../../../../Domain/use_cases/ai/AITranslateUseCase';
 
 // interface MessageWidgetProps {
 //   // https://api.openai.com/v1/chat/completions'
@@ -52,25 +53,25 @@ export default function UseDefaultAITranslateWidget({
   ): Promise<string> => {
     if (textToSend && textToSend.length > 0) {
       // eslint-disable-next-line no-return-await
-      let prompt = `Please, translate the next text in english and give me just only translated text. Text to translate is: "${textToSend}"`;
       const { language } = additionalSettings || {};
+      //
+      const openAIModel = 'gpt-3.5-turbo';
 
-      if (language) {
-        prompt = `Please, translate the next text in ${
-          language as string
-        } and give me just only translated text. Text to translate is: "${textToSend}"`;
-      }
-
-      // eslint-disable-next-line no-return-await
-      return await AISource.getData(
-        prompt,
+      // AIRephraseWithProxyUseCase
+      const useCaseAITranslate = new AITranslateUseCase(
+        textToSend,
         // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
+        language,
         context,
         servername,
         api,
         port,
         apiKeyOrSessionToken,
-      ).then((data) => {
+        openAIModel,
+      );
+
+      // eslint-disable-next-line no-return-await
+      return await useCaseAITranslate.execute().then((data) => {
         setTextFromWidgetToContent(data);
 
         return data;