maverick/docbrown
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

"Empty State" for Invited Members (#17571)

Browse source 
* WIP: Adds an empty state to the invitations table

* Pulls invited member empty state into partial

* WIP: Center empty state within invited members table body

* Removes partial and adjusts empty space styling

* Adds an e2e for the empty state to invitedUsers.spec.js

* Moves empty state outside of table and adds aria-describedby to table

* Update app/views/admin/invitations/index.html.erb

Co-authored-by: Suzanne Aitchison <suzanne@forem.com>

* Adjusts ara-describedby erb tag

* Updates the route used within invitedUsers.spec.js to fix e2e failure

Co-authored-by: Suzanne Aitchison <suzanne@forem.com>
This commit is contained in:
Julianna Tetreault 2022-05-05 13:24:06 -06:00 • committed by GitHub
parent c9010c6e3d
commit 810d5cf3a6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 25 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
app/views/admin/invitations/index.html.erb
View file

@ -55,7 +55,7 @@
</div>
</header>
<table class="hidden m:table crayons-table crayons-table--minimal" width="100%">
<table class="hidden m:table crayons-table crayons-table--minimal" width="100%" <%= @invitations.empty? ? "aria-describedby='empty-state-message-id'".html_safe : "" %>>
<thead class="member-data-heading">
<tr>
<th scope="col" class="pl-7">Username</th>
@ -83,6 +83,16 @@
</tbody>
</table>
<% if @invitations.empty? %>
<div class="align-center flex flex-col my-auto py-7" id="empty-state-message-id">
<p class="fs-xl fw-normal mb-2">No members invited yet.</p>
<p class="color-secondary">Invite members and grow your community.</p>
</div>
<div class="flex grow-1 justify-content-center">
<%= link_to "Invite member", new_admin_invitation_path, class: "c-cta c-cta--branded ml-3" %>
</div>
<% end %>
<!-- Large screen layout end -->
<div class="flex justify-end p-4 xl:p-7">
<%= paginate @invitations, theme: "admin", scope: @invitations, label: "Paginate invitations", context: "bottom" %>

14
cypress/integration/seededFlows/adminFlows/users/invitedUsers.spec.js
View file

@ -135,3 +135,17 @@ describe('Invited users', () => {
cy.findByRole('button', { name: 'Cancel invite' }).click();
};
});
describe('No invited members', () => {
beforeEach(() => {
cy.testSetup();
cy.fixture('users/adminUser.json').as('user');
cy.get('@user').then((user) => {
cy.loginAndVisit(user, '/admin/member_manager/invitations');
});
});
it('displays an empty state', () => {
cy.findByText('No members invited yet.').should('exist');
});
});