@rebasepro/app 0.0.1-canary.4829d6e

package/src/contexts/CollectionScopeContext.tsx

@@ -0,0 +1,67 @@
+import React, { createContext, useContext } from "react";
+import type { CollectionConfig } from "@rebasepro/types";
+import { CollectionComponentOverrideProvider } from "./ComponentOverrideContext";
+
+/**
+ * Carries the collection a UI subtree is currently bound to.
+ *
+ * Mounted by every collection binding (main collection views, entity
+ * edit/detail views, side panels, reference-selection dialogs, import
+ * previews) via {@link CollectionScopeProvider}. Leaf components read it with
+ * {@link useCollectionScope} to derive collection-dependent behavior — e.g.
+ * filter fields resolve the engine's supported operators from
+ * `collection.engine` — without every intermediate component threading
+ * collection props.
+ *
+ * @internal
+ */
+export const CollectionScopeContext = createContext<CollectionConfig | undefined>(undefined);
+
+/**
+ * Read the collection the current subtree is bound to, or `undefined` when
+ * rendered outside any collection scope (e.g. a fully standalone table).
+ *
+ * @group Hooks
+ */
+export function useCollectionScope(): CollectionConfig | undefined {
+    return useContext(CollectionScopeContext);
+}
+
+/**
+ * Scopes a UI subtree to a collection.
+ *
+ * Provides two things at once:
+ * 1. The collection itself — readable via {@link useCollectionScope} —
+ *    so leaf components (filter fields, previews, …) can derive
+ *    collection-dependent behavior such as engine capabilities.
+ * 2. The collection's component overrides (`collection.components`),
+ *    by mounting {@link CollectionComponentOverrideProvider}.
+ *
+ * Mount this wherever a subtree is bound to a specific collection. If you
+ * build a custom view around `SelectableTable` / `CollectionTableBinding`,
+ * wrap it in this provider to get engine-aware filters and collection-scoped
+ * component overrides for free:
+ *
+ * ```tsx
+ * <CollectionScopeProvider collection={myCollection}>
+ *     <CollectionTableBinding ... />
+ * </CollectionScopeProvider>
+ * ```
+ *
+ * @group Components
+ */
+export function CollectionScopeProvider({
+    collection,
+    children
+}: {
+    collection: CollectionConfig<any> | undefined;
+    children: React.ReactNode;
+}) {
+    return (
+        <CollectionScopeContext.Provider value={collection as CollectionConfig | undefined}>
+            <CollectionComponentOverrideProvider overrides={collection?.components}>
+                {children}
+            </CollectionComponentOverrideProvider>
+        </CollectionScopeContext.Provider>
+    );
+}

package/src/contexts/ComponentOverrideContext.tsx

