applesauce-react 1.0.0 → 2.0.0

package/README.md

@@ -10,7 +10,7 @@ npm install applesauce-react
 
 ## Example
 
-```jsx
+```tsx
 import { EventStore, QueryStore, Queries } from "applesauce-core";
 import { QueryStoreProvider } from "applesauce-react/providers";
 import { useStoreQuery } from "applesauce-react/hooks";

package/dist/hooks/index.d.ts

@@ -4,9 +4,9 @@ export * from "./use-action-hub.js";
 export * from "./use-action.js";
 export * from "./use-active-account.js";
 export * from "./use-event-factory.js";
+export * from "./use-event-model.js";
 export * from "./use-event-store.js";
+export * from "./use-observable-memo.js";
 export * from "./use-observable.js";
-export * from "./use-query-store.js";
 export * from "./use-render-nast.js";
 export * from "./use-rendered-content.js";
-export * from "./use-store-query.js";

package/dist/hooks/index.js

@@ -4,9 +4,9 @@ export * from "./use-action-hub.js";
 export * from "./use-action.js";
 export * from "./use-active-account.js";
 export * from "./use-event-factory.js";
+export * from "./use-event-model.js";
 export * from "./use-event-store.js";
+export * from "./use-observable-memo.js";
 export * from "./use-observable.js";
-export * from "./use-query-store.js";
 export * from "./use-render-nast.js";
 export * from "./use-rendered-content.js";
-export * from "./use-store-query.js";

package/dist/hooks/use-event-model.d.ts

@@ -0,0 +1,3 @@
+import { ModelConstructor } from "applesauce-core";
+/** Runs and subscribes to a model on the event store */
+export declare function useEventModel<T extends unknown, Args extends Array<any>>(factory: ModelConstructor<T, Args>, args?: Args | null): T | undefined;

package/dist/hooks/use-event-model.js

@@ -0,0 +1,16 @@
+import { withImmediateValueOrDefault } from "applesauce-core";
+import { useObservableEagerState } from "observable-hooks";
+import { useMemo } from "react";
+import { of } from "rxjs";
+import { useEventStore } from "./use-event-store.js";
+/** Runs and subscribes to a model on the event store */
+export function useEventModel(factory, args) {
+    const store = useEventStore();
+    const observable$ = useMemo(() => {
+        if (args)
+            return store.model(factory, ...args).pipe(withImmediateValueOrDefault(undefined));
+        else
+            return of(undefined);
+    }, [args, store]);
+    return useObservableEagerState(observable$);
+}

package/dist/hooks/use-observable-memo.d.ts

@@ -0,0 +1,7 @@
+import { BehaviorSubject, Observable } from "rxjs";
+/** A hook that recreates an observable when the dependencies change */
+export declare function useObservableMemo<T>(factory: () => BehaviorSubject<T>, deps: any[]): T;
+export declare function useObservableMemo<T>(factory: () => Observable<T> | undefined, deps: any[]): T | undefined;
+/** A hook that recreates a synchronous observable when the dependencies change */
+export declare function useObservableEagerMemo<T>(factory: () => Observable<T>, deps: any[]): T;
+export declare function useObservableEagerMemo<T>(factory: () => Observable<T> | undefined, deps: any[]): T | undefined;

package/dist/hooks/use-observable-memo.js

@@ -0,0 +1,9 @@
+import { useObservableEagerState, useObservableState } from "observable-hooks";
+import { useMemo } from "react";
+import { EMPTY } from "rxjs";
+export function useObservableMemo(factory, deps) {
+    return useObservableState(useMemo(() => factory() || EMPTY, deps));
+}
+export function useObservableEagerMemo(factory, deps) {
+    return useObservableEagerState(useMemo(() => factory() || EMPTY, deps));
+}

package/dist/hooks/use-observable.d.ts

@@ -1,4 +1 @@
-import { type BehaviorSubject, type Observable } from "rxjs";
-/** A thing wrapper around useObservableState that allows undefined */
-export declare function useObservable<T extends unknown>(observable?: BehaviorSubject<T>): T;
-export declare function useObservable<T extends unknown>(observable?: Observable<T>): T | undefined;
+export * from "observable-hooks";

package/dist/hooks/use-observable.js

@@ -1,5 +1,2 @@
-import { useObservableState } from "observable-hooks";
-import { EMPTY } from "rxjs";
-export function useObservable(observable) {
-    return useObservableState(observable ?? EMPTY);
-}
+// NOTE: re-export hooks from observable-hooks to avoid confusion
+export * from "observable-hooks";

package/dist/providers/store-provider.d.ts

@@ -1,12 +1,7 @@
 import { PropsWithChildren } from "react";
