diff --git a/app/assets/sass/uswds/_uswds-theme-custom-styles.scss b/app/assets/sass/uswds/_uswds-theme-custom-styles.scss index 341ee6d9a..0dd904929 100644 --- a/app/assets/sass/uswds/_uswds-theme-custom-styles.scss +++ b/app/assets/sass/uswds/_uswds-theme-custom-styles.scss @@ -114,12 +114,46 @@ td.table-empty-message { text-decoration: none !important; } +.button-flex-header { + flex-direction: column; + align-items: flex-start; + @include at-media(desktop) { + flex-direction: row; + display: flex; + align-items: center; + justify-content: space-between; + } +} + .user-list-edit-link:active:before, .user-list-edit-link:focus:before { box-shadow: none; border: 0; } +.user-list { + display: inline-flex; + flex-wrap: wrap; + gap: units(2); + .user-list-item { + @include at-media(desktop) { + flex: 1 1 calc(50% - units(2)); + } + flex: 1 1 calc(100% - units(2)); + border: 1px solid color('gray-cool-10'); + padding: units(2); + .tick-cross-list-permissions { + margin: units(1) 0; + padding-left: units(2); + } + .hint { + display: block; + font-size: size("body", "sm"); + font-weight: normal; + } + } +} + .template-list-item-without-ancestors .template-list-folder:active, .template-list-item-without-ancestors .template-list-folder:active::before, .template-list-item-without-ancestors .template-list-folder:focus, diff --git a/app/templates/views/manage-users.html b/app/templates/views/manage-users.html index cab732a47..33e551672 100644 --- a/app/templates/views/manage-users.html +++ b/app/templates/views/manage-users.html @@ -9,10 +9,10 @@ {% block maincolumn_content %} -
-

- Team members -

+
+

+ Team members +

