fluxy-bot 0.3.2 → 0.3.4

package/dist-fluxy/fluxy.html

@@ -4,7 +4,7 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0, interactive-widget=resizes-content" />
     <title>Fluxy Chat</title>
-    <script type="module" crossorigin src="/fluxy/assets/fluxy-Cejh7HRl.js"></script>
+    <script type="module" crossorigin src="/fluxy/assets/fluxy-DG-KxPWf.js"></script>
     <link rel="modulepreload" crossorigin href="/fluxy/assets/globals-Bu5tVsgN.js">
     <link rel="stylesheet" crossorigin href="/fluxy/assets/globals-DYOj4b0m.css">
   </head>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fluxy-bot",
-  "version": "0.3.2",
+  "version": "0.3.4",
   "description": "Self-hosted AI bot — run your own AI assistant from anywhere",
   "type": "module",
   "license": "MIT",

package/supervisor/chat/fluxy-main.tsx

@@ -5,7 +5,7 @@ import { WsClient } from './src/lib/ws-client';
 import { useFluxyChat } from './src/hooks/useFluxyChat';
 import OnboardWizard from './OnboardWizard';
 import LoginScreen from './src/components/LoginScreen';
-import { getAuthToken, setAuthToken, clearAuthToken, authFetch } from './src/lib/auth';
+import { getAuthToken, setAuthToken, clearAuthToken, authFetch, onAuthFailure } from './src/lib/auth';
 import MessageList from './src/components/Chat/MessageList';
 import InputBar from './src/components/Chat/InputBar';
 import './src/styles/globals.css';
@@ -74,6 +74,14 @@ function FluxyApp() {
     setAuthenticated(true);
   };
 
