@firecms/core 3.1.0-canary.1df3b2c → 3.1.0-canary.9e89e98

package/dist/types/collections.d.ts

@@ -326,6 +326,14 @@ export interface EntityCollection<M extends Record<string, any> = any, USER exte
      * Defaults to "table".
      */
     defaultViewMode?: ViewMode;
+    /**
+     * Which view modes are available for this collection.
+     * Possible values: "table", "cards", "kanban".
+     * Defaults to all three: ["table", "cards", "kanban"].
+     * Note: "kanban" will only be available if the collection has at least
+     * one string property with enumValues defined, regardless of this setting.
+     */
+    enabledViews?: ViewMode[];
     /**
      * Configuration for Kanban board view mode.
      * When set, the Kanban view mode becomes available.

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@firecms/core",
   "type": "module",
-  "version": "3.1.0-canary.1df3b2c",
+  "version": "3.1.0-canary.9e89e98",
   "description": "Awesome Firebase/Firestore-based headless open-source CMS",
   "funding": {
     "url": "https://github.com/sponsors/firecmsco"
@@ -53,9 +53,9 @@
     "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/modifiers": "^9.0.0",
     "@dnd-kit/sortable": "^10.0.0",
-    "@firecms/editor": "^3.1.0-canary.1df3b2c",
-    "@firecms/formex": "^3.1.0-canary.1df3b2c",
-    "@firecms/ui": "^3.1.0-canary.1df3b2c",
+    "@firecms/editor": "^3.1.0-canary.9e89e98",
+    "@firecms/formex": "^3.1.0-canary.9e89e98",
+    "@firecms/ui": "^3.1.0-canary.9e89e98",
     "@radix-ui/react-portal": "^1.1.10",
     "clsx": "^2.1.1",
     "compressorjs": "^1.2.1",
@@ -111,7 +111,7 @@
     "dist",
     "src"
   ],
-  "gitHead": "5074584b15be0d0507a4dadc148f03d82e9fe495",
+  "gitHead": "7631fbfb6cde4415513e45c0557e18073ab359b8",
   "publishConfig": {
     "access": "public"
   },

package/src/components/EntityCollectionView/EntityCollectionView.tsx

@@ -501,18 +501,24 @@ export const EntityCollectionView = React.memo(
             authController,
         }), [collection, fullPath]);
 
-        // Check if Kanban view is available (needs kanban.columnProperty with enumValues)
-        const kanbanEnabled = useMemo(() => {
-            if (!collection.kanban?.columnProperty) return false;
-            const property = getPropertyInPath(resolvedCollection.properties, collection.kanban.columnProperty);
-            if (!property || !("dataType" in property) || property.dataType !== "string") return false;
-            return Boolean(property.enumValues);
-        }, [collection.kanban?.columnProperty, resolvedCollection.properties]);
-
-        // Check if a plugin can configure Kanban (has KanbanSetupComponent)
-        const hasKanbanConfigPlugin = useMemo(() => {
-            return customizationController.plugins?.some(plugin => plugin.collectionView?.KanbanSetupComponent) ?? false;
-        }, [customizationController.plugins]);
+        // Check if Kanban view is possible (collection has at least one string enum property)
+        const hasEnumProperty = useMemo(() => {
+            const properties = resolvedCollection.properties;
+            return Object.values(properties).some((prop: any) =>
+                prop && prop.dataType === "string" && prop.enumValues
+            );
+        }, [resolvedCollection.properties]);
+
+        // Compute the effective enabled views:
+        // - Start from collection.enabledViews (defaults to all three)
+        // - Filter out kanban if no enum properties exist
+        const enabledViews: ViewMode[] = useMemo(() => {
+            const configured = collection.enabledViews ?? ["table", "cards", "kanban"];
+            if (!hasEnumProperty) {
+                return configured.filter(v => v !== "kanban");
+            }
+            return configured;
+        }, [collection.enabledViews, hasEnumProperty]);
 
         // Compute available enum properties for kanban column selection
         const kanbanPropertyOptions: KanbanPropertyOption[] = useMemo(() => {
@@ -819,8 +825,7 @@ export const EntityCollectionView = React.memo(
             <ViewModeToggle
                 viewMode={viewMode}
                 onViewModeChange={onViewModeChange}
-                kanbanEnabled={kanbanEnabled}
-                hasKanbanConfigPlugin={hasKanbanConfigPlugin}
+                enabledViews={enabledViews}
                 size={viewMode === "table" ? tableSize : viewMode === "cards" ? cardSize : undefined}
                 onSizeChanged={viewMode === "table" ? onTableSizeChanged : viewMode === "cards" ? setCardSize : undefined}
                 open={viewModePopoverOpen}
@@ -867,7 +872,7 @@ export const EntityCollectionView = React.memo(
                 />
 
                 {/* View content - only the view-specific content changes */}