@@ -0,0 +1,81 @@
+import React, { createContext, useContext, useMemo } from "react";
+import type { ComponentOverrideMap } from "@rebasepro/types";
+
+/** Stable empty reference to avoid re-creating context values on every render. */
+const EMPTY_OVERRIDES: ComponentOverrideMap = {};
+
+/**
+ * Internal state for the component override resolution chain.
+ * Holds both global overrides (set on `<Rebase>`) and collection-scoped
+ * overrides (set on individual collections).
+ *
+ * Resolution priority: collection > global > default.
+ *
+ * @internal
+ */
+interface ComponentOverrideState {
+    globalOverrides: ComponentOverrideMap;
+    collectionOverrides: ComponentOverrideMap;
+}
+
+export const ComponentOverrideContext = createContext<ComponentOverrideState>({
+    globalOverrides: EMPTY_OVERRIDES,
+    collectionOverrides: EMPTY_OVERRIDES
+});
+
+/**
+ * Provider set at the `<Rebase>` root level to supply global component overrides.
+ *
+ * @internal — Used by the Rebase component. End users set overrides via
+ * the `components` prop on `<Rebase>`.
+ */
+export function GlobalComponentOverrideProvider({
+    overrides,
+    children
+}: {
+    overrides?: ComponentOverrideMap;
+    children: React.ReactNode;
+}) {
+    const value = useMemo<ComponentOverrideState>(() => ({
+        globalOverrides: overrides ?? EMPTY_OVERRIDES,
+        collectionOverrides: EMPTY_OVERRIDES
+    }), [overrides]);
+
+    return (
+        <ComponentOverrideContext.Provider value={value}>
+            {children}
+        </ComponentOverrideContext.Provider>
+    );
+}
+
+/**
+ * Provider set at the collection level to layer collection-scoped overrides
+ * on top of global overrides.
+ *
+ * When a collection defines `components`, this provider is mounted
+ * around the collection's view subtree. Components within the subtree
+ * will resolve overrides in order: collection → global → default.
+ *
+ * @internal — Used by DataCollectionView when a collection has
+ * `components` defined.
+ */
+export function CollectionComponentOverrideProvider({
+    overrides,
+    children
+}: {
+    overrides?: ComponentOverrideMap;
+    children: React.ReactNode;
+}) {
+    const parent = useContext(ComponentOverrideContext);
+
+    const value = useMemo<ComponentOverrideState>(() => ({
+        globalOverrides: parent.globalOverrides,
+        collectionOverrides: overrides ?? EMPTY_OVERRIDES
+    }), [parent.globalOverrides, overrides]);
+
+    return (
+        <ComponentOverrideContext.Provider value={value}>
+            {children}
+        </ComponentOverrideContext.Provider>
+    );
+}

package/src/contexts/CustomizationControllerContext.tsx

@@ -0,0 +1,4 @@
+import type { CustomizationController } from "@rebasepro/types";
+import React from "react";
+
+export const CustomizationControllerContext = React.createContext<CustomizationController>({} as CustomizationController);

package/src/contexts/DataDriverContext.tsx

@@ -0,0 +1,4 @@
+import React from "react";
+import { DataDriver } from "@rebasepro/types";
+
+export const DataDriverContext = React.createContext<DataDriver>({} as DataDriver);

package/src/contexts/DataSourcesContext.tsx

@@ -0,0 +1,36 @@
+import React from "react";
+import { DataSourceDefinition, RebaseData } from "@rebasepro/types";
+
+/**
+ * The data-source configuration provided to `<Rebase>`: the declared
+ * definitions plus the built {@link RebaseData} instances for direct/custom
+ * transports.
+ *
+ * The actual path-based routing is assembled by the navigation layer (which
+ * has the collection registry) via `resolveDataSource` + `buildRoutedRebaseData`
+ * and re-provided through `RebaseDataContext`.
+ *
+ * @internal
+ */
+export interface DataSourcesContextValue {
+    /** All declared data sources, keyed by data-source key. */
+    registry: Record<string, DataSourceDefinition>;
+    /**
+     * Built {@link RebaseData} for direct/custom data sources, keyed by
+     * data-source key. Server-mediated sources are absent (they ride the
+     * default client).
+     */
+    sources: Record<string, RebaseData>;
+}
+
+const EMPTY: DataSourcesContextValue = { registry: {}, sources: {} };
+
+/** @internal */
+export const DataSourcesContext = React.createContext<DataSourcesContextValue>(EMPTY);
+
+/**
+ * Access the data-source configuration provided to `<Rebase>` via the
+ * `dataSources` prop.
+ * @internal
+ */
+export const useDataSources = (): DataSourcesContextValue => React.useContext(DataSourcesContext);

package/src/contexts/DatabaseAdminContext.tsx

@@ -0,0 +1,4 @@
+import React from "react";
+import { DatabaseAdmin } from "@rebasepro/types";
+
+export const DatabaseAdminContext = React.createContext<DatabaseAdmin | undefined>(undefined);

package/src/contexts/DialogsProvider.tsx

