smriti 0.5.0

data/app/views/smriti/admin/mat_view_definitions/index.html.erb

@@ -0,0 +1,10 @@
+<div class="mv-toolbar start">
+  <%= mv_drawer_link(new_admin_mat_view_definition_path(frame_id: 'mv-drawer'), t("smriti.mat_view_definition.new_definition"),
+                     variant: :primary,
+                     testid: 'NEW_DEFINITION_LINK',
+                     tooltip: t("smriti.mat_view_definition.new_definition_tooltip")) do %>
+    <%= mv_icon(:plus_circle) %>
+    <%= t("smriti.mat_view_definition.new_definition") %>
+  <% end %>
+</div>
+<%= render "smriti/admin/ui/datatable", dt_config: @dt_config, row_values: @data %>

data/app/views/smriti/admin/mat_view_definitions/show.html.erb

@@ -0,0 +1,40 @@
+<% humanize_attr = ->(attr) { Smriti::MatViewDefinition.human_attribute_name(attr) } %>
+<% humanize_enum_attr = ->(col, val) { Smriti::MatViewDefinition.human_enum_name(col, val) } %>
+
+<input type="hidden" id="mv-drawer-title-text" value="<%= t("smriti.view_var", name: @definition.name) %>"/>
+<input type="hidden" id="mv-drawer-open-url-identifier" value="definitions_view_<%= @definition.id %>"/>
+<%= render "smriti/admin/ui/card" do %>
+  <div class="mv-field">
+    <div class="mv-label"><%= humanize_attr.call(:refresh_strategy) %></div>
+    <div><%= humanize_enum_attr.call(:refresh_strategy, @definition.refresh_strategy) %></div>
+  </div>
+  <div class="mv-field">
+    <div class="mv-label"><%= humanize_attr.call(:schedule_cron) %></div>
+    <div><%= @definition.schedule_cron.presence || "-" %></div>
+  </div>
+  <div class="mv-field">
+    <div class="mv-label"><%= humanize_attr.call(:unique_index_columns) %></div>
+    <div><%= Array(@definition.unique_index_columns).join(", ").presence || "-" %></div>
+  </div>
+  <div class="mv-field">
+    <div class="mv-label"><%= humanize_attr.call(:dependencies) %></div>
+    <div><%= Array(@definition.dependencies).join(", ").presence || "-" %></div>
+  </div>
+  <div class="mv-field">
+    <div class="mv-label"><%= humanize_attr.call(:last_run_at) %></div>
+    <div><%= @definition.last_run ? l_with_digits(@definition.last_run.started_at.in_time_zone, format: :datetime12hour) : "-" %></div>
+  </div>
+  <div class="mv-field">
+    <%= render "smriti/admin/ui/details",
+               tooltip_text: t("smriti.mat_view_definition.sql_summary_tooltip"),
+               title: content_tag(:div, humanize_attr.call(:sql), class: "mv-label") do %>
+      <pre><%= @definition.sql -%></pre>
+    <% end %>
+  </div>
+
+  <% content_for :footer do %>
+    <div class="mv-header-row even">
+      <%= render "definition_actions", defn: @definition, mv_exists: @mv_exists, frame_id: "mv-drawer" %>
+    </div>
+  <% end %>
+<% end %>

data/app/views/smriti/admin/mat_view_runs/_dt-index-empty-row.html.erb

@@ -0,0 +1,11 @@
+<tr class="mv-tr">
+  <td class="mv-td" colspan="<%= dt_config[:columns].size %>">
+    <div class="mv-cell">
+      <% if params[:dtfilter] || params[:dtsearch] %>
+        <%= t("smriti.mat_view_run.no_runs_if_filtered") %>
+      <% else %>
+        <%= t("smriti.mat_view_run.no_runs") %>
+      <% end %>
+    </div>
+  </td>
+</tr>

data/app/views/smriti/admin/mat_view_runs/_dt-index-row.html.erb

