import { FC, memo } from "react";
import { Include, Plugin } from "..";
import { is121Version } from "../../utils";

export interface WebVRProps {
  url: string;
  [key: string]: unknown;
}

const WEBVR_121_CONFIG = {
  keep: true,
  devices: "webgl",
};

const WEBVR_119_CONFIG = {
  name: "WebVR",
  keep: true,
  devices: "html5",
  "multireslock.desktop": true,
  "multireslock.mobile.or.tablet": false,
  mobilevr_support: true,
  mobilevr_fake_support: true,
};

export const WebVR: FC<WebVRProps> = memo(({ url, ...attrs }) => {
  return (
    <>
      <Include url={url} />
      <Plugin
        name="WebVR"
        {...Object.assign(
          { ...(is121Version ? WEBVR_121_CONFIG : WEBVR_119_CONFIG) },
          attrs
        )}
      />
    </>
  );
});