Merge pull request #8140 from DavidKang/typography-user-show

Typography user show

src/api/app/assets/javascripts/webui2/application.js

@@ -33,6 +33,7 @@
 //= require webui2/users_groups.js
 //= require webui2/popover.js
 //= require webui2/repositories.js
+//= require webui2/users.js
 // FIXME refactor these files
 //= require webui2/autocomplete.js
 //= require webui2/comment.js

src/api/app/assets/javascripts/webui2/users.js

@@ -0,0 +1,5 @@
+function switchBeta() { // jshint ignore:line
+  $('#beta-switch').on('click', function (){
+    $('#beta-form').submit();
+  });
+}

src/api/app/assets/stylesheets/webui2/user.scss

@@ -1,7 +1,3 @@
-#home-login {
-  color: $gray-500;
-}
-
 .activity-percentil0 {
   background-color: #dcd5da;
 }

src/api/app/controllers/webui/user_controller.rb

@@ -53,7 +53,8 @@ def save
     end
 
     if @configuration.accounts_editable?(@displayed_user)
-      @displayed_user.assign_attributes(params[:user].slice(:realname, :email, :in_beta).permit!)
+      @displayed_user.assign_attributes(params[:user].slice(:realname, :email).permit!)
+      @displayed_user.toggle(:in_beta) if params[:user][:in_beta]
     end
 
     if User.admin_session?

src/api/app/views/webui2/webui/user/_info.html.haml

@@ -2,65 +2,63 @@
   .card-body
     = image_tag_for(user)
 
-    %h4.home-usertitle.mt-4
-      #home-realname
-        = user.realname
-    %h4.d-inline-block#home-login
+    %h4.mb-0.mt-4#home-realname
+      = user.realname
+    %h5.d-inline-block.mb-0.align-middle.text-muted#home-login
       = user.login
+    - if User.session
+      = mail_to(user.email, title: "Send mail to #{user.name}", class: 'd-block') do
+        %i.fas.fa-envelope
+        = user.email
     - role_titles.each do |title|
-      %span.badge.badge-secondary.align-top
+      %span.badge.badge-secondary
         = title.upcase
 
-    - if User.session
-      %p
-        = mail_to user.email, title: "Send mail to #{user.name}" do
-          %i.fas.fa-envelope
-          = user.email
-
     - if groups.any?
-      Member of the #{'group'.pluralize(groups.size)}
-      %ul
-        - groups.each do |group|
-          %li
-            = link_to(group_show_path(group)) do
-              #{group.title}
-              %span.badge.badge-primary.align-top
-                #{group.tasks} #{'task'.pluralize(group.tasks)}
+      .mt-4
+        Member of the #{'group'.pluralize(groups.size)}
+        %ul
+          - groups.each do |group|
+            %li
+              = link_to(group_show_path(group)) do
+                #{group.title}
+                %span.badge.badge-primary.align-baseline
+                  #{group.tasks} #{'task'.pluralize(group.tasks)}
 
     - if is_user
-      - if user.in_beta?
-        %p
-          .badge.badge-info
-            In public beta program
-        = link_to(user_save_path(user: { login: user.login, in_beta: 0 }), method: :post) do
-          %i.fas.fa-sign-out-alt
-          Leave public beta program
-      - else
-        = link_to(user_save_path(user: { login: user.login, in_beta: 1 }), method: :post) do
-          %i.fas.fa-sign-in-alt
-          Join public beta program
-      %br
-      - if configuration.accounts_editable?(user)
-        - if account_edit_link.present?
-          = link_to account_edit_link do
-            %i.fas.fa-user-edit
-            Edit your account
-        - else
-          = link_to('#', data: { toggle: 'modal', target: '#edit-modal' }) do
-            %i.fas.fa-user-edit
-            Edit your account
-        %br
-      - if configuration.passwords_changable?(user)
-        = link_to('#', data: { toggle: 'modal', target: '#password-modal' }) do
-          %i.fas.fa-key
-          Change your password
-        %br
-      = link_to user_notifications_path do
-        %i.fas.fa-bell
-        Change your notifications
-      %br
-      - if user.rss_token
-        = link_to(user_rss_notifications_path(token: user.rss_token.string, format: 'rss'), title: 'RSS Feed for Notifications') do
-          %i.fas.fa-rss-square
-          RSS for notifications
+      .mt-4
+        = form_tag user_save_path, id: 'beta-form' do
+          .custom-control.custom-switch
+            = hidden_field_tag 'user[in_beta]', false
+            = check_box_tag('user[in_beta]', !user.in_beta, user.in_beta, class: 'custom-control-input', id: 'beta-switch')
+            = label_tag 'Public Beta Program', nil, class: 'custom-control-label', for: 'beta-switch'
+            = hidden_field_tag('user[login]', user.login)
+            %i.fa.fa-question-circle.text-info{ data: { placement: 'top', toggle: 'popover', html: 'true',
+                                                        content: 'In our <strong>beta program</strong> you can try the latest features we ' + |
+                                                                  'develop, so you can give us feedback before we release them.' } } |
+
+      .mt-4
+        - if configuration.accounts_editable?(user)
+          - if account_edit_link.present?
+            = link_to(account_edit_link, class: 'd-block') do
+              %i.fas.fa-user-edit
+              Edit your account
+          - else
+            = link_to('#', data: { toggle: 'modal', target: '#edit-modal' }, class: 'd-block') do
+              %i.fas.fa-user-edit
+              Edit your account
+        - if configuration.passwords_changable?(user)
+          = link_to('#', data: { toggle: 'modal', target: '#password-modal' }, class: 'd-block') do
+            %i.fas.fa-key
+            Change your password
+        = link_to(user_notifications_path, class: 'd-block') do
+          %i.fas.fa-bell
+          Change your notifications
+        - if user.rss_token
+          = link_to(user_rss_notifications_path(token: user.rss_token.string, format: 'rss'),
+                                                title: 'RSS Feed for Notifications', class: 'd-block') do
+            %i.fas.fa-rss-square
+            RSS for notifications
 
+:javascript
+  switchBeta();

src/api/spec/features/webui/users/user_home_page_spec.rb

@@ -68,6 +68,7 @@
     end
 
     scenario 'public beta program' do
+      skip_if_bootstrap
       # TODO: Change by have_text('In public beta program') when dropping old UI
       expect(page).not_to have_content(/(Participates in|In) public beta program/)