GDB-10937: Automatically Update Validation in Create/Edit Agent Dialog (

#1660)

* GDB-10937: Automatically Update Validation in Create/Edit Agent Dialog

## What
The validation for the create/edit agent dialog is refreshed when the dialog’s tab becomes active.

## Why
When users open the create/edit agent dialog and select the "FTS," "Similarity," or "ChatGPT" execution method, a help message appears if the required settings are not yet configured in GraphDB. This message provides a link to the appropriate view in the workbench. After users navigate to that view and complete the necessary setup, they can return to the dialog tab, where the validation will update automatically to reflect these changes, eliminating the need for additional manual refresh actions.

## How
An event listener was added to detect when the user reactivates the tab containing the open create/edit agent dialog. When this event occurs, the dialog’s validation is automatically refreshed to incorporate any changes the user made.

## Additional work
Added validation to the Full-text Search (FTS) query method.

src/js/angular/models/ttyg/agent-form.js

@@ -260,6 +260,10 @@ export class ExtractionMethodsFormModel {
     getRetrievalExtractionMethod() {
         return this.getExtractionMethod(ExtractionMethod.RETRIEVAL);
     }
+
+    getFTSSearchExtractionMethod() {
+        return this.getExtractionMethod(ExtractionMethod.FTS_SEARCH);
+    }
 }
 
 export class ExtractionMethodFormModel {

src/js/angular/ttyg/controllers/agent-settings-modal.controller.js

@@ -241,6 +241,9 @@ function AgentSettingsModalController(
      */
     $scope.updateSimilaritySearchPanel = (clearIndexSelection = false) => {
         const similaritySearchExtractionMethod = $scope.agentFormModel.assistantExtractionMethods.getSimilarityExtractionMethod();
+        if (!similaritySearchExtractionMethod.selected) {
+            return;
+        }
         if (clearIndexSelection) {
             similaritySearchExtractionMethod.similarityIndex = null;
         }
@@ -254,6 +257,9 @@ function AgentSettingsModalController(
      */
     $scope.updateRetrievalConnectorPanel = (clearSelection = false) => {
         const retrievalExtractionExtractionMethod = $scope.agentFormModel.assistantExtractionMethods.getRetrievalExtractionMethod();
+        if (!retrievalExtractionExtractionMethod.selected) {
+            return;
+        }
         if (clearSelection) {
             retrievalExtractionExtractionMethod.retrievalConnectorInstance = null;
         }
@@ -262,8 +268,19 @@ function AgentSettingsModalController(
 
     $scope.checkIfFTSEnabled = () => {
         if (!$scope.agentFormModel.repositoryId) {
+            $scope.agentSettingsForm.$setValidity('FTSDisabled', false);
             return;
         }
+
+        const ftsSearchExtractionMethod = $scope.agentFormModel.assistantExtractionMethods.getFTSSearchExtractionMethod();
+        if (!ftsSearchExtractionMethod.selected) {
+            // clear the validation status if method is deselected.
+            $scope.agentSettingsForm.$setValidity('FTSDisabled', true);
+            return;
+        }
+
+        $scope.extractionMethodLoaderFlags[ExtractionMethod.FTS_SEARCH] = true;
+
         // pass a fake repository info object with only an id because we don't care for the location
         RepositoriesRestService.getRepositoryModel({id: $scope.agentFormModel.repositoryId}).then((repositoryModel) => {
             $scope.ftsEnabled = repositoryModel.getParamValue(REPOSITORY_PARAMS.enableFtsIndex);
@@ -273,6 +290,7 @@ function AgentSettingsModalController(
         })
         .finally(() => {
             $scope.extractionMethodLoaderFlags[ExtractionMethod.FTS_SEARCH] = false;
+            $scope.agentSettingsForm.$setValidity('FTSDisabled', $scope.ftsEnabled);
         });
     };
 
@@ -282,9 +300,7 @@ function AgentSettingsModalController(
      * able to validate if the FTS is enabled for that selected repository.
      */
     $scope.onRepositoryChange = () => {
-        $scope.checkIfFTSEnabled();
-        $scope.updateSimilaritySearchPanel(true);
-        $scope.updateRetrievalConnectorPanel(true);
+        refreshValidations(true, true);
     };
 
     /**
@@ -442,7 +458,6 @@ function AgentSettingsModalController(
     };
 
     const handleFTSExtractionMethodPanelToggle = (extractionMethod) => {
-        $scope.extractionMethodLoaderFlags[extractionMethod.method] = true;
         $scope.checkIfFTSEnabled();
     };
 
@@ -556,6 +571,32 @@ function AgentSettingsModalController(
         [ExtractionMethod.RETRIEVAL]: (extractionMethod) => handleRetrievalConnectorExtractionMethodPanelToggle(extractionMethod)
     };
 
+    const refreshValidations = (clearIndexSelection = false, clearRetrievalConnectorSelection = false) => {
+        $scope.checkIfFTSEnabled();
+        $scope.updateSimilaritySearchPanel(clearIndexSelection);
+        $scope.updateRetrievalConnectorPanel(clearRetrievalConnectorSelection);
+    };
+
+    const onTabVisibilityChanged = () => {
+        if (!document.hidden) {
+            refreshValidations();
+        }
+    };
+
+    // =========================
+    // Subscriptions
+    // =========================
+
+    const removeAllSubscribers = () => {
+        document.removeEventListener("visibilitychange", onTabVisibilityChanged);
+    };
+
+    document.addEventListener("visibilitychange", onTabVisibilityChanged);
+
+    // Deregister the watcher when the scope/directive is destroyed
+    $scope.$on('$destroy', removeAllSubscribers);
+
+
     // =========================
     // Initialization
     // =========================

src/js/angular/ttyg/templates/modal/agent-settings-modal.html

@@ -134,6 +134,7 @@ <h4 class="modal-title">{{(
 
                         <div
                             ng-if="extractionMethod.expanded && extractionMethod.method === extractionMethods.FTS_SEARCH"
+                            ng-class="{'has-error': agentSettingsForm.$error.FTSDisabled}"
                             class="extraction-method-options">
                             <button class="btn btn-link btn-sm pull-right"
                                     ng-click="checkIfFTSEnabled()"
@@ -167,6 +168,7 @@ <h4 class="modal-title">{{(
 
                         <div
                             ng-if="extractionMethod.expanded && extractionMethod.method === extractionMethods.SIMILARITY"
+                            ng-class="{'has-error': agentSettingsForm.$error.missingIndex}"
                             class="extraction-method-options">
                             <button class="btn btn-link btn-sm pull-right"
                                     ng-click="updateSimilaritySearchPanel()"

test-cypress/integration/ttyg/create-agent.spec.js

@@ -517,14 +517,26 @@ describe('TTYG create new agent', () => {
         TtygAgentSettingsModalSteps.getSystemInstructionsWarning().should('not.exist');
     });
 
-    it('should reset validation error when similarity search/ChatGPT connector are disabled', () => {
+    it('should reset validation error when FTS, similarity search or ChatGPT connector are disabled', () => {
         // When I open agent settings dialog and make all steps so the create button became enabled.
         TTYGStubs.stubChatsListGetNoResults();
         TTYGStubs.stubAgentListGet('/ttyg/agent/get-agent-list-0.json');
+        SimilarityIndexStubs.stubGetSimilarityIndexes('/similarity/get-similarity-indexes-0.json');
         TTYGViewSteps.visit();
         cy.wait('@get-all-repositories');
         TTYGViewSteps.createFirstAgent();
+        TtygAgentSettingsModalSteps.enableSparqlExtractionMethod();
+        TtygAgentSettingsModalSteps.selectSparqlMethodOntologyGraph();
+        TtygAgentSettingsModalSteps.getSaveAgentButton().should('be.enabled');
+
+        // When enable FTS extraction method and selected repository has not fts search enabled.
         TtygAgentSettingsModalSteps.enableFtsExtractionMethod();
+        // Then I expect the create button be disabled.
+        TtygAgentSettingsModalSteps.getSaveAgentButton().should('be.disabled');
+
+        // When I disable FTS extraction method
+        TtygAgentSettingsModalSteps.disableFtsExtractionMethod();
+        // Then I expect the save button be enabled because is deselected
         TtygAgentSettingsModalSteps.getSaveAgentButton().should('be.enabled');
 
         // When enable the similarity index method