@firecms/core 3.0.0-alpha.45 → 3.0.0-alpha.46

package/dist/types/firecms.d.ts

@@ -1,9 +1,9 @@
 import React from "react";
 import { User } from "./user";
 import { AuthController } from "./auth";
-import { DataSource, DataSourceDelegate } from "./datasource";
+import { DataSourceDelegate } from "./datasource";
 import { EntityCollection, EntityCustomView } from "./collections";
-import { CMSView, NavigationController } from "./navigation";
+import { CMSView } from "./navigation";
 import { FireCMSContext } from "./firecms_context";
 import { PropertyConfig } from "./property_config";
 import { Locale } from "./locales";
@@ -62,6 +62,18 @@ export type FireCMSProps<UserType extends User, EC extends EntityCollection> = {
          */
         loading: boolean;
     }) => React.ReactNode;
+    /**
+     * List of the mapped collections in the CMS.
+     * Each entry relates to a collection in the root database.
+     * Each of the navigation entries in this field
+     * generates an entry in the main menu.
+     */
+    collections?: EC[] | EntityCollectionsBuilder<EC>;
+    /**
+     * Custom additional views created by the developer, added to the main
+     * navigation
+     */
+    views?: CMSView[] | CMSViewsBuilder;
     /**
      * Record of custom form fields to be used in the CMS.
      * You can use the key to reference the custom field in
@@ -88,7 +100,7 @@ export type FireCMSProps<UserType extends User, EC extends EntityCollection> = {
     /**
      * Connector to your database
      */
-    dataSource: DataSource;
+    dataSourceDelegate: DataSourceDelegate;
     /**
      * Connector to your file upload/fetch implementation
      */
