@alepha/react 0.13.7 → 0.13.8

package/src/core/contexts/AlephaProvider.tsx

@@ -0,0 +1,41 @@
+import { Alepha } from "alepha";
+import { type ReactNode, useEffect, useMemo, useState } from "react";
+import { AlephaContext } from "./AlephaContext.ts";
+
+export interface AlephaProviderProps {
+  children: ReactNode;
+  onError: (error: Error) => ReactNode;
+  onLoading: () => ReactNode;
+}
+
+/**
+ * AlephaProvider component to initialize and provide Alepha instance to the app.
+ * This isn't recommended for apps using alepha/react/router, as Router will handle this for you.
+ */
+export const AlephaProvider = (props: AlephaProviderProps) => {
+  const alepha = useMemo(() => Alepha.create(), []);
+
+  const [started, setStarted] = useState(false);
+  const [error, setError] = useState<Error | undefined>();
+
+  useEffect(() => {
+    alepha
+      .start()
+      .then(() => setStarted(true))
+      .catch((err) => setError(err));
+  }, [alepha]);
+
+  if (error) {
+    return props.onError(error);
+  }
+
+  if (!started) {
+    return props.onLoading();
+  }
+
+  return (
+    <AlephaContext.Provider value={alepha}>
+      {props.children}
+    </AlephaContext.Provider>
+  );
+};

package/src/core/index.shared.ts

@@ -1,3 +1,4 @@
+export * from "./contexts/AlephaProvider.tsx";
 export * from "./contexts/AlephaContext.ts";
 export * from "./hooks/useAction.ts";
 export * from "./hooks/useAlepha.ts";