+  // Handle mid-session token expiry (authFetch gets 401)
+  useEffect(() => {
+    onAuthFailure(() => {
+      setAuthenticated(false);
+      setAuthRequired(true);
+    });
+  }, []);
+
   // Connect WebSocket only when authenticated
   useEffect(() => {
     if (!authenticated) return;
@@ -145,7 +153,7 @@ function FluxyApp() {
   }, [menuOpen]);
 
   const { messages, streaming, streamBuffer, tools, sendMessage, stopStreaming, clearContext } =
-    useFluxyChat(clientRef.current, reloadTrigger);
+    useFluxyChat(clientRef.current, reloadTrigger, authenticated);
 
   // Auth gate: show spinner while checking, login screen if needed
   if (!authChecked) {

package/supervisor/chat/src/components/LoginScreen.tsx

@@ -6,12 +6,13 @@ interface Props {
 }
 
 export default function LoginScreen({ onLogin }: Props) {
+  const [username, setUsername] = useState('');
   const [password, setPassword] = useState('');
   const [error, setError] = useState('');
   const [loading, setLoading] = useState(false);
 
   const handleSubmit = async () => {
-    if (!password.trim() || loading) return;
+    if (!username.trim() || !password.trim() || loading) return;
     setLoading(true);
     setError('');
 
@@ -19,14 +20,14 @@ export default function LoginScreen({ onLogin }: Props) {
       const res = await fetch('/api/portal/login', {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ password }),
+        body: JSON.stringify({ username: username.trim(), password }),
       });
       const data = await res.json();
 
       if (res.ok && data.token) {
         onLogin(data.token);
       } else {
-        setError(data.error || 'Invalid password');
+        setError(data.error || 'Invalid credentials');
       }
     } catch {
       setError('Could not reach server');
@@ -39,6 +40,8 @@ export default function LoginScreen({ onLogin }: Props) {
     if (e.key === 'Enter') handleSubmit();
   };
 
+  const inputCls = 'w-full bg-white/[0.05] border border-white/[0.08] text-white rounded-xl px-4 py-3 text-base outline-none input-glow placeholder:text-white/20 transition-all';
+
   return (
     <div className="flex flex-col items-center justify-center h-dvh px-6">
       <div className="w-full max-w-[320px] flex flex-col items-center">
@@ -50,7 +53,7 @@ export default function LoginScreen({ onLogin }: Props) {
           Welcome back
         </h1>
         <p className="text-white/40 text-[13px] mb-6">
-          Enter your portal password to continue.
+          Enter your portal credentials to continue.
         </p>
 
         {error && (
@@ -59,20 +62,32 @@ export default function LoginScreen({ onLogin }: Props) {
           </div>
         )}
 
+        <input
+          type="text"
+          value={username}
+          onChange={(e) => setUsername(e.target.value)}
+          onKeyDown={handleKeyDown}
+          placeholder="Username"
+          autoFocus
+          autoComplete="username"
+          autoCapitalize="none"
+          autoCorrect="off"
+          className={inputCls}
+        />
+
         <input
           type="password"
           value={password}
           onChange={(e) => setPassword(e.target.value)}
           onKeyDown={handleKeyDown}
           placeholder="Password"
-          autoFocus
           autoComplete="current-password"
-          className="w-full bg-white/[0.05] border border-white/[0.08] text-white rounded-xl px-4 py-3 text-base outline-none input-glow placeholder:text-white/20 transition-all"
+          className={inputCls + ' mt-3'}
         />
 
         <button
           onClick={handleSubmit}
-          disabled={!password.trim() || loading}
+          disabled={!username.trim() || !password.trim() || loading}
           className="w-full mt-4 py-3 bg-gradient-brand hover:opacity-90 text-white text-[14px] font-semibold rounded-full transition-colors flex items-center justify-center gap-2 disabled:opacity-40"
         >
           {loading ? (

package/supervisor/chat/src/hooks/useFluxyChat.ts

@@ -8,7 +8,7 @@ import { authFetch } from '../lib/auth';
  * Loads/persists messages via the DB (worker API).
  * Supports cross-device sync via chat:sync WS events.
  */
-export function useFluxyChat(ws: WsClient | null, triggerReload?: number) {
+export function useFluxyChat(ws: WsClient | null, triggerReload?: number, enabled = true) {
   const [messages, setMessages] = useState<ChatMessage[]>([]);
   const [conversationId, setConversationId] = useState<string | null>(null);
   const [streaming, setStreaming] = useState(false);
@@ -62,19 +62,19 @@ export function useFluxyChat(ws: WsClient | null, triggerReload?: number) {
     } catch { /* worker not ready yet */ }
   }, []);
 
-  // Load on mount
+  // Load on mount (only when enabled/authenticated)
   useEffect(() => {
-    if (loaded.current) return;
+    if (!enabled || loaded.current) return;
     loaded.current = true;
     loadFromDb();
-  }, [loadFromDb]);
+  }, [enabled, loadFromDb]);
 
   // Reload on reconnect (triggerReload changes)
   useEffect(() => {
-    if (triggerReload && triggerReload > 0) {
+    if (enabled && triggerReload && triggerReload > 0) {
       loadFromDb();
     }
-  }, [triggerReload, loadFromDb]);
+  }, [enabled, triggerReload, loadFromDb]);
 
   useEffect(() => {
     if (!ws) return;

package/supervisor/chat/src/lib/auth.ts

@@ -1,5 +1,7 @@
 const TOKEN_KEY = 'fluxy_token';
 
+let authFailureCallback: (() => void) | null = null;
+
 export function getAuthToken(): string | null {
   return localStorage.getItem(TOKEN_KEY);
 }
@@ -12,6 +14,11 @@ export function clearAuthToken(): void {
   localStorage.removeItem(TOKEN_KEY);
 }
 
+/** Register a callback for when a 401 is received (token expired mid-session) */
+export function onAuthFailure(cb: () => void): void {
+  authFailureCallback = cb;
+}
+
 export async function authFetch(url: string, options: RequestInit = {}): Promise<Response> {
   const token = getAuthToken();
   const headers = new Headers(options.headers);
@@ -21,9 +28,10 @@ export async function authFetch(url: string, options: RequestInit = {}): Promise
 
   const res = await fetch(url, { ...options, headers });
 
-  if (res.status === 401) {
+  if (res.status === 401 && token) {
+    // Token was present but rejected — it expired
     clearAuthToken();
-    window.location.reload();
+    authFailureCallback?.();
   }
 
   return res;

package/supervisor/index.ts

@@ -193,8 +193,9 @@ export async function startSupervisor() {
         return;
       }
 
-      // Auth check for API routes
-      if (!isExemptRoute(req.method || 'GET', req.url || '')) {
+      // Auth check for API mutation routes (POST/PUT/DELETE) — GET is open for dashboard
+      const method = req.method || 'GET';
+      if (method !== 'GET' && !isExemptRoute(method, req.url || '')) {
         const needsAuth = await isAuthRequired();
         if (needsAuth) {
           const authHeader = req.headers['authorization'];

package/worker/index.ts

@@ -252,11 +252,13 @@ app.post('/api/portal/verify-password', (req, res) => {
 });
 
 app.post('/api/portal/login', (req, res) => {
-  const { password } = req.body;
-  if (!password) { res.status(400).json({ error: 'Password required' }); return; }
-  const stored = getSetting('portal_pass');
-  if (!stored) { res.status(400).json({ error: 'No password set' }); return; }
-  if (!verifyPassword(password, stored)) { res.status(401).json({ error: 'Invalid password' }); return; }
+  const { username, password } = req.body;
+  if (!username || !password) { res.status(400).json({ error: 'Username and password required' }); return; }
+  const storedUser = getSetting('portal_user');
+  const storedPass = getSetting('portal_pass');
+  if (!storedPass) { res.status(400).json({ error: 'No password set' }); return; }
+  if (username.trim().toLowerCase() !== storedUser) { res.status(401).json({ error: 'Invalid credentials' }); return; }
+  if (!verifyPassword(password, storedPass)) { res.status(401).json({ error: 'Invalid credentials' }); return; }
 
   // Clean up expired sessions opportunistically
   deleteExpiredSessions();