@firecms/core 3.0.0-canary.3 → 3.0.0-canary.30

package/src/types/navigation.ts

@@ -1,3 +1,4 @@
+import React from "react";
 import { EntityCollection } from "./collections";
 import { EntityReference } from "./entities";
 
@@ -6,7 +7,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.
@@ -22,6 +23,12 @@ export type NavigationController = {
      */
     views?: CMSView[];
 
+    /**
+     * Custom additional views created by the developer, added to the admin
+     * navigation
+     */
+    adminViews?: CMSView[];
+
     /**
      * Configuration for the views that should be displayed at the top
      * level of the navigation (e.g. in the home page or the navigation
@@ -49,18 +56,18 @@ 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
@@ -116,13 +123,6 @@ export type NavigationController = {
      */
     resolveAliasesFrom: (pathWithAliases: string) => string;
 
-    /**
-     * Location used as the base for routes.
-     * This is the location that will be used underneath, when the url changes while
-     * opening a side dialog
-     */
-    baseLocation: string;
-
     /**
      * Call this method to recalculate the navigation
      */
@@ -192,6 +192,7 @@ export interface CMSView {
     /**
      * Optional field used to group top level navigation entries under a
      * navigation view.
+     * This prop is ignored for admin views.
      */
     group?: string;
 
@@ -201,11 +202,11 @@ export interface TopNavigationEntry {
     url: string;
     name: string;
     path: string;
-    type: "collection" | "view";
+    type: "collection" | "view" | "admin";
     collection?: EntityCollection;
-    view: CMSView;
+    view?: CMSView;
     description?: string;
-    group?: string;
+    group: string;
 }
 
 export type TopNavigationResult = {

package/src/types/permissions.ts

@@ -41,6 +41,11 @@ export interface PermissionsBuilderProps<EC extends EntityCollection = EntityCol
      */
     entity: Entity<M> | null;
 
+    /**
+     * Path of the collection e.g. 'products/12345/locales'
+     */
+    path: string;
+
     /**
      * Path segments of the collection e.g. ['products', 'locales']
      */
@@ -73,4 +78,4 @@ export type PermissionsBuilder<EC extends EntityCollection = EntityCollection, U
           user,
           collection,
           authController
-      }: PermissionsBuilderProps<EC, UserType, M>) => Permissions);
+      }: PermissionsBuilderProps<EC, UserType, M>) => Permissions | undefined);

package/src/types/plugins.tsx

@@ -7,6 +7,7 @@ import { FieldProps, FormContext } from "./fields";
 import { CMSType, Property } from "./properties";
 import { EntityStatus } from "./entities";
 import { ResolvedProperty } from "./resolved_entities";
+import { CMSView } from "./navigation";
 
 /**
  * Interface used to define plugins for FireCMS.
@@ -16,9 +17,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
@@ -26,31 +27,6 @@ export type FireCMSPlugin<PROPS = any, FORM_PROPS = any, EC extends EntityCollec
      */
     loading?: boolean;
 
-    collections?: {
-
-        /**
-         * Use this component to add custom actions to the entity collections
-         * toolbar.
-         */
-        CollectionActions?: React.ComponentType<CollectionActionsProps<any, any, EC> & COL_ACTIONS_PROPS> | React.ComponentType<CollectionActionsProps<any, any, EC> & COL_ACTIONS_PROPS>[];
-
-        collectionActionsProps?: COL_ACTIONS_PROPS;
-
-    }
-
-    form?: {
-        provider?: {
-            Component: React.ComponentType<PropsWithChildren<FORM_PROPS & PluginFormActionProps<any, EC>>>;
-            props?: FORM_PROPS;
-        }
-
-        Actions?: React.ComponentType<PluginFormActionProps<any, EC>>;
-
-        fieldBuilder?: <T extends CMSType = CMSType>(props: PluginFieldBuilderParams<T, any, EC>) => React.ComponentType<FieldProps<T>> | null;
-
-        fieldBuilderEnabled?: <T extends CMSType = CMSType>(props: PluginFieldBuilderParams<T>) => boolean;
-    }
-
     /**
      * You can use this prop to add higher order components to the CMS.
      * The components will be added to the root of the CMS, so any component
@@ -113,6 +89,14 @@ export type FireCMSPlugin<PROPS = any, FORM_PROPS = any, EC extends EntityCollec
 
     collectionView?: {
 
+        /**
+         * Use this component to add custom actions to the entity collections
+         * toolbar.
+         */
+        CollectionActions?: React.ComponentType<CollectionActionsProps<any, any, EC> & COL_ACTIONS_PROPS> | React.ComponentType<CollectionActionsProps<any, any, EC> & COL_ACTIONS_PROPS>[];
+
+        collectionActionsProps?: COL_ACTIONS_PROPS;
+
         showTextSearchBar?: (props: {
             context: FireCMSContext,
             path: string,
@@ -151,6 +135,19 @@ export type FireCMSPlugin<PROPS = any, FORM_PROPS = any, EC extends EntityCollec
         }>;
     }
 
