pixelize-design-library 2.3.22 → 2.3.26
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Components/OrganizationDetails/CreateOrgModal.js +6 -4
- package/dist/Components/OrganizationDetails/OrganizationDetails.d.ts.map +1 -1
- package/dist/Components/OrganizationDetails/OrganizationDetails.js +56 -7
- package/dist/Components/OrganizationDetails/OrganizationDetailsProps.d.ts +29 -14
- package/dist/Components/OrganizationDetails/OrganizationDetailsProps.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -31,28 +31,30 @@ const CreateOrgModal = ({ isOpen, onClose, isLoading, onSubmit, labels, }) => {
|
|
|
31
31
|
setErrors((prev) => ({ ...prev, [key]: undefined }));
|
|
32
32
|
};
|
|
33
33
|
const validate = () => {
|
|
34
|
+
var _a, _b;
|
|
34
35
|
const next = {};
|
|
35
36
|
if (!values.company_name.trim())
|
|
36
37
|
next.company_name = labels.requiredField;
|
|
37
38
|
if (!values.company_address.trim())
|
|
38
39
|
next.company_address = labels.requiredField;
|
|
39
|
-
const digits = values.phone.replace(/\D/g, "");
|
|
40
|
-
if (!values.phone.trim()) {
|
|
40
|
+
const digits = (_a = values === null || values === void 0 ? void 0 : values.phone) === null || _a === void 0 ? void 0 : _a.replace(/\D/g, "");
|
|
41
|
+
if (!((_b = values === null || values === void 0 ? void 0 : values.phone) === null || _b === void 0 ? void 0 : _b.trim())) {
|
|
41
42
|
next.phone = labels.requiredField;
|
|
42
43
|
}
|
|
43
|
-
else if (digits.length < 8) {
|
|
44
|
+
else if (digits && (digits === null || digits === void 0 ? void 0 : digits.length) < 8) {
|
|
44
45
|
next.phone = labels.invalidPhone;
|
|
45
46
|
}
|
|
46
47
|
setErrors(next);
|
|
47
48
|
return Object.keys(next).length === 0;
|
|
48
49
|
};
|
|
49
50
|
const handleSubmit = () => {
|
|
51
|
+
var _a;
|
|
50
52
|
if (!validate())
|
|
51
53
|
return;
|
|
52
54
|
onSubmit({
|
|
53
55
|
company_name: values.company_name.trim(),
|
|
54
56
|
company_address: values.company_address.trim(),
|
|
55
|
-
phone: values.phone.trim(),
|
|
57
|
+
phone: (_a = values === null || values === void 0 ? void 0 : values.phone) === null || _a === void 0 ? void 0 : _a.trim(),
|
|
56
58
|
});
|
|
57
59
|
};
|
|
58
60
|
return ((0, jsx_runtime_1.jsxs)(react_2.Modal, { isOpen: isOpen, onClose: onClose, isCentered: true, autoFocus: false, children: [(0, jsx_runtime_1.jsx)(react_2.ModalOverlay, { backdropFilter: "blur(4px)" }), (0, jsx_runtime_1.jsxs)(react_2.ModalContent, { borderRadius: "2xl", overflow: "hidden", children: [(0, jsx_runtime_1.jsx)(react_2.ModalHeader, { borderBottom: "1px solid", borderColor: (_b = (_a = colors === null || colors === void 0 ? void 0 : colors.boxborder) === null || _a === void 0 ? void 0 : _a[200]) !== null && _b !== void 0 ? _b : (_c = colors === null || colors === void 0 ? void 0 : colors.gray) === null || _c === void 0 ? void 0 : _c[200], fontSize: "1.05rem", fontWeight: 600, children: labels.createOrganization }), (0, jsx_runtime_1.jsx)(react_2.ModalCloseButton, {}), (0, jsx_runtime_1.jsxs)(react_2.ModalBody, { py: 6, children: [(0, jsx_runtime_1.jsxs)(react_2.VStack, { spacing: 4, align: "stretch", children: [(0, jsx_runtime_1.jsx)(TextInput_1.default, { label: labels.companyName, value: values.company_name, onChange: (e) => setField("company_name", e.target.value), isRequired: true, width: "100%", placeholder: "Enter Company Name", error: !!errors.company_name, errorMessage: errors.company_name }), (0, jsx_runtime_1.jsx)(TextInput_1.default, { label: labels.companyAddress, value: values.company_address, onChange: (e) => setField("company_address", e.target.value), isRequired: true, width: "100%", placeholder: "Enter Company Address", error: !!errors.company_address, errorMessage: errors.company_address }), (0, jsx_runtime_1.jsx)(TextInput_1.default, { label: labels.phone, value: values.phone, onChange: (e) => setField("phone", e.target.value), isRequired: true, width: "100%", placeholder: "Enter Phone Number", error: !!errors.phone, errorMessage: errors.phone })] }), (0, jsx_runtime_1.jsxs)(react_2.HStack, { justifyContent: "center", spacing: 4, mt: 6, children: [(0, jsx_runtime_1.jsx)(Button_1.default, { label: labels.cancel, onClick: onClose, variant: "outline", colorScheme: "red", size: "sm" }), (0, jsx_runtime_1.jsx)(Button_1.default, { label: labels.submit, onClick: handleSubmit, colorScheme: "primary", size: "sm", isLoading: isLoading })] })] })] })] }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OrganizationDetails.d.ts","sourceRoot":"","sources":["../../../src/Components/OrganizationDetails/OrganizationDetails.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"OrganizationDetails.d.ts","sourceRoot":"","sources":["../../../src/Components/OrganizationDetails/OrganizationDetails.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAoCjD,OAAO,EAEL,wBAAwB,EAEzB,MAAM,4BAA4B,CAAC;AAwCpC,QAAA,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,CAof3D,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
|
|
@@ -30,6 +30,10 @@ const DEFAULT_LABELS = {
|
|
|
30
30
|
deleteOrganization: "Delete Organization",
|
|
31
31
|
protectedOrganization: "Protected organization",
|
|
32
32
|
delete: "Delete",
|
|
33
|
+
editOrganization: "Edit organization name",
|
|
34
|
+
save: "Save",
|
|
35
|
+
saving: "Saving...",
|
|
36
|
+
emptyNameError: "Organization name cannot be empty",
|
|
33
37
|
noOrganizationsTitle: "No organizations found",
|
|
34
38
|
noOrganizationsDescription: "Get started by creating your first organization or wait for an invitation",
|
|
35
39
|
companyName: "Company Name",
|
|
@@ -44,12 +48,16 @@ const DEFAULT_LABELS = {
|
|
|
44
48
|
copyright: "Pixelize Corp. All rights reserved.",
|
|
45
49
|
termsOfService: "Terms of Service",
|
|
46
50
|
};
|
|
47
|
-
const OrganizationDetails = ({ activeOrganizations, invitedOrganizations, isLoading = false, switchingOrgIds = [], respondingOrgIds = [], isCreating = false, userName, userAvatarUrl, onSetDefault, onAcceptInvite, onDeclineInvite, onDeleteOrganization, onCreateOrganization, onBack, footerSlot, labels: labelOverrides, }) => {
|
|
51
|
+
const OrganizationDetails = ({ activeOrganizations, invitedOrganizations, isLoading = false, switchingOrgIds = [], respondingOrgIds = [], editingOrgIds = [], isCreating = false, userName, userAvatarUrl, onSetDefault, onAcceptInvite, onDeclineInvite, onDeleteOrganization, onCreateOrganization, onEditOrganization, onBack, footerSlot, labels: labelOverrides, }) => {
|
|
48
52
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y;
|
|
49
53
|
const { colors } = (0, useCustomTheme_1.useCustomTheme)();
|
|
50
54
|
const labels = (0, react_1.useMemo)(() => ({ ...DEFAULT_LABELS, ...labelOverrides }), [labelOverrides]);
|
|
51
55
|
const [isCreateOpen, setCreateOpen] = (0, react_1.useState)(false);
|
|
52
56
|
const [deleteOrgId, setDeleteOrgId] = (0, react_1.useState)(null);
|
|
57
|
+
// --- Inline "edit organization name" state ---
|
|
58
|
+
const [editingOrgId, setEditingOrgId] = (0, react_1.useState)(null);
|
|
59
|
+
const [editValue, setEditValue] = (0, react_1.useState)("");
|
|
60
|
+
const [editError, setEditError] = (0, react_1.useState)("");
|
|
53
61
|
const border = (_d = (_b = (_a = colors === null || colors === void 0 ? void 0 : colors.boxborder) === null || _a === void 0 ? void 0 : _a[200]) !== null && _b !== void 0 ? _b : (_c = colors === null || colors === void 0 ? void 0 : colors.gray) === null || _c === void 0 ? void 0 : _c[200]) !== null && _d !== void 0 ? _d : "#E2E8F0";
|
|
54
62
|
const surface = (_e = colors === null || colors === void 0 ? void 0 : colors.white) !== null && _e !== void 0 ? _e : "#FFFFFF";
|
|
55
63
|
const muted = (_g = (_f = colors === null || colors === void 0 ? void 0 : colors.gray) === null || _f === void 0 ? void 0 : _f[500]) !== null && _g !== void 0 ? _g : "#64748B";
|
|
@@ -68,18 +76,57 @@ const OrganizationDetails = ({ activeOrganizations, invitedOrganizations, isLoad
|
|
|
68
76
|
boxShadow: "0 1px 2px rgba(16,24,40,0.05)",
|
|
69
77
|
};
|
|
70
78
|
const sectionBadge = (count, scheme) => ((0, jsx_runtime_1.jsx)(react_2.Badge, { colorScheme: scheme, variant: "subtle", borderRadius: "full", px: 2, py: 0.5, fontSize: "0.65rem", children: count }));
|
|
79
|
+
const startEditing = (item) => {
|
|
80
|
+
setEditingOrgId(item.orgId);
|
|
81
|
+
setEditValue(item.company_name);
|
|
82
|
+
setEditError("");
|
|
83
|
+
};
|
|
84
|
+
const cancelEditing = () => {
|
|
85
|
+
setEditingOrgId(null);
|
|
86
|
+
setEditValue("");
|
|
87
|
+
setEditError("");
|
|
88
|
+
};
|
|
89
|
+
const submitEditing = async (item) => {
|
|
90
|
+
const trimmed = editValue.trim();
|
|
91
|
+
if (!trimmed) {
|
|
92
|
+
setEditError(labels.emptyNameError);
|
|
93
|
+
return;
|
|
94
|
+
}
|
|
95
|
+
if (trimmed === item.company_name) {
|
|
96
|
+
cancelEditing();
|
|
97
|
+
return;
|
|
98
|
+
}
|
|
99
|
+
await (onEditOrganization === null || onEditOrganization === void 0 ? void 0 : onEditOrganization(item.orgId, trimmed));
|
|
100
|
+
setEditingOrgId(null);
|
|
101
|
+
setEditValue("");
|
|
102
|
+
setEditError("");
|
|
103
|
+
};
|
|
71
104
|
const renderActiveCard = (item) => {
|
|
72
|
-
var _a, _b, _c, _d, _e, _f;
|
|
105
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
73
106
|
const isSwitching = switchingOrgIds.includes(item.orgId);
|
|
74
107
|
const isProtected = item.defaultOrg === 1;
|
|
108
|
+
const canEdit = item.roleName === "Super Admin";
|
|
109
|
+
const isEditingThis = canEdit && editingOrgId === item.orgId;
|
|
110
|
+
const isSavingThis = editingOrgIds.includes(item.orgId);
|
|
75
111
|
return ((0, jsx_runtime_1.jsxs)(react_2.Box, { ...cardSx, p: 3, position: "relative", transition: "all 0.2s ease", _hover: {
|
|
76
112
|
borderColor: (_b = (_a = colors === null || colors === void 0 ? void 0 : colors.primary) === null || _a === void 0 ? void 0 : _a[300]) !== null && _b !== void 0 ? _b : "#A5B4FC",
|
|
77
113
|
boxShadow: "0 8px 24px rgba(16,24,40,0.10)",
|
|
78
114
|
transform: "translateY(-3px)",
|
|
79
|
-
}, children: [(0, jsx_runtime_1.jsxs)(react_2.Flex, { justifyContent: "space-between", alignItems: "
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
115
|
+
}, children: [(0, jsx_runtime_1.jsxs)(react_2.Flex, { justifyContent: "space-between", alignItems: "center", mb: 2, children: [(0, jsx_runtime_1.jsx)(react_2.Flex, { align: "center", justify: "center", boxSize: "36px", borderRadius: "lg", bg: primary50, color: primary600, children: (0, jsx_runtime_1.jsx)(lucide_react_1.Building2, { size: 18 }) }), (0, jsx_runtime_1.jsxs)(react_2.HStack, { spacing: 1, children: [item.default === 1 ? ((0, jsx_runtime_1.jsxs)(react_2.Badge, { colorScheme: "green", borderRadius: "full", px: 2, py: 0.5, display: "flex", alignItems: "center", gap: 1, fontSize: "0.7rem", fontWeight: 600, children: [(0, jsx_runtime_1.jsx)(lucide_react_1.CheckCircle2, { size: 12 }), labels.default] })) : isSwitching ? ((0, jsx_runtime_1.jsxs)(react_2.Flex, { align: "center", gap: 2, color: primary500, children: [(0, jsx_runtime_1.jsx)(react_2.Spinner, { size: "sm" }), (0, jsx_runtime_1.jsx)(react_2.Text, { fontSize: "xs", children: labels.settingDefault })] })) : ((0, jsx_runtime_1.jsxs)(react_2.Flex, { align: "center", gap: 1, fontSize: "xs", color: primary600, fontWeight: 600, cursor: "pointer", _hover: { color: primary500, gap: 2 }, transition: "all 0.2s ease", onClick: () => onSetDefault === null || onSetDefault === void 0 ? void 0 : onSetDefault(item.orgId), children: [(0, jsx_runtime_1.jsx)(lucide_react_1.CheckCircle2, { size: 12 }), (0, jsx_runtime_1.jsx)(react_2.Text, { children: labels.setAsDefault })] })), canEdit && ((0, jsx_runtime_1.jsx)(react_2.Tooltip, { label: labels.editOrganization, hasArrow: true, children: (0, jsx_runtime_1.jsx)(react_2.IconButton, { "aria-label": labels.editOrganization, icon: (0, jsx_runtime_1.jsx)(lucide_react_1.Pencil, { size: 12 }), size: "xs", variant: "ghost", color: muted, borderRadius: "full", _hover: { color: primary600, bg: primary50 }, onClick: () => startEditing(item) }) })), (0, jsx_runtime_1.jsx)(react_2.Tooltip, { label: isProtected
|
|
116
|
+
? labels.protectedOrganization
|
|
117
|
+
: labels.deleteOrganization, hasArrow: true, children: (0, jsx_runtime_1.jsx)(react_2.IconButton, { "aria-label": labels.deleteOrganization, icon: (0, jsx_runtime_1.jsx)(lucide_react_1.Trash2, { size: 12 }), size: "xs", variant: "ghost", borderRadius: "full", color: muted, isDisabled: isProtected, _hover: {
|
|
118
|
+
bg: (_d = (_c = colors === null || colors === void 0 ? void 0 : colors.red) === null || _c === void 0 ? void 0 : _c[50]) !== null && _d !== void 0 ? _d : "#FEF2F2",
|
|
119
|
+
color: (_f = (_e = colors === null || colors === void 0 ? void 0 : colors.red) === null || _e === void 0 ? void 0 : _e[600]) !== null && _f !== void 0 ? _f : "#DC2626",
|
|
120
|
+
}, onClick: () => setDeleteOrgId(item.orgId) }) })] })] }), isEditingThis ? ((0, jsx_runtime_1.jsxs)(react_2.Box, { children: [(0, jsx_runtime_1.jsxs)(react_2.HStack, { spacing: 1, children: [(0, jsx_runtime_1.jsx)(react_2.Input, { value: editValue, onChange: (e) => {
|
|
121
|
+
setEditValue(e.target.value);
|
|
122
|
+
if (editError)
|
|
123
|
+
setEditError("");
|
|
124
|
+
}, size: "sm", fontSize: "sm", fontWeight: 700, autoFocus: true, isDisabled: isSavingThis, onKeyDown: (e) => {
|
|
125
|
+
if (e.key === "Enter")
|
|
126
|
+
submitEditing(item);
|
|
127
|
+
if (e.key === "Escape")
|
|
128
|
+
cancelEditing();
|
|
129
|
+
} }), (0, jsx_runtime_1.jsx)(react_2.IconButton, { "aria-label": labels.save, icon: isSavingThis ? (0, jsx_runtime_1.jsx)(react_2.Spinner, { size: "xs" }) : (0, jsx_runtime_1.jsx)(lucide_react_1.Check, { size: 14 }), size: "xs", colorScheme: "green", isDisabled: isSavingThis, onClick: () => submitEditing(item), variant: "ghost" }), (0, jsx_runtime_1.jsx)(react_2.IconButton, { "aria-label": labels.cancel, icon: (0, jsx_runtime_1.jsx)(lucide_react_1.X, { size: 14 }), size: "xs", variant: "ghost", isDisabled: isSavingThis, onClick: cancelEditing })] }), editError && ((0, jsx_runtime_1.jsx)(react_2.Text, { fontSize: "0.7rem", color: (_h = (_g = colors === null || colors === void 0 ? void 0 : colors.red) === null || _g === void 0 ? void 0 : _g[600]) !== null && _h !== void 0 ? _h : "#DC2626", mt: 1, children: editError }))] })) : ((0, jsx_runtime_1.jsx)(react_2.Text, { fontSize: "sm", fontWeight: 700, color: heading, noOfLines: 1, children: item.company_name }))] }, item.orgId));
|
|
83
130
|
};
|
|
84
131
|
const renderInvitedCard = (item) => {
|
|
85
132
|
var _a, _b, _c, _d;
|
|
@@ -100,7 +147,9 @@ const OrganizationDetails = ({ activeOrganizations, invitedOrganizations, isLoad
|
|
|
100
147
|
width: "100%",
|
|
101
148
|
};
|
|
102
149
|
const hasOrganizations = activeOrganizations.length > 0 || invitedOrganizations.length > 0;
|
|
103
|
-
return ((0, jsx_runtime_1.jsxs)(react_2.Box, { backgroundColor: pageBg, minHeight: "100%", p: { base: 2, md: 3 }, children: [(0, jsx_runtime_1.jsxs)(react_2.Flex, { ...cardSx, px: 3, py: 2.5, mb: 3, alignItems: "center", justifyContent: "space-between", flexWrap: "wrap", gap: 3, bgGradient: `linear(135deg, ${primary50} 0%, ${primary100} 100%)`, children: [(0, jsx_runtime_1.jsxs)(react_2.Flex, { alignItems: "center", gap: 3, children: [onBack && ((0, jsx_runtime_1.jsx)(react_2.IconButton, { "aria-label": "Go back", icon: (0, jsx_runtime_1.jsx)(lucide_react_1.ArrowLeft, { size: 18 }), variant: "ghost", size: "sm", color: subtle, onClick: onBack })), (0, jsx_runtime_1.jsx)(react_2.Flex, { align: "center", justify: "center", boxSize: "36px", borderRadius: "full", bg: primary500, color: "white", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Building2, { size: 18 }) }), (0, jsx_runtime_1.jsxs)(react_2.Box, { children: [(0, jsx_runtime_1.jsxs)(react_2.HStack, { spacing: 2, children: [(0, jsx_runtime_1.jsx)(react_2.Heading, { size: "sm", color: heading, fontWeight: 700, children: userName
|
|
150
|
+
return ((0, jsx_runtime_1.jsxs)(react_2.Box, { backgroundColor: pageBg, minHeight: "100%", p: { base: 2, md: 3 }, children: [(0, jsx_runtime_1.jsxs)(react_2.Flex, { ...cardSx, px: 3, py: 2.5, mb: 3, alignItems: "center", justifyContent: "space-between", flexWrap: "wrap", gap: 3, bgGradient: `linear(135deg, ${primary50} 0%, ${primary100} 100%)`, children: [(0, jsx_runtime_1.jsxs)(react_2.Flex, { alignItems: "center", gap: 3, children: [onBack && ((0, jsx_runtime_1.jsx)(react_2.IconButton, { "aria-label": "Go back", icon: (0, jsx_runtime_1.jsx)(lucide_react_1.ArrowLeft, { size: 18 }), variant: "ghost", size: "sm", color: subtle, onClick: onBack })), (0, jsx_runtime_1.jsx)(react_2.Flex, { align: "center", justify: "center", boxSize: "36px", borderRadius: "full", bg: primary500, color: "white", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Building2, { size: 18 }) }), (0, jsx_runtime_1.jsxs)(react_2.Box, { children: [(0, jsx_runtime_1.jsxs)(react_2.HStack, { spacing: 2, children: [(0, jsx_runtime_1.jsx)(react_2.Heading, { size: "sm", color: heading, fontWeight: 700, children: userName
|
|
151
|
+
? `${labels.greeting.replace(/User!?/, "")}${userName}!`.trim()
|
|
152
|
+
: labels.greeting }), (0, jsx_runtime_1.jsx)(react_2.Avatar, { size: "xs", name: userName, src: userAvatarUrl })] }), (0, jsx_runtime_1.jsx)(react_2.Text, { fontSize: "xs", color: subtle, mt: 0.5, children: labels.manageSubtitle })] })] }), (0, jsx_runtime_1.jsx)(Button_1.default, { label: labels.createNewOrganization, onClick: () => setCreateOpen(true), leftIcon: (0, jsx_runtime_1.jsx)(lucide_react_1.Plus, { size: 16 }), colorScheme: "primary", size: "sm" })] }), isLoading ? ((0, jsx_runtime_1.jsx)(react_2.Box, { ...gridSx, children: Array.from({ length: 6 }).map((_, idx) => ((0, jsx_runtime_1.jsxs)(react_2.Box, { ...cardSx, p: 3, children: [(0, jsx_runtime_1.jsx)(react_2.Skeleton, { boxSize: "36px", borderRadius: "lg", mb: 2 }), (0, jsx_runtime_1.jsx)(react_2.SkeletonText, { noOfLines: 2, spacing: 2 })] }, idx))) })) : !hasOrganizations ? ((0, jsx_runtime_1.jsx)(EmptyState_1.default, { icon: lucide_react_1.Building2, title: labels.noOrganizationsTitle, description: labels.noOrganizationsDescription, minH: "40vh", action: (0, jsx_runtime_1.jsx)(Button_1.default, { label: labels.createOrganization, onClick: () => setCreateOpen(true), leftIcon: (0, jsx_runtime_1.jsx)(lucide_react_1.Plus, { size: 16 }), colorScheme: "primary", size: "sm" }) })) : ((0, jsx_runtime_1.jsxs)(react_2.VStack, { align: "stretch", spacing: 4, children: [activeOrganizations.length > 0 && ((0, jsx_runtime_1.jsxs)(react_2.Box, { children: [(0, jsx_runtime_1.jsxs)(react_2.Flex, { align: "center", gap: 2, mb: 2, children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Users, { size: 16, color: primary500 }), (0, jsx_runtime_1.jsx)(react_2.Heading, { size: "sm", color: heading, fontWeight: 600, children: labels.activeOrganizations }), sectionBadge(activeOrganizations.length, "blue")] }), (0, jsx_runtime_1.jsx)(react_2.Box, { ...gridSx, children: activeOrganizations.map(renderActiveCard) })] })), invitedOrganizations.length > 0 && ((0, jsx_runtime_1.jsxs)(react_2.Box, { children: [(0, jsx_runtime_1.jsxs)(react_2.Flex, { align: "center", gap: 2, mb: 2, children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Mail, { size: 16, color: (_y = (_x = colors === null || colors === void 0 ? void 0 : colors.yellow) === null || _x === void 0 ? void 0 : _x[500]) !== null && _y !== void 0 ? _y : "#EAB308" }), (0, jsx_runtime_1.jsx)(react_2.Heading, { size: "sm", color: heading, fontWeight: 600, children: labels.invitedOrganizations }), sectionBadge(invitedOrganizations.length, "yellow")] }), (0, jsx_runtime_1.jsx)(react_2.Box, { ...gridSx, children: invitedOrganizations.map(renderInvitedCard) })] }))] })), footerSlot, (0, jsx_runtime_1.jsx)(CreateOrgModal_1.default, { isOpen: isCreateOpen, onClose: () => setCreateOpen(false), isLoading: isCreating, onSubmit: async (values) => {
|
|
104
153
|
await (onCreateOrganization === null || onCreateOrganization === void 0 ? void 0 : onCreateOrganization(values));
|
|
105
154
|
setCreateOpen(false);
|
|
106
155
|
}, labels: labels }), (0, jsx_runtime_1.jsx)(DeleteOrgModal_1.default, { isOpen: deleteOrgId !== null, onClose: () => setDeleteOrgId(null), onConfirm: async () => {
|
|
@@ -2,23 +2,22 @@ import { ReactNode } from "react";
|
|
|
2
2
|
export type OrganizationItem = {
|
|
3
3
|
orgId: number;
|
|
4
4
|
company_name: string;
|
|
5
|
-
company_url
|
|
5
|
+
company_url?: string;
|
|
6
6
|
/** 1 when this org is the user's default org. */
|
|
7
7
|
default: number;
|
|
8
8
|
/** 1 = active/accepted, 0 = pending invite. */
|
|
9
9
|
uiInvite: number;
|
|
10
10
|
/** 1 when the org is protected and cannot be deleted. */
|
|
11
11
|
defaultOrg: number;
|
|
12
|
+
roleName?: string;
|
|
12
13
|
};
|
|
13
14
|
export type CreateOrgFormValues = {
|
|
14
15
|
company_name: string;
|
|
15
16
|
company_address: string;
|
|
16
|
-
phone
|
|
17
|
+
phone?: string;
|
|
18
|
+
default?: number;
|
|
19
|
+
defaultOrg?: number;
|
|
17
20
|
};
|
|
18
|
-
/**
|
|
19
|
-
* All user-facing strings. Provide translated values from the host app; every
|
|
20
|
-
* key has a sensible English default so the component works standalone.
|
|
21
|
-
*/
|
|
22
21
|
export type OrganizationDetailsLabels = {
|
|
23
22
|
greeting?: string;
|
|
24
23
|
manageSubtitle?: string;
|
|
@@ -37,6 +36,10 @@ export type OrganizationDetailsLabels = {
|
|
|
37
36
|
deleteOrganization?: string;
|
|
38
37
|
protectedOrganization?: string;
|
|
39
38
|
delete?: string;
|
|
39
|
+
editOrganization?: string;
|
|
40
|
+
save?: string;
|
|
41
|
+
saving?: string;
|
|
42
|
+
emptyNameError?: string;
|
|
40
43
|
noOrganizationsTitle?: string;
|
|
41
44
|
noOrganizationsDescription?: string;
|
|
42
45
|
companyName?: string;
|
|
@@ -51,23 +54,35 @@ export type OrganizationDetailsLabels = {
|
|
|
51
54
|
copyright?: string;
|
|
52
55
|
termsOfService?: string;
|
|
53
56
|
};
|
|
57
|
+
export interface CreateOrganizationValues {
|
|
58
|
+
company_name: string;
|
|
59
|
+
company_address?: string;
|
|
60
|
+
phone?: string;
|
|
61
|
+
}
|
|
54
62
|
export interface OrganizationDetailsProps {
|
|
55
63
|
activeOrganizations: OrganizationItem[];
|
|
56
64
|
invitedOrganizations: OrganizationItem[];
|
|
57
65
|
isLoading?: boolean;
|
|
58
|
-
|
|
66
|
+
isCreating?: boolean;
|
|
67
|
+
/** orgIds currently switching to default (shows a spinner on that card) */
|
|
59
68
|
switchingOrgIds?: number[];
|
|
60
|
-
/**
|
|
69
|
+
/** orgIds currently accepting/declining an invite (shows a spinner on that card) */
|
|
61
70
|
respondingOrgIds?: number[];
|
|
62
|
-
|
|
63
|
-
|
|
71
|
+
/** orgIds currently saving a renamed organization (shows a spinner on that card) */
|
|
72
|
+
editingOrgIds?: number[];
|
|
64
73
|
userName?: string;
|
|
65
74
|
userAvatarUrl?: string;
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
75
|
+
/**
|
|
76
|
+
* Only a super admin may rename an organization. Falls back per card to
|
|
77
|
+
* `OrganizationItem.isSuperAdmin` when that org carries its own flag.
|
|
78
|
+
*/
|
|
79
|
+
onSetDefault?: (orgId: number) => void | Promise<void>;
|
|
80
|
+
onAcceptInvite?: (orgId: number) => void | Promise<void>;
|
|
81
|
+
onDeclineInvite?: (orgId: number) => void | Promise<void>;
|
|
69
82
|
onDeleteOrganization?: (orgId: number) => void | Promise<void>;
|
|
70
|
-
onCreateOrganization?: (values:
|
|
83
|
+
onCreateOrganization?: (values: CreateOrganizationValues) => void | Promise<void>;
|
|
84
|
+
/** Called when the user confirms a new name for an organization */
|
|
85
|
+
onEditOrganization?: (orgId: number, newName: string) => void | Promise<void>;
|
|
71
86
|
onBack?: () => void;
|
|
72
87
|
footerSlot?: ReactNode;
|
|
73
88
|
labels?: OrganizationDetailsLabels;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OrganizationDetailsProps.d.ts","sourceRoot":"","sources":["../../../src/Components/OrganizationDetails/OrganizationDetailsProps.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"OrganizationDetailsProps.d.ts","sourceRoot":"","sources":["../../../src/Components/OrganizationDetails/OrganizationDetailsProps.tsx"],"names":[],"mappings":"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"}
|