quickblox-react-ui-kit 0.4.1 → 0.4.2-beta.2

package/src/Presentation/layouts/LayoutCommonTypes.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-
-export type ContainerProps = {
-  children?: React.ReactNode;
-  gapBetweenItem?: string;
-  maxWidth?: string;
-};

package/src/Presentation/layouts/TestStage/CompanyLogo/CompanyLogo.tsx

@@ -1,27 +0,0 @@
-import React from 'react';
-
-// eslint-disable-next-line react/function-component-definition
-const CompanyLogo: React.FC = () => {
-  return (
-    <div
-      style={{
-        display: 'flex',
-        alignItems: 'center',
-        width: '322px',
-        height: '42px',
-        border: '1px solid #333',
-      }}
-    >
-      <img
-        src="../../../assets/img/bee-img.png"
-        alt="Company Logo"
-        style={{ width: '100px', height: 'auto', marginRight: '10px' }}
-      />
-      <span style={{ fontSize: '24px', fontWeight: 'bold', color: '#333' }}>
-        Your Company Name
-      </span>
-    </div>
-  );
-};
-
-export default CompanyLogo;

package/src/Presentation/layouts/TestStage/LoginView/Login.scss

@@ -1,72 +0,0 @@
-a { text-decoration: none; }
-
-h1 { font-size: 1em; }
-
-h1, p {
-  margin-bottom: 10px;
-}
-
-strong {
-  font-weight: bold;
-}
-
-.uppercase { text-transform: uppercase; }
-
-/* ---------- LOGIN ---------- */
-
-#login {
-  border: 3px solid #6c38cc;
-  margin: 50px auto;
-  width: 100%;
-}
-
-form fieldset input[type="text"],
-input[type="password"] {
-  appearance: none;
-  background: #e5e5e5;
-  border: none;
-  border-radius: 3px;
-  color: #5a5656;
-  font-family: inherit;
-  font-size: 14px;
-  height: 50px;
-  outline: none;
-  padding: 0px 10px;
-  width: 100%;
-  border: 1px solid #008dde;
-  margin: 1px;
-}
-
-form fieldset button[type="submit"] {
-  appearance: none;
-  background-color: #008dde;
-  border: none;
-  border-radius: 3px;
-  color: #f4f4f4;
-  cursor: pointer;
-  font-family: inherit;
-  height: 50px;
-  text-transform: uppercase;
-  width: 100%;
-}
-
-form fieldset a {
-  color: #5a5656;
-  font-size: 10px;
-}
-
-form fieldset a:hover { text-decoration: underline; }
-
-.btn-round {
-  background: #5a5656;
-  border-radius: 50%;
-  color: #f4f4f4;
-  display: block;
-  font-size: 12px;
-  height: 50px;
-  line-height: 50px;
-  margin: 30px 125px;
-  text-align: center;
-  text-transform: uppercase;
-  width: 50px;
-}

package/src/Presentation/layouts/TestStage/LoginView/Login.tsx