-                {viewMode === "kanban" && (kanbanEnabled || hasKanbanConfigPlugin) ? (
+                {viewMode === "kanban" && enabledViews.includes("kanban") ? (
                     <EntityCollectionBoardView
                         key={`kanban-view-${fullPath}-${selectedKanbanProperty}`}
                         collection={collection}

package/src/components/EntityCollectionView/ViewModeToggle.tsx

@@ -22,16 +22,11 @@ export type ViewModeToggleProps = {
     viewMode?: ViewMode;
     onViewModeChange?: (mode: ViewMode) => void;
     /**
-     * Whether Kanban view mode is available for this collection.
-     * Should be true when collection.kanban is set with a valid enum property.
+     * Which view modes are enabled for this collection.
+     * Only these modes will appear in the toggle.
+     * Defaults to all three: ["table", "cards", "kanban"].
      */
-    kanbanEnabled?: boolean;
-    /**
-     * Whether a plugin exists that can configure Kanban (e.g., collection editor).
-     * When true, Kanban option is always shown (enabled or not based on kanbanEnabled).
-     * When false, Kanban option is shown but disabled.
-     */
-    hasKanbanConfigPlugin?: boolean;
+    enabledViews?: ViewMode[];
     /**
      * Current size for card/table views
      */
@@ -62,11 +57,12 @@ export type ViewModeToggleProps = {
     onKanbanPropertyChange?: (property: string) => void;
 }
 
+const ALL_VIEW_MODES: ViewMode[] = ["table", "cards", "kanban"];
+
 export function ViewModeToggle({
     viewMode = "table",
     onViewModeChange,
-    kanbanEnabled = false,
-    hasKanbanConfigPlugin = false,
+    enabledViews = ALL_VIEW_MODES,
     size,
     onSizeChanged,
     open,
@@ -93,16 +89,15 @@ export function ViewModeToggle({
         return "List";
     };
 
-    const showKanban = kanbanEnabled || hasKanbanConfigPlugin;
     const showSizeSelector = size && onSizeChanged && (viewMode === "table" || viewMode === "cards");
     const showKanbanPropertySelector = viewMode === "kanban" &&
         kanbanPropertyOptions &&
         kanbanPropertyOptions.length > 0 &&
         onKanbanPropertyChange;
 
-    // Build toggle options dynamically based on kanban availability
+    // Build toggle options based on enabledViews
     const viewModeOptions: ToggleButtonOption<ViewMode>[] = useMemo(() => {
-        const options: ToggleButtonOption<ViewMode>[] = [
+        const allOptions: ToggleButtonOption<ViewMode>[] = [
             {
                 value: "table",
                 label: "List",
@@ -112,20 +107,21 @@ export function ViewModeToggle({
                 value: "cards",
                 label: "Cards",
                 icon: <AppsIcon size="small" />
+            },
+            {
+                value: "kanban",
+                label: "Board",
+                icon: <ViewKanbanIcon size="small" />
             }
         ];
 
-        if (showKanban) {
-            options.push({
-                value: "kanban",
-                label: "Board",
-                icon: <ViewKanbanIcon size="small" />,
-                disabled: !kanbanEnabled && !hasKanbanConfigPlugin
-            });
-        }
+        return allOptions.filter(option => enabledViews.includes(option.value));
+    }, [enabledViews]);
 
-        return options;
-    }, [showKanban, kanbanEnabled, hasKanbanConfigPlugin]);
+    // Don't render if only one view is enabled
+    if (viewModeOptions.length <= 1 && !showSizeSelector) {
+        return null;
+    }
 
     return (
         <Popover
@@ -141,11 +137,13 @@ export function ViewModeToggle({
         >
             <div className="p-3 flex flex-col gap-3 min-w-[240px]">
                 {/* View mode toggle using ToggleButtonGroup */}
-                <ToggleButtonGroup
-                    value={viewMode}
-                    onValueChange={onViewModeChange}
-                    options={viewModeOptions}
-                />
+                {viewModeOptions.length > 1 && (
+                    <ToggleButtonGroup
+                        value={viewMode}
+                        onValueChange={onViewModeChange}
+                        options={viewModeOptions}
+                    />
+                )}
 
                 {/* Size selector */}
                 {showSizeSelector && (
@@ -199,4 +197,3 @@ export function ViewModeToggle({
         </Popover>
     );
 }
-

package/src/types/collections.ts

@@ -374,6 +374,15 @@ export interface EntityCollection<M extends Record<string, any> = any, USER exte
      */
     defaultViewMode?: ViewMode;
 
+    /**
+     * Which view modes are available for this collection.
+     * Possible values: "table", "cards", "kanban".
+     * Defaults to all three: ["table", "cards", "kanban"].
+     * Note: "kanban" will only be available if the collection has at least
+     * one string property with enumValues defined, regardless of this setting.
+     */
+    enabledViews?: ViewMode[];
+
     /**
      * Configuration for Kanban board view mode.
      * When set, the Kanban view mode becomes available.