@payloadcms/plugin-multi-tenant 3.53.0-internal.2dadf5b → 3.53.0

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.
Files changed (47) hide show
  1. package/dist/components/TenantField/index.client.d.ts.map +1 -1
  2. package/dist/components/TenantField/index.client.js +139 -55
  3. package/dist/components/TenantField/index.client.js.map +1 -1
  4. package/dist/components/TenantField/index.scss +47 -13
  5. package/dist/components/TenantSelector/index.client.d.ts +10 -0
  6. package/dist/components/TenantSelector/index.client.d.ts.map +1 -0
  7. package/dist/components/TenantSelector/index.client.js +85 -0
  8. package/dist/components/TenantSelector/index.client.js.map +1 -0
  9. package/dist/components/TenantSelector/index.d.ts +8 -7
  10. package/dist/components/TenantSelector/index.d.ts.map +1 -1
  11. package/dist/components/TenantSelector/index.js +9 -128
  12. package/dist/components/TenantSelector/index.js.map +1 -1
  13. package/dist/exports/client.d.ts +0 -1
  14. package/dist/exports/client.d.ts.map +1 -1
  15. package/dist/exports/client.js +0 -1
  16. package/dist/exports/client.js.map +1 -1
  17. package/dist/exports/rsc.d.ts +1 -0
  18. package/dist/exports/rsc.d.ts.map +1 -1
  19. package/dist/exports/rsc.js +1 -0
  20. package/dist/exports/rsc.js.map +1 -1
  21. package/dist/fields/tenantField/index.d.ts +3 -1
  22. package/dist/fields/tenantField/index.d.ts.map +1 -1
  23. package/dist/fields/tenantField/index.js +61 -30
  24. package/dist/fields/tenantField/index.js.map +1 -1
  25. package/dist/index.d.ts.map +1 -1
  26. package/dist/index.js +78 -1
  27. package/dist/index.js.map +1 -1
  28. package/dist/providers/TenantSelectionProvider/index.client.d.ts.map +1 -1
  29. package/dist/providers/TenantSelectionProvider/index.client.js +83 -38
  30. package/dist/providers/TenantSelectionProvider/index.client.js.map +1 -1
  31. package/dist/translations/languages/zhTw.js +1 -1
  32. package/dist/translations/languages/zhTw.js.map +1 -1
  33. package/dist/utilities/addCollectionAccess.d.ts.map +1 -1
  34. package/dist/utilities/addCollectionAccess.js +0 -1
  35. package/dist/utilities/addCollectionAccess.js.map +1 -1
  36. package/dist/utilities/addFilterOptionsToFields.d.ts +3 -1
  37. package/dist/utilities/addFilterOptionsToFields.d.ts.map +1 -1
  38. package/dist/utilities/addFilterOptionsToFields.js +21 -35
  39. package/dist/utilities/addFilterOptionsToFields.js.map +1 -1
  40. package/dist/utilities/generateCookie.d.ts +26 -0
  41. package/dist/utilities/generateCookie.d.ts.map +1 -0
  42. package/dist/utilities/generateCookie.js +61 -0
  43. package/dist/utilities/generateCookie.js.map +1 -0
  44. package/dist/utilities/withTenantAccess.d.ts +1 -2
  45. package/dist/utilities/withTenantAccess.d.ts.map +1 -1
  46. package/dist/utilities/withTenantAccess.js.map +1 -1
  47. package/package.json +6 -6
@@ -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;AAG3D,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,cAAc,CAAA;AAIrB,KAAK,KAAK,GAAG;IACX,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,GAAG,4BAA4B,CAAA;AAEhC,eAAO,MAAM,WAAW,SAAU,KAAK,6BA2DtC,CAAA"}
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;AAaxE,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB,OAAO,cAAc,CAAA;AAKrB,KAAK,KAAK,GAAG;IACX,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,GAAG,4BAA4B,CAAA;AAEhC,eAAO,MAAM,WAAW,SAAU,KAAK,6BAgDtC,CAAA"}
@@ -1,80 +1,164 @@
1
1
  'use client';
2
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import { RelationshipField, useField, useFormModified } from '@payloadcms/ui';
2
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
3
+ import { getTranslation } from '@payloadcms/translations';
4
+ import { ConfirmationModal, RelationshipField, Translation, useField, useForm, useFormModified, useModal, useTranslation } from '@payloadcms/ui';
4
5
  import React from 'react';
5
- import { useTenantSelection } from '../../providers/TenantSelectionProvider/index.client.js';
6
6
  import './index.scss';
7
+ import { useTenantSelection } from '../../providers/TenantSelectionProvider/index.client.js';
7
8
  const baseClass = 'tenantField';
