quickblox-react-ui-kit 0.1.0

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

@@ -0,0 +1,345 @@
+import { useState } from 'react';
+import { QBDataContextType } from '../../components/providers/QuickBloxUIKitProvider/QuickBloxUIKitProvider';
+import { Pagination } from '../../../Domain/repository/Pagination';
+import { DialogsViewModel } from './DialogViewModel';
+import { PublicDialogEntity } from '../../../Domain/entity/PublicDialogEntity';
+import { DialogEntity } from '../../../Domain/entity/DialogEntity';
+import { SubscribeToDialogsUpdatesUseCaseWithMock } from '../../../Domain/use_cases/SubscribeToDialogsUpdatesUseCaseWithMock';
+import DialogsRepository from '../../../Data/repository/DialogsRepository';
+import { GetAllDialogsUseCaseWithMock } from '../../../Domain/use_cases/GetAllDialogsUseCaseWithMock';
+import { CreateDialogUseCase } from '../../../Domain/use_cases/CreateDialogUseCase';
+import EventMessagesRepository from '../../../Data/repository/EventMessagesRepository';
+import { stringifyError } from '../../../utils/parse';
+import { GroupDialogEntity } from '../../../Domain/entity/GroupDialogEntity';
+import { UpdateDialogUseCase } from '../../../Domain/use_cases/UpdateDialogUseCase';
+import {
+  DialogLeaveType,
+  LeaveDialogUseCase,
+} from '../../../Domain/use_cases/LeaveDialogUseCase';
+import { FileEntity } from '../../../Domain/entity/FileEntity';
+import { UploadFileUseCase } from '../../../Domain/use_cases/UploadFileUseCase';
+import { FileRepository } from '../../../Data/repository/FileRepository';
+import { Stubs } from '../../../Data/Stubs';
+import { SubscribeToDialogEventsUseCase } from '../../../Domain/use_cases/SubscribeToDialogEventsUseCase';
+import EventMessageType from '../../../Domain/entity/EventMessageType';
+import { NotificationTypes } from '../../../Domain/entity/NotificationTypes';
+import { GetDialogByIdUseCase } from '../../../Domain/use_cases/GetDialogByIdUseCase';
+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';
+
+export default function useDialogsViewModelWithMockUseCase(
+  currentContext: QBDataContextType,
+  initPagination?: Pagination,
+): DialogsViewModel {
+  console.log('3.1. useDialogsViewModelWithMockUseCase');
+  const startPagination: Pagination = initPagination || new Pagination();
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState('');
+  const [pagination, setPagination] = useState<Pagination>(startPagination);
+  const [dialogs, setDialogs] = useState<PublicDialogEntity[]>([]);
+  const [newDialog, setNewDialog] = useState<DialogEntity>();
+
+  // const currentContext = useQbDataContext();
+  const remoteDataSourceMock: RemoteDataSource =
+    currentContext.storage.REMOTE_DATA_SOURCE;
+
+  const eventMessageRepository: EventMessagesRepository =
+    currentContext.storage.EVENT_MESSAGE_REPOSITORY;
+
+  const useCaseSubscribeToDialogsUpdates: SubscribeToDialogsUpdatesUseCaseWithMock =
+    new SubscribeToDialogsUpdatesUseCaseWithMock(
+      new DialogsRepository(
+        currentContext.storage.LOCAL_DATA_SOURCE,
+        remoteDataSourceMock,
+      ),
+    );
+
+  const subscribeToDialogEventsUseCase: SubscribeToDialogEventsUseCase =
+    new SubscribeToDialogEventsUseCase(
+      eventMessageRepository,
+      'DialogsViewModel',
+    );
+
+  const dialogUpdateHandler = (dialogInfo: DialogEventInfo) => {
+    console.log(
+      'call dialogUpdateHandler in useDialogsViewModelWithMockUseCase',
+    );
+    if (dialogInfo.eventMessageType === EventMessageType.SystemMessage) {
+      if (dialogInfo.notificationTypes === NotificationTypes.UPDATE_DIALOG) {
+        if (dialogInfo.messageInfo) {
+          const { dialogId } = dialogInfo.messageInfo;
+
+          const getDialogByIdUseCase: GetDialogByIdUseCase =
+            new GetDialogByIdUseCase(
+              new DialogsRepository(
+                currentContext.storage.LOCAL_DATA_SOURCE,
+                currentContext.storage.REMOTE_DATA_SOURCE,
+              ),
+              dialogId,
+            );
+
+          // eslint-disable-next-line promise/catch-or-return,promise/always-return
+          getDialogByIdUseCase.execute().then((updatedDialog) => {
+            setNewDialog(updatedDialog);
+          });
+        }
+      }
+    }
+  };
+
+  subscribeToDialogEventsUseCase
+    .execute(dialogUpdateHandler)
+    .catch((reason) => {
+      console.log(stringifyError(reason));
+    });
+
+  // eslint-disable-next-line @typescript-eslint/require-await
+  async function getDialogs(currentPagination: Pagination) {
+    console.log('getDialogs in useDialogsViewModelWithMockUseCase');
+    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 useDialogsViewModelWithMockUseCase:',
+          data,
+        );
+        setDialogs([...(data as PublicDialogEntity[])]);
+        setLoading(false);
+        setError('');
+      } catch (e) {
+        console.log('catch error2');
+        setError('ERROR2!!!');
+      }
+    });
+  }
+
+  const release = () => {
+    useCaseSubscribeToDialogsUpdates.release();
+  };
+
+  const createDialog = async (
+    dialogInfo: GroupDialogEntity,
+  ): Promise<DialogEntity> => {
+    console.log(
+      'call createDialog in use case with params: ',
+      JSON.stringify(dialogInfo),
+    );
+    /*
+    currentContext.storage.LOCAL_DATA_SOURCE,
+        remoteDataSourceMock,
+        currentContext.storage.CONNECTION_REPOSITORY
+     */
+    const createDialogUseCase: CreateDialogUseCase = new CreateDialogUseCase(
+      eventMessageRepository,
+      new DialogsRepository(
+        currentContext.storage.LOCAL_DATA_SOURCE,
+        remoteDataSourceMock,
+      ),
+      dialogInfo,
+    );
+    const resultDialog: DialogEntity = await createDialogUseCase
+      .execute()
+      .catch((e) => {
+        console.log('EXCEPTION IN CREATE NEW DIALOG: ', 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
+    dialogToUpdate: GroupDialogEntity,
+  ): Promise<DialogEntity> => {
+    const updateDialogUseCase: UpdateDialogUseCase = new UpdateDialogUseCase(
+      eventMessageRepository,
+      new DialogsRepository(
+        currentContext.storage.LOCAL_DATA_SOURCE,
+        remoteDataSourceMock,
+      ),
+      dialogToUpdate,
+    );
+
+    const resultDialog: DialogEntity = await updateDialogUseCase
+      .execute()
+      .catch((e) => {
+        console.log('Error updateDialogUseCase: ', stringifyError(e));
+        throw new Error(stringifyError(e));
+      });
+
+    return Promise.resolve(resultDialog);
+  };
+
+  const deleteDialog = async (
+    // eslint-disable-next-line @typescript-eslint/no-shadow,@typescript-eslint/no-unused-vars
+    dialogToDelete: GroupDialogEntity,
+  ): Promise<boolean> => {
+    let leaveResult = false;
+
+    if (dialogToDelete.type === DialogType.private) {
+      const leaveDialogUseCase: LeaveDialogUseCase = new LeaveDialogUseCase(
+        eventMessageRepository,
+        new DialogsRepository(
+          currentContext.storage.LOCAL_DATA_SOURCE,
+          remoteDataSourceMock,
+        ),
+        dialogToDelete,
+        DialogLeaveType.delete,
+      );
+
+      leaveResult = await leaveDialogUseCase.execute().catch((e) => {
+        console.log('Error leaveDialogUseCase: ', stringifyError(e));
+        throw new Error(stringifyError(e));
+      });
+    } else {
+      const usersForDeleteFromDialog: Array<number> = new Array<number>();
+
+      const userToDeleteId: number =
+        remoteDataSourceMock?.authInformation?.userId || 0;
+
+      usersForDeleteFromDialog.push(userToDeleteId);
+      const deleteUsersFromDialog: RemoveUsersFromTheDialogUseCase =
+        new RemoveUsersFromTheDialogUseCase(
+          eventMessageRepository,
+          new DialogsRepository(
+            currentContext.storage.LOCAL_DATA_SOURCE,
+            remoteDataSourceMock,
+          ),
+          dialogToDelete,
+          usersForDeleteFromDialog,
+        );
+
+      leaveResult = await deleteUsersFromDialog.execute().catch((e) => {
+        console.log(
+          'Error delete users from RemoveUsersFromDialogUseCase: ',
+          stringifyError(e),
+        );
+        throw new Error(stringifyError(e));
+      });
+    }
+
+    if (leaveResult) {
+      return Promise.resolve(leaveResult);
+    }
+
+    return Promise.reject(leaveResult);
+  };
+
+  const removeMembers = async (dialog: GroupDialogEntity): Promise<boolean> => {
+    let leaveResult = false;
+
+    if (
+      dialog.participantsToRemoveIds &&
+      dialog.participantsToRemoveIds.length > 0
+    ) {
+      const deleteUsersFromDialog: RemoveUsersFromTheDialogUseCase =
+        new RemoveUsersFromTheDialogUseCase(
+          eventMessageRepository,
+          new DialogsRepository(
+            currentContext.storage.LOCAL_DATA_SOURCE,
+            remoteDataSourceMock,
+          ),
+          dialog,
+          dialog.participantsToRemoveIds,
+        );
+
+      leaveResult = await deleteUsersFromDialog.execute().catch((e) => {
+        console.log(
+          'Error delete users from RemoveUsersFromDialogUseCase: ',
+          stringifyError(e),
+        );
+        throw new Error(stringifyError(e));
+      });
+    }
+
+    if (leaveResult) {
+      return Promise.resolve(leaveResult);
+    }
+
+    return Promise.reject(leaveResult);
+  };
+
+  const uploadFile = async (file: File): Promise<FileEntity> => {
+    console.log('call uploadFile(), file: ', file);
+    const fileEntity: FileEntity = Stubs.createFileEntityWithDefaultValues();
+
+    fileEntity.data = file;
+    fileEntity.uid = '';
+    fileEntity.name = file.name;
+    fileEntity.size = file.size;
+    const uploadFileUseCase: UploadFileUseCase = new UploadFileUseCase(
+      new FileRepository(
+        currentContext.storage.LOCAL_DATA_SOURCE,
+        remoteDataSourceMock,
+      ),
+      fileEntity,
+    );
+
+    const resultEnity: FileEntity = await uploadFileUseCase
+      .execute()
+      .catch((e) => {
+        console.log('Error UploadFileUseCase: ', stringifyError(e));
+        throw new Error(stringifyError(e));
+      });
+
+    return Promise.resolve(resultEnity);
+  };
+
+  return {
+    get entity(): DialogEntity {
+      return newDialog as DialogEntity;
+    },
+    set entity(item) {
+      setNewDialog(item);
+    },
+    dialogs,
+    loading,
+    error,
+    pagination,
+    // eslint-disable-next-line @typescript-eslint/no-misused-promises
+    getDialogs,
+    release,
+    createDialog,
+    updateDialog,
+    deleteDialog,
+    uploadFile,
+    removeMembers,
+  };
+}

package/src/Presentation/Views/Navigation/More.svg

@@ -0,0 +1,7 @@
+<svg width="44" height="44" viewBox="0 0 44 44" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="Navigation/More">
+<g id="Vector">
+<path d="M21.9999 14.6667C24.0166 14.6667 25.6666 13.0167 25.6666 11C25.6666 8.98334 24.0166 7.33334 21.9999 7.33334C19.9833 7.33334 18.3333 8.98334 18.3333 11C18.3333 13.0167 19.9833 14.6667 21.9999 14.6667ZM21.9999 18.3333C19.9833 18.3333 18.3333 19.9833 18.3333 22C18.3333 24.0167 19.9833 25.6667 21.9999 25.6667C24.0166 25.6667 25.6666 24.0167 25.6666 22C25.6666 19.9833 24.0166 18.3333 21.9999 18.3333ZM21.9999 29.3333C19.9833 29.3333 18.3333 30.9833 18.3333 33C18.3333 35.0167 19.9833 36.6667 21.9999 36.6667C24.0166 36.6667 25.6666 35.0167 25.6666 33C25.6666 30.9833 24.0166 29.3333 21.9999 29.3333Z" fill="#0B121B"/>
+</g>
+</g>
+</svg>

package/src/Presentation/assets/DarkTheme.ts

@@ -0,0 +1,58 @@
+import Theme from './Theme';
+import ThemeScheme from './ThemeScheme';
+
+export default class DarkTheme implements Theme {
+  // eslint-disable-next-line class-methods-use-this
+  caption = (): string => ThemeScheme.secondary_100;
+
+  // eslint-disable-next-line class-methods-use-this
+  chatInput = (): string => ThemeScheme.secondary_800;
+
+  // eslint-disable-next-line class-methods-use-this
+  disabledElements = (): string => ThemeScheme.secondary_300;
+
+  // eslint-disable-next-line class-methods-use-this
+  divider = (): string => ThemeScheme.secondary_400;
+
+  // eslint-disable-next-line class-methods-use-this
+  dropdownBackground = (): string => ThemeScheme.secondary_400;
+
+  // eslint-disable-next-line class-methods-use-this
+  error = (): string => ThemeScheme.error_300;
+
+  // eslint-disable-next-line class-methods-use-this
+  fieldBorder = (): string => ThemeScheme.secondary_200;
+
+  // eslint-disable-next-line class-methods-use-this
+  hightlight = (): string => ThemeScheme.highlight;
+
+  // eslint-disable-next-line class-methods-use-this
+  incomingBackground = (): string => ThemeScheme.secondary_400;
+
+  // eslint-disable-next-line class-methods-use-this
+  inputElements = (): string => ThemeScheme.secondary_200;
+
+  // eslint-disable-next-line class-methods-use-this
+  mainBackground = (): string => ThemeScheme.secondary_500;
+
+  // eslint-disable-next-line class-methods-use-this
+  mainElements = (): string => ThemeScheme.primary_300;
+
+  // eslint-disable-next-line class-methods-use-this
+  mainText = (): string => ThemeScheme.primary_a_100;
+
+  // eslint-disable-next-line class-methods-use-this
+  outgoingBackground = (): string => ThemeScheme.primary_500;
+
+  // eslint-disable-next-line class-methods-use-this
+  secondaryBackground = (): string => ThemeScheme.secondary_800;
+
+  // eslint-disable-next-line class-methods-use-this
+  secondaryElements = (): string => ThemeScheme.primary_a_100;
+
+  // eslint-disable-next-line class-methods-use-this
+  secondaryText = (): string => ThemeScheme.secondary_200;
+
+  // eslint-disable-next-line class-methods-use-this
+  fontFamily = (): string => ThemeScheme.fontFamily;
+}

package/src/Presentation/assets/LightTheme.ts

@@ -0,0 +1,58 @@
+import Theme from './Theme';
+import ThemeScheme from './ThemeScheme';
+
+export default class LightTheme implements Theme {
+  // eslint-disable-next-line class-methods-use-this
+  caption = (): string => ThemeScheme.secondary_200;
+
+  // eslint-disable-next-line class-methods-use-this
+  chatInput = (): string => ThemeScheme.primary_a_200;
+
+  // eslint-disable-next-line class-methods-use-this
+  disabledElements = (): string => ThemeScheme.secondary_100;
+
+  // eslint-disable-next-line class-methods-use-this
+  divider = (): string => ThemeScheme.primary_50;
+
+  // eslint-disable-next-line class-methods-use-this
+  dropdownBackground = (): string => ThemeScheme.primary_a_100;
+
+  // eslint-disable-next-line class-methods-use-this
+  error = (): string => ThemeScheme.error_500;
+
+  // eslint-disable-next-line class-methods-use-this
+  fieldBorder = (): string => ThemeScheme.secondary_200;
+
+  // eslint-disable-next-line class-methods-use-this
+  hightlight = (): string => ThemeScheme.highlight;
+
+  // eslint-disable-next-line class-methods-use-this
+  incomingBackground = (): string => ThemeScheme.secondary_50;
+
+  // eslint-disable-next-line class-methods-use-this
+  inputElements = (): string => ThemeScheme.secondary_500;
+
+  // eslint-disable-next-line class-methods-use-this
+  mainBackground = (): string => ThemeScheme.primary_a_100;
+
+  // eslint-disable-next-line class-methods-use-this
+  mainElements = (): string => ThemeScheme.primary_500;
+
+  // eslint-disable-next-line class-methods-use-this
+  mainText = (): string => ThemeScheme.secondary_900;
+
+  // eslint-disable-next-line class-methods-use-this
+  outgoingBackground = (): string => ThemeScheme.primary_50;
+
+  // eslint-disable-next-line class-methods-use-this
+  secondaryBackground = (): string => ThemeScheme.primary_50;
+
+  // eslint-disable-next-line class-methods-use-this
+  secondaryElements = (): string => ThemeScheme.secondary_500;
+
+  // eslint-disable-next-line class-methods-use-this
+  secondaryText = (): string => ThemeScheme.secondary_300;
+
+  // eslint-disable-next-line class-methods-use-this
+  fontFamily = (): string => ThemeScheme.fontFamily;
+}

package/src/Presentation/assets/Theme.ts

@@ -0,0 +1,143 @@
+// import ThemeScheme from './ThemeScheme';
+/*
+export default class Theme {
+  private static readonly _main_elements = ThemeScheme.primary_500;
+
+  static get mainElements(): string {
+    return this._main_elements;
+  }
+
+  static get secondaryElements(): string {
+    return this._secondary_elements;
+  }
+
+  static get inputElements(): string {
+    return this._input_elements;
+  }
+
+  static get disabledElements(): string {
+    return this._disabled_elements;
+  }
+
+  static get fieldBorder(): string {
+    return this._field_border;
+  }
+
+  static get mainText(): string {
+    return this._main_text;
+  }
+
+  static get secondaryText(): string {
+    return this._secondary_text;
+  }
+
+  static get caption(): string {
+    return this._caption;
+  }
+
+  static get mainBackground(): string {
+    return this._main_background;
+  }
+
+  static get secondaryBackground(): string {
+    return this._secondary_background;
+  }
+
+  static get incomingBackground(): string {
+    return this._incoming_background;
+  }
+
+  static get outgoingBackground(): string {
+    return this._outgoing_background;
+  }
+
+  static get dropdownBackground(): string {
+    return this._dropdown_background;
+  }
+
+  static get chatInput(): string {
+    return this._chat_input;
+  }
+
+  static get divider(): string {
+    return this._divider;
+  }
+
+  static get error(): string {
+    return this._error;
+  }
+
+  static get hightlight(): string {
+    return this._hightlight;
+  }
+
+  private static readonly _secondary_elements = ThemeScheme.secondary_500;
+
+  private static readonly _input_elements = ThemeScheme.secondary_500;
+
+  private static readonly _disabled_elements = ThemeScheme.secondary_100;
+
+  private static readonly _field_border = ThemeScheme.secondary_200;
+
+  private static readonly _main_text = ThemeScheme.secondary_900;
+
+  private static readonly _secondary_text = ThemeScheme.secondary_300;
+
+  private static readonly _caption = ThemeScheme.secondary_200;
+
+  private static readonly _main_background = ThemeScheme.primary_a_100;
+
+  private static readonly _secondary_background = ThemeScheme.primary_50;
+
+  private static readonly _incoming_background = ThemeScheme.secondary_50;
+
+  private static readonly _outgoing_background = ThemeScheme.primary_50;
+
+  private static readonly _dropdown_background = ThemeScheme.primary_a_100;
+
+  private static readonly _chat_input = ThemeScheme.primary_a_200;
+
+  private static readonly _divider = ThemeScheme.primary_50;
+
+  private static readonly _error = ThemeScheme.error_500;
+
+  private static readonly _hightlight = ThemeScheme.highlight;
+}
+*/
+export default interface Theme {
+  mainElements(): string;
+
+  secondaryElements(): string;
+
+  inputElements(): string;
+
+  disabledElements(): string;
+
+  fieldBorder(): string;
+
+  mainText(): string;
+
+  secondaryText(): string;
+
+  caption(): string;
+
+  mainBackground(): string;
+
+  secondaryBackground(): string;
+
+  incomingBackground(): string;
+
+  outgoingBackground(): string;
+
+  dropdownBackground(): string;
+
+  chatInput(): string;
+
+  divider(): string;
+
+  error(): string;
+
+  hightlight(): string;
+
+  fontFamily(): string;
+}

package/src/Presentation/assets/ThemeScheme.ts

@@ -0,0 +1,83 @@
+export default class ThemeScheme {
+  public static readonly primary_50 = '#E7EFFF';
+
+  public static readonly primary_100 = '#C4D7FE';
+
+  public static readonly primary_200 = '#9CBCFE';
+
+  public static readonly primary_300 = '#74A1FD';
+
+  public static readonly primary_400 = '#578CFC';
+
+  public static readonly primary_500 = '#3978FC';
+
+  public static readonly primary_600 = '#3370FC';
+
+  public static readonly primary_700 = '#2C65FB';
+
+  public static readonly primary_800 = '#245BFB';
+
+  public static readonly primary_900 = '#1748FA';
+
+  public static readonly primary_a_100 = '#FFFFFF';
+
+  public static readonly primary_a_200 = '#F7F9FF';
+
+  public static readonly primary_a_400 = '#C4CFFF';
+
+  public static readonly primary_a_700 = '#ABBAFF';
+
+  public static readonly secondary_50 = '#E4E6E8';
+
+  public static readonly secondary_100 = '#BCC1C5';
+
+  public static readonly secondary_200 = '#90979F';
+
+  public static readonly secondary_300 = '#636D78';
+
+  public static readonly secondary_400 = '#414E5B';
+
+  public static readonly secondary_500 = '#202F3E';
+
+  public static readonly secondary_600 = '#1C2A38';
+
+  public static readonly secondary_700 = '#182330';
+
+  public static readonly secondary_800 = '#131D28';
+
+  public static readonly secondary_900 = '#0B121B';
+
+  public static readonly secondary_a_100 = '#74A1FD';
+
+  public static readonly secondary_a_200 = '#3978FC';
+
+  public static readonly secondary_a_400 = '#245BFB';
+
+  public static readonly secondary_a_700 = '#0050DC';
+
+  public static readonly system_green_100 = '#C8F1D6';
+
+  public static readonly system_green_200 = '#A4E7BB';
+
+  public static readonly system_green_300 = '#80DDA0';
+
+  public static readonly system_green_400 = '#64D68B';
+
+  public static readonly system_green_500 = '#49CF77';
+
+  public static readonly error_100 = '#FFC4C1';
+
+  public static readonly error_200 = '#FF9D98';
+
+  public static readonly error_300 = '#FF766E';
+
+  public static readonly error_400 = '#FF584F';
+
+  public static readonly error_500 = '#FF3B30';
+
+  public static readonly information = '#FDB0FF';
+
+  public static readonly highlight = '#FFFDC1';
+
+  public static readonly fontFamily = 'Roboto';
+}