@@ -0,0 +1,56 @@
+import type { DialogControllerEntryProps, DialogsController } from "@rebasepro/types";
+import React, { PropsWithChildren, useCallback, useRef, useState, useMemo } from "react";
+;
+
+export const DialogsControllerContext = React.createContext<DialogsController>({} as DialogsController);
+
+export const DialogsProvider: React.FC<PropsWithChildren> = ({ children }) => {
+
+    const [dialogEntries, setDialogEntries] = useState<DialogControllerEntryProps[]>([]);
+    const dialogEntriesRef = useRef<DialogControllerEntryProps[]>(dialogEntries);
+
+    const updateDialogEntries = (newPanels: DialogControllerEntryProps<any>[]) => {
+        dialogEntriesRef.current = newPanels;
+        setDialogEntries(newPanels);
+    };
+
+    const close = useCallback(() => {
+
+        if (dialogEntries.length === 0)
+            return;
+
+        const updatedPanels = [...dialogEntriesRef.current.slice(0, -1)];
+        updateDialogEntries(updatedPanels);
+
+    }, [dialogEntries]);
+
+    const open = useCallback(<T extends object = object>(dialogEntry: DialogControllerEntryProps<T>) => {
+
+        const updatedPanels = [...dialogEntriesRef.current, dialogEntry];
+        updateDialogEntries(updatedPanels);
+
+        return {
+            closeDialog: () => {
+                const updatedPanels = dialogEntriesRef.current.filter(e => e.key !== dialogEntry.key);
+                updateDialogEntries(updatedPanels);
+            }
+        }
+    }, [dialogEntries]);
+
+    const dialogsController = useMemo(() => ({
+        open,
+        close
+    }), [open, close]);
+
+    return (
+        <DialogsControllerContext.Provider value={dialogsController}>
+            {children}
+            {dialogEntries.map((entry, i) => <entry.Component
+                key={`dialog_${i}`}
+                open={true}
+                closeDialog={close}
+                {...entry.props}
+            />)}
+        </DialogsControllerContext.Provider>
+    );
+};

package/src/contexts/EffectiveRoleController.tsx

@@ -0,0 +1,12 @@
+import type { EffectiveRoleController } from "@rebasepro/types";
+import React from "react";
+;
+
+const DEFAULT_EFFECTIVE_ROLE_STATE: EffectiveRoleController = {
+    effectiveRole: null,
+    setEffectiveRole: (_role: string | null) => {
+    }
+};
+export const EffectiveRoleControllerContext = React.createContext<EffectiveRoleController>(DEFAULT_EFFECTIVE_ROLE_STATE);
+
+export const EffectiveRoleControllerProvider = EffectiveRoleControllerContext.Provider;

package/src/contexts/ModeController.tsx

@@ -0,0 +1,11 @@
+import React from "react";
+import { ModeController } from "../hooks";
+
+const DEFAULT_MODE_STATE: ModeController = {
+    mode: "light",
+    setMode: (mode: "light" | "dark" | "system") => {
+    }
+};
+export const ModeControllerContext = React.createContext<ModeController>(DEFAULT_MODE_STATE);
+
+export const ModeControllerProvider = ModeControllerContext.Provider;

package/src/contexts/RebaseClientInstanceContext.tsx

@@ -0,0 +1,7 @@
+import React from "react";
+
+/**
+ * Context that exposes the full RebaseClient instance.
+ * Used by the JS Editor to give developer scripts access to `client.data`, `client.auth`, etc.
+ */
+export const RebaseClientInstanceContext = React.createContext<any>(undefined);

package/src/contexts/RebaseDataContext.tsx

@@ -0,0 +1,4 @@
+import React from "react";
+import { RebaseData } from "@rebasepro/types";
+
+export const RebaseDataContext = React.createContext<RebaseData>({} as RebaseData);

package/src/contexts/SnackbarProvider.tsx