@@ -1,91 +0,0 @@
-import React, { useState } from 'react';
-import './Login.scss';
-import { LoginData } from '../../../../Data/source/remote/RemoteDataSource';
-
-export type FunctionTypeLoginDataToVoid = (data: LoginData) => void;
-
-type LoginProps = {
-  loginHandler?: FunctionTypeLoginDataToVoid;
-};
-// eslint-disable-next-line react/function-component-definition
-const Login: React.FC<LoginProps> = ({ loginHandler }: LoginProps) => {
-  // const currentContext = useQbInitializedDataContext();
-  const [UserName, setUsername] = useState('');
-  const [Password, setPassword] = useState('');
-
-  // const [term, setTerm] = useState('');
-
-  const submitForm = (event: React.FormEvent<HTMLFormElement>) => {
-    // Preventing the page from reloading
-    event.preventDefault();
-
-    // Do something
-    // alert(username);
-    console.log('submit actions perform');
-
-    const data: LoginData = {
-      login: UserName,
-      password: Password,
-    };
-
-    console.log('data: ', data);
-
-    if (loginHandler) {
-      //
-      // const oldData: InitParams = currentContext.InitParams;
-      // const newData: InitParams = { ...oldData, loginData: data };
-
-      // currentContext.updateQBInitParams(newData);
-      // //
-      loginHandler(data);
-    }
-  };
-
-  return (
-    <div id="login">
-      <h1>Please login.</h1>
-
-      <form onSubmit={submitForm}>
-        <fieldset>
-          <p>
-            <input
-              type="text"
-              required
-              placeholder="Username"
-              value={UserName}
-              onChange={(event) => setUsername(event.target.value)}
-            />
-          </p>
-
-          <p>
-            <input
-              type="password"
-              required
-              placeholder="Password"
-              value={Password}
-              onChange={(event) => setPassword(event.target.value)}
-            />
-          </p>
-
-          <button type="submit">Submit</button>
-        </fieldset>
-      </form>
-    </div>
-    // <div className="container">
-    //   <form onSubmit={submitForm}>
-    //     <input
-    //       value={term}
-    //       onChange={(e) => setTerm(e.target.value)}
-    //       type="text"
-    //       placeholder="Enter a term"
-    //       className="input"
-    //     />
-    //     <button type="submit" className="btn">
-    //       Submit
-    //     </button>
-    //   </form>
-    // </div>
-  );
-};
-
-export default Login;

package/src/Presentation/providers/ProviderProps.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-
-export type ProviderProps = {
-  children?: React.ReactNode;
-};

package/src/Presentation/providers/QuickBloxUIKitProvider/QuickBloxUIKitProvider.tsx

