hieptl

...
const Chat: React.FC = () => {
  const history = useHistory();

  const { cometChat, user, selectedConversation, setCallType } = useContext(Context);

  const [messages, setMessages] = useState<any>([]);
  ...
  const messageRef = useRef<any>(null);
  const messageBottomRef = useRef<any>(null);

hieptl

import React, { useContext } from 'react';

import Context from '../context';

import deliveredAtIcon from '../images/deliveredAt.png';
import readAtIcon from '../images/readAt.png';

const Message: React.FC<any> = (props) => {
  const { message, messageType, deliveredAt, readAt, senderId, avatar, isRight } = props;

hieptl

...
const Chat: React.FC = () => {
  ...
  const { cometChat, user, selectedConversation, setCallType } = useContext(Context);

  const [messages, setMessages] = useState<any>([]);
  ...
  const messageRef = useRef<any>(null);
  const messageBottomRef = useRef<any>(null);
  ...

hieptl

...
import { Chooser } from '@ionic-native/chooser'
import { ImagePicker } from '@ionic-native/image-picker';
...
import imageIcon from '../images/image.png';

const Chat: React.FC = () => {
  const history = useHistory();

  const { cometChat, user, selectedConversation, setCallType } = useContext(Context);

hieptl

...
const Chat: React.FC = () => {
  const history = useHistory();

  const { cometChat, user, selectedConversation, setCallType } = useContext(Context);

  const [messages, setMessages] = useState<any>([]);
  ...
  const [isActionSheetShown, setIsActionSheetShown] = useState<any>(false);

hieptl

...
const Chat: React.FC = () => {
  ...
  const { cometChat, user, selectedConversation, setCallType } = useContext(Context);
  ...
  useEffect(() => {
    ...
    return () => {
      if (selectedConversation) {
        ...

hieptl

...
const App: React.FC<any> = () => {
  const callListenerId = useRef(uuidv4());

  const [isLoading, setIsLoading] = useState(false);
  const [cometChat, setCometChat] = useState<any>(null);
  const [user, setUser] = useState<any>(null);
  const [selectedConversation, setSelectedConversation] = useState<any>(null);

  const [callType, setCallType] = useState<any>(null);

hieptl

...
const startAudioCall = () => {
  if (cometChat && selectedConversation) {
    setCallType(cometChat.CALL_TYPE.AUDIO);
  }
};

const startVideoCall = () => {
  if (cometChat && selectedConversation) {
    setCallType(cometChat.CALL_TYPE.VIDEO);

hieptl

import React, { useContext } from 'react';

import { IonToolbar, IonTitle, IonHeader, IonButtons, IonBackButton, IonButton, IonIcon } from '@ionic/react';
import { trash, addCircle, removeCircle, exit } from 'ionicons/icons'
import { useHistory } from 'react-router';

import Context from '../context';

const ManageGroup: React.FC = () => {

hieptl

import React, { useState, useEffect, useContext } from 'react';

import { IonToolbar, IonTitle, IonHeader, IonButtons, IonBackButton } from '@ionic/react';

import { useHistory } from 'react-router';
import { v4 as uuidv4 } from "uuid";

import Context from '../context';

const AddGroupMembers: React.FC = () => {