feat: connect application input and output boundaries

src/presentation/providers/application-provider.tsx

@@ -0,0 +1,31 @@
+import {
+  createContext,
+  type ReactNode,
+  useContext,
+} from "react";
+
+import type { ApplicationApi } from "../../application/create-application.js";
+
+const ApplicationContext = createContext<ApplicationApi | null>(null);
+
+export function ApplicationProvider({
+  application,
+  children,
+}: Readonly<{
+  application: ApplicationApi;
+  children: ReactNode;
+}>) {
+  return (
+    <ApplicationContext.Provider value={application}>
+      {children}
+    </ApplicationContext.Provider>
+  );
+}
+
+export function useApplication(): ApplicationApi {
+  const application = useContext(ApplicationContext);
+  if (!application) {
+    throw new Error("ApplicationProvider is required");
+  }
+  return application;
+}

src/presentation/providers/session-provider.jsx

@@ -1,11 +1,12 @@
 import { createContext, useContext, useMemo, useSyncExternalStore } from "react";
+import { useApplication } from "./application-provider.js";
 
 /**
  * @typedef {{
- *   sessionState: import("../../application/ports/auth-session-port.js").SessionState,
- *   beginSignIn: import("../../application/ports/auth-session-port.js").AuthSessionPort["beginSignIn"],
- *   signOut: import("../../application/ports/auth-session-port.js").AuthSessionPort["signOut"],
- *   recover: import("../../application/ports/auth-session-port.js").AuthSessionPort["recover"]
+ *   sessionState: import("../../application/ports/in/application-api.js").SessionState,
+ *   beginSignIn: import("../../application/ports/in/application-api.js").ApplicationApi["session"]["beginSignIn"],
+ *   signOut: import("../../application/ports/in/application-api.js").ApplicationApi["session"]["signOut"],
+ *   recover: import("../../application/ports/in/application-api.js").ApplicationApi["session"]["recover"]
  * }} SessionContextValue
  */
 
@@ -14,26 +15,24 @@ const SessionContext = createContext(
 );
 
 /**
- * @param {{
- *   authSession: import("../../application/ports/auth-session-port.js").AuthSessionPort,
- *   children: React.ReactNode
- * }} props
+ * @param {{ children: React.ReactNode }} props
  */
-export function SessionProvider({ authSession, children }) {
+export function SessionProvider({ children }) {
+  const { session } = useApplication();
   const sessionState = useSyncExternalStore(
-    authSession.subscribe,
-    authSession.getState,
-    authSession.getState,
+    session.subscribe,
+    session.getSnapshot,
+    session.getSnapshot,
   );
   const value = useMemo(
     () =>
       Object.freeze({
         sessionState,
-        beginSignIn: authSession.beginSignIn,
-        signOut: authSession.signOut,
-        recover: authSession.recover,
+        beginSignIn: session.beginSignIn,
+        signOut: session.signOut,
+        recover: session.recover,
       }),
-    [authSession, sessionState],
+    [session, sessionState],
   );
 
   return (

src/presentation/providers/theme-provider.jsx

@@ -11,6 +11,7 @@ import {
   normalizeColorSchemePreference,
   resolveColorScheme,
 } from "../../application/policies/color-scheme.js";
+import { useApplication } from "./application-provider.js";
 
 /**
  * @typedef {{
@@ -30,18 +31,13 @@ function systemPrefersDark() {
 }
 
 /**
- * @param {{
- *   storage?: import("../../application/ports/storage-port.js").StoragePort,
- *   children: React.ReactNode
- * }} props
+ * @param {{ children: React.ReactNode }} props
  */
-export function ThemeProvider({ storage, children }) {
-  const [preference, updatePreference] = useState(() => {
-    const result = storage?.read("COLOR_SCHEME");
-    return normalizeColorSchemePreference(
-      result?.ok ? result.value : undefined,
-    );
-  });
+export function ThemeProvider({ children }) {
+  const { preferences } = useApplication();
+  const [preference, updatePreference] = useState(
+    preferences.getColorScheme,
+  );
   const [darkSystemTheme, setDarkSystemTheme] = useState(systemPrefersDark);
   const resolvedTheme = resolveColorScheme(preference, darkSystemTheme);
 
@@ -70,10 +66,10 @@ export function ThemeProvider({ storage, children }) {
         setPreference(next) {
           const normalized = normalizeColorSchemePreference(next);
           updatePreference(normalized);
-          storage?.write("COLOR_SCHEME", normalized);
+          preferences.setColorScheme(normalized);
         },
       }),
-    [preference, resolvedTheme, storage],
+    [preference, preferences, resolvedTheme],
   );
 
   return <ThemeContext.Provider value={value}>{children}</ThemeContext.Provider>;