Test coverage and disable button fix on Secrets Sync opt-in modal (#25907)

* fix issue of checkbox value not disabling after canceling the modal

* add component test coverage in overview

* add acceptance test to see flow show banner to not show banner

* comment change

* remove unecessary hash and add settled because ci is funny

* circle ci play nice

* forgot to add my changes 🙃

* blah

* that was a lot for delinating the errors properly—😵‍💫

* pr review comments, thank you for the catches team

ui/lib/sync/addon/components/secrets/page/overview.ts

@@ -18,13 +18,13 @@ import type RouterService from '@ember/routing/router-service';
 import type VersionService from 'vault/services/version';
 import type { SyncDestinationAssociationMetrics } from 'vault/vault/adapters/sync/association';
 import type SyncDestinationModel from 'vault/vault/models/sync/destination';
-import type { HTMLElementEvent } from 'vault/forms';
+import type AdapterError from '@ember/test/adapter';
 
 interface Args {
   destinations: Array<SyncDestinationModel>;
   totalVaultSecrets: number;
   activatedFeatures: Array<string>;
-  isAdapterError: boolean;
+  adapterError: AdapterError | null;
 }
 
 export default class SyncSecretsDestinationsPageComponent extends Component<Args> {
@@ -36,7 +36,8 @@ export default class SyncSecretsDestinationsPageComponent extends Component<Args
   @tracked destinationMetrics: SyncDestinationAssociationMetrics[] = [];
   @tracked page = 1;
   @tracked showActivateSecretsSyncModal = false;
-  @tracked confirmDisabled = true;
+  @tracked hasConfirmedDocs = false;
+  @tracked error = null;
 
   pageSize = Ember.testing ? 3 : 5; // lower in tests to test pagination without seeding more data
 
@@ -48,9 +49,6 @@ export default class SyncSecretsDestinationsPageComponent extends Component<Args
   }
 
   get isActivated() {
-    if (this.args.isAdapterError) {
-      return false;
-    }
     return this.args.activatedFeatures.includes('secrets-sync');
   }
 
@@ -68,8 +66,9 @@ export default class SyncSecretsDestinationsPageComponent extends Component<Args
   });
 
   @action
-  onDocsConfirmChange(event: HTMLElementEvent<HTMLInputElement>) {
-    this.confirmDisabled = !event.target.checked;
+  resetOptInModal() {
+    this.showActivateSecretsSyncModal = false;
+    this.hasConfirmedDocs = false;
   }
 
   @task
@@ -81,9 +80,10 @@ export default class SyncSecretsDestinationsPageComponent extends Component<Args
         .ajax('/v1/sys/activation-flags/secrets-sync/activate', 'POST');
       this.router.transitionTo('vault.cluster.sync.secrets.overview');
     } catch (error) {
+      this.error = errorMessage(error);
       this.flashMessages.danger(`Error enabling feature \n ${errorMessage(error)}`);
     } finally {
-      this.showActivateSecretsSyncModal = false;
+      this.resetOptInModal();
     }
   }
 }