{% if current_user.has_permissions('manage_service') %} {{ usaButton({ "element": "a", @@ -32,68 +32,65 @@
{% for user in users %}
-
-
-

- {%- if user.name -%} - {{ user.name }}  - {%- endif -%} - - {%- if user.status == 'pending' -%} - {{ user.email_address }} (invited) - {%- elif user.status == 'cancelled' -%} - {{ user.email_address }} (cancelled invite) - {%- elif user.status == 'expired' -%} - {{ user.email_address }} (expired invite) - {%- elif user.id == current_user.id -%} - (you) - {% else %} - {{ user.email_address }} - {% endif %} - -

-

Permissions

-
    - {% for permission, label in permissions %} - {{ tick_cross( - user.has_permission_for_service(current_service.id, permission), - label - ) }} - {% endfor %} -
- {# only show if the service has folders #} - {% if current_service.all_template_folders %} -

- {% set folder_count = user.template_folders_for_service(current_service) | length %} - - {% if folder_count == 0 %} - Cannot see any folders - {% elif folder_count != current_service.all_template_folders | length %} - Can see {{ folder_count }} folder{% if folder_count > 1 %}s{% endif %} - {% else %} - Can see all folders - {% endif%} -

+

+ {%- if user.name -%} + {{ user.name }} + {%- endif -%} + {%- if user.status == 'pending' -%} + {{ user.email_address }}(invited) + {%- elif user.status == 'cancelled' -%} + {{ user.email_address }}(cancelled invite) + {%- elif user.status == 'expired' -%} + {{ user.email_address }}(expired invite) + {%- elif user.id == current_user.id -%} + (you) + {% else %} + {{ user.email_address }} + {% endif %} +

+

Permissions

+
    + {% for permission, label in permissions %} + {{ tick_cross( + user.has_permission_for_service(current_service.id, permission), + label + ) }} + {% endfor %} +
+ {# only show if the service has folders #} + {% if current_service.all_template_folders %} +

+ {% set folder_count = user.template_folders_for_service(current_service) | length %} + {% if folder_count == 0 %} + Cannot see any folders + {% elif folder_count != current_service.all_template_folders | length %} + Can see {{ folder_count }} folder{% if folder_count > 1 %}s{% endif %} + {% else %} + Can see all folders + {% endif%} +

+ {% endif %} + {% if current_service.has_permission('email_auth') %} +

+ Signs in with + {{ user.auth_type | format_auth_type(with_indefinite_article=True) }} +

+ {% endif %} + {% if current_service.has_permission('email_auth') %} +

+ Signs in with + {{ user.auth_type | format_auth_type(with_indefinite_article=True) }} +

+ {% endif %} + {% if current_user.has_permissions('manage_service') %} + {% if user.status == 'pending' %} + Cancel invitation for {{ user.email_address }} + {% elif user.status == 'expired' %} + Resend invite for {{ user.email_address }} + {% elif user.is_editable_by(current_user) %} + Change details for {{ user.name }} {{ user.email_address }} {% endif %} - {% if current_service.has_permission('email_auth') %} -

- Signs in with - {{ user.auth_type | format_auth_type(with_indefinite_article=True) }} -

- {% endif %} -
-
- {% if current_user.has_permissions('manage_service') %} - {% if user.status == 'pending' %} - Cancel invitation for {{ user.email_address }} - {% elif user.status == 'expired' %} - Resend invite for {{ user.email_address }} - {% elif user.is_editable_by(current_user) %} - Change details for {{ user.name }} {{ user.email_address }} - {% endif %} - {% endif %} -
-
+ {% endif %}
{% endfor %}
diff --git a/tests/app/main/views/test_manage_users.py b/tests/app/main/views/test_manage_users.py index a6877a142..9bdabf925 100644 --- a/tests/app/main/views/test_manage_users.py +++ b/tests/app/main/views/test_manage_users.py @@ -27,7 +27,7 @@ from tests.conftest import ( ( create_active_user_with_permissions(), ( - "Test User (you) " + "Test User(you) " "Permissions " "Can See dashboard " "Can Send messages " @@ -39,18 +39,18 @@ from tests.conftest import ( ), ( create_active_user_empty_permissions(), - ("Test User With Empty Permissions (you) " "Permissions"), + ("Test User With Empty Permissions(you) " "Permissions"), False, ), ( create_active_user_view_permissions(), - ("Test User With Permissions (you) " "Permissions " "Can See dashboard"), + ("Test User With Permissions(you) " "Permissions " "Can See dashboard"), False, ), ( create_active_user_manage_template_permissions(), ( - "Test User With Permissions (you) " + "Test User With Permissions(you) " "Permissions " "Can See dashboard " "Can Add and edit templates" @@ -232,7 +232,7 @@ def test_should_show_caseworker_on_overview_page( assert normalize_spaces(page.select_one("h1").text) == "Team members" assert normalize_spaces(page.select(".user-list-item")[0].text) == ( - "Test User With Permissions (you) " "Permissions " "Can See dashboard" + "Test User With Permissions(you) " "Permissions " "Can See dashboard" ) # [1:5] are invited users assert normalize_spaces(page.select(".user-list-item")[6].text) == ( @@ -1240,7 +1240,7 @@ def test_cancel_invited_user_doesnt_work_if_user_not_invited_to_this_service( ( "pending", ( - "invited_user@test.gsa.gov (invited) " + "invited_user@test.gsa.gov(invited) " "Permissions " "Can See dashboard " "Can Send messages " @@ -1252,7 +1252,7 @@ def test_cancel_invited_user_doesnt_work_if_user_not_invited_to_this_service( ( "cancelled", ( - "invited_user@test.gsa.gov (cancelled invite) " + "invited_user@test.gsa.gov(cancelled invite) " "Permissions" # all permissions are greyed out ), @@ -1413,10 +1413,7 @@ def test_manage_user_page_shows_how_many_folders_user_can_view( user_div = page.select_one( "h2[title='notify@digital.cabinet-office.gov.uk']" ).parent - assert ( - user_div.select_one(".tick-cross-list-hint:last-child").text.strip() - == expected_message - ) + assert user_div.select_one(".tick-cross-list-hint").text.strip() == expected_message def test_manage_user_page_doesnt_show_folder_hint_if_service_has_no_folders(