@@ -98,10 +110,17 @@ export type FireCMSProps<UserType extends User, EC extends EntityCollection> = {
      */
     authController: AuthController<UserType>;
     /**
-     * Controller in charge of managing the collections and views of the CMS.
-     * @see {@link useBuildNavigationController}
+     * Path under the navigation routes of the CMS will be created. Defaults to `/`.
+     * Internally FireCMS uses `react-router` to create the routes, the base path is attached to the
+     * `BrowserRouter` component. If you are using FireCMS in a subpath of your website, you can use
+     * this prop to specify the base path.
+     */
+    basePath?: string;
+    /**
+     * Path under the collection routes of the CMS will be created.
+     * Defaults to `/c`.
      */
-    navigationController: NavigationController;
+    baseCollectionPath?: string;
     /**
      * Use this controller to access the configuration that is stored locally,
      * and not defined in code

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@firecms/core",
-    "version": "3.0.0-alpha.45",
+    "version": "3.0.0-alpha.46",
     "description": "Awesome Firebase/Firestore-based headless open-source CMS",
     "funding": {
         "url": "https://github.com/sponsors/firecmsco"
@@ -133,7 +133,7 @@
         "dist",
         "src"
     ],
-    "gitHead": "8a8223081bd7f76d655564ca995dca085f22d727",
+    "gitHead": "53ef13adab3db13baeea2ad7953e37cf3552fd62",
     "publishConfig": {
         "access": "public"
     }

package/src/components/EntityCollectionView/EntityCollectionViewActions.tsx

@@ -111,11 +111,11 @@ export function EntityCollectionViewActions<M extends Record<string, any>>({
         ));
 
     if (plugins) {
-        plugins.forEach(plugin => {
+        plugins.forEach((plugin, i) => {
             if (plugin.collections?.CollectionActions) {
                 actions.push(...toArray(plugin.collections?.CollectionActions)
-                    .map((Action, i) => (
-                        <ErrorBoundary key={`plugin_actions_${i}`}>
+                    .map((Action, j) => (
+                        <ErrorBoundary key={`plugin_actions_${i}_${j}`}>
                             <Action {...actionProps} {...plugin.collections?.collectionActionsProps}/>
                         </ErrorBoundary>
                     )));

package/src/core/FireCMS.tsx

@@ -16,7 +16,8 @@ import { SideDialogsControllerContext } from "../contexts/SideDialogsControllerC
 import { useLocaleConfig } from "../internal/useLocaleConfig";
 import { CenteredView } from "../ui";
 import { DialogsProvider } from "../contexts/DialogsProvider";
-
+import { useBuildNavigationController } from "../internal/useBuildNavigationController";
+import { useBuildDataSource } from "../internal/useBuildDataSource";
 
 /**
  * If you are using independent components of the CMS
@@ -41,17 +42,40 @@ export function FireCMS<UserType extends User, EC extends EntityCollection>(prop
         locale,
         authController,
         storageSource,
-        dataSource,
-        navigationController,
+        dataSourceDelegate,
         plugins,
         onAnalyticsEvent,
         propertyConfigs,
         entityViews,
-        components
+        components,
+        baseCollectionPath,
+        basePath,
+        collections,
+        views
     } = props;
 
     useLocaleConfig(locale);
 
+    const navigationController = useBuildNavigationController({
+        basePath,
+        baseCollectionPath,
+        authController,
+        collections,
+        views,
+        userConfigPersistence,
+        dataSource: dataSourceDelegate,
+        plugins
+    });
+
+    /**
+     * Controller in charge of fetching and persisting data
+     */
+    const dataSource = useBuildDataSource({
+        delegate: dataSourceDelegate,
+        propertyConfigs,
+        navigationController
+    });
+
     const sideDialogsController = useBuildSideDialogsController();
     const sideEntityController = useBuildSideEntityController(navigationController, sideDialogsController);
 

package/src/hooks/index.tsx

@@ -22,5 +22,3 @@ export * from "./useLargeLayout";
 
 export * from "./useReferenceDialog";
 export * from "./useBrowserTitleAndIcon";
-export * from "./useBuildDataSource";
-export * from "./useBuildNavigationController";

package/src/{hooks → internal}/useBuildDataSource.ts

@@ -62,8 +62,6 @@ export function useBuildDataSource({
                                                                          order
                                                                      }: FetchCollectionProps<M>
         ): Promise<Entity<M>[]> => {
-
-            const collection = collectionProp ?? navigationController.getCollection(path);
             return delegate.fetchCollection<M>({
                 path,
                 filter,
@@ -125,7 +123,7 @@ export function useBuildDataSource({
                     onError,
                     isCollectionGroup
                 });
-            }, [delegate])
+            }, [delegate, navigationController.getCollection])
             : undefined,
 
         /**
@@ -240,7 +238,7 @@ export function useBuildDataSource({
                     values: delegate.delegateToCMSModel(updatedFirestoreValues)
                 } as Entity<M>;
             });
-        }, [delegate.saveEntity]),
+        }, [delegate.saveEntity, navigationController.getCollection]),
 
         /**
          * Delete an entity

package/src/{hooks → internal}/useBuildNavigationController.tsx

@@ -24,6 +24,7 @@ import {
     resolvePermissions
 } from "../util";
 import { getParentReferencesFromPath } from "../util/parent_references_from_path";
+import { useTraceUpdate } from "../util/useTraceUpdate";
 
 const DEFAULT_BASE_PATH = "/";
 const DEFAULT_COLLECTION_PATH = "/c";
@@ -134,7 +135,7 @@ export function useBuildNavigationController<EC extends EntityCollection, UserTy
 
         setNavigationLoading(false);
         setInitialised(true);
-    }, [baseCollections, authController.user, authController.initialLoading, dataSource, plugins, baseViews, computeTopNavigation]);
+    }, [baseCollections, authController.user, authController.initialLoading, plugins, baseViews, computeTopNavigation]);
 
     useEffect(() => {
         refreshNavigation();

package/src/types/firecms.tsx

@@ -3,7 +3,7 @@ import { User } from "./user";
 import { AuthController } from "./auth";
 import { DataSource, DataSourceDelegate } from "./datasource";
 import { EntityCollection, EntityCustomView } from "./collections";
-import { CMSView, NavigationController } from "./navigation";
+import { CMSView } from "./navigation";
 import { FireCMSContext } from "./firecms_context";
 import { PropertyConfig } from "./property_config";
 import { Locale } from "./locales";
@@ -67,6 +67,20 @@ export type FireCMSProps<UserType extends User, EC extends EntityCollection> = {
         loading: boolean;
     }) => React.ReactNode;
 
+    /**
+     * List of the mapped collections in the CMS.
+     * Each entry relates to a collection in the root database.
+     * Each of the navigation entries in this field
+     * generates an entry in the main menu.
+     */
+    collections?: EC[] | EntityCollectionsBuilder<EC>;
+
+    /**
+     * Custom additional views created by the developer, added to the main
+     * navigation
+     */
+    views?: CMSView[] | CMSViewsBuilder;
+
     /**
      * Record of custom form fields to be used in the CMS.
      * You can use the key to reference the custom field in
@@ -98,7 +112,7 @@ export type FireCMSProps<UserType extends User, EC extends EntityCollection> = {
     /**
      * Connector to your database
      */
-    dataSource: DataSource;
+    dataSourceDelegate: DataSourceDelegate;
 
     /**
      * Connector to your file upload/fetch implementation
@@ -111,10 +125,18 @@ export type FireCMSProps<UserType extends User, EC extends EntityCollection> = {
     authController: AuthController<UserType>;
 
     /**
-     * Controller in charge of managing the collections and views of the CMS.
-     * @see {@link useBuildNavigationController}
+     * Path under the navigation routes of the CMS will be created. Defaults to `/`.
+     * Internally FireCMS uses `react-router` to create the routes, the base path is attached to the
+     * `BrowserRouter` component. If you are using FireCMS in a subpath of your website, you can use
+     * this prop to specify the base path.
      */
-    navigationController: NavigationController;
+    basePath?: string;
+
+    /**
+     * Path under the collection routes of the CMS will be created.
+     * Defaults to `/c`.
+     */
+    baseCollectionPath?: string;
 
     /**
      * Use this controller to access the configuration that is stored locally,
@@ -150,6 +172,4 @@ export type FireCMSProps<UserType extends User, EC extends EntityCollection> = {
 
     }
 
-
-
 };