@rebasepro/core 0.4.0 → 0.6.0

package/src/hooks/data/useCollectionFetch.tsx

@@ -2,6 +2,7 @@ import type { EntityCollection } from "@rebasepro/types";
 import { useEffect, useState, useMemo } from "react";
 import { Entity, FilterValues, User } from "@rebasepro/types";
 import { useData } from "./useData";
+import { isSchemaDriftError, useSchemaDriftContext } from "../../components/SchemaDriftBanner";
 /**
  * @group Hooks and utilities
  */
@@ -83,6 +84,7 @@ export function useCollectionFetch<M extends Record<string, any>, USER extends U
         searchString
     }: CollectionFetchProps<M>): CollectionFetchResult<M> {
     const dataClient = useData();
+    const { reportSchemaDrift } = useSchemaDriftContext();
 
     const sortByProperty = sortBy ? sortBy[0] : undefined;
     const currentSort = sortBy ? sortBy[1] : undefined;
@@ -137,6 +139,10 @@ export function useCollectionFetch<M extends Record<string, any>, USER extends U
             setData([]);
             setDataLoadingError(error);
             setTotalCount(undefined);
+            // Report schema drift to the global banner context
+            if (isSchemaDriftError(error)) {
+                reportSchemaDrift(error.message);
+            }
         };
 
         const accessor = dataClient.collection(path);
@@ -156,7 +162,8 @@ export function useCollectionFetch<M extends Record<string, any>, USER extends U
                 orderBy: orderByParams,
                 searchString,
                 include: includeParams
-            }, (res) => onEntitiesUpdate({ data: res.data as Entity<M>[], meta: res.meta }), onError);
+            }, (res) => onEntitiesUpdate({ data: res.data as Entity<M>[],
+meta: res.meta }), onError);
         } else {
             accessor.find({
                 where: whereParams,
@@ -167,7 +174,8 @@ export function useCollectionFetch<M extends Record<string, any>, USER extends U
                 searchString,
                 include: includeParams
             })
-                .then((res) => onEntitiesUpdate({ data: res.data as Entity<M>[], meta: res.meta }))
+                .then((res) => onEntitiesUpdate({ data: res.data as Entity<M>[],
+meta: res.meta }))
                 .catch(onError);
             return () => {
             };

package/src/hooks/data/useRelationSelector.tsx

@@ -181,7 +181,8 @@ export function useRelationSelector<M extends Record<string, any> = any>(
                 limit: limit,
                 orderBy: undefined,
                 searchString: currentSearch
-            }, (res) => onEntitiesUpdate({ data: res.data as Entity<M>[], meta: res.meta }), onErrorUpdate);
+            }, (res) => onEntitiesUpdate({ data: res.data as Entity<M>[],
+meta: res.meta }), onErrorUpdate);
         } else {
             accessor.find({
                 where: whereParams,
@@ -190,7 +191,8 @@ export function useRelationSelector<M extends Record<string, any> = any>(
                 orderBy: undefined,
                 searchString: currentSearch
             })
-                .then((res) => onEntitiesUpdate({ data: res.data as Entity<M>[], meta: res.meta }))
+                .then((res) => onEntitiesUpdate({ data: res.data as Entity<M>[],
+meta: res.meta }))
                 .catch(onErrorUpdate);
             unsubscribe = () => {};
         }

package/src/hooks/index.tsx

@@ -2,7 +2,6 @@ export * from "./data/useData";
 export * from "./data/useCollectionFetch";
 export * from "./data/useEntityFetch";
 export * from "./data/useRelationSelector";
-export * from "./data/useUserSelector";
 export * from "./data/save";
 export * from "./data/delete";
 
@@ -24,8 +23,6 @@ export * from "./useClipboard";
 export * from "./useLargeLayout";
 export * from "./useCollapsedGroups";
 
-export * from "./useInternalUserManagementController";
-
 export * from "./useBrowserTitleAndIcon";
 export * from "./useSlot";
 export * from "./useCustomizationController";
@@ -45,3 +42,4 @@ export * from "./useRebaseClient";
 export * from "./useAnalyticsController";
 export * from "./useUserConfigurationPersistence";
 export * from "./useResolvedComponent";
+export * from "./useComponentOverride";

package/src/hooks/useCollapsedGroups.ts

@@ -79,7 +79,8 @@ export function useCollapsedGroups(
             const currentlyCollapsed = name in prev
                 ? prev[name]
                 : (defaults?.[name] ?? false);
-            return { ...prev, [name]: !currentlyCollapsed };
+            return { ...prev,
+[name]: !currentlyCollapsed };
         });
     }, [defaults]);
 

