diff --git a/src/hooks/useGetSchema.js b/src/hooks/useGetSchema.js index 93b103cd0f..296dc541ac 100644 --- a/src/hooks/useGetSchema.js +++ b/src/hooks/useGetSchema.js @@ -23,19 +23,20 @@ export const useGetSchema = ({ schemaId, skip, resource }) => { const isWorkerOkay = isWorkerAvailable && !schemasError; const [schema, setSchema] = useState(null); const [error, setError] = useState(null); - const [loading, setLoading] = useState(!isWorkerOkay ? false : !skip); - + const [loading, setLoading] = useState(true); useEffect(() => { setSchema(null); setError(null); - setLoading(!isWorkerOkay ? false : !skip); + setLoading(true); // eslint-disable-next-line react-hooks/exhaustive-deps }, [schemaId]); useEffect(() => { - if (!areSchemasComputed || schema || skip || !isWorkerOkay) { + if (schema || skip || !isWorkerOkay) { + setLoading(false); return; } + if (!areSchemasComputed) return; sendWorkerMessage('getSchema', schemaId); addWorkerListener(`schemaComputed:${schemaId}`, ({ schema }) => { diff --git a/src/shared/ResourceForm/components/ResourceForm.js b/src/shared/ResourceForm/components/ResourceForm.js index 8a9c767226..dff486e63b 100644 --- a/src/shared/ResourceForm/components/ResourceForm.js +++ b/src/shared/ResourceForm/components/ResourceForm.js @@ -203,6 +203,7 @@ export function ResourceForm({ schemaId={resourceSchemaId} updateValueOnParentChange={true} setEditorError={setEditorError} + schema={schema} /> ); editor = renderEditor diff --git a/src/shared/ResourceForm/fields/Editor.js b/src/shared/ResourceForm/fields/Editor.js index 67cadd0f36..0d562e9852 100644 --- a/src/shared/ResourceForm/fields/Editor.js +++ b/src/shared/ResourceForm/fields/Editor.js @@ -11,6 +11,7 @@ export function Editor({ convert = true, schemaId, setEditorError, + schema, ...props }) { const { t } = useTranslation(); @@ -85,6 +86,7 @@ export function Editor({ error={error} schemaId={schemaId} placeholder={t('clusters.wizard.editor-placeholder')} + schema={schema} /> ); } diff --git a/src/shared/components/MonacoEditorESM/Editor.js b/src/shared/components/MonacoEditorESM/Editor.js index 573e6a48d2..6afeb3912e 100644 --- a/src/shared/components/MonacoEditorESM/Editor.js +++ b/src/shared/components/MonacoEditorESM/Editor.js @@ -29,7 +29,7 @@ export function Editor({ onFocus, options = {}, // IEditorOptions, check Monaco API for the list of options placeholder = null, - ...rest + schema, }) { const { t } = useTranslation(); const prevValueRef = useRef(value); @@ -45,6 +45,7 @@ export function Editor({ autocompletionDisabled, readOnly, language, + schema, }); // set autocompletion global context to the current editor and initialize an editor instance @@ -90,11 +91,11 @@ export function Editor({ className="resource-form__wrapper" style={{ height, minHeight: height }} > - {loading ? ( + {loading && (
- ) : null} + )}
{placeholder && !!!value && (
{placeholder}
diff --git a/src/shared/components/MonacoEditorESM/autocompletion/useAutocompleteWorker.js b/src/shared/components/MonacoEditorESM/autocompletion/useAutocompleteWorker.js index ff2d43b56f..b9b4524536 100644 --- a/src/shared/components/MonacoEditorESM/autocompletion/useAutocompleteWorker.js +++ b/src/shared/components/MonacoEditorESM/autocompletion/useAutocompleteWorker.js @@ -32,6 +32,7 @@ export function useAutocompleteWorker({ autocompletionDisabled, readOnly, language, + schema: predefinedSchema, }) { const [schemaId] = useState(predefinedSchemaId || Math.random().toString()); @@ -42,11 +43,12 @@ export function useAutocompleteWorker({ autocompletionDisabled = true; } - const { schema, loading, error } = useGetSchema({ + const { schemas: fetchedSchema, loading, error } = useGetSchema({ schemaId, - skip: autocompletionDisabled, + skip: autocompletionDisabled || !!predefinedSchema, }); + const schema = predefinedSchema || fetchedSchema; /** * Call this before initializing Monaco. This function alters Monaco global config to set up JSON-based * autocompletion.