@payloadcms/plugin-multi-tenant 4.0.0-canary.1 → 4.0.0-canary.2
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/AssignTenantFieldModal/index.client.d.ts +0 -1
- package/dist/components/AssignTenantFieldModal/index.client.d.ts.map +1 -1
- package/dist/components/AssignTenantFieldModal/index.client.js +26 -81
- package/dist/components/AssignTenantFieldModal/index.client.js.map +1 -1
- package/dist/components/TenantField/index.client.d.ts +1 -1
- package/dist/components/TenantField/index.client.d.ts.map +1 -1
- package/dist/components/TenantField/index.client.js +1 -1
- package/dist/components/TenantField/index.client.js.map +1 -1
- package/dist/components/TenantField/index.css +44 -0
- package/dist/components/TenantSelector/index.client.d.ts +1 -1
- package/dist/components/TenantSelector/index.client.d.ts.map +1 -1
- package/dist/components/TenantSelector/index.client.js +4 -2
- package/dist/components/TenantSelector/index.client.js.map +1 -1
- package/dist/components/TenantSelector/index.css +13 -0
- package/package.json +6 -6
- package/dist/components/AssignTenantFieldModal/index.scss +0 -78
- package/dist/components/TenantField/index.scss +0 -52
- package/dist/components/TenantSelector/index.scss +0 -4
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.client.d.ts","sourceRoot":"","sources":["../../../src/components/AssignTenantFieldModal/index.client.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.client.d.ts","sourceRoot":"","sources":["../../../src/components/AssignTenantFieldModal/index.client.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,MAAM,OAAO,CAAA;AASzB,eAAO,MAAM,qBAAqB,8BAA8B,CAAA;AAEhE,eAAO,MAAM,wBAAwB,EAAE,KAAK,CAAC,EAc5C,CAAA;AAED,eAAO,MAAM,sBAAsB,EAAE,KAAK,CAAC,EAAE,CAAC;IAC5C,eAAe,EAAE,MAAM,IAAI,CAAA;IAC3B,cAAc,EAAE,MAAM,IAAI,CAAA;IAC1B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;CACvB,CAuCA,CAAA"}
|
|
@@ -1,13 +1,10 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import { jsx as _jsx, jsxs as _jsxs
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { getTranslation } from '@payloadcms/translations';
|
|
4
|
-
import {
|
|
5
|
-
import { drawerZBase, useDrawerDepth } from '@payloadcms/ui/elements/Drawer';
|
|
4
|
+
import { DialogBody, DialogCancel, DialogConfirm, DialogFooter, DialogHeader, DialogModal, Pill, PopupList, useConfig, useDocumentInfo, useDocumentTitle, useModal, useTranslation } from '@payloadcms/ui';
|
|
6
5
|
import React from 'react';
|
|
7
6
|
import { useTenantSelection } from '../../providers/TenantSelectionProvider/index.client.js';
|
|
8
|
-
import './index.scss';
|
|
9
7
|
export const assignTenantModalSlug = 'assign-tenant-field-modal';
|
|
10
|
-
const baseClass = 'assign-tenant-field-modal';
|
|
11
8
|
export const AssignTenantFieldTrigger = ()=>{
|
|
12
9
|
const { openModal } = useModal();
|
|
13
10
|
const { t } = useTranslation();
|
|
@@ -15,15 +12,12 @@ export const AssignTenantFieldTrigger = ()=>{
|
|
|
15
12
|
if (options.length <= 1) {
|
|
16
13
|
return null;
|
|
17
14
|
}
|
|
18
|
-
return /*#__PURE__*/ _jsx(
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
children: t('plugin-multi-tenant:assign-tenant-button-label')
|
|
22
|
-
})
|
|
15
|
+
return /*#__PURE__*/ _jsx(PopupList.Button, {
|
|
16
|
+
onClick: ()=>openModal(assignTenantModalSlug),
|
|
17
|
+
children: t('plugin-multi-tenant:assign-tenant-button-label')
|
|
23
18
|
});
|
|
24
19
|
};
|
|
25
20
|
export const AssignTenantFieldModal = ({ afterModalClose, afterModalOpen, children, onCancel, onConfirm })=>{
|
|
26
|
-
const editDepth = useDrawerDepth();
|
|
27
21
|
const { i18n, t } = useTranslation();
|
|
28
22
|
const { collectionSlug } = useDocumentInfo();
|
|
29
23
|
const { title } = useDocumentTitle();
|
|
@@ -31,97 +25,48 @@ export const AssignTenantFieldModal = ({ afterModalClose, afterModalOpen, childr
|
|
|
31
25
|
const collectionConfig = getEntityConfig({
|
|
32
26
|
collectionSlug
|
|
33
27
|
});
|
|
34
|
-
const {
|
|
28
|
+
const { isModalOpen: isModalOpenFn } = useModal();
|
|
35
29
|
const isModalOpen = isModalOpenFn(assignTenantModalSlug);
|
|
36
30
|
const wasModalOpenRef = React.useRef(isModalOpen);
|
|
37
|
-
const onModalConfirm = React.useCallback(()=>{
|
|
38
|
-
if (typeof onConfirm === 'function') {
|
|
39
|
-
onConfirm();
|
|
40
|
-
}
|
|
41
|
-
closeModal(assignTenantModalSlug);
|
|
42
|
-
}, [
|
|
43
|
-
onConfirm,
|
|
44
|
-
closeModal
|
|
45
|
-
]);
|
|
46
|
-
const onModalCancel = React.useCallback(()=>{
|
|
47
|
-
if (typeof onCancel === 'function') {
|
|
48
|
-
onCancel();
|
|
49
|
-
}
|
|
50
|
-
closeModal(assignTenantModalSlug);
|
|
51
|
-
}, [
|
|
52
|
-
onCancel,
|
|
53
|
-
closeModal
|
|
54
|
-
]);
|
|
55
31
|
React.useEffect(()=>{
|
|
56
32
|
if (wasModalOpenRef.current && !isModalOpen) {
|
|
57
|
-
|
|
58
|
-
if (typeof afterModalClose === 'function') {
|
|
59
|
-
afterModalClose();
|
|
60
|
-
}
|
|
33
|
+
afterModalClose?.();
|
|
61
34
|
}
|
|
62
35
|
if (!wasModalOpenRef.current && isModalOpen) {
|
|
63
|
-
|
|
64
|
-
if (typeof afterModalOpen === 'function') {
|
|
65
|
-
afterModalOpen();
|
|
66
|
-
}
|
|
36
|
+
afterModalOpen?.();
|
|
67
37
|
}
|
|
68
38
|
wasModalOpenRef.current = isModalOpen;
|
|
69
39
|
}, [
|
|
70
40
|
isModalOpen,
|
|
71
|
-
onCancel,
|
|
72
41
|
afterModalClose,
|
|
73
42
|
afterModalOpen
|
|
74
43
|
]);
|
|
75
44
|
if (!collectionConfig) {
|
|
76
45
|
return null;
|
|
77
46
|
}
|
|
78
|
-
return /*#__PURE__*/ _jsxs(
|
|
79
|
-
|
|
47
|
+
return /*#__PURE__*/ _jsxs(DialogModal, {
|
|
48
|
+
size: "medium",
|
|
80
49
|
slug: assignTenantModalSlug,
|
|
81
|
-
style: {
|
|
82
|
-
zIndex: drawerZBase + editDepth + 1
|
|
83
|
-
},
|
|
84
50
|
children: [
|
|
85
|
-
/*#__PURE__*/ _jsx(
|
|
86
|
-
|
|
51
|
+
/*#__PURE__*/ _jsx(DialogHeader, {
|
|
52
|
+
title: t('plugin-multi-tenant:assign-tenant-modal-title', {
|
|
53
|
+
title
|
|
54
|
+
}),
|
|
55
|
+
children: /*#__PURE__*/ _jsx(Pill, {
|
|
56
|
+
size: "small",
|
|
57
|
+
children: getTranslation(collectionConfig.labels.singular, i18n)
|
|
58
|
+
})
|
|
87
59
|
}),
|
|
88
|
-
/*#__PURE__*/
|
|
89
|
-
|
|
60
|
+
/*#__PURE__*/ _jsx(DialogBody, {
|
|
61
|
+
children: children
|
|
62
|
+
}),
|
|
63
|
+
/*#__PURE__*/ _jsxs(DialogFooter, {
|
|
90
64
|
children: [
|
|
91
|
-
/*#__PURE__*/
|
|
92
|
-
|
|
93
|
-
children: [
|
|
94
|
-
/*#__PURE__*/ _jsx("h3", {
|
|
95
|
-
children: t('plugin-multi-tenant:assign-tenant-modal-title', {
|
|
96
|
-
title
|
|
97
|
-
})
|
|
98
|
-
}),
|
|
99
|
-
/*#__PURE__*/ _jsx(Pill, {
|
|
100
|
-
className: `${baseClass}__collection-pill`,
|
|
101
|
-
size: "small",
|
|
102
|
-
children: getTranslation(collectionConfig.labels.singular, i18n)
|
|
103
|
-
})
|
|
104
|
-
]
|
|
105
|
-
}),
|
|
106
|
-
/*#__PURE__*/ _jsx("div", {
|
|
107
|
-
className: `${baseClass}__content`,
|
|
108
|
-
children: children
|
|
65
|
+
/*#__PURE__*/ _jsx(DialogCancel, {
|
|
66
|
+
onClick: onCancel
|
|
109
67
|
}),
|
|
110
|
-
/*#__PURE__*/
|
|
111
|
-
|
|
112
|
-
children: [
|
|
113
|
-
/*#__PURE__*/ _jsx(Button, {
|
|
114
|
-
buttonStyle: "secondary",
|
|
115
|
-
margin: false,
|
|
116
|
-
onClick: onModalCancel,
|
|
117
|
-
children: t('general:cancel')
|
|
118
|
-
}),
|
|
119
|
-
/*#__PURE__*/ _jsx(Button, {
|
|
120
|
-
margin: false,
|
|
121
|
-
onClick: onModalConfirm,
|
|
122
|
-
children: t('general:confirm')
|
|
123
|
-
})
|
|
124
|
-
]
|
|
68
|
+
/*#__PURE__*/ _jsx(DialogConfirm, {
|
|
69
|
+
onClick: ()=>onConfirm?.()
|
|
125
70
|
})
|
|
126
71
|
]
|
|
127
72
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/AssignTenantFieldModal/index.client.tsx"],"sourcesContent":["'use client'\n\nimport type { ClientCollectionConfig } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport {\n
|
|
1
|
+
{"version":3,"sources":["../../../src/components/AssignTenantFieldModal/index.client.tsx"],"sourcesContent":["'use client'\n\nimport type { ClientCollectionConfig } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport {\n DialogBody,\n DialogCancel,\n DialogConfirm,\n DialogFooter,\n DialogHeader,\n DialogModal,\n Pill,\n PopupList,\n useConfig,\n useDocumentInfo,\n useDocumentTitle,\n useModal,\n useTranslation,\n} from '@payloadcms/ui'\nimport React from 'react'\n\nimport type {\n PluginMultiTenantTranslationKeys,\n PluginMultiTenantTranslations,\n} from '../../translations/index.js'\n\nimport { useTenantSelection } from '../../providers/TenantSelectionProvider/index.client.js'\n\nexport const assignTenantModalSlug = 'assign-tenant-field-modal'\n\nexport const AssignTenantFieldTrigger: React.FC = () => {\n const { openModal } = useModal()\n const { t } = useTranslation<PluginMultiTenantTranslations, PluginMultiTenantTranslationKeys>()\n const { options } = useTenantSelection()\n\n if (options.length <= 1) {\n return null\n }\n\n return (\n <PopupList.Button onClick={() => openModal(assignTenantModalSlug)}>\n {t('plugin-multi-tenant:assign-tenant-button-label')}\n </PopupList.Button>\n )\n}\n\nexport const AssignTenantFieldModal: React.FC<{\n afterModalClose: () => void\n afterModalOpen: () => void\n children: React.ReactNode\n onCancel?: () => void\n onConfirm?: () => void\n}> = ({ afterModalClose, afterModalOpen, children, onCancel, onConfirm }) => {\n const { i18n, t } = useTranslation<\n PluginMultiTenantTranslations,\n PluginMultiTenantTranslationKeys\n >()\n const { collectionSlug } = useDocumentInfo()\n const { title } = useDocumentTitle()\n const { getEntityConfig } = useConfig()\n const collectionConfig = getEntityConfig({ collectionSlug }) as ClientCollectionConfig\n const { isModalOpen: isModalOpenFn } = useModal()\n const isModalOpen = isModalOpenFn(assignTenantModalSlug)\n const wasModalOpenRef = React.useRef<boolean>(isModalOpen)\n\n React.useEffect(() => {\n if (wasModalOpenRef.current && !isModalOpen) {\n afterModalClose?.()\n }\n if (!wasModalOpenRef.current && isModalOpen) {\n afterModalOpen?.()\n }\n wasModalOpenRef.current = isModalOpen\n }, [isModalOpen, afterModalClose, afterModalOpen])\n\n if (!collectionConfig) {\n return null\n }\n\n return (\n <DialogModal size=\"medium\" slug={assignTenantModalSlug}>\n <DialogHeader title={t('plugin-multi-tenant:assign-tenant-modal-title', { title })}>\n <Pill size=\"small\">{getTranslation(collectionConfig.labels.singular, i18n)}</Pill>\n </DialogHeader>\n <DialogBody>{children}</DialogBody>\n <DialogFooter>\n <DialogCancel onClick={onCancel} />\n <DialogConfirm onClick={() => onConfirm?.()} />\n </DialogFooter>\n </DialogModal>\n )\n}\n"],"names":["getTranslation","DialogBody","DialogCancel","DialogConfirm","DialogFooter","DialogHeader","DialogModal","Pill","PopupList","useConfig","useDocumentInfo","useDocumentTitle","useModal","useTranslation","React","useTenantSelection","assignTenantModalSlug","AssignTenantFieldTrigger","openModal","t","options","length","Button","onClick","AssignTenantFieldModal","afterModalClose","afterModalOpen","children","onCancel","onConfirm","i18n","collectionSlug","title","getEntityConfig","collectionConfig","isModalOpen","isModalOpenFn","wasModalOpenRef","useRef","useEffect","current","size","slug","labels","singular"],"mappings":"AAAA;;AAIA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,SACEC,UAAU,EACVC,YAAY,EACZC,aAAa,EACbC,YAAY,EACZC,YAAY,EACZC,WAAW,EACXC,IAAI,EACJC,SAAS,EACTC,SAAS,EACTC,eAAe,EACfC,gBAAgB,EAChBC,QAAQ,EACRC,cAAc,QACT,iBAAgB;AACvB,OAAOC,WAAW,QAAO;AAOzB,SAASC,kBAAkB,QAAQ,0DAAyD;AAE5F,OAAO,MAAMC,wBAAwB,4BAA2B;AAEhE,OAAO,MAAMC,2BAAqC;IAChD,MAAM,EAAEC,SAAS,EAAE,GAAGN;IACtB,MAAM,EAAEO,CAAC,EAAE,GAAGN;IACd,MAAM,EAAEO,OAAO,EAAE,GAAGL;IAEpB,IAAIK,QAAQC,MAAM,IAAI,GAAG;QACvB,OAAO;IACT;IAEA,qBACE,KAACb,UAAUc,MAAM;QAACC,SAAS,IAAML,UAAUF;kBACxCG,EAAE;;AAGT,EAAC;AAED,OAAO,MAAMK,yBAMR,CAAC,EAAEC,eAAe,EAAEC,cAAc,EAAEC,QAAQ,EAAEC,QAAQ,EAAEC,SAAS,EAAE;IACtE,MAAM,EAAEC,IAAI,EAAEX,CAAC,EAAE,GAAGN;IAIpB,MAAM,EAAEkB,cAAc,EAAE,GAAGrB;IAC3B,MAAM,EAAEsB,KAAK,EAAE,GAAGrB;IAClB,MAAM,EAAEsB,eAAe,EAAE,GAAGxB;IAC5B,MAAMyB,mBAAmBD,gBAAgB;QAAEF;IAAe;IAC1D,MAAM,EAAEI,aAAaC,aAAa,EAAE,GAAGxB;IACvC,MAAMuB,cAAcC,cAAcpB;IAClC,MAAMqB,kBAAkBvB,MAAMwB,MAAM,CAAUH;IAE9CrB,MAAMyB,SAAS,CAAC;QACd,IAAIF,gBAAgBG,OAAO,IAAI,CAACL,aAAa;YAC3CV;QACF;QACA,IAAI,CAACY,gBAAgBG,OAAO,IAAIL,aAAa;YAC3CT;QACF;QACAW,gBAAgBG,OAAO,GAAGL;IAC5B,GAAG;QAACA;QAAaV;QAAiBC;KAAe;IAEjD,IAAI,CAACQ,kBAAkB;QACrB,OAAO;IACT;IAEA,qBACE,MAAC5B;QAAYmC,MAAK;QAASC,MAAM1B;;0BAC/B,KAACX;gBAAa2B,OAAOb,EAAE,iDAAiD;oBAAEa;gBAAM;0BAC9E,cAAA,KAACzB;oBAAKkC,MAAK;8BAASzC,eAAekC,iBAAiBS,MAAM,CAACC,QAAQ,EAAEd;;;0BAEvE,KAAC7B;0BAAY0B;;0BACb,MAACvB;;kCACC,KAACF;wBAAaqB,SAASK;;kCACvB,KAACzB;wBAAcoB,SAAS,IAAMM;;;;;;AAItC,EAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.client.d.ts","sourceRoot":"","sources":["../../../src/components/TenantField/index.client.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,SAAS,CAAA;AAW3D,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB,OAAO,
|
|
1
|
+
{"version":3,"file":"index.client.d.ts","sourceRoot":"","sources":["../../../src/components/TenantField/index.client.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,SAAS,CAAA;AAW3D,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB,OAAO,aAAa,CAAA;AAIpB,KAAK,KAAK,GAAG;IACX,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,GAAG,4BAA4B,CAAA;AAEhC,eAAO,MAAM,WAAW,GAAI,iCAAiC,KAAK,6BA6HjE,CAAA"}
|
|
@@ -4,7 +4,7 @@ import { Pill, RelationshipField, useDocumentInfo, useField, useForm, useFormMod
|
|
|
4
4
|
import React from 'react';
|
|
5
5
|
import { useTenantSelection } from '../../providers/TenantSelectionProvider/index.client.js';
|
|
6
6
|
import { AssignTenantFieldModal, assignTenantModalSlug } from '../AssignTenantFieldModal/index.client.js';
|
|
7
|
-
import './index.
|
|
7
|
+
import './index.css';
|
|
8
8
|
const baseClass = 'tenantField';
|
|
9
9
|
export const TenantField = ({ debug, unique, ...fieldArgs })=>{
|
|
10
10
|
const { entityType, options, selectedTenantID, setEntityType, setTenant } = useTenantSelection();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/TenantField/index.client.tsx"],"sourcesContent":["'use client'\n\nimport type { RelationshipFieldClientProps } from 'payload'\n\nimport {\n Pill,\n RelationshipField,\n useDocumentInfo,\n useField,\n useForm,\n useFormModified,\n useModal,\n} from '@payloadcms/ui'\nimport React from 'react'\n\nimport { useTenantSelection } from '../../providers/TenantSelectionProvider/index.client.js'\nimport {\n AssignTenantFieldModal,\n assignTenantModalSlug,\n} from '../AssignTenantFieldModal/index.client.js'\nimport './index.scss'\n\nconst baseClass = 'tenantField'\n\ntype Props = {\n debug?: boolean\n unique?: boolean\n} & RelationshipFieldClientProps\n\nexport const TenantField = ({ debug, unique, ...fieldArgs }: Props) => {\n const { entityType, options, selectedTenantID, setEntityType, setTenant } = useTenantSelection()\n const { setValue, showError, value } = useField<(number | string)[] | (number | string)>()\n const modified = useFormModified()\n const { isValid: isFormValid, setModified } = useForm()\n const { id: docID, collectionSlug } = useDocumentInfo()\n const { isModalOpen, openModal } = useModal()\n const isEditManyModalOpen = collectionSlug\n ? isModalOpen(`edit-${collectionSlug}`) || isModalOpen(`edit-${collectionSlug}-bulk-uploads`)\n : false\n const isConfirmingRef = React.useRef<boolean>(false)\n const prevModified = React.useRef(modified)\n const prevValue = React.useRef<typeof value>(value)\n const showField =\n (options.length > 1 && !fieldArgs.field.admin?.hidden && !fieldArgs.field.hidden) || debug\n\n const onConfirm = React.useCallback(() => {\n isConfirmingRef.current = true\n }, [])\n\n const afterModalOpen = React.useCallback(() => {\n prevModified.current = modified\n prevValue.current = value\n }, [modified, value])\n\n const afterModalClose = React.useCallback(() => {\n let didChange = true\n if (isConfirmingRef.current) {\n // did the values actually change?\n if (fieldArgs.field.hasMany) {\n const prev = (prevValue.current || []) as (number | string)[]\n const newValue = (value || []) as (number | string)[]\n if (prev.length !== newValue.length) {\n didChange = true\n } else {\n const allMatch = newValue.every((val) => prev.includes(val))\n if (allMatch) {\n didChange = false\n }\n }\n } else if (value === prevValue.current) {\n didChange = false\n }\n\n if (didChange) {\n prevModified.current = true\n prevValue.current = value\n }\n }\n\n setValue(prevValue.current, true)\n setModified(prevModified.current)\n\n isConfirmingRef.current = false\n }, [setValue, setModified, value, fieldArgs.field.hasMany])\n\n React.useEffect(() => {\n if (!entityType) {\n setEntityType(unique ? 'global' : 'document')\n } else {\n // unique documents are controlled from the global TenantSelector\n if (!unique && value) {\n if (Array.isArray(value)) {\n if (value.length) {\n if (!selectedTenantID) {\n setTenant({ id: value[0], refresh: false })\n } else if (!value.includes(selectedTenantID)) {\n setTenant({ id: value[0], refresh: false })\n }\n }\n } else if (selectedTenantID !== value) {\n setTenant({ id: value, refresh: false })\n }\n }\n }\n\n return () => {\n if (entityType) {\n setEntityType(undefined)\n }\n }\n }, [unique, options, selectedTenantID, setTenant, value, setEntityType, entityType])\n\n React.useEffect(() => {\n if (unique || debug || isEditManyModalOpen) {\n return\n }\n if (showField && ((!isFormValid && showError) || (!value && !selectedTenantID))) {\n openModal(assignTenantModalSlug)\n }\n }, [\n debug,\n isEditManyModalOpen,\n isFormValid,\n showError,\n showField,\n openModal,\n value,\n docID,\n selectedTenantID,\n unique,\n ])\n\n if (showField) {\n if (debug || isEditManyModalOpen) {\n return <TenantRelationshipField debug={debug} fieldArgs={fieldArgs} unique={unique} />\n }\n\n if (!unique) {\n /** Editing a non-global tenant document */\n return (\n <AssignTenantFieldModal\n afterModalClose={afterModalClose}\n afterModalOpen={afterModalOpen}\n onConfirm={onConfirm}\n >\n <TenantRelationshipField fieldArgs={fieldArgs} unique={unique} />\n </AssignTenantFieldModal>\n )\n }\n\n return <SyncFormModified />\n }\n\n return null\n}\n\nconst TenantRelationshipField: React.FC<{\n debug?: boolean\n fieldArgs: RelationshipFieldClientProps\n unique?: boolean\n}> = ({ debug, fieldArgs, unique }) => {\n return (\n <div className={baseClass}>\n <div className={`${baseClass}__wrapper`}>\n {debug && (\n <Pill className={`${baseClass}__debug-pill`} pillStyle=\"success\" size=\"small\">\n Multi-Tenant Debug Enabled\n </Pill>\n )}\n <RelationshipField\n {...fieldArgs}\n field={{\n ...fieldArgs.field,\n required: true,\n }}\n readOnly={fieldArgs.readOnly || fieldArgs.field.admin?.readOnly || unique}\n />\n </div>\n </div>\n )\n}\n\n/**\n * Tells the global selector when the form has been modified\n * so it can display the \"Leave without saving\" confirmation modal\n * if modified and attempting to change the tenant\n */\nconst SyncFormModified = () => {\n const modified = useFormModified()\n const { setModified } = useTenantSelection()\n\n React.useEffect(() => {\n setModified(modified)\n }, [modified, setModified])\n\n return null\n}\n"],"names":["Pill","RelationshipField","useDocumentInfo","useField","useForm","useFormModified","useModal","React","useTenantSelection","AssignTenantFieldModal","assignTenantModalSlug","baseClass","TenantField","debug","unique","fieldArgs","entityType","options","selectedTenantID","setEntityType","setTenant","setValue","showError","value","modified","isValid","isFormValid","setModified","id","docID","collectionSlug","isModalOpen","openModal","isEditManyModalOpen","isConfirmingRef","useRef","prevModified","prevValue","showField","length","field","admin","hidden","onConfirm","useCallback","current","afterModalOpen","afterModalClose","didChange","hasMany","prev","newValue","allMatch","every","val","includes","useEffect","Array","isArray","refresh","undefined","TenantRelationshipField","SyncFormModified","div","className","pillStyle","size","required","readOnly"],"mappings":"AAAA;;AAIA,SACEA,IAAI,EACJC,iBAAiB,EACjBC,eAAe,EACfC,QAAQ,EACRC,OAAO,EACPC,eAAe,EACfC,QAAQ,QACH,iBAAgB;AACvB,OAAOC,WAAW,QAAO;AAEzB,SAASC,kBAAkB,QAAQ,0DAAyD;AAC5F,SACEC,sBAAsB,EACtBC,qBAAqB,QAChB,4CAA2C;AAClD,OAAO,eAAc;AAErB,MAAMC,YAAY;AAOlB,OAAO,MAAMC,cAAc,CAAC,EAAEC,KAAK,EAAEC,MAAM,EAAE,GAAGC,WAAkB;IAChE,MAAM,EAAEC,UAAU,EAAEC,OAAO,EAAEC,gBAAgB,EAAEC,aAAa,EAAEC,SAAS,EAAE,GAAGZ;IAC5E,MAAM,EAAEa,QAAQ,EAAEC,SAAS,EAAEC,KAAK,EAAE,GAAGpB;IACvC,MAAMqB,WAAWnB;IACjB,MAAM,EAAEoB,SAASC,WAAW,EAAEC,WAAW,EAAE,GAAGvB;IAC9C,MAAM,EAAEwB,IAAIC,KAAK,EAAEC,cAAc,EAAE,GAAG5B;IACtC,MAAM,EAAE6B,WAAW,EAAEC,SAAS,EAAE,GAAG1B;IACnC,MAAM2B,sBAAsBH,iBACxBC,YAAY,CAAC,KAAK,EAAED,gBAAgB,KAAKC,YAAY,CAAC,KAAK,EAAED,eAAe,aAAa,CAAC,IAC1F;IACJ,MAAMI,kBAAkB3B,MAAM4B,MAAM,CAAU;IAC9C,MAAMC,eAAe7B,MAAM4B,MAAM,CAACX;IAClC,MAAMa,YAAY9B,MAAM4B,MAAM,CAAeZ;IAC7C,MAAMe,YACJ,AAACrB,QAAQsB,MAAM,GAAG,KAAK,CAACxB,UAAUyB,KAAK,CAACC,KAAK,EAAEC,UAAU,CAAC3B,UAAUyB,KAAK,CAACE,MAAM,IAAK7B;IAEvF,MAAM8B,YAAYpC,MAAMqC,WAAW,CAAC;QAClCV,gBAAgBW,OAAO,GAAG;IAC5B,GAAG,EAAE;IAEL,MAAMC,iBAAiBvC,MAAMqC,WAAW,CAAC;QACvCR,aAAaS,OAAO,GAAGrB;QACvBa,UAAUQ,OAAO,GAAGtB;IACtB,GAAG;QAACC;QAAUD;KAAM;IAEpB,MAAMwB,kBAAkBxC,MAAMqC,WAAW,CAAC;QACxC,IAAII,YAAY;QAChB,IAAId,gBAAgBW,OAAO,EAAE;YAC3B,kCAAkC;YAClC,IAAI9B,UAAUyB,KAAK,CAACS,OAAO,EAAE;gBAC3B,MAAMC,OAAQb,UAAUQ,OAAO,IAAI,EAAE;gBACrC,MAAMM,WAAY5B,SAAS,EAAE;gBAC7B,IAAI2B,KAAKX,MAAM,KAAKY,SAASZ,MAAM,EAAE;oBACnCS,YAAY;gBACd,OAAO;oBACL,MAAMI,WAAWD,SAASE,KAAK,CAAC,CAACC,MAAQJ,KAAKK,QAAQ,CAACD;oBACvD,IAAIF,UAAU;wBACZJ,YAAY;oBACd;gBACF;YACF,OAAO,IAAIzB,UAAUc,UAAUQ,OAAO,EAAE;gBACtCG,YAAY;YACd;YAEA,IAAIA,WAAW;gBACbZ,aAAaS,OAAO,GAAG;gBACvBR,UAAUQ,OAAO,GAAGtB;YACtB;QACF;QAEAF,SAASgB,UAAUQ,OAAO,EAAE;QAC5BlB,YAAYS,aAAaS,OAAO;QAEhCX,gBAAgBW,OAAO,GAAG;IAC5B,GAAG;QAACxB;QAAUM;QAAaJ;QAAOR,UAAUyB,KAAK,CAACS,OAAO;KAAC;IAE1D1C,MAAMiD,SAAS,CAAC;QACd,IAAI,CAACxC,YAAY;YACfG,cAAcL,SAAS,WAAW;QACpC,OAAO;YACL,iEAAiE;YACjE,IAAI,CAACA,UAAUS,OAAO;gBACpB,IAAIkC,MAAMC,OAAO,CAACnC,QAAQ;oBACxB,IAAIA,MAAMgB,MAAM,EAAE;wBAChB,IAAI,CAACrB,kBAAkB;4BACrBE,UAAU;gCAAEQ,IAAIL,KAAK,CAAC,EAAE;gCAAEoC,SAAS;4BAAM;wBAC3C,OAAO,IAAI,CAACpC,MAAMgC,QAAQ,CAACrC,mBAAmB;4BAC5CE,UAAU;gCAAEQ,IAAIL,KAAK,CAAC,EAAE;gCAAEoC,SAAS;4BAAM;wBAC3C;oBACF;gBACF,OAAO,IAAIzC,qBAAqBK,OAAO;oBACrCH,UAAU;wBAAEQ,IAAIL;wBAAOoC,SAAS;oBAAM;gBACxC;YACF;QACF;QAEA,OAAO;YACL,IAAI3C,YAAY;gBACdG,cAAcyC;YAChB;QACF;IACF,GAAG;QAAC9C;QAAQG;QAASC;QAAkBE;QAAWG;QAAOJ;QAAeH;KAAW;IAEnFT,MAAMiD,SAAS,CAAC;QACd,IAAI1C,UAAUD,SAASoB,qBAAqB;YAC1C;QACF;QACA,IAAIK,aAAc,CAAA,AAAC,CAACZ,eAAeJ,aAAe,CAACC,SAAS,CAACL,gBAAgB,GAAI;YAC/Ec,UAAUtB;QACZ;IACF,GAAG;QACDG;QACAoB;QACAP;QACAJ;QACAgB;QACAN;QACAT;QACAM;QACAX;QACAJ;KACD;IAED,IAAIwB,WAAW;QACb,IAAIzB,SAASoB,qBAAqB;YAChC,qBAAO,KAAC4B;gBAAwBhD,OAAOA;gBAAOE,WAAWA;gBAAWD,QAAQA;;QAC9E;QAEA,IAAI,CAACA,QAAQ;YACX,yCAAyC,GACzC,qBACE,KAACL;gBACCsC,iBAAiBA;gBACjBD,gBAAgBA;gBAChBH,WAAWA;0BAEX,cAAA,KAACkB;oBAAwB9C,WAAWA;oBAAWD,QAAQA;;;QAG7D;QAEA,qBAAO,KAACgD;IACV;IAEA,OAAO;AACT,EAAC;AAED,MAAMD,0BAID,CAAC,EAAEhD,KAAK,EAAEE,SAAS,EAAED,MAAM,EAAE;IAChC,qBACE,KAACiD;QAAIC,WAAWrD;kBACd,cAAA,MAACoD;YAAIC,WAAW,GAAGrD,UAAU,SAAS,CAAC;;gBACpCE,uBACC,KAACb;oBAAKgE,WAAW,GAAGrD,UAAU,YAAY,CAAC;oBAAEsD,WAAU;oBAAUC,MAAK;8BAAQ;;8BAIhF,KAACjE;oBACE,GAAGc,SAAS;oBACbyB,OAAO;wBACL,GAAGzB,UAAUyB,KAAK;wBAClB2B,UAAU;oBACZ;oBACAC,UAAUrD,UAAUqD,QAAQ,IAAIrD,UAAUyB,KAAK,CAACC,KAAK,EAAE2B,YAAYtD;;;;;AAK7E;AAEA;;;;CAIC,GACD,MAAMgD,mBAAmB;IACvB,MAAMtC,WAAWnB;IACjB,MAAM,EAAEsB,WAAW,EAAE,GAAGnB;IAExBD,MAAMiD,SAAS,CAAC;QACd7B,YAAYH;IACd,GAAG;QAACA;QAAUG;KAAY;IAE1B,OAAO;AACT"}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/TenantField/index.client.tsx"],"sourcesContent":["'use client'\n\nimport type { RelationshipFieldClientProps } from 'payload'\n\nimport {\n Pill,\n RelationshipField,\n useDocumentInfo,\n useField,\n useForm,\n useFormModified,\n useModal,\n} from '@payloadcms/ui'\nimport React from 'react'\n\nimport { useTenantSelection } from '../../providers/TenantSelectionProvider/index.client.js'\nimport {\n AssignTenantFieldModal,\n assignTenantModalSlug,\n} from '../AssignTenantFieldModal/index.client.js'\nimport './index.css'\n\nconst baseClass = 'tenantField'\n\ntype Props = {\n debug?: boolean\n unique?: boolean\n} & RelationshipFieldClientProps\n\nexport const TenantField = ({ debug, unique, ...fieldArgs }: Props) => {\n const { entityType, options, selectedTenantID, setEntityType, setTenant } = useTenantSelection()\n const { setValue, showError, value } = useField<(number | string)[] | (number | string)>()\n const modified = useFormModified()\n const { isValid: isFormValid, setModified } = useForm()\n const { id: docID, collectionSlug } = useDocumentInfo()\n const { isModalOpen, openModal } = useModal()\n const isEditManyModalOpen = collectionSlug\n ? isModalOpen(`edit-${collectionSlug}`) || isModalOpen(`edit-${collectionSlug}-bulk-uploads`)\n : false\n const isConfirmingRef = React.useRef<boolean>(false)\n const prevModified = React.useRef(modified)\n const prevValue = React.useRef<typeof value>(value)\n const showField =\n (options.length > 1 && !fieldArgs.field.admin?.hidden && !fieldArgs.field.hidden) || debug\n\n const onConfirm = React.useCallback(() => {\n isConfirmingRef.current = true\n }, [])\n\n const afterModalOpen = React.useCallback(() => {\n prevModified.current = modified\n prevValue.current = value\n }, [modified, value])\n\n const afterModalClose = React.useCallback(() => {\n let didChange = true\n if (isConfirmingRef.current) {\n // did the values actually change?\n if (fieldArgs.field.hasMany) {\n const prev = (prevValue.current || []) as (number | string)[]\n const newValue = (value || []) as (number | string)[]\n if (prev.length !== newValue.length) {\n didChange = true\n } else {\n const allMatch = newValue.every((val) => prev.includes(val))\n if (allMatch) {\n didChange = false\n }\n }\n } else if (value === prevValue.current) {\n didChange = false\n }\n\n if (didChange) {\n prevModified.current = true\n prevValue.current = value\n }\n }\n\n setValue(prevValue.current, true)\n setModified(prevModified.current)\n\n isConfirmingRef.current = false\n }, [setValue, setModified, value, fieldArgs.field.hasMany])\n\n React.useEffect(() => {\n if (!entityType) {\n setEntityType(unique ? 'global' : 'document')\n } else {\n // unique documents are controlled from the global TenantSelector\n if (!unique && value) {\n if (Array.isArray(value)) {\n if (value.length) {\n if (!selectedTenantID) {\n setTenant({ id: value[0], refresh: false })\n } else if (!value.includes(selectedTenantID)) {\n setTenant({ id: value[0], refresh: false })\n }\n }\n } else if (selectedTenantID !== value) {\n setTenant({ id: value, refresh: false })\n }\n }\n }\n\n return () => {\n if (entityType) {\n setEntityType(undefined)\n }\n }\n }, [unique, options, selectedTenantID, setTenant, value, setEntityType, entityType])\n\n React.useEffect(() => {\n if (unique || debug || isEditManyModalOpen) {\n return\n }\n if (showField && ((!isFormValid && showError) || (!value && !selectedTenantID))) {\n openModal(assignTenantModalSlug)\n }\n }, [\n debug,\n isEditManyModalOpen,\n isFormValid,\n showError,\n showField,\n openModal,\n value,\n docID,\n selectedTenantID,\n unique,\n ])\n\n if (showField) {\n if (debug || isEditManyModalOpen) {\n return <TenantRelationshipField debug={debug} fieldArgs={fieldArgs} unique={unique} />\n }\n\n if (!unique) {\n /** Editing a non-global tenant document */\n return (\n <AssignTenantFieldModal\n afterModalClose={afterModalClose}\n afterModalOpen={afterModalOpen}\n onConfirm={onConfirm}\n >\n <TenantRelationshipField fieldArgs={fieldArgs} unique={unique} />\n </AssignTenantFieldModal>\n )\n }\n\n return <SyncFormModified />\n }\n\n return null\n}\n\nconst TenantRelationshipField: React.FC<{\n debug?: boolean\n fieldArgs: RelationshipFieldClientProps\n unique?: boolean\n}> = ({ debug, fieldArgs, unique }) => {\n return (\n <div className={baseClass}>\n <div className={`${baseClass}__wrapper`}>\n {debug && (\n <Pill className={`${baseClass}__debug-pill`} pillStyle=\"success\" size=\"small\">\n Multi-Tenant Debug Enabled\n </Pill>\n )}\n <RelationshipField\n {...fieldArgs}\n field={{\n ...fieldArgs.field,\n required: true,\n }}\n readOnly={fieldArgs.readOnly || fieldArgs.field.admin?.readOnly || unique}\n />\n </div>\n </div>\n )\n}\n\n/**\n * Tells the global selector when the form has been modified\n * so it can display the \"Leave without saving\" confirmation modal\n * if modified and attempting to change the tenant\n */\nconst SyncFormModified = () => {\n const modified = useFormModified()\n const { setModified } = useTenantSelection()\n\n React.useEffect(() => {\n setModified(modified)\n }, [modified, setModified])\n\n return null\n}\n"],"names":["Pill","RelationshipField","useDocumentInfo","useField","useForm","useFormModified","useModal","React","useTenantSelection","AssignTenantFieldModal","assignTenantModalSlug","baseClass","TenantField","debug","unique","fieldArgs","entityType","options","selectedTenantID","setEntityType","setTenant","setValue","showError","value","modified","isValid","isFormValid","setModified","id","docID","collectionSlug","isModalOpen","openModal","isEditManyModalOpen","isConfirmingRef","useRef","prevModified","prevValue","showField","length","field","admin","hidden","onConfirm","useCallback","current","afterModalOpen","afterModalClose","didChange","hasMany","prev","newValue","allMatch","every","val","includes","useEffect","Array","isArray","refresh","undefined","TenantRelationshipField","SyncFormModified","div","className","pillStyle","size","required","readOnly"],"mappings":"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"}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
@layer payload-default {
|
|
2
|
+
.document-fields__sidebar-fields .render-fields .tenantField,
|
|
3
|
+
.document-fields__main .render-fields .tenantField {
|
|
4
|
+
width: calc(100% + var(--gutter-h) * 2);
|
|
5
|
+
margin-left: calc(-1 * var(--gutter-h));
|
|
6
|
+
border-bottom: var(--stroke-width-small) solid var(--color-border);
|
|
7
|
+
padding-top: var(--spacer-3);
|
|
8
|
+
padding-bottom: var(--spacer-4);
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
.document-fields__sidebar-fields .render-fields .tenantField__wrapper,
|
|
12
|
+
.document-fields__main .render-fields .tenantField__wrapper {
|
|
13
|
+
padding-left: var(--gutter-h);
|
|
14
|
+
padding-right: var(--gutter-h);
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
[dir='rtl'] .document-fields__sidebar-fields .render-fields .tenantField,
|
|
18
|
+
[dir='rtl'] .document-fields__main .render-fields .tenantField {
|
|
19
|
+
margin-left: 0;
|
|
20
|
+
margin-right: calc(-1 * var(--gutter-h));
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
.document-fields__sidebar-fields .render-fields .tenantField:not(:first-child),
|
|
24
|
+
.document-fields__main .render-fields .tenantField:not(:first-child) {
|
|
25
|
+
border-top: var(--stroke-width-small) solid var(--color-border);
|
|
26
|
+
margin-top: var(--spacer-4);
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
.document-fields__sidebar-fields .render-fields .tenantField:not(:last-child),
|
|
30
|
+
.document-fields__main .render-fields .tenantField:not(:last-child) {
|
|
31
|
+
margin-bottom: var(--spacing-field);
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
.document-fields__sidebar-fields .render-fields .tenantField:first-child,
|
|
35
|
+
.document-fields__main .render-fields .tenantField:first-child {
|
|
36
|
+
margin-top: calc(-1 * var(--spacer-4));
|
|
37
|
+
padding-top: var(--spacer-4);
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
.document-fields__sidebar-fields .render-fields .tenantField__debug-pill,
|
|
41
|
+
.document-fields__main .render-fields .tenantField__debug-pill {
|
|
42
|
+
margin-bottom: var(--spacer-2);
|
|
43
|
+
}
|
|
44
|
+
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import type { ViewTypes } from 'payload';
|
|
2
2
|
import React from 'react';
|
|
3
3
|
import type { MultiTenantPluginConfig } from '../../types.js';
|
|
4
|
-
import './index.
|
|
4
|
+
import './index.css';
|
|
5
5
|
export declare const TenantSelectorClient: ({ disabled: disabledFromProps, label, viewType, }: {
|
|
6
6
|
disabled?: boolean;
|
|
7
7
|
label?: MultiTenantPluginConfig["tenantSelectorLabel"];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.client.d.ts","sourceRoot":"","sources":["../../../src/components/TenantSelector/index.client.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAIxC,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAA;AAG7D,OAAO,
|
|
1
|
+
{"version":3,"file":"index.client.d.ts","sourceRoot":"","sources":["../../../src/components/TenantSelector/index.client.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAIxC,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAA;AAG7D,OAAO,aAAa,CAAA;AAMpB,eAAO,MAAM,oBAAoB,GAAI,mDAIlC;IACD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,uBAAuB,CAAC,qBAAqB,CAAC,CAAA;IACtD,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB,6BAiFA,CAAA"}
|
|
@@ -4,8 +4,9 @@ import { getTranslation } from '@payloadcms/translations';
|
|
|
4
4
|
import { ConfirmationModal, SelectInput, useModal, useTranslation } from '@payloadcms/ui';
|
|
5
5
|
import React from 'react';
|
|
6
6
|
import { useTenantSelection } from '../../providers/TenantSelectionProvider/index.client.js';
|
|
7
|
-
import './index.
|
|
7
|
+
import './index.css';
|
|
8
8
|
const confirmLeaveWithoutSavingSlug = 'confirm-leave-without-saving';
|
|
9
|
+
const baseClass = 'tenant-selector';
|
|
9
10
|
export const TenantSelectorClient = ({ disabled: disabledFromProps, label, viewType })=>{
|
|
10
11
|
const { entityType, modified, options, selectedTenantID, setTenant } = useTenantSelection();
|
|
11
12
|
const { closeModal, openModal } = useModal();
|
|
@@ -50,9 +51,10 @@ export const TenantSelectorClient = ({ disabled: disabledFromProps, label, viewT
|
|
|
50
51
|
return null;
|
|
51
52
|
}
|
|
52
53
|
return /*#__PURE__*/ _jsxs("div", {
|
|
53
|
-
className:
|
|
54
|
+
className: baseClass,
|
|
54
55
|
children: [
|
|
55
56
|
/*#__PURE__*/ _jsx(SelectInput, {
|
|
57
|
+
className: `${baseClass}__select`,
|
|
56
58
|
isClearable: [
|
|
57
59
|
'dashboard',
|
|
58
60
|
'list'
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/TenantSelector/index.client.tsx"],"sourcesContent":["'use client'\nimport type { ReactSelectOption } from '@payloadcms/ui'\nimport type { ViewTypes } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { ConfirmationModal, SelectInput, useModal, useTranslation } from '@payloadcms/ui'\nimport React from 'react'\n\nimport type {\n PluginMultiTenantTranslationKeys,\n PluginMultiTenantTranslations,\n} from '../../translations/index.js'\nimport type { MultiTenantPluginConfig } from '../../types.js'\n\nimport { useTenantSelection } from '../../providers/TenantSelectionProvider/index.client.js'\nimport './index.
|
|
1
|
+
{"version":3,"sources":["../../../src/components/TenantSelector/index.client.tsx"],"sourcesContent":["'use client'\nimport type { ReactSelectOption } from '@payloadcms/ui'\nimport type { ViewTypes } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { ConfirmationModal, SelectInput, useModal, useTranslation } from '@payloadcms/ui'\nimport React from 'react'\n\nimport type {\n PluginMultiTenantTranslationKeys,\n PluginMultiTenantTranslations,\n} from '../../translations/index.js'\nimport type { MultiTenantPluginConfig } from '../../types.js'\n\nimport { useTenantSelection } from '../../providers/TenantSelectionProvider/index.client.js'\nimport './index.css'\n\nconst confirmLeaveWithoutSavingSlug = 'confirm-leave-without-saving'\n\nconst baseClass = 'tenant-selector'\n\nexport const TenantSelectorClient = ({\n disabled: disabledFromProps,\n label,\n viewType,\n}: {\n disabled?: boolean\n label?: MultiTenantPluginConfig['tenantSelectorLabel']\n viewType?: ViewTypes\n}) => {\n const { entityType, modified, options, selectedTenantID, setTenant } = useTenantSelection()\n const { closeModal, openModal } = useModal()\n const { i18n, t } = useTranslation<\n PluginMultiTenantTranslations,\n PluginMultiTenantTranslationKeys\n >()\n const [tenantSelection, setTenantSelection] = React.useState<\n ReactSelectOption | ReactSelectOption[]\n >()\n\n const switchTenant = React.useCallback(\n (option: ReactSelectOption | ReactSelectOption[] | undefined) => {\n if (option && 'value' in option) {\n setTenant({ id: option.value as string, refresh: true })\n } else {\n setTenant({ id: undefined, refresh: true })\n }\n },\n [setTenant],\n )\n\n const onChange = React.useCallback(\n (option: ReactSelectOption | ReactSelectOption[]) => {\n if (option && 'value' in option && option.value === selectedTenantID) {\n // If the selected option is the same as the current tenant, do nothing\n return\n }\n\n if (entityType === 'global' && modified) {\n // If the entityType is 'global' and there are unsaved changes, prompt for confirmation\n setTenantSelection(option)\n openModal(confirmLeaveWithoutSavingSlug)\n } else {\n // If the entityType is not 'document', switch tenant without confirmation\n switchTenant(option)\n }\n },\n [selectedTenantID, entityType, modified, switchTenant, openModal],\n )\n\n if (options.length <= 1) {\n return null\n }\n\n return (\n <div className={baseClass}>\n <SelectInput\n className={`${baseClass}__select`}\n isClearable={['dashboard', 'list'].includes(viewType ?? '')}\n label={\n label ? getTranslation(label, i18n) : t('plugin-multi-tenant:nav-tenantSelector-label')\n }\n name=\"setTenant\"\n onChange={onChange}\n options={options}\n path=\"setTenant\"\n readOnly={\n disabledFromProps ||\n (entityType !== 'global' &&\n viewType &&\n (['document', 'version'] satisfies ViewTypes[] as ViewTypes[]).includes(viewType))\n }\n value={selectedTenantID as string | undefined}\n />\n\n <ConfirmationModal\n body={t('general:changesNotSaved')}\n cancelLabel={t('general:stayOnThisPage')}\n confirmLabel={t('general:leaveAnyway')}\n heading={t('general:leaveWithoutSaving')}\n modalSlug={confirmLeaveWithoutSavingSlug}\n onCancel={() => {\n closeModal(confirmLeaveWithoutSavingSlug)\n }}\n onConfirm={() => {\n switchTenant(tenantSelection)\n }}\n />\n </div>\n )\n}\n"],"names":["getTranslation","ConfirmationModal","SelectInput","useModal","useTranslation","React","useTenantSelection","confirmLeaveWithoutSavingSlug","baseClass","TenantSelectorClient","disabled","disabledFromProps","label","viewType","entityType","modified","options","selectedTenantID","setTenant","closeModal","openModal","i18n","t","tenantSelection","setTenantSelection","useState","switchTenant","useCallback","option","id","value","refresh","undefined","onChange","length","div","className","isClearable","includes","name","path","readOnly","body","cancelLabel","confirmLabel","heading","modalSlug","onCancel","onConfirm"],"mappings":"AAAA;;AAIA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,SAASC,iBAAiB,EAAEC,WAAW,EAAEC,QAAQ,EAAEC,cAAc,QAAQ,iBAAgB;AACzF,OAAOC,WAAW,QAAO;AAQzB,SAASC,kBAAkB,QAAQ,0DAAyD;AAC5F,OAAO,cAAa;AAEpB,MAAMC,gCAAgC;AAEtC,MAAMC,YAAY;AAElB,OAAO,MAAMC,uBAAuB,CAAC,EACnCC,UAAUC,iBAAiB,EAC3BC,KAAK,EACLC,QAAQ,EAKT;IACC,MAAM,EAAEC,UAAU,EAAEC,QAAQ,EAAEC,OAAO,EAAEC,gBAAgB,EAAEC,SAAS,EAAE,GAAGZ;IACvE,MAAM,EAAEa,UAAU,EAAEC,SAAS,EAAE,GAAGjB;IAClC,MAAM,EAAEkB,IAAI,EAAEC,CAAC,EAAE,GAAGlB;IAIpB,MAAM,CAACmB,iBAAiBC,mBAAmB,GAAGnB,MAAMoB,QAAQ;IAI5D,MAAMC,eAAerB,MAAMsB,WAAW,CACpC,CAACC;QACC,IAAIA,UAAU,WAAWA,QAAQ;YAC/BV,UAAU;gBAAEW,IAAID,OAAOE,KAAK;gBAAYC,SAAS;YAAK;QACxD,OAAO;YACLb,UAAU;gBAAEW,IAAIG;gBAAWD,SAAS;YAAK;QAC3C;IACF,GACA;QAACb;KAAU;IAGb,MAAMe,WAAW5B,MAAMsB,WAAW,CAChC,CAACC;QACC,IAAIA,UAAU,WAAWA,UAAUA,OAAOE,KAAK,KAAKb,kBAAkB;YACpE,uEAAuE;YACvE;QACF;QAEA,IAAIH,eAAe,YAAYC,UAAU;YACvC,uFAAuF;YACvFS,mBAAmBI;YACnBR,UAAUb;QACZ,OAAO;YACL,0EAA0E;YAC1EmB,aAAaE;QACf;IACF,GACA;QAACX;QAAkBH;QAAYC;QAAUW;QAAcN;KAAU;IAGnE,IAAIJ,QAAQkB,MAAM,IAAI,GAAG;QACvB,OAAO;IACT;IAEA,qBACE,MAACC;QAAIC,WAAW5B;;0BACd,KAACN;gBACCkC,WAAW,GAAG5B,UAAU,QAAQ,CAAC;gBACjC6B,aAAa;oBAAC;oBAAa;iBAAO,CAACC,QAAQ,CAACzB,YAAY;gBACxDD,OACEA,QAAQZ,eAAeY,OAAOS,QAAQC,EAAE;gBAE1CiB,MAAK;gBACLN,UAAUA;gBACVjB,SAASA;gBACTwB,MAAK;gBACLC,UACE9B,qBACCG,eAAe,YACdD,YACA,AAAC;oBAAC;oBAAY;iBAAU,CAAuCyB,QAAQ,CAACzB;gBAE5EiB,OAAOb;;0BAGT,KAAChB;gBACCyC,MAAMpB,EAAE;gBACRqB,aAAarB,EAAE;gBACfsB,cAActB,EAAE;gBAChBuB,SAASvB,EAAE;gBACXwB,WAAWvC;gBACXwC,UAAU;oBACR5B,WAAWZ;gBACb;gBACAyC,WAAW;oBACTtB,aAAaH;gBACf;;;;AAIR,EAAC"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
@layer payload-default {
|
|
2
|
+
.tenant-selector {
|
|
3
|
+
border-bottom: var(--stroke-width-small) solid var(--color-border);
|
|
4
|
+
width: calc(100% + var(--nav-padding-block-start) * 2);
|
|
5
|
+
margin-inline-start: calc(-1 * var(--nav-padding-inline-start));
|
|
6
|
+
margin-block-end: var(--spacer-4);
|
|
7
|
+
padding-block-end: var(--spacer-4);
|
|
8
|
+
|
|
9
|
+
.tenant-selector__select {
|
|
10
|
+
margin-inline: var(--nav-padding-inline-start);
|
|
11
|
+
}
|
|
12
|
+
}
|
|
13
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@payloadcms/plugin-multi-tenant",
|
|
3
|
-
"version": "4.0.0-canary.
|
|
3
|
+
"version": "4.0.0-canary.2",
|
|
4
4
|
"description": "Multi Tenant plugin for Payload",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"payload",
|
|
@@ -81,13 +81,13 @@
|
|
|
81
81
|
],
|
|
82
82
|
"devDependencies": {
|
|
83
83
|
"@payloadcms/eslint-config": "3.28.0",
|
|
84
|
-
"@payloadcms/
|
|
85
|
-
"
|
|
86
|
-
"
|
|
84
|
+
"@payloadcms/translations": "4.0.0-canary.2",
|
|
85
|
+
"@payloadcms/ui": "4.0.0-canary.2",
|
|
86
|
+
"payload": "4.0.0-canary.2"
|
|
87
87
|
},
|
|
88
88
|
"peerDependencies": {
|
|
89
|
-
"@payloadcms/ui": "4.0.0-canary.
|
|
90
|
-
"payload": "4.0.0-canary.
|
|
89
|
+
"@payloadcms/ui": "4.0.0-canary.2",
|
|
90
|
+
"payload": "4.0.0-canary.2"
|
|
91
91
|
},
|
|
92
92
|
"homepage:": "https://payloadcms.com",
|
|
93
93
|
"scripts": {
|
|
@@ -1,78 +0,0 @@
|
|
|
1
|
-
@layer payload-default {
|
|
2
|
-
.assign-tenant-field-modal {
|
|
3
|
-
pointer-events: none;
|
|
4
|
-
display: flex;
|
|
5
|
-
align-items: center;
|
|
6
|
-
justify-content: center;
|
|
7
|
-
height: 100%;
|
|
8
|
-
|
|
9
|
-
&[open] {
|
|
10
|
-
pointer-events: auto;
|
|
11
|
-
|
|
12
|
-
.assign-tenant-field-modal__wrapper {
|
|
13
|
-
display: flex;
|
|
14
|
-
}
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
&__bg {
|
|
18
|
-
z-index: -1;
|
|
19
|
-
|
|
20
|
-
&:before {
|
|
21
|
-
content: ' ';
|
|
22
|
-
position: absolute;
|
|
23
|
-
top: 0;
|
|
24
|
-
right: 0;
|
|
25
|
-
bottom: 0;
|
|
26
|
-
left: 0;
|
|
27
|
-
background: var(--theme-bg);
|
|
28
|
-
opacity: 0.8;
|
|
29
|
-
}
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
&__wrapper {
|
|
33
|
-
z-index: 1;
|
|
34
|
-
position: relative;
|
|
35
|
-
display: none;
|
|
36
|
-
flex-direction: column;
|
|
37
|
-
max-width: calc(var(--base) * 30);
|
|
38
|
-
min-width: min(500px, calc(100% - (var(--base) * 2)));
|
|
39
|
-
border-radius: var(--style-radius-m);
|
|
40
|
-
border: var(--stroke-width-small) solid var(--theme-elevation-100);
|
|
41
|
-
background-color: var(--theme-bg);
|
|
42
|
-
justify-content: center;
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
&__header {
|
|
46
|
-
padding: calc(var(--base) * 0.75) var(--base);
|
|
47
|
-
border-bottom: 1px solid var(--theme-elevation-100);
|
|
48
|
-
display: flex;
|
|
49
|
-
flex-direction: row;
|
|
50
|
-
justify-content: space-between;
|
|
51
|
-
gap: calc(var(--base) * 2);
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
&__collection-pill {
|
|
55
|
-
align-self: flex-start;
|
|
56
|
-
flex-shrink: 0;
|
|
57
|
-
}
|
|
58
|
-
|
|
59
|
-
&__content {
|
|
60
|
-
display: flex;
|
|
61
|
-
flex-direction: column;
|
|
62
|
-
gap: calc(var(--base) * 0.5);
|
|
63
|
-
padding: var(--base) var(--base) 0 var(--base);
|
|
64
|
-
}
|
|
65
|
-
|
|
66
|
-
&__controls {
|
|
67
|
-
display: flex;
|
|
68
|
-
gap: calc(var(--base) * 0.5);
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
&__actions {
|
|
72
|
-
display: flex;
|
|
73
|
-
justify-content: flex-end;
|
|
74
|
-
gap: calc(var(--base) * 0.4);
|
|
75
|
-
padding: var(--base);
|
|
76
|
-
}
|
|
77
|
-
}
|
|
78
|
-
}
|
|
@@ -1,52 +0,0 @@
|
|
|
1
|
-
.document-fields__main {
|
|
2
|
-
--tenant-gutter-h-right: var(--main-gutter-h-right);
|
|
3
|
-
--tenant-gutter-h-left: var(--main-gutter-h-left);
|
|
4
|
-
}
|
|
5
|
-
.document-fields__sidebar-fields {
|
|
6
|
-
--tenant-gutter-h-right: var(--sidebar-gutter-h-right);
|
|
7
|
-
--tenant-gutter-h-left: var(--sidebar-gutter-h-left);
|
|
8
|
-
}
|
|
9
|
-
.document-fields__sidebar-fields,
|
|
10
|
-
.document-fields__main {
|
|
11
|
-
.render-fields {
|
|
12
|
-
.tenantField {
|
|
13
|
-
width: calc(100% + var(--tenant-gutter-h-right) + var(--tenant-gutter-h-left));
|
|
14
|
-
margin-left: calc(-1 * var(--tenant-gutter-h-left));
|
|
15
|
-
border-bottom: 1px solid var(--theme-elevation-100);
|
|
16
|
-
padding-top: calc(var(--base) * 1);
|
|
17
|
-
padding-bottom: calc(var(--base) * 1.75);
|
|
18
|
-
|
|
19
|
-
&__wrapper {
|
|
20
|
-
padding-left: var(--tenant-gutter-h-left);
|
|
21
|
-
padding-right: var(--tenant-gutter-h-right);
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
[dir='rtl'] & {
|
|
25
|
-
margin-right: calc(-1 * var(--tenant-gutter-h-right));
|
|
26
|
-
background-image: repeating-linear-gradient(
|
|
27
|
-
-120deg,
|
|
28
|
-
var(--theme-elevation-50) 0px,
|
|
29
|
-
var(--theme-elevation-50) 1px,
|
|
30
|
-
transparent 1px,
|
|
31
|
-
transparent 5px
|
|
32
|
-
);
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
&:not(:first-child) {
|
|
36
|
-
border-top: 1px solid var(--theme-elevation-100);
|
|
37
|
-
margin-top: calc(var(--base) * 1.25);
|
|
38
|
-
}
|
|
39
|
-
&:not(:last-child) {
|
|
40
|
-
margin-bottom: var(--spacing-field);
|
|
41
|
-
}
|
|
42
|
-
&:first-child {
|
|
43
|
-
margin-top: calc(var(--base) * -1.5);
|
|
44
|
-
padding-top: calc(var(--base) * 1.5);
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
&__debug-pill {
|
|
48
|
-
margin-bottom: calc(var(--base) * 0.5);
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
}
|
|
52
|
-
}
|