import { useEffect, useMemo } from "react";
import metricService, { EGoals, EMetrics } from "@/services/metric/metricService";
import AndroidCamera from "./android";
import IphoneCamera from "./iphone";

function Camera() {
  const isIphoneSafari = useMemo((): boolean => {
    const userAgent = navigator.userAgent;
    const isIOS = /iPhone/i.test(userAgent);
    const isSafari = /Safari/i.test(userAgent) &&
      !/CriOS/i.test(userAgent) && // не Chrome
      !/FxiOS/i.test(userAgent) && // не Firefox
      !/EdgiOS/i.test(userAgent) && // не Edge
      !/OPiOS/i.test(userAgent);   // не Opera

    return isIOS && isSafari;
  }, []);

  useEffect(() => {
    metricService.reachGoal(EGoals.CAMERA_OPEN, [EMetrics.YANDEX, EMetrics.KLAVIYO]);
  }, []);

  // useEffect(() => {
  //   if (toastVisible === EToastVisible.try_again) {
  //     metricService.reachGoal(EGoals.CAMERA_ERROR, [EMetrics.YANDEX, EMetrics.KLAVIYO]);
  //   }
  // }, [toastVisible]);

  return (
    <>
      {isIphoneSafari ? <IphoneCamera /> : <AndroidCamera />}
    </>
  );
}

export default Camera;