Update Member Index View Layout (#16975)

* Adds Member Index View cbare-bones columns

* Adds conditional search/filter styling to _controls partial
This commit is contained in:
Julianna Tetreault 2022-03-23 06:39:46 -06:00 committed by GitHub
parent 4cdfc4cc13
commit e132279048
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 59 additions and 51 deletions

View file

@ -0,0 +1,30 @@
<div class="crayons-card p-3 s:p-4 m:p-7">
<header class="flex flex-col l:flex-row justify-content-between l:items-center ">
<h1 class="crayons-title ml-3 l:ml-0">Members</h1>
<%= render "admin/users/index/tabs" %>
</header>
<%= render "admin/users/index/controls" %>
<%= paginate @users, theme: "internal" %>
<table class="crayons-table" width="100%">
<thead>
<tr>
<th scope="col">Member</th>
<th scope="col">Status</th>
<th scope="col">Last activity & Joined on</th>
<th scope="col">Organizations</th>
</tr>
</thead>
<tbody class="crayons-card">
<% @users.each do |user| %>
<tr>
<td><%= link_to user.name, admin_user_path(user) %></td>
</tr>
<% end %>
</tbody>
</table>
<%= paginate @users, theme: "internal" %>
</div>

View file

@ -1,41 +1,5 @@
<% if FeatureFlag.enabled?(:member_index_view) %>
<div class="crayons-card p-3 s:p-4 m:p-7">
<header class="flex flex-col l:flex-row justify-content-between l:items-center ">
<h1 class="crayons-title ml-3 l:ml-0">Members</h1>
<%= render "admin/users/index/tabs" %>
</header>
<%= render "admin/users/index/controls" %>
<%= paginate @users, theme: "internal" %>
<table class="crayons-table" width="100%">
<thead>
<tr>
<th scope="col">Username</th>
<th scope="col">ID</th>
<th scope="col">Name</th>
<th scope="col">Twitter</th>
<th scope="col">GitHub</th>
<th scope="col">Email</th>
</tr>
</thead>
<tbody class="crayons-card">
<% @users.each do |user| %>
<tr>
<td><%= link_to user.username, admin_user_path(user) %></td>
<td class="whitespace-nowrap"><%= user.id %></td>
<td><%= user.name %></td>
<td><%= user_twitter_link(user) %></td>
<td><%= user_github_link(user) %></td>
<td><%= user.email %></td>
</tr>
<% end %>
</tbody>
</table>
<%= paginate @users, theme: "internal" %>
</div>
<%= render "admin/users/member_index" %>
<% else %>
<header>
<h1 class="crayons-title">People</h1>

View file

@ -1,16 +1,30 @@
<% if params[:controller] == "admin/users" %>
<%= form_with url: admin_users_path, method: :get, local: true, class: "flex flex-col m:flex-row gap-3 m:items-center p-3" do |f| %>
<div class="crayons-field flex-1 flex-row items-center gap-2">
<%= f.label :search, class: "crayons-field__label whitespace-nowrap" %>
<%= f.text_field :search, value: params[:search], class: "crayons-textfield mt-0", placeholder: "Name, username, email, or Twitter/GitHub usernames", aria: { label: "Filter by name, username, email, or Twitter/GitHub usernames" } %>
</div>
<div class="crayons-field flex-row items-center gap-2">
<%= f.label :role, "Filter by Role", class: "crayons-field__label whitespace-nowrap" %>
<%= f.select :role, options_for_select(Role::ROLES, params[:role]), { include_blank: true }, class: "crayons-select mt-0" %>
</div>
<%= f.submit "Filter", class: "c-btn c-btn--secondary" %>
<% if FeatureFlag.enabled?(:member_index_view) %>
<% if params[:controller] == "admin/users" %>
<%= form_with url: admin_users_path, method: :get, local: true, class: "flex flex-col m:flex-row gap-3 m:items-center p-3" do |f| %>
<div class="crayons-field flex-1 flex-row items-center gap-2">
<%= f.text_field :search, value: params[:search], class: "crayons-textfield mt-0", placeholder: "Search member...", aria: { label: "Search member by name, username, email, or Twitter/GitHub usernames" } %>
</div>
<div class="crayons-field flex-row items-center gap-2">
<%= f.select :role, options_for_select(Role::ROLES, params[:role]), { include_blank: true, prompt: "Filter by role..." }, class: "crayons-select mt-0" %>
</div>
<%= f.submit "Filter", class: "c-btn c-btn--secondary" %>
<% end %>
<% end %>
<% else %>
<% if params[:controller] == "admin/users" %>
<%= form_with url: admin_users_path, method: :get, local: true, class: "flex flex-col m:flex-row gap-3 m:items-center p-3" do |f| %>
<div class="crayons-field flex-1 flex-row items-center gap-2">
<%= f.label :search, class: "crayons-field__label whitespace-nowrap" %>
<%= f.text_field :search, value: params[:search], class: "crayons-textfield mt-0", placeholder: "Name, username, email, or Twitter/GitHub usernames", aria: { label: "Filter by name, username, email, or Twitter/GitHub usernames" } %>
</div>
<div class="crayons-field flex-row items-center gap-2">
<%= f.label :role, "Filter by Role", class: "crayons-field__label whitespace-nowrap" %>
<%= f.select :role, options_for_select(Role::ROLES, params[:role]), { include_blank: true }, class: "crayons-select mt-0" %>
</div>
<%= f.submit "Filter", class: "c-btn c-btn--secondary" %>
<% end %>
<% end %>
<% if params[:controller] == "admin/invitations" %>
<%= link_to "New", new_admin_invitation_path, class: "c-cta self-end" %>
<% end %>
<% end %>
<% if params[:controller] == "admin/invitations" %>
<%= link_to "New", new_admin_invitation_path, class: "c-cta self-end" %>
<% end %>