refactor: Consolidate Alpine.js initialization and module loading

This commit reorganizes the Alpine.js initialization process to ensure all
component modules are registered before Alpine starts, preventing potential
race conditions and improving code organization.

Changes:
- Add web/src/register-alpine.ts: Central module that imports all Alpine
  component modules before calling Alpine.start(), ensuring proper
  registration order
- Update web/src/alpine.ts: Remove Alpine.start() call since it's now
  handled in register-alpine.ts
- Update web/src/main.ts: Replace individual module imports with single
  register-alpine import, simplifying the entry point
- Update web/src/header.ts: Rename changeThemeTo function to changeTheme
  for consistency with other naming conventions

This change ensures all Alpine.global() calls complete before Alpine
initializes, following best practices for Alpine.js module registration.

web/src/alpine.ts

@@ -9,7 +9,6 @@ declare global {
 
 // Initialize Alpine
 window.Alpine = Alpine;
-Alpine.start();
 
 // Re-export Alpine for other modules to use
 export { Alpine };

web/src/header.ts

@@ -4,7 +4,7 @@ import { Alpine } from "./alpine";
 import { applyTheme } from "./theme";
 import { updateThemeIndicators } from "./themeDropdown";
 
-const changeThemeTo = (theme: string): void => {
+const changeTheme = (theme: string): void => {
   // Apply the theme using the consolidated function from theme.ts
   applyTheme(theme);
 
@@ -30,12 +30,13 @@ const logout = (): void => {
   window.location.href = "/";
 };
 
-export { changeThemeTo, logout };
+export { changeTheme, logout };
 
 Alpine.global("header", {
   logout,
   changeThemeTo: (theme: string) => {
-    changeThemeTo(theme);
+    console.log("changeThemeTo called with:", theme);
+    changeTheme(theme);
     updateThemeIndicators();
   },
 });

web/src/main.ts

@@ -23,13 +23,7 @@ import "./profile";
 import "./profile-modal";
 import "./queue";
 import "./register";
-import "./search";
+import "./register-alpine";
 import "./storage";
-import "./themeDropdown";
 import "./theme";
-import "./toast";
-import "./toast-error";
-import "./unlinked_books";
 import "./woodPanelingInit";
-import "./woodPaneling";
-import "./alpine";

web/src/register-alpine.ts

@@ -0,0 +1,33 @@
+import { Alpine } from "./alpine";
+// Import all modules that register Alpine globals
+// These imports trigger their Alpine.global() calls
+import "./admin";
+import "./api";
+import "./analytics";
+import "./api-explorer-docs";
+import "./bookshelf";
+import "./collection-rules";
+import "./collections";
+import "./conflicts";
+import "./custom-section-builder";
+import "./dashboard";
+import "./device-management";
+import "./docs";
+import "./header";
+import "./index";
+import "./library";
+import "./login";
+import "./linking";
+import "./password_validation";
+import "./profile";
+import "./profile-modal";
+import "./queue";
+import "./register";
+import "./search";
+import "./themeDropdown";
+import "./toast";
+import "./toast-error";
+import "./unlinked_books";
+import "./woodPaneling";
+// NOW start Alpine after all registrations complete
+Alpine.start();