@@ -0,0 +1,41 @@
+<% dt_humanize_ref = dt_config[:dt_humanize_ref]
+dt_humanize_ref_klass = dt_humanize_ref.constantize
+humanize_attr = ->(attr) { dt_humanize_ref_klass.human_attribute_name(attr) }
+humanize_enum_attr = ->(col, val) { dt_humanize_ref_klass.human_enum_name(col, val) }
+mv_exists_map ||= {} %>
+
+<tr class="mv-tr" data-testid="RUN_ROW_<%= row_value.id %>">
+  <td class="mv-td"><div class="mv-cell"><%= humanize_enum_attr.call(:operation, row_value.operation) %></div></td>
+  <td class="mv-td">
+    <div class="mv-cell">
+      <%= mv_drawer_link(admin_mat_view_definition_path(row_value.mat_view_definition, frame_id: "mv-drawer"), t("smriti.view_var", name: row_value.mat_view_definition.name),
+                             variant: :ghost,
+                             underline: true,
+                             testid: 'VIEW_LINK',
+                             testid_identifier: "defn-#{row_value.mat_view_definition.id}",
+                             tooltip: t("smriti.mat_view_definition.view_tooltip")) do %>
+        <%= row_value.mat_view_definition.name %>
+      <% end %>
+    </div>
+  </td>
+  <td class="mv-td"><div class="mv-cell"><%= l_with_digits(row_value.started_at.in_time_zone, format: :datetime12hour) %></div></td>
+  <td class="mv-td">
+    <div class="mv-cell">
+      <%= mv_badge(row_value.status, humanize_enum_attr.call(:status, row_value.status)) %>
+    </div>
+  </td>
+  <td class="mv-td"><div class="mv-cell"><%= row_value.duration_ms ? localized_digits(t("smriti.x_miliseconds", count: row_value.duration_ms)) : "-" %></div></td>
+  <td class="mv-td"><div class="mv-cell"><%= localized_digits(row_value.row_count_before || "-") %>/<%= localized_digits(row_value.row_count_after || "-") %></div></td>
+  <td class="mv-td">
+    <div class="mv-cell">
+      <%= mv_drawer_link(admin_mat_view_run_path(id: row_value.id, frame_id: 'mv-drawer'), t('smriti.mat_view_run.view_details'),
+                             variant: :ghost,
+                             underline: true,
+                             testid: 'VIEW_LINK',
+                             testid_identifier: "run-#{row_value.id}",
+                             tooltip: t("smriti.mat_view_run.view_tooltip")) do %>
+        <%= t("smriti.mat_view_run.view_details") %>
+      <% end %>
+    </div>
+  </td>
+</tr>

data/app/views/smriti/admin/mat_view_runs/index.html.erb

@@ -0,0 +1 @@
+<%= render "smriti/admin/ui/datatable", dt_config: @dt_config, row_values: @data %>

data/app/views/smriti/admin/mat_view_runs/show.html.erb

