quickblox-react-ui-kit 0.5.1-beta.1 → 0.5.1-join-dialog-off.1

package/src/Presentation/Views/DialogInfo/DialogInfo.tsx

@@ -25,11 +25,12 @@ import UiKitTheme from '../../themes/UiKitTheme';
 import { UserEntity } from '../../../Domain/entity/UserEntity';
 import useUsersListViewModel from './UsersList/useUsersListViewModel';
 import { PrivateDialogEntity } from '../../../Domain/entity/PrivateDialogEntity';
-import { CloseSvg, GroupChatSvg, LeaveSvg } from '../../icons';
+import { CloseSvg, GroupChatSvg, LeaveSvg, SettingsFilledSvg } from '../../icons';
 import { Badge, Button, DialogWindow, SettingsItem } from '../../ui-components';
 import useModal from '../../../hooks/useModal';
 import Header from '../../ui-components/Header/Header';
 import InviteMembers from '../InviteMembers/InviteMembers';
+import { stringifyError } from '../../../utils/parse';
 
 type HeaderDialogsProps = {
   dialog: DialogEntity;
@@ -487,6 +488,40 @@ const DialogInfo = ({
             </Button>
           </div>
         </DialogWindow>
+        <SettingsItem
+          icon={<SettingsFilledSvg />}
+          title="UnJoin dialog"
+          onClick={!disableAction ? () => {
+            dialogViewModel
+              .unJoinDialog(dialog as GroupDialogEntity)
+              .then((result) => {
+                return result;
+              })
+              .catch((e) => {
+                console.log('exception in UnJoinDialogFlow', stringifyError(e));
+              });
+          }: undefined}
+          className={cn('dialog-info-leave', {
+            'dialog-info-leave--disable': disableAction,
+          })}
+        />
+        <SettingsItem
+          icon={<SettingsFilledSvg />}
+          title="Join dialog"
+          onClick={!disableAction ? () => {
+            dialogViewModel
+              .joinToDialog(dialog as GroupDialogEntity)
+              .then((result) => {
+                return result;
+              })
+              .catch((e) => {
+                console.log('exception in JoinDialogFlow', stringifyError(e));
+              });
+          }: undefined}
+          className={cn('dialog-info-leave', {
+            'dialog-info-leave--disable': disableAction,
+          })}
+        />
       </ColumnContainer>
     </div>
   );

package/src/Presentation/Views/DialogList/DialogListViewModel.ts

@@ -1,7 +1,7 @@
 import BaseViewModel, {
   FunctionTypeBooleanToVoid,
   FunctionTypeDialogEntityToBoolean,
-  FunctionTypeDialogEntityToDialogEntity,
+  FunctionTypeDialogEntityToDialogEntity, FunctionTypeDialogEntityWithAutoJoinToDialogEntity,
   FunctionTypeFileToFileEntity,
   FunctionTypePaginationToVoid,
   FunctionTypeVoidToVoid,
@@ -18,8 +18,11 @@ export interface DialogListViewModel extends BaseViewModel<DialogEntity> {
   release: FunctionTypeVoidToVoid; // release Content
   setWaitLoadingStatus: FunctionTypeBooleanToVoid; // set loading state
   createDialog: FunctionTypeDialogEntityToDialogEntity;
+  createDialogForAutoJoin: FunctionTypeDialogEntityWithAutoJoinToDialogEntity;
   updateDialog: FunctionTypeDialogEntityToDialogEntity;
   deleteDialog: FunctionTypeDialogEntityToBoolean;
+  unJoinDialog: FunctionTypeDialogEntityToBoolean;
+  joinToDialog: FunctionTypeDialogEntityToBoolean;
   uploadFile: FunctionTypeFileToFileEntity;
   removeMembers: FunctionTypeDialogEntityToBoolean;
 }

package/src/Presentation/Views/DialogList/useDialogListViewModel.ts

@@ -33,6 +33,8 @@ import UsersRepository from '../../../Data/repository/UsersRepository';
 import { UserEntity } from '../../../Domain/entity/UserEntity';
 import { DefaultConfigurations } from '../../../Data/DefaultConfigurations';
 import { UpdateCurrentDialogInDataSourceUseCase } from '../../../Domain/use_cases/UpdateCurrentDialogInDataSourceUseCase';
+import { CreateDialogWithAutoJoinUseCase } from '../../../Domain/use_cases/CreateDialogWithAutoJoinUseCase';
+import { UnJoinFromTheDialogUseCase } from '../../../Domain/use_cases/UnJoinFromTheDialogUseCase';
 
 export default function useDialogListViewModel(
   currentContext: QBDataContextType,
@@ -245,20 +247,36 @@ export default function useDialogListViewModel(
             .then((newItem) => {
               //
               setDialogs((prevDialogs) => {
-                const newDialogs = [
-                  ...prevDialogs,
-                  newItem as PublicDialogEntity,
-                ];
-
-                const sortedData = [...newDialogs].sort((a, b) => {
-                  return b.lastMessage.dateSent && a.lastMessage.dateSent
-                    ? new Date(b.lastMessage.dateSent).getTime() -
-                        new Date(a.lastMessage.dateSent).getTime()
-                    : new Date(b.updatedAt).getTime() -
-                        new Date(a.updatedAt).getTime();
+                let updatedDialogs: PublicDialogEntity[];
+
+                if (newItem.type === DialogType.private) {
+                  const filteredDialogs = prevDialogs.filter(d => d.id !== newItem.id);
+                  updatedDialogs = [...filteredDialogs, newItem as PublicDialogEntity];
+                } else {
+                  updatedDialogs = [...prevDialogs, newItem as PublicDialogEntity];
+                }
+
+                const sortedDialogs = updatedDialogs.sort((a, b) => {
+                  const aDate = a.lastMessage?.dateSent ?? a.updatedAt;
+                  const bDate = b.lastMessage?.dateSent ?? b.updatedAt;
+                  return new Date(bDate).getTime() - new Date(aDate).getTime();
                 });
 
-                return sortedData;
+                return sortedDialogs;
+                // const newDialogs = [
+                //   ...prevDialogs,
+                //   newItem as PublicDialogEntity,
+                // ];
+                //
+                // const sortedData = [...newDialogs].sort((a, b) => {
+                //   return b.lastMessage.dateSent && a.lastMessage.dateSent
+                //     ? new Date(b.lastMessage.dateSent).getTime() -
+                //         new Date(a.lastMessage.dateSent).getTime()
+                //     : new Date(b.updatedAt).getTime() -
+                //         new Date(a.updatedAt).getTime();
+                // });
+                //
+                // return sortedData;
               });
               //
             })
@@ -376,6 +394,37 @@ export default function useDialogListViewModel(
     return Promise.reject(resultDialog);
   };
 
+  const createDialogForAutoJoin = async (
+    dialogInfo: GroupDialogEntity, disableAutoJoin: boolean
+  ): Promise<DialogEntity> => {
+    const textInformationMessage = `${currentUserName} create the chat`;
+    const createDialogWitAutoJoinUseCase: CreateDialogWithAutoJoinUseCase = new CreateDialogWithAutoJoinUseCase(
+      eventMessageRepository,
+      new DialogsRepository(
+        currentContext.storage.LOCAL_DATA_SOURCE,
+        remoteDataSourceMock,
+      ),
+      dialogInfo,
+      textInformationMessage,
+    );
+    const resultDialog: DialogEntity = await createDialogWitAutoJoinUseCase
+      .execute()
+      .catch((e) => {
+        console.log('EXCEPTION IN CREATE NEW DIALOG WITH AUTO JOIN: ', stringifyError(e));
+        setNewDialog(undefined);
+
+        throw new Error(stringifyError(e));
+      });
+
+    if (resultDialog) {
+      setNewDialog(resultDialog);
+
+      return Promise.resolve(resultDialog);
+    }
+
+    return Promise.reject(resultDialog);
+  };
+
   const updateDialog = async (
     // eslint-disable-next-line @typescript-eslint/no-shadow,@typescript-eslint/no-unused-vars
     dialog: GroupDialogEntity,
@@ -478,6 +527,83 @@ export default function useDialogListViewModel(
     return Promise.reject(leaveResult);
   };
 
+  const unJoinDialog = async (
+    // eslint-disable-next-line @typescript-eslint/no-shadow,@typescript-eslint/no-unused-vars
+    dialogToDelete: GroupDialogEntity,
+  ): Promise<boolean> => {
+    let unJoinResult = false;
+
+    if (dialogToDelete.type === DialogType.group) {
+
+      const usersForDeleteFromDialog: Array<number> = new Array<number>();
+
+      const userToDeleteId: number =
+        remoteDataSourceMock?.authInformation?.userId || 0;
+
+      usersForDeleteFromDialog.push(userToDeleteId);
+      const unjoinFromDialog: UnJoinFromTheDialogUseCase =
+        new UnJoinFromTheDialogUseCase(
+          eventMessageRepository,
+          new DialogsRepository(
+            currentContext.storage.LOCAL_DATA_SOURCE,
+            remoteDataSourceMock,
+          ),
+          dialogToDelete,
+        );
+
+      unJoinResult = await unjoinFromDialog.execute().catch((e) => {
+        console.log(
+          'Error delete users from UnJoinFromTheDialogUseCase: ',
+          stringifyError(e),
+        );
+        throw new Error(stringifyError(e));
+      });
+    }
+
+    if (unJoinResult) {
+      return Promise.resolve(unJoinResult);
+    }
+
+    return Promise.reject(unJoinResult);
+  };
+
+  // нужно вызвать из разметки в режиме редактирования
+  const joinToDialog = async (
+    // eslint-disable-next-line @typescript-eslint/no-shadow,@typescript-eslint/no-unused-vars
+    dialogToDelete: GroupDialogEntity,
+  ): Promise<boolean> => {
+    let joinResult = false;
+
+    if (dialogToDelete.type === DialogType.group) {
+
+
+      const unjoinFromDialog: UnJoinFromTheDialogUseCase =
+        new UnJoinFromTheDialogUseCase(
+          eventMessageRepository,
+          new DialogsRepository(
+            currentContext.storage.LOCAL_DATA_SOURCE,
+            remoteDataSourceMock,
+          ),
+          dialogToDelete,
+        );
+
+      joinResult = await unjoinFromDialog.execute().catch((e) => {
+        console.log(
+          'Error delete users from UnJoinFromTheDialogUseCase: ',
+          stringifyError(e),
+        );
+        throw new Error(stringifyError(e));
+      });
+    }
+
+    if (joinResult) {
+      return Promise.resolve(joinResult);
+    }
+
+    return Promise.reject(joinResult);
+  };
+
+
   const removeMembers = async (dialog: GroupDialogEntity): Promise<boolean> => {
     let leaveResult = false;
 
@@ -575,8 +701,11 @@ export default function useDialogListViewModel(
     getDialogs,
     release,
     createDialog,
+    createDialogForAutoJoin,
     updateDialog,
     deleteDialog,
+    unJoinDialog,
+    joinToDialog,
     uploadFile,
     removeMembers,
     setWaitLoadingStatus,

package/src/Presentation/Views/EditDialog/EditDialog.scss

@@ -131,6 +131,24 @@ $create-dialog-container-height: 180px;
       color: var(--main-text);
     }
 
+    &__auto-join {
+      min-height: 20px;
+      font-style: normal;
+      font-weight: 400;
+      font-size: 14px;
+      line-height: 20px;
+      letter-spacing: 0.25px;
+      margin-top: 5px;
+      color: var(--error);
+      display: flex;
+      flex-flow: row;
+
+      svg {
+        margin: 2px 2px 0 0;
+        fill: var(--error);
+      }
+    }
+
     &__text-field {
       width: 100%;
     }

package/src/Presentation/Views/EditDialog/EditDialog.tsx

@@ -13,9 +13,10 @@ import { DialogType } from '../../../Domain/entity/DialogTypes';
 import GroupChat from '../../components/UI/svgs/Icons/Contents/GroupChat';
 import PublicChannel from '../../components/UI/svgs/Icons/Contents/PublicChannel';
 import useQbInitializedDataContext from '../../providers/QuickBloxUIKitProvider/useQbInitializedDataContext';
-import { Button, TextField } from '../../ui-components';
+import { Button, CheckBox, TextField } from '../../ui-components';
 import { formatFileSize } from '../../../utils/formatFileSize';
 import './EditDialog.scss';
+import { SettingsFilledSvg } from '../../icons';
 
 export const TypeOpenDialog = {
   edit: 'edit',
@@ -60,6 +61,7 @@ const EditDialog = ({
       nameDialog.length > maxLengthNameDialog,
   );
   const [errorMessageUpload, setErrorMessageUpload] = useState('');
+  const [disableAutoJoin, setDisableAutoJoin] = useState(false)
 
   const handleUploadAvatar = (event: React.ChangeEvent<HTMLInputElement>) => {
     const allowedExtensions = ['jpg', 'jpeg', 'gif', 'png'];
@@ -162,6 +164,7 @@ const EditDialog = ({
         dialogTitle: dialogName,
         // dialogAvatar: urlAvatar.length ? fileUploadAvatar : '',
         dialogAvatar: urlAvatar === 'null' ? 'null' : fileUploadAvatar,
+        disableAutoJoin: disableAutoJoin,
       };
 
       clickUpdatedHandler(params);
@@ -233,6 +236,12 @@ const EditDialog = ({
               placeholder="Enter name"
               className="edit-dialog-container--wrapper__text-field"
             />
+            <div className="edit-dialog-container--wrapper__auto-join">
+              <CheckBox disabled={false} checked={disableAutoJoin}
+                            onChange={() => setDisableAutoJoin(!disableAutoJoin)} />
+              <SettingsFilledSvg />
+                  Disable AutoJoin
+            </div>
           </div>
         </div>
         <div className="edit-btn-container">

package/src/Presentation/Views/Flow/CreateDialogFlow/CreateNewDialogFlow.tsx

@@ -39,6 +39,7 @@ const CreateNewDialogFlow = ({
   const [uidAvatar, setUidAvatar] = React.useState<string | undefined>(
     undefined,
   );
+  const [disableAutoJoin, setDisableAutoJoin] = useState(false);
   const { allowPublicDialogCreation } =
     currentContext.InitParams.qbConfig.appConfig;
 
@@ -56,6 +57,7 @@ const CreateNewDialogFlow = ({
   const getDialogNameHandler = (params: EditDialogParams) => {
     console.log(params.dialogTitle);
     setDialogName(params.dialogTitle);
+    setDisableAutoJoin(params.disableAutoJoin)
 
     let newUidAvatar: string | undefined = '';
 
@@ -105,17 +107,30 @@ const CreateNewDialogFlow = ({
       dialog.photo = uidAvatar || '';
       dialog.participantIds = participants;
       dialog.type = selectedDialogType;
-      // eslint-disable-next-line promise/always-return
-      await dialogsViewModel
-        .createDialog(dialog)
+
+      if (disableAutoJoin) {
         // eslint-disable-next-line promise/always-return
-        .then((newEntity) => {
-          onFinished(newEntity);
-        })
-        .catch((e) => {
-          console.log('Have exception: ', stringifyError(e));
-        });
-      // }
+        await dialogsViewModel
+          .createDialog(dialog)
+          // eslint-disable-next-line promise/always-return
+          .then((newEntity) => {
+            onFinished(newEntity);
+          })
+          .catch((e) => {
+            console.log('Have exception: ', stringifyError(e));
+          });
+        // }
+      } else {
+        await dialogsViewModel.createDialogForAutoJoin(dialog, disableAutoJoin)
+          // eslint-disable-next-line promise/always-return
+          .then((newEntity) => {
+            onFinished(newEntity);
+          })
+          .catch((e) => {
+            console.log('Have exception: ', stringifyError(e));
+          });
+      }
+
     }
   };
 

package/src/Presentation/layouts/Desktop/DesktopLayout.scss

@@ -60,3 +60,10 @@ $desktop-main-container-item-center-width: 720px;
   justify-content: center;
   height: 100%;
 }
+
+@media only screen and (max-width: 430px) {
+
+  .desktop-layout-main-container {
+    display: block;
+  }
+}

package/src/Presentation/ui-components/Header/Header.scss

@@ -71,6 +71,13 @@
   .dialog-header__body-left {
     gap: 3px;
   }
+
+  .dialog-header {
+    &__body {
+      width: unset;
+    }
+
+  }
 }
 @media only screen and (min-width: 981px) {
   .dialog-header__back {

package/src/QBconfig.ts

@@ -129,6 +129,8 @@ export const QBConfig: QBUIKitConfig = {
     },
     pingLocalhostTimeInterval: 5,
     chatReconnectionTimeInterval: 3,
+    showPublicDialogsInList: false,
+    allowPublicDialogCreation: false,
     debug: true,
     enableForwarding: true,
     enableReplying: true,

package/src/qb-api-calls/index.ts

@@ -468,6 +468,90 @@ export function QBCreateGroupDialog(
   });
 }
 
+// START
+
+export function QBCreatePrivateDialogWithAutojoinFalse(
+  userId: QBUser['id'],
+  dialogName?: string,
+  data?: Dictionary<unknown>,
+) {
+  console.log(
+    `call QBCreatePrivateDialog with userid: ${userId} dialog name: ${
+      dialogName || '-'
+    }`,
+  );
+
+  return new Promise<QBUIKitChatDialog>((resolve, reject) => {
+    // eslint-disable-next-line @typescript-eslint/no-shadow
+    const QB = getQB();
+
+    QB.chat.dialog.create(
+      { name: dialogName || '-', occupants_ids: [userId], type: 3, data, is_join_required: 0 },
+      (error, chat) => {
+        if (error) {
+          reject(stringifyError(error));
+        } else {
+          resolve(chat!);
+        }
+      },
+    );
+  });
+}
+export function QBCreateGroupDialogWithAutojoinFalse(
+  userIds: Array<QBUser['id']>,
+  dialogName?: string,
+  data?: Dictionary<unknown>,
+) {
+  console.log(
+    `call QBCreateGroupDialog with ids: ${JSON.stringify(userIds)} name: ${
+      dialogName || ''
+    }`,
+  );
+
+  let params = {};
+
+  if (data && data?.photo) {
+    params = {
+      name: dialogName || '-',
+      occupants_ids: [userIds],
+      type: 2,
+      photo: data?.photo,
+      is_join_required: 0,
+    };
+  } else {
+    params = {
+      name: dialogName || '-',
+      occupants_ids: [userIds],
+      type: 2,
+      is_join_required: 0
+    };
+  }
+
+  return new Promise<QBUIKitChatDialog>((resolve, reject) => {
+    // eslint-disable-next-line @typescript-eslint/no-shadow
+    const QB = getQB();
+
+    QB.chat.dialog.create(
+      // {
+      //   name: dialogName || '-',
+      //   occupants_ids: [userIds],
+      //   type: 2,
+      //   photo: data?.photo,
+      // },
+      params,
+      (error, chat) => {
+        if (error) {
+          reject(stringifyError(error));
+        } else {
+          resolve(chat!);
+        }
+      },
+    );
+  });
+}
+
+// END
+
 export function QBUpdateDialog(
   dialogId: QBUIKitChatDialog['_id'],
   data: Dictionary<unknown>,
@@ -491,16 +575,9 @@ export function QBJoinGroupDialog(dialogId: QBUIKitChatDialog['_id']) {
     // eslint-disable-next-line @typescript-eslint/no-shadow
     const QB = getQB();
     const dialogJid = QB.chat.helpers.getRoomJidFromDialogId(dialogId);
-
-    // QB.chat.muc.join(dialogJid, (error, res) => {
-    //   if (error) {
-    //     console.log('ERROR in QBJoinGroupDialog with join group dialog:', error);
-    //     reject(stringifyError(error));
-    //   } else {
-    //     console.log('QBJoinGroupDialog: join group dialog:', res);
-    //     resolve(res);
-    //   }
-    // });
+    // для ВЕРСИИ ТЕСТОВОГО ПРИМЕРА СПИСОК ДИАЛГОВ БЕЗ АВТОДЖОИНА нужно просто закомментировать
+    // содержимое этого
+    // метода
     QB.chat.muc.join(dialogJid, (error, res) => {
       if (error) {
         console.log('ERROR in QBJoinGroupDialog with join group dialog:', error);
@@ -555,7 +632,7 @@ export function QBLeaveDialog(dialogId: QBUIKitChatDialog['_id']) {
     // eslint-disable-next-line @typescript-eslint/no-shadow
     const QB = getQB();
     const dialogJid = QB.chat.helpers.getRoomJidFromDialogId(dialogId);
-
+    // unjoin
     QB.chat.muc.leave(dialogJid, (error, res) => {
       if (error) {
         reject(stringifyError(error));
@@ -613,34 +690,6 @@ export function QBCreateAndUploadContent(
   });
 }
 
-// export function QBChatGetMessages(
-//   dialogId: QBChatDialog['_id'],
-//   skip = 0,
-//   limit = 100,
-// ) {
-//   return new Promise<GetMessagesResult & { dialogId: QBChatDialog['_id'] }>(
-//     (resolve, reject) => {
-//       QB.chat.message.list(
-//         {
-//           chat_dialog_id: dialogId,
-//           sort_desc: 'date_sent',
-//           limit,
-//           skip,
-//           mark_as_read: 0,
-//         },
-//         (error, messages) => {
-//           if (error) {
-//             reject(stringifyError(error));
-//           } else {
-//             resolve({ ...messages, dialogId });
-//           }
-//         },
-//       );
-//     },
-//   );
-// }
-// //
-
 export function qbChatGetMessagesExtended(
   dialogId: QBUIKitChatDialog['_id'],
   params: Partial<{
@@ -773,9 +822,6 @@ export function QBWebRTCSessionGetUserMedia(
     });
   });
 }
-// export interface AIAnswerResponse {
-//   answer: string;
-// } // artim 19.05.2024
 
 export function QBAnswerAssist(
   smartChatAssistantId: string,