package/src/hooks/useComponentOverride.tsx

@@ -0,0 +1,59 @@
+import React, { useContext, useMemo } from "react";
+import type { OverridableComponentName } from "@rebasepro/types";
+import { ComponentOverrideContext } from "../contexts/ComponentOverrideContext";
+
+/**
+ * Resolves a potentially overridden component.
+ *
+ * Resolution order:
+ * 1. Collection-scoped override (highest priority)
+ * 2. Global override
+ * 3. Default component (fallback)
+ *
+ * Supports two override modes:
+ * - **Eject** (default): The override component fully replaces the default.
+ * - **Wrap** (`wrap: true`): The override component wraps the default.
+ *   The default is passed as `OriginalComponent` in props.
+ *
+ * @param name - The overridable component name (e.g. `"Entity.Form"`)
+ * @param DefaultComponent - The built-in default component
+ * @returns The resolved component — either the default, a full replacement, or a wrapper
+ *
+ * @example
+ * ```tsx
+ * import { useComponentOverride } from "@rebasepro/core";
+ *
+ * function EntityFormWrapper(props: EntityFormProps) {
+ *     const ResolvedForm = useComponentOverride("Entity.Form", DefaultEntityForm);
+ *     return <ResolvedForm {...props} />;
+ * }
+ * ```
+ *
+ * @group Hooks
+ */
+export function useComponentOverride<P>(
+    name: OverridableComponentName,
+    DefaultComponent: React.ComponentType<P>
+): React.ComponentType<P> {
+    const { globalOverrides, collectionOverrides } = useContext(ComponentOverrideContext);
+
+    return useMemo(() => {
+        // Collection-level overrides have highest priority
+        const override = collectionOverrides[name] ?? globalOverrides[name];
+
+        if (!override) return DefaultComponent;
+
+        if (override.wrap) {
+            // Wrapping mode: inject OriginalComponent as a prop
+            const UserComponent = override.Component;
+            const Wrapper = (props: P) => (
+                <UserComponent {...(props as Record<string, unknown>)} OriginalComponent={DefaultComponent} />
+            );
+            Wrapper.displayName = `Wrapped(${name})`;
+            return Wrapper as React.ComponentType<P>;
+        }
+
+        // Eject mode: full replacement
+        return override.Component as React.ComponentType<P>;
+    }, [collectionOverrides, globalOverrides, name, DefaultComponent]);
+}

package/src/hooks/useRebaseContext.tsx

@@ -10,7 +10,7 @@ import { useCustomizationController } from "./useCustomizationController";
 import { useAnalyticsController } from "./useAnalyticsController";
 import { useEffectiveRoleController } from "./useEffectiveRoleController";
 import React, { useEffect, useContext } from "react";
-import { useInternalUserManagementController } from "./useInternalUserManagementController";
+
 
 // DatabaseAdmin is provided by <Rebase> via DatabaseAdminContext.
 import { DatabaseAdminContext } from "../contexts/DatabaseAdminContext";
@@ -37,7 +37,7 @@ export const useRebaseContext = <USER extends User = User, AuthControllerType ex
     const customizationController = useCustomizationController();
     const analyticsController = useAnalyticsController();
     const effectiveRoleController = useEffectiveRoleController();