+    form?: {
+        provider?: {
+            Component: React.ComponentType<PropsWithChildren<FORM_PROPS & PluginFormActionProps<any, EC>>>;
+            props?: FORM_PROPS;
+        }
+
+        Actions?: React.ComponentType<PluginFormActionProps<any, EC>>;
+
+        fieldBuilder?: <T extends CMSType = CMSType>(props: PluginFieldBuilderParams<T, any, EC>) => React.ComponentType<FieldProps<T>> | null;
+
+        fieldBuilderEnabled?: <T extends CMSType = CMSType>(props: PluginFieldBuilderParams<T>) => boolean;
+    }
+
 }
 
 /**

package/src/types/properties.ts

@@ -695,7 +695,7 @@ export interface ArrayPropertyValidationSchema extends PropertyValidationSchema
  * Additional configuration related to Storage related fields
  * @group Entity properties
  */
-export interface StorageConfig {
+export type StorageConfig = {
 
     /**
      * File MIME types that can be uploaded to this reference. Don't specify for
@@ -770,7 +770,8 @@ export interface StorageConfig {
      * Postprocess the saved value (storage path or URL)
      * after it has been resolved.
      */
-    postProcess?: (pathOrUrl: string) => Promise<string>
+    postProcess?: (pathOrUrl: string) => Promise<string>;
+
 }
 
 /**

package/src/types/property_config.tsx

@@ -11,7 +11,7 @@ export type PropertyConfig<T extends CMSType = any> = {
     /**
      * Key used to identify this property config.
      */
-    key: string,
+    key: PropertyConfigId | string;
 
     /**
      * Name of this field type.
@@ -48,7 +48,7 @@ export type PropertyConfig<T extends CMSType = any> = {
 
 }
 
-export type FieldConfigId =
+export type PropertyConfigId =
     "text_field" |
     "multiline" |
     "markdown" |

package/src/types/roles.ts

@@ -0,0 +1,41 @@
+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/src/types/side_entity_controller.tsx

@@ -1,6 +1,7 @@
 import { EntityCollection } from "./collections";
 import { ResolvedEntityCollection } from "./resolved_entities";
 import { Entity } from "./entities";
+import { EntityOverrides } from "./entity_overrides";
 
 /**
  * Props used to open a side dialog

package/src/types/storage.ts

@@ -6,6 +6,7 @@ export interface UploadFileProps {
     fileName?: string,
     path?: string,
     metadata?: any,
+    bucket?: string
 }
 
 /**
@@ -16,6 +17,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;
 }
 
 /**
@@ -73,24 +78,28 @@ export interface StorageSource {
      * @param fileName
      * @param path
      * @param metadata
+     * @param bucket
      */
     uploadFile: ({
                      file,
                      fileName,
                      path,
-                     metadata
+                     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/src/types/user.ts

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

package/src/util/collections.ts

@@ -1,6 +1,8 @@
 import {
     DefaultSelectedViewBuilder,
     DefaultSelectedViewParams,
+    EntityCollection,
+    PermissionsBuilder,
     PropertiesOrBuilders,
     PropertyOrBuilder
 } from "../types";
@@ -48,3 +50,23 @@ export function resolveDefaultSelectedView(
         return defaultSelectedView(params);
     }
 }
+
+/**
+ * If a collection is not applying permissions, we apply the given permissionsBuilder.
+ * This is used to apply the role permissions to the collections, unless they are already
+ * applying permissions.
+ * @param collections
+ * @param permissionsBuilder
+ */
+export const applyPermissionsFunctionIfEmpty = (collections: EntityCollection[], permissionsBuilder?: PermissionsBuilder<any, any>): EntityCollection[] => {
+
+    return collections.map(collection => {
+        if (collection.permissions) {
+            return collection;
+        }
+        return ({
+            ...collection,
+            permissions: permissionsBuilder
+        });
+    });
+}

package/src/util/icons.tsx

@@ -1,5 +1,4 @@
 import React from "react";
-import { CMSView, EntityCollection } from "../types";
 import { hashString } from "./hash";
 import { coolIconKeys, Icon, iconKeys } from "@firecms/ui";
 import { slugify } from "./strings";
@@ -14,8 +13,17 @@ export function getIcon(iconKey?: string, className?: string): React.ReactElemen
     return iconKey in iconKeysMap ? <Icon iconKey={iconKey} size={"medium"} className={className}/> : undefined;
 }
 
+export type IconViewProps = {
+    path: string;
+    name: string;
+    singularName?: string;
+    group?: string;
+    icon?: string;
+}
+
 export const IconForView = React.memo(
-    function IconForView({ collectionOrView, className }: { collectionOrView: EntityCollection | CMSView, className?: string }): React.ReactElement {
+    function IconForView({ collectionOrView, className }: { collectionOrView?: IconViewProps, className?: string }): React.ReactElement {
+        if (!collectionOrView) return <></>;
         const icon = getIcon(collectionOrView.icon, className);
         if (collectionOrView?.icon && icon)
             return icon;
@@ -39,7 +47,7 @@ export const IconForView = React.memo(
 
         return <Icon iconKey={key} size={"medium"} className={className}/>;
     }, (prevProps, nextProps) => {
-        return equal(prevProps.collectionOrView.icon, nextProps.collectionOrView.icon);
+        return equal(prevProps.collectionOrView?.icon, nextProps.collectionOrView?.icon);
     });
 
 const iconKeysMap: Record<string, string> = iconKeys.reduce((acc: Record<string, string>, key) => {

package/src/util/permissions.ts

@@ -1,4 +1,5 @@
 import { AuthController, Entity, EntityCollection, Permissions, User } from "../types";
+import { fullPathToCollectionSegments } from "./paths";
 
 const DEFAULT_PERMISSIONS = {
     read: true,
@@ -10,8 +11,8 @@ const DEFAULT_PERMISSIONS = {
 export function resolvePermissions<M extends Record<string, any>, UserType extends User>
 (collection: EntityCollection<M>,
  authController: AuthController<UserType>,
- pathSegments: string[],
- entity: Entity<M> | null): Permissions {
+ path: string,
+ entity: Entity<M> | null): Permissions | undefined {
 
     const permission = collection.permissions;
     if (permission === undefined) {
@@ -19,8 +20,10 @@ export function resolvePermissions<M extends Record<string, any>, UserType exten
     } else if (typeof permission === "object") {
         return permission as Permissions;
     } else if (typeof permission === "function") {
+        const pathSegments = fullPathToCollectionSegments(path);
         return permission({
             entity,
+            path,
             user: authController.user,
             authController,
             collection,
@@ -35,27 +38,27 @@ export function canEditEntity<M extends Record<string, any>, UserType extends Us
 (
     collection: EntityCollection<M>,
     authController: AuthController<UserType>,
-    paths: string[],
+    path: string,
     entity: Entity<M> | null): boolean {
-    return resolvePermissions(collection, authController, paths, entity).edit ?? DEFAULT_PERMISSIONS.edit;
+    return resolvePermissions(collection, authController, path, entity)?.edit ?? DEFAULT_PERMISSIONS.edit;
 }
 
 export function canCreateEntity<M extends Record<string, any>, UserType extends User>
 (
     collection: EntityCollection<M>,
     authController: AuthController<UserType>,
-    paths: string[],
+    path: string,
     entity: Entity<M> | null): boolean {
-    return resolvePermissions(collection, authController, paths, entity).create ?? DEFAULT_PERMISSIONS.create;
+    return resolvePermissions(collection, authController, path, entity)?.create ?? DEFAULT_PERMISSIONS.create;
 }
 
 export function canDeleteEntity<M extends Record<string, any>, UserType extends User>
 (
     collection: EntityCollection<M>,
     authController: AuthController<UserType>,
-    paths: string[],
+    path: string,
     entity: Entity<M> | null): boolean {
-    return resolvePermissions(collection, authController, paths, entity).delete ?? DEFAULT_PERMISSIONS.delete;
+    return resolvePermissions(collection, authController, path, entity)?.delete ?? DEFAULT_PERMISSIONS.delete;
 }
 
 // export function resolveCollectionsPermissions(roles: Role[]): Record<string, Permissions> {

package/src/util/references.ts

@@ -1,11 +1,12 @@
-import { EntityCollection, PropertyConfig } from "../types";
+import { EntityCollection, PropertyConfig, ResolvedEntityCollection } from "../types";
 import { isReferenceProperty } from "./property_utils";
 import { isPropertyBuilder } from "./entities";
+import { getFieldConfig } from "../core";
 
-export function getReferencePreviewKeys(targetCollection: EntityCollection<any>,
-                                        fields: Record<string, PropertyConfig>,
-                                        previewProperties?: string[],
-                                        limit = 3) {
+export function getEntityPreviewKeys(targetCollection: EntityCollection<any>,
+                                     fields: Record<string, PropertyConfig>,
+                                     previewProperties?: string[],
+                                     limit = 3) {
     const allProperties = Object.keys(targetCollection.properties);
     let listProperties = previewProperties?.filter(p => allProperties.includes(p as string));
     if (listProperties && listProperties.length > 0) {
@@ -18,3 +19,33 @@ export function getReferencePreviewKeys(targetCollection: EntityCollection<any>,
         }).slice(0, limit);
     }
 }
+
+export function getEntityTitlePropertyKey<M extends Record<string, any>>(collection: EntityCollection<M>, propertyConfigs: Record<string, PropertyConfig<any>>): string | undefined {
+    if (collection.titleProperty) {
+        return collection.titleProperty as string;
+    }
+    // find first text field property
+    for (const key in collection.properties) {
+        const property = collection.properties[key];
+        if (!isPropertyBuilder(property)) {
+            const field = getFieldConfig(property, propertyConfigs);
+            if (field?.key === "text_field") {
+                return key;
+            }
+        }
+    }
+    return undefined;
+}
+
+export function getEntityImagePreviewPropertyKey<M extends object>(collection: ResolvedEntityCollection<M>): string | undefined {
+
+    // find first text field property
+    for (const key in collection.properties) {
+        const property = collection.properties[key];
+        if (property.dataType === "string" && property.storage?.acceptedFiles?.includes("image/*")) {
+            return key;
+        }
+
+    }
+    return undefined;
+}

package/src/util/useTraceUpdate.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useRef } from "react";
 
-function printChanged(props: any, prev: any, path = "", depth = 0, maxDepth: number) {
+export function printChanged(props: any, prev: any, path: string | undefined = "", depth: number | undefined = 0, maxDepth: number | undefined = 10) {
     if (depth > maxDepth) {
         return;
     }
@@ -17,6 +17,7 @@ function printChanged(props: any, prev: any, path = "", depth = 0, maxDepth: num
 export function useTraceUpdate(props: any, maxDepth = 3) {
     const prev = useRef(props);
     useEffect(() => {
+        console.log("Changed props:");
         printChanged(props, prev.current, "", 0, maxDepth);
         prev.current = props;
     });