Skip to content

Commit c44618f

Browse files
v0.1.8
1 parent c984bbc commit c44618f

File tree

24 files changed

+620
-108
lines changed

24 files changed

+620
-108
lines changed

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "quickblox-react-ui-kit",
3-
"version": "0.1.7",
3+
"version": "0.1.8",
44
"main": "dist/index-ui.js",
55
"license": "MIT",
66
"dependencies": {

src/App.tsx

Lines changed: 39 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,7 @@ import { QBConfig } from './QBconfig';
55
import useQBConnection from './Presentation/components/providers/QuickBloxUIKitProvider/useQBConnection';
66
import { LocalDataSource } from './Data/source/local/LocalDataSource';
77
import Login from './Presentation/components/layouts/TestStage/LoginView/Login';
8-
import QuickBloxUIKitProvider, {
9-
qbDataContext,
10-
} from './Presentation/components/providers/QuickBloxUIKitProvider/QuickBloxUIKitProvider';
8+
import QuickBloxUIKitProvider from './Presentation/components/providers/QuickBloxUIKitProvider/QuickBloxUIKitProvider';
119
import TestStageMarkup from './Presentation/components/layouts/TestStage/TestStageMarkup';
1210
import { Stubs } from './Data/Stubs';
1311
import {
@@ -16,10 +14,13 @@ import {
1614
} from './Data/source/remote/RemoteDataSource';
1715
import QuickBloxUIKitDesktopLayout from './Presentation/components/layouts/Desktop/QuickBloxUIKitDesktopLayout';
1816
import DefaultTheme from './Presentation/assets/DefaultThemes/DefaultTheme';
17+
import useQbUIKitDataContext from './Presentation/components/providers/QuickBloxUIKitProvider/useQbUIKitDataContext';
1918

2019
function App() {
21-
const currentContext = React.useContext(qbDataContext);
22-
const remoteDataSourceMock: RemoteDataSource =
20+
// const currentContext = React.useContext(qbDataContext);
21+
const currentContext = useQbUIKitDataContext();
22+
23+
const remoteDataSource: RemoteDataSource =
2324
currentContext.storage.REMOTE_DATA_SOURCE;
2425
// eslint-disable-next-line @typescript-eslint/no-unused-vars
2526
const localDataSource: LocalDataSource =
@@ -50,7 +51,7 @@ function App() {
5051
console.log('call release...');
5152
connectionRepository.stopKeepAlive();
5253
console.log('call stopKeepAlive...');
53-
await remoteDataSourceMock.disconnectAndLogoutUser();
54+
await remoteDataSource.disconnectAndLogoutUser();
5455
console.log('call disconnectAndLogoutUser...');
5556
await currentContext.storage.LOCAL_DATA_SOURCE.clearAll();
5657
console.log('call clearAll...');
@@ -61,9 +62,9 @@ function App() {
6162
const prepareSDK = async (authData: LoginData): Promise<void> => {
6263
console.log('call prepareSDK with data:', authData);
6364
// todo: must be real remote datasource
64-
if (remoteDataSourceMock.needInit) {
65+
if (remoteDataSource.needInit) {
6566
console.log('start prepareSDK actions with data:', authData);
66-
await remoteDataSourceMock.initSDKWithUser(
67+
await remoteDataSource.initSDKWithUser(
6768
{
6869
appIdOrToken: currentContext.InitParams.accountData.appId,
6970
authKeyOrAppId: currentContext.InitParams.accountData.authKey,
@@ -114,10 +115,10 @@ function App() {
114115
console.log('call reloginSDK with data:', JSON.stringify(authData));
115116
currentContext.storage.SYNC_DIALOGS_USE_CASE.release();
116117
connectionRepository.stopKeepAlive();
117-
await remoteDataSourceMock.disconnectAndLogoutUser();
118+
await remoteDataSource.disconnectAndLogoutUser();
118119
await currentContext.storage.LOCAL_DATA_SOURCE.clearAll();
119120

120-
await remoteDataSourceMock.loginWithUser(authData);
121+
await remoteDataSource.loginWithUser(authData);
121122
//
122123
// todo: temporary off, must turn on and reorganize code rows
123124
await connectionRepository.initializeStates();
@@ -135,20 +136,25 @@ function App() {
135136
const prepareContent = async (): Promise<void> => {
136137
console.log('PREPARE CONTENT');
137138
// todo: must delete it and ADD Preload data (read first page everywhere)
139+
// или во все юзкейсы 2) Get/Sync execute(completed/callback):Promise<Entity[]>
140+
// await prepareMockData();
138141
console.log('ADD REAL DATA TO DIALOG MOCK DATA ');
142+
// await remoteDataSource.getDialogsFirstPage();
143+
// await remoteDataSource.setUpMockStorage();
144+
//
139145
//
140146
};
141147

142148
const loginHandler = async (data: LoginData): Promise<void> => {
143149
setCurrentUser(data);
144150
console.log(`call login actions: ${JSON.stringify(data)}`);
145-
if (remoteDataSourceMock.authInformation) {
151+
if (remoteDataSource.authInformation) {
146152
console.log(
147153
`authInformation: ${JSON.stringify(
148-
remoteDataSourceMock?.authInformation.userName,
154+
remoteDataSource?.authInformation.userName,
149155
)}`,
150156
);
151-
if (data.login !== remoteDataSourceMock.authInformation.userName) {
157+
if (data.login !== remoteDataSource.authInformation.userName) {
152158
await reloginSDK(data).catch((e) => {
153159
console.log(
154160
`exception in reloginSDK ${(e as unknown as Error).message}`,
@@ -161,9 +167,9 @@ function App() {
161167
}
162168
} else {
163169
console.log('need prepare SDK with data:', data);
164-
if (remoteDataSourceMock.needInit) {
170+
if (remoteDataSource.needInit) {
165171
console.log('start prepareSDK actions with data:', data);
166-
await remoteDataSourceMock.initSDKWithUser(
172+
await remoteDataSource.initSDKWithUser(
167173
{
168174
appIdOrToken: currentContext.InitParams.accountData.appId,
169175
authKeyOrAppId: currentContext.InitParams.accountData.authKey,
@@ -188,6 +194,18 @@ function App() {
188194
prepareSDK(currentUser).catch();
189195
}, []);
190196

197+
// const { apiKey } = QBConfig.configAIApi.AIAnswerAssistWidgetConfig;
198+
// // eslint-disable-next-line @typescript-eslint/no-unsafe-call
199+
// const openAIConfiguration: Configuration = new Configuration({
200+
// apiKey,
201+
// });
202+
//
203+
// // eslint-disable-next-line @typescript-eslint/no-unsafe-call
204+
// const openAIApi: OpenAIApi = new OpenAIApi(openAIConfiguration);
205+
// const defaultIncomingMessageWidget = UseDefaultIncomingMessageWidget({
206+
// openAIApi,
207+
// });
208+
191209
// todo: uncomment authSecret
192210
return (
193211
<QuickBloxUIKitProvider
@@ -215,9 +233,12 @@ function App() {
215233
<Route
216234
path="/desktop-test-mock"
217235
element={
218-
// <QuickBloxUIKitDesktopLayout theme={new CustomTheme()} InputWidgetLeftPlaceHolder={CustomWidgetVoiceToText('','')} />
219-
220-
// <QuickBloxUIKitDesktopLayout theme={new CustomTheme()} />
236+
// <QuickBloxUIKitDesktopLayout
237+
// theme={new DefaultTheme()}
238+
// IncomingMessageWidgetToRightPlaceHolder={
239+
// defaultIncomingMessageWidget
240+
// }
241+
// />
221242

222243
<QuickBloxUIKitDesktopLayout theme={new DefaultTheme()} />
223244
}

src/Presentation/Views/Base/BaseViewModel.ts

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,10 @@ export type EditDialogParams = {
4949
dialogTitle: string;
5050
dialogAvatar: File | string | null;
5151
};
52-
52+
export interface IChatMessage {
53+
role: string;
54+
content: string;
55+
}
5356
export type FunctionTypeFileToToVoid = (file: File) => void;
5457
export type FunctionTypePaginationToVoid = (pagination: Pagination) => void;
5558
export type FunctionTypeVoidToVoid = () => void;
@@ -65,3 +68,8 @@ export type FunctionTypeDialogEntityToBoolean = (
6568
entity: GroupDialogEntity,
6669
) => Promise<boolean>;
6770
export type FunctionTypeFileToFileEntity = (file: File) => Promise<FileEntity>;
71+
export type FunctionTypeJSXElement = () => JSX.Element;
72+
export type FunctionTypeChatMessagesToVoid = (
73+
lastMessage: string,
74+
messages: IChatMessage,
75+
) => void;

src/Presentation/Views/Dialogs/Dialogs.tsx

Lines changed: 14 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -27,14 +27,16 @@ type DialogsComponentSettings = {
2727
themeName?: ThemeNames;
2828
withoutHeader?: boolean;
2929
useSubHeader?: boolean;
30+
useUpHeader?: boolean;
3031
themeHeader?: UiKitTheme;
3132
themePreview?: UiKitTheme;
3233
};
3334

3435
type DialogsProps = {
3536
header?: React.ReactNode;
3637
subHeaderContent?: React.ReactNode;
37-
itemSelectHandler?: FunctionTypeViewModelToVoid<DialogEntity>;
38+
upHeaderContent?: React.ReactNode;
39+
onDialogSelectHandler?: FunctionTypeViewModelToVoid<DialogEntity>;
3840
dialogsViewModel: DialogsViewModel;
3941
additionalSettings?: DialogsComponentSettings;
4042
};
@@ -43,7 +45,8 @@ type DialogsProps = {
4345
const DialogsComponent: React.FC<DialogsProps> = ({
4446
header,
4547
subHeaderContent,
46-
itemSelectHandler,
48+
upHeaderContent,
49+
onDialogSelectHandler,
4750
dialogsViewModel,
4851
additionalSettings = undefined,
4952
}: DialogsProps) => {
@@ -68,15 +71,15 @@ const DialogsComponent: React.FC<DialogsProps> = ({
6871
dialogsViewModel?.dialogs.forEach((entiy, index) => {
6972
const pw: PreviewDialogViewModel = new PreviewDialogViewModel(
7073
(it) => {
71-
if (itemSelectHandler) {
74+
if (onDialogSelectHandler) {
7275
setSelectedItem({ selectedIndex: index, item: it });
73-
itemSelectHandler(it);
76+
onDialogSelectHandler(it);
7477
}
7578
},
7679
(it) => {
77-
if (itemSelectHandler) {
80+
if (onDialogSelectHandler) {
7881
setSelectedItem({ selectedIndex: index, item: it });
79-
itemSelectHandler(it);
82+
onDialogSelectHandler(it);
8083
}
8184
},
8285
// Number(entiy.id),
@@ -149,7 +152,9 @@ const DialogsComponent: React.FC<DialogsProps> = ({
149152
const useHeader = !additionalSettings?.withoutHeader || header || false;
150153
const useSubContent =
151154
additionalSettings?.useSubHeader || subHeaderContent || false;
152-
const usingHeader = header || (
155+
const useUpContent =
156+
additionalSettings?.useUpHeader || upHeaderContent || false;
157+
const HeaderContent = header || (
153158
<HeaderDialogs
154159
title="Dialogs"
155160
clickSearchHandler={() => {
@@ -307,7 +312,8 @@ const DialogsComponent: React.FC<DialogsProps> = ({
307312
}}
308313
>
309314
<ColumnContainer>
310-
{useHeader && usingHeader}
315+
{useUpContent && upHeaderContent}
316+
{useHeader && HeaderContent}
311317
{/* {showSearchDialogs ? renderSearchDialogs() : null} */}
312318
{useSubContent && subHeaderContent}
313319
{dialogsViewModel?.loading && (

src/Presentation/Views/Dialogs/useDialogsViewModel.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@ export default function useDialogsViewModel(
4444
//
4545
const currentUserId =
4646
currentContext.storage.REMOTE_DATA_SOURCE.authInformation?.userId;
47-
// const currentContext = useQbDataContext();
47+
// const currentContext = useQbInitializedDataContext();
4848
const remoteDataSourceMock: RemoteDataSource =
4949
currentContext.storage.REMOTE_DATA_SOURCE;
5050

src/Presentation/components/UI/Dialogs/DialogInformation/DialogInformation.tsx

Lines changed: 17 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -35,24 +35,28 @@ import { stringifyError } from '../../../../../utils/parse';
3535
import { FileEntity } from '../../../../../Domain/entity/FileEntity';
3636
import UserAvatar from '../EditDialog/UserAvatar/UserAvatar';
3737
import MainButton, { TypeButton } from '../../Buttons/MainButton/MainButton';
38-
import useQbDataContext from '../../../providers/QuickBloxUIKitProvider/useQbDataContext';
38+
import useQbInitializedDataContext from '../../../providers/QuickBloxUIKitProvider/useQbInitializedDataContext';
3939
import UiKitTheme from '../../../../assets/UiKitTheme';
4040

4141
type HeaderDialogsProps = {
4242
dialog: DialogEntity;
4343
dialogViewModel: DialogsViewModel;
44-
closeInformationHandler: FunctionTypeVoidToVoid;
44+
onCloseDialogInformationHandler: FunctionTypeVoidToVoid;
4545
theme?: UiKitTheme;
46+
subHeaderContent?: React.ReactNode;
47+
upHeaderContent?: React.ReactNode;
4648
};
4749
// eslint-disable-next-line react/function-component-definition
4850
const DialogInformation: React.FC<HeaderDialogsProps> = ({
4951
dialog,
5052
dialogViewModel,
51-
closeInformationHandler,
53+
onCloseDialogInformationHandler,
5254
// eslint-disable-next-line @typescript-eslint/no-unused-vars
5355
theme = undefined,
56+
subHeaderContent = undefined,
57+
upHeaderContent = undefined,
5458
}: HeaderDialogsProps) => {
55-
const currentContext = useQbDataContext();
59+
const currentContext = useQbInitializedDataContext();
5660
const currentUserId =
5761
currentContext.storage.REMOTE_DATA_SOURCE.authInformation?.userId.toString();
5862
const { handleModal } = React.useContext(ModalContext);
@@ -62,9 +66,9 @@ const DialogInformation: React.FC<HeaderDialogsProps> = ({
6266

6367
useEffect(() => {
6468
console.log('HAVE NEW DIALOG');
65-
if (dialog === undefined && closeInformationHandler) {
69+
if (dialog === undefined && onCloseDialogInformationHandler) {
6670
console.log('HAVE UNDEFINED NEW DIALOG');
67-
closeInformationHandler();
71+
onCloseDialogInformationHandler();
6872

6973
return;
7074
}
@@ -244,6 +248,9 @@ const DialogInformation: React.FC<HeaderDialogsProps> = ({
244248
}
245249
};
246250

251+
const useSubContent = subHeaderContent || false;
252+
const useUpContent = upHeaderContent || false;
253+
247254
return isAllMembersShow ? (
248255
<MembersList
249256
closeInformationHandler={() => {
@@ -254,6 +261,7 @@ const DialogInformation: React.FC<HeaderDialogsProps> = ({
254261
) : (
255262
<div className="dialog-information-container">
256263
<ColumnContainer maxWidth="320px">
264+
{useUpContent && upHeaderContent}
257265
<div className="dialog-information-container--dialog-information-wrapper">
258266
<div className="dialog-information-container__dialog-information">
259267
<div>Dialog information</div>
@@ -262,13 +270,14 @@ const DialogInformation: React.FC<HeaderDialogsProps> = ({
262270
<ActiveSvg
263271
content={<Close applyZoom color="var(--secondary-elements)" />}
264272
clickAction={() => {
265-
if (closeInformationHandler) {
266-
closeInformationHandler();
273+
if (onCloseDialogInformationHandler) {
274+
onCloseDialogInformationHandler();
267275
}
268276
}}
269277
/>
270278
</div>
271279
</div>
280+
{useSubContent && subHeaderContent}
272281
<div className="dialog-information-container--icon-dialog-wrapper">
273282
<div className="dialog-information-container__icon-dialog">
274283
<div className="dialog-information-container__icon-dialog__info">

src/Presentation/components/UI/Dialogs/DialogInformation/UsersList/useUsersListViewModel.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { useState } from 'react';
22
import { DialogEntity } from '../../../../../../Domain/entity/DialogEntity';
3-
import useQbDataContext from '../../../../providers/QuickBloxUIKitProvider/useQbDataContext';
3+
import useQbInitializedDataContext from '../../../../providers/QuickBloxUIKitProvider/useQbInitializedDataContext';
44
import { UserEntity } from '../../../../../../Domain/entity/UserEntity';
55
import { UsersListViewModel } from './UsersListViewModel';
66
import { GetUsersByIdsUseCase } from '../../../../../../Domain/use_cases/GetUsersByIdsUseCase';
@@ -18,7 +18,7 @@ export default function useUsersListViewModel(
1818
const [users, setUsers] = useState<UserEntity[]>([]);
1919
const [dialog, setDialog] = useState<DialogEntity>(dialogEntity);
2020

21-
const currentContext = useQbDataContext();
21+
const currentContext = useQbInitializedDataContext();
2222

2323
async function getUsers() {
2424
console.log('call getUsers in useUsersListViewModel');

src/Presentation/components/UI/Dialogs/EditDialog/EditDialog.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import UserAvatar from './UserAvatar/UserAvatar';
1313
import { DialogType } from '../../../../../Domain/entity/DialogTypes';
1414
import GroupChat from '../../svgs/Icons/Contents/GroupChat';
1515
import PublicChannel from '../../svgs/Icons/Contents/PublicChannel';
16-
import useQbDataContext from '../../../providers/QuickBloxUIKitProvider/useQbDataContext';
16+
import useQbInitializedDataContext from '../../../providers/QuickBloxUIKitProvider/useQbInitializedDataContext';
1717

1818
export const TypeOpenDialog = {
1919
edit: 'edit',
@@ -40,7 +40,7 @@ const EditDialog: React.FC<EditDialogProps> = ({
4040
clickUpdatedHandler,
4141
clickCancelHandler,
4242
}) => {
43-
const currentContext = useQbDataContext();
43+
const currentContext = useQbInitializedDataContext();
4444
const maxUploadFileSize = currentContext.InitParams.maxFileSize;
4545
const minLengthNameDialog = 3;
4646
const maxLengthNameDialog = 60;

src/Presentation/components/UI/Dialogs/InviteMembers/useInviteMembersViewModel.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import {
77
import { UserEntity } from '../../../../../Domain/entity/UserEntity';
88
import { GetAllUsersUseCase } from '../../../../../Domain/use_cases/GetAllUsersUseCase';
99
import UsersRepository from '../../../../../Data/repository/UsersRepository';
10-
import useQbDataContext from '../../../providers/QuickBloxUIKitProvider/useQbDataContext';
10+
import useQbInitializedDataContext from '../../../providers/QuickBloxUIKitProvider/useQbInitializedDataContext';
1111
import { Stubs } from '../../../../../Data/Stubs';
1212
import { stringifyError } from '../../../../../utils/parse';
1313
import {
@@ -18,7 +18,7 @@ import {
1818
export default function useInviteMembersViewModel(): InviteMembersViewModel {
1919
// initPagination?: Pagination,
2020
console.log('create useUsersListViewModel');
21-
const currentContext = useQbDataContext();
21+
const currentContext = useQbInitializedDataContext();
2222
const [loading, setLoading] = useState(false);
2323
const [error, setError] = useState('error with getting user list');
2424

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import {
2+
FunctionTypeFileToToVoid,
3+
FunctionTypeJSXElement,
4+
FunctionTypeStringToVoid,
5+
} from '../../../../../Views/Base/BaseViewModel';
6+
7+
export interface InputWidget {
8+
renderWidget: FunctionTypeJSXElement;
9+
textToWidget: FunctionTypeStringToVoid;
10+
fileToWidget: FunctionTypeFileToToVoid;
11+
textToInput: string | undefined;
12+
fileToInput: File | undefined;
13+
}
14+
15+

0 commit comments

Comments
 (0)