@appcorp/fusion-storybook 0.5.1 → 0.5.4

package/base-modules/workspace-user/context.js

@@ -32,7 +32,7 @@ import { workspaceUserFormValidation } from "./validate";
 import { generateThemeToast, TOAST_VARIANT, } from "@appcorp/shadcn/lib/toast-utils";
 import { useTranslations } from "next-intl";
 import { getCachedWorkspaceSync } from "../workspace/cache";
-import { Eye, Filter, Plus } from "lucide-react";
+import { Eye, Filter, Pencil, Plus, Trash2 } from "lucide-react";
 // ============================================================================
 // 1.1 DRAWER TYPES
 // ============================================================================
@@ -69,6 +69,7 @@ const workspaceUserConfig = {
         workspaceId: "",
         // Relations (populated from byId fetch)
         role: undefined,
+        user: undefined,
         workspace: undefined,
     },
     drawerTypes: DRAWER_TYPES,
@@ -108,8 +109,16 @@ export const useWorkspaceUserModule = () => {
         id: state.id,
         roleId: state.roleId,
         userId: state.userId,
-        workspaceId: workspace === null || workspace === void 0 ? void 0 : workspace.id,
-    }), [state.enabled, state.id, state.roleId, state.userId, workspace === null || workspace === void 0 ? void 0 : workspace.id]);
+        // The form field is read-only; the cached workspace is the source of truth.
+        workspaceId: state.workspaceId || (workspace === null || workspace === void 0 ? void 0 : workspace.id),
+    }), [
+        state.enabled,
+        state.id,
+        state.roleId,
+        state.userId,
+        state.workspaceId,
+        workspace === null || workspace === void 0 ? void 0 : workspace.id,
+    ]);
     const byIdParams = useMemo(() => ({ id: state.id }), [state.id]);
     const deleteParams = useMemo(() => ({ id: state.id }), [state.id]);
     // ============================================================================
@@ -150,17 +159,17 @@ export const useWorkspaceUserModule = () => {
             payload: {
                 form: {
                     enabled: true,
-                    filterEnabled: undefined,
                     id: "",
                     roleId: null,
                     userId: "",
-                    workspaceId: "",
+                    workspaceId: (workspace === null || workspace === void 0 ? void 0 : workspace.id) || "",
                     role: undefined,
+                    user: undefined,
                     workspace: undefined,
                 },
             },
         });
-    }, [dispatch]);
+    }, [dispatch, workspace === null || workspace === void 0 ? void 0 : workspace.id]);
     // ============================================================================
     // 1.4.4 API CALLBACKS
     // ============================================================================
@@ -181,7 +190,6 @@ export const useWorkspaceUserModule = () => {
         }
     }, [dispatch, showToast, t]);
     const updateCallback = useCallback(({ data, error }) => {
-        var _a;
         const isCreated = isCreatedOrUpdated(data);
         if (error) {
             showToast(isCreated
@@ -191,7 +199,6 @@ export const useWorkspaceUserModule = () => {
         }
         if (data) {
             showToast(t("messagesWorkspaceUserSaved"), TOAST_VARIANT.SUCCESS);
-            (_a = listFetchNowRef.current) === null || _a === void 0 ? void 0 : _a.call(listFetchNowRef);
             resetFormAndCloseDrawer();
         }
     }, [resetFormAndCloseDrawer, showToast, t]);
@@ -203,25 +210,25 @@ export const useWorkspaceUserModule = () => {
         if (data) {
             dispatch({
                 type: WORKSPACE_USER_ACTION_TYPES.SET_FORM_DATA,
-                payload: { form: Object.assign(Object.assign({}, data), { filterEnabled: undefined }) },
+                payload: { form: data },
             });
         }
     }, [dispatch, showToast, t]);
     const deleteCallback = useCallback(({ data, error }) => {
-        var _a;
         if (error) {
             showToast(t("messagesWorkspaceUserDeleteFailed"), TOAST_VARIANT.ERROR);
             return;
         }
         if (data) {
             showToast(t("messagesWorkspaceUserDeleted"), TOAST_VARIANT.SUCCESS);
-            (_a = listFetchNowRef.current) === null || _a === void 0 ? void 0 : _a.call(listFetchNowRef);
+            resetRecordFormState();
+            resetFormAndCloseDrawer();
         }
-    }, [showToast, t]);
+    }, [resetFormAndCloseDrawer, resetRecordFormState, showToast, t]);
     // ============================================================================
     // 1.4.5 API HOOKS
     // ============================================================================
