@firecms/core 3.0.0-beta.4.pre.1 → 3.0.0-beta.5

package/dist/internal/useRestoreScroll.d.ts

@@ -2,5 +2,5 @@ import React from "react";
 export declare function useRestoreScroll(): {
     containerRef: React.RefObject<HTMLDivElement>;
     scroll: number;
-    direction: "down" | "up";
+    direction: "up" | "down";
 };

package/dist/preview/PropertyPreviewProps.d.ts

@@ -6,7 +6,7 @@ export type PreviewSize = "medium" | "small" | "tiny";
 /**
  * @group Preview components
  */
-export interface PropertyPreviewProps<T extends CMSType = any, CustomProps = any, M extends Record<string, any> = Record<string, any>> {
+export interface PropertyPreviewProps<T extends CMSType = any, CustomProps = any> {
     /**
      * Name of the property
      */
@@ -19,9 +19,6 @@ export interface PropertyPreviewProps<T extends CMSType = any, CustomProps = any
      * Property this display is related to
      */
     property: Property<T> | ResolvedProperty<T>;
-    /**
-     * Click handler
-     */
     /**
      * Desired size of the preview, depending on the context.
      */

package/dist/types/auth.d.ts

@@ -1,16 +1,23 @@
 import { User } from "./user";
+import { Role } from "./roles";
+import { DataSourceDelegate } from "./datasource";
+import { StorageSource } from "./storage";
 /**
  * Controller for retrieving the logged user or performing auth related operations.
  * Note that if you are implementing your AuthController, you probably will want
  * to do it as the result of a hook.
  * @group Hooks and utilities
  */
-export type AuthController<UserType extends User = User, ExtraData extends any = any> = {
+export type AuthController<UserType extends User = any, ExtraData extends any = any> = {
     /**
      * The user currently logged in
      * The values can be: the user object, null if they skipped login
      */
     user: UserType | null;
+    /**
+     * Roles related to the logged user
+     */
+    roles?: Role[];
     /**
      * Initial loading flag. It is used not to display the login screen
      * when the app first loads, and it has not been checked whether the user
@@ -45,3 +52,25 @@ export type AuthController<UserType extends User = User, ExtraData extends any =
     extra: ExtraData;
     setExtra: (extra: ExtraData) => void;
 };
+/**
+ * Implement this function to allow access to specific users.
+ * @group Hooks and utilities
+ */
+export type Authenticator<UserType extends User = User, Controller extends AuthController<UserType> = AuthController<UserType>> = (props: {
+    /**
+     * Logged-in user or null
+     */
+    user: UserType | null;
+    /**
+     * AuthController
+     */
+    authController: Controller;
+    /**
+     * Connector to your database, e.g. your Firestore database
+     */
+    dataSourceDelegate: DataSourceDelegate;
+    /**
+     * Used storage implementation
+     */
+    storageSource: StorageSource;
+}) => boolean | Promise<boolean>;

package/dist/types/collections.d.ts

@@ -16,7 +16,7 @@ import { EntityOverrides } from "./entity_overrides";
  *
  * @group Models
  */
-export interface EntityCollection<M extends Record<string, any> = any, UserType extends User = User> {
+export interface EntityCollection<M extends Record<string, any> = any, UserType extends User = any> {
     /**
      * You can set an alias that will be used internally instead of the `path`.
      * The `alias` value will be used to determine the URL of the collection,
@@ -128,7 +128,7 @@ export interface EntityCollection<M extends Record<string, any> = any, UserType
      * is being created, updated or deleted.
      * Useful for adding your own logic or blocking the execution of the operation.
      */
-    callbacks?: EntityCallbacks<M>;
+    callbacks?: EntityCallbacks<M, UserType>;
     /**
      * Builder for rendering additional components such as buttons in the
      * collection toolbar
@@ -382,7 +382,7 @@ export interface AdditionalFieldDelegate<M extends Record<string, any> = any, Us
      */
     value?: (props: {
         entity: Entity<M>;
-        context: FireCMSContext;
+        context: FireCMSContext<any>;
     }) => string | number | Promise<string | number> | undefined;
 }
 /**

package/dist/types/datasource.d.ts

@@ -7,7 +7,7 @@ import { ResolvedEntityCollection } from "./resolved_entities";
 export interface FetchEntityProps<M extends Record<string, any> = any> {
     path: string;
     entityId: string;
-    collection?: EntityCollection<M>;
+    collection?: EntityCollection<M, any>;
 }
 /**
  * @group Datasource

package/dist/types/entity_callbacks.d.ts

@@ -63,7 +63,7 @@ export interface EntityOnFetchProps<M extends Record<string, any> = any, UserTyp
     /**
      * Collection of the entity
      */
-    collection: EntityCollection<M>;
+    collection: EntityCollection<M, UserType>;
     /**
      * Full path of the CMS where this collection is being fetched.
      * Might contain unresolved aliases.
@@ -155,7 +155,7 @@ export interface EntityOnDeleteProps<M extends Record<string, any> = any, UserTy
     /**
      * Context of the app status
      */
-    context: FireCMSContext;
+    context: FireCMSContext<UserType>;
 }
 /**
  * Parameters passed to hooks when an entity is deleted

package/dist/types/index.d.ts

@@ -22,6 +22,7 @@ export * from "./local_config_persistence";
 export * from "./plugins";
 export * from "./analytics";
 export * from "./firecms";
+export * from "./roles";
 export * from "./appcheck";
 export * from "./export_import";
 export * from "./modify_collections";

package/dist/types/navigation.d.ts

@@ -6,7 +6,7 @@ import { EntityReference } from "./entities";
  * attributes.
  * @group Models
  */
-export type NavigationController = {
+export type NavigationController<EC extends EntityCollection = EntityCollection<any>> = {
     /**
      * List of the mapped collections in the CMS.
      * Each entry relates to a collection in the root database.
@@ -47,15 +47,15 @@ export type NavigationController = {
      * Get the collection configuration for a given path.
      * The collection is resolved from the given path or alias.
      */
-    getCollection: <EC extends EntityCollection = EntityCollection<any>>(pathOrAlias: string, entityId?: string, includeUserOverride?: boolean) => EC | undefined;
+    getCollection: (pathOrAlias: string, entityId?: string, includeUserOverride?: boolean) => EC | undefined;
     /**
      * Get the collection configuration from its parent path segments.
      */
-    getCollectionFromIds: <EC extends EntityCollection = EntityCollection<any>>(ids: string[]) => EC | undefined;
+    getCollectionFromIds: (ids: string[]) => EC | undefined;
     /**
      * Get the collection configuration from its parent path segments.
      */
-    getCollectionFromPaths: <EC extends EntityCollection = EntityCollection<any>>(pathSegments: string[]) => EC | undefined;
+    getCollectionFromPaths: (pathSegments: string[]) => EC | undefined;
     /**
      * Default path under the navigation routes of the CMS will be created
      */

package/dist/types/plugins.d.ts

@@ -13,9 +13,9 @@ import { ResolvedProperty } from "./resolved_entities";
  */
 export type FireCMSPlugin<PROPS = any, FORM_PROPS = any, EC extends EntityCollection = EntityCollection, COL_ACTIONS_PROPS = any> = {
     /**
-     * Name of the plugin
+     * Key of the plugin. This is used to identify the plugin in the CMS.
      */
-    name: string;
+    key: string;
     /**
      * If this flag is set to true, no content will be shown in the CMS
      * until the plugin is fully loaded.

package/dist/types/roles.d.ts

@@ -0,0 +1,31 @@
+import { Permissions } from "../index";
+export type Role = {
+    /**
+     * ID of the role
+     */
+    id: string;
+    /**
+     * Name of the role
+     */
+    name: string;
+    /**
+     * If this flag is true, the user can perform any action
+     */
+    isAdmin?: boolean;
+    /**
+     * Default permissions for all collections for this role.
+     * You can override this values at the collection level using
+     * {@link collectionPermissions}
+     */
+    defaultPermissions?: Permissions;
+    /**
+     * Record of stripped collection ids to their permissions.
+     * @see stripCollectionPath
+     */
+    collectionPermissions?: Record<string, Permissions>;
+    config?: {
+        createCollections?: boolean;
+        editCollections?: boolean | "own";
+        deleteCollections?: boolean | "own";
+    };
+};

package/dist/types/storage.d.ts

@@ -6,6 +6,7 @@ export interface UploadFileProps {
     fileName?: string;
     path?: string;
     metadata?: any;
+    bucket?: string;
 }
 /**
  * @group Models
@@ -15,6 +16,10 @@ export interface UploadFileResult {
      * Storage path including the file name where the file was uploaded.
      */
     path: string;
+    /**
+     * Bucket where the file was uploaded
+     */
+    bucket: string;
 }
 /**
  * @group Models
@@ -66,17 +71,20 @@ export interface StorageSource {
      * @param fileName
      * @param path
      * @param metadata
+     * @param bucket
      */
-    uploadFile: ({ file, fileName, path, metadata }: UploadFileProps) => Promise<UploadFileResult>;
+    uploadFile: ({ file, fileName, path, metadata, bucket }: UploadFileProps) => Promise<UploadFileResult>;
     /**
      * Convert a storage path or URL into a download configuration
      * @param path
+     * @param bucket
      */
-    getDownloadURL: (pathOrUrl: string) => Promise<DownloadConfig>;
+    getDownloadURL: (pathOrUrl: string, bucket?: string) => Promise<DownloadConfig>;
     /**
      * Get a file from a storage path.
      * It returns null if the file does not exist.
      * @param props
+     * @param bucket
      */
-    getFile: (path: string) => Promise<File | null>;
+    getFile: (path: string, bucket?: string) => Promise<File | null>;
 }

package/dist/types/user.d.ts

@@ -1,3 +1,4 @@
+import { Role } from "./roles";
 /**
  * This interface represents a user.
  * It has some of the same fields as a Firebase User.
@@ -33,4 +34,8 @@ export type User = {
      *
      */
     readonly isAnonymous: boolean;
+    /**
+     *
+     */
+    roles?: Role[];
 };

package/dist/util/collections.d.ts

@@ -8,4 +8,4 @@ export declare function resolveDefaultSelectedView(defaultSelectedView: string |
  * @param collections
  * @param permissionsBuilder
  */
-export declare const applyPermissionsFunctionIfEmpty: (collections: EntityCollection[], permissionsBuilder?: PermissionsBuilder) => EntityCollection[];
+export declare const applyPermissionsFunctionIfEmpty: (collections: EntityCollection[], permissionsBuilder?: PermissionsBuilder<any, any>) => EntityCollection[];

package/dist/util/useTraceUpdate.d.ts

@@ -1 +1,2 @@
+export declare function printChanged(props: any, prev: any, path?: string | undefined, depth?: number | undefined, maxDepth?: number | undefined): void;
 export declare function useTraceUpdate(props: any, maxDepth?: number): void;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@firecms/core",
   "type": "module",
-  "version": "3.0.0-beta.4.pre.1",
+  "version": "3.0.0-beta.5",
   "description": "Awesome Firebase/Firestore-based headless open-source CMS",
   "funding": {
     "url": "https://github.com/sponsors/firecmsco"
@@ -41,13 +41,13 @@
     ".": {
       "import": "./dist/index.es.js",
       "require": "./dist/index.umd.js",
-      "types": "./dist/src/index.d.ts"
+      "types": "./dist/index.d.ts"
     },
     "./package.json": "./package.json"
   },
   "dependencies": {
-    "@firecms/formex": "^3.0.0-beta.4.pre.1",
-    "@firecms/ui": "^3.0.0-beta.4.pre.1",
+    "@firecms/formex": "^3.0.0-beta.5",
+    "@firecms/ui": "^3.0.0-beta.5",
     "@fontsource/ibm-plex-mono": "^5.0.12",
     "@fontsource/roboto": "^5.0.12",
     "@hello-pangea/dnd": "^16.5.0",
@@ -69,8 +69,8 @@
     "firebase": "^10.5.2",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-router": "^6.2.0",
-    "react-router-dom": "^6.2.0"
+    "react-router": "^6.22.0",
+    "react-router-dom": "^6.22.0"
   },
   "eslintConfig": {
     "extends": [
@@ -103,19 +103,19 @@
     "firebase": "^10.9.0",
     "jest": "^29.7.0",
     "npm-run-all": "^4.1.5",
-    "react-router": "^6.22.3",
-    "react-router-dom": "^6.22.3",
+    "react-router": "^6.22.0",
+    "react-router-dom": "^6.22.0",
     "ts-jest": "^29.1.2",
     "ts-node": "^10.9.2",
     "tsd": "^0.30.7",
     "typescript": "^5.4.2",
-    "vite": "^5.1.6"
+    "vite": "^5.2.3"
   },
   "files": [
     "dist",
     "src"
   ],
-  "gitHead": "a197c6698a64aeb8f9608e6a177a7ecd149920de",
+  "gitHead": "8bf864185c9617aa3f120e59c873c8b8bda8dac4",
   "publishConfig": {
     "access": "public"
   }

package/src/components/EntityCollectionTable/fields/TableReferenceField.tsx

@@ -29,7 +29,7 @@ export function TableReferenceField(props: TableReferenceFieldProps) {
 
     const navigationController = useNavigationController();
     const { path } = props;
-    const collection = navigationController.getCollection<EntityCollection>(path);
+    const collection = navigationController.getCollection(path);
     if (!collection) {
         if (customizationController.components?.missingReference) {
             return <customizationController.components.missingReference path={path}/>;

package/src/components/EntityPreview.tsx

@@ -49,7 +49,7 @@ export function EntityPreview({
 
     const navigationController = useNavigationController();
 
-    const collection = collectionProp ?? navigationController.getCollection<EntityCollection>(entity.path);
+    const collection = collectionProp ?? navigationController.getCollection(entity.path);
 
     if (!collection) {
         throw Error(`Couldn't find the corresponding collection view for the path: ${entity.path}`);
@@ -168,9 +168,10 @@ export function EntityPreview({
     </EntityPreviewContainer>;
 }
 
-type EntityPreviewContainerProps = {
+export type EntityPreviewContainerProps = {
     children: React.ReactNode;
     hover?: boolean;
+    fullwidth?: boolean;
     size: PreviewSize;
     className?: string;
     style?: React.CSSProperties;
@@ -184,6 +185,7 @@ const EntityPreviewContainerInner = React.forwardRef<HTMLDivElement, EntityPrevi
                                                                                                        size,
                                                                                                        style,
                                                                                                        className,
+                                                                                                       fullwidth = true,
                                                                                                        ...props
                                                                                                    }, ref) => {
     return <div
@@ -195,6 +197,7 @@ const EntityPreviewContainerInner = React.forwardRef<HTMLDivElement, EntityPrevi
         }}
         className={cn(
             "bg-white dark:bg-gray-900",
+            fullwidth ? "w-full" : "",
             "items-center",
             hover ? "hover:bg-slate-50 dark:hover:bg-gray-800 group-hover:bg-slate-50 dark:group-hover:bg-gray-800" : "",
             size === "tiny" ? "p-1" : "p-2",

package/src/components/FieldCaption.tsx

@@ -1,3 +1,4 @@
+import React from "react";
 import { Typography } from "@firecms/ui";
 
 export function FieldCaption({

package/src/components/HomePage/DefaultHomePage.tsx

@@ -102,7 +102,7 @@ export function DefaultHomePage({
                     return (
                         <NavigationGroup
                             group={section.title}
-                            key={`plugin_section_${plugin.name}`}>
+                            key={`plugin_section_${plugin.key}`}>
                             {section.children}
                         </NavigationGroup>
                     );

package/src/components/HomePage/NavigationCard.tsx

@@ -52,7 +52,7 @@ export function NavigationCard({
                 {description && <Typography variant="body2"
                                             color="secondary"
                                             component="div">
-                    <Markdown source={description}/>
+                    <Markdown source={description} size={"small"}/>
                 </Typography>}
             </div>
 

package/src/components/ReferenceWidget.tsx

@@ -50,7 +50,7 @@ export function ReferenceWidget<M extends Record<string, any>>({
 
     const collection: EntityCollection | undefined = useMemo(() => {
         return navigationController.getCollection(path);
-    }, [path, navigationController]);
+    }, [path, navigationController.getCollection]);
 
     // if (!collection) {
     //     throw Error(`Couldn't find the corresponding collection for the path: ${path}`);

package/src/components/SelectableTable/filters/DateTimeFilterField.tsx

@@ -95,7 +95,7 @@ export function DateTimeFilterField({
                     size={"medium"}
                     locale={locale}
                     value={internalValue}
-                    onChange={(dateValue: Date | null) => {
+                    onChange={(dateValue: Date | undefined) => {
                         updateFilter(operation, dateValue === null ? undefined : dateValue);
                     }}
                     clearable={true}

package/src/components/VirtualTable/fields/VirtualTableDateField.tsx

@@ -25,7 +25,7 @@ export function VirtualTableDateField(props: {
     return (
         <DateTimeField
             value={internalValue ?? undefined}
-            onChange={(dateValue) => updateValue(dateValue)}
+            onChange={(dateValue) => updateValue(dateValue ?? null)}
             size={"medium"}
             invisible={true}
             className={"w-full h-full"}

package/src/contexts/AuthControllerContext.tsx

@@ -1,4 +1,4 @@
 import React from "react";
 import { AuthController } from "../types";
 
-export const AuthControllerContext = React.createContext<AuthController>({} as AuthController);
+export const AuthControllerContext = React.createContext<AuthController<any, any>>({} as AuthController<any, any>);

package/src/core/FireCMS.tsx

@@ -85,7 +85,7 @@ export function FireCMS<UserType extends User, EC extends EntityCollection>(prop
         onAnalyticsEvent
     }), []);
 
-    const accessResponse = useProjectLog(authController);
+    const accessResponse = useProjectLog(authController, plugins);
 
     if (navigationController.navigationLoadingError) {
         return (

package/src/form/EntityForm.tsx

@@ -443,7 +443,7 @@ function EntityFormInternal<M extends Record<string, any>>({
         pluginActions.push(...plugins.map((plugin, i) => (
             plugin.form?.Actions
                 ? <plugin.form.Actions
-                    key={`actions_${plugin.name}`} {...actionProps}/>
+                    key={`actions_${plugin.key}`} {...actionProps}/>
                 : null
         )).filter(Boolean));
     }

package/src/form/field_bindings/DateTimeFieldBinding.tsx

@@ -43,7 +43,7 @@ export function DateTimeFieldBinding({
         <>
             <DateTimeField
                 value={internalValue}
-                onChange={(dateValue) => setValue(dateValue)}
+                onChange={(dateValue) => setValue(dateValue ?? null)}
                 size={"medium"}
                 mode={property.mode}
                 clearable={property.clearable}

package/src/hooks/data/delete.ts

@@ -12,10 +12,10 @@ import {
 /**
  * @group Hooks and utilities
  */
-export type DeleteEntityWithCallbacksProps<M extends Record<string, any>> =
+export type DeleteEntityWithCallbacksProps<M extends Record<string, any>, UserType extends User = User> =
     DeleteEntityProps<M>
     & {
-    callbacks?: EntityCallbacks<M>;
+    callbacks?: EntityCallbacks<M, UserType>;
     onDeleteSuccess?: (entity: Entity<M>) => void;
     onDeleteFailure?: (entity: Entity<M>, e: Error) => void;
     onPreDeleteHookError?: (entity: Entity<M>, e: Error) => void;
@@ -62,7 +62,7 @@ export async function deleteEntityWithCallbacks<M extends Record<string, any>, U
 
     console.debug("Deleting entity", entity.path, entity.id);
 
-    const entityDeleteProps: EntityOnDeleteProps<M, UserType> = {
+    const entityDeleteProps: EntityOnDeleteProps<M, any> = {
         entity,
         collection,
         entityId: entity.id,

package/src/hooks/data/save.ts

@@ -64,7 +64,7 @@ export async function saveEntityWithCallbacks<M extends Record<string, any>, Use
                                                                                                         onPreSaveHookError,
                                                                                                         onSaveSuccessHookError
                                                                                                     }: SaveEntityWithCallbacksProps<M> & {
-                                                                                                        collection: EntityCollection<M>,
+                                                                                                        collection: EntityCollection<M, UserType>,
                                                                                                         dataSource: DataSource,
                                                                                                         context: FireCMSContext<UserType>,
                                                                                                     }

package/src/hooks/data/useDataSource.tsx

@@ -6,7 +6,7 @@ import { DataSourceContext } from "../../contexts/DataSourceContext";
  * Use this hook to get the datasource being used
  * @group Hooks and utilities
  */
-export const useDataSource = (collection?: EntityCollection): DataSource => {
+export const useDataSource = (collection?: EntityCollection<any, any>): DataSource => {
     const defaultDataSource = useContext(DataSourceContext);
     if (collection?.overrides?.dataSource)
         return collection?.overrides.dataSource;

package/src/hooks/data/useEntityFetch.tsx

@@ -7,10 +7,10 @@ import { useFireCMSContext } from "../useFireCMSContext";
 /**
  * @group Hooks and utilities
  */
-export interface EntityFetchProps<M extends Record<string, any>> {
+export interface EntityFetchProps<M extends Record<string, any>, UserType extends User = User> {
     path: string;
     entityId?: string;
-    collection: EntityCollection<M>;
+    collection: EntityCollection<M, UserType>;
     useCache?: boolean;
 }
 
@@ -41,7 +41,7 @@ export function useEntityFetch<M extends Record<string, any>, UserType extends U
         entityId,
         collection,
         useCache = false
-    }: EntityFetchProps<M>): EntityFetchResult<M> {
+    }: EntityFetchProps<M, UserType>): EntityFetchResult<M> {
 
     const dataSource = useDataSource(collection);
     const navigationController = useNavigationController();

package/src/hooks/index.tsx

@@ -25,3 +25,5 @@ export * from "./useBuildNavigationController";
 
 export * from "./useBuildLocalConfigurationPersistence";
 export * from "./useBuildModeController";
+
+export * from "./useValidateAuthenticator";