diff --git a/app/configurator/components/annotators.tsx b/app/configurator/components/annotators.tsx index 84788c9ee..992372902 100644 --- a/app/configurator/components/annotators.tsx +++ b/app/configurator/components/annotators.tsx @@ -9,10 +9,11 @@ import { ControlSectionContent, SubsectionTitle, } from "@/configurator/components/chart-controls/section"; -import { AnnotatorTabField } from "@/configurator/components/field"; +import { ChartAnnotatorTabField } from "@/configurator/components/field"; import { getFieldLabel } from "@/configurator/components/field-i18n"; import { isConfiguring, + isLayouting, useConfiguratorState, } from "@/configurator/configurator-state"; import { useLocale } from "@/locales/use-locale"; @@ -104,7 +105,7 @@ export const ChartAnnotator = () => { Title & Description - { } mainLabel={getFieldLabel("title")} /> - { ); }; -export const ConfiguratorAnnotator = () => {}; +export const LayoutAnnotator = () => { + const locale = useLocale(); + const [state] = useConfiguratorState(isLayouting); + const { title, description } = state.meta; + const disabled = !(title[locale] && description[locale]); + + return ( + + + Please add a title or description. + + ) : undefined + } + gutterBottom={false} + > + Title & Description + + + 123 + + + ); +}; diff --git a/app/configurator/components/chart-layouter.tsx b/app/configurator/components/chart-layouter.tsx deleted file mode 100644 index f3e7e4359..000000000 --- a/app/configurator/components/chart-layouter.tsx +++ /dev/null @@ -1,5 +0,0 @@ -import { ConfiguratorStateLayouting } from "@/config-types"; - -export const ChartLayouter = ({}: { state: ConfiguratorStateLayouting }) => { - return <>; -}; diff --git a/app/configurator/components/configurator.tsx b/app/configurator/components/configurator.tsx index 52433e66e..f8163bf42 100644 --- a/app/configurator/components/configurator.tsx +++ b/app/configurator/components/configurator.tsx @@ -31,6 +31,7 @@ import { PanelHeaderWrapper, PanelLayout, } from "@/configurator/components/layout"; +import { LayoutConfigurator } from "@/configurator/components/layout-configurator"; import { ChartConfiguratorTable } from "@/configurator/table/table-chart-configurator"; import SvgIcChevronLeft from "@/icons/components/IcChevronLeft"; import { useLocale } from "@/locales/use-locale"; @@ -281,7 +282,9 @@ const LayoutingStep = () => { - {state.layout.type} + + + ) => { - const fieldProps = useActiveFieldField({ - value, - }); - + const fieldProps = useActiveFieldField({ value }); const [state] = useConfiguratorState(isConfiguring); const locale = useLocale(); const hasText = useMemo(() => { @@ -552,12 +549,7 @@ export const MetaInputField = ({ value?: string; disabled?: boolean; }) => { - const field = useMetaField({ - metaKey, - locale, - value, - }); - + const field = useMetaField({ metaKey, locale, value }); return ; }; diff --git a/app/configurator/components/layout-configurator.tsx b/app/configurator/components/layout-configurator.tsx new file mode 100644 index 000000000..5fc2ac0a0 --- /dev/null +++ b/app/configurator/components/layout-configurator.tsx @@ -0,0 +1,9 @@ +import { LayoutAnnotator } from "@/configurator/components/annotators"; + +export const LayoutConfigurator = () => { + return ( + <> + + + ); +}; diff --git a/app/configurator/table/table-chart-configurator.tsx b/app/configurator/table/table-chart-configurator.tsx index fa9e7aa2a..19cd4b972 100644 --- a/app/configurator/table/table-chart-configurator.tsx +++ b/app/configurator/table/table-chart-configurator.tsx @@ -12,7 +12,7 @@ import { SubsectionTitle, } from "@/configurator/components/chart-controls/section"; import { ChartTypeSelector } from "@/configurator/components/chart-type-selector"; -import { AnnotatorTabField } from "@/configurator/components/field"; +import { ChartAnnotatorTabField } from "@/configurator/components/field"; import { useOrderedTableColumns } from "../components/ui-helpers"; @@ -95,15 +95,15 @@ export const ChartConfiguratorTable = ({ role="tablist" aria-labelledby="controls-settings" > - Settings} /> - Sorting} />