hieptlccc

import React from 'react';
import ReactDOM from 'react-dom';
import './styles/index.css';
import App from './App';
import { CometChat } from '@cometchat-pro/chat';
import { cometChat } from './app.config'

const appID = cometChat.APP_ID
const region = cometChat.REGION
const appSetting = new CometChat.AppSettingsBuilder()

hieptlccc

import firebase from "firebase/app";
import 'firebase/firestore';
import 'firebase/auth';
import { firebaseConfig } from "./app.config"

const firebaseApp = firebase.initializeApp(firebaseConfig);
const db = firebaseApp.firestore();
const auth = firebase.auth();
const provider = new firebase.auth.GoogleAuthProvider();
export { auth, provider };

hieptlccc

<div class="chat" [style]="theme">
  <div class="responsive chat__wrapper">
    <cometchat-user-list-with-messages></cometchat-user-list-with-messages>
  </div>
  <aside class="chat__sidebar">
    <ul class="chat__icons">
      <a [routerLink]="['profile']">
        <img
          class="chat__icon"
          title="Profile page"

hieptlccc

.chat {
  display: grid;
  place-items: center;
  width: 100vw;
  height: 100vh;
  position: relative;
  background-color: #ececec;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260' viewBox='0 0 260 260'%3E%3Cg fill-rule='evenodd'%3E%3Cg fill='%23dddddd' fill-opacity='0.4'%3E%3Cpath d='M24.37 16c.2.65.39 1.32.54 2H21.17l1.17 2.34.45.9-.24.11V28a5 5 0 0 1-2.23 8.94l-.02.06a8 8 0 0 1-7.75 6h-20a8 8 0 0 1-7.74-6l-.02-.06A5 5 0 0 1-17.45 28v-6.76l-.79-1.58-.44-.9.9-.44.63-.32H-20a23.01 23.01 0 0 1 44.37-2zm-36.82 2a1 1 0 0 0-.44.1l-3.1 1.56.89 1.79 1.31-.66a3 3 0 0 1 2.69 0l2.2 1.1a1 1 0 0 0 .9 0l2.21-1.1a3 3 0 0 1 2.69 0l2.2 1.1a1 1 0 0 0 .9 0l2.21-1.1a3 3 0 0 1 2.69 0l2.2 1.1a1 1 0 0 0 .86.02l2.88-1.27a3 3 0 0 1 2.43 0l2.88 1.27a1 1 0 0 0 .85-.02l3.1-1.55-.89-1.79-1.42.71a3 3 0 0 1-2.56.06l-2.77-1.23a1 1 0 0 0-.4-.09h-.01a1 1 0 0 0-.4.09l-2.78 1.23a3 3 0 0 1-2.56-.06l-2.3-1.15a1 1 0 0 0-.45-.11h-.01a1 1 0 0 0-.44.1L.9 19.22a3 3 0 0 1-2.69 0l-2.2-1.1a1

hieptlccc

import { Component, OnInit } from '@angular/core';
import { AngularFireAuth } from '@angular/fire/auth';
import { Router } from '@angular/router';
import { CometChat } from '@cometchat-pro/chat';

@Component({
  selector: 'app-chat',
  templateUrl: './chat.component.html',
  styleUrls: ['./chat.component.css'],
})

hieptlccc

<div class="app">
  <div class="login-page">
    <div class="form">
      <img class="header__logo" src="/assets/logo.svg" alt="logo" />
      <form
        class="login-form"
        #profileForm="ngForm"
        (ngSubmit)="submit(profileForm)"
      >
        <input

hieptlccc

@import url(https://fonts.googleapis.com/css?family=Roboto:300);

.login-page {
  width: 360px;
  padding: 6% 0 0;
  margin: auto;
}
.form {
  position: relative;
  z-index: 1;

hieptlccc

import { Component, OnInit } from '@angular/core';
import { NgForm } from '@angular/forms';
import { AngularFireAuth } from '@angular/fire/auth';
import { Router } from '@angular/router';
import { CometChat } from '@cometchat-pro/chat';
import { environment } from 'src/environments/environment'

@Component({
  selector: 'app-profile',
  templateUrl: './profile.component.html',

hieptlccc

<div class="login-page">
    <div class="form">
      <img
        class="header__logo"
        src="/assets/logo.svg"
        alt="youtube logo"
      />
      <form
        class="login-form"
        #loginForm="ngForm"

hieptlccc

@import url(https://fonts.googleapis.com/css?family=Roboto:300);

.login-page {
  width: 360px;
  padding: 8% 0 0;
  margin: auto;
}
.form {
  position: relative;
  z-index: 1;