From 028e5245e80a56b75b63073384545813702239fb Mon Sep 17 00:00:00 2001
From: shamoon <4887959+shamoon@users.noreply.github.com>
Date: Thu, 5 Sep 2024 16:46:37 -0700
Subject: [PATCH] Handle UI max atoms / depth

---
 .../custom-fields-query-dropdown.component.html    |  4 ++--
 .../custom-fields-query-dropdown.component.ts      | 14 +++++---------
 src-ui/src/app/data/custom-field-query.ts          |  3 +++
 3 files changed, 10 insertions(+), 11 deletions(-)

diff --git a/src-ui/src/app/components/common/custom-fields-query-dropdown/custom-fields-query-dropdown.component.html b/src-ui/src/app/components/common/custom-fields-query-dropdown/custom-fields-query-dropdown.component.html
index a36afa2b3..4c3dd1a9e 100644
--- a/src-ui/src/app/components/common/custom-fields-query-dropdown/custom-fields-query-dropdown.component.html
+++ b/src-ui/src/app/components/common/custom-fields-query-dropdown/custom-fields-query-dropdown.component.html
@@ -105,10 +105,10 @@
       </div>
     </div>
     <div class="btn-group-vertical ms-2 ps-2 border-start" role="group" aria-label="Vertical button group">
-      <button type="button" class="btn btn-sm btn-outline-secondary text-primary" title="Add query" i18n-title (click)="addAtom(expression)" [disabled]="disabled">
+      <button type="button" class="btn btn-sm btn-outline-secondary text-primary" title="Add query" i18n-title (click)="addAtom(expression)" [disabled]="disabled || expression.value.length === CUSTOM_FIELD_QUERY_MAX_ATOMS">
         <i-bs name="node-plus"></i-bs>
       </button>
-      <button type="button" class="btn btn-sm btn-outline-secondary text-primary" title="Add expression" i18n-title (click)="addExpression(expression)" [disabled]="disabled">
+      <button type="button" class="btn btn-sm btn-outline-secondary text-primary" title="Add expression" i18n-title (click)="addExpression(expression)" [disabled]="disabled || expression.depth === CUSTOM_FIELD_QUERY_MAX_DEPTH">
         <i-bs name="braces"></i-bs>
       </button>
       @if (expression.depth > 0) {
diff --git a/src-ui/src/app/components/common/custom-fields-query-dropdown/custom-fields-query-dropdown.component.ts b/src-ui/src/app/components/common/custom-fields-query-dropdown/custom-fields-query-dropdown.component.ts
index 855c8fce6..d5eacd1bf 100644
--- a/src-ui/src/app/components/common/custom-fields-query-dropdown/custom-fields-query-dropdown.component.ts
+++ b/src-ui/src/app/components/common/custom-fields-query-dropdown/custom-fields-query-dropdown.component.ts
@@ -1,11 +1,4 @@
-import {
-  Component,
-  EventEmitter,
-  Injectable,
-  Input,
-  Output,
-} from '@angular/core'
-import { NgbDateAdapter, NgbDateStruct } from '@ng-bootstrap/ng-bootstrap'
+import { Component, EventEmitter, Input, Output } from '@angular/core'
 import { Subject, first, takeUntil } from 'rxjs'
 import { CustomField, CustomFieldDataType } from 'src/app/data/custom-field'
 import {
@@ -18,9 +11,10 @@ import {
   CustomFieldQueryOperatorGroups,
   CUSTOM_FIELD_QUERY_OPERATOR_LABELS,
   CustomFieldQueryElement,
+  CUSTOM_FIELD_QUERY_MAX_DEPTH,
+  CUSTOM_FIELD_QUERY_MAX_ATOMS,
 } from 'src/app/data/custom-field-query'
 import { CustomFieldsService } from 'src/app/services/rest/custom-fields.service'
-import { ISODateAdapter } from 'src/app/utils/ngb-iso-date-adapter'
 
 export class CustomFieldQueriesModel {
   public queries: CustomFieldQueryElement[] = []
@@ -131,6 +125,8 @@ export class CustomFieldsQueryDropdownComponent {
   public CustomFieldQueryComponentType = CustomFieldQueryElementType
   public CustomFieldQueryOperator = CustomFieldQueryOperator
   public CustomFieldDataType = CustomFieldDataType
+  public CUSTOM_FIELD_QUERY_MAX_DEPTH = CUSTOM_FIELD_QUERY_MAX_DEPTH
+  public CUSTOM_FIELD_QUERY_MAX_ATOMS = CUSTOM_FIELD_QUERY_MAX_ATOMS
 
   @Input()
   title: string
diff --git a/src-ui/src/app/data/custom-field-query.ts b/src-ui/src/app/data/custom-field-query.ts
index bdd896466..2e530b8da 100644
--- a/src-ui/src/app/data/custom-field-query.ts
+++ b/src-ui/src/app/data/custom-field-query.ts
@@ -126,6 +126,9 @@ export const CUSTOM_FIELD_QUERY_VALUE_TYPES_BY_OPERATOR = {
   // [CustomFieldQueryOperator.Range]: 'array',
 }
 
+export const CUSTOM_FIELD_QUERY_MAX_DEPTH = 4
+export const CUSTOM_FIELD_QUERY_MAX_ATOMS = 5
+
 export enum CustomFieldQueryElementType {
   Atom = 'Atom',
   Expression = 'Expression',