Reference

Reference

For a better reference on how to use the plugin you can check the following Ionic(React) exapmle.

import {
  IonButton,
  IonContent,
  IonHeader,
  IonIcon,
  IonPage,
  IonTitle,
  IonToolbar,
  useIonAlert,
} from "@ionic/react";
import {
  alert,
  chatbox,
  closeOutline,
  desktopOutline,
  personCircleOutline,
  personRemoveOutline,
} from "ionicons/icons";
import "./Home.css";
import { Engage, InitConfig, TagUserInfo } from "teamviewer-engage-sdk";
import { useEffect } from "react";

const Home: React.FC = () => {
  const [presentAlert] = useIonAlert();
  var chatOverlayEnabled = false;

  let init = new InitConfig(
      "user123",
      "123456789qwerty",
      "theServerURL.com",
      "theCDNServerUrl.com",
      false,
      "#ff8d00",
      "#002448");

  let userInfo = new TagUserInfo(
    "123456",
    "johnDoe@mail.com",
    "John",
    "Doe",
    ["Labels", "list"]);

  useEffect(() => {
    Engage.initPlugin({ initConfig: init });
  }, []);

  return (
    <IonPage>
      <IonHeader>
        <IonToolbar color="primary">
          <IonTitle>Engage Plugin</IonTitle>
        </IonToolbar>
      </IonHeader>
      <IonContent fullscreen>
        <div className="main-screen">
          <IonButton onClick={() => Engage.startCoBrowse()}>
            <IonIcon icon={desktopOutline} />
            Start Co-Browsing
          </IonButton>
          <IonButton onClick={() => Engage.stopCoBrowse()}>
            <IonIcon icon={closeOutline} />
            Stop Co-Browsing
          </IonButton>
          <IonButton onClick={() => Engage.openChat()}>
            <IonIcon icon={chatbox} />
            Open Chat
          </IonButton>
          <IonButton onClick={() => Engage.tagUser({ tagUserInfo: userInfo })}>
            <IonIcon icon={personCircleOutline} />
            Tag User
          </IonButton>
          <IonButton onClick={() => Engage.clearUser()}>
            <IonIcon icon={personRemoveOutline} />
            Clear user
          </IonButton>
          <IonButton
            onClick={() =>
              presentAlert({
                header: "Alert",
                subHeader: "Important message",
                message: "This is an alert!",
                buttons: ["OK"],
              })
            }
          >
            <IonIcon icon={alert} />
            Alert Dialog Test
          </IonButton>
        </div>
      </IonContent>
    </IonPage>
  );
};

export default Home;

Run the app

ionic cap build <android|ios>

This command will open the android studio/xCode for you. From there you can press the run button to start the app.

← Usage