quickblox-react-ui-kit 0.3.0 → 0.3.1-beta.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "quickblox-react-ui-kit",
-  "version": "0.3.0",
+  "version": "0.3.1-beta.2",
   "main": "dist/index-ui.js",
   "license": "MIT",
   "dependencies": {
@@ -12,6 +12,7 @@
     "qb-ai-core": "^0.1.3",
     "qb-ai-rephrase": "^0.1.2",
     "qb-ai-translate": "^0.1.2",
+    "quickblox": "^2.16.3",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-router-dom": "^6.11.1",
@@ -86,6 +87,7 @@
     "lint": "eslint ./src",
     "eject": "react-scripts eject",
     "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build",
     "build:storybook": "storybook build"
   },
   "lint-staged": {

package/src/App.tsx

@@ -1,6 +1,7 @@
 import React, { useEffect } from 'react';
 import './App.scss';
 import { Route, Routes, useNavigate } from 'react-router-dom';
+import QB from 'quickblox/quickblox';
 import useQBConnection from './Presentation/providers/QuickBloxUIKitProvider/useQBConnection';
 import { LocalDataSource } from './Data/source/local/LocalDataSource';
 import Login from './Presentation/layouts/TestStage/LoginView/Login';
@@ -27,8 +28,8 @@ function App() {
   const { connectionRepository } = useQBConnection();
 
   const initLoginData: LoginData = {
-    login: '',
-    password: '',
+    login: 'artimed',
+    password: 'quickblox',
   };
 
   const [currentUser, setCurrentUser] = React.useState(initLoginData);

package/src/CommonTypes/CommonTypes.ts

@@ -0,0 +1,229 @@
+import {
+  QBSystemMessage,
+  QBUser,
+  ChatMessageAttachment,
+  QBChatDialog,
+  QBChatNewMessage,
+  QBConfig,
+  QBCustomField,
+} from 'quickblox';
+import { Tone } from '../Presentation/Views/Dialog/AIWidgets/Tone';
+
+export type ProxyConfig = {
+  api: string;
+  servername: string;
+  port: string;
+};
+export interface WidgetConfig {
+  organizationName: string;
+  openAIModel: string;
+  apiKey: string;
+  maxTokens: number;
+  useDefault: boolean;
+  proxyConfig: ProxyConfig;
+}
+
+export interface AITranslateWidgetConfig extends WidgetConfig {
+  defaultLanguage: string;
+  languages: string[];
+}
+
+export interface AIRephraseWidgetConfig extends WidgetConfig {
+  defaultTone: string;
+  Tones: Tone[];
+}
+
+export interface QBUIKitConfig extends QBConfig {
+  credentials: {
+    appId: number;
+    accountKey: string;
+    authKey: string;
+    authSecret: string;
+    sessionToken: string;
+  };
+  configAIApi: {
+    AIAnswerAssistWidgetConfig: WidgetConfig;
+    AITranslateWidgetConfig: AITranslateWidgetConfig;
+    AIRephraseWidgetConfig: AIRephraseWidgetConfig;
+  };
+  appConfig: {
+    maxFileSize: number;
+    sessionTimeOut: number;
+    chatProtocol: {
+      active: number;
+    };
+    debug: boolean;
+    enableForwarding: boolean;
+    enableReplying: boolean;
+    regexUserName?: string;
+    endpoints: {
+      api: string;
+      chat: string;
+    };
+    // on: {
+    //   sessionExpired: (handleResponse: any, retry: any) => Promise<void>;
+    // };
+    streamManagement: {
+      enable: boolean;
+    };
+  };
+}
+
+interface QBSystemMessageExtension {
+  [key: string]: string | undefined;
+  notification_type: string;
+  action?: 'read' | 'delete';
+}
+
+export interface QBUIKitSystemMessage extends QBSystemMessage {
+  // id: string;
+  // userId: QBUser['id'];
+  // body: null | string;
+  extension?: QBSystemMessageExtension | Dictionary<any> | undefined;
+}
+
+// type Primitive = string | number | boolean | undefined | null | Date | File;
+
+// type SetTails<T, R extends Primitive> = T extends Array<unknown>
+//   ? Array<T[number] extends Primitive ? R : SetTails<T[number], R>>
+//   : {
+//       [K in keyof T]: T[K] extends Primitive ? R : SetTails<T[K], R>;
+//     };
+
+// interface QBConfig {
+//   credentials: {
+//     appId: number;
+//     accountKey: string;
+//     authKey: string;
+//     authSecret: string;
+//     sessionToken: string; // ??? ui-kit
+//   };
+//   configAIApi: {
+//     // ui-kit
+//     AIAnswerAssistWidgetConfig: WidgetConfig;
+//     AITranslateWidgetConfig: AITranslateWidgetConfig;
+//     AIRephraseWidgetConfig: AIRephraseWidgetConfig;
+//   };
+//   appConfig: {
+//     maxFileSize: number; // ui-kit
+//     sessionTimeOut: number; // ?? webRTc -> ui-kit
+//     chatProtocol: {
+//       active: number;
+//     };
+//     debug: boolean;
+//     enableForwarding: boolean; // ui-kit
+//     enableReplying: boolean; // ui-kit
+//     regexUserName?: string; // ui-kit
+//     endpoints: {
+//       api: string;
+//       chat: string;
+//     };
+//     // on: {
+//     //   sessionExpired: (handleResponse: any, retry: any) => Promise<void>;
+//     // };
+//     streamManagement: {
+//       enable: boolean;
+//     };
+//   };
+// }
+
+/*
+    * QuickBlox Types - start
+
+ */
+
+// type Dictionary<T> = Record<string, T>;
+//
+// type RequiredProps<T, K extends keyof T> = T & Required<Pick<T, K>>;
+//
+// declare enum QBChatProtocol {
+//   BOSH = 1,
+//   WebSockets = 2,
+// }
+//
+// interface ICEServer {
+//   urls: string;
+//   username: string;
+//   credential: string;
+// }
+
+export enum QBChatDialogType {
+  PUBLIC_GROUP = 1,
+  GROUP = 2,
+  PRIVATE = 3,
+}
+
+export interface QBUIKitChatDialog extends QBChatDialog {
+  /** ID of the dialog. Generated automatically by the server after dialog creation. */
+  _id: string;
+  /** ID of dialog's owner. */
+  user_id: QBUser['id'];
+  /** Date & time when a record was created, filled automatically. */
+  created_at: string;
+  /** Date & time when a record was created, filled automatically. */
+  updated_at: string;
+  /**
+   * Type of dialog. Possible values are:
+   * - type=1 (`PUBLIC_GROUP`)
+   * - type=2 (`GROUP`)
+   * - type=3 (`PRIVATE`)
+   */
+  type: QBChatDialogType;
+  /**
+   * Name of a group chat. Makes sense if type=1 (`PUBLIC_GROUP`) or type=2 (`GROUP`).
+   * The maximum length for the dialog name is 200 symbols.
+   */
+  name: string;
+  /**
+   * Photo of a group chat. Makes sense if type=1 (`PUBLIC_GROUP`) or type=2 (`GROUP`).
+   * Can contain a link to a file in Content module, Custom Objects module or just a web link.
+   */
+  photo: null | string;
+  /**
+   * JID of XMPP room for group chat to connect. Nil if type=3 (PRIVATE).
+   * Generated automatically by the server after dialog creation.
+   */
+  xmpp_room_jid: string | null;
+  /** Array of users' IDs - dialog occupants. Does not make sense if type=1 (PUBLIC_GROUP). */
+  occupants_ids: number[];
+  /** Last sent message in this dialog. */
+  last_message: string | null;
+  /** Timestamp of last sent message in this dialog. */
+  last_message_date_sent: number | null;
+  /** ID of the user who sent last message in this dialog. */
+  last_message_user_id: QBUser['id'] | null;
+  /** ID of last message in this dialog. */
+  last_message_id: string | null;
+  /** Number of unread messages in this dialog for a current user. */
+  unread_messages_count: number | null;
+  /**
+   * - Information about class and fields in Custom Objects.
+   * - Any dialog can be extended using Custom Objects to store additional parameters.
+   */
+  data?: {
+    /** Class name in Custom Objects. */
+    class_name: string;
+    /** Field name of class in Custom Objects. Can be many: 1..N. */
+    [field_name_N: string]: QBCustomField;
+  };
+  new_occupants_ids?: number[]; // TODO: EXTENDS TYPE AND SWITCH TO THIS NEW TYPE
+  joined?: boolean; // TODO: EXTENDS TYPE AND SWITCH TO THIS NEW TYPE
+}
+
+export interface QBUIKitChatNewMessage extends QBChatNewMessage {
+  type: 'chat' | 'groupchat';
+  body: string;
+  notification_type?: string; // TODO: NED ADD TO TYPE
+  dialog_id: QBChatDialog['_id']; // TODO: NED ADD TO TYPE
+  extension: {
+    attachments?: ChatMessageAttachment[];
+    save_to_history: 0 | 1;
+    dialog_id: QBChatDialog['_id'];
+    notification_type?: string; // TODO: NED ADD TO TYPE
+    sender_id?: QBUser['id']; // TODO: NED ADD TO TYPE
+    qb_message_action?: 'forward' | 'reply'; // TODO: NED ADD TO TYPE
+    origin_sender_name?: string; // TODO: NED ADD TO TYPE
+    qb_original_messages?: string; // TODO: NED ADD TO TYPE
+  };
+  markable: 0 | 1;
+}

package/src/CommonTypes/FunctionResult.ts

@@ -5,62 +5,3 @@ export type FunctionResult<T> = {
   error: any;
 };
 
-export type ProxyConfig = {
-  api: string;
-  servername: string;
-  port: string;
-};
-export interface WidgetConfig {
-  organizationName: string;
-  openAIModel: string;
-  apiKey: string;
-  maxTokens: number;
-  useDefault: boolean;
-  proxyConfig: ProxyConfig;
-}
-
-export interface AITranslateWidgetConfig extends WidgetConfig {
-  defaultLanguage: string;
-  languages: string[];
-}
-
-export interface AIRephraseWidgetConfig extends WidgetConfig {
-  defaultTone: string;
-  Tones: Tone[];
-}
-
-export interface QBConfig {
-  credentials: {
-    appId: number;
-    accountKey: string;
-    authKey: string;
-    authSecret: string;
-    sessionToken: string;
-  };
-  configAIApi: {
-    AIAnswerAssistWidgetConfig: WidgetConfig;
-    AITranslateWidgetConfig: AITranslateWidgetConfig;
-    AIRephraseWidgetConfig: AIRephraseWidgetConfig;
-  };
-  appConfig: {
-    maxFileSize: number;
-    sessionTimeOut: number;
-    chatProtocol: {
-      active: number;
-    };
-    debug: boolean;
-    enableForwarding: boolean;
-    enableReplying: boolean;
-    regexUserName?: string;
-    endpoints: {
-      api: string;
-      chat: string;
-    };
-    // on: {
-    //   sessionExpired: (handleResponse: any, retry: any) => Promise<void>;
-    // };
-    streamManagement: {
-      enable: boolean;
-    };
-  };
-}

package/src/Data/Creator.ts

@@ -1,3 +1,4 @@
+import QB from 'quickblox/quickblox';
 import ChatMessageAttachmentEntity from '../Domain/entity/ChatMessageAttachmentEntity';
 import { DialogType } from '../Domain/entity/DialogTypes';
 import { MessageEntity } from '../Domain/entity/MessageEntity';

package/src/Data/DefaultConfigurations.ts

@@ -1,4 +1,8 @@
-import { ProxyConfig, QBConfig } from '../CommonTypes/FunctionResult';
+import {
+  AITranslateWidgetConfig,
+  ProxyConfig,
+  QBUIKitConfig,
+} from '../CommonTypes/CommonTypes';
 
 const supportedLanguagesForIATranslate: string[] = [
   'English',
@@ -130,7 +134,7 @@ export class DefaultConfigurations {
   }
 
   //
-  static getDefaultQBConfig(): QBConfig {
+  static getDefaultQBConfig(): QBUIKitConfig {
     return {
       credentials: {
         appId: -1,

package/src/Data/Stubs.ts

@@ -20,6 +20,7 @@ import { MessageLocalDTOMapper } from './mapper/MessageLocalDTOMapper';
 import { LocalMessageDTO } from './dto/message/LocalMessageDTO';
 import { LocalDataSource } from './source/local/LocalDataSource';
 import { FileEntity } from '../Domain/entity/FileEntity';
+import { QBUIKitChatDialog } from '../CommonTypes/CommonTypes';
 
 export class Stubs {
   static createMessageEntityWithParams(
@@ -104,10 +105,9 @@ export class Stubs {
     for (const item of dialogsEntities) {
       const dialogDTO: LocalDialogDTO =
         // eslint-disable-next-line no-await-in-loop
-        await dialogsDTOtoEntityMapper.fromEntity<
-          DialogEntity,
-          RemoteDialogDTO
-        >(item);
+        await dialogsDTOtoEntityMapper.fromEntity<DialogEntity, LocalDialogDTO>(
+          item,
+        );
 
       // eslint-disable-next-line @typescript-eslint/no-unused-vars,promise/catch-or-return,promise/always-return
       ds.saveDialog(dialogDTO)
@@ -379,7 +379,7 @@ export class Stubs {
           '',
           '_',
           {
-            dateSent: '',
+            dateSent: 0,
             text: '',
             userId: 0,
           },
@@ -395,7 +395,7 @@ export class Stubs {
           { todo: '' },
           '',
           {
-            dateSent: '',
+            dateSent: 0,
             text: '',
             userId: 0,
           },
@@ -412,7 +412,7 @@ export class Stubs {
           { todo: '' },
           '',
           {
-            dateSent: '',
+            dateSent: 0,
             text: '',
             userId: 0,
           },
@@ -430,7 +430,7 @@ export class Stubs {
           customData: { todo: '' },
           id: '',
           name: '_',
-          lastMessage: { dateSent: '', text: '', userId: 0 },
+          lastMessage: { dateSent: 0, text: '', userId: 0 },
           ownerId: '',
           type: -1,
           unreadMessageCount: 0,
@@ -461,7 +461,7 @@ export class Stubs {
           '111',
           '_111',
           {
-            dateSent: '01.02.2023',
+            dateSent: 0,
             text: 'text test',
             userId: 777,
           },
@@ -477,7 +477,7 @@ export class Stubs {
           { todo: '' },
           '111',
           {
-            dateSent: '01.02.2023',
+            dateSent: 0,
             text: 'text test',
             userId: 777,
           },
@@ -494,7 +494,7 @@ export class Stubs {
           { todo: '' },
           '111',
           {
-            dateSent: '01.02.2023',
+            dateSent: 0,
             text: 'text test',
             userId: 777,
           },
@@ -513,7 +513,7 @@ export class Stubs {
           id: '111',
           name: '_111',
           lastMessage: {
-            dateSent: '01.02.2023',
+            dateSent: 0,
             text: 'text test',
             userId: 777,
           },
@@ -534,9 +534,9 @@ export class Stubs {
     switch (dialogType) {
       case DialogType.private:
         dto.id = '111';
-        dto.lastMessageDateSent = '01.02.2023';
+        dto.lastMessageDateSent = 0;
         dto.lastMessageText = 'text test';
-        dto.lastMessageUserId = '777';
+        dto.lastMessageUserId = 777;
         dto.ownerId = '999';
         dto.type = dialogType;
         dto.unreadMessageCount = 555;
@@ -545,9 +545,9 @@ export class Stubs {
         break;
       case DialogType.public:
         dto.id = '111';
-        dto.lastMessageDateSent = '01.02.2023';
+        dto.lastMessageDateSent = 0;
         dto.lastMessageText = 'text test';
-        dto.lastMessageUserId = '777';
+        dto.lastMessageUserId = 777;
         dto.ownerId = '999';
         dto.type = dialogType;
         dto.unreadMessageCount = 555;
@@ -557,9 +557,9 @@ export class Stubs {
         break;
       case DialogType.group:
         dto.id = '111';
-        dto.lastMessageDateSent = '01.02.2023';
+        dto.lastMessageDateSent = 0;
         dto.lastMessageText = 'text test';
-        dto.lastMessageUserId = '777';
+        dto.lastMessageUserId = 777;
         dto.ownerId = '999';
         dto.type = dialogType;
         dto.unreadMessageCount = 555;
@@ -602,8 +602,8 @@ export class Stubs {
         participantId: '',
         participantsIds: [],
         lastMessageText: '',
-        lastMessageDateSent: '',
-        lastMessageUserId: '',
+        lastMessageDateSent: 0,
+        lastMessageUserId: 0,
         lastMessageId: '',
         unreadMessageCount: 0,
         updatedAt: '',
@@ -617,8 +617,8 @@ export class Stubs {
         participantId: '',
         participantsIds: [],
         lastMessageText: '',
-        lastMessageDateSent: '',
-        lastMessageUserId: '',
+        lastMessageDateSent: 0,
+        lastMessageUserId: 0,
         lastMessageId: '',
         unreadMessageCount: 0,
         updatedAt: '',
@@ -632,8 +632,8 @@ export class Stubs {
         participantId: '',
         participantsIds: [],
         lastMessageText: '',
-        lastMessageDateSent: '',
-        lastMessageUserId: '',
+        lastMessageDateSent: 0,
+        lastMessageUserId: 0,
         lastMessageId: '',
         unreadMessageCount: 0,
         updatedAt: '',
@@ -647,8 +647,8 @@ export class Stubs {
         participantId: '',
         participantsIds: [],
         lastMessageText: '',
-        lastMessageDateSent: '',
-        lastMessageUserId: '',
+        lastMessageDateSent: 0,
+        lastMessageUserId: 0,
         lastMessageId: '',
         unreadMessageCount: 0,
         updatedAt: '',
@@ -662,8 +662,8 @@ export class Stubs {
         participantId: '',
         participantsIds: [],
         lastMessageText: '',
-        lastMessageDateSent: '',
-        lastMessageUserId: '',
+        lastMessageDateSent: 0,
+        lastMessageUserId: 0,
         lastMessageId: '',
         unreadMessageCount: 0,
         updatedAt: '',
@@ -677,8 +677,8 @@ export class Stubs {
         participantId: '',
         participantsIds: [],
         lastMessageText: '',
-        lastMessageDateSent: '',
-        lastMessageUserId: '',
+        lastMessageDateSent: 0,
+        lastMessageUserId: 0,
         lastMessageId: '',
         unreadMessageCount: 0,
         updatedAt: '',
@@ -692,8 +692,8 @@ export class Stubs {
         participantId: '',
         participantsIds: [],
         lastMessageText: '',
-        lastMessageDateSent: '',
-        lastMessageUserId: '',
+        lastMessageDateSent: 0,
+        lastMessageUserId: 0,
         lastMessageId: '',
         unreadMessageCount: 0,
         updatedAt: '',
@@ -704,11 +704,11 @@ export class Stubs {
   }
 
   static createPublicDialogQBWithEmptyValues() {
-    const qbDialog: QBChatDialog = {
+    const qbDialog: QBUIKitChatDialog = {
       _id: '111',
       created_at: '01.03.2023',
       last_message: 'test message',
-      last_message_date_sent: '02.03.2023',
+      last_message_date_sent: 0,
       last_message_id: '100',
       last_message_user_id: 112,
       name: '',
@@ -726,11 +726,11 @@ export class Stubs {
   }
 
   static createPrivateDialogQBWithEmptyValues() {
-    const qbDialog: QBChatDialog = {
+    const qbDialog: QBUIKitChatDialog = {
       _id: '111',
       created_at: '01.03.2023',
       last_message: 'test message',
-      last_message_date_sent: '02.03.2023',
+      last_message_date_sent: 0,
       last_message_id: '100',
       last_message_user_id: 112,
       name: '',
@@ -748,11 +748,11 @@ export class Stubs {
   }
 
   static createGroupDialogQBWithEmptyValues() {
-    const qbDialog: QBChatDialog = {
+    const qbDialog: QBUIKitChatDialog = {
       _id: '111',
       created_at: '01.03.2023',
       last_message: 'test message',
-      last_message_date_sent: '02.03.2023',
+      last_message_date_sent: 0,
       last_message_id: '100',
       last_message_user_id: 112,
       name: '',
@@ -773,7 +773,7 @@ export class Stubs {
     dialogType: DialogType,
     id: string,
     name: string,
-    dateSentLastMessage: string,
+    dateSentLastMessage: number,
     textLastMessage: string,
     userIdLastMessage: number,
     ownerId: string,
@@ -844,7 +844,7 @@ export class Stubs {
           id: '012345',
           name: 'error dialog',
           lastMessage: {
-            dateSent: '31.03.2023',
+            dateSent: 0,
             text: 'text test',
             userId: 12345,
           },
@@ -866,7 +866,7 @@ export class Stubs {
     login: string,
     created_at: string,
     updated_at: string,
-    last_request_at: number,
+    last_request_at: string,
     custom_data: string | null = null,
     user_tags: string | null = null,
     blob_id = '',
@@ -906,7 +906,7 @@ export class Stubs {
       DialogType.private,
       '101',
       'Stub1 Private Dialog',
-      '31.03.2023',
+      0,
       'Test text message for private dialog',
       11,
       '11',
@@ -921,7 +921,7 @@ export class Stubs {
       DialogType.public,
       '102',
       'Stub2 Public Dialog',
-      '31.03.2023',
+      0,
       'Test text message for public dialog',
       12,
       '12',
@@ -938,7 +938,7 @@ export class Stubs {
       DialogType.group,
       '103',
       'Stub 3 Group Dialog',
-      '31.03.2023',
+      0,
       'Test text message for group dialog',
       13,
       '13',
@@ -964,7 +964,7 @@ export class Stubs {
       'login_user11',
       '31.03.2023',
       '31.03.2023',
-      0,
+      '',
     );
 
     const user12: UserEntity = Stubs.createUserEntityWithParams(
@@ -974,7 +974,7 @@ export class Stubs {
       'login_user12',
       '31.03.2023',
       '31.03.2023',
-      0,
+      '',
     );
 
     const user13: UserEntity = Stubs.createUserEntityWithParams(
@@ -984,7 +984,7 @@ export class Stubs {
       'login_user13',
       '31.03.2023',
       '31.03.2023',
-      0,
+      '',
     );
 
     users.push(user11);

package/src/Data/dto/dialog/LocalDialogDTO.ts

@@ -15,7 +15,7 @@ export class LocalDialogDTO {
 
   public lastMessageText: string;
 
-  public lastMessageDateSent: string;
+  public lastMessageDateSent: number;
 
   public lastMessageUserId: string;
 
@@ -33,7 +33,7 @@ export class LocalDialogDTO {
     this.participantsIds = [];
     this.updatedAt = '';
     this.lastMessageText = '';
-    this.lastMessageDateSent = '';
+    this.lastMessageDateSent = 0;
     this.lastMessageUserId = '';
     this.unreadMessageCount = 0;
     this.name = '';