@webiny/app-headless-cms 5.25.0-beta.4 → 5.25.0-beta.5

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.
@@ -19,6 +19,23 @@ var FormWrapper = /*#__PURE__*/styled("div", {
19
19
  height: "calc(100vh - 260px)",
20
20
  overflow: "auto"
21
21
  });
22
+
23
+ function omitTypename(key, value) {
24
+ return key === "__typename" ? undefined : value;
25
+ }
26
+
27
+ var stringify = function stringify(value) {
28
+ return JSON.stringify(value || {}, omitTypename);
29
+ };
30
+
31
+ var isDifferent = function isDifferent(value, compare) {
32
+ if (!value && !compare) {
33
+ return false;
34
+ }
35
+
36
+ return stringify(value) !== stringify(compare);
37
+ };
38
+
22
39
  export var ContentEntryForm = function ContentEntryForm(_ref) {
23
40
  var onForm = _ref.onForm,
24
41
  props = _objectWithoutProperties(_ref, _excluded);
@@ -27,7 +44,7 @@ export var ContentEntryForm = function ContentEntryForm(_ref) {
27
44
 
28
45
  var _useContentEntryForm = useContentEntryForm(props),
29
46
  loading = _useContentEntryForm.loading,
30
- data = _useContentEntryForm.data,
47
+ initialData = _useContentEntryForm.data,
31
48
  _onChange = _useContentEntryForm.onChange,
32
49
  _onSubmit = _useContentEntryForm.onSubmit,
33
50
  invalidFields = _useContentEntryForm.invalidFields;
@@ -47,7 +64,7 @@ export var ContentEntryForm = function ContentEntryForm(_ref) {
47
64
  }
48
65
 
49
66
  setIsDirty(false);
50
- }, [data]);
67
+ }, [initialData]);
51
68
 
52
69
  var _useSnackbar = useSnackbar(),
53
70
  showSnackbar = _useSnackbar.showSnackbar;
@@ -94,14 +111,19 @@ export var ContentEntryForm = function ContentEntryForm(_ref) {
94
111
  }, [formRenderer]);