-import { IEventStore, QueryStore } from "applesauce-core";
-export declare const QueryStoreContext: import("react").Context<QueryStore | null>;
+import { IEventStore } from "applesauce-core";
 export declare const EventStoreContext: import("react").Context<IEventStore | null>;
 /** Provides a EventStore to the component tree */
 export declare function EventStoreProvider({ eventStore, children }: PropsWithChildren<{
     eventStore: IEventStore;
 }>): import("react/jsx-runtime").JSX.Element;
-/** Provides a QueryStore and EventStore to the component tree */
-export declare function QueryStoreProvider({ queryStore, children }: PropsWithChildren<{
-    queryStore: QueryStore;
-}>): import("react/jsx-runtime").JSX.Element;

package/dist/providers/store-provider.js

@@ -1,12 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { createContext } from "react";
-export const QueryStoreContext = createContext(null);
 export const EventStoreContext = createContext(null);
 /** Provides a EventStore to the component tree */
 export function EventStoreProvider({ eventStore, children }) {
     return _jsx(EventStoreContext.Provider, { value: eventStore, children: children });
 }
-/** Provides a QueryStore and EventStore to the component tree */
-export function QueryStoreProvider({ queryStore, children }) {
-    return (_jsx(EventStoreProvider, { eventStore: queryStore.store, children: _jsx(QueryStoreContext.Provider, { value: queryStore, children: children }) }));
-}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "applesauce-react",
-  "version": "1.0.0",
+  "version": "2.0.0",
   "description": "React hooks for applesauce",
   "type": "module",
   "main": "dist/index.js",
@@ -49,12 +49,12 @@
     }
   },
   "dependencies": {
-    "applesauce-accounts": "^1.0.0",
-    "applesauce-actions": "^1.0.0",
-    "applesauce-content": "^1.0.0",
-    "applesauce-core": "^1.0.0",
-    "applesauce-factory": "^1.0.0",
-    "nostr-tools": "^2.10.4",
+    "applesauce-accounts": "^2.0.0",
+    "applesauce-actions": "^2.0.0",
+    "applesauce-content": "^2.0.0",
+    "applesauce-core": "^2.0.0",
+    "applesauce-factory": "^2.0.0",
+    "nostr-tools": "^2.13",
     "observable-hooks": "^4.2.4",
     "react": "^18.3.1",
     "rxjs": "^7.8.1"
@@ -62,7 +62,7 @@
   "devDependencies": {
     "@types/react": "^18.3.18",
     "typescript": "^5.8.3",
-    "vitest": "^3.1.1"
+    "vitest": "^3.2.3"
   },
   "funding": {
     "type": "lightning",

package/dist/hooks/use-query-store.d.ts

@@ -1,5 +0,0 @@
-/**
- * Gets the QueryStore from a parent {@link QueryStoreProvider} component
- * If there is none it throws an error
- */
-export declare function useQueryStore(): import("applesauce-core").QueryStore;

package/dist/hooks/use-query-store.js

@@ -1,12 +0,0 @@
-import { useContext } from "react";
-import { QueryStoreContext } from "../providers/store-provider.js";
-/**
- * Gets the QueryStore from a parent {@link QueryStoreProvider} component
- * If there is none it throws an error
- */
-export function useQueryStore() {
-    const store = useContext(QueryStoreContext);
-    if (!store)
-        throw new Error("Missing QueryStoreProvider");
-    return store;
-}

package/dist/hooks/use-store-query.d.ts

@@ -1,7 +0,0 @@
-import { QueryConstructor } from "applesauce-core";
-/**
- * Runs and subscribes to a query in the query store
- * @example
- * const events = useStoreQuery(TimelineQuery, [{kinds: [1]}])
- */
-export declare function useStoreQuery<T extends unknown, Args extends Array<any>>(queryConstructor: QueryConstructor<T, Args>, args?: Args | null): T | undefined;

package/dist/hooks/use-store-query.js

@@ -1,19 +0,0 @@
-import { useMemo } from "react";
-import { of } from "rxjs";
-import { useObservableEagerState } from "observable-hooks";
-import { useQueryStore } from "./use-query-store.js";
-/**
- * Runs and subscribes to a query in the query store
- * @example
- * const events = useStoreQuery(TimelineQuery, [{kinds: [1]}])
- */
-export function useStoreQuery(queryConstructor, args) {
-    const store = useQueryStore();
-    const observable = useMemo(() => {
-        if (args)
-            return store.createQuery(queryConstructor, ...args);
-        else
-            return of(undefined);
-    }, [args, store]);
-    return useObservableEagerState(observable);
-}