[#7] Adds Admin users index and show pages.

app/components/shared/card_component.rb

@@ -40,11 +40,12 @@ def classes
   end
 
   class ButtonComponent < ViewComponent::Base
-    def initialize(title:, path:)
+    def initialize(title:, path:, icon_class: "fa-pen")
       super()
 
       @title = title
       @path = path
+      @icon_class = icon_class
     end
 
     def render?
@@ -63,7 +64,7 @@ def button_content
 
     def edit_icon
       tag.span(class: "icon") do
-        tag.i class: "fas fa-pen"
+        tag.i class: "fas #{@icon_class}"
       end
     end
   end

app/components/users/show_component.rb

@@ -0,0 +1,48 @@
+# frozen_string_literal: true
+
+class Users::ShowComponent < ViewComponent::Base
+  attr_reader :user
+
+  def initialize(user:)
+    super()
+
+    @user = user
+  end
+
+  def card_id
+    dom_id(user)
+  end
+
+  def status_icon
+    tag.span class: status_icon_span_class do
+      tag.i title: status_title, class: status_icon_class
+    end
+  end
+
+  def status_title
+    # user.status.to_s.titleize
+    if user.verified?
+      tag.span "Verified", class: "tag is-light"
+    else
+      tag.span "Not Verified", class: "tag is-danger"
+    end
+  end
+
+  def status_icon_class
+    if user.verified?
+      "fas fa-user-check"
+    else
+      "fas fa-user-times"
+    end
+  end
+
+  def status_icon_span_class
+    return "icon is-small"
+
+    if user.verified?
+      "icon has-text-success"
+    else
+      "icon has-text-danger"
+    end
+  end
+end

app/components/users/show_component/show_component.html.erb

@@ -0,0 +1,59 @@
+<div class='columns'>
+    <div class='column'>
+        <%= render Shared::CardComponent.new(title: 'User Details') do |card| %>
+            <% card.button(title: 'Edit', path: edit_admin_user_path(user)) %>
+            <% card.button(title: 'Delete', path: admin_user_path(user.id), icon_class: 'fa-trash-alt') %>
+
+            <table class='table'>
+                <tr>
+                    <th>Status</th>
+                    <td>
+                        <%= status_icon %>
+                        <%= status_title %>
+                    </td>
+                </tr>
+
+                <tr>
+                    <th>Name:</th>
+                    <td><%= user.name %></td>
+                </tr>
+
+                <tr>
+                    <th>Email:</th>
+                    <td><%= user.email %></td>
+                </tr>
+
+                <tr>
+                    <th>Organization:</th>
+                    <td><%#= user.organization %></td>
+                </tr>
+
+                <tr>
+                    <th>Phone Number:</th>
+                    <td><%= user.phone_number %></td>
+                </tr>
+            </table>
+        <% end %>
+    </div>
+
+    <div class='column'>
+        <!-- Descriptions -->
+        <%= render Shared::CardComponent.new(title: 'Info') do |card| %>
+            <table class='table'>
+                <tr>
+                    <th>Admin:</th>
+                    <td><%= user.admin.to_s.titleize %></td>
+                </tr>
+
+                <tr>
+                    <th>Last Updated</th>
+                    <td>
+                        <time datetime="<%= user.updated_at %>">
+                            <%= user.updated_at %>
+                        </time>
+                    </td>
+                </tr>
+            </table>
+        <% end %>
+    </div>
+</div>

app/components/users/table_component.rb

@@ -0,0 +1,34 @@
+class Users::TableComponent < ViewComponent::Base
+  attr_reader :users
+
+  def initialize(users:)
+    super()
+
+    @users = users
+  end
+
+  class UserRowComponent < ViewComponent::Base
+    attr_reader :user, :table_component
+
+    def initialize(user, table_component:)
+      super()
+
+      @user = user
+      @table_component = table_component
+    end
+
+    def more_menu_component
+      @more_menu_component ||= MoreMenuComponent.new(user: user)
+    end
+  end
+
+  class MoreMenuComponent < ViewComponent::Base
+    attr_reader :user
+
+    def initialize(user: nil)
+      super()
+
+      @user = user
+    end
+  end
+end

app/components/users/table_component/more_menu_component.html.erb

@@ -0,0 +1,19 @@
+<div class="dropdown is-hoverable is-right">
+    <div class="dropdown-trigger">
+        <button class="button no-border transparent" aria-haspopup="true" aria-controls="dropdown-menu4">
+            <span class="icon is-small">
+                <i class="fas fa-ellipsis-v"></i>
+            </span>
+        </button>
+    </div>
+    <div class="dropdown-menu" role="menu">
+        <div class="dropdown-content position-relative stretched-link">
+            <div class="dropdown-item">
+                <span class="icon is-small">
+                    <i class="fas fa-info-circle"></i>
+                </span>
+                <%#= distribution.show_link %>
+            </div>
+        </div>
+    </div>
+</div>

app/components/users/table_component/table_component.html.erb

@@ -0,0 +1,18 @@
+<table class='table is-hoverable is-fullwidth'>
+    <thead>
+        <tr>
+            <th class="is-size-7">Status</th>
+            <th class="is-size-7">Name</th>
+            <th class="is-size-7">Email</th>
+            <th class="is-size-7">Organization</th>
+            <th class="is-size-7">Updated At</th>
+            <th class="is-size-7">MORE</th>
+        </tr>
+    </thead>
+
+    <tbody>
+        <% users.each do |user| %>
+            <%= render UserRowComponent.new(user, table_component: self) %>
+        <% end %>
+    </tbody>
+</table>

app/components/users/table_component/user_row_component.html.erb

@@ -0,0 +1,28 @@
+<tr>
+    <td>
+        <%#= render status_component %>
+        <% if user.verified? %>
+            Verified
+        <% else %>
+            Not Verified
+        <% end %>
+    </td>
+    <td>
+        <%= link_to user.name, admin_user_path(id: user.id) %>
+    </td>
+    <td>
+        <%= user.email %>
+    </td>
+    <td>
+        <%#= user.organization %>
+    </td>
+
+    <td>
+        <%= user.updated_at %>
+    </td>
+
+    <!-- MORE -->
+    <td>
+      <%= render more_menu_component %>
+    </td>
+</tr>

app/controllers/admin/users_controller.rb

@@ -0,0 +1,32 @@
+# frozen_string_literal: true
+
+class Admin::UsersController < Admin::BaseController
+  before_action :load_users, only: %i[index]
+  before_action :load_user, only: %i[show edit update destroy]
+
+  def index; end
+
+  def show; end
+
+  def edit; end
+
+  def update; end
+
+  def destroy; end
+
+  private
+
+  def load_users
+    users = User.all
+
+    @pagy, @users = pagy(users)
+  end
+
+  def load_user
+    @user = User.find(params[:id])
+  end
+
+  def user_params
+    params.require(:user).permit()
+  end
+end

app/views/admin/users/index.html.erb

@@ -0,0 +1,8 @@
+<div class="container">
+    <%= render Users::TableComponent.new(users: @users) %>
+</div>
+
+<hr/>
+<div class="container">
+    <%== pagy_bulma_combo_nav_js(@pagy) %>
+</div>

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

@@ -0,0 +1,4 @@
+<div class="container">
+    <%= render Users::ShowComponent.new(user: @user) %>
+</div>
+