-    const { listFetchNow, listLoading, updateFetchNow, updateLoading, deleteFetchNow, deleteLoading, byIdLoading, } = useModuleEntityV2({
+    const { listFetchNow, listLoading, updateFetchNow, updateLoading, deleteFetchNow, deleteLoading, byIdFetchNow, byIdLoading, } = useModuleEntityV2({
         byIdCallback,
         byIdParams,
         deleteCallback,
@@ -248,9 +255,18 @@ export const useWorkspaceUserModule = () => {
     const handleChange = useCallback((field, value) => {
         dispatch({
             type: WORKSPACE_USER_ACTION_TYPES.SET_INPUT_FIELD,
-            payload: { field, value },
+            payload: { key: field, value },
         });
-    }, [dispatch]);
+        // A retried field must not keep blocking the Save button.
+        if (state.errors[field]) {
+            const nextErrors = Object.assign({}, state.errors);
+            delete nextErrors[field];
+            dispatch({
+                type: WORKSPACE_USER_ACTION_TYPES.SET_ERRORS,
+                payload: { errors: nextErrors },
+            });
+        }
+    }, [dispatch, state.errors]);
     const handleFilters = useCallback(() => {
         dispatch({
             type: WORKSPACE_USER_ACTION_TYPES.SET_DRAWER,
@@ -260,15 +276,16 @@ export const useWorkspaceUserModule = () => {
     const handleMoreActions = useCallback(() => {
         dispatch({
             type: WORKSPACE_USER_ACTION_TYPES.SET_DRAWER,
-            payload: { drawer: WORKSPACE_USER_DRAWER.FORM_DRAWER },
+            payload: { drawer: WORKSPACE_USER_DRAWER.MORE_ACTIONS_DRAWER },
         });
     }, [dispatch]);
-    const handleView = useCallback(() => {
+    const handleView = useCallback((row) => {
+        byIdFetchNow === null || byIdFetchNow === void 0 ? void 0 : byIdFetchNow(undefined, { params: { id: row === null || row === void 0 ? void 0 : row.id } });
         dispatch({
             type: WORKSPACE_USER_ACTION_TYPES.SET_DRAWER,
             payload: { drawer: WORKSPACE_USER_DRAWER.VIEW_DRAWER },
         });
-    }, [dispatch]);
+    }, [byIdFetchNow, dispatch]);
     const handleSearch = useCallback((query) => {
         dispatch({
             type: WORKSPACE_USER_ACTION_TYPES.SET_SEARCH_QUERY,
@@ -299,14 +316,49 @@ export const useWorkspaceUserModule = () => {
         });
     }, [dispatch]);
     const handleDelete = useCallback((row) => {
-        if (row === null || row === void 0 ? void 0 : row.id) {
-            deleteFetchNow === null || deleteFetchNow === void 0 ? void 0 : deleteFetchNow(undefined, {
-                body: JSON.stringify({ id: row.id }),
-            });
-        }
-    }, [deleteFetchNow]);
-    const handleCreate = useCallback(() => { }, []);
-    const handleEdit = useCallback(() => { }, []);
+        if (!(row === null || row === void 0 ? void 0 : row.id))
+            return;
+        if (!confirm(t("messagesDeleteConfirmation")))
+            return;
+        deleteFetchNow === null || deleteFetchNow === void 0 ? void 0 : deleteFetchNow(undefined, {
+            body: JSON.stringify({ id: row.id }),
+        });
+    }, [deleteFetchNow, t]);
+    const handleCreate = useCallback(() => {
+        resetRecordFormState();
+        dispatch({
+            type: WORKSPACE_USER_ACTION_TYPES.SET_DRAWER,
+            payload: { drawer: WORKSPACE_USER_DRAWER.FORM_DRAWER },
+        });
+    }, [dispatch, resetRecordFormState]);
+    const handleEdit = useCallback((row) => {
+        var _a, _b, _c, _d, _e;
+        if (!(row === null || row === void 0 ? void 0 : row.id))
+            return;
+        // Seed the form from the row so Save is never sent against a stale id,
+        // then refresh the full record (relations) from the API.
+        dispatch({
+            type: WORKSPACE_USER_ACTION_TYPES.SET_FORM_DATA,
+            payload: {
+                form: {
+                    enabled: (_a = row.enabled) !== null && _a !== void 0 ? _a : true,
+                    id: row.id,
+                    roleId: (_b = row.roleId) !== null && _b !== void 0 ? _b : null,
+                    userId: (_c = row.userId) !== null && _c !== void 0 ? _c : "",
+                    workspaceId: (_e = (_d = row.workspaceId) !== null && _d !== void 0 ? _d : workspace === null || workspace === void 0 ? void 0 : workspace.id) !== null && _e !== void 0 ? _e : "",
+                },
+            },
+        });
+        dispatch({
+            type: WORKSPACE_USER_ACTION_TYPES.SET_ERRORS,
+            payload: { errors: {} },
+        });
+        byIdFetchNow === null || byIdFetchNow === void 0 ? void 0 : byIdFetchNow(undefined, { params: { id: row.id } });
+        dispatch({
+            type: WORKSPACE_USER_ACTION_TYPES.SET_DRAWER,
+            payload: { drawer: WORKSPACE_USER_DRAWER.FORM_DRAWER },
+        });
+    }, [byIdFetchNow, dispatch, workspace === null || workspace === void 0 ? void 0 : workspace.id]);
     const handlePageChange = useCallback((page) => {
         const nextPage = typeof page === "number" ? page : state.currentPage + 1;
         dispatch({
@@ -358,20 +410,20 @@ export const useWorkspaceUserModule = () => {
     // ============================================================================
     const headerActions = useMemo(() => [
         {
-            enabled: false,
+            enabled: true,
             handleOnClick: handleFilters,
             label: t("actionsButtonFilters"),
             order: 1,
             icon: Filter,
         },
         {
-            enabled: false,
-            handleOnClick: handleMoreActions,
-            label: t("actionsButtonMoreActions"),
+            enabled: true,
+            handleOnClick: handleCreate,
+            label: t("actionsButtonAdd"),
             order: 2,
             icon: Plus,
         },
-    ], [handleFilters, handleMoreActions, t]);
+    ], [handleCreate, handleFilters, t]);
     const rowActions = useMemo(() => [
         {
             enabled: true,
@@ -380,7 +432,22 @@ export const useWorkspaceUserModule = () => {
             order: 1,
             icon: Eye,
         },
-    ], [handleView, t]);
+        {
+            enabled: true,
+            handleOnClick: handleEdit,
+            label: t("actionsButtonEdit"),
+            order: 2,
+            icon: Pencil,
+        },
+        {
+            enabled: true,
+            handleOnClick: handleDelete,
+            label: t("actionsButtonDelete"),
+            order: 3,
+            icon: Trash2,
+            variant: "destructive",
+        },
+    ], [handleDelete, handleEdit, handleView, t]);
     // ============================================================================
     // 1.4.9 EFFECTS
     // ============================================================================

package/base-modules/workspace-user/form.js

@@ -2,12 +2,70 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { EnhancedInput } from "@appcorp/shadcn/components/enhanced-input";
 import { EnhancedCheckbox } from "@appcorp/shadcn/components/enhanced-checkbox";
+import { useEnhancedCombobox } from "@appcorp/shadcn/hooks/use-enhanced-combobox";
 import { useWorkspaceUserModule } from "./context";
 import { useTranslations } from "next-intl";
 import { getTranslatedError } from "../../utils/get-translated-error";
+import { getCachedWorkspaceSync } from "../workspace/cache";
+import { RBAC_API_ROUTES, USER_API_ROUTES } from "../../constants";
 export const WorkspaceUserForm = () => {
+    var _a;
     const { state, handleChange } = useWorkspaceUserModule();
     const { enabled, errors, roleId, userId, workspaceId } = state;
     const t = useTranslations("workspaceUser");
-    return (_jsx("div", { className: "space-y-4", children: _jsxs("div", { className: "space-y-4", children: [_jsx("h3", { className: "text-lg font-semibold", children: t("formSectionWorkspaceUserInformation") }), _jsxs("div", { className: "grid grid-cols-1 gap-4", children: [_jsx(EnhancedInput, { error: getTranslatedError({ errors, key: "workspaceId", t }), id: "workspaceId", info: t("formWorkspaceIdInfo"), label: t("formWorkspaceIdLabel"), onChange: (e) => handleChange("workspaceId", e.target.value), placeholder: t("formWorkspaceIdPlaceholder"), required: true, value: workspaceId }), _jsx(EnhancedInput, { error: getTranslatedError({ errors, key: "userId", t }), id: "userId", info: t("formUserIdInfo"), label: t("formUserIdLabel"), onChange: (e) => handleChange("userId", e.target.value), placeholder: t("formUserIdPlaceholder"), required: true, value: userId }), _jsx(EnhancedInput, { error: getTranslatedError({ errors, key: "roleId", t }), id: "roleId", info: t("formRoleIdInfo"), label: t("formRoleIdLabel"), onChange: (e) => handleChange("roleId", e.target.value), placeholder: t("formRoleIdPlaceholder"), value: roleId || "" })] }), _jsx(EnhancedCheckbox, { defaultChecked: enabled, label: t("badgeActive"), onCheckedChange: (checked) => handleChange("enabled", checked) })] }) }));
+    const workspace = getCachedWorkspaceSync();
+    const resolvedWorkspaceId = workspaceId || (workspace === null || workspace === void 0 ? void 0 : workspace.id) || "";
+    const workspaceLabel = ((_a = state.workspace) === null || _a === void 0 ? void 0 : _a.name) || (workspace === null || workspace === void 0 ? void 0 : workspace.name) || "";
+    const { enhancedComboboxElement: userIdCombo } = useEnhancedCombobox({
+        id: "userId",
+        error: getTranslatedError({ errors, key: "userId", t }),
+        info: t("formUserIdInfo"),
+        label: t("formUserIdLabel"),
+        onValueChange: (value) => handleChange("userId", value),
+        options: state.user
+            ? [
+                {
+                    label: state.user.name || state.user.email || state.user.id,
+                    value: state.user.id,
+                },
+            ]
+            : [],
+        placeholder: t("formUserIdPlaceholder"),
+        required: true,
+        searchEndpoint: USER_API_ROUTES.UNIT,
+        searchPlaceholder: t("formUserIdPlaceholder"),
+        emptyText: t("formNoUserFound"),
+        formatSearchResult: (item) => {
+            var _a;
+            return ({
+                label: String(item.name || item.email || item.id || ""),
+                value: String((_a = item.id) !== null && _a !== void 0 ? _a : ""),
+            });
+        },
+        value: userId,
+    });
+    const { enhancedComboboxElement: roleIdCombo } = useEnhancedCombobox({
+        id: "roleId",
+        error: getTranslatedError({ errors, key: "roleId", t }),
+        info: t("formRoleIdInfo"),
+        label: t("formRoleIdLabel"),
+        onValueChange: (value) => handleChange("roleId", value || ""),
+        options: state.role
+            ? [{ label: state.role.name || state.role.id, value: state.role.id }]
+            : [],
+        placeholder: t("formRoleIdPlaceholder"),
+        searchEndpoint: RBAC_API_ROUTES.UNIT,
+        searchParams: Object.assign(Object.assign({}, (resolvedWorkspaceId ? { workspaceId: resolvedWorkspaceId } : {})), { includeSystem: "true" }),
+        searchPlaceholder: t("formRoleIdPlaceholder"),
+        emptyText: t("formNoRoleFound"),
+        formatSearchResult: (item) => {
+            var _a;
+            return ({
+                label: String(item.name || item.userRole || item.id || ""),
+                value: String((_a = item.id) !== null && _a !== void 0 ? _a : ""),
+            });
+        },
+        value: roleId || "",
+    });
+    return (_jsx("div", { className: "space-y-4", children: _jsxs("div", { className: "space-y-4", children: [_jsx("h3", { className: "text-lg font-semibold", children: t("formSectionWorkspaceUserInformation") }), _jsxs("div", { className: "grid grid-cols-1 gap-4", children: [_jsx(EnhancedInput, { id: "workspaceId", error: getTranslatedError({ errors, key: "workspaceId", t }), info: t("formWorkspaceIdInfo"), label: t("formWorkspaceIdLabel"), onChange: (e) => handleChange("workspaceId", e.target.value), placeholder: t("formWorkspaceIdPlaceholder"), required: true, readOnly: true, value: workspaceLabel || resolvedWorkspaceId }), userIdCombo, roleIdCombo] }), _jsx(EnhancedCheckbox, { checked: enabled, label: t("badgeActive"), onCheckedChange: (checked) => handleChange("enabled", checked) })] }) }));
 };

package/base-modules/workspace-user/more-actions.js

@@ -9,8 +9,8 @@ import { useTranslations } from "next-intl";
 export const WorkspaceUserMoreActions = () => {
     const t = useTranslations("workspaceUser");
     const workspace = getCachedWorkspaceSync();
-    const handleGetAllRecords = async (schoolId) => {
-        const response = await fetch(`/api/workspace-user?pageLimit=1000&currentPage=1&schoolId=${schoolId}`, { method: API_METHODS.GET });
+    const handleGetAllRecords = async (workspaceId) => {
+        const response = await fetch(`/api/v1/workspace-user?pageLimit=1000&currentPage=1&workspaceId=${workspaceId}`, { method: API_METHODS.GET });
         const result = await response.json();
         const csv = await converter.json2csv(result.items || [], {});
         const blob = new Blob([csv], { type: "text/csv;charset=utf-8;" });
@@ -35,8 +35,7 @@ export const WorkspaceUserMoreActions = () => {
             id: "1",
             title: t("downloadPopulatedCsvTemplate"),
             handleOnClick: async () => {
-                var _a;
-                await handleGetAllRecords(((_a = workspace === null || workspace === void 0 ? void 0 : workspace.school) === null || _a === void 0 ? void 0 : _a.id) || "");
+                await handleGetAllRecords((workspace === null || workspace === void 0 ? void 0 : workspace.id) || "");
             },
         },
         { id: "2", title: t("updateYourDataInTheCsv") },

package/base-modules/workspace-user/page.js

@@ -127,10 +127,10 @@ const WorkspaceUserPageInner = (props) => {
     ]);
     const hasPermission = resolveRbacPermissions({
         userRole: props.userRole,
-        moduleName: "People Management",
+        moduleName: "Workspace User",
     });
     if (!hasPermission) {
-        return _jsx(RbacNoAccess, { moduleName: "People Management" });
+        return _jsx(RbacNoAccess, { moduleName: "Workspace User" });
     }
     return (_jsx("div", { className: "p-4", children: _jsx(GenericWorkspaceUserPage, { overrideConfig: workspaceUserConfig, context: context, tableBodyCols: tableBodyCols }) }));
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@appcorp/fusion-storybook",
-  "version": "0.5.1",
+  "version": "0.5.4",
   "scripts": {
     "build-storybook": "storybook build",
     "build:next": "next build",