@@ -0,0 +1,64 @@
+<% humanize_attr = ->(attr) { Smriti::MatViewRun.human_attribute_name(attr) } %>
+<% humanize_enum_attr = ->(col, val) { Smriti::MatViewRun.human_enum_name(col, val) } %>
+<input type="hidden" id="mv-drawer-open-url-identifier" value="runs_view_<%= @run.id %>"/>
+<div class="mv-card">
+  <div class="mv-card-b">
+    <div class="mv-field">
+      <div class="mv-label"><%= t("smriti.definition") %></div>
+      <div>
+        <%= mv_drawer_link(admin_mat_view_definition_path(@run.mat_view_definition, frame_id: "mv-drawer"), t("smriti.view_var", name: @run.mat_view_definition.name),
+                           variant: :ghost,
+                           underline: true,
+                           tooltip: t("smriti.mat_view_definition.view_tooltip")) do %>
+          <%= @run.mat_view_definition.name %>
+        <% end %>
+      </div>
+    </div>
+    <div class="mv-field">
+      <div class="mv-label"><%= humanize_attr.call(:operation) %></div>
+      <div><%= humanize_enum_attr.call(:operation, @run.operation) %></div>
+    </div>
+    <div class="mv-field">
+      <div class="mv-label"><%= humanize_attr.call(:started_at) %></div>
+      <div><%= l_with_digits(@run.started_at.in_time_zone, format: :datetime12hour) %></div>
+    </div>
+    <div class="mv-field">
+      <div class="mv-label"><%= humanize_attr.call(:finished_at) %></div>
+      <div><%= l_with_digits(@run.finished_at&.in_time_zone, format: :datetime12hour) || "-" %></div>
+    </div>
+    <div class="mv-field">
+      <div class="mv-label"><%= humanize_attr.call(:status) %></div>
+      <div><%= mv_badge(@run.status, humanize_enum_attr.call(:status, @run.status)) %></div>
+    </div>
+    <div class="mv-field">
+      <div class="mv-label"><%= humanize_attr.call(:duration_ms) %></div>
+      <div><%= @run.duration_ms ? localized_digits(t("smriti.x_miliseconds", count: @run.duration_ms)) : "-" %></div>
+    </div>
+    <div class="mv-field">
+      <div class="mv-label"><%= humanize_attr.call(:row_count_before) %></div>
+      <div><%= localized_digits(@run.row_count_before || "-") %></div>
+    </div>
+    <div class="mv-field">
+      <div class="mv-label"><%= humanize_attr.call(:row_count_after) %></div>
+      <div><%= localized_digits(@run.row_count_after || "-") %></div>
+    </div>
+
+    <div class="mv-field">
+      <%= render "smriti/admin/ui/details",
+                 tooltip_text: t("smriti.mat_view_run.meta_tooltip"),
+                 title: content_tag(:div, humanize_attr.call(:meta), class: "mv-label") do %>
+        <pre><%= JSON.pretty_generate(@run.meta || {}).strip -%></pre>
+      <% end %>
+    </div>
+
+    <% if @run.try(:error).present? %>
+      <div class="mv-field">
+        <%= render "smriti/admin/ui/details",
+                   tooltip_text: t("smriti.mat_view_run.error_tooltip"),
+                   title: content_tag(:div, humanize_attr.call(:error), class: "mv-label") do %>
+          <pre><%= JSON.pretty_generate(@run.error || {}).strip -%></pre>
+        <% end %>
+      </div>
+    <% end %>
+  </div>
+</div>

data/app/views/smriti/admin/preferences/show.html.erb

@@ -0,0 +1,49 @@
+<input type="hidden" id="mv-drawer-open-url-identifier" value="preferences_edit" %>
+<div class="mv-card">
+  <div class="mv-card-b">
+    <%= form_with url: admin_preferences_path(frame_id: 'mv-drawer'), method: :put, data: { turbo_frame: :"mv-drawer" } do %>
+      <!-- Theme -->
+      <div class="mv-field">
+        <div class="mv-label"><%= t("smriti.settings.theme") %></div>
+        <p class="mv-label mv-label--sublabel">
+          <%= t("smriti.settings.theme_hint") %>
+        </p>
+        <div class="mv-actions" style="justify-content:flex-start">
+          <% [["auto", t("smriti.settings.auto")], ["light", t("smriti.settings.light")], ["dark", t("smriti.settings.dark")]].each do |value, label| %>
+            <label for="lang-<%= label %>" class="mv-btn mv-btn--secondary mv-btn--sm" style="gap:.4rem;">
+              <input id="lang-<%= label %>" type="radio" name="theme" value="<%= value %>" <%= "checked" if @theme == value %> style="margin:0"/>
+              <span><%= label %></span>
+            </label>
+          <% end %>
+        </div>
+      </div>
+      <br/>
+      <!-- Language -->
+      <div class="mv-field">
+        <label for="locale" class="mv-label"><%= t("smriti.settings.language") %></label>
+        <p class="mv-label mv-label--sublabel">
+          <%= t("smriti.settings.language_hint") %>
+        </p>
+        <select name="locale" id="locale" class="mv-select">
+          <% @locales.each do |loc| %>
+            <% label = Smriti::Engine.locale_code_mapping[loc.to_sym] %>
+            <option value="<%= loc %>" <%= "selected" if @locale == loc %>>
+              <%= label %>
+            </option>
+          <% end %>
+        </select>
+      </div>
+      <div class="mv-actions">
+        <%= mv_submit_button class: "mv-btn mv-btn--primary mv-btn--md",
+                             testid: 'PREFERENCES_SAVE_BUTTON' do %>
+          <%= t("smriti.save_changes") %>
+        <% end %>
+
+        <%= mv_cancel_button variant: :ghost, data: { action: "click->drawer#close" },
+                             testid: 'PREFERENCES_CANCEL_BUTTON' do %>
+          <%= t("smriti.cancel") %>
+        <% end %>
+      </div>
+    <% end %>
+  </div>
+</div>

