applesauce-react 0.8.0 → 0.10.0

package/README.md

@@ -6,7 +6,8 @@ React hooks for applesauce
 
 ```jsx
 import { EventStore, QueryStore, Queries } from "applesauce-core";
-import { QueryStoreProvider, useStoreQuery } from "applesauce-react";
+import { QueryStoreProvider } from "applesauce-react/providers";
+import { useStoreQuery } from "applesauce-react/hooks";
 
 const events = new EventStore();
 const store = new QueryStore(events);

package/dist/helpers/build-link-renderer.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Link } from "applesauce-content/nast";
 export type LinkRenderer = (url: URL, node: Link) => JSX.Element | false | null;
 export declare function buildLinkRenderer(handlers: LinkRenderer[]): import("react").NamedExoticComponent<import("./nast.js").ExtraProps<Link>>;

package/dist/hooks/index.d.ts

@@ -1,5 +1,6 @@
+export * from "./use-event-factory.js";
 export * from "./use-observable.js";
-export * from "./use-store-query.js";
-export * from "./use-render-nast.js";
 export * from "./use-query-store.js";
-export * from "./use-rendered-text-content.js";
+export * from "./use-render-nast.js";
+export * from "./use-rendered-content.js";
+export * from "./use-store-query.js";

package/dist/hooks/index.js

@@ -1,5 +1,6 @@
+export * from "./use-event-factory.js";
 export * from "./use-observable.js";
-export * from "./use-store-query.js";
-export * from "./use-render-nast.js";
 export * from "./use-query-store.js";
-export * from "./use-rendered-text-content.js";
+export * from "./use-render-nast.js";
+export * from "./use-rendered-content.js";
+export * from "./use-store-query.js";

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

@@ -0,0 +1,4 @@
+import { EventFactory } from "applesauce-factory";
+export declare function useEventFactory(require: false): EventFactory | undefined;
+export declare function useEventFactory(require: true): EventFactory;
+export declare function useEventFactory(): EventFactory;

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

@@ -0,0 +1,8 @@
+import { useContext } from "react";
+import { FactoryContext } from "../providers/factory-provider.js";
+export function useEventFactory(require = true) {
+    const factory = useContext(FactoryContext);
+    if (!require && !factory)
+        throw new Error("Missing EventFactoryProvider");
+    return factory;
+}

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

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

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

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

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

@@ -1,4 +1,6 @@
 import { type BehaviorSubject, type Observable } from "rxjs";
+export declare function getCurrentValue<T extends unknown>(observable: BehaviorSubject<T>): T;
+export declare function getCurrentValue<T extends unknown>(observable: Observable<T>): T | undefined;
 /** Subscribe to the value of an observable */
 export declare function useObservable<T extends unknown>(observable?: BehaviorSubject<T>): T;
 export declare function useObservable<T extends unknown>(observable?: Observable<T>): T | undefined;

package/dist/hooks/use-observable.js

@@ -1,13 +1,21 @@
 import { useState, useEffect } from "react";
+export function getCurrentValue(observable) {
+    if (Reflect.has(observable, "value"))
+        return Reflect.get(observable, "value");
+    return undefined;
+}
 export function useObservable(observable) {
-    const [_count, update] = useState(0);
-    const [value, setValue] = useState(observable && Reflect.has(observable, "value") ? Reflect.get(observable, "value") : undefined);
+    const current = observable && getCurrentValue(observable);
+    const [_count, setCount] = useState(0);
+    const [value, setValue] = useState(current);
     useEffect(() => {
+        // Reset the state, the method passed to subscribe will NOT always be called
+        setValue(observable && getCurrentValue(observable));
         const sub = observable?.subscribe((v) => {
             setValue(v);
-            update((c) => c + 1);
+            setCount((c) => c + 1);
         });
         return () => sub?.unsubscribe();
-    }, [observable]);
-    return value;
+    }, [observable, setValue, setCount]);
+    return current || value;
 }

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

@@ -1,5 +1,5 @@
 import { useContext } from "react";
-import { QueryStoreContext } from "../provider.js";
+import { QueryStoreContext } from "../providers/store-provider.js";
 /**
  * Gets the QueryStore from a parent {@link QueryStoreProvider} component
  * If there is none it throws an error

package/dist/hooks/use-render-nast.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Root } from "applesauce-content/nast";
 import { ComponentMap } from "../helpers/nast.js";
 export { ComponentMap };

package/dist/hooks/{use-rendered-text-content.d.ts → use-rendered-content.d.ts}

@@ -1,12 +1,13 @@
-/// <reference types="react" />
-import { getParsedTextContent } from "applesauce-content/text";
+import { getParsedContent } from "applesauce-content/text";
 import { EventTemplate, NostrEvent } from "nostr-tools";
 import { ComponentMap } from "../helpers/nast.js";
 import { LinkRenderer } from "../helpers/build-link-renderer.js";
 export { ComponentMap };
 type Options = {
+    /** The key to cache the results under, passing null will disable */
+    cacheKey: symbol | null;
     /** Override transformers */
-    transformers?: Parameters<typeof getParsedTextContent>[2];
+    transformers?: Parameters<typeof getParsedContent>[2];
     /** If set will use {@link buildLinkRenderer} to render links */
     linkRenderers?: LinkRenderer[];
     /** Override event content */

package/dist/hooks/{use-rendered-text-content.js → use-rendered-content.js}

@@ -1,14 +1,14 @@
 import { useMemo } from "react";
-import { getParsedTextContent } from "applesauce-content/text";
+import { truncateContent } from "applesauce-content/nast";
+import { getParsedContent } from "applesauce-content/text";
 import { useRenderNast } from "./use-render-nast.js";
 import { buildLinkRenderer } from "../helpers/build-link-renderer.js";
-import { truncateContent } from "applesauce-content/nast";
 /** Returns the parsed and render text content for an event */
 export function useRenderedContent(event, components, opts) {
     // if link renderers are set, override the link components
     const _components = useMemo(() => (opts?.linkRenderers ? { ...components, link: buildLinkRenderer(opts.linkRenderers) } : components), [opts?.linkRenderers, components]);
     // add additional transformers
-    const nast = useMemo(() => (event ? getParsedTextContent(event, opts?.content, opts?.transformers) : undefined), [event, opts?.content, opts?.transformers]);
+    const nast = useMemo(() => (event ? getParsedContent(event, opts?.content, opts?.transformers, opts?.cacheKey) : undefined), [event, opts?.content, opts?.transformers, opts?.cacheKey]);
     let truncated = nast;
     if (opts?.maxLength && nast)
         truncated = truncateContent(nast, opts.maxLength);

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

@@ -10,7 +10,7 @@ export function useStoreQuery(queryConstructor, args) {
     const store = useQueryStore();
     const observable = useMemo(() => {
         if (args)
-            return store.runQuery(queryConstructor)(...args);
+            return store.createQuery(queryConstructor, ...args);
         else
             return undefined;
     }, [args, store]);

package/dist/index.d.ts

@@ -1,3 +1,3 @@
-export * from "./provider.js";
 export * as Helpers from "./helpers/index.js";
 export * as Hooks from "./hooks/index.js";
+export * from "./providers/index.js";

package/dist/index.js

@@ -1,3 +1,3 @@
-export * from "./provider.js";
 export * as Helpers from "./helpers/index.js";
 export * as Hooks from "./hooks/index.js";
+export * from "./providers/index.js";

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

@@ -0,0 +1,7 @@
+import { EventFactory } from "applesauce-factory";
+import { PropsWithChildren } from "react";
+export declare const FactoryContext: import("react").Context<EventFactory | undefined>;
+/** Provides an EventFactory to the component tree */
+export declare function FactoryProvider({ factory, children }: PropsWithChildren<{
+    factory?: EventFactory;
+}>): import("react/jsx-runtime").JSX.Element;

package/dist/providers/factory-provider.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext } from "react";
+export const FactoryContext = createContext(undefined);
+/** Provides an EventFactory to the component tree */
+export function FactoryProvider({ factory, children }) {
+    return _jsx(FactoryContext.Provider, { value: factory, children: children });
+}

package/dist/providers/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./factory-provider.js";
+export * from "./store-provider.js";

package/dist/providers/index.js

@@ -0,0 +1,2 @@
+export * from "./factory-provider.js";
+export * from "./store-provider.js";

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

@@ -0,0 +1,12 @@
+import { EventStore, QueryStore } from "applesauce-core";
+import { PropsWithChildren } from "react";
+export declare const QueryStoreContext: import("react").Context<QueryStore | null>;
+export declare const EventStoreContext: import("react").Context<EventStore | null>;
+/** Provides a EventStore to the component tree */
+export declare function EventStoreProvider({ eventStore, children }: PropsWithChildren<{
+    eventStore: EventStore;
+}>): 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

@@ -0,0 +1,12 @@
+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": "0.8.0",
+  "version": "0.10.0",
   "description": "React hooks for applesauce",
   "type": "module",
   "main": "dist/index.js",
@@ -27,37 +27,40 @@
       "import": "./dist/hooks/*.js",
       "types": "./dist/hooks/*.d.ts"
     },
+    "./providers": {
+      "import": "./dist/providers/index.js",
+      "types": "./dist/providers/index.d.ts"
+    },
+    "./providers/*": {
+      "import": "./dist/providers/*.js",
+      "types": "./dist/providers/*.d.ts"
+    },
     "./helpers": {
       "import": "./dist/helpers/index.js",
       "types": "./dist/helpers/index.d.ts"
     }
   },
   "dependencies": {
-    "applesauce-content": "^0.8.0",
-    "applesauce-core": "^0.8.0",
-    "nostr-tools": "^2.7.2",
+    "applesauce-content": "^0.10.0",
+    "applesauce-core": "^0.10.0",
+    "applesauce-factory": "^0.10.0",
+    "nostr-tools": "^2.10.3",
     "react": "^18.3.1",
     "rxjs": "^7.8.1"
   },
   "devDependencies": {
-    "@jest/globals": "^29.7.0",
-    "@types/jest": "^29.5.13",
     "@types/react": "^18.3.11",
-    "jest": "^29.7.0",
-    "jest-extended": "^4.0.2"
+    "typescript": "^5.6.3",
+    "vitest": "^2.1.8"
   },
-  "jest": {
-    "roots": [
-      "dist"
-    ],
-    "setupFilesAfterEnv": [
-      "jest-extended/all"
-    ]
+  "funding": {
+    "type": "lightning",
+    "url": "lightning:nostrudel@geyser.fund"
   },
   "scripts": {
     "build": "tsc",
     "watch:build": "tsc --watch > /dev/null",
-    "test": "node --experimental-vm-modules node_modules/jest/bin/jest.js --passWithNoTests",
-    "watch:test": "(trap 'kill 0' SIGINT; pnpm run build -w > /dev/null & pnpm run test --watch)"
+    "test": "vitest run --passWithNoTests",
+    "watch:test": "vitest"
   }
 }

package/dist/provider.d.ts

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

package/dist/provider.js

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