#434

frontend/src/components/counts/CountsAdditionalConditions.tsx

@@ -15,6 +15,7 @@ import { useUITranslation } from '@/lib/useUITranslation'
 
 import { readCountState, encodeCountState } from '@/lib/queryState'
 
+import type { CountsResult } from '@/lib/counts'
 import type { DialogueFormControls } from '@/lib/dialogues/useDialogue'
 import type { CountsCondition, CountsDefinition } from '@/lib/countsDefinitions'
 
@@ -93,7 +94,8 @@ const ConditionEditor = (
 }
 
 
-const CountsAdditionalConditions = ({ params, update }: {
+const CountsAdditionalConditions = ({ params, update, conditionLabels }: {
+    conditionLabels?: CountsResult['conditionLabels']
     params: URLSearchParams
     update: (key: string, value: string) => void },
 ) => {
@@ -162,7 +164,7 @@ const CountsAdditionalConditions = ({ params, update }: {
           <span>{countsAxisLabel (condition, definition, locale).text}</span>
           <span>{label ('operatorSymbols.eq')}</span>
           <span>{countsConditionValue (condition.value, condition, locale,
-              params.get ('timezone') ?? 'UTC')}</span>
+              params.get ('timezone') ?? 'UTC', conditionLabels)}</span>
           <Button type="button" variant="ghost" size="sm"
               aria-label={message ('remove').text}
               onClick={() => write (conditions.filter ((_, position) => position !== index))}>

frontend/src/components/counts/CountsControls.tsx

@@ -17,17 +17,18 @@ import { useClientMotion } from '@/lib/useClientMotion'
 import { inputClass } from '@/lib/utils'
 import { useUITranslation } from '@/lib/useUITranslation'
 
-import { readCountState, setCountState } from '@/lib/queryState'
+import { readCountState, setCountState, encodeCountState } from '@/lib/queryState'
 
 import type { ReactNode } from 'react'
 
-import type { CountsResource } from '@/lib/counts'
+import type { CountsResource, CountsResult } from '@/lib/counts'
 
 
 const CountsControls = (
     { resource, applied, open, setOpen, execute, displayJSON, displayRowNumbers,
-      displayThumbnail, reorder, actions, pending = false }: {
+      displayThumbnail, reorder, actions, conditionLabels, pending = false }: {
         resource: CountsResource; applied: URLSearchParams; open: boolean
+        conditionLabels?: CountsResult['conditionLabels']
         pending?: boolean
         setOpen: (open: boolean) => void
         execute: (params: URLSearchParams) => void
@@ -92,6 +93,27 @@ const CountsControls = (
   const update = (key: string, value: string) => setDraft (previous => {
     const next = new URLSearchParams (previous)
     setCountState (next, key, value)
+    if (key === 'tags')
+    {
+      const tokens = value.split (/\s+/).filter (token => token
+          && token.toLowerCase () !== 'type:or')
+      const remaining = [...tokens]
+      const references = readCountState<Record<string, string | number | boolean>[]> (
+          previous, 'tag_refs', []).flatMap (reference => {
+        const name = String (reference.name)
+        const exact = remaining.indexOf (name)
+        const index = exact >= 0 ? exact : remaining.findIndex (token =>
+            token.replace (/^not:/i, '') === name.replace (/^not:/i, ''))
+        if (index < 0) return []
+        const [token] = remaining.splice (index, 1)
+        return [token === name ? reference : { ...reference, name: token,
+            negative: token.toLowerCase ().startsWith ('not:') }]
+      })
+      for (const name of [...next.keys ()])
+        if (name === 'tag_refs' || name.startsWith ('tag_refs.')) next.delete (name)
+      if (references.length > 0)
+        setCountState (next, 'tag_refs', encodeCountState ('tag_refs', references))
+    }
     if (key === 'limit') next.delete ('page')
     if (next.toString () === previous.toString ()) return previous
     if (['rows', 'cols'].includes (key) && next.get ('sort') !== '') next.delete ('sort')
@@ -248,14 +270,6 @@ const CountsControls = (
                 <option value="all">AND</option><option value="any">OR</option>
               </select>
               {draft.get ('tags') && <>
-                {readCountState<Record<string, string | number>[]> (
-                    draft, 'tag_refs', []).map ((reference, index) => (
-                    <span key={index} className="text-sm">
-                      {reference.name} ({[reference.tag_id == null ? ''
-                          : `internal:${reference.tag_id}`,
-                          reference.external_tag_id == null ? ''
-                          : `external:${reference.external_tag_id}`].filter (Boolean).join (' ')})
-                    </span>))}
                 <Button type="button" variant="ghost" size="sm"
                     aria-label={message ('remove').text} onClick={() => setDraft (previous => {
                       const next = new URLSearchParams (previous)
@@ -267,7 +281,8 @@ const CountsControls = (
               </>}
             </div>}
           </FormField>}
-	  <CountsAdditionalConditions params={draft} update={update}/>
+	  <CountsAdditionalConditions params={draft} update={update}
+              conditionLabels={conditionLabels}/>
         </fieldset>
       </div>
     </div>

frontend/src/lib/counts.ts

@@ -77,6 +77,7 @@ export type CountsResult = {
     executionAt?: string
     columnValues?: (string | number | null)[][]
     cells?: { values: (string | number | null)[]; count: number }[]
+    conditionLabels?: Record<string, Record<string, string | null>>
     axisLabels?: Record<string, Record<string, string | null>>
     axisNames?: Record<string, Record<string, Record<string, unknown>>>
     rows?: { field: string; grain?: string }[]

frontend/src/lib/countsDisplay.ts

@@ -448,8 +448,16 @@ const countsDateValue = (
 export const countsConditionValue = (
     value: string | number | boolean | null | undefined,
     axis: CountsAxis, locale: LocaleCode, timezone: string,
+    labels?: Record<string, Record<string, string | null>>,
 ): string => {
+  if (axis.field === 'user' && value == null)
+    return translateUIMessage ('bot', 'counts', locale).text
   if (value == null) return 'NULL'
+  if (axis.field === 'tags' || axis.field === 'user')
+    return labels?.[axis.field]?.[String (value)]
+        || translateUIMessage ('notRegistered', 'counts', locale).text
+  if (axis.field === 'changed_field')
+    return translateUIMessage (countsFieldLabel (String (value)), 'counts', locale).text
   if (typeof value === 'boolean')
     return translateUIMessage (`truthValues.${value}`, 'counts', locale).text
   if (axis.grain != null)

frontend/src/pages/CountsResourcePage.tsx

@@ -342,7 +342,7 @@ const CountsResourceContent = (
 	    <div ref={controlsArea} className="shrink-0"
 		style={{ minHeight: definition == null ? controlsHeight : undefined }}>
 	      {definition != null && <CountsControls key={`${resource}:${params.get ('definition')}`}
-		  resource={resource} applied={params}
+		  resource={resource} applied={params} conditionLabels={data?.conditionLabels}
 		  pending={running || fetching || !params.has ('execution_at')}
 		  open={open} setOpen={setOpen}
 		  reorder={value => update ('order', value)}