@@ -0,0 +1,15 @@
+"use client";
+
+import React, { PropsWithChildren } from "react";
+import { SnackbarProvider as NotistackSnackbarProvider } from "notistack";
+
+export const SnackbarProvider: React.FC<PropsWithChildren> = ({ children }) => {
+
+    return (
+        <NotistackSnackbarProvider maxSnack={3}
+                                   preventDuplicate={true}
+                                   autoHideDuration={3500}>
+            {children}
+        </NotistackSnackbarProvider>
+    );
+};

package/src/contexts/StorageSourceContext.tsx

@@ -0,0 +1,4 @@
+import React from "react";
+import { StorageSource } from "@rebasepro/types";
+
+export const StorageSourceContext = React.createContext<StorageSource>({} as StorageSource);

package/src/contexts/StorageSourcesContext.tsx

@@ -0,0 +1,30 @@
+import React from "react";
+import type { StorageSource, StorageSourceDefinition, StorageSourceRegistry } from "@rebasepro/types";
+
+/**
+ * The storage-source configuration provided to `<Rebase>`: the declared
+ * definitions and the built {@link StorageSource} instances, wrapped in a
+ * {@link StorageSourceRegistry} for fast key-based lookup.
+ *
+ * Mirrors the {@link DataSourcesContext} pattern used for databases.
+ *
+ * @internal
+ */
+export interface StorageSourcesContextValue {
+    /** All declared storage sources, keyed by storage-source key. */
+    registry: Record<string, StorageSourceDefinition>;
+    /** Built {@link StorageSource} for direct sources, keyed by key. */
+    sources: Record<string, StorageSource>;
+}
+
+const EMPTY: StorageSourcesContextValue = { registry: {}, sources: {} };
+
+/** @internal */
+export const StorageSourcesContext = React.createContext<StorageSourcesContextValue>(EMPTY);
+
+/**
+ * Access the storage-source configuration provided to `<Rebase>` via the
+ * `storageSources` prop.
+ * @internal
+ */
+export const useStorageSources = (): StorageSourcesContextValue => React.useContext(StorageSourcesContext);

package/src/contexts/UserConfigurationPersistenceContext.tsx

@@ -0,0 +1,4 @@
+import React from "react";
+import { UserConfigurationPersistence } from "@rebasepro/types";
+
+export const UserConfigurationPersistenceContext = React.createContext<UserConfigurationPersistence | undefined>(undefined);

package/src/contexts/index.ts

@@ -0,0 +1,17 @@
+export * from "./SnackbarProvider";
+export * from "./ModeController";
+export * from "./AdminModeController";
+export * from "./EffectiveRoleController";
+export * from "./AuthControllerContext";
+export * from "./DataDriverContext";
+export * from "./DataSourcesContext";
+export * from "./RebaseDataContext";
+export * from "./AnalyticsContext";
+export * from "./StorageSourceContext";
+export * from "./StorageSourcesContext";
+export * from "./UserConfigurationPersistenceContext";
+export * from "./DialogsProvider";
+export * from "./RebaseClientInstanceContext";
+export * from "./CustomizationControllerContext";
+export * from "./ComponentOverrideContext";
+export * from "./CollectionScopeContext";

package/src/core/PluginLifecycleManager.tsx