95
112
  return /*#__PURE__*/React.createElement(Form, {
96
113
  onChange: function onChange(data, form) {
97
- setIsDirty(true);
114
+ var different = isDifferent(data, initialData);
115
+
116
+ if (isDirty !== different) {
117
+ setIsDirty(different);
118
+ }
119
+
98
120
  return _onChange(data, form);
99
121
  },
100
122
  onSubmit: function onSubmit(data, form) {
101
123
  setIsDirty(false);
102
124
  return _onSubmit(data, form);
103
125
  },
104
- data: data,
126
+ data: initialData,
105
127
  ref: ref,
106
128
  invalidFields: invalidFields,
107
129
  onInvalid: function onInvalid() {
@@ -1 +1 @@
1
- {"version":3,"sources":["ContentEntryForm.tsx"],"names":["React","useCallback","useEffect","useRef","RenderFieldElement","styled","Form","plugins","CircularProgress","useContentEntryForm","Fields","Prompt","useSnackbar","FormWrapper","height","overflow","ContentEntryForm","onForm","props","contentModel","loading","data","onChange","onSubmit","invalidFields","useState","isDirty","setIsDirty","showSnackbar","ref","current","formRenderer","byType","find","pl","modelId","renderCustomLayout","formRenderProps","fields","reduce","acc","field","fieldId","Bind","render","form","formProps","layout"],"mappings":"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","sourcesContent":["import React, { useCallback, useEffect, useRef } from \"react\";\nimport RenderFieldElement from \"./RenderFieldElement\";\nimport styled from \"@emotion/styled\";\nimport { Form } from \"@webiny/form\";\nimport { FormAPI, FormRenderPropParams } from \"@webiny/form/types\";\nimport { plugins } from \"@webiny/plugins\";\nimport { CircularProgress } from \"@webiny/ui/Progress\";\nimport { CmsContentFormRendererPlugin } from \"~/types\";\nimport { useContentEntryForm, UseContentEntryFormParams } from \"./useContentEntryForm\";\nimport { Fields } from \"./Fields\";\nimport { Prompt } from \"@webiny/react-router\";\nimport { useSnackbar } from \"@webiny/app-admin\";\n\nconst FormWrapper = styled(\"div\")({\n height: \"calc(100vh - 260px)\",\n overflow: \"auto\"\n});\n\ninterface ContentEntryFormProps extends UseContentEntryFormParams {\n onForm?: (form: FormAPI) => void;\n}\n\nexport const ContentEntryForm: React.FC<ContentEntryFormProps> = ({ onForm, ...props }) => {\n const { contentModel } = props;\n const { loading, data, onChange, onSubmit, invalidFields } = useContentEntryForm(props);\n\n const [isDirty, setIsDirty] = React.useState<boolean>(false);\n /**\n * Reset isDirty when the loaded data changes.\n */\n useEffect(() => {\n if (!isDirty) {\n return;\n }\n setIsDirty(false);\n }, [data]);\n\n const { showSnackbar } = useSnackbar();\n\n const ref = useRef<FormAPI | null>(null);\n\n useEffect(() => {\n if (typeof onForm !== \"function\" || !ref.current) {\n return;\n }\n onForm(ref.current);\n }, []);\n\n const formRenderer = plugins\n .byType<CmsContentFormRendererPlugin>(\"cms-content-form-renderer\")\n .find(pl => pl.modelId === contentModel.modelId);\n\n const renderCustomLayout = useCallback(\n (formRenderProps: FormRenderPropParams) => {\n const fields = contentModel.fields.reduce((acc, field) => {\n /**\n * TODO @ts-refactor\n * Figure out type for Bind.\n */\n acc[field.fieldId] = (\n <RenderFieldElement\n field={field}\n Bind={formRenderProps.Bind as any}\n contentModel={contentModel}\n />\n );\n\n return acc;\n }, {} as Record<string, React.ReactElement>);\n if (!formRenderer) {\n return <>{`Missing form renderer for modelId \"${contentModel.modelId}\".`}</>;\n }\n return formRenderer.render({\n ...formRenderProps,\n contentModel,\n fields,\n /**\n * TODO @ts-refactor\n * Figure out type for Bind.\n */\n Bind: formRenderProps.Bind as any\n });\n },\n [formRenderer]\n );\n\n return (\n <Form\n onChange={(data, form) => {\n setIsDirty(true);\n return onChange(data, form);\n }}\n onSubmit={(data, form) => {\n setIsDirty(false);\n return onSubmit(data, form);\n }}\n data={data}\n ref={ref}\n invalidFields={invalidFields}\n onInvalid={() => {\n setIsDirty(true);\n showSnackbar(\n \"You have fields that did not pass the validation. Please check the form.\"\n );\n }}\n >\n {formProps => {\n return (\n <>\n <Prompt\n when={isDirty}\n message={\n \"There are some unsaved changes! Are you sure you want to navigate away and discard all changes?\"\n }\n />\n <FormWrapper data-testid={\"cms-content-form\"}>\n {loading && <CircularProgress />}\n {formRenderer ? (\n renderCustomLayout(formProps)\n ) : (\n <Fields\n contentModel={contentModel}\n fields={contentModel.fields || []}\n layout={contentModel.layout || []}\n {...formProps}\n Bind={formProps.Bind as any}\n />\n )}\n </FormWrapper>\n </>\n );\n }}\n </Form>\n );\n};\n"]}
1
+ {"version":3,"sources":["ContentEntryForm.tsx"],"names":["React","useCallback","useEffect","useRef","RenderFieldElement","styled","Form","plugins","CircularProgress","useContentEntryForm","Fields","Prompt","useSnackbar","FormWrapper","height","overflow","omitTypename","key","value","undefined","stringify","JSON","isDifferent","compare","ContentEntryForm","onForm","props","contentModel","loading","initialData","data","onChange","onSubmit","invalidFields","useState","isDirty","setIsDirty","showSnackbar","ref","current","formRenderer","byType","find","pl","modelId","renderCustomLayout","formRenderProps","fields","reduce","acc","field","fieldId","Bind","render","form","different","formProps","layout"],"mappings":"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","sourcesContent":["import React, { useCallback, useEffect, useRef } from \"react\";\nimport RenderFieldElement from \"./RenderFieldElement\";\nimport styled from \"@emotion/styled\";\nimport { Form } from \"@webiny/form\";\nimport { FormAPI, FormRenderPropParams } from \"@webiny/form/types\";\nimport { plugins } from \"@webiny/plugins\";\nimport { CircularProgress } from \"@webiny/ui/Progress\";\nimport { CmsContentFormRendererPlugin } from \"~/types\";\nimport { useContentEntryForm, UseContentEntryFormParams } from \"./useContentEntryForm\";\nimport { Fields } from \"./Fields\";\nimport { Prompt } from \"@webiny/react-router\";\nimport { useSnackbar } from \"@webiny/app-admin\";\n\nconst FormWrapper = styled(\"div\")({\n height: \"calc(100vh - 260px)\",\n overflow: \"auto\"\n});\n\ninterface ContentEntryFormProps extends UseContentEntryFormParams {\n onForm?: (form: FormAPI) => void;\n}\n\nfunction omitTypename(key: string, value: string): string | undefined {\n return key === \"__typename\" ? undefined : value;\n}\n\nconst stringify = (value: any): string => {\n return JSON.stringify(value || {}, omitTypename);\n};\n\nconst isDifferent = (value: any, compare: any): boolean => {\n if (!value && !compare) {\n return false;\n }\n return stringify(value) !== stringify(compare);\n};\n\nexport const ContentEntryForm: React.FC<ContentEntryFormProps> = ({ onForm, ...props }) => {\n const { contentModel } = props;\n const {\n loading,\n data: initialData,\n onChange,\n onSubmit,\n invalidFields\n } = useContentEntryForm(props);\n\n const [isDirty, setIsDirty] = React.useState<boolean>(false);\n /**\n * Reset isDirty when the loaded data changes.\n */\n useEffect(() => {\n if (!isDirty) {\n return;\n }\n setIsDirty(false);\n }, [initialData]);\n\n const { showSnackbar } = useSnackbar();\n\n const ref = useRef<FormAPI | null>(null);\n\n useEffect(() => {\n if (typeof onForm !== \"function\" || !ref.current) {\n return;\n }\n onForm(ref.current);\n }, []);\n\n const formRenderer = plugins\n .byType<CmsContentFormRendererPlugin>(\"cms-content-form-renderer\")\n .find(pl => pl.modelId === contentModel.modelId);\n\n const renderCustomLayout = useCallback(\n (formRenderProps: FormRenderPropParams) => {\n const fields = contentModel.fields.reduce((acc, field) => {\n /**\n * TODO @ts-refactor\n * Figure out type for Bind.\n */\n acc[field.fieldId] = (\n <RenderFieldElement\n field={field}\n Bind={formRenderProps.Bind as any}\n contentModel={contentModel}\n />\n );\n\n return acc;\n }, {} as Record<string, React.ReactElement>);\n if (!formRenderer) {\n return <>{`Missing form renderer for modelId \"${contentModel.modelId}\".`}</>;\n }\n return formRenderer.render({\n ...formRenderProps,\n contentModel,\n fields,\n /**\n * TODO @ts-refactor\n * Figure out type for Bind.\n */\n Bind: formRenderProps.Bind as any\n });\n },\n [formRenderer]\n );\n\n return (\n <Form\n onChange={(data, form) => {\n const different = isDifferent(data, initialData);\n if (isDirty !== different) {\n setIsDirty(different);\n }\n return onChange(data, form);\n }}\n onSubmit={(data, form) => {\n setIsDirty(false);\n return onSubmit(data, form);\n }}\n data={initialData}\n ref={ref}\n invalidFields={invalidFields}\n onInvalid={() => {\n setIsDirty(true);\n showSnackbar(\n \"You have fields that did not pass the validation. Please check the form.\"\n );\n }}\n >\n {formProps => {\n return (\n <>\n <Prompt\n when={isDirty}\n message={\n \"There are some unsaved changes! Are you sure you want to navigate away and discard all changes?\"\n }\n />\n <FormWrapper data-testid={\"cms-content-form\"}>\n {loading && <CircularProgress />}\n {formRenderer ? (\n renderCustomLayout(formProps)\n ) : (\n <Fields\n contentModel={contentModel}\n fields={contentModel.fields || []}\n layout={contentModel.layout || []}\n {...formProps}\n Bind={formProps.Bind as any}\n />\n )}\n </FormWrapper>\n </>\n );\n }}\n </Form>\n );\n};\n"]}
@@ -7,6 +7,17 @@ import { useCallback, useEffect, useMemo, useRef, useState } from "react";
7
7
  import { useApolloClient } from "../../../../hooks";
8
8
  import { SEARCH_CONTENT_ENTRIES, GET_CONTENT_ENTRY } from "./graphql";
9
9
  import { convertReferenceEntriesToOptionCollection, convertReferenceEntryToOption } from "./helpers";
10
+
11
+ var getValueHash = function getValueHash(value) {
12
+ if (!value || !value.id && !value.entryId) {
13
+ return null;
14
+ } else if (value.entryId) {
15
+ return value.entryId;
16
+ }
17
+
18
+ return value.id.split("#").shift();
19
+ };
20
+
10
21
  export var useReference = function useReference(_ref) {
11
22
  var bind = _ref.bind,
12
23
  field = _ref.field;
@@ -41,7 +52,7 @@ export var useReference = function useReference(_ref) {
41
52
  var models = field.settings ? field.settings.models || [] : [];
42
53
  var modelsHash = models.join(",");
43
54
  var value = bind.value;
44
- var valueHash = value ? value.entryId : null;
55
+ var valueHash = getValueHash(value);
45
56
 
46
57
  var searchEntries = /*#__PURE__*/function () {
47
58
  var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
@@ -140,7 +151,7 @@ export var useReference = function useReference(_ref) {
140
151
  return;
141
152
  }
142
153
 
143
- var entry = allEntries.current[valueHash];
154
+ var entry = valueHash ? allEntries.current[valueHash] : null;
144
155
 
145
156
  if (entry) {
146
157
  /**
@@ -216,14 +227,14 @@ export var useReference = function useReference(_ref) {
216
227
 
217
228
  var options = useMemo(function () {
218
229
  return Object.values(entries);
219
- }, [entries]);
230
+ }, [valueHash]);
220
231
  /**
221
232
  * Format default options for the Autocomplete component.
222
233
  */
223
234
 
224
235
  var defaultOptions = useMemo(function () {
225
236
  return Object.values(latestEntries);
226
- }, [latestEntries]);
237
+ }, [valueHash]);
227
238
  var outputOptions = (search && options ? options : defaultOptions) || [];
228
239
 
229
240
  if (valueEntry && outputOptions.some(function (opt) {
@@ -1 +1 @@
1
- {"version":3,"sources":["useReference.ts"],"names":["useCallback","useEffect","useMemo","useRef","useState","useApolloClient","SEARCH_CONTENT_ENTRIES","GET_CONTENT_ENTRY","convertReferenceEntriesToOptionCollection","convertReferenceEntryToOption","useReference","bind","field","allEntries","client","search","setSearch","loading","setLoading","entries","setEntries","latestEntries","setLatestEntries","valueEntry","setValueEntry","models","settings","modelsHash","join","value","valueHash","entryId","searchEntries","query","variables","modelIds","map","m","modelId","limit","data","collection","content","current","length","fetchPolicy","then","latestEntryData","entry","id","res","dataEntry","latest","option","published","prev","onChange","options","Object","values","defaultOptions","outputOptions","some","opt","push"],"mappings":"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","sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { useApolloClient } from \"~/admin/hooks\";\nimport {\n SEARCH_CONTENT_ENTRIES,\n GET_CONTENT_ENTRY,\n CmsEntryGetQueryResponse,\n CmsEntryGetQueryVariables,\n CmsEntrySearchQueryResponse,\n CmsEntrySearchQueryVariables\n} from \"./graphql\";\nimport { CmsEditorField, CmsModel } from \"~/types\";\nimport { BindComponentRenderProp } from \"@webiny/form\";\nimport { OptionItem, OptionItemCollection } from \"./types\";\nimport {\n convertReferenceEntriesToOptionCollection,\n convertReferenceEntryToOption\n} from \"./helpers\";\n\ninterface UseReferenceHookArgs {\n bind: BindComponentRenderProp;\n field: CmsEditorField;\n}\n\ninterface UseReferenceHookValue {\n onChange: (value: any, entry: OptionItem) => void;\n setSearch: (value: string) => void;\n value: OptionItem | null;\n loading: boolean;\n options: OptionItem[];\n}\n\ntype UseReferenceHook = (args: UseReferenceHookArgs) => UseReferenceHookValue;\n\nexport const useReference: UseReferenceHook = ({ bind, field }) => {\n const allEntries = useRef<OptionItemCollection>({});\n const client = useApolloClient();\n const [search, setSearch] = useState<string>(\"\");\n const [loading, setLoading] = useState<boolean>(false);\n const [entries, setEntries] = useState<OptionItemCollection>({});\n const [latestEntries, setLatestEntries] = useState<OptionItemCollection>({});\n const [valueEntry, setValueEntry] = useState<OptionItem | null>(null);\n\n const models = (field.settings ? field.settings.models || [] : []) as Pick<\n CmsModel,\n \"modelId\" | \"name\"\n >[];\n const modelsHash = models.join(\",\");\n\n const value = bind.value;\n const valueHash = value ? value.entryId : null;\n\n const searchEntries = async () => {\n if (!search) {\n return;\n }\n\n setLoading(true);\n const { data } = await client.query<\n CmsEntrySearchQueryResponse,\n CmsEntrySearchQueryVariables\n >({\n query: SEARCH_CONTENT_ENTRIES,\n variables: {\n modelIds: models.map(m => m.modelId),\n query: search,\n limit: 10\n }\n });\n setLoading(false);\n\n const collection = convertReferenceEntriesToOptionCollection(data.content.data);\n if (valueEntry) {\n collection[valueEntry.entryId] = valueEntry;\n }\n allEntries.current = {\n ...allEntries.current,\n ...collection\n };\n\n setEntries(collection);\n };\n\n useEffect(() => {\n searchEntries();\n }, [search]);\n\n useEffect(() => {\n if (models.length === 0) {\n return;\n }\n client\n .query<CmsEntrySearchQueryResponse, CmsEntrySearchQueryVariables>({\n query: SEARCH_CONTENT_ENTRIES,\n variables: {\n modelIds: models.map(m => m.modelId),\n limit: 10\n },\n /**\n * We cannot update this query response in cache after a reference entry being created/deleted,\n * which result in cached response being stale, therefore, we're setting the fetchPolicy to \"network-only\" to by passing cache.\n */\n fetchPolicy: \"network-only\"\n })\n .then(({ data }) => {\n const latestEntryData = convertReferenceEntriesToOptionCollection(\n data.content.data\n );\n if (valueEntry) {\n latestEntryData[valueEntry.entryId] = valueEntry;\n }\n\n setLatestEntries(latestEntryData);\n allEntries.current = {\n ...allEntries.current,\n ...latestEntryData\n };\n });\n }, [modelsHash]);\n\n useEffect(() => {\n if (!value || !models) {\n setValueEntry(() => null);\n return;\n }\n\n const entry = allEntries.current[valueHash];\n if (entry) {\n /**\n * if entry exists set valueEntry to that one so we do not load new one\n */\n setValueEntry(() => {\n return entry;\n });\n return;\n }\n\n setLoading(true);\n /**\n * Query loads both latest and published entries.\n * We do this in a single query because there might not be a published entry so we can use the latest one.\n */\n client\n .query<CmsEntryGetQueryResponse, CmsEntryGetQueryVariables>({\n query: GET_CONTENT_ENTRY,\n variables: {\n entry: {\n modelId: value.modelId,\n id: value.id\n }\n }\n })\n .then(res => {\n setLoading(false);\n const dataEntry = res.data.latest.data;\n if (!dataEntry) {\n return;\n }\n const option: OptionItem = {\n ...convertReferenceEntryToOption(dataEntry),\n latest: dataEntry.id,\n published: res.data.published.data ? res.data.published.data.id : null\n };\n allEntries.current[option.entryId] = option;\n setLatestEntries(prev => {\n return {\n ...prev,\n [option.entryId]: {\n ...option\n }\n };\n });\n /**\n * Calculate a couple of props for the Autocomplete component.\n */\n setValueEntry(() => {\n return option;\n });\n });\n }, [valueHash, modelsHash]);\n\n const onChange = useCallback((value: string, entry: OptionItem) => {\n if (value !== null) {\n setSearch(\"\");\n\n setValueEntry(() => {\n return entry;\n });\n bind.onChange({\n modelId: entry.modelId,\n id: entry.id\n });\n return;\n }\n\n setValueEntry(() => null);\n bind.onChange(null);\n }, []);\n\n /**\n * Format options for the Autocomplete component.\n */\n const options = useMemo(() => Object.values(entries), [entries]);\n\n /**\n * Format default options for the Autocomplete component.\n */\n const defaultOptions = useMemo(() => {\n return Object.values(latestEntries);\n }, [latestEntries]);\n\n const outputOptions: OptionItem[] = (search && options ? options : defaultOptions) || [];\n\n if (valueEntry && outputOptions.some(opt => opt.entryId === valueEntry.entryId) === false) {\n outputOptions.push(valueEntry);\n }\n\n return {\n onChange,\n setSearch,\n value: valueEntry,\n loading,\n options: outputOptions\n };\n};\n"]}
1
+ {"version":3,"sources":["useReference.ts"],"names":["useCallback","useEffect","useMemo","useRef","useState","useApolloClient","SEARCH_CONTENT_ENTRIES","GET_CONTENT_ENTRY","convertReferenceEntriesToOptionCollection","convertReferenceEntryToOption","getValueHash","value","id","entryId","split","shift","useReference","bind","field","allEntries","client","search","setSearch","loading","setLoading","entries","setEntries","latestEntries","setLatestEntries","valueEntry","setValueEntry","models","settings","modelsHash","join","valueHash","searchEntries","query","variables","modelIds","map","m","modelId","limit","data","collection","content","current","length","fetchPolicy","then","latestEntryData","entry","res","dataEntry","latest","option","published","prev","onChange","options","Object","values","defaultOptions","outputOptions","some","opt","push"],"mappings":"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","sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { useApolloClient } from \"~/admin/hooks\";\nimport {\n SEARCH_CONTENT_ENTRIES,\n GET_CONTENT_ENTRY,\n CmsEntryGetQueryResponse,\n CmsEntryGetQueryVariables,\n CmsEntrySearchQueryResponse,\n CmsEntrySearchQueryVariables\n} from \"./graphql\";\nimport { CmsEditorField, CmsModel } from \"~/types\";\nimport { BindComponentRenderProp } from \"@webiny/form\";\nimport { OptionItem, OptionItemCollection } from \"./types\";\nimport {\n convertReferenceEntriesToOptionCollection,\n convertReferenceEntryToOption\n} from \"./helpers\";\n\ninterface UseReferenceHookArgs {\n bind: BindComponentRenderProp;\n field: CmsEditorField;\n}\n\ninterface UseReferenceHookValue {\n onChange: (value: any, entry: OptionItem) => void;\n setSearch: (value: string) => void;\n value: OptionItem | null;\n loading: boolean;\n options: OptionItem[];\n}\n\ntype UseReferenceHook = (args: UseReferenceHookArgs) => UseReferenceHookValue;\n\nconst getValueHash = (value: any): string | null => {\n if (!value || (!value.id && !value.entryId)) {\n return null;\n } else if (value.entryId) {\n return value.entryId;\n }\n return value.id.split(\"#\").shift();\n};\n\nexport const useReference: UseReferenceHook = ({ bind, field }) => {\n const allEntries = useRef<OptionItemCollection>({});\n const client = useApolloClient();\n const [search, setSearch] = useState<string>(\"\");\n const [loading, setLoading] = useState<boolean>(false);\n const [entries, setEntries] = useState<OptionItemCollection>({});\n const [latestEntries, setLatestEntries] = useState<OptionItemCollection>({});\n const [valueEntry, setValueEntry] = useState<OptionItem | null>(null);\n\n const models = (field.settings ? field.settings.models || [] : []) as Pick<\n CmsModel,\n \"modelId\" | \"name\"\n >[];\n const modelsHash = models.join(\",\");\n\n const value = bind.value;\n const valueHash = getValueHash(value);\n\n const searchEntries = async () => {\n if (!search) {\n return;\n }\n\n setLoading(true);\n const { data } = await client.query<\n CmsEntrySearchQueryResponse,\n CmsEntrySearchQueryVariables\n >({\n query: SEARCH_CONTENT_ENTRIES,\n variables: {\n modelIds: models.map(m => m.modelId),\n query: search,\n limit: 10\n }\n });\n setLoading(false);\n\n const collection = convertReferenceEntriesToOptionCollection(data.content.data);\n if (valueEntry) {\n collection[valueEntry.entryId] = valueEntry;\n }\n allEntries.current = {\n ...allEntries.current,\n ...collection\n };\n\n setEntries(collection);\n };\n\n useEffect(() => {\n searchEntries();\n }, [search]);\n\n useEffect(() => {\n if (models.length === 0) {\n return;\n }\n client\n .query<CmsEntrySearchQueryResponse, CmsEntrySearchQueryVariables>({\n query: SEARCH_CONTENT_ENTRIES,\n variables: {\n modelIds: models.map(m => m.modelId),\n limit: 10\n },\n /**\n * We cannot update this query response in cache after a reference entry being created/deleted,\n * which result in cached response being stale, therefore, we're setting the fetchPolicy to \"network-only\" to by passing cache.\n */\n fetchPolicy: \"network-only\"\n })\n .then(({ data }) => {\n const latestEntryData = convertReferenceEntriesToOptionCollection(\n data.content.data\n );\n if (valueEntry) {\n latestEntryData[valueEntry.entryId] = valueEntry;\n }\n\n setLatestEntries(latestEntryData);\n allEntries.current = {\n ...allEntries.current,\n ...latestEntryData\n };\n });\n }, [modelsHash]);\n\n useEffect(() => {\n if (!value || !models) {\n setValueEntry(() => null);\n return;\n }\n\n const entry = valueHash ? allEntries.current[valueHash] : null;\n if (entry) {\n /**\n * if entry exists set valueEntry to that one so we do not load new one\n */\n setValueEntry(() => {\n return entry;\n });\n return;\n }\n\n setLoading(true);\n /**\n * Query loads both latest and published entries.\n * We do this in a single query because there might not be a published entry so we can use the latest one.\n */\n client\n .query<CmsEntryGetQueryResponse, CmsEntryGetQueryVariables>({\n query: GET_CONTENT_ENTRY,\n variables: {\n entry: {\n modelId: value.modelId,\n id: value.id\n }\n }\n })\n .then(res => {\n setLoading(false);\n const dataEntry = res.data.latest.data;\n if (!dataEntry) {\n return;\n }\n const option: OptionItem = {\n ...convertReferenceEntryToOption(dataEntry),\n latest: dataEntry.id,\n published: res.data.published.data ? res.data.published.data.id : null\n };\n allEntries.current[option.entryId] = option;\n setLatestEntries(prev => {\n return {\n ...prev,\n [option.entryId]: {\n ...option\n }\n };\n });\n /**\n * Calculate a couple of props for the Autocomplete component.\n */\n setValueEntry(() => {\n return option;\n });\n });\n }, [valueHash, modelsHash]);\n\n const onChange = useCallback((value: string, entry: OptionItem) => {\n if (value !== null) {\n setSearch(\"\");\n\n setValueEntry(() => {\n return entry;\n });\n bind.onChange({\n modelId: entry.modelId,\n id: entry.id\n });\n return;\n }\n\n setValueEntry(() => null);\n bind.onChange(null);\n }, []);\n\n /**\n * Format options for the Autocomplete component.\n */\n const options = useMemo(() => Object.values(entries), [valueHash]);\n\n /**\n * Format default options for the Autocomplete component.\n */\n const defaultOptions = useMemo(() => {\n return Object.values(latestEntries);\n }, [valueHash]);\n\n const outputOptions: OptionItem[] = (search && options ? options : defaultOptions) || [];\n\n if (valueEntry && outputOptions.some(opt => opt.entryId === valueEntry.entryId) === false) {\n outputOptions.push(valueEntry);\n }\n\n return {\n onChange,\n setSearch,\n value: valueEntry,\n loading,\n options: outputOptions\n };\n};\n"]}
@@ -1,4 +1,4 @@
1
- declare const _default: () => (import("../../types").CmsEditorFormSettingsPlugin | import("../../types").CmsIconsPlugin | import("../../types").CmsFieldValueTransformer[] | import("@webiny/app/types").CacheGetObjectIdPlugin | import("@webiny/app/types").RoutePlugin[] | import("@webiny/app-admin/types").AdminInstallationPlugin | import("@webiny/app-admin/types").AdminAppPermissionRendererPlugin | import("../../types").CmsContentDetailsPlugin[] | {
1
+ declare const _default: () => (import("@webiny/app/types").CacheGetObjectIdPlugin | import("@webiny/app-admin/types").AdminInstallationPlugin | import("@webiny/app-admin/types").AdminAppPermissionRendererPlugin | import("../../types").CmsEditorFormSettingsPlugin | import("../../types").CmsIconsPlugin | import("../../types").CmsFieldValueTransformer[] | import("@webiny/app/types").RoutePlugin[] | import("../../types").CmsContentDetailsPlugin[] | {
2
2
  name: string;
3
3
  type: string;
4
4
  render(): JSX.Element;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@webiny/app-headless-cms",
3
- "version": "5.25.0-beta.4",
3
+ "version": "5.25.0-beta.5",
4
4
  "main": "index.js",
5
5
  "repository": {
6
6
  "type": "git",
@@ -26,19 +26,19 @@
26
26
  "@fortawesome/react-fontawesome": "0.1.18",
27
27
  "@svgr/webpack": "6.2.1",
28
28
  "@types/react": "16.14.2",
29
- "@webiny/app": "5.25.0-beta.4",
30
- "@webiny/app-admin": "5.25.0-beta.4",
31
- "@webiny/app-graphql-playground": "5.25.0-beta.4",
32
- "@webiny/app-i18n": "5.25.0-beta.4",
33
- "@webiny/app-plugin-admin-welcome-screen": "5.25.0-beta.4",
34
- "@webiny/app-security": "5.25.0-beta.4",
35
- "@webiny/error": "5.25.0-beta.4",
36
- "@webiny/form": "5.25.0-beta.4",
37
- "@webiny/plugins": "5.25.0-beta.4",
38
- "@webiny/react-router": "5.25.0-beta.4",
39
- "@webiny/ui": "5.25.0-beta.4",
40
- "@webiny/utils": "5.25.0-beta.4",
41
- "@webiny/validation": "5.25.0-beta.4",
29
+ "@webiny/app": "5.25.0-beta.5",
30
+ "@webiny/app-admin": "5.25.0-beta.5",
31
+ "@webiny/app-graphql-playground": "5.25.0-beta.5",
32
+ "@webiny/app-i18n": "5.25.0-beta.5",
33
+ "@webiny/app-plugin-admin-welcome-screen": "5.25.0-beta.5",
34
+ "@webiny/app-security": "5.25.0-beta.5",
35
+ "@webiny/error": "5.25.0-beta.5",
36
+ "@webiny/form": "5.25.0-beta.5",
37
+ "@webiny/plugins": "5.25.0-beta.5",
38
+ "@webiny/react-router": "5.25.0-beta.5",
39
+ "@webiny/ui": "5.25.0-beta.5",
40
+ "@webiny/utils": "5.25.0-beta.5",
41
+ "@webiny/validation": "5.25.0-beta.5",
42
42
  "apollo-cache": "1.3.5",
43
43
  "apollo-client": "2.6.10",
44
44
  "apollo-link": "1.2.14",
@@ -72,8 +72,8 @@
72
72
  "@babel/preset-env": "^7.16.4",
73
73
  "@babel/preset-react": "^7.16.0",
74
74
  "@babel/preset-typescript": "^7.16.0",
75
- "@webiny/cli": "^5.25.0-beta.4",
76
- "@webiny/project-utils": "^5.25.0-beta.4",
75
+ "@webiny/cli": "^5.25.0-beta.5",
76
+ "@webiny/project-utils": "^5.25.0-beta.5",
77
77
  "babel-plugin-emotion": "^9.2.8",
78
78
  "babel-plugin-lodash": "^3.3.4",
79
79
  "babel-plugin-module-resolver": "^4.1.0",
@@ -105,5 +105,5 @@
105
105
  ]
106
106
  }
107
107
  },
108
- "gitHead": "625ab53457e211940b30b1fe86add4f19f63c8b0"
108
+ "gitHead": "570eec807bad353e4485b9bfc7ed5a341ce20ae3"
109
109
  }