data/app/views/smriti/admin/ui/_card.html.erb

@@ -0,0 +1,15 @@
+<% body = capture { yield } %>
+<div class="mv-card">
+  <% if content_for?(:title) %>
+    <div class="mv-card-h">
+      <%= yield :title %>
+    </div>
+  <% end %>
+
+  <div class="mv-card-b"><%= body %></div>
+  <% if content_for?(:footer) %>
+    <div class="mv-card-f">
+      <%= yield :footer %>
+    </div>
+  <% end %>
+</div>

data/app/views/smriti/admin/ui/_datatable.html.erb

@@ -0,0 +1,34 @@
+<% dt_config = @dt_config
+dt_humanize_ref = dt_config[:dt_humanize_ref]
+dt_cols = dt_config[:columns]
+dt_humanize_ref_klass = dt_humanize_ref.constantize
+humanize_attr = ->(attr) { dt_humanize_ref_klass.human_attribute_name(attr) }
+humanize_enum_attr = ->(col, val) { dt_humanize_ref_klass.human_enum_name(col, val) } %>
+
+<div
+  data-controller="datatable"
+  data-datatable-index-url-value="<%= dt_config[:index_url] %>"
+  data-datatable-perpage-default="<%= dt_config[:pagination][:per_page_default]%>"
+>
+  <table class="mv-table with-filters" id="<%= dt_config[:id] %>">
+    <%= render "smriti/admin/ui/datatable_thead" %>
+    <tbody id="datatable-body-<%= dt_config[:id] %>">
+      <tr class="mv-tr">
+        <td class="mv-td" colspan="<%= dt_cols.size %>">
+          <div class="mv-cell">
+            <%= t("smriti.loading") %>
+          </div>
+        </td>
+      </tr>
+    </tbody>
+    <tfoot>
+      <tr id="datatable-tfoot-<%= dt_config[:id] %>" class="mv-tr">
+        <td class="mv-td" colspan="<%= dt_cols.size %>">
+          <div class="dt-pagination-section" data-datatable-target="pagination" data-testid="DT_PAGINATION" data-testid-identifier="<%= dt_config[:id] %>-pagination">
+            <%= t("smriti.loading") %>
+          </div>
+        </td>
+      </tr>
+    </tfoot>
+  </table>
+</div>

data/app/views/smriti/admin/ui/_datatable_filters.html.erb