8
9
  export const TenantField = (args)=>{
9
- const { debug, unique } = args;
10
- const { setValue, value } = useField();
11
- const modified = useFormModified();
12
- const { options, selectedTenantID, setEntityType: setEntityType, setModified, setTenant } = useTenantSelection();
13
- const hasSetValueRef = React.useRef(false);
10
+ const { entityType, options, selectedTenantID, setEntityType, setTenant } = useTenantSelection();
11
+ const { value } = useField();
14
12
  React.useEffect(()=>{
15
- if (!hasSetValueRef.current) {
16
- // set value on load
17
- if (value && value !== selectedTenantID) {
18
- setTenant({
19
- id: value,
20
- refresh: unique
21
- });
22
- } else {
23
- // in the document view, the tenant field should always have a value
24
- const defaultValue = selectedTenantID || options[0]?.value;
25
- setTenant({
26
- id: defaultValue,
27
- refresh: unique
28
- });
13
+ if (!entityType) {
14
+ setEntityType(args.unique ? 'global' : 'document');
15
+ } else {
16
+ // unique documents are controlled from the global TenantSelector
17
+ if (!args.unique && value) {
18
+ if (!selectedTenantID || value !== selectedTenantID) {
19
+ setTenant({
20
+ id: value,
21
+ refresh: false
22
+ });
23
+ }
29
24
  }
30
- hasSetValueRef.current = true;
31
- } else if (!value || value !== selectedTenantID) {
32
- // Update the field on the document value when the tenant is changed
33
- setValue(selectedTenantID, !value || value === selectedTenantID);
34
25
  }
26
+ return ()=>{
27
+ if (entityType) {
28
+ setEntityType(undefined);
29
+ }
30
+ };
35
31
  }, [
36
- value,
32
+ args.unique,
33
+ options,
37
34
  selectedTenantID,
38
35
  setTenant,
39
- setValue,
36
+ value,
37
+ setEntityType,
38
+ entityType
39
+ ]);
40
+ if (options.length > 1) {
41
+ return /*#__PURE__*/ _jsxs(_Fragment, {
42
+ children: [
43
+ /*#__PURE__*/ _jsx("div", {
44
+ className: baseClass,
45
+ children: /*#__PURE__*/ _jsx("div", {
46
+ className: `${baseClass}__wrapper`,
47
+ children: /*#__PURE__*/ _jsx(RelationshipField, {
48
+ ...args,
49
+ field: {
50
+ ...args.field,
51
+ required: true
52
+ },
53
+ readOnly: args.readOnly || args.unique
54
+ })
55
+ })
56
+ }),
57
+ args.unique ? /*#__PURE__*/ _jsx(SyncFormModified, {}) : /*#__PURE__*/ _jsx(ConfirmTenantChange, {
58
+ fieldLabel: args.field.label,
59
+ fieldPath: args.path
60
+ })
61
+ ]
62
+ });
63
+ }
64
+ return null;
65
+ };
66
+ const confirmSwitchTenantSlug = 'confirm-switch-tenant';
67
+ const ConfirmTenantChange = ({ fieldLabel, fieldPath })=>{
68
+ const { options, selectedTenantID, setTenant } = useTenantSelection();
69
+ const { setValue: setTenantFormValue, value: tenantFormValue } = useField({
70
+ path: fieldPath
71
+ });
72
+ const { setModified } = useForm();
73
+ const modified = useFormModified();
74
+ const { i18n, t } = useTranslation();
75
+ const { isModalOpen, openModal } = useModal();
76
+ const prevTenantValueRef = React.useRef(tenantFormValue || null);
77
+ const [tenantToConfirm, setTenantToConfirm] = React.useState(tenantFormValue || null);
78
+ const fromTenantOption = React.useMemo(()=>{
79
+ if (tenantFormValue) {
80
+ return options.find((option)=>option.value === tenantFormValue);
81
+ }
82
+ return undefined;
83
+ }, [
40
84
  options,
41
- unique
85
+ tenantFormValue
42
86
  ]);
87
+ const toTenantOption = React.useMemo(()=>{
88
+ if (tenantToConfirm) {
89
+ return options.find((option)=>option.value === tenantToConfirm);
90
+ }
91
+ return undefined;
92
+ }, [
93
+ options,
94
+ tenantToConfirm
95
+ ]);
96
+ const modalIsOpen = isModalOpen(confirmSwitchTenantSlug);
97
+ const testRef = React.useRef(false);
43
98
  React.useEffect(()=>{
44
- setEntityType(unique ? 'global' : 'document');
45
- return ()=>{
46
- setEntityType(undefined);
47
- };
99
+ // the form value changed
100
+ if (!modalIsOpen && tenantFormValue && prevTenantValueRef.current && tenantFormValue !== prevTenantValueRef.current) {
101
+ // revert the form value change temporarily
102
+ setTenantFormValue(prevTenantValueRef.current, true);
103
+ // save the tenant to confirm in modal
104
+ setTenantToConfirm(tenantFormValue);
105
+ // open confirmation modal
106
+ openModal(confirmSwitchTenantSlug);
107
+ }
48
108
  }, [
49
- unique,
50
- setEntityType
109
+ tenantFormValue,
110
+ setTenantFormValue,
111
+ openModal,
112
+ setTenant,
113
+ selectedTenantID,
114
+ modalIsOpen,
115
+ modified
51
116
  ]);
117
+ return /*#__PURE__*/ _jsx(ConfirmationModal, {
118
+ body: /*#__PURE__*/ _jsx(Translation, {
119
+ elements: {
120
+ 0: ({ children })=>{
121
+ return /*#__PURE__*/ _jsx("b", {
122
+ children: children
123
+ });
124
+ }
125
+ },
126
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment
127
+ // @ts-expect-error
128
+ i18nKey: "plugin-multi-tenant:confirm-modal-tenant-switch--body",
129
+ t: t,
130
+ variables: {
131
+ fromTenant: fromTenantOption?.label,
132
+ toTenant: toTenantOption?.label
133
+ }
134
+ }),
135
+ heading: t('plugin-multi-tenant:confirm-modal-tenant-switch--heading', {
136
+ tenantLabel: fieldLabel ? getTranslation(fieldLabel, i18n) : t('plugin-multi-tenant:nav-tenantSelector-label')
137
+ }),
138
+ modalSlug: confirmSwitchTenantSlug,
139
+ onCancel: ()=>{
140
+ setModified(testRef.current);
141
+ },
142
+ onConfirm: ()=>{
143
+ // set the form value to the tenant to confirm
144
+ prevTenantValueRef.current = tenantToConfirm;
145
+ setTenantFormValue(tenantToConfirm);
146
+ }
147
+ });
148
+ };
149
+ /**
150
+ * Tells the global selector when the form has been modified
151
+ * so it can display the "Leave without saving" confirmation modal
152
+ * if modified and attempting to change the tenant
153
+ */ const SyncFormModified = ()=>{
154
+ const modified = useFormModified();
155
+ const { setModified } = useTenantSelection();
52
156
  React.useEffect(()=>{
53
- // sync form modified state with the tenant selection provider context
54
157
  setModified(modified);
55
- return ()=>{
56
- setModified(false);
57
- };
58
158
  }, [
59
159
  modified,
60
160
  setModified
61
161
  ]);
62
- if (debug) {
63
- return /*#__PURE__*/ _jsxs("div", {
64
- className: baseClass,
65
- children: [
66
- /*#__PURE__*/ _jsx("div", {
67
- className: `${baseClass}__wrapper`,
68
- children: /*#__PURE__*/ _jsx(RelationshipField, {
69
- ...args
70
- })
71
- }),
72
- /*#__PURE__*/ _jsx("div", {
73
- className: `${baseClass}__hr`
74
- })
75
- ]
76
- });
77
- }
78
162
  return null;
79
163
  };
80
164
 
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/TenantField/index.client.tsx"],"sourcesContent":["'use client'\n\nimport type { RelationshipFieldClientProps } from 'payload'\n\nimport { RelationshipField, useField, useFormModified } from '@payloadcms/ui'\nimport React from 'react'\n\nimport { useTenantSelection } from '../../providers/TenantSelectionProvider/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 = (args: Props) => {\n const { debug, unique } = args\n const { setValue, value } = useField<number | string>()\n const modified = useFormModified()\n const {\n options,\n selectedTenantID,\n setEntityType: setEntityType,\n setModified,\n setTenant,\n } = useTenantSelection()\n\n const hasSetValueRef = React.useRef(false)\n\n React.useEffect(() => {\n if (!hasSetValueRef.current) {\n // set value on load\n if (value && value !== selectedTenantID) {\n setTenant({ id: value, refresh: unique })\n } else {\n // in the document view, the tenant field should always have a value\n const defaultValue = selectedTenantID || options[0]?.value\n setTenant({ id: defaultValue, refresh: unique })\n }\n hasSetValueRef.current = true\n } else if (!value || value !== selectedTenantID) {\n // Update the field on the document value when the tenant is changed\n setValue(selectedTenantID, !value || value === selectedTenantID)\n }\n }, [value, selectedTenantID, setTenant, setValue, options, unique])\n\n React.useEffect(() => {\n setEntityType(unique ? 'global' : 'document')\n return () => {\n setEntityType(undefined)\n }\n }, [unique, setEntityType])\n\n React.useEffect(() => {\n // sync form modified state with the tenant selection provider context\n setModified(modified)\n\n return () => {\n setModified(false)\n }\n }, [modified, setModified])\n\n if (debug) {\n return (\n <div className={baseClass}>\n <div className={`${baseClass}__wrapper`}>\n <RelationshipField {...args} />\n </div>\n <div className={`${baseClass}__hr`} />\n </div>\n )\n }\n\n return null\n}\n"],"names":["RelationshipField","useField","useFormModified","React","useTenantSelection","baseClass","TenantField","args","debug","unique","setValue","value","modified","options","selectedTenantID","setEntityType","setModified","setTenant","hasSetValueRef","useRef","useEffect","current","id","refresh","defaultValue","undefined","div","className"],"mappings":"AAAA;;AAIA,SAASA,iBAAiB,EAAEC,QAAQ,EAAEC,eAAe,QAAQ,iBAAgB;AAC7E,OAAOC,WAAW,QAAO;AAEzB,SAASC,kBAAkB,QAAQ,0DAAyD;AAC5F,OAAO,eAAc;AAErB,MAAMC,YAAY;AAOlB,OAAO,MAAMC,cAAc,CAACC;IAC1B,MAAM,EAAEC,KAAK,EAAEC,MAAM,EAAE,GAAGF;IAC1B,MAAM,EAAEG,QAAQ,EAAEC,KAAK,EAAE,GAAGV;IAC5B,MAAMW,WAAWV;IACjB,MAAM,EACJW,OAAO,EACPC,gBAAgB,EAChBC,eAAeA,aAAa,EAC5BC,WAAW,EACXC,SAAS,EACV,GAAGb;IAEJ,MAAMc,iBAAiBf,MAAMgB,MAAM,CAAC;IAEpChB,MAAMiB,SAAS,CAAC;QACd,IAAI,CAACF,eAAeG,OAAO,EAAE;YAC3B,oBAAoB;YACpB,IAAIV,SAASA,UAAUG,kBAAkB;gBACvCG,UAAU;oBAAEK,IAAIX;oBAAOY,SAASd;gBAAO;YACzC,OAAO;gBACL,oEAAoE;gBACpE,MAAMe,eAAeV,oBAAoBD,OAAO,CAAC,EAAE,EAAEF;gBACrDM,UAAU;oBAAEK,IAAIE;oBAAcD,SAASd;gBAAO;YAChD;YACAS,eAAeG,OAAO,GAAG;QAC3B,OAAO,IAAI,CAACV,SAASA,UAAUG,kBAAkB;YAC/C,oEAAoE;YACpEJ,SAASI,kBAAkB,CAACH,SAASA,UAAUG;QACjD;IACF,GAAG;QAACH;QAAOG;QAAkBG;QAAWP;QAAUG;QAASJ;KAAO;IAElEN,MAAMiB,SAAS,CAAC;QACdL,cAAcN,SAAS,WAAW;QAClC,OAAO;YACLM,cAAcU;QAChB;IACF,GAAG;QAAChB;QAAQM;KAAc;IAE1BZ,MAAMiB,SAAS,CAAC;QACd,sEAAsE;QACtEJ,YAAYJ;QAEZ,OAAO;YACLI,YAAY;QACd;IACF,GAAG;QAACJ;QAAUI;KAAY;IAE1B,IAAIR,OAAO;QACT,qBACE,MAACkB;YAAIC,WAAWtB;;8BACd,KAACqB;oBAAIC,WAAW,GAAGtB,UAAU,SAAS,CAAC;8BACrC,cAAA,KAACL;wBAAmB,GAAGO,IAAI;;;8BAE7B,KAACmB;oBAAIC,WAAW,GAAGtB,UAAU,IAAI,CAAC;;;;IAGxC;IAEA,OAAO;AACT,EAAC"}
1
+ {"version":3,"sources":["../../../src/components/TenantField/index.client.tsx"],"sourcesContent":["'use client'\n\nimport type { RelationshipFieldClientProps, StaticLabel } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport {\n ConfirmationModal,\n RelationshipField,\n Translation,\n useField,\n useForm,\n useFormModified,\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 './index.scss'\nimport { useTenantSelection } from '../../providers/TenantSelectionProvider/index.client.js'\n\nconst baseClass = 'tenantField'\n\ntype Props = {\n debug?: boolean\n unique?: boolean\n} & RelationshipFieldClientProps\n\nexport const TenantField = (args: Props) => {\n const { entityType, options, selectedTenantID, setEntityType, setTenant } = useTenantSelection()\n const { value } = useField<number | string>()\n\n React.useEffect(() => {\n if (!entityType) {\n setEntityType(args.unique ? 'global' : 'document')\n } else {\n // unique documents are controlled from the global TenantSelector\n if (!args.unique && value) {\n if (!selectedTenantID || value !== selectedTenantID) {\n setTenant({ id: value, refresh: false })\n }\n }\n }\n\n return () => {\n if (entityType) {\n setEntityType(undefined)\n }\n }\n }, [args.unique, options, selectedTenantID, setTenant, value, setEntityType, entityType])\n\n if (options.length > 1) {\n return (\n <>\n <div className={baseClass}>\n <div className={`${baseClass}__wrapper`}>\n <RelationshipField\n {...args}\n field={{\n ...args.field,\n required: true,\n }}\n readOnly={args.readOnly || args.unique}\n />\n </div>\n </div>\n {args.unique ? (\n <SyncFormModified />\n ) : (\n <ConfirmTenantChange fieldLabel={args.field.label} fieldPath={args.path} />\n )}\n </>\n )\n }\n\n return null\n}\n\nconst confirmSwitchTenantSlug = 'confirm-switch-tenant'\n\nconst ConfirmTenantChange = ({\n fieldLabel,\n fieldPath,\n}: {\n fieldLabel?: StaticLabel\n fieldPath: string\n}) => {\n const { options, selectedTenantID, setTenant } = useTenantSelection()\n const { setValue: setTenantFormValue, value: tenantFormValue } = useField<null | number | string>(\n { path: fieldPath },\n )\n const { setModified } = useForm()\n const modified = useFormModified()\n const { i18n, t } = useTranslation<\n PluginMultiTenantTranslations,\n PluginMultiTenantTranslationKeys\n >()\n const { isModalOpen, openModal } = useModal()\n\n const prevTenantValueRef = React.useRef<null | number | string>(tenantFormValue || null)\n const [tenantToConfirm, setTenantToConfirm] = React.useState<null | number | string>(\n tenantFormValue || null,\n )\n\n const fromTenantOption = React.useMemo(() => {\n if (tenantFormValue) {\n return options.find((option) => option.value === tenantFormValue)\n }\n return undefined\n }, [options, tenantFormValue])\n\n const toTenantOption = React.useMemo(() => {\n if (tenantToConfirm) {\n return options.find((option) => option.value === tenantToConfirm)\n }\n return undefined\n }, [options, tenantToConfirm])\n\n const modalIsOpen = isModalOpen(confirmSwitchTenantSlug)\n const testRef = React.useRef<boolean>(false)\n\n React.useEffect(() => {\n // the form value changed\n if (\n !modalIsOpen &&\n tenantFormValue &&\n prevTenantValueRef.current &&\n tenantFormValue !== prevTenantValueRef.current\n ) {\n // revert the form value change temporarily\n setTenantFormValue(prevTenantValueRef.current, true)\n // save the tenant to confirm in modal\n setTenantToConfirm(tenantFormValue)\n // open confirmation modal\n openModal(confirmSwitchTenantSlug)\n }\n }, [\n tenantFormValue,\n setTenantFormValue,\n openModal,\n setTenant,\n selectedTenantID,\n modalIsOpen,\n modified,\n ])\n\n return (\n <ConfirmationModal\n body={\n <Translation\n elements={{\n 0: ({ children }) => {\n return <b>{children}</b>\n },\n }}\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-expect-error\n i18nKey=\"plugin-multi-tenant:confirm-modal-tenant-switch--body\"\n t={t}\n variables={{\n fromTenant: fromTenantOption?.label,\n toTenant: toTenantOption?.label,\n }}\n />\n }\n heading={t('plugin-multi-tenant:confirm-modal-tenant-switch--heading', {\n tenantLabel: fieldLabel\n ? getTranslation(fieldLabel, i18n)\n : t('plugin-multi-tenant:nav-tenantSelector-label'),\n })}\n modalSlug={confirmSwitchTenantSlug}\n onCancel={() => {\n setModified(testRef.current)\n }}\n onConfirm={() => {\n // set the form value to the tenant to confirm\n prevTenantValueRef.current = tenantToConfirm\n setTenantFormValue(tenantToConfirm)\n }}\n />\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":["getTranslation","ConfirmationModal","RelationshipField","Translation","useField","useForm","useFormModified","useModal","useTranslation","React","useTenantSelection","baseClass","TenantField","args","entityType","options","selectedTenantID","setEntityType","setTenant","value","useEffect","unique","id","refresh","undefined","length","div","className","field","required","readOnly","SyncFormModified","ConfirmTenantChange","fieldLabel","label","fieldPath","path","confirmSwitchTenantSlug","setValue","setTenantFormValue","tenantFormValue","setModified","modified","i18n","t","isModalOpen","openModal","prevTenantValueRef","useRef","tenantToConfirm","setTenantToConfirm","useState","fromTenantOption","useMemo","find","option","toTenantOption","modalIsOpen","testRef","current","body","elements","children","b","i18nKey","variables","fromTenant","toTenant","heading","tenantLabel","modalSlug","onCancel","onConfirm"],"mappings":"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"}
@@ -1,14 +1,48 @@
1
- .tenantField {
2
- &__wrapper {
3
- margin-top: calc(-.75 * var(--spacing-field));
4
- margin-bottom: var(--spacing-field);
5
- width: 25%;
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
+ }
6
47
  }
7
- &__hr {
8
- width: calc(100% + 2 * var(--gutter-h));
9
- margin-left: calc(-1 * var(--gutter-h));
10
- background-color: var(--theme-elevation-100);
11
- height: 1px;
12
- margin-bottom: var(--spacing-field);
13
- }
14
- }
48
+ }
@@ -0,0 +1,10 @@
1
+ import type { ViewTypes } from 'payload';
2
+ import React from 'react';
3
+ import type { MultiTenantPluginConfig } from '../../types.js';
4
+ import './index.scss';
5
+ export declare const TenantSelectorClient: ({ disabled: disabledFromProps, label, viewType, }: {
6
+ disabled?: boolean;
7
+ label?: MultiTenantPluginConfig["tenantSelectorLabel"];
8
+ viewType?: ViewTypes;
9
+ }) => React.JSX.Element | null;
10
+ //# sourceMappingURL=index.client.d.ts.map
@@ -0,0 +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,cAAc,CAAA;AAIrB,eAAO,MAAM,oBAAoB,sDAI9B;IACD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,uBAAuB,CAAC,qBAAqB,CAAC,CAAA;IACtD,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB,6BAgFA,CAAA"}
@@ -0,0 +1,85 @@
1
+ 'use client';
2
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
+ import { getTranslation } from '@payloadcms/translations';
4
+ import { ConfirmationModal, SelectInput, useModal, useTranslation } from '@payloadcms/ui';
5
+ import React from 'react';
6
+ import { useTenantSelection } from '../../providers/TenantSelectionProvider/index.client.js';
7
+ import './index.scss';
8
+ const confirmLeaveWithoutSavingSlug = 'confirm-leave-without-saving';
9
+ export const TenantSelectorClient = ({ disabled: disabledFromProps, label, viewType })=>{
10
+ const { entityType, modified, options, selectedTenantID, setTenant } = useTenantSelection();
11
+ const { closeModal, openModal } = useModal();
12
+ const { i18n, t } = useTranslation();
13
+ const [tenantSelection, setTenantSelection] = React.useState();
14
+ const switchTenant = React.useCallback((option)=>{
15
+ if (option && 'value' in option) {
16
+ setTenant({
17
+ id: option.value,
18
+ refresh: true
19
+ });
20
+ } else {
21
+ setTenant({
22
+ id: undefined,
23
+ refresh: true
24
+ });
25
+ }
26
+ }, [
27
+ setTenant
28
+ ]);
29
+ const onChange = React.useCallback((option)=>{
30
+ if (option && 'value' in option && option.value === selectedTenantID) {
31
+ // If the selected option is the same as the current tenant, do nothing
32
+ return;
33
+ }
34
+ if (entityType === 'global' && modified) {
35
+ // If the entityType is 'global' and there are unsaved changes, prompt for confirmation
36
+ setTenantSelection(option);
37
+ openModal(confirmLeaveWithoutSavingSlug);
38
+ } else {
39
+ // If the entityType is not 'document', switch tenant without confirmation
40
+ switchTenant(option);
41
+ }
42
+ }, [
43
+ selectedTenantID,
44
+ entityType,
45
+ modified,
46
+ switchTenant,
47
+ openModal
48
+ ]);
49
+ if (options.length <= 1) {
50
+ return null;
51
+ }
52
+ return /*#__PURE__*/ _jsxs("div", {
53
+ className: "tenant-selector",
54
+ children: [
55
+ /*#__PURE__*/ _jsx(SelectInput, {
56
+ isClearable: viewType === 'list',
57
+ label: label ? getTranslation(label, i18n) : t('plugin-multi-tenant:nav-tenantSelector-label'),
58
+ name: "setTenant",
59
+ onChange: onChange,
60
+ options: options,
61
+ path: "setTenant",
62
+ readOnly: disabledFromProps || entityType !== 'global' && viewType && [
63
+ 'document',
64
+ 'version'
65
+ ].includes(viewType),
66
+ value: selectedTenantID
67
+ }),
68
+ /*#__PURE__*/ _jsx(ConfirmationModal, {
69
+ body: t('general:changesNotSaved'),
70
+ cancelLabel: t('general:stayOnThisPage'),
71
+ confirmLabel: t('general:leaveAnyway'),
72
+ heading: t('general:leaveWithoutSaving'),
73
+ modalSlug: confirmLeaveWithoutSavingSlug,
74
+ onCancel: ()=>{
75
+ closeModal(confirmLeaveWithoutSavingSlug);
76
+ },
77
+ onConfirm: ()=>{
78
+ switchTenant(tenantSelection);
79
+ }
80
+ })
81
+ ]
82
+ });
83
+ };
84
+
85
+ //# sourceMappingURL=index.client.js.map
@@ -0,0 +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.scss'\n\nconst confirmLeaveWithoutSavingSlug = 'confirm-leave-without-saving'\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=\"tenant-selector\">\n <SelectInput\n isClearable={viewType === 'list'}\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","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","name","path","readOnly","includes","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,eAAc;AAErB,MAAMC,gCAAgC;AAEtC,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,GAAGX;IACvE,MAAM,EAAEY,UAAU,EAAEC,SAAS,EAAE,GAAGhB;IAClC,MAAM,EAAEiB,IAAI,EAAEC,CAAC,EAAE,GAAGjB;IAIpB,MAAM,CAACkB,iBAAiBC,mBAAmB,GAAGlB,MAAMmB,QAAQ;IAI5D,MAAMC,eAAepB,MAAMqB,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,WAAW3B,MAAMqB,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,UAAUZ;QACZ,OAAO;YACL,0EAA0E;YAC1EkB,aAAaE;QACf;IACF,GACA;QAACX;QAAkBH;QAAYC;QAAUW;QAAcN;KAAU;IAGnE,IAAIJ,QAAQkB,MAAM,IAAI,GAAG;QACvB,OAAO;IACT;IAEA,qBACE,MAACC;QAAIC,WAAU;;0BACb,KAACjC;gBACCkC,aAAaxB,aAAa;gBAC1BD,OACEA,QAAQX,eAAeW,OAAOS,QAAQC,EAAE;gBAE1CgB,MAAK;gBACLL,UAAUA;gBACVjB,SAASA;gBACTuB,MAAK;gBACLC,UACE7B,qBACCG,eAAe,YACdD,YACA,AAAC;oBAAC;oBAAY;iBAAU,CAAuC4B,QAAQ,CAAC5B;gBAE5EiB,OAAOb;;0BAGT,KAACf;gBACCwC,MAAMpB,EAAE;gBACRqB,aAAarB,EAAE;gBACfsB,cAActB,EAAE;gBAChBuB,SAASvB,EAAE;gBACXwB,WAAWtC;gBACXuC,UAAU;oBACR5B,WAAWX;gBACb;gBACAwC,WAAW;oBACTtB,aAAaH;gBACf;;;;AAIR,EAAC"}
@@ -1,8 +1,9 @@
1
- import type { ViewTypes } from 'payload';
2
- import React from 'react';
3
- import './index.scss';
4
- export declare const TenantSelector: ({ label, viewType }: {
5
- label: string;
6
- viewType?: ViewTypes;
7
- }) => React.JSX.Element | null;
1
+ import type { ServerProps } from 'payload';
2
+ import type { MultiTenantPluginConfig } from '../../types.js';
3
+ type Props = {
4
+ enabledSlugs: string[];
5
+ label: MultiTenantPluginConfig['tenantSelectorLabel'];
6
+ } & ServerProps;
7
+ export declare const TenantSelector: (props: Props) => import("react").JSX.Element;
8
+ export {};
8
9
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/TenantSelector/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAUxC,OAAO,KAAK,MAAM,OAAO,CAAA;AAQzB,OAAO,cAAc,CAAA;AAKrB,eAAO,MAAM,cAAc,wBAAyB;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,SAAS,CAAA;CAAE,6BA2H1F,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/TenantSelector/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAE1C,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAA;AAI7D,KAAK,KAAK,GAAG;IACX,YAAY,EAAE,MAAM,EAAE,CAAA;IACtB,KAAK,EAAE,uBAAuB,CAAC,qBAAqB,CAAC,CAAA;CACtD,GAAG,WAAW,CAAA;AACf,eAAO,MAAM,cAAc,UAAW,KAAK,gCAW1C,CAAA"}
@@ -1,131 +1,12 @@
1
- 'use client';
2
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import { getTranslation } from '@payloadcms/translations';
4
- import { ConfirmationModal, SelectInput, Translation, useModal, useTranslation } from '@payloadcms/ui';
5
- import React from 'react';
6
- import { useTenantSelection } from '../../providers/TenantSelectionProvider/index.client.js';
7
- import './index.scss';
8
- const confirmSwitchTenantSlug = 'confirm-switch-tenant';
9
- const confirmLeaveWithoutSavingSlug = 'confirm-leave-without-saving';
10
- export const TenantSelector = ({ label, viewType })=>{
11
- const { entityType, modified, options, selectedTenantID, setTenant } = useTenantSelection();
12
- const { closeModal, openModal } = useModal();
13
- const { i18n, t } = useTranslation();
14
- const [tenantSelection, setTenantSelection] = React.useState();
15
- const selectedValue = React.useMemo(()=>{
16
- if (selectedTenantID) {
17
- return options.find((option)=>option.value === selectedTenantID);
18
- }
19
- return undefined;
20
- }, [
21
- options,
22
- selectedTenantID
23
- ]);
24
- const newSelectedValue = React.useMemo(()=>{
25
- if (tenantSelection && 'value' in tenantSelection) {
26
- return options.find((option)=>option.value === tenantSelection.value);
27
- }
28
- return undefined;
29
- }, [
30
- options,
31
- tenantSelection
32
- ]);
33
- const switchTenant = React.useCallback((option)=>{
34
- if (option && 'value' in option) {
35
- setTenant({
36
- id: option.value,
37
- refresh: true
38
- });
39
- } else {
40
- setTenant({
41
- id: undefined,
42
- refresh: true
43
- });
44
- }
45
- }, [
46
- setTenant
47
- ]);
48
- const onChange = React.useCallback((option)=>{
49
- if (option && 'value' in option && option.value === selectedTenantID) {
50
- // If the selected option is the same as the current tenant, do nothing
51
- return;
52
- }
53
- if (entityType !== 'document') {
54
- if (entityType === 'global' && modified) {
55
- // If the entityType is 'global' and there are unsaved changes, prompt for confirmation
56
- setTenantSelection(option);
57
- openModal(confirmLeaveWithoutSavingSlug);
58
- } else {
59
- // If the entityType is not 'document', switch tenant without confirmation
60
- switchTenant(option);
61
- }
62
- } else {
63
- // non-unique documents should always prompt for confirmation
64
- setTenantSelection(option);
65
- openModal(confirmSwitchTenantSlug);
66
- }
67
- }, [
68
- selectedTenantID,
69
- entityType,
70
- modified,
71
- switchTenant,
72
- openModal
73
- ]);
74
- if (options.length <= 1) {
75
- return null;
76
- }
77
- return /*#__PURE__*/ _jsxs("div", {
78
- className: "tenant-selector",
79
- children: [
80
- /*#__PURE__*/ _jsx(SelectInput, {
81
- isClearable: viewType === 'list',
82
- label: label ? getTranslation(label, i18n) : t('plugin-multi-tenant:nav-tenantSelector-label'),
83
- name: "setTenant",
84
- onChange: onChange,
85
- options: options,
86
- path: "setTenant",
87
- value: selectedTenantID
88
- }),
89
- /*#__PURE__*/ _jsx(ConfirmationModal, {
90
- body: /*#__PURE__*/ _jsx(Translation, {
91
- elements: {
92
- 0: ({ children })=>{
93
- return /*#__PURE__*/ _jsx("b", {
94
- children: children
95
- });
96
- }
97
- },
98
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
99
- // @ts-expect-error
100
- i18nKey: "plugin-multi-tenant:confirm-modal-tenant-switch--body",
101
- t: t,
102
- variables: {
103
- fromTenant: selectedValue?.label,
104
- toTenant: newSelectedValue?.label
105
- }
106
- }),
107
- heading: t('plugin-multi-tenant:confirm-modal-tenant-switch--heading', {
108
- tenantLabel: label ? getTranslation(label, i18n) : t('plugin-multi-tenant:nav-tenantSelector-label')
109
- }),
110
- modalSlug: confirmSwitchTenantSlug,
111
- onConfirm: ()=>{
112
- switchTenant(tenantSelection);
113
- }
114
- }),
115
- /*#__PURE__*/ _jsx(ConfirmationModal, {
116
- body: t('general:changesNotSaved'),
117
- cancelLabel: t('general:stayOnThisPage'),
118
- confirmLabel: t('general:leaveAnyway'),
119
- heading: t('general:leaveWithoutSaving'),
120
- modalSlug: confirmLeaveWithoutSavingSlug,
121
- onCancel: ()=>{
122
- closeModal(confirmLeaveWithoutSavingSlug);
123
- },
124
- onConfirm: ()=>{
125
- switchTenant(tenantSelection);
126
- }
127
- })
128
- ]
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { TenantSelectorClient } from './index.client.js';
3
+ export const TenantSelector = (props)=>{
4
+ const { enabledSlugs, label, params, viewType } = props;
5
+ const enabled = Boolean(params?.segments && Array.isArray(params.segments) && params.segments[0] === 'collections' && params.segments[1] && enabledSlugs.includes(params.segments[1]));
6
+ return /*#__PURE__*/ _jsx(TenantSelectorClient, {
7
+ disabled: !enabled,
8
+ label: label,
9
+ viewType: viewType
129
10
  });
130
11
  };
131
12