-    const userManagement = useInternalUserManagementController<USER>();
+
 
     // Will get `databaseAdmin` from context
     const databaseAdmin = useContext(DatabaseAdminContext);
@@ -51,7 +51,6 @@ export const useRebaseContext = <USER extends User = User, AuthControllerType ex
         dialogsController,
         customizationController,
         analyticsController,
-        userManagement,
         effectiveRoleController,
         databaseAdmin,
         client: client! // Client should be provided
@@ -67,13 +66,12 @@ export const useRebaseContext = <USER extends User = User, AuthControllerType ex
             dialogsController,
             customizationController,
             analyticsController,
-            userManagement,
             effectiveRoleController,
             databaseAdmin,
             client: client!
         };
     }, [authController, data, storageSource, snackbarController, userConfigPersistence,
-        dialogsController, customizationController, analyticsController, userManagement,
+        dialogsController, customizationController, analyticsController,
         effectiveRoleController, databaseAdmin, client]);
 
     return rebaseContextRef.current;

package/src/hooks/useResolvedComponent.tsx

@@ -13,7 +13,7 @@ import { isLazyComponentRef } from "@rebasepro/types";
  * to the `React.lazy()` wrapper it produced. Strings are keyed by a separate
  * plain Map since they can't be WeakMap keys.
  */
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
+
 const lazyCache = new WeakMap<object | ((...args: any[]) => any), React.ComponentType<any>>();
 
 /**

package/src/hooks/useStudioBridge.tsx

@@ -3,23 +3,15 @@ import type {
     CollectionRegistryController,
     SideEntityController,
     UrlController,
-    NavigationStateController
+    NavigationStateController,
+    BreadcrumbEntry,
+    BreadcrumbsController
 } from "@rebasepro/types";
 
-// ─── Breadcrumbs (defined here so studio doesn't need CMS) ──────────
+export type { BreadcrumbEntry, BreadcrumbsController };
 
-export interface BreadcrumbEntry {
-    title: string;
-    url: string;
-    count?: number | null;
-    id?: string;
-}
+// ─── Breadcrumbs ──────────────────────────────────────────────────
 
-export interface BreadcrumbsController {
-    breadcrumbs: BreadcrumbEntry[];
-    set: (props: { breadcrumbs: BreadcrumbEntry[] }) => void;
-    updateCount: (id: string, count: number | null | undefined) => void;
-}
 
 // ─── Bridge interface ───────────────────────────────────────────────
 

package/src/locales/en.ts

@@ -170,6 +170,9 @@ export const en: RebaseTranslations = {
 
     // ─── Error states ─────────────────────────────────────────────
     error: "Error",
+    error_loading_data: "Could not load data",
+    error_check_server_logs: "Check server logs for details.",
+    error_technical_details: "Technical details",
     error_uploading_file: "Error uploading file",
     error_deleting: "Error deleting",
     error_before_delete: "Error before delete",

package/src/util/entity_cache.ts

@@ -155,7 +155,6 @@ export function getEntityFromMemoryCache(path: string): object | undefined {
 }
 
 
-
 /**
  * Retrieves an entity from the in-memory cache or `sessionStorage`.
  * If the entity is not in the cache but exists in `sessionStorage`, it loads it into the cache.
@@ -211,7 +210,6 @@ export function removeEntityFromCache(path: string): void {
 }
 
 
-
 export function flattenKeys(obj: Record<string, unknown> | unknown[], prefix = "", result: string[] = []): string[] {
 
     if (isObject(obj) || Array.isArray(obj)) {

package/src/util/previews.ts

@@ -59,7 +59,7 @@ export function getEntityTitlePropertyKey<M extends Record<string, any>>(collect
     if (collection.titleProperty) {
         return collection.titleProperty as string;
     }
-    
+
     const orderToSearch = (collection.propertiesOrder as string[]) || Object.keys(collection.properties);
     let firstStringCandidate: string | undefined;
 

package/src/vitePlugin.ts

@@ -126,7 +126,8 @@ export function rebaseCollectionsPlugin(options: RebaseCollectionsPluginOptions)
                 }
             );
 
-            return { code: transformed, map: null };
+            return { code: transformed,
+map: null };
         }
     };
 }

package/dist/components/BootstrapAdminBanner.d.ts

@@ -1,4 +0,0 @@
-export interface BootstrapAdminBannerProps {
-    className?: string;
-}
-export declare function BootstrapAdminBanner({ className }: BootstrapAdminBannerProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/contexts/InternalUserManagementContext.d.ts

@@ -1,3 +0,0 @@
-import React from "react";
-import { UserManagementDelegate } from "@rebasepro/types";
-export declare const InternalUserManagementContext: React.Context<UserManagementDelegate<any> | undefined>;

package/dist/hooks/data/useUserSelector.d.ts

@@ -1,31 +0,0 @@
-import { User } from "@rebasepro/types";
-export interface UserSelectorItem {
-    uid: string;
-    label: string;
-    description?: string;
-    user: User;
-}
-export interface UseUserSelectorProps {
-    /**
-     * Page size for pagination. Defaults to 10.
-     */
-    pageSize?: number;
-}
-export interface UserSelectorController {
-    items: UserSelectorItem[];
-    isLoading: boolean;
-    error: Error | undefined;
-    search: (searchString: string) => void;
-    loadMore: () => void;
-    hasMore: boolean;
-    getUser: (uid: string) => User | null;
-}
-/**
- * Hook to manage user selection with server-side search and pagination.
- * Similar to useRelationSelector but for the UserManagementDelegate.
- *
- * If the delegate provides `searchUsers`, this hook uses server-side
- * search/pagination. Otherwise it falls back to client-side filtering
- * over the in-memory `users` array.
- */
-export declare function useUserSelector({ pageSize }?: UseUserSelectorProps): UserSelectorController;

