diff --git a/ui/src/views/admin/listForm/edit/ChartTabCrosshair.tsx b/ui/src/views/admin/listForm/edit/ChartTabCrosshair.tsx
index e642b162..a193a54e 100644
--- a/ui/src/views/admin/listForm/edit/ChartTabCrosshair.tsx
+++ b/ui/src/views/admin/listForm/edit/ChartTabCrosshair.tsx
@@ -24,7 +24,7 @@ function ChartTabCrosshair(props: FormEditProps) {
initialValues={listFormValues}
validationSchema={schema}
onSubmit={async (values, formikHelpers) => {
- await props.onSubmit(ListFormEditTabs.ChartCrosshair, values, formikHelpers)
+ await props.onSubmit(ListFormEditTabs.ChartCrosshairForm, values, formikHelpers)
}}
>
{({ touched, errors, resetForm, isSubmitting, values }) => (
diff --git a/ui/src/views/admin/listForm/edit/ChartTabExport.tsx b/ui/src/views/admin/listForm/edit/ChartTabExport.tsx
index 0b729756..caa9483b 100644
--- a/ui/src/views/admin/listForm/edit/ChartTabExport.tsx
+++ b/ui/src/views/admin/listForm/edit/ChartTabExport.tsx
@@ -21,7 +21,7 @@ function ChartTabExport(props: FormEditProps) {
initialValues={listFormValues}
validationSchema={schema}
onSubmit={async (values, formikHelpers) => {
- await props.onSubmit(ListFormEditTabs.ChartExport, values, formikHelpers)
+ await props.onSubmit(ListFormEditTabs.ChartExportForm, values, formikHelpers)
}}
>
{({ touched, errors, resetForm, isSubmitting, values }) => (
diff --git a/ui/src/views/admin/listForm/edit/ChartTabLegend.tsx b/ui/src/views/admin/listForm/edit/ChartTabLegend.tsx
index f75a2a73..3fc3aa01 100644
--- a/ui/src/views/admin/listForm/edit/ChartTabLegend.tsx
+++ b/ui/src/views/admin/listForm/edit/ChartTabLegend.tsx
@@ -39,7 +39,7 @@ function ChartTabLegend(props: FormEditProps) {
initialValues={listFormValues}
validationSchema={schema}
onSubmit={async (values, formikHelpers) => {
- await props.onSubmit(ListFormEditTabs.ChartLegend, values, formikHelpers)
+ await props.onSubmit(ListFormEditTabs.ChartLegendForm, values, formikHelpers)
}}
>
{({ touched, errors, resetForm, isSubmitting, values }) => (
diff --git a/ui/src/views/admin/listForm/edit/ChartTabPanes.tsx b/ui/src/views/admin/listForm/edit/ChartTabPanes.tsx
index 48a2ef6f..f354af7d 100644
--- a/ui/src/views/admin/listForm/edit/ChartTabPanes.tsx
+++ b/ui/src/views/admin/listForm/edit/ChartTabPanes.tsx
@@ -11,14 +11,17 @@ import { useStoreState } from '@/store/store'
import { useLocalization } from '@/utils/hooks/useLocalization'
import { ListFormEditTabs } from '@/proxy/admin/list-form/models'
import { object, string } from 'yup'
+import { JsonRowDialogData } from './json-row-operations/types'
+import { useState } from 'react'
+import JsonRowOpDialogPane from './json-row-operations/JsonRowOpDialogPane'
const schema = object().shape({
- name: string().required(),
+ backgroundColor: string().notRequired(),
})
-function ChartTabPanes(
- props: FormEditProps & { setDatabaseOperationsModalData: Function; setConfirmDelete: Function },
-) {
+function ChartTabPanes(props: FormEditProps) {
+ const [isJsonRowOpDialogOpen, setIsJsonRowOpDialogOpen] = useState(false)
+ const [jsonRowOpModalData, setJsonRowOpModalData] = useState()
const { translate } = useLocalization()
const listFormValues = useStoreState((s) => s.admin.listFormValues)
@@ -31,7 +34,11 @@ function ChartTabPanes(
initialValues={listFormValues}
validationSchema={schema}
onSubmit={async (values, formikHelpers) => {
- await props.onSubmit(ListFormEditTabs.ChartPanes, values, formikHelpers)
+ await props.onSubmit(
+ ListFormEditTabs.ChartPanes.CommonPanesSettingForm,
+ values,
+ formikHelpers,
+ )
}}
>
{({ touched, errors, resetForm, isSubmitting, values }) => (
@@ -65,12 +72,13 @@ function ChartTabPanes(
icon={}
onClick={async (e) => {
e.preventDefault()
- props.setDatabaseOperationsModalData({
+ setJsonRowOpModalData({
+ tabName: ListFormEditTabs.ChartPanes.PanesJsonRow,
+ operation: 'create',
id: values.id ?? '',
index: -1,
- isOpen: 'pane',
- operation: 'insert',
})
+ setIsJsonRowOpDialogOpen(true)
}}
/>
@@ -92,14 +100,14 @@ function ChartTabPanes(
title="Edit"
icon={}
onClick={async (e) => {
- e.preventDefault()
- props.setDatabaseOperationsModalData({
+ setJsonRowOpModalData({
+ tabName: ListFormEditTabs.ChartPanes.PanesJsonRow,
+ operation: 'update',
id: values.id ?? '',
index,
- isOpen: 'pane',
- operation: 'update',
- panesValues: listFormValues.panesDto[index],
+ chartPaneValues: values.panesDto[index],
})
+ setIsJsonRowOpDialogOpen(true)
}}
/>
}
- onClick={async (e) => {
- e.preventDefault()
- props.setConfirmDelete({
- isOpen: true,
+ onClick={async () => {
+ setJsonRowOpModalData({
+ tabName: ListFormEditTabs.ChartPanes.PanesJsonRow,
+ operation: 'delete',
id: values.id ?? '',
- fieldName: 'pane',
index,
})
+ setIsJsonRowOpDialogOpen(true)
}}
/>
@@ -129,6 +137,12 @@ function ChartTabPanes(
+
@@ -161,6 +169,12 @@ function ChartTabSeries(
+