@@ -0,0 +1,45 @@
+<% dt_config = @dt_config
+   dt_humanize_ref = dt_config[:dt_humanize_ref]
+   dt_cols = dt_config[:columns]
+   dtfilter_map = params[:dtfilter].present? ? params[:dtfilter].split(",").map { |f| f.split(":") }.to_h : {}
+   dt_humanize_ref_klass = dt_humanize_ref.constantize
+   humanize_attr = ->(attr) { dt_humanize_ref_klass.human_attribute_name(attr) } %>
+<div class="mv-input-group" id="datatable-filters-<%= dt_config[:id] %>">
+  <div class="mv-field-inline">
+    <%= t("smriti.filter_by") %>
+  </div>
+  <% dt_cols.keys.each do |key| %>
+    <% next unless dt_cols[key][:filter].present? %>
+
+    <% value = dt_cols[key]
+       th_label =
+         if value[:label_type] == "i18n"
+           t("smriti.#{value[:label_ref]}")
+         elsif value[:label_type] == "humanize_attr"
+           humanize_attr.call(value[:label_ref])
+         else
+           value[:label_ref]
+         end %>
+
+    <% selected_value = dtfilter_map[key.to_s] || "no_filter"
+       options =
+         [[t("smriti.no_filter"), "no_filter"]] +
+         dt_humanize_ref_klass.send("filter_options_for_#{key.to_s}").map { |v| v[1].present? ? v : [t("smriti.no_value"), "no_value"] } %>
+    <div class="mv-field-inline">
+      <%= label_tag key, th_label, class: "mv-label" %>
+      <%= select_tag key,
+                     options_for_select(options, selected_value),
+                     class: "mv-select",
+                     autocomplete: "off",
+                     spellcheck: "false",
+                     autocapitalize: "none",
+                     autocorrect: "off",
+                     data: {
+                       action: "change->datatable#onFilterChange",
+                       datatable_target: "filterField",
+                       testid: "#{dt_config[:id]}-#{Smriti::Helpers::UiTestIds::DT_FILTER_SELECT}-#{key}",
+                       key: key,
+                     } %>
+    </div>
+  <% end %>
+</div>

data/app/views/smriti/admin/ui/_datatable_tbody.html.erb

@@ -0,0 +1,11 @@
+<% dt_config = @dt_config
+row_values = Array(@data) %>
+<tbody id="datatable-body-<%= dt_config[:id] %>">
+  <% if row_values.size.positive? %>
+    <% row_values.each do |row| %>
+      <%= render dt_config[:row_partial_name], dt_config: dt_config, row_value: row, **row_meta %>
+    <% end %>
+  <% else %>
+    <%= render dt_config[:empty_row_partial_name], dt_config: dt_config, **row_meta %>
+  <% end %>
+</tbody>

data/app/views/smriti/admin/ui/_datatable_tfoot.html.erb

@@ -0,0 +1,70 @@
+<% dt_config = @dt_config %>
+<% dt_cols = dt_config[:columns] %>
+<tr id="datatable-tfoot-<%= dt_config[:id] %>" class="mv-tr">
+  <td class="mv-td" colspan="<%= dt_cols.size %>">
+    <div class="dt-pagination-section">
+      <%= label_tag :per_page, t("smriti.per_page"), class: "mv-label mr-2" %>
+      <%= select_tag :per_page,
+      options_for_select(dt_config[:pagination][:per_page_options].map { |opt| [opt, opt] }, @dt_per_page),
+      data: {
+        action: "change->datatable#changePerPage",
+        "datatable-target": "perPageSelect",
+        testid: "dt_pagination_btn-#{dt_config[:id]}-per-page",
+      },
+      class: "mv-input mv-input-sm",
+      aria: {
+        label: t("smriti.per_page"),
+      } %>
+
+      <%= mv_button data: { action: "click->datatable#goToPage", page: 1,
+                            'datatable-target': 'pageBtn' },  
+                    testid: "DT_PAGINATION_BTN",
+                    testid_identifier: "#{dt_config[:id]}-page-first",
+                    disabled: @dt_page == 1 do %>
+        <%= mv_icon(:double_arrow_left) %>
+      <% end %>
+      <%= mv_button variant: :ghost,
+                    data: { action: "click->datatable#goToPage",
+                            page: @dt_page - 1,
+                            'datatable-target': 'pageBtn' },
+                    testid: "DT_PAGINATION_BTN",
+                    testid_identifier: "#{dt_config[:id]}-page-previous",
+                    disabled: @dt_page == 1 do %>
+        <%= mv_icon(:arrow_left) %>
+      <% end %>
+      <% pages = pagination_window(current_page: @dt_page, total_pages: @dt_total_pages) %>
+      <% pages.each_with_index do |page, index| %>
+        <% if page == :gap %>
+          <span class="mv-text-muted" data-testid="dt_pagination_btn_gap_<%= index %>">...</span>
+        <% else %>
+          <%= mv_button variant: (page == @dt_page ? :primary : :ghost),
+                        data: { action: "click->datatable#goToPage",
+                                page: page,
+                                'datatable-target': 'pageBtn' },
+                    testid: "DT_PAGINATION_BTN",
+                    testid_identifier: "#{dt_config[:id]}-page-#{page}" do %>
+            <%= localized_digits(page) %>
+          <% end %>
+        <% end %>
+      <% end %>
+      <%= mv_button variant: :ghost,
+                    data: { action: "click->datatable#goToPage",
+                            page: @dt_page + 1,
+                            'datatable-target': 'pageBtn' },
+                    testid: "DT_PAGINATION_BTN",
+                    testid_identifier: "#{dt_config[:id]}-page-next",
+                    disabled: @dt_page == pages.last do %>
+        <%= mv_icon(:arrow_right) %>
+      <% end %>
+      <%= mv_button data: { action: "click->datatable#goToPage",
+                            page: pages.last,
+                            'datatable-target': 'pageBtn' },
+
+                    testid: "DT_PAGINATION_BTN",
+                    testid_identifier: "#{dt_config[:id]}-page-last",
+                    disabled: @dt_page == pages.last do %>
+        <%= mv_icon(:double_arrow_right) %>
+      <% end %>
+    </div>
+  </td>
+</tr>