package/dist/hooks/useInternalUserManagementController.d.ts

@@ -1,12 +0,0 @@
-import { User, UserManagementDelegate } from "@rebasepro/types";
-/**
- * Use this hook to get the internal user management of the app.
- * Note that this is different from the user management plugin controller.
- * This controller will be eventually replaced by the one provided
- * by the user management plugin.
- *
- * Use at your own risk!
- *
- * @group Hooks and utilities
- */
-export declare function useInternalUserManagementController<USER extends User>(): UserManagementDelegate<USER> | undefined;

package/src/components/BootstrapAdminBanner.tsx

@@ -1,75 +0,0 @@
-import React, { useState } from "react";
-import { useInternalUserManagementController } from "../hooks/useInternalUserManagementController";
-import { useAuthController } from "../hooks/useAuthController";
-import { useTranslation } from "../hooks/useTranslation";
-import { useSnackbarController } from "../hooks/useSnackbarController";
-import { Button, CircularProgress, Typography } from "@rebasepro/ui";
-
-export interface BootstrapAdminBannerProps {
-    className?: string;
-}
-
-export function BootstrapAdminBanner({
-    className
-}: BootstrapAdminBannerProps) {
-    const userManagement = useInternalUserManagementController();
-    const { user: loggedInUser } = useAuthController();
-    const { t } = useTranslation();
-    const snackbarController = useSnackbarController();
-    const [bootstrapping, setBootstrapping] = useState(false);
-
-    // If we're not running locally, don't render anything
-    if (typeof window !== "undefined" && window.location.hostname !== "localhost" && window.location.hostname !== "127.0.0.1") {
-        return null;
-    }
-
-    if (!userManagement || !loggedInUser) {
-        return null;
-    }
-
-    // Non-admin users don't load the users list (admin API is skipped to
-    // avoid 403s), so `users` would be empty and falsely trigger this banner.
-    // Only admin users (or users with no roles yet, during initial bootstrap)
-    // should ever see this prompt.
-    const loggedInUserRoles = loggedInUser.roles ?? [];
-    const isLoggedInUserAdmin = loggedInUserRoles.length === 0 || loggedInUserRoles.some(r => r === "admin");
-    if (!isLoggedInUserAdmin) {
-        return null;
-    }
-
-    const { hasAdminUsers, loading: delegateLoading, bootstrapAdmin, usersError } = userManagement;
-
-    if (delegateLoading || hasAdminUsers || usersError || !bootstrapAdmin) {
-        return null;
-    }
-
-    const handleBootstrap = async () => {
-        if (!bootstrapAdmin) return;
-        setBootstrapping(true);
-        try {
-            await bootstrapAdmin();
-            snackbarController.open({ type: "success", message: t("bootstrap_admin_success") || "Admin successfully created" });
-            window.location.reload();
-        } catch (error: unknown) {
-            snackbarController.open({ type: "error", message: error instanceof Error ? error.message : t("failed_to_bootstrap_admin") || "Failed to bootstrap admin" });
-        } finally {
-            setBootstrapping(false);
-        }
-    };
-
-    return (
-        <div className={`bg-yellow-100 dark:bg-yellow-900 border border-yellow-400 dark:border-yellow-700 rounded p-4 flex items-center justify-between ${className || ""}`}>
-            <div>
-                <Typography variant="label" className="text-yellow-800 dark:text-yellow-200">
-                    {t("no_users_or_roles_defined") || "No admins found. Click to add your user as admin."}
-                </Typography>
-            </div>
-            <Button
-                onClick={handleBootstrap}
-                disabled={bootstrapping}
-            >
-                {bootstrapping ? <CircularProgress size="small"/> : (t("add_logged_user_as_admin") || "Add logged user as admin")}
-            </Button>
-        </div>
-    );
-}

