#434

frontend/src/components/counts/CountsControls.tsx

@@ -14,12 +14,13 @@ import type { CountsResource } from '@/lib/counts'
 
 
 const CountsControls = (
-    { resource, applied, open, setOpen, execute }: {
+    { resource, applied, open, setOpen, execute, displayJSON }: {
 	resource: CountsResource
 	applied: URLSearchParams
 	open: boolean
 	setOpen: (open: boolean) => void
-	execute: (params: URLSearchParams) => void },
+	execute: (params: URLSearchParams) => void
+	displayJSON: (enabled: boolean) => void },
 ) => {
   const { label, message } = useUITranslation ('counts')
   const locale = useLocale ()
@@ -92,6 +93,14 @@ const CountsControls = (
 	  <div className="grid gap-4 md:grid-cols-2">
 	    <fieldset className="min-w-0" data-counts-output>
 	      <legend className="mb-2 font-semibold">{label ('output')}</legend>
+	      <label className="mb-2 flex items-center gap-1">
+		<input type="checkbox" checked={draft.get ('nested_json') === '1'}
+		    onChange={event => {
+		      update ('nested_json', event.target.checked ? '1' : '0')
+		      displayJSON (event.target.checked)
+		    }}/>
+		{label ('nested.asJSON')}
+	      </label>
 	      {mode === 'summary' ? (
 		  <label className="flex flex-wrap items-center gap-2">
 		    {label ('axis')}