diff --git a/src/components/collection/ResourceConfig.tsx b/src/components/collection/ResourceConfig.tsx index 80af3f516..289e745dc 100644 --- a/src/components/collection/ResourceConfig.tsx +++ b/src/components/collection/ResourceConfig.tsx @@ -1,8 +1,8 @@ import { Box, Typography } from '@mui/material'; import ResourceConfigForm from 'components/collection/ResourceConfigForm'; +import AdvancedOptions from 'components/editor/Bindings/AdvancedOptions'; import Backfill from 'components/editor/Bindings/Backfill'; import FieldSelectionViewer from 'components/editor/Bindings/FieldSelection'; -import TimeTravel from 'components/editor/Bindings/TimeTravel'; import { useEditorStore_queryResponse_draftedBindingIndex } from 'components/editor/Store/hooks'; import ErrorBoundryWrapper from 'components/shared/ErrorBoundryWrapper'; import { useEntityType } from 'context/EntityContext'; @@ -83,12 +83,11 @@ function ResourceConfig({ /> ) : null} - {entityType === 'materialization' ? ( - - ) : null} + ); } diff --git a/src/components/editor/Bindings/AdvancedOptions/index.tsx b/src/components/editor/Bindings/AdvancedOptions/index.tsx new file mode 100644 index 000000000..aaee692b2 --- /dev/null +++ b/src/components/editor/Bindings/AdvancedOptions/index.tsx @@ -0,0 +1,65 @@ +import { Stack, Typography } from '@mui/material'; +import WrapperWithHeader from 'components/shared/Entity/WrapperWithHeader'; +import ErrorBoundryWrapper from 'components/shared/ErrorBoundryWrapper'; +import { useEntityType } from 'context/EntityContext'; +import { useIntl } from 'react-intl'; +import { useBindingStore } from 'stores/Binding/Store'; +import OnIncompatibleSchemaChange from '../OnIncompatibleSchemaChange'; +import TimeTravel from '../TimeTravel'; +import { AdvancedOptionsProps } from './types'; + +export default function AdvancedOptions({ + bindingIndex, + bindingUUID, + collectionName, +}: AdvancedOptionsProps) { + const intl = useIntl(); + + const entityType = useEntityType(); + + const fullSourceErrorExists = useBindingStore((state) => { + const fullSourceErrors = state.fullSourceConfigs[bindingUUID]?.errors; + + if (!fullSourceErrors) { + return false; + } + + return fullSourceErrors.length > 0; + }); + + const onIncompatibleSchemaChangeErrorExists = useBindingStore( + (state) => state.onIncompatibleSchemaChangeErrorExists.binding + ); + + if (entityType !== 'materialization') { + return null; + } + + return ( + + {intl.formatMessage({ + id: 'workflows.advancedSettings.title', + })} + + } + hideBorder + mountClosed + > + + + + + + + + + ); +} diff --git a/src/components/editor/Bindings/AdvancedOptions/types.tsx b/src/components/editor/Bindings/AdvancedOptions/types.tsx new file mode 100644 index 000000000..0c4e3cb1c --- /dev/null +++ b/src/components/editor/Bindings/AdvancedOptions/types.tsx @@ -0,0 +1,5 @@ +export interface AdvancedOptionsProps { + bindingIndex: number; + bindingUUID: string; + collectionName: string; +} diff --git a/src/components/editor/Bindings/Backfill/index.tsx b/src/components/editor/Bindings/Backfill/index.tsx index 3369a095c..de0dbbbc1 100644 --- a/src/components/editor/Bindings/Backfill/index.tsx +++ b/src/components/editor/Bindings/Backfill/index.tsx @@ -1,8 +1,6 @@ -import ErrorBoundryWrapper from 'components/shared/ErrorBoundryWrapper'; import { useEntityType } from 'context/EntityContext'; import { useEntityWorkflow_Editing } from 'context/Workflow'; import { FormattedMessage } from 'react-intl'; -import OnIncompatibleSchemaChange from '../OnIncompatibleSchemaChange'; import BackfillButton from './BackfillButton'; import SectionWrapper from './SectionWrapper'; import { BackfillProps } from './types'; @@ -16,24 +14,16 @@ export default function Backfill({ const showBackfillButton = isEdit && bindingIndex > -1 && collectionEnabled; - return showBackfillButton || entityType === 'materialization' ? ( + return showBackfillButton ? ( - {showBackfillButton ? ( - - } - /> - ) : null} - - {entityType === 'materialization' ? ( - - - - ) : null} + + } + /> ) : null; } diff --git a/src/components/editor/Bindings/FieldSelection/index.tsx b/src/components/editor/Bindings/FieldSelection/index.tsx index e87da69c6..8d614a6b5 100644 --- a/src/components/editor/Bindings/FieldSelection/index.tsx +++ b/src/components/editor/Bindings/FieldSelection/index.tsx @@ -272,7 +272,7 @@ function FieldSelectionViewer({ const loading = formActive || formStatus === FormStatus.TESTING_BACKGROUND; return ( - + diff --git a/src/components/editor/Bindings/OnIncompatibleSchemaChange/Form.tsx b/src/components/editor/Bindings/OnIncompatibleSchemaChange/Form.tsx index 490eced86..33e4d48e9 100644 --- a/src/components/editor/Bindings/OnIncompatibleSchemaChange/Form.tsx +++ b/src/components/editor/Bindings/OnIncompatibleSchemaChange/Form.tsx @@ -95,6 +95,7 @@ function Form({ bindingIndex = -1 }: OnIncompatibleSchemaChangeProps) { return ( ); diff --git a/src/components/editor/Bindings/TimeTravel/index.tsx b/src/components/editor/Bindings/TimeTravel/index.tsx index ca79331a7..5abbcddaa 100644 --- a/src/components/editor/Bindings/TimeTravel/index.tsx +++ b/src/components/editor/Bindings/TimeTravel/index.tsx @@ -13,7 +13,7 @@ function TimeTravel({ bindingUUID, collectionName }: Props) { - + diff --git a/src/components/editor/Bindings/index.tsx b/src/components/editor/Bindings/index.tsx index 0aed5743c..cf6b34771 100644 --- a/src/components/editor/Bindings/index.tsx +++ b/src/components/editor/Bindings/index.tsx @@ -12,6 +12,7 @@ import { LocalZustandProvider } from 'context/LocalZustand'; import { alternativeReflexContainerBackground } from 'context/Theme'; import { useEntityWorkflow } from 'context/Workflow'; +import AdvancedOptions from 'components/materialization/AdvancedOptions'; import { DraftSpecQuery } from 'hooks/useDraftSpecs'; import { useServerUpdateRequiredMonitor } from 'hooks/useServerUpdateRequiredMonitor'; import { ReactNode, useEffect, useMemo } from 'react'; @@ -109,6 +110,8 @@ function BindingsMultiEditor({ {entityType === 'materialization' ? : null} + + state.setOnIncompatibleSchemaChangeErrorExists + ); + const formActive = useFormStateStore_isActive(); const options = useSupportedOptions(); @@ -56,6 +62,10 @@ export default function IncompatibleSchemaChangeForm({ setInvalidSetting(false); }, [currentSetting, selection]); + useEffect(() => { + setOnIncompatibleSchemaChangeErrorExists(invalidSetting, scope); + }, [invalidSetting, scope, setOnIncompatibleSchemaChangeErrorExists]); + return ( {invalidSetting ? ( diff --git a/src/components/incompatibleSchemaChange/types.ts b/src/components/incompatibleSchemaChange/types.ts index 16bd03310..22dbdf65d 100644 --- a/src/components/incompatibleSchemaChange/types.ts +++ b/src/components/incompatibleSchemaChange/types.ts @@ -2,6 +2,7 @@ import { choices } from './shared'; export interface BaseFormProps { currentSetting: any; + scope: 'binding' | 'spec'; updateDraftedSetting: Function; } diff --git a/src/components/materialization/AdvancedOptions.tsx b/src/components/materialization/AdvancedOptions.tsx new file mode 100644 index 000000000..2e078b078 --- /dev/null +++ b/src/components/materialization/AdvancedOptions.tsx @@ -0,0 +1,42 @@ +import { Box, Typography } from '@mui/material'; +import WrapperWithHeader from 'components/shared/Entity/WrapperWithHeader'; +import ErrorBoundryWrapper from 'components/shared/ErrorBoundryWrapper'; +import { useEntityType } from 'context/EntityContext'; +import { useIntl } from 'react-intl'; +import { useBindingStore } from 'stores/Binding/Store'; +import OnIncompatibleSchemaChange from './OnIncompatibleSchemaChange'; + +export default function AdvancedOptions() { + const intl = useIntl(); + + const entityType = useEntityType(); + + const onIncompatibleSchemaChangeErrorExists = useBindingStore( + (state) => state.onIncompatibleSchemaChangeErrorExists.spec + ); + + if (entityType !== 'materialization') { + return null; + } + + return ( + + + {intl.formatMessage({ + id: 'workflows.advancedSettings.title', + })} + + } + hideBorder + mountClosed + > + + + + + + ); +} diff --git a/src/components/materialization/OnIncompatibleSchemaChange/Form.tsx b/src/components/materialization/OnIncompatibleSchemaChange/Form.tsx index 2c75c8432..12db88166 100644 --- a/src/components/materialization/OnIncompatibleSchemaChange/Form.tsx +++ b/src/components/materialization/OnIncompatibleSchemaChange/Form.tsx @@ -57,6 +57,7 @@ export default function Form() { return ( ); diff --git a/src/components/shared/Entity/Backfill.tsx b/src/components/shared/Entity/Backfill.tsx index 74ded26bc..783b1fc0a 100644 --- a/src/components/shared/Entity/Backfill.tsx +++ b/src/components/shared/Entity/Backfill.tsx @@ -3,8 +3,6 @@ import SectionWrapper from 'components/editor/Bindings/Backfill/SectionWrapper'; import { useEntityType } from 'context/EntityContext'; import { useEntityWorkflow_Editing } from 'context/Workflow'; import { useIntl } from 'react-intl'; -import OnIncompatibleSchemaChange from '../../materialization/OnIncompatibleSchemaChange'; -import ErrorBoundryWrapper from '../ErrorBoundryWrapper'; export default function Backfill() { const intl = useIntl(); @@ -12,21 +10,17 @@ export default function Backfill() { const entityType = useEntityType(); const isEdit = useEntityWorkflow_Editing(); - return isEdit || entityType === 'materialization' ? ( - - {isEdit ? ( - - ) : null} + if (!isEdit) { + return null; + } - {entityType === 'materialization' ? ( - - - - ) : null} + return ( + + - ) : null; + ); } diff --git a/src/lang/en-US/Materializations.ts b/src/lang/en-US/Materializations.ts index 3170062f1..7b75d63be 100644 --- a/src/lang/en-US/Materializations.ts +++ b/src/lang/en-US/Materializations.ts @@ -65,7 +65,7 @@ export const Materializations: Record = { 'materializationEdit.test.inProgress': `Please wait while we try to connect to the destination.`, 'materializationEdit.collectionSelector.heading': `Collection Selector`, - 'materializationEdit.collectionSelector.instructions': `The collections bound to your existing materialization. To update the configuration, please update the fields under the Config tab. To update the schema, click Edit under the Collection tab.`, + 'materializationEdit.collectionSelector.instructions': `The collections bound to your materialization. Update configuration under the Endpoint Config tab.`, 'materializationEdit.resourceConfig.heading': `Resource Configuration`, 'materializationEdit.save.failedErrorTitle': `Materialization Save Failed`, diff --git a/src/stores/Binding/Store.ts b/src/stores/Binding/Store.ts index 459bd4145..6e164984a 100644 --- a/src/stores/Binding/Store.ts +++ b/src/stores/Binding/Store.ts @@ -164,6 +164,7 @@ const getInitialMiscData = (): Pick< | 'discoveredCollections' | 'evolvedCollections' | 'onIncompatibleSchemaChange' + | 'onIncompatibleSchemaChangeErrorExists' | 'rediscoveryRequired' | 'resourceConfigErrorsExist' | 'resourceConfigErrors' @@ -185,6 +186,10 @@ const getInitialMiscData = (): Pick< discoveredCollections: [], evolvedCollections: [], onIncompatibleSchemaChange: undefined, + onIncompatibleSchemaChangeErrorExists: { + binding: false, + spec: false, + }, rediscoveryRequired: false, resourceConfigErrorsExist: false, resourceConfigErrors: [], @@ -926,6 +931,16 @@ const getInitialState = ( ); }, + setOnIncompatibleSchemaChangeErrorExists: (value, key) => { + set( + produce((state: BindingState) => { + state.onIncompatibleSchemaChangeErrorExists[key] = value; + }), + false, + 'On Incompatible Schema Change Error Exists Set' + ); + }, + setResourceSchema: async (val) => { const resolved = await getDereffedSchema(val); diff --git a/src/stores/Binding/types.ts b/src/stores/Binding/types.ts index e93afeafc..f04db3542 100644 --- a/src/stores/Binding/types.ts +++ b/src/stores/Binding/types.ts @@ -128,6 +128,14 @@ export interface BindingState value: string | undefined, bindingUUID: string | null ) => void; + onIncompatibleSchemaChangeErrorExists: { + binding: boolean; + spec: boolean; + }; + setOnIncompatibleSchemaChangeErrorExists: ( + value: boolean, + key: 'binding' | 'spec' + ) => void; // Resource Config resourceConfigs: ResourceConfigDictionary;