LeadMagnet/leadchat
1
0
Fork 0
Code Issues Pull Requests Actions 3 Packages Projects Releases Wiki Activity

Feature: Rewamp super admin dashboard (#882)

Browse Source
This commit is contained in:
Sojan Jose
2020-05-24 22:44:26 +05:30
committed by GitHub
parent e49a200ee0
commit d8d14fc4a4
63 changed files with 2190 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

88
app/views/super_admin/accounts/show.html.erb Normal file
View File

@@ -0,0 +1,88 @@
<%#
# Show
This view is the template for the show page.
It renders the attributes of a resource,
as well as a link to its edit page.
## Local variables:
- `page`:
An instance of [Administrate::Page::Show][1].
Contains methods for accessing the resource to be displayed on the page,
as well as helpers for describing how each attribute of the resource
should be displayed.
[1]: http://www.rubydoc.info/gems/administrate/Administrate/Page/Show
%>
<% content_for(:title) { t("administrate.actions.show_resource", name: page.page_title) } %>
<header class="main-content__header" role="banner">
<h1 class="main-content__page-title">
<%= content_for(:title) %>
</h1>
<div>
<%= link_to(
t("administrate.actions.edit_resource", name: page.page_title),
[:edit, namespace, page.resource],
class: "button",
) if valid_action?(:edit) && show_action?(:edit, page.resource) %>
</div>
</header>
<section class="main-content__body">
<dl>
<% page.attributes.each do |attribute| %>
<dt class="attribute-label" id="<%= attribute.name %>">
<%= t(
"helpers.label.#{resource_name}.#{attribute.name}",
default: attribute.name.titleize,
) %>
</dt>
<dd class="attribute-data attribute-data--<%=attribute.html_class%>"
><%= render_field attribute, page: page %></dd>
<% end %>
</dl>
</section>
<section class="main-content__body">
<% account_user_page = Administrate::Page::Form.new(AccountUserDashboard.new, AccountUser.new) %>
<%= form_for([namespace, account_user_page.resource], html: { class: "form" }) do |f| %>
<% if account_user_page.resource.errors.any? %>
<div id="error_explanation">
<h2>
<%= t(
"administrate.form.errors",
pluralized_errors: pluralize(account_user_page.resource.errors.count, t("administrate.form.error")),
resource_name: display_resource_name(account_user_page.resource_name)
) %>
</h2>
<ul>
<% account_user_page.resource.errors.full_messages.each do |message| %>
<li class="flash-error"><%= message %></li>
<% end %>
</ul>
</div>
<% end %>
<% account_user_page.attributes.each do |attribute| -%>
<% if attribute.name == "account" %>
<%= f.hidden_field('account_id', value: page.resource.id) %>
<%= f.hidden_field('redirect_to', value: 'user') %>
<% else %>
<div class="field-unit field-unit--<%= attribute.html_class %> field-unit--<%= requireness(attribute) %>">
<%= render_field attribute, f: f %>
</div>
<% end %>
<% end -%>
<div class="form-actions">
<%= f.submit %>
</div>
<% end %>
</section>

95
app/views/super_admin/application/_collection.html.erb Normal file
View File

@@ -0,0 +1,95 @@
<%#
# Collection
This partial is used on the `index` and `show` pages
to display a collection of resources in an HTML table.
## Local variables:
- `collection_presenter`:
An instance of [Administrate::Page::Collection][1].
The table presenter uses `ResourceDashboard::COLLECTION_ATTRIBUTES` to determine
the columns displayed in the table
- `resources`:
An ActiveModel::Relation collection of resources to be displayed in the table.
By default, the number of resources is limited by pagination
or by a hard limit to prevent excessive page load times
[1]: http://www.rubydoc.info/gems/administrate/Administrate/Page/Collection
%>
<table aria-labelledby="<%= table_title %>">
<thead>
<tr>
<% collection_presenter.attribute_types.each do |attr_name, attr_type| %>
<th class="cell-label
cell-label--<%= attr_type.html_class %>
cell-label--<%= collection_presenter.ordered_html_class(attr_name) %>"
scope="col"
role="columnheader"
aria-sort="<%= sort_order(collection_presenter.ordered_html_class(attr_name)) %>">
<%= link_to(sanitized_order_params(page, collection_field_name).merge(
collection_presenter.order_params_for(attr_name, key: collection_field_name)
)) do %>
<%= t(
"helpers.label.#{collection_presenter.resource_name}.#{attr_name}",
default: attr_name.to_s,
).titleize %>
<% if collection_presenter.ordered_by?(attr_name) %>
<span class="cell-label__sort-indicator cell-label__sort-indicator--<%= collection_presenter.ordered_html_class(attr_name) %>">
<svg aria-hidden="true">
<use xlink:href="#icon-up-caret" />
</svg>
</span>
<% end %>
<% end %>
</th>
<% end %>
<% [valid_action?(:edit, collection_presenter.resource_name),
valid_action?(:destroy, collection_presenter.resource_name)].count(true).times do %>
<th scope="col"></th>
<% end %>
</tr>
</thead>
<tbody>
<% resources.each do |resource| %>
<tr class="js-table-row"
tabindex="0"
<% if valid_action? :show, collection_presenter.resource_name %>
<%= %(role=link data-url=#{polymorphic_path([namespace, resource])}) %>
<% end %>
>
<% collection_presenter.attributes_for(resource).each do |attribute| %>
<td class="cell-data cell-data--<%= attribute.html_class %>">
<% if show_action? :show, resource -%>
<a href="<%= polymorphic_path([namespace, resource]) -%>"
class="action-show"
>
<%= render_field attribute %>
</a>
<% end -%>
</td>
<% end %>
<% if valid_action? :edit, collection_presenter.resource_name %>
<td><%= link_to(
t("administrate.actions.edit"),
[:edit, namespace, resource],
class: "action-edit",
) if show_action? :edit, resource%></td>
<% end %>
<% if valid_action? :destroy, collection_presenter.resource_name %>
<td><%= link_to(
t("administrate.actions.destroy"),
[namespace, resource],
class: "text-color-red",
method: :delete,
data: { confirm: t("administrate.actions.confirm") }
) if show_action? :destroy, resource %></td>
<% end %>
</tr>
<% end %>
</tbody>
</table>

20
app/views/super_admin/application/_flashes.html.erb Normal file
View File

@@ -0,0 +1,20 @@
<%#
# Flash Partial
This partial renders flash messages on every page.
## Relevant Helpers:
- `flash`:
Returns a hash,
where the keys are the type of flash (alert, error, notice, etc)
and the values are the message to be displayed.
%>
<% if flash.any? %>
<div class="flashes">
<% flash.each do |key, value| -%>
<div class="flash flash-<%= key %>"><%= value.to_s.html_safe %></div>
<% end -%>
</div>
<% end %>

13
app/views/super_admin/application/_icons.html.erb Normal file
View File

@@ -0,0 +1,13 @@
<svg xmlns="http://www.w3.org/2000/svg" style="display: none;">
<symbol id="icon-cancel" viewBox="0 0 48 48">
<path fill-rule="evenodd" d="M24 19.757l-8.485-8.485c-.784-.783-2.047-.782-2.827 0l-1.417 1.416c-.777.777-.78 2.046.002 2.827L19.757 24l-8.485 8.485c-.783.784-.782 2.047 0 2.827l1.416 1.417c.777.777 2.046.78 2.827-.002L24 28.243l8.485 8.485c.784.783 2.047.782 2.827 0l1.417-1.416c.777-.777.78-2.046-.002-2.827L28.243 24l8.485-8.485c.783-.784.782-2.047 0-2.827l-1.416-1.417c-.777-.777-2.046-.78-2.827.002L24 19.757zM24 47c12.703 0 23-10.297 23-23S36.703 1 24 1 1 11.297 1 24s10.297 23 23 23z" />
</symbol>
<symbol id="icon-eyeglass" viewBox="0 0 48 48">
<path d="M27.885 32.515c-2.864 1.966-6.333 3.116-10.07 3.116C7.976 35.63 0 27.656 0 17.817 0 7.976 7.976 0 17.816 0S35.63 7.976 35.63 17.816c0 3.736-1.15 7.205-3.115 10.07l14.53 14.53c1.278 1.277 1.275 3.352 0 4.628-1.28 1.278-3.353 1.278-4.63 0l-14.53-14.53zm-10.07-3.736c6.056 0 10.964-4.91 10.964-10.964 0-6.055-4.91-10.964-10.964-10.964-6.055 0-10.964 4.91-10.964 10.964 0 6.055 4.91 10.963 10.964 10.963z" />
</symbol>
<symbol id="icon-up-caret" viewBox="0 0 48 48">
<path d="M2.988 33.02c-1.66 0-1.943-.81-.618-1.824l20-15.28c.878-.672 2.31-.67 3.188 0l20.075 15.288c1.316 1.003 1.048 1.816-.62 1.816H2.987z" />
</symbol>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

21
app/views/super_admin/application/_javascript.html.erb Normal file
View File

@@ -0,0 +1,21 @@
<%#
# Javascript Partial
This partial imports the necessary javascript on each page.
By default, it includes the application JS,
but each page can define additional JS sources
by providing a `content_for(:javascript)` block.
%>
<% Administrate::Engine.javascripts.each do |js_path| %>
<%= javascript_include_tag js_path %>
<% end %>
<%= yield :javascript %>
<% if Rails.env.test? %>
<%= javascript_tag do %>
$.fx.off = true;
$.ajaxSetup({ async: false });
<% end %>
<% end %>

54
app/views/super_admin/application/_navigation.html.erb
View File

@@ -10,21 +10,43 @@ as defined by the routes in the `admin/` namespace
<%= javascript_pack_tag 'superadmin_pages' %>
<%= stylesheet_pack_tag 'superadmin_pages' %>
<%
sidebar_icons = {
accounts: 'ion ion-briefcase',
users: 'ion ion-person-stalker',
super_admins: 'ion ion-unlocked',
access_tokens: 'ion-key'
}
%>
<nav class="navigation" role="navigation">
<%= link_to "Dashboard", super_admin_root_url, class: "button button--alt" %>
<% Administrate::Namespace.new(namespace).resources.each do |resource| %>
<%= link_to(
display_resource_name(resource),
[namespace, resource_index_route_key(resource)],
class: "navigation__link navigation__link--#{nav_link_state(resource)}"
) if valid_action? :index, resource %>
<% end %>
<%= link_to "Sidekiq", sidekiq_web_url , class: "button" %>
<div style="margin-top: 300px;">
<%= link_to "Logout", super_admin_logout_url , class: "button button--alt" %>
<div class="navigation" role="navigation">
<div class="logo-brand">
<%= link_to image_tag('/brand-assets/logo.svg', alt: 'Chatwoot Admin Dashboard'), super_admin_root_url %>
</div>
</nav>
<ul>
<li class="navigation__link">
<i class="ion ion-ios-keypad"></i>
<%= link_to "Dashboard", super_admin_root_url %>
</li>
<% Administrate::Namespace.new(namespace).resources.each do |resource| %>
<% next if ["account_users", "dashboard", "devise/sessions"].include? resource.resource %>
<li class="navigation__link navigation__link--<%= nav_link_state(resource) %>">
<i class="<%= sidebar_icons[resource.resource.to_sym] %>"></i>
<%= link_to(
display_resource_name(resource),
[namespace, resource_index_route_key(resource)],
) if valid_action? :index, resource %>
</li>
<% end %>
<li class="navigation__link">
<i class="ion ion ion-network"></i>
<%= link_to "Sidekiq", sidekiq_web_url %>
</li>
</ul>
<li class="navigation__link logout">
<i class="ion ion-log-out"></i>
<%= link_to "Logout", super_admin_logout_url %>
</li>
</div>

14
app/views/super_admin/application/_stylesheet.html.erb Normal file
View File

@@ -0,0 +1,14 @@
<%#
# Stylesheet Partial
This partial imports the necessary stylesheets on each page.
By default, it includes the application CSS,
but each page can define additional CSS sources
by providing a `content_for(:stylesheet)` block.
%>
<% Administrate::Engine.stylesheets.each do |css_path| %>
<%= stylesheet_link_tag css_path %>
<% end %>
<%= yield :stylesheet %>

66
app/views/super_admin/application/index.html.erb Normal file
View File

@@ -0,0 +1,66 @@
<%#
# Index
This view is the template for the index page.
It is responsible for rendering the search bar, header and pagination.
It renders the `_table` partial to display details about the resources.
## Local variables:
- `page`:
An instance of [Administrate::Page::Collection][1].
Contains helper methods to help display a table,
and knows which attributes should be displayed in the resource's table.
- `resources`:
An instance of `ActiveRecord::Relation` containing the resources
that match the user's search criteria.
By default, these resources are passed to the table partial to be displayed.
- `search_term`:
A string containing the term the user has searched for, if any.
- `show_search_bar`:
A boolean that determines if the search bar should be shown.
[1]: http://www.rubydoc.info/gems/administrate/Administrate/Page/Collection
%>
<% content_for(:title) do %>
<%= display_resource_name(page.resource_name) %>
<% end %>
<header class="main-content__header" role="banner">
<h1 class="main-content__page-title" id="page-title">
<%= content_for(:title) %>
</h1>
<% if show_search_bar %>
<%= render(
"search",
search_term: search_term,
resource_name: display_resource_name(page.resource_name)
) %>
<% end %>
<div>
<%= link_to(
t(
"administrate.actions.new_resource",
name: page.resource_name.titleize.downcase
),
[:new, namespace, page.resource_path],
class: "button",
) if valid_action?(:new) && show_action?(:new, new_resource) %>
</div>
</header>
<section class="main-content__body main-content__body--flush">
<%= render(
"collection",
collection_presenter: page,
collection_field_name: resource_name,
page: page,
resources: resources,
table_title: "page-title"
) %>
<%= paginate resources %>
</section>

69
app/views/super_admin/dashboard/index.html.erb Normal file
View File

@@ -0,0 +1,69 @@
<%#
# Index
This view is the template for the index page.
It is responsible for rendering the search bar, header and pagination.
It renders the `_table` partial to display details about the resources.
## Local variables:
- `page`:
An instance of [Administrate::Page::Collection][1].
Contains helper methods to help display a table,
and knows which attributes should be displayed in the resource's table.
- `resources`:
An instance of `ActiveRecord::Relation` containing the resources
that match the user's search criteria.
By default, these resources are passed to the table partial to be displayed.
- `search_term`:
A string containing the term the user has searched for, if any.
- `show_search_bar`:
A boolean that determines if the search bar should be shown.
[1]: http://www.rubydoc.info/gems/administrate/Administrate/Page/Collection
%>
<%= javascript_include_tag "dashboardChart" %>
<% content_for(:title) do %>
Admin Dashboard
<% end %>
<header class="main-content__header" role="banner">
<h1 class="main-content__page-title" id="page-title">
<%= content_for(:title) %>
</h1>
</header>
<section class="main-content__body main-content__body--flush">
<div class="report--list">
<div class="report-card">
<div class="metric"><%= @accounts_count %></div>
<div>Accounts</div>
</div>
<div class="report-card">
<div class="metric"><%= @users_count %></div>
<div>Users</div>
</div>
<div class="report-card">
<div class="metric"><%= @inboxes_count %></div>
<div>Inboxes</div>
</div>
<div class="report-card">
<div class="metric"><%= @conversations_count %></div>
<div>Conversations</div>
</div>
<div class="report-card">
<div class="metric"><%= @messages_count %></div>
<div>Messages</div>
</div>
</div>
<div class="chart--container" style="height:500px">
<canvas id="dashboard-chart" width="500" height="250"></canvas>
</div>
<%= javascript_tag do -%>
drawSuperAdminDashboard(<%= @data.to_json.html_safe -%>)
<% end -%>
</section>

95
app/views/super_admin/users/_collection.html.erb Normal file
View File

@@ -0,0 +1,95 @@
<%#
# Collection
This partial is used on the `index` and `show` pages
to display a collection of resources in an HTML table.
## Local variables:
- `collection_presenter`:
An instance of [Administrate::Page::Collection][1].
The table presenter uses `ResourceDashboard::COLLECTION_ATTRIBUTES` to determine
the columns displayed in the table
- `resources`:
An ActiveModel::Relation collection of resources to be displayed in the table.
By default, the number of resources is limited by pagination
or by a hard limit to prevent excessive page load times
[1]: http://www.rubydoc.info/gems/administrate/Administrate/Page/Collection
%>
<table aria-labelledby="<%= table_title %>">
<thead>
<tr>
<% collection_presenter.attribute_types.each do |attr_name, attr_type| %>
<th class="cell-label
cell-label--<%= attr_type.html_class %>
cell-label--<%= collection_presenter.ordered_html_class(attr_name) %>"
scope="col"
role="columnheader"
aria-sort="<%= sort_order(collection_presenter.ordered_html_class(attr_name)) %>">
<%= link_to(sanitized_order_params(page, collection_field_name).merge(
collection_presenter.order_params_for(attr_name, key: collection_field_name)
)) do %>
<%= t(
"helpers.label.#{collection_presenter.resource_name}.#{attr_name}",
default: attr_name.to_s,
).titleize %>
<% if collection_presenter.ordered_by?(attr_name) %>
<span class="cell-label__sort-indicator cell-label__sort-indicator--<%= collection_presenter.ordered_html_class(attr_name) %>">
<svg aria-hidden="true">
<use xlink:href="#icon-up-caret" />
</svg>
</span>
<% end %>
<% end %>
</th>
<% end %>
<% [valid_action?(:edit, collection_presenter.resource_name),
valid_action?(:destroy, collection_presenter.resource_name)].count(true).times do %>
<th scope="col"></th>
<% end %>
</tr>
</thead>
<tbody>
<% resources.each do |resource| %>
<tr class="js-table-row"
tabindex="0"
<% if valid_action? :show, collection_presenter.resource_name %>
<%= %(role=link data-url=#{polymorphic_path([namespace, resource])}) %>
<% end %>
>
<% collection_presenter.attributes_for(resource).each do |attribute| %>
<td class="cell-data cell-data--<%= attribute.html_class %>">
<% if show_action? :show, resource -%>
<a href="<%= polymorphic_path([namespace, resource]) -%>"
class="action-show"
>
<%= render_field attribute %>
</a>
<% end -%>
</td>
<% end %>
<% if valid_action? :edit, collection_presenter.resource_name %>
<td><%= link_to(
t("administrate.actions.edit"),
[:edit, namespace, resource],
class: "action-edit",
) if show_action? :edit, resource%></td>
<% end %>
<% if valid_action? :destroy, collection_presenter.resource_name %>
<td><%= link_to(
t("administrate.actions.destroy"),
[namespace, resource],
class: "text-color-red",
method: :delete,
data: { confirm: t("administrate.actions.confirm") }
) if show_action? :destroy, resource %></td>
<% end %>
</tr>
<% end %>
</tbody>
</table>

66
app/views/super_admin/users/index.html.erb Normal file
View File

@@ -0,0 +1,66 @@
<%#
# Index
This view is the template for the index page.
It is responsible for rendering the search bar, header and pagination.
It renders the `_table` partial to display details about the resources.
## Local variables:
- `page`:
An instance of [Administrate::Page::Collection][1].
Contains helper methods to help display a table,
and knows which attributes should be displayed in the resource's table.
- `resources`:
An instance of `ActiveRecord::Relation` containing the resources
that match the user's search criteria.
By default, these resources are passed to the table partial to be displayed.
- `search_term`:
A string containing the term the user has searched for, if any.
- `show_search_bar`:
A boolean that determines if the search bar should be shown.
[1]: http://www.rubydoc.info/gems/administrate/Administrate/Page/Collection
%>
<% content_for(:title) do %>
<%= display_resource_name(page.resource_name) %>
<% end %>
<header class="main-content__header" role="banner">
<h1 class="main-content__page-title" id="page-title">
<%= content_for(:title) %>
</h1>
<% if show_search_bar %>
<%= render(
"search",
search_term: search_term,
resource_name: display_resource_name(page.resource_name)
) %>
<% end %>
<div>
<%= link_to(
t(
"administrate.actions.new_resource",
name: page.resource_name.titleize.downcase
),
[:new, namespace, page.resource_path],
class: "button",
) if valid_action?(:new) && show_action?(:new, new_resource) %>
</div>
</header>
<section class="main-content__body main-content__body--flush">
<%= render(
"collection",
collection_presenter: page,
collection_field_name: resource_name,
page: page,
resources: resources,
table_title: "page-title"
) %>
<%= paginate resources %>
</section>

88
app/views/super_admin/users/show.html.erb Normal file
View File

@@ -0,0 +1,88 @@
<%#
# Show
This view is the template for the show page.
It renders the attributes of a resource,
as well as a link to its edit page.
## Local variables:
- `page`:
An instance of [Administrate::Page::Show][1].
Contains methods for accessing the resource to be displayed on the page,
as well as helpers for describing how each attribute of the resource
should be displayed.
[1]: http://www.rubydoc.info/gems/administrate/Administrate/Page/Show
%>
<% content_for(:title) { t("administrate.actions.show_resource", name: page.page_title) } %>
<header class="main-content__header" role="banner">
<h1 class="main-content__page-title">
<%= content_for(:title) %>
</h1>
<div>
<%= link_to(
t("administrate.actions.edit_resource", name: page.page_title),
[:edit, namespace, page.resource],
class: "button",
) if valid_action?(:edit) && show_action?(:edit, page.resource) %>
</div>
</header>
<section class="main-content__body">
<dl>
<% page.attributes.each do |attribute| %>
<dt class="attribute-label" id="<%= attribute.name %>">
<%= t(
"helpers.label.#{resource_name}.#{attribute.name}",
default: attribute.name.titleize,
) %>
</dt>
<dd class="attribute-data attribute-data--<%=attribute.html_class%>"
><%= render_field attribute, page: page %></dd>
<% end %>
</dl>
</section>
<section class="main-content__body">
<% account_user_page = Administrate::Page::Form.new(AccountUserDashboard.new, AccountUser.new) %>
<%= form_for([namespace, account_user_page.resource], html: { class: "form" }) do |f| %>
<% if account_user_page.resource.errors.any? %>
<div id="error_explanation">
<h2>
<%= t(
"administrate.form.errors",
pluralized_errors: pluralize(account_user_page.resource.errors.count, t("administrate.form.error")),
resource_name: display_resource_name(account_user_page.resource_name)
) %>
</h2>
<ul>
<% account_user_page.resource.errors.full_messages.each do |message| %>
<li class="flash-error"><%= message %></li>
<% end %>
</ul>
</div>
<% end %>
<% account_user_page.attributes.each do |attribute| -%>
<% if attribute.name == "user" %>
<%= f.hidden_field('user_id', value: page.resource.id) %>
<%= f.hidden_field('redirect_to', value: 'user') %>
<% else %>
<div class="field-unit field-unit--<%= attribute.html_class %> field-unit--<%= requireness(attribute) %>">
<%= render_field attribute, f: f %>
</div>
<% end %>
<% end -%>
<div class="form-actions">
<%= f.submit %>
</div>
<% end %>
</section>