@firecms/collection_editor 3.0.0-canary.248 → 3.0.0-canary.249

package/dist/types/config_controller.d.ts

@@ -1,4 +1,4 @@
-import { CMSType, Property } from "@firecms/core";
+import { CMSType, NavigationGroupMapping, Property } from "@firecms/core";
 import { PersistedCollection } from "./persisted_collection";
 /**
  * Use this controller to access the configuration that is stored externally,
@@ -17,6 +17,8 @@ export interface CollectionsConfigController {
     saveProperty: (params: SavePropertyParams) => Promise<void>;
     deleteProperty: (params: DeletePropertyParams) => Promise<void>;
     deleteCollection: (props: DeleteCollectionParams) => Promise<void>;
+    navigationEntries: NavigationGroupMapping[];
+    saveNavigationEntries: (entries: NavigationGroupMapping[]) => Promise<void>;
 }
 export type UpdateCollectionParams<M extends Record<string, any>> = {
     id: string;

package/dist/ui/collection_editor/properties/ReferencePropertyField.d.ts

@@ -1,8 +1,9 @@
-export declare function ReferencePropertyField({ existing, multiple, disabled, showErrors }: {
+export declare function ReferencePropertyField({ existing, multiple, disabled, showErrors, asString }: {
     existing: boolean;
     multiple: boolean;
     disabled: boolean;
     showErrors: boolean;
+    asString?: boolean;
 }): import("react/jsx-runtime").JSX.Element;
 export declare function CollectionsSelect({ disabled, pathPath, value, handleChange, error, ...props }: {
     disabled: boolean;

package/package.json

@@ -1,18 +1,18 @@
 {
   "name": "@firecms/collection_editor",
   "type": "module",
-  "version": "3.0.0-canary.248",
+  "version": "3.0.0-canary.249",
   "main": "./dist/index.umd.js",
   "module": "./dist/index.es.js",
   "types": "dist/index.d.ts",
   "source": "src/index.ts",
   "dependencies": {
-    "@firecms/data_export": "^3.0.0-canary.248",
-    "@firecms/data_import": "^3.0.0-canary.248",
-    "@firecms/data_import_export": "^3.0.0-canary.248",
-    "@firecms/formex": "^3.0.0-canary.248",
-    "@firecms/schema_inference": "^3.0.0-canary.248",
-    "@firecms/ui": "^3.0.0-canary.248",
+    "@firecms/data_export": "^3.0.0-canary.249",
+    "@firecms/data_import": "^3.0.0-canary.249",
+    "@firecms/data_import_export": "^3.0.0-canary.249",
+    "@firecms/formex": "^3.0.0-canary.249",
+    "@firecms/schema_inference": "^3.0.0-canary.249",
+    "@firecms/ui": "^3.0.0-canary.249",
     "json5": "^2.2.3",
     "prism-react-renderer": "^2.4.1"
   },
@@ -69,5 +69,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "466985640b3a605bf94f53b263cab1821ff24dd0"
+  "gitHead": "5a61d7000af7d369373142087ee99792178a2c6f"
 }

package/src/types/config_controller.tsx

@@ -1,4 +1,4 @@
-import { CMSType, Property } from "@firecms/core";
+import { CMSType, NavigationGroupMapping, Property } from "@firecms/core";
 import { PersistedCollection } from "./persisted_collection";
 
 /**
@@ -21,6 +21,9 @@ export interface CollectionsConfigController {
 
     deleteCollection: (props: DeleteCollectionParams) => Promise<void>;
 
+    navigationEntries: NavigationGroupMapping[];
+    saveNavigationEntries: (entries: NavigationGroupMapping[]) => Promise<void>;
+
 }
 
 export type UpdateCollectionParams<M extends Record<string, any>> = {

package/src/ui/collection_editor/CollectionDetailsForm.tsx

@@ -163,7 +163,7 @@ export function CollectionDetailsForm({
                         </FieldCaption>
                     </div>
 
-                    <div className={cls("col-span-12 ", isSubcollection ? "" : "sm:col-span-8")}>
+                    <div className={cls("col-span-12 ")}>
                         <Field name={"path"}
                                as={DebouncedTextField}
                                label={"Path"}
@@ -179,40 +179,40 @@ export function CollectionDetailsForm({
 
                     </div>
 
-                    {!isSubcollection && <div className={"col-span-12 sm:col-span-4 relative"}>
-
-                        <TextField error={showErrors && Boolean(errors.group)}
-                                   disabled={isSubmitting}
-                                   value={values.group ?? ""}
-                                   autoComplete="off"
-                                   onChange={(event) => setFieldValue("group", event.target.value)}
-                                   name={"group"}
-                                   inputRef={groupRef}
-                                   label="Group"/>
-                        <Autocomplete
-                            open={autoCompleteOpen && (groupOptions ?? []).length > 0}
-                            setOpen={setAutoCompleteOpen}>
-                            {groupOptions?.map((group, index) => {
-                                return <AutocompleteItem
-                                    key={index + "_" + group}
-                                    className={"pr-6 pl-14"}
-                                    onClick={() => {
-                                        setAutoCompleteOpen(false);
-                                        setFieldValue("group", group ?? null);
-                                    }}
-                                >
-                                    <div className={"flex-grow"}>
-                                        {group}
-                                    </div>
-                                </AutocompleteItem>;
-                            })}
-                        </Autocomplete>
-                        <FieldCaption>
-                            {showErrors && Boolean(errors.group) ? errors.group : "Group in the home page"}
-                        </FieldCaption>
-
-
-                    </div>}
+                    {/*{!isSubcollection && <div className={"col-span-12 sm:col-span-4 relative"}>*/}
+
+                    {/*    <TextField error={showErrors && Boolean(errors.group)}*/}
+                    {/*               disabled={isSubmitting}*/}
+                    {/*               value={values.group ?? ""}*/}
+                    {/*               autoComplete="off"*/}
+                    {/*               onChange={(event) => setFieldValue("group", event.target.value)}*/}
+                    {/*               name={"group"}*/}
+                    {/*               inputRef={groupRef}*/}
+                    {/*               label="Group"/>*/}
+                    {/*    <Autocomplete*/}
+                    {/*        open={autoCompleteOpen && (groupOptions ?? []).length > 0}*/}
+                    {/*        setOpen={setAutoCompleteOpen}>*/}
+                    {/*        {groupOptions?.map((group, index) => {*/}
+                    {/*            return <AutocompleteItem*/}
+                    {/*                key={index + "_" + group}*/}
+                    {/*                className={"pr-6 pl-14"}*/}
+                    {/*                onClick={() => {*/}
+                    {/*                    setAutoCompleteOpen(false);*/}
+                    {/*                    setFieldValue("group", group ?? null);*/}
+                    {/*                }}*/}
+                    {/*            >*/}
+                    {/*                <div className={"flex-grow"}>*/}
+                    {/*                    {group}*/}
+                    {/*                </div>*/}
+                    {/*            </AutocompleteItem>;*/}
+                    {/*        })}*/}
+                    {/*    </Autocomplete>*/}
+                    {/*    <FieldCaption>*/}
+                    {/*        {showErrors && Boolean(errors.group) ? errors.group : "Group in the home page"}*/}
+                    {/*    </FieldCaption>*/}
+
+
+                    {/*</div>}*/}
 
                     <LayoutModeSwitch
                         className={"col-span-12"}

package/src/ui/collection_editor/CollectionEditorDialog.tsx

@@ -17,7 +17,7 @@ import {
     randomString,
     removeInitialAndTrailingSlashes,
     removeUndefined,
-    TopNavigationResult,
+    NavigationResult,
     useAuthController,
     useCustomizationController,
     useNavigationController,
@@ -184,7 +184,7 @@ export function CollectionEditor(props: CollectionEditorDialogProps & {
 
     const {
         groups
-    }: TopNavigationResult = topLevelNavigation;
+    }: NavigationResult = topLevelNavigation;
 
     const initialCollection = collection
         ? {

package/src/ui/collection_editor/PropertyEditView.tsx

@@ -461,6 +461,13 @@ function PropertyEditFormFields({
                                     existing={existing}
                                     multiple={false}
                                     disabled={disabled}/>;
+    } else if (selectedFieldConfigId === "reference_as_string") {
+        childComponent =
+            <ReferencePropertyField showErrors={showErrors}
+                                    existing={existing}
+                                    asString={true}
+                                    multiple={false}
+                                    disabled={disabled}/>;
     } else if (selectedFieldConfigId === "date_time") {
         childComponent = <DateTimePropertyField disabled={disabled}/>;
     } else if (selectedFieldConfigId === "multi_references") {
@@ -605,6 +612,7 @@ const WIDGET_TYPE_MAP: Record<PropertyConfigId, string> = {
     file_upload: "File",
     multi_file_upload: "File",
     reference: "Reference",
+    reference_as_string: "Text",
     multi_references: "Reference",
     date_time: "Date",
     group: "Group",
@@ -762,7 +770,7 @@ export function WidgetSelectViewItem({
 
     return <Card
         onClick={onClick}
-        className={"flex flex-row items-center px-4 py-2"}>
+        className={"flex flex-row items-center px-4 py-2 m-1"}>
         <div
             className={cls(
                 "flex flex-row items-center text-base min-h-[48px]",

package/src/ui/collection_editor/PropertyFieldPreview.tsx

@@ -54,6 +54,7 @@ export function PropertyFieldPreview({
             </div>
             <Paper
                 className={cls(
+                    "m-1",
                     "border",
                     "pl-2 w-full flex flex-row gap-4 items-center",
                     cardMixin,

package/src/ui/collection_editor/properties/ReferencePropertyField.tsx

@@ -7,12 +7,14 @@ export function ReferencePropertyField({
                                            existing,
                                            multiple,
                                            disabled,
-                                           showErrors
+                                           showErrors,
+                                           asString
                                        }: {
     existing: boolean,
     multiple: boolean,
     disabled: boolean,
-    showErrors: boolean
+    showErrors: boolean,
+    asString?: boolean
 }) {
 
     const {
@@ -28,7 +30,7 @@ export function ReferencePropertyField({
             <CircularProgress/>
         </div>;
 
-    const pathPath = multiple ? "of.path" : "path";
+    const pathPath = asString ? "reference.path" : (multiple ? "of.path" : "path") ;
     const pathValue: string | undefined = getIn(values, pathPath);
     const pathError: string | undefined = showErrors && getIn(errors, pathPath);
 

package/src/ui/collection_editor/utils/supported_fields.tsx

@@ -14,6 +14,7 @@ export const supportedFieldsIds: PropertyConfigId[] = [
     "file_upload",
     "multi_file_upload",
     "reference",
+    "reference_as_string",
     "multi_references",
     "switch",
     "date_time",

package/src/ui/collection_editor/utils/update_property_for_widget.ts

@@ -208,6 +208,15 @@ export function updatePropertyFromWidget(propertyData: any,
                 editable: propertyData.editable !== undefined ? propertyData.editable : true
             } satisfies Property
         );
+    } else if (selectedWidgetId === "reference_as_string") {
+        updatedProperty = mergeDeep(
+            propertyData,
+            {
+                dataType: "string",
+                propertyConfig: "reference_as_string",
+                editable: propertyData.editable !== undefined ? propertyData.editable : true
+            } satisfies Property
+        );
     } else if (selectedWidgetId === "multi_references") {
         updatedProperty = mergeDeep(
             propertyData,

package/src/useCollectionEditorPlugin.tsx

@@ -96,9 +96,11 @@ export function useCollectionEditorPlugin<EC extends PersistedCollection = Persi
         homePage: {
             additionalActions: <NewCollectionButton/>,
             additionalChildrenStart: includeIntroView ? <IntroWidget/> : undefined,
-            // additionalChildrenEnd: <RootCollectionSuggestions introMode={introMode}/>,
             CollectionActions: HomePageEditorCollectionAction,
             AdditionalCards: NewCollectionCard,
+            allowDragAndDrop: true,
+            navigationEntries: collectionConfigController.navigationEntries,
+            onNavigationEntriesUpdate: collectionConfigController.saveNavigationEntries,
         },
         collectionView: {
             CollectionActionsStart: EditorCollectionActionStart,