package/src/contexts/InternalUserManagementContext.tsx

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

package/src/hooks/data/useUserSelector.tsx

@@ -1,157 +0,0 @@
-
-import { useCallback, useEffect, useRef, useState, useMemo } from "react";
-import { User, UserManagementDelegate } from "@rebasepro/types";
-import { useInternalUserManagementController } from "../useInternalUserManagementController";
-
-export interface UserSelectorItem {
-    uid: string;
-    label: string;
-    description?: string;
-    user: User;
-}
-
-export interface UseUserSelectorProps {
-    /**
-     * Page size for pagination. Defaults to 10.
-     */
-    pageSize?: number;
-}
-
-export interface UserSelectorController {
-    items: UserSelectorItem[];
-    isLoading: boolean;
-    error: Error | undefined;
-    search: (searchString: string) => void;
-    loadMore: () => void;
-    hasMore: boolean;
-    getUser: (uid: string) => User | null;
-}
-
-const DEFAULT_PAGE_SIZE = 10;
-
-/**
- * Hook to manage user selection with server-side search and pagination.
- * Similar to useRelationSelector but for the UserManagementDelegate.
- *
- * If the delegate provides `searchUsers`, this hook uses server-side
- * search/pagination. Otherwise it falls back to client-side filtering
- * over the in-memory `users` array.
- */
-export function useUserSelector(
-    { pageSize = DEFAULT_PAGE_SIZE }: UseUserSelectorProps = {}
-): UserSelectorController {
-
-    const userManagement = useInternalUserManagementController<User>();
-
-    const [items, setItems] = useState<UserSelectorItem[]>([]);
-    const [isLoading, setIsLoading] = useState(false);
-    const isLoadingRef = useRef(false);
-    const [error, setError] = useState<Error | undefined>();
-    const [hasMore, setHasMore] = useState(true);
-    const [currentSearch, setCurrentSearch] = useState<string>("");
-    const [limit, setLimit] = useState<number>(pageSize);
-
-    const searchTimeoutRef = useRef<NodeJS.Timeout | null>(null);
-
-    const setLoadingState = useCallback((loading: boolean) => {
-        isLoadingRef.current = loading;
-        setIsLoading(loading);
-    }, []);
-
-    const userToItem = useCallback((user: User): UserSelectorItem => {
-        return {
-            uid: user.uid,
-            label: user.displayName || user.email || user.uid,
-            description: user.displayName && user.email ? user.email : undefined,
-            user
-        };
-    }, []);
-
-    const fetchData = useCallback(() => {
-        if (!userManagement) return;
-
-        setError(undefined);
-        setLoadingState(true);
-
-        if (userManagement.searchUsers) {
-            // Server-side search + pagination
-            userManagement.searchUsers({
-                search: currentSearch || undefined,
-                limit,
-                offset: 0
-            }).then(({ users, total }) => {
-                setItems(users.map(userToItem));
-                setHasMore(users.length < total);
-                setLoadingState(false);
-            }).catch((err: unknown) => {
-                console.error("useUserSelector: Error fetching users:", err);
-                setError(err instanceof Error ? err : new Error(String(err)));
-                setLoadingState(false);
-            });
-        } else {
-            // Client-side fallback: filter in-memory users list
-            const allUsers = userManagement.users ?? [];
-            const searchLower = currentSearch.toLowerCase();
-            const filtered = currentSearch
-                ? allUsers.filter((u: User) => {
-                    const name = (u.displayName || "").toLowerCase();
-                    const email = (u.email || "").toLowerCase();
-                    return name.includes(searchLower) || email.includes(searchLower);
-                })
-                : allUsers;
-
-            const page = filtered.slice(0, limit);
-            setItems(page.map(userToItem));
-            setHasMore(page.length < filtered.length);
-            setLoadingState(false);
-        }
-    }, [userManagement, currentSearch, limit, userToItem, setLoadingState]);
-
-    // Search function with debouncing
-    const search = useCallback((searchString: string) => {
-        if (searchTimeoutRef.current) {
-            clearTimeout(searchTimeoutRef.current);
-        }
-
-        searchTimeoutRef.current = setTimeout(() => {
-            setLimit(pageSize);
-            setCurrentSearch(searchString);
-        }, searchString.trim() ? 300 : 0);
-    }, [pageSize]);
-
-    // Load more function
-    const loadMore = useCallback(() => {
-        if (!isLoadingRef.current && hasMore && items.length > 0) {
-            setLoadingState(true);
-            setLimit(prev => prev + pageSize);
-        }
-    }, [hasMore, items.length, pageSize, setLoadingState]);
-
-    // Fetch when search/limit changes
-    useEffect(() => {
-        fetchData();
-    }, [fetchData]);
-
-    // Cleanup debounce timer
-    useEffect(() => {
-        return () => {
-            if (searchTimeoutRef.current) {
-                clearTimeout(searchTimeoutRef.current);
-            }
-        };
-    }, []);
-
-    const getUser = useCallback((uid: string): User | null => {
-        return userManagement?.getUser?.(uid) ?? null;
-    }, [userManagement]);
-
-    return useMemo(() => ({
-        items,
-        isLoading,
-        error,
-        search,
-        loadMore,
-        hasMore,
-        getUser
-    }), [items, isLoading, error, search, loadMore, hasMore, getUser]);
-}

package/src/hooks/useInternalUserManagementController.tsx

@@ -1,17 +0,0 @@
-import { useContext } from "react";
-import { InternalUserManagementContext } from "../contexts/InternalUserManagementContext";
-import { User, UserManagementDelegate } from "@rebasepro/types";
-
-/**
- * Use this hook to get the internal user management of the app.
- * Note that this is different from the user management plugin controller.
- * This controller will be eventually replaced by the one provided
- * by the user management plugin.
- *
- * Use at your own risk!
- *
- * @group Hooks and utilities
- */
-export function useInternalUserManagementController<USER extends User>(): UserManagementDelegate<USER> | undefined {
-    return useContext(InternalUserManagementContext);
-}