data/app/views/smriti/admin/ui/_datatable_thead.html.erb

@@ -0,0 +1,105 @@
+<% dt_config = @dt_config
+dt_humanize_ref = dt_config[:dt_humanize_ref]
+dt_cols = dt_config[:columns]
+dt_humanize_ref_klass = dt_humanize_ref.constantize
+search_enabled = dt_config[:search_enabled]
+filter_enabled = dt_config[:filter_enabled]
+humanize_attr = ->(attr) { dt_humanize_ref_klass.human_attribute_name(attr) }
+humanize_enum_attr = ->(col, val) { dt_humanize_ref_klass.human_enum_name(col, val) } %>
+<colgroup>
+  <% dt_cols.keys.each do |key| %>
+    <col class="col-<%= key.to_s.dasherize %>">
+  <% end %>
+</colgroup>
+<thead>
+  <% if search_enabled %>
+    <tr class="mv-tr">
+      <th class="mv-th" colspan="<%= dt_cols.size %>">
+        <div class="dt-filter-section">
+          <div class="mv-input-group">
+            <input
+              id="<%= dt_config[:id] %>-search-input"
+              name="dtsearch"
+              type="text"
+              class="mv-input mv-input--full-width"
+              placeholder="<%= t('smriti.datatable.search_placeholder') %>"
+              data-datatable-target="searchInput"
+              data-action="input->datatable#onSearchInput"
+              value="<%= params[:dtsearch].presence || '' %>"
+              autocomplete="off"
+              spellcheck="false"
+              autocapitalize="none"
+              autocorrect="off"
+              aria-label="<%= t('smriti.datatable.search_aria_label') %>"
+              data-testid='<%= "#{Smriti::Helpers::UiTestIds::DT_SEARCH_INPUT}-#{dt_config[:id]}-search" %>'
+            />
+            <%= mv_button variant: :tertiary, class: 'btn-clear mv-btn--no-padding', padding: false, data: { action: "click->datatable#clearSearchInput" },
+                     aria: { label: t('smriti.datatable.clear_search_aria_label') },
+                     testid: 'DT_CLEAR_SEARCH_BTN',
+                     testid_identifier: "#{dt_config[:id]}-clear-search" do %>
+              <%= mv_icon(:x_circle) %>
+            <% end %>
+          </div>
+        </div>
+      </th>
+    </tr>
+
+  <% end %>
+  <% if filter_enabled %>
+    <tr class="mv-tr">
+      <th class="mv-th" colspan="<%= dt_cols.size %>">
+        <div class="dt-filter-section">
+          <div class="mv-input-group" id="datatable-filters-<%= dt_config[:id] %>">
+            <%= t("smriti.loading") %>
+          </div>
+        </div>
+      </th>
+    </tr>
+  <% end %>
+  <tr class="mv-tr">
+    <% dt_cols.keys.each do |key|
+      value = dt_cols[key] 
+      sort = value[:sort]
+      sort_enabled = sort.present?
+      th_label = if value[:label_type] == 'i18n'
+                  t("smriti.#{value[:label_ref]}")
+                 elsif value[:label_type] == 'humanize_attr'
+                   humanize_attr.call(value[:label_ref])
+                 else
+                   value[:label_ref]
+                 end
+      data = {}
+      if sort_enabled
+        data = {
+          'datatable-target': 'th',
+          key: key,
+          testid: 'TOGGLE_SORT_BUTTON',
+          testid_identifier: "#{dt_config[:id]}-#{key}",
+        }
+      end %>
+      <th class="mv-th" id="<%= dt_config[:id] %>-<%= key %>" <%= data.map { |k, v| "data-#{k.to_s.dasherize}=\"#{v}\"" }.join(' ').html_safe %>>
+        <div class="mv-cell" <%= value[:th_style].nil? ? '' : "style=\"#{value[:th_style]}\"".html_safe %>>
+          <% if sort_enabled %>
+            <span>
+              <%= th_label %>
+            </span>
+            <%= mv_button variant: :ghost, data: { action: "click->datatable#toggleSort" },
+                             class: 'mv-btn--no-padding has-annotation', 
+                             padding: false,
+                             testid: 'TOGGLE_SORT_BUTTON',
+                             testid_identifier: "#{dt_config[:id]}-#{key}" do %>
+              <%= mv_icon(:sort_neutral, size: 24, class_name: "muted sort-neutral") %>
+              <%= mv_icon(:sort_asc, size: 24, class_name: "active hidden sort-asc") %>
+              <%= mv_icon(:sort_desc, size: 24, class_name: "active hidden sort-desc") %>
+              <span class="mv-annotation hidden"></span>
+            <% end %>
+          <% else %>
+            <span>
+              <%= th_label %>
+            </span>
+          <% end %>
+        </div>
+      </th>
+    <% end %>
+  </tr>
+</thead>

