feat: refactoring modules

furumi-node-player/client/src/App.tsx

@@ -1,4 +1,5 @@
 import { useEffect, useMemo, useState } from 'react'
+import { FurumiPlayer } from './FurumiPlayer'
 import './App.css'
 
 type UserProfile = {
@@ -60,74 +61,81 @@ function App() {
 
   const loginUrl = `${apiBase}/api/login`
   const logoutUrl = `${apiBase}/api/logout`
+  const playerApiRoot = `${apiBase}/api`
 
   return (
-    <main className="page">
-      <section className="card">
-        <h1>OIDC Login</h1>
-        <p className="subtitle">Авторизация обрабатывается на Express сервере.</p>
+    <>
+      {!loading && (user || runWithoutAuth) ? (
+        <FurumiPlayer apiRoot={playerApiRoot} />
+      ) : (
+        <main className="page">
+          <section className="card">
+            <h1>OIDC Login</h1>
+            <p className="subtitle">Авторизация обрабатывается на Express сервере.</p>
 
-        <div className="settings">
-          <label className="toggle">
-            <input
-              type="checkbox"
-              checked={runWithoutAuth}
-              onChange={(e) => {
-                const next = e.target.checked
-                setRunWithoutAuth(next)
-                try {
-                  if (next) window.localStorage.setItem(NO_AUTH_STORAGE_KEY, '1')
-                  else window.localStorage.removeItem(NO_AUTH_STORAGE_KEY)
-                } catch {
-                  // ignore
-                }
-                setLoading(true)
-                setUser(null)
-              }}
-            />
-            <span>Запускать без авторизации</span>
-          </label>
-        </div>
+            <div className="settings">
+              <label className="toggle">
+                <input
+                  type="checkbox"
+                  checked={runWithoutAuth}
+                  onChange={(e) => {
+                    const next = e.target.checked
+                    setRunWithoutAuth(next)
+                    try {
+                      if (next) window.localStorage.setItem(NO_AUTH_STORAGE_KEY, '1')
+                      else window.localStorage.removeItem(NO_AUTH_STORAGE_KEY)
+                    } catch {
+                      // ignore
+                    }
+                    setLoading(true)
+                    setUser(null)
+                  }}
+                />
+                <span>Запускать без авторизации</span>
+              </label>
+            </div>
 
-        {loading && <p>Проверяю сессию...</p>}
-        {error && <p className="error">Ошибка: {error}</p>}
+            {loading && <p>Проверяю сессию...</p>}
+            {error && <p className="error">Ошибка: {error}</p>}
 
-        {!loading && runWithoutAuth && (
-          <p className="hint">
-            Режим без авторизации включён. Для входа отключи настройку выше.
-          </p>
-        )}
-
-        {!loading && !user && (
-          <a className="btn" href={loginUrl}>
-            Войти через OIDC
-          </a>
-        )}
-
-        {!loading && user && (
-          <div className="profile">
-            <p>
-              <strong>ID:</strong> {user.sub}
-            </p>
-            {user.name && (
-              <p>
-                <strong>Имя:</strong> {user.name}
+            {!loading && runWithoutAuth && (
+              <p className="hint">
+                Режим без авторизации включён. Для входа отключи настройку выше.
               </p>
             )}
-            {user.email && (
-              <p>
-                <strong>Email:</strong> {user.email}
-              </p>
-            )}
-            {!runWithoutAuth && (
-              <a className="btn ghost" href={logoutUrl}>
-                Выйти
+
+            {!loading && !user && (
+              <a className="btn" href={loginUrl}>
+                Войти через OIDC
               </a>
             )}
-          </div>
-        )}
-      </section>
-    </main>
+
+            {!loading && user && (
+              <div className="profile">
+                <p>
+                  <strong>ID:</strong> {user.sub}
+                </p>
+                {user.name && (
+                  <p>
+                    <strong>Имя:</strong> {user.name}
+                  </p>
+                )}
+                {user.email && (
+                  <p>
+                    <strong>Email:</strong> {user.email}
+                  </p>
+                )}
+                {!runWithoutAuth && (
+                  <a className="btn ghost" href={logoutUrl}>
+                    Выйти
+                  </a>
+                )}
+              </div>
+            )}
+          </section>
+        </main>
+      )}
+    </>
   )
 }