@firecms/user_management 3.4.0 → 3.5.1

package/dist/useUserManagementPlugin.d.ts

@@ -7,4 +7,4 @@ export declare function IntroWidget({ noUsers, noRoles, userManagement }: {
     noUsers: boolean;
     noRoles: boolean;
     userManagement: UserManagement<any>;
-}): import("react").JSX.Element;
+}): import("react").JSX.Element | null;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@firecms/user_management",
   "type": "module",
-  "version": "3.4.0",
+  "version": "3.5.1",
   "publishConfig": {
     "access": "public"
   },
@@ -29,9 +29,9 @@
   "types": "./dist/index.d.ts",
   "source": "src/index.ts",
   "dependencies": {
-    "@firecms/core": "3.4.0",
-    "@firecms/formex": "3.4.0",
-    "@firecms/ui": "3.4.0",
+    "@firecms/core": "3.5.1",
+    "@firecms/formex": "3.5.1",
+    "@firecms/ui": "3.5.1",
     "date-fns": "^3.6.0"
   },
   "peerDependencies": {
@@ -60,7 +60,7 @@
   "gitHead": "9ecf37abf793bd2f2daaaed6f517ee5ee19b01ae",
   "repository": {
     "type": "git",
-    "url": "https://github.com/FireCMSco/firecms.git",
+    "url": "git+https://github.com/firecmsco/firecms.git",
     "directory": "packages/user_management"
   }
 }

package/src/components/UserManagementPausedNotice.tsx

@@ -0,0 +1,37 @@
+import React from "react";
+import { getLicenseSubscribeUrl, useLicenseStatus, useTranslation } from "@firecms/core";
+import { Button, Paper, Typography } from "@firecms/ui";
+
+/**
+ * Shown by the Users and Roles views instead of their editors while FireCMS
+ * PRO is paused. The user management plugin itself stays mounted, so sign-in
+ * and role checks keep working; only editing users and roles is paused.
+ */
+export function UserManagementPausedNotice() {
+    const { t } = useTranslation();
+    const licenseStatus = useLicenseStatus();
+    const linkLabel = licenseStatus?.licenseState === "invalid_project"
+        ? t("license_add_project_to_license")
+        : licenseStatus?.licenseState === "over_quota"
+            ? t("license_update_license")
+            : t("license_get_license");
+
+    return (
+        <Paper
+            className={"flex flex-col items-start px-4 py-6 bg-white dark:bg-surface-accent-800 gap-2"}>
+            <Typography variant={"subtitle2"} className={"uppercase"}>
+                {t("pro_features_paused")}
+            </Typography>
+            <Typography>
+                {t("user_management_paused_description")}
+            </Typography>
+            <Button
+                component={"a"}
+                href={getLicenseSubscribeUrl(licenseStatus)}
+                target={"_blank"}
+                rel={"noopener noreferrer"}>
+                {linkLabel}
+            </Button>
+        </Paper>
+    );
+}

package/src/components/roles/RolesView.tsx

@@ -1,14 +1,16 @@
 import React, { useCallback, useState } from "react";
 
