diff --git a/ui/src/app/metadata/copy/CopySource.js b/ui/src/app/metadata/copy/CopySource.js index 2a7a6b183..8854bdd5f 100644 --- a/ui/src/app/metadata/copy/CopySource.js +++ b/ui/src/app/metadata/copy/CopySource.js @@ -10,9 +10,13 @@ import { EntityTypeahead } from './EntityTypeahead'; import kebabCase from 'lodash/kebabCase'; import { useMetadataSources } from '../hooks/api'; import { useMetadataSourceSections } from '../domain/source/definition/sections'; +import { useMetadataSchemaLoader, useMetadataSchemaType } from '../hoc/MetadataSchema'; export function CopySource({ copy, onNext }) { + const schemaLoader = useMetadataSchemaLoader(); + const kind = useMetadataSchemaType(); + const { data = [] } = useMetadataSources({ cachePolicy: 'no-cache' }, []); const [selected, setSelected] = React.useState(copy.properties); @@ -57,6 +61,12 @@ export function CopySource({ copy, onNext }) { const sections = useMetadataSourceSections(); + React.useEffect(() => { + if (target && target.protocol !== kind) { + schemaLoader(target.protocol); + } + }, [target, schemaLoader, kind]); + return ( <>
diff --git a/ui/src/app/metadata/hoc/MetadataSchema.js b/ui/src/app/metadata/hoc/MetadataSchema.js index 61010936e..5de2e3fc5 100644 --- a/ui/src/app/metadata/hoc/MetadataSchema.js +++ b/ui/src/app/metadata/hoc/MetadataSchema.js @@ -6,40 +6,50 @@ import { useTranslator } from '../../i18n/hooks'; export const MetadataSchemaContext = React.createContext(); export const MetadataDefinitionContext = React.createContext(); export const MetadataSchemaLoading = React.createContext(); +export const MetadataSchemaLoader = React.createContext(); +export const MetadataSchemaType = React.createContext(); export function MetadataSchema({ type, children, wizard = false }) { - const definition = React.useMemo(() => wizard ? getWizard(type) : getDefinition(type), [type, wizard]); + const [kind, setKind] = React.useState(type); const [loading, setLoading] = React.useState(false); + const [definition, setDefinition] = React.useState(wizard ? getWizard(kind) : getDefinition(kind)); + const { get, response } = useFetch(``, { cachePolicy: 'no-cache' }); const [schema, setSchema] = React.useState(); - async function loadSchema(d) { - const source = await get(`/${d.schema}`) + async function loadSchema(type) { + const definition = wizard ? getWizard(type) : getDefinition(type); + setDefinition(definition); + setKind(type); + setLoading(true); + + const source = await get(`/${definition.schema}`) if (response.ok) { setSchema(source); } setLoading(false); } - /*eslint-disable react-hooks/exhaustive-deps*/ - React.useEffect(() => { - setSchema(null); - loadSchema(definition); - setLoading(true); - }, [definition]); + React.useState(() => { + loadSchema(type); + }, [type]); return ( {type && definition && schema && - {children} + + + {children} + + } @@ -55,10 +65,18 @@ export function useMetadataSchemaLoading () { return React.useContext(MetadataSchemaLoading); } +export function useMetadataSchemaLoader () { + return React.useContext(MetadataSchemaLoader); +} + export function useMetadataDefinitionContext() { return React.useContext(MetadataDefinitionContext); } +export function useMetadataSchemaType() { + return React.useContext(MetadataSchemaType); +} + export function useMetadataDefinitionValidator(data, current, group) { const definition = useMetadataDefinitionContext(); const translator = useTranslator();