data/app/views/smriti/admin/ui/_details.html.erb

@@ -0,0 +1,10 @@
+<% body = capture { yield } %>
+<details data-controller="details" data-details-duration-value="200" class="mv-details"
+         open>
+  <summary data-action="click->details#toggle" data-controller="tooltip" data-tooltip-text-value="<%= tooltip_text %>">
+    <%= mv_icon(:arrow_right, class_name: "mv-chevron") %>
+    <%= title %>
+  </summary>
+
+  <div data-details-target="content" class="mv-details__content"><%= body -%></div>
+</details>

data/app/views/smriti/admin/ui/_flash.html.erb

@@ -0,0 +1,6 @@
+<% if notice %>
+  <div class="mv-flash mv-flash--ok" data-controller="flash"><%= notice %></div>
+<% end %>
+<% if alert %>
+  <div class="mv-flash mv-flash--err" data-controller="flash"><%= alert %></div>
+<% end %>

data/app/views/smriti/admin/ui/_table.html.erb

@@ -0,0 +1,8 @@
+<table class="mv-table">
+  <% if local_assigns[:head].present? %>
+    <thead>
+    <tr class="mv-tr"><%= head %></tr>
+    </thead>
+  <% end %>
+  <tbody><%= yield %></tbody>
+</table>

data/config/importmap.rb

@@ -0,0 +1,9 @@
+# frozen_string_literal: true
+
+enable_integrity!
+pin 'smriti/application'
+pin '@hotwired/turbo-rails',                  to: 'turbo.min.js'
+pin '@hotwired/stimulus',                     to: 'stimulus.min.js'
+pin '@hotwired/stimulus-loading',             to: 'stimulus-loading.js'
+
+pin_all_from Smriti::Engine.root.join('app/javascript/smriti/controllers'), under: 'smriti/controllers'