-import { Role, useNavigationController, useTranslation
+import { isProPaused, Role, useLicenseStatus, useNavigationController, useTranslation
 } from "@firecms/core";
 import { AddIcon, Button, Container, Typography } from "@firecms/ui";
 import { RolesTable } from "./RolesTable";
 import { RolesDetailsForm } from "./RolesDetailsForm";
+import { UserManagementPausedNotice } from "../UserManagementPausedNotice";
 
 export const RolesView = React.memo(
     function RolesView({ children }: { children?: React.ReactNode }) {
     const { t } = useTranslation();
+    const paused = isProPaused(useLicenseStatus());
 
 
         const { collections } = useNavigationController();
@@ -25,6 +27,18 @@ export const RolesView = React.memo(
             setDialogOpen(false);
         };
 
+        if (paused) {
+            return (
+                <Container className="w-full flex flex-col py-4 gap-4" maxWidth={"6xl"}>
+                    {children}
+                    <Typography gutterBottom variant="h4"
+                                className="mt-12"
+                                component="h4">{t("roles")}</Typography>
+                    <UserManagementPausedNotice/>
+                </Container>
+            );
+        }
+
         return (
             <Container className="w-full flex flex-col py-4 gap-4" maxWidth={"6xl"}>
 

package/src/components/users/UsersTable.tsx

@@ -1,13 +1,13 @@
 import { useState } from "react";
 
 import { format } from "date-fns";
-import * as locales from "date-fns/locale";
 
 import {
     defaultDateFormat,
     ConfirmationDialog, Role,
     useAuthController,
     useCustomizationController, User,
+    useDateFnsLocale,
     useSnackbarController,
     useTranslation
 } from "@firecms/core";
@@ -44,7 +44,7 @@ export function UsersTable({ onUserClicked }: {
     const snackbarController = useSnackbarController();
 
     const customizationController = useCustomizationController();
-    const dateUtilsLocale = customizationController?.locale ? locales[customizationController?.locale as keyof typeof locales] : undefined;
+    const dateUtilsLocale = useDateFnsLocale(customizationController?.locale);
     const dateFormat: string = customizationController?.dateTimeFormat ?? defaultDateFormat;
 
     const [userToBeDeleted, setUserToBeDeleted] = useState<User | undefined>(undefined);

package/src/components/users/UsersView.tsx

@@ -4,11 +4,13 @@ import { UsersTable } from "./UsersTable";
 import { UserDetailsForm } from "./UserDetailsForm";
 import React, { useCallback, useState } from "react";
 import { useUserManagement } from "../../hooks/useUserManagement";
-import { User, useTranslation
+import { isProPaused, useLicenseStatus, User, useTranslation
 } from "@firecms/core";
+import { UserManagementPausedNotice } from "../UserManagementPausedNotice";
 
 export const UsersView = function UsersView({ children }: { children?: React.ReactNode }) {
     const { t } = useTranslation();
+    const paused = isProPaused(useLicenseStatus());
 
 
     const [dialogOpen, setDialogOpen] = useState<boolean>(false);
@@ -33,6 +35,18 @@ export const UsersView = function UsersView({ children }: { children?: React.Rea
         setDialogOpen(true);
     }, []);
 
+    if (paused) {
+        return (
+            <Container className="w-full flex flex-col py-4 gap-4" maxWidth={"6xl"}>
+                {children}
+                <Typography gutterBottom variant="h4"
+                            className="mt-12"
+                            component="h4">{t("users")}</Typography>
+                <UserManagementPausedNotice/>
+            </Container>
+        );
+    }
+
     return (
         <Container className="w-full flex flex-col py-4 gap-4" maxWidth={"6xl"}>
 

package/src/useUserManagementPlugin.tsx

@@ -1,4 +1,12 @@
-import { FireCMSPlugin, useAuthController, User, useSnackbarController, useTranslation } from "@firecms/core";
+import {
+    FireCMSPlugin,
+    isProPaused,
+    useAuthController,
+    useLicenseStatus,
+    User,
+    useSnackbarController,
+    useTranslation
+} from "@firecms/core";
 import { UserManagementProvider } from "./UserManagementProvider";
 import { UserManagement } from "./types";
 import { AddIcon, Button, Paper, Typography } from "@firecms/ui";
@@ -47,6 +55,12 @@ export function IntroWidget({
     const authController = useAuthController();
     const snackbarController = useSnackbarController();
     const { t } = useTranslation();
+    const licenseStatus = useLicenseStatus();
+
+    // Creating roles and users is paused with PRO; the Users and Roles views
+    // say so. The plugin itself stays mounted for sign-in and role checks.
+    if (isProPaused(licenseStatus))
+        return null;
 
     const buttonLabel = noUsers && noRoles
         ? t("create_default_roles_and_add_admin")