backport of commit 62b1e39 (#22858)

Co-authored-by: Jordan Reimer <zofskeez@gmail.com>
hashicorp · Sep 7, 2023 · 68b3513 · 68b3513
1 parent 36a8292
commit 68b3513
Show file tree

Hide file tree

Showing 4 changed files with 17 additions and 13 deletions.
diff --git a/ui/lib/ldap/addon/components/accounts-checked-out.ts b/ui/lib/ldap/addon/components/accounts-checked-out.ts
@@ -6,7 +6,6 @@ import { waitFor } from '@ember/test-waiters';
 import errorMessage from 'vault/utils/error-message';
 
 import type FlashMessageService from 'vault/services/flash-messages';
-import type RouterService from '@ember/routing/router-service';
 import type AuthService from 'vault/services/auth';
 import type LdapLibraryModel from 'vault/models/ldap/library';
 import type { LdapLibraryAccountStatus } from 'vault/adapters/ldap/library';
@@ -15,11 +14,11 @@ interface Args {
   libraries: Array<LdapLibraryModel>;
   statuses: Array<LdapLibraryAccountStatus>;
   showLibraryColumn: boolean;
+  onCheckInSuccess: CallableFunction;
 }
 
 export default class LdapAccountsCheckedOutComponent extends Component<Args> {
   @service declare readonly flashMessages: FlashMessageService;
-  @service declare readonly router: RouterService;
   @service declare readonly auth: AuthService;
 
   @tracked selectedStatus: LdapLibraryAccountStatus | undefined;
@@ -62,8 +61,7 @@ export default class LdapAccountsCheckedOutComponent extends Component<Args> {
       const libraryModel = this.findLibrary(library);
       yield libraryModel.checkInAccount(account);
       this.flashMessages.success(`Successfully checked in the account ${account}.`);
-      // transitioning to the current route to trigger the model hook so we can fetch the updated status
-      this.router.transitionTo('vault.cluster.secrets.backend.ldap.libraries.library.details.accounts');
+      this.args.onCheckInSuccess();
     } catch (error) {
       this.selectedStatus = undefined;
       this.flashMessages.danger(`Error checking in the account ${account}. \n ${errorMessage(error)}`);

diff --git a/ui/lib/ldap/addon/components/page/library/details/accounts.hbs b/ui/lib/ldap/addon/components/page/library/details/accounts.hbs
@@ -1,5 +1,5 @@
 <div class="has-top-margin-l is-flex-align-start">
-  <Hds::Card::Container @level="mid" @hasBorder={{true}} class="has-padding-l is-flex-half">
+  <Hds::Card::Container @level="mid" @hasBorder={{true}} class="has-padding-l is-flex-half border-radius-2">
     <div class="is-flex-between">
       <h3 class="is-size-5 has-text-weight-semibold">All accounts</h3>
       {{#if @library.canCheckOut}}
@@ -34,7 +34,12 @@
   </Hds::Card::Container>
 
   <div class="has-left-margin-l is-flex-half">
-    <AccountsCheckedOut @libraries={{array @library}} @statuses={{@statuses}} data-test-checked-out-card />
+    <AccountsCheckedOut
+      @libraries={{array @library}}
+      @statuses={{@statuses}}
+      @onCheckInSuccess={{transition-to "vault.cluster.secrets.backend.ldap.libraries.library.details.accounts"}}
+      data-test-checked-out-card
+    />
 
     <OverviewCard
       @cardTitle="To renew a checked-out account"

diff --git a/ui/lib/ldap/addon/components/page/overview.hbs b/ui/lib/ldap/addon/components/page/overview.hbs
@@ -38,6 +38,7 @@
       @libraries={{@libraries}}
       @statuses={{@librariesStatus}}
       @showLibraryColumn={{true}}
+      @onCheckInSuccess={{transition-to "vault.cluster.secrets.backend.ldap.overview"}}
       class="is-flex-half"
     />
 

diff --git a/ui/tests/integration/components/ldap/accounts-checked-out-test.js b/ui/tests/integration/components/ldap/accounts-checked-out-test.js
@@ -40,11 +40,16 @@ module('Integration | Component | ldap | AccountsCheckedOut', function (hooks) {
       { account: 'bar.baz', available: false, library: 'test-library' },
       { account: 'checked.in', available: true, library: 'test-library' },
     ];
+    this.onCheckInSuccess = () => true;
     this.renderComponent = () => {
       return render(
         hbs`
           <div id="modal-wormhole"></div>
-          <AccountsCheckedOut @libraries={{array this.library}} @statuses={{this.statuses}} @showLibraryColumn={{this.showLibraryColumn}} />
+          <AccountsCheckedOut
+            @libraries={{array this.library}}
+            @statuses={{this.statuses}}
+            @showLibraryColumn={{this.showLibraryColumn}}
+            @onCheckInSuccess={{this.onCheckInSuccess}} />
         `,
         {
           owner: this.engine,
@@ -122,8 +127,8 @@ module('Integration | Component | ldap | AccountsCheckedOut', function (hooks) {
   test('it should check in account', async function (assert) {
     assert.expect(2);
 
-    const transitionStub = sinon.stub(this.owner.lookup('service:router'), 'transitionTo');
     this.library.disable_check_in_enforcement = 'Disabled';
+    this.onCheckInSuccess = () => assert.ok(true, 'Callback is fired on check-in success');
 
     this.server.post('/ldap-test/library/test-library/check-in', (schema, req) => {
       const json = JSON.parse(req.requestBody);
@@ -138,10 +143,5 @@ module('Integration | Component | ldap | AccountsCheckedOut', function (hooks) {
 
     await click('[data-test-checked-out-account-action="foo.bar"]');
     await click('[data-test-check-in-confirm]');
-
-    const didTransition = transitionStub.calledWith(
-      'vault.cluster.secrets.backend.ldap.libraries.library.details.accounts'
-    );
-    assert.true(didTransition, 'Transitions to accounts route on check-in success');
   });
 });