chg: usr: add modern Webauthn authentication #4

assets/js/passkey.jsx

@@ -0,0 +1,37 @@
+/**
+ * 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 PasskeyManager from './components/PasskeyManager';
+import PasskeyLogin from './components/PasskeyLogin';
+
+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} />,
+  );
+}