Extract component to render account permissions

We were using similar code in four different places; six, if we count
the welcome pages seeds. Reducing duplication in the pages seeds is a
bit tricky because administrators are supposed to edit their content and
might remove the HTML class we use to define styles. However, we can
share the code everywhere else.

Note that there's a bug in the application since we show that level 2
users cannot vote for budget projects but we give them permission to do
so in the abilities model. We're keeping the same behavior after this
refactoring but we might change it in the future.

app/assets/stylesheets/account/permissions_list.scss

@@ -0,0 +1,23 @@
+.permissions-list {
+  list-style-type: none;
+  margin-bottom: 0;
+  margin-left: 0;
+
+  li {
+    font-size: $small-font-size;
+    margin-bottom: $line-height / 2;
+
+    span {
+      color: $text-medium;
+      font-size: rem-calc(12);
+    }
+
+    .icon-check {
+      color: $check;
+    }
+
+    .icon-x {
+      color: $delete;
+    }
+  }
+}

app/assets/stylesheets/admin.scss

@@ -525,32 +525,6 @@ code {
 // 05. Management
 // --------------
 
-.user-permissions {
-
-  ul {
-    list-style-type: none;
-    margin-left: 0;
-  }
-
-  li {
-    font-size: rem-calc(14);
-    margin-bottom: rem-calc(12);
-
-    span {
-      color: $text-medium;
-      font-size: rem-calc(12);
-    }
-
-    .icon-check {
-      color: $check;
-    }
-
-    .icon-x {
-      color: $delete;
-    }
-  }
-}
-
 .account-info,
 .login-as {
   background-color: $highlight;

app/assets/stylesheets/application.scss

@@ -41,6 +41,7 @@
 @import "stats";
 @import "sticky_overrides";
 @import "tags";
+@import "account/**/*";
 @import "admin/**/*";
 @import "budgets/**/*";
 @import "debates/**/*";

app/assets/stylesheets/layout.scss

@@ -1278,30 +1278,6 @@ form {
       font-size: rem-calc(12);
     }
   }
-
-  ul {
-    list-style-type: none;
-    margin-bottom: 0;
-    margin-left: 0;
-  }
-
-  li {
-    font-size: $small-font-size;
-    margin-bottom: $line-height / 2;
-
-    span {
-      color: $text-medium;
-      font-size: rem-calc(12);
-    }
-
-    .icon-check {
-      color: $check;
-    }
-
-    .icon-x {
-      color: $delete;
-    }
-  }
 }
 
 .notifications-list {

app/components/account/permissions_list_component.html.erb

@@ -0,0 +1,20 @@
+<ul class="permissions-list">
+  <li><span class="icon-check"></span>&nbsp;<%= t("verification.user_permission_debates") %></li>
+  <li><span class="icon-check"></span>&nbsp;<%= t("verification.user_permission_proposal") %></li>
+  <li>
+    <% if user.level_two_or_three_verified? %>
+      <span class="icon-check"></span>
+    <% else %>
+      <span class="icon-x"></span>
+    <% end %>
+    <%= t("verification.user_permission_support_proposal") %>
+  </li>
+  <li>
+    <% if user.level_three_verified? %>
+      <span class="icon-check"></span>
+    <% else %>
+      <span class="icon-x"></span>
+    <% end %>
+    <%= t("verification.user_permission_votes") %>
+  </li>
+</ul>

app/components/account/permissions_list_component.rb

@@ -0,0 +1,7 @@
+class Account::PermissionsListComponent < ApplicationComponent
+  attr_reader :user
+
+  def initialize(user)
+    @user = user
+  end
+end

app/controllers/management/users_controller.rb

@@ -1,6 +1,6 @@
 class Management::UsersController < Management::BaseController
   def new
-    @user = User.new(user_params)
+    @user = User.new(user_params.merge(verified_at: Time.current))
   end
 
   def create

app/views/account/show.html.erb

@@ -93,26 +93,7 @@
 
           <p><%= t("account.show.user_permission_info") %></p>
 
-          <ul>
+          <%= render Account::PermissionsListComponent.new(current_user) %>
-            <li><span class="icon-check"></span>&nbsp;<%= t("verification.user_permission_debates") %></li>
-            <li><span class="icon-check"></span>&nbsp;<%= t("verification.user_permission_proposal") %></li>
-            <li>
-              <% if current_user.level_two_or_three_verified? %>
-                <span class="icon-check"></span>
-              <% else %>
-                <span class="icon-x"></span>
-              <% end %>
-              <%= t("verification.user_permission_support_proposal") %>
-            </li>
-            <li>
-              <% if current_user.level_three_verified? %>
-                <span class="icon-check"></span>
-              <% else %>
-                <span class="icon-x"></span>
-              <% end %>
-              <%= t("verification.user_permission_votes") %>
-            </li>
-          </ul>
 
           <p>
             <%= t("account.show.user_permission_verify") %>

app/views/management/_user_permissions.html.erb

@@ -1,18 +1,5 @@
-<%# # Parameters:
-    #   message: A string explaining the permissions
-    #   permissions: An array of symbols containing the permissions
-    #   (can be :debates, :proposal, :support_proposal, :votes) %>
 <div class="user-permissions">
-
   <p><%= message %></p>
 
-  <ul>
+  <%= render Account::PermissionsListComponent.new(user) %>
-    <% [:debates, :proposal, :support_proposal, :votes].each do |permission| %>
-      <li>
-        <span class="<%= permissions.include?(permission) ? "icon-check" : "icon-x" %>"></span>
-        <%= t("verification.user_permission_#{permission}") %>
-      </li>
-    <% end %>
-  </ul>
-
 </div>

app/views/management/document_verifications/invalid_document.html.erb

@@ -8,7 +8,7 @@
 
 <%= render "management/user_permissions",
       message: t("management.document_verifications.not_in_census_info"),
-      permissions: [:debates, :proposal] %>
+      user: User.new %>
 
 <p>
   <%= sanitize(t("management.document_verifications.has_no_account",

app/views/management/document_verifications/new.html.erb

@@ -4,7 +4,7 @@
 
 <%= render "management/user_permissions",
       message: t("management.document_verifications.in_census_has_following_permissions"),
-      permissions: [:debates, :proposal, :support_proposal] %>
+      user: @document_verification.user %>
 
 <%= form_for @document_verification,
     as: :document_verification,

app/views/management/document_verifications/verified.html.erb

@@ -4,6 +4,6 @@
 
 <%= render "management/user_permissions",
       message: t("management.document_verifications.in_census_has_following_permissions"),
-      permissions: [:debates, :proposal, :support_proposal, :votes] %>
+      user: @document_verification.user %>
 
 <a href="javascript:window.print();" class="button warning"><%= t("management.print_info") %></a>

app/views/management/email_verifications/sent.html.erb

@@ -4,7 +4,7 @@
 
 <%= render "management/user_permissions",
       message: t("management.email_verifications.document_found_in_census"),
-      permissions: [:debates, :proposal, :support_proposal, :votes] %>
+      user: @email_verification.user %>
 
 <p>
   <a href="javascript:window.print();" class="button warning"><%= t("management.print_info") %></a>

app/views/management/users/new.html.erb

@@ -25,6 +25,6 @@
   <div class="callout">
     <%= render "management/user_permissions",
                 message: t("management.document_verifications.in_census_has_following_permissions"),
-                permissions: [:debates, :proposal, :support_proposal, :votes] %>
+                user: @user %>
   </div>
 </div>

app/views/management/users/show.html.erb

@@ -6,6 +6,6 @@
 
 <%= render "management/user_permissions",
       message: t("management.document_verifications.in_census_has_following_permissions"),
-      permissions: [:debates, :proposal, :support_proposal, :votes] %>
+      user: @user %>
 
 <a href="javascript:window.print();" class="button warning radius"><%= t("management.print_info") %></a>

app/views/verification/letter/new.html.erb

@@ -24,15 +24,9 @@
       <h1><%= t("verification.letter.new.title") %></h1>
 
       <div class="user-permissions">
-
         <p><%= t("verification.letter.new.user_permission_info") %></p>
 
-        <ul>
+        <%= render Account::PermissionsListComponent.new(current_user) %>
-          <li><span class="icon-check"></span>&nbsp;<%= t("verification.user_permission_debates") %></li>
-          <li><span class="icon-check"></span>&nbsp;<%= t("verification.user_permission_proposal") %></li>
-          <li><span class="icon-check"></span>&nbsp;<%= t("verification.user_permission_support_proposal") %></li>
-          <li><span class="icon-x"></span>&nbsp;<%= t("verification.user_permission_votes") %></li>
-        </ul>
       </div>
 
       <%= link_to t("verification.letter.new.go_to_index"), root_path, class: "button warning" %>

app/views/verification/residence/new.html.erb

@@ -24,12 +24,7 @@
     <div class="user-permissions small-12">
       <p><%= t("verification.user_permission_info") %></p>
 
-      <ul>
+      <%= render Account::PermissionsListComponent.new(User.new(level_two_verified_at: Time.current)) %>
-        <li><span class="icon-check"></span>&nbsp;<%= t("verification.user_permission_debates") %></li>
-        <li><span class="icon-check"></span>&nbsp;<%= t("verification.user_permission_proposal") %></li>
-        <li><span class="icon-check"></span>&nbsp;<%= t("verification.user_permission_support_proposal") %></li>
-        <li><span class="icon-x"></span>&nbsp;<%= t("verification.user_permission_votes") %></li>
-      </ul>
     </div>
 
     <%= form_for @residence, as: "residence", url: residence_path do |f| %>