JSON to Build a Schema & Config with Nested Arrays of Objects?

[michaelpward]

The first code block below is a sample of the kind of object I'm dealing with - there can be many objects nested at any of the 3 array "levels" reflected in this object (outerAnds, middleOrs, and innerAnds).

Notice that there are 2 objects nested in the array of innerAnds, "Subscription" and "Video", and 2 innerAnds are nested in the single middleOr.

The contents of the arrays are arbitrary based on user interaction in the UI.

This example from @ritchieanesco got me close - I'm having success nesting with only one object in each of the arrays.

But I'm failing to figure out the proper shapes for schema and config for arbitrary nesting.

I'm hoping that I can build these objects dynamically as users interact with the UI - which would be easy enough if knew the shapes needed.

The second code block... well, scroll down below the first and I'll show you what is working - but it doesn't reflect multiple array elements at any level.

const sampleObject = {
  outerAnds: [
    {
      middleOrs: [
        {
          innerAnds: [
            {
              slug: 'Subscription',
              label: 'Subscription',
              fields: {
                isIsNot: 'Is',
                subscription: '401978',
              },
            },
            {
              slug: 'Video',
              label: 'Video',
              fields: {
                didDidNot: 'Did',
                videoEvent: 'WATCH_25',
                video: 'About Net-Results',
              },
            },
          ],
        },
        {
          innerAnds: [
            {
              slug: 'VisitDuration',
              label: 'Website Visit Duration',
              fields: {
                isIsNot: 'Is',
                numberOptions: 'GreaterThan',
                valNumber: '30',
                timeUnits: 'Seconds',
              },
            },
          ],
        },
      ],
    },
  ],
};

Below are a schema and config that work (the correct validation errors show up in my form as desired) - but there is only one "element" at each of the 3 array "levels" in which this object can nest.

So it seems I'm almost there but need some syntax help :)

Thanks for trying!

  type: 'object',
  $schema: 'http://json-schema.org/draft-07/schema#',
  $id: 'example',
  title: 'Example',
  properties: {
    outerAnds: {
      type: 'array',
      items: {
        type: 'object',
        properties: {
          middleOrs: {
            type: 'array',
            items: {
              type: 'object',
              properties: {
                innerAnds: {
                  type: 'array',
                  items: {
                    type: 'object',
                    properties: {
                      fields: {
                        type: 'object',
                        properties: {
                          isIsNot: {
                            type: 'string',
                          },
                          subscription: {
                            type: 'string',
                          },
                        },
                        required: ['isIsNot', 'subscription'],
                      },
                    },
                  },
                },
              },
            },
          },
        },
      },
    },
  },
};

const config = {
  errors: {
    outerAnds: {
      middleOrs: {
        innerAnds: {
          fields: {
            isIsNot: {
              required: 'Please make a selection',
            },
            subscription: {
              required: 'Please choose a Subscription List',
              string: 'Please choose a Subscription List',
            },
          },
        },
      },
    },
  },
};