/**
 * This file is part of the SplendidBear Websites' projects.
 *
 * Copyright (c) 2026 @ www.splendidbear.org
 *
 * For the full copyright and license information, please view the LICENSE
 * file that was distributed with this source code.
 */

import React from 'react';
import { createRoot } from 'react-dom/client';
import { PasskeyLogin, PasskeyManager } from '@global-components';

const passkeyManagerRoot = document.getElementById('passkey-manager-root');

if (passkeyManagerRoot) {
  const credentials = JSON.parse(passkeyManagerRoot.dataset.credentials || '[]');
  const apiRoutes = JSON.parse(passkeyManagerRoot.dataset.apiRoutes || '{}');

  createRoot(passkeyManagerRoot).render(
    <PasskeyManager
      credentials={credentials}
      apiRoutes={apiRoutes}
    />,
  );
}

const passkeyLoginRoot = document.getElementById('passkey-login-root');

if (passkeyLoginRoot) {
  const apiRoutes = JSON.parse(passkeyLoginRoot.dataset.apiRoutes || '{}');

  createRoot(passkeyLoginRoot).render(
    <PasskeyLogin apiRoutes={apiRoutes} />,
  );
}