@@ -0,0 +1,95 @@
+
+import { useEffect, useRef } from "react";
+import type { RebasePlugin, RebaseContext, User } from "@rebasepro/types";
+
+/**
+ * Render-less component that manages plugin lifecycle hooks.
+ *
+ * - Calls `lifecycle.onMount(context)` when plugins mount.
+ * - Calls `lifecycle.onUnmount()` when plugins unmount.
+ * - Subscribes to auth state changes and calls `lifecycle.onAuthStateChange`.
+ *
+ * Mount this component inside the Rebase tree, below PluginProviderStack,
+ * so that the RebaseContext is fully available.
+ *
+ * @internal
+ */
+export function PluginLifecycleManager({
+    plugins,
+    context
+}: {
+    plugins: RebasePlugin[];
+    context: RebaseContext;
+}) {
+    const mountedRef = useRef(false);
+    const prevUserRef = useRef<User | null | undefined>(undefined);
+
+    // ── Mount / Unmount lifecycle ────────────────────────────────────
+    useEffect(() => {
+        // Prevent double-fire in StrictMode
+        if (mountedRef.current) return;
+        mountedRef.current = true;
+
+        for (const plugin of plugins) {
+            if (plugin.lifecycle?.onMount) {
+                try {
+                    const result = plugin.lifecycle.onMount(context);
+                    if (result instanceof Promise) {
+                        result.catch((err) =>
+                            console.error(`[Rebase] Plugin "${plugin.key}" onMount error:`, err)
+                        );
+                    }
+                } catch (err) {
+                    console.error(`[Rebase] Plugin "${plugin.key}" onMount error:`, err);
+                }
+            }
+        }
+
+        return () => {
+            mountedRef.current = false;
+            for (const plugin of plugins) {
+                if (plugin.lifecycle?.onUnmount) {
+                    try {
+                        plugin.lifecycle.onUnmount();
+                    } catch (err) {
+                        console.error(`[Rebase] Plugin "${plugin.key}" onUnmount error:`, err);
+                    }
+                }
+            }
+        };
+        // Only run on mount/unmount — plugins array identity should be stable
+    }, []);
+
+    // ── Auth state change lifecycle ──────────────────────────────────
+    const currentUser = context.authController?.user ?? null;
+
+    useEffect(() => {
+        // Skip the initial call — onMount handles that
+        if (prevUserRef.current === undefined) {
+            prevUserRef.current = currentUser;
+            return;
+        }
+
+        // Only fire when the user identity actually changes
+        const prevUid = prevUserRef.current?.uid;
+        const currUid = currentUser?.uid;
+        if (prevUid === currUid) return;
+
+        prevUserRef.current = currentUser;
+
+        for (const plugin of plugins) {
+            if (plugin.lifecycle?.onAuthStateChange) {
+                try {
+                    plugin.lifecycle.onAuthStateChange(currentUser);
+                } catch (err) {
+                    console.error(
+                        `[Rebase] Plugin "${plugin.key}" onAuthStateChange error:`,
+                        err
+                    );
+                }
+            }
+        }
+    }, [currentUser, plugins]);
+
+    return null;
+}

package/src/core/PluginProviderStack.tsx

@@ -0,0 +1,40 @@
+import type { RebasePlugin } from "@rebasepro/types";
+import React from "react";
+;
+
+/**
+ * Wraps children with all provider components from plugins that match the given scope.
+ *
+ * Replaces the 3 copy-pasted `plugins.forEach(plugin => { if (plugin.form?.provider) ... })` patterns
+ * in Rebase.tsx, EditViewBinding.tsx, and PopupFormField.tsx.
+ *
+ * @param plugins - Array of plugins to extract providers from.
+ * @param scope - `"root"` or `"form"` — which providers to apply.
+ * @param scopeProps - Additional props passed to each provider component.
+ * @param children - The content to wrap.
+ *
+ * @group Core
+ */
+export function PluginProviderStack({
+    plugins,
+    scope,
+    scopeProps,
+    children
+}: {
+    plugins: RebasePlugin[];
+    scope: "root" | "form";
+    scopeProps?: Record<string, unknown>;
+    children: React.ReactNode;
+}) {
+    const providers = plugins.flatMap(p => p.providers ?? [])
+        .filter(p => p.scope === scope);
+
+    return providers.reduceRight<React.ReactNode>(
+        (acc, provider) => (
+            <provider.Component {...provider.props} {...scopeProps}>
+                {acc}
+            </provider.Component>
+        ),
+        children
+    );
+}