@@ -1,375 +0,0 @@
-import React, { useEffect } from 'react';
-import { ToastContainer, toast } from 'react-toastify';
-import 'react-toastify/dist/ReactToastify.css';
-import { ProviderProps } from '../ProviderProps';
-import { LocalDataSource } from '../../../Data/source/local/LocalDataSource';
-import {
-  AuthorizationData,
-  LoginData,
-  RemoteDataSource,
-} from '../../../Data/source/remote/RemoteDataSource';
-import DialogsRepository from '../../../Data/repository/DialogsRepository';
-import { SyncDialogsUseCase } from '../../../Domain/use_cases/SyncDialogsUseCase';
-import { BaseUseCase } from '../../../Domain/use_cases/base/BaseUseCase';
-import ConnectionRepository from '../../../Data/repository/ConnectionRepository';
-import EventMessagesRepository from '../../../Data/repository/EventMessagesRepository';
-import { CallBackFunction } from '../../../Domain/use_cases/base/IUseCase';
-import { DefaultConfigurations } from '../../../Data/DefaultConfigurations';
-import { QBUIKitConfig } from '../../../CommonTypes/CommonTypes';
-
-const initialValues = {
-  LOCAL_DATA_SOURCE: new LocalDataSource(), // localstorage or session storage
-  REMOTE_DATA_SOURCE: new RemoteDataSource(), // QB instances
-  CONNECTION_REPOSITORY: new ConnectionRepository(),
-};
-
-const initialEvent = {
-  EVENT_MESSAGE_REPOSITORY: new EventMessagesRepository(
-    initialValues.REMOTE_DATA_SOURCE,
-    initialValues.LOCAL_DATA_SOURCE,
-    initialValues.CONNECTION_REPOSITORY,
-  ),
-};
-
-const initialSync = {
-  SYNC_DIALOGS_USE_CASE: new SyncDialogsUseCase(
-    new DialogsRepository(
-      initialValues.LOCAL_DATA_SOURCE,
-      initialValues.REMOTE_DATA_SOURCE,
-    ),
-    initialValues.CONNECTION_REPOSITORY,
-    initialEvent.EVENT_MESSAGE_REPOSITORY,
-  ),
-};
-
-type AccountData = {
-  appId: number;
-  accountKey: string;
-  authSecret?: string;
-  authKey: string;
-  sessionToken?: string;
-};
-
-export type InitParams = {
-  maxFileSize: number;
-  accountData: AccountData;
-  qbConfig: QBUIKitConfig;
-  loginData?: LoginData;
-};
-
-type QuickBloxProviderProps = ProviderProps & InitParams;
-
-type QBDataStorage = {
-  LOCAL_DATA_SOURCE: LocalDataSource;
-  REMOTE_DATA_SOURCE: RemoteDataSource;
-  SYNC_DIALOGS_USE_CASE: BaseUseCase<boolean, boolean>; // need Factory pattern
-  CONNECTION_REPOSITORY: ConnectionRepository;
-  EVENT_MESSAGE_REPOSITORY: EventMessagesRepository;
-};
-
-export type QBReactUIKitVersionInfo = {
-  version: string;
-  build: string;
-};
-
-export type QBDataContextType = {
-  // authProcessed: boolean;
-  storage: QBDataStorage;
-  InitParams: InitParams;
-  updateStorage: (storage: QBDataStorage) => void;
-  updateQBInitParams: (InitParams: InitParams) => void;
-  release: () => void;
-  authorize: (authorizationData: AuthorizationData) => Promise<void>;
-  setSubscribeOnSessionExpiredListener: (
-    callback: CallBackFunction<boolean>,
-  ) => void;
-};
-const initDataContext: QBDataContextType = {
-  // authProcessed: false,
-  storage: {
-    LOCAL_DATA_SOURCE: initialValues.LOCAL_DATA_SOURCE, // localstorage or session storage
-    REMOTE_DATA_SOURCE: initialValues.REMOTE_DATA_SOURCE, // QB instances
-    CONNECTION_REPOSITORY: initialValues.CONNECTION_REPOSITORY,
-    EVENT_MESSAGE_REPOSITORY: initialEvent.EVENT_MESSAGE_REPOSITORY,
-    SYNC_DIALOGS_USE_CASE: initialSync.SYNC_DIALOGS_USE_CASE,
-    // SYNC_DIALOGS_USE_CASE: new SyncDialogsUseCase(
-    //   new DialogsRepository(
-    //     initialValues.LOCAL_DATA_SOURCE,
-    //     initialValues.REMOTE_DATA_SOURCE,
-    //   ),
-    //   initialValues.CONNECTION_REPOSITORY,
-    //   initialEvent.EVENT_MESSAGE_REPOSITORY,
-    // ),
-  },
-  InitParams: {
-    accountData: DefaultConfigurations.getDefaultQBConfig().credentials,
-    maxFileSize:
-      DefaultConfigurations.getDefaultQBConfig().appConfig.maxFileSize,
-    qbConfig: DefaultConfigurations.getDefaultQBConfig(),
-  },
-  updateQBInitParams: (InitParams: InitParams) => {
-    // eslint-disable-next-line @typescript-eslint/restrict-template-expressions
-    console.log(
-      `call function updateQBInitParams with param ${JSON.stringify(
-        InitParams,
-      )}`,
-    );
-    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-ignore
-    this.InitParams = InitParams;
-  },
-  updateStorage: (storage: QBDataStorage) => {
-    // eslint-disable-next-line @typescript-eslint/restrict-template-expressions
-    console.log(`empty function with param ${storage}`);
-  },
-  release: (): void => {
-    console.log(`function release start`);
-    // eslint-disable-next-line @typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-member-access,@typescript-eslint/ban-ts-comment
-    // @ts-ignore
-    // eslint-disable-next-line @typescript-eslint/no-unsafe-call
-    initialSync.SYNC_DIALOGS_USE_CASE.release();
-    // eslint-disable-next-line @typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-member-access,@typescript-eslint/ban-ts-comment
-    // @ts-ignore
-    // eslint-disable-next-line @typescript-eslint/no-unsafe-call
-    initialValues.CONNECTION_REPOSITORY.stopKeepAlive();
-    // eslint-disable-next-line @typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-member-access,@typescript-eslint/ban-ts-comment
-    // @ts-ignore
-    // eslint-disable-next-line @typescript-eslint/no-unsafe-call
-    initialValues.REMOTE_DATA_SOURCE.disconnectAndLogoutUser().catch();
-    // eslint-disable-next-line @typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-member-access,@typescript-eslint/ban-ts-comment
-    // @ts-ignore
-    // eslint-disable-next-line @typescript-eslint/no-unsafe-call
-    initialValues.LOCAL_DATA_SOURCE.clearAll().catch();
-    console.log(`function release end`);
-  },
-  authorize: async (authorizationData: AuthorizationData): Promise<void> => {
-    console.log('UI Kit authorize');
-    initialValues.REMOTE_DATA_SOURCE.authInformation = authorizationData;
-    initialValues.REMOTE_DATA_SOURCE.setAuthProcessedSuccessed();
-    //
-    initialValues.REMOTE_DATA_SOURCE.initEventsHandlers();
-    //
-    console.log('UI Kit authorize event handler has initialized');
-    //
-    await initialValues.CONNECTION_REPOSITORY.initializeStates();
-    if (!initialValues.CONNECTION_REPOSITORY.needInit) {
-      initialValues.CONNECTION_REPOSITORY.keepALiveChatConnection();
-    }
-    await initialSync.SYNC_DIALOGS_USE_CASE.execute(() => {
-      console.log('sync dialogs has started');
-    }).catch(() => {
-      console.log('sync dialogs has exception');
-    });
-    //
-    console.log(`function authorize end`);
-    //
-  },
-  setSubscribeOnSessionExpiredListener: (
-    callback: CallBackFunction<boolean>,
-  ): void => {
-    initialValues.REMOTE_DATA_SOURCE.subscribeOnSessionExpiredListener(
-      callback,
-    );
-  },
-};
-
-export const qbDataContext =
-  React.createContext<QBDataContextType>(initDataContext);
-
-const { Provider } = qbDataContext;
-
-function QuickBloxUIKitProvider({
-  children,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  accountData,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  qbConfig,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  loginData,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  maxFileSize,
-}: QuickBloxProviderProps) {
-  console.log(
-    'QuickBloxUIKitProvider with account data: ',
-    JSON.stringify(accountData),
-  );
-  console.log(
-    'QuickBloxUIKitProvider with login data: ',
-    JSON.stringify(loginData),
-  );
-  const initStorageState = {
-    LOCAL_DATA_SOURCE: initialValues.LOCAL_DATA_SOURCE, // localstorage or session storage
-    REMOTE_DATA_SOURCE: initialValues.REMOTE_DATA_SOURCE, // QB instances
-    CONNECTION_REPOSITORY: initialValues.CONNECTION_REPOSITORY,
-    EVENT_MESSAGE_REPOSITORY: initialEvent.EVENT_MESSAGE_REPOSITORY,
-    SYNC_DIALOGS_USE_CASE: initialSync.SYNC_DIALOGS_USE_CASE,
-    // SYNC_DIALOGS_USE_CASE: new SyncDialogsUseCase(
-    //   new DialogsRepository(
-    //     initialValues.LOCAL_DATA_SOURCE,
-    //     initialValues.REMOTE_DATA_SOURCE,
-    //   ),
-    //   initialValues.CONNECTION_REPOSITORY,
-    //   initialEvent.EVENT_MESSAGE_REPOSITORY,
-    // ),
-  };
-
-  console.log(
-    'QuickBloxUIKitProvider with storage init data: ',
-    JSON.stringify(initStorageState),
-  );
-  const [storage, setStorage] = React.useState<QBDataStorage>(initStorageState);
-
-  console.log('have storage useState completed');
-  const updateStorage = (dataStorage: QBDataStorage) => {
-    // eslint-disable-next-line @typescript-eslint/restrict-template-expressions
-    setStorage(dataStorage);
-  };
-  // todo: must use accountData if we haves
-  const [InitParams, setInitParams] = React.useState<InitParams>({
-    accountData: {
-      appId: accountData.appId,
-      accountKey: accountData.accountKey,
-      authKey: accountData.authKey,
-      authSecret: accountData.authSecret,
-      sessionToken: accountData.sessionToken,
-    },
-    loginData: {
-      login: loginData?.login || '',
-      password: loginData?.password || '',
-    },
-    maxFileSize,
-    qbConfig,
-  });
-
-  console.log('have InitParams useState completed');
-  const updateQBInitParams = (initParams: InitParams) => {
-    console.log(`log updateQBInitParams ${JSON.stringify(initParams)}`);
-    setInitParams(initParams);
-  };
-
-  const release = (): void => {
-    console.log(`function release start`);
-    // eslint-disable-next-line @typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-member-access,@typescript-eslint/ban-ts-comment
-    // @ts-ignore
-    // eslint-disable-next-line @typescript-eslint/no-unsafe-call
-    initialSync.SYNC_DIALOGS_USE_CASE.release();
-    // eslint-disable-next-line @typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-member-access,@typescript-eslint/ban-ts-comment
-    // @ts-ignore
-    // eslint-disable-next-line @typescript-eslint/no-unsafe-call
-    initialValues.CONNECTION_REPOSITORY.stopKeepAlive();
-    // eslint-disable-next-line @typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-member-access,@typescript-eslint/ban-ts-comment
-    // @ts-ignore
-    // eslint-disable-next-line @typescript-eslint/no-unsafe-call
-    initialValues.REMOTE_DATA_SOURCE.disconnectAndLogoutUser().catch();
-    // eslint-disable-next-line @typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-member-access,@typescript-eslint/ban-ts-comment
-    // @ts-ignore
-    // eslint-disable-next-line @typescript-eslint/no-unsafe-call
-    initialValues.LOCAL_DATA_SOURCE.clearAll().catch();
-    console.log(`function release end`);
-  };
-  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-  // @ts-ignore
-  const authorize = (authorizationData: AuthorizationData): Promise<void> => {
-    initialValues.REMOTE_DATA_SOURCE.authInformation = authorizationData;
-    initialValues.REMOTE_DATA_SOURCE.setAuthProcessedSuccessed();
-  };
-
-  const setSubscribeOnSessionExpiredListener = (
-    callback: CallBackFunction<boolean>,
-  ): void => {
-    initialValues.REMOTE_DATA_SOURCE.subscribeOnSessionExpiredListener(
-      callback,
-    );
-  };
-
-  // todo: temporary off, must turn on
-  // todo: cause of recycle v1
-  // storage.CONNECTION_REPOSITORY.keepALiveChatConnection();
-  // todo: temporary off, must turn on
-  // eslint-disable-next-line @typescript-eslint/no-empty-function
-  // storage.SYNC_DIALOGS_USE_CASE.execute(() => {});
-
-  // todo: MUST use apiKeyOrSessionToken or login/pass to re-init
-  // const remoteDataSourceMock: RemoteDataSource =
-  //   storage.REMOTE_DATA_SOURCE as RemoteDataSource;
-  // // remoteDataSourceMock
-  //   .initSDK({
-  //     appIdOrToken: QBInitParams.accountData.appId,
-  //     authKeyOrAppId: QBInitParams.accountData.authKey,
-  //     authSecret: QBInitParams.accountData.authSecret,
-  //     accountKey: QBInitParams.accountData.accountKey,
-  //   })
-  //   .catch(() => {
-  //     console.log('EXCEPTION remoteDataSourceMock.initSDK');
-  //   });
-  // console.log('!!!-3-after initSDK');
-  // // todo: temporary off, must turn on and reorganize code rows
-  // storage.CONNECTION_REPOSITORY.initializeStates();
-  // // todo: must delete it
-  // remoteDataSourceMock.setUpMockStorage();
-  // // START SYNC MOCK
-  // storage.SYNC_DIALOGS_USE_CASE.execute(() => {
-  //   console.log('SYNC_DIALOGS_USE_CASE_MOCK.execute');
-  // }).catch(() => {
-  //   console.log('EXCEPTION SYNC_DIALOGS_USE_CASE_MOCK.execute');
-  // });
-
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  // const [authProcessed, setAuthProcessed] = React.useState(false);
-  // const updateAuthProcessedStatus = (status: boolean) => {
-  //   console.log('updateAuthProcessedStatus, set ', status);
-  //   setAuthProcessed(status);
-  // };
-
-  useEffect(() => {
-    if (
-      !accountData.accountKey ||
-      !accountData.appId ||
-      (!accountData.authKey && !accountData.sessionToken)
-    ) {
-      toast(
-        'Please input AppId, AuthKey, AuthSecret, AccountKey to sign in/up',
-      );
-    }
-  }, []);
-
-  if (
-    !accountData.accountKey ||
-    !accountData.appId ||
-    (!accountData.authKey && !accountData.sessionToken)
-  ) {
-    return (
-      <>
-        <ToastContainer
-          position="top-center"
-          autoClose={5000}
-          bodyClassName="toast__body"
-          toastClassName="toast"
-          pauseOnHover={false}
-          closeButton={false}
-          hideProgressBar
-        />
-        {children}
-      </>
-    );
-  }
-
-  return (
-    <Provider
-      value={{
-        InitParams,
-        updateQBInitParams,
-        // authProcessed,
-        release,
-        authorize,
-        setSubscribeOnSessionExpiredListener,
-        storage,
-        updateStorage,
-      }}
-    >
-      {children}
-    </Provider>
-  );
-}
-
-export default QuickBloxUIKitProvider;

package/src/Presentation/providers/QuickBloxUIKitProvider/useEventMessagesRepository.ts

@@ -1,10 +0,0 @@
-import EventMessagesRepository from '../../../Data/repository/EventMessagesRepository';
-import useQbInitializedDataContext from './useQbInitializedDataContext';
-
-const useEventMessagesRepository = (): EventMessagesRepository => {
-  const currentQbDataContext = useQbInitializedDataContext();
-
-  return currentQbDataContext.storage.EVENT_MESSAGE_REPOSITORY;
-};
-
-export default useEventMessagesRepository;

package/src/Presentation/providers/QuickBloxUIKitProvider/useQBConnection.ts

@@ -1,54 +0,0 @@
-import React, { useEffect } from 'react';
-import { qbDataContext } from './QuickBloxUIKitProvider';
-import ConnectionRepository from '../../../Data/repository/ConnectionRepository';
-
-type QBConnectionInfo = {
-  connectionRepository: ConnectionRepository;
-  browserOnline: boolean;
-  connectionStatus: boolean;
-};
-const useQBConnection = (): QBConnectionInfo => {
-  const currentQbDataContext = React.useContext(qbDataContext);
-  const [navigatorOnline, setNavigatorOnline] = React.useState(
-    navigator.onLine,
-  );
-  const [connectStatus, setConnectStatus] = React.useState(
-    currentQbDataContext.storage.CONNECTION_REPOSITORY.isChatConnected(),
-  );
-
-  currentQbDataContext.storage.CONNECTION_REPOSITORY.subscribe((status) => {
-    console.log(`Connection status: ${status ? 'CONNECTED' : 'DISCONNECTED'}`);
-    if (status) setConnectStatus(true);
-    else setConnectStatus(false);
-  });
-  useEffect(() => {
-    const setOnline = () => {
-      setNavigatorOnline(true);
-      setConnectStatus(
-        currentQbDataContext.storage.CONNECTION_REPOSITORY.isChatConnected(),
-      );
-    };
-    const setOffline = () => {
-      setNavigatorOnline(false);
-      setConnectStatus(
-        currentQbDataContext.storage.CONNECTION_REPOSITORY.isChatConnected(),
-      );
-    };
-
-    window.addEventListener('online', setOnline);
-    window.addEventListener('offline', setOffline);
-
-    return () => {
-      window.removeEventListener('online', setOnline);
-      window.removeEventListener('offline', setOffline);
-    };
-  }, []);
-
-  return {
-    browserOnline: navigatorOnline,
-    connectionRepository: currentQbDataContext.storage.CONNECTION_REPOSITORY,
-    connectionStatus: connectStatus,
-  };
-};
-
-export default useQBConnection;