@firecms/core 3.0.0-canary.60 → 3.0.0-canary.62

package/src/form/EntityForm.tsx

@@ -132,13 +132,12 @@ export type EntityFormSaveParams<M extends Record<string, any>> = {
  * @constructor
  * @group Components
  */
-export const EntityForm = EntityFormInternal;
-// export const EntityForm = React.memo<EntityFormProps<any>>(EntityFormInternal,
-//     (a: EntityFormProps<any>, b: EntityFormProps<any>) => {
-//         return a.status === b.status &&
-//             a.path === b.path &&
-//             equal(a.entity?.values, b.entity?.values);
-//     }) as typeof EntityFormInternal;
+export const EntityForm = React.memo<EntityFormProps<any>>(EntityFormInternal,
+    (a: EntityFormProps<any>, b: EntityFormProps<any>) => {
+        return a.status === b.status &&
+            a.path === b.path &&
+            equal(a.entity?.values, b.entity?.values);
+    }) as typeof EntityFormInternal;
 
 function getDataSourceEntityValues<M extends object>(initialResolvedCollection: ResolvedEntityCollection,
                                                      status: "new" | "existing" | "copy",

package/src/index.ts

@@ -1,4 +1,5 @@
 export * from "./core";
+export * from "./app";
 export * from "./types";
 export * from "./form";
 export * from "./preview";

package/dist/core/Drawer.d.ts

@@ -1,16 +0,0 @@
-/**
- * Props used in case you need to override the default drawer
- * @group Core
- */
-export type DrawerProps = {
-    hovered: boolean;
-    drawerOpen: boolean;
-    openDrawer: () => void;
-    closeDrawer: () => void;
-    autoOpenDrawer?: boolean;
-};
-/**
- * Default drawer used in the CMS
- * @group Core
- */
-export declare function Drawer(): import("react/jsx-runtime").JSX.Element;

package/dist/core/Scaffold.d.ts

@@ -1,51 +0,0 @@
-import React from "react";
-import { DrawerProps } from "./Drawer";
-import { FireCMSAppBarProps } from "../components";
-export declare const DRAWER_WIDTH = 280;
-export declare function useDrawer(): DrawerProps;
-/**
- * @group Core
- */
-export interface ScaffoldProps<ExtraAppbarProps = object> {
-    /**
-     * Name of the app, displayed as the main title and in the tab title
-     */
-    name?: React.ReactNode;
-    /**
-     * Logo to be displayed in the drawer of the CMS
-     */
-    logo?: string;
-    /**
-     * Whether to include the drawer in the scaffold
-     */
-    includeDrawer?: boolean;
-    /**
-     * You can define a custom drawer to be displayed in the scaffold.
-     * Use the hook `useDrawer` to access the context values.
-     */
-    drawer?: React.ReactNode;
-    /**
-     * Open the drawer on hover
-     */
-    autoOpenDrawer?: boolean;
-    /**
-     * The AppBar component to be used in the scaffold.
-     */
-    FireCMSAppBar?: React.ComponentType<FireCMSAppBarProps<ExtraAppbarProps>>;
-    /**
-     * Additional props passed to the custom AppBar
-     */
-    fireCMSAppBarProps?: Partial<FireCMSAppBarProps> & ExtraAppbarProps;
-}
-/**
- * This view acts as a scaffold for FireCMS.
- *
- * It is in charge of displaying the navigation drawer, top bar and main
- * collection views.
- * This component needs a parent {@link FireCMS}
- *
- * @param props
- * @constructor
- * @group Core
- */
-export declare const Scaffold: React.NamedExoticComponent<React.PropsWithChildren<ScaffoldProps<object>>>;

package/src/core/Drawer.tsx

@@ -1,139 +0,0 @@
-import React, { useCallback } from "react";
-
-import { useLargeLayout, useNavigationController } from "../hooks";
-
-import { useNavigate } from "react-router-dom";
-import { CMSAnalyticsEvent, TopNavigationEntry, TopNavigationResult } from "../types";
-import { IconForView } from "../util";
-import { cls, IconButton, Menu, MenuItem, MoreVertIcon, Tooltip, Typography } from "@firecms/ui";
-import { useAnalyticsController } from "../hooks/useAnalyticsController";
-import { useDrawer } from "./Scaffold";
-import { DrawerNavigationItem } from "./DrawerNavigationItem";
-
-/**
- * Props used in case you need to override the default drawer
- * @group Core
- */
-export type DrawerProps = {
-    hovered: boolean,
-    drawerOpen: boolean,
-    openDrawer: () => void,
-    closeDrawer: () => void,
-    autoOpenDrawer?: boolean
-}
-
-/**
- * Default drawer used in the CMS
- * @group Core
- */
-export function Drawer() {
-
-    const {
-        hovered,
-        drawerOpen,
-        closeDrawer,
-    } = useDrawer();
-
-    const analyticsController = useAnalyticsController();
-    const navigation = useNavigationController();
-
-    const tooltipsOpen = hovered && !drawerOpen;
-    const largeLayout = useLargeLayout();
-    const navigate = useNavigate();
-
-    const [adminMenuOpen, setAdminMenuOpen] = React.useState(false);
-
-    if (!navigation.topLevelNavigation)
-        throw Error("Navigation not ready in Drawer");
-
-    const {
-        navigationEntries,
-        groups
-    }: TopNavigationResult = navigation.topLevelNavigation;
-
-    const adminViews = navigationEntries.filter(e => e.type === "admin") ?? [];
-    const groupsWithoutAdmin = groups.filter(g => g !== "Admin");
-
-    const buildGroupHeader = useCallback((group?: string) => {
-        if (!drawerOpen) return <div className="h-12 w-full"/>;
-        return <div
-            className="pt-8 pl-6 pr-8 pb-2 flex flex-row items-center">
-            <Typography variant={"caption"}
-                        color={"secondary"}
-                        className="font-medium flex-grow line-clamp-1">
-                {group ? group.toUpperCase() : "Views".toUpperCase()}
-            </Typography>
-
-        </div>;
-    }, [drawerOpen]);
-
-    const onClick = (view: TopNavigationEntry) => {
-        const eventName: CMSAnalyticsEvent = view.type === "collection"
-            ? "drawer_navigate_to_collection"
-            : (view.type === "view" ? "drawer_navigate_to_view" : "unmapped_event");
-        analyticsController.onAnalyticsEvent?.(eventName, { url: view.url });
-        if (!largeLayout)
-            closeDrawer();
-    };
-
-    return (
-        <>
-
-            <div className={"flex-grow overflow-scroll no-scrollbar"}>
-
-                {groupsWithoutAdmin.map((group) => (
-                    <React.Fragment
-                        key={`drawer_group_${group}`}>
-                        {buildGroupHeader(group)}
-                        {Object.values(navigationEntries)
-                            .filter(e => e.group === group)
-                            .map((view, index) =>
-                                <DrawerNavigationItem
-                                    key={`navigation_${index}`}
-                                    icon={<IconForView collectionOrView={view.collection ?? view.view}/>}
-                                    tooltipsOpen={tooltipsOpen}
-                                    drawerOpen={drawerOpen}
-                                    onClick={() => onClick(view)}
-                                    url={view.url}
-                                    name={view.name}/>)}
-                    </React.Fragment>
-                ))}
-
-            </div>
-
-            {adminViews.length > 0 && <Menu
-                open={adminMenuOpen}
-                onOpenChange={setAdminMenuOpen}
-                trigger={
-                    <IconButton
-                        shape={"square"}
-                        className={"m-4 text-gray-900 dark:text-white w-fit"}>
-                        <Tooltip title={"Admin"}
-                                 open={tooltipsOpen}
-                                 side={"right"} sideOffset={28}>
-                            <MoreVertIcon/>
-                        </Tooltip>
-                        {drawerOpen && <div
-                            className={cls(
-                                drawerOpen ? "opacity-100" : "opacity-0 hidden",
-                                "mx-4 font-inherit text-inherit"
-                            )}>
-                            ADMIN
-                        </div>}
-                    </IconButton>}
-            >
-                {adminViews.map((entry, index) =>
-                    <MenuItem
-                        onClick={(event) => {
-                            event.preventDefault();
-                            navigate(entry.path);
-                        }}
-                        key={`navigation_${index}`}>
-                        {<IconForView collectionOrView={entry.view}/>}
-                        {entry.name}
-                    </MenuItem>)}
-
-            </Menu>}
-        </>
-    );
-}