mensa 0.3.2 → 0.3.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 56a69b51d2f62c342f16b42fc0c0d77fc69101e493486eafea8c89cc358bfd9a
-  data.tar.gz: 072b02f3d2ebff3ebcd310643b7be1ccb199024771bdb346fd92be4faa9b6ab0
+  metadata.gz: 4370665a3982e3464306fd155b455aef8c62d2fda14c474771042a30af3038cb
+  data.tar.gz: 91c50234915ffeb886a6569575d33fa7b85eb453f1da8991e075ad46fe5101ac
 SHA512:
-  metadata.gz: 4a32e5e1ed6b6a195d8ad4913d6497082e7ac72721bd18410b3135ad502eeef74ae7cf0e91bee2dcc0fae41f3be85018e181bad3f16382d5d2b6bf8698fda70a
-  data.tar.gz: a6e26eeecd788492da78499a985fc107697bc7916d6562708aa32b3c58a1c681ed2478ee91070db5df5372628d5f1c77d27a0b482a1f9076187b8e4e66e5431d
+  metadata.gz: 3cbde51c093adcccaad8b2814b6c436a8be160e6fa68bab0cc2463c22560d325017f736577add7ffb2b3e4974e2df1abce81ca3a89e83ea3bb9e77d42d65800a
+  data.tar.gz: 9691484b7695d915849eebbc204f8ca22c560d38928c5e0d78285b4eb1f7b140f29aad0498d455549e359f97590e9659f5e1d2a049b4b3a17ffc2c10bc9c5397

data/Gemfile

@@ -10,7 +10,7 @@ gem "sprockets-rails"
 gem "pry"
 gem "capybara", "~> 3.40"
 gem "selenium-webdriver", "~> 4.17"
-gem "slim", "~> 5.2"
+
 gem "debug"
 gem "overmind", require: false
 gem "rack-mini-profiler"

data/Gemfile.lock

@@ -1,14 +1,13 @@
 PATH
   remote: .
   specs:
-    mensa (0.3.1)
+    mensa (0.3.2)
       csv
       importmap-rails
       pagy (>= 43)
       pg (>= 1.6)
       rails (>= 7.1)
       rubyzip (>= 1.2.2)
-      slim
       stimulus-rails
       tailwindcss-rails (~> 3.3)
       textacular (>= 5)
@@ -307,9 +306,6 @@ GEM
       rexml (~> 3.2, >= 3.2.5)
       rubyzip (>= 1.2.2, < 4.0)
       websocket (~> 1.0)
-    slim (5.2.1)
-      temple (~> 0.10.0)
-      tilt (>= 2.1.0)
     sprockets (4.2.2)
       concurrent-ruby (~> 1.0)
       logger
@@ -318,14 +314,6 @@ GEM
       actionpack (>= 6.1)
       activesupport (>= 6.1)
       sprockets (>= 3.0.0)
-    sqlite3 (2.9.4-aarch64-linux-gnu)
-    sqlite3 (2.9.4-aarch64-linux-musl)
-    sqlite3 (2.9.4-arm-linux-gnu)
-    sqlite3 (2.9.4-arm-linux-musl)
-    sqlite3 (2.9.4-arm64-darwin)
-    sqlite3 (2.9.4-x86_64-darwin)
-    sqlite3 (2.9.4-x86_64-linux-gnu)
-    sqlite3 (2.9.4-x86_64-linux-musl)
     standard (1.54.0)
       language_server-protocol (~> 3.17.0.2)
       lint_roller (~> 1.0)
@@ -349,11 +337,9 @@ GEM
     tailwindcss-ruby (3.4.19-arm64-darwin)
     tailwindcss-ruby (3.4.19-x86_64-darwin)
     tailwindcss-ruby (3.4.19-x86_64-linux)
-    temple (0.10.4)
     textacular (5.7.0)
       activerecord (>= 5.0)
     thor (1.5.0)
-    tilt (2.7.0)
     timeout (0.6.1)
     tsort (0.2.0)
     turbo-rails (2.0.23)
@@ -404,9 +390,7 @@ DEPENDENCIES
   ruby-lsp
   ruby-lsp-rails
   selenium-webdriver (~> 4.17)
-  slim (~> 5.2)
   sprockets-rails
-  sqlite3 (~> 2.8)
   standard
 
 BUNDLED WITH

data/README.md

@@ -1,6 +1,7 @@
 # Mensa
 
 Fast and awesome tables, with pagination, sorting, filtering, batch processing, column hiding, column ordering and custom views.
+Due to search, it only works with postgresql at the moment.
 
 ![table](./docs/table.png)
 ![filters](./docs/filters.png)
@@ -52,16 +53,7 @@ class UserTable < ApplicationTable
   order name: :desc
 
   column(:name) do
-    attribute :name # Optional, we can deduct this from the column name
-    sortable true
-    sanitize true
-    internal false
-    visible true
-    filter do
-      collection -> { }
-      scope -> { where(name: ...) }
-    end
-    operators [:is, :isnt] # Optional, mensa tries to deduce this from the column information
+    filter
   end
 
   column(:nr_of_roles) do
@@ -112,17 +104,14 @@ end
 
 You can show your tables on the page using the following:
 
-```slim
-  = table :users
+```erb
+<%= table :users %>
 ```
 
 #### Custom views
 
 Custom views are views not defined by the developer (SystemViews) but by the end-user by adding/removing filters.
-
-Initial support for custom-views is there, but pretty rudimentary:
-
-`Mensa::TableView.create(table: "users", name: "Guests", config: {filters: {role: {value: "guest"}}})`
+When you enable these, they are stored in the database and can be used across sessions, by the user who created them.
 
 ### Fast
 
@@ -140,42 +129,27 @@ end
 ### Coding
 
 - Checkout this repo
-- Setup your direnv, add the following to your `.envrc`:
+- Setup your direnv, add the following to your `mise.toml`:
 
   ```
-  export BUNDLE_RUBYGEMS__PKG__GITHUB__COM=ghp_xxxxxxw
-  export RBENV_VERSION=$(cat .ruby-version)
+  [tools]
+  node = "24"
+  ruby = "3.4.7"
+  
+  [env]
+  RUBY_VERSION="3.4.7"
   ```
 
 - Run `direnv allow`
-
-If you use devcontainers:
-- Open with Visual Studio Code (or with any other editor) and reopen in container.
-- Run `bin/overmind s`
-
-If you're not using devcontainers:
-- Run `bin/overmind s`
+- Run `overmind s`
 
 ### Docs
 
 Using the following in your view will render Mensa::Table::Component
-```slim
-  = table :users
+```erb
+<%= table :users %>
 ```
 
-The Mensa::Table::Component will render:
-- Mensa::Search::Component
-- Mensa::FilterPillList::Component
-  - Mensa::FilterPill::Component
-  - Mensa::AddFilter::Component
-- Mensa::Views::Component
-  - renders a views list
-  - Mensa::ControlBar::Component
-    - search icon
-    - filter icon
-    - export icon
-- turbo-frame with the actual table you see  (which is rendered by Mensa::View::Component)
-
 ## Installation
 
 Add this line to your application's Gemfile:
@@ -199,7 +173,7 @@ $ gem install mensa
 Always use `bundle` to install the gem. Next use the install generator to install migrations, add an initializer and do other setup:
 
 ```bash
-$  bin/rails g mensa:install
+$  rails g mensa:install
 ```
 
 ### Exports

data/app/components/mensa/add_filter/component.html.erb

@@ -0,0 +1,31 @@
+<div class="mensa-table__add_filter"
+     data-controller="mensa-add-filter"
+     data-mensa-add-filter-mensa-filter-pill-list-outlet="#mensa-filter-pill-list-<%= table.table_id %>"
+     data-mensa-add-filter-operator-labels-value="<%= operator_labels.to_json %>">
+  <button class="mensa-table__add_filter__trigger"
+          type="button"
+          title="<%= t("mensa.add_filter.add", default: "Add filter") %>"
+          data-action="mensa-add-filter#openAllColumns">
+    <i class="fa-solid fa-circle-plus"></i>
+  </button>
+
+  <ul class="hidden fixed z-50 max-h-96 overflow-auto rounded-lg bg-white p-2 text-base shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none dark:bg-gray-800 sm:text-sm"
+      data-mensa-add-filter-target="filterList">
+    <% table.columns.select(&:filter?).each do |column| %>
+      <li class="text-gray-900 hover:bg-gray-100 relative flex cursor-default select-none items-center gap-2 rounded-md px-3 py-2 dark:text-gray-300 dark:hover:bg-gray-700"
+          data-mensa-add-filter-target="filterListItem"
+          data-action="click->mensa-add-filter#selectColumn mouseenter->mensa-add-filter#columnItemHovered"
+          data-filter-column-name="<%= column.name %>">
+        <div class="label block flex-1 truncate font-normal"><%= column.human_name %></div>
+        <div class="check hidden flex items-center text-primary-600">
+          <div class="fal fa-check"></div>
+        </div>
+        <span class="mensa-table__add_filter__enter-hint">↵ Enter</span>
+      </li>
+    <% end %>
+  </ul>
+
+  <div class="hidden mensa-table__add_filter__popover_container"
+       data-mensa-add-filter-target="valuePopover"
+       id="mensa-filter-pill-value-<%= SecureRandom.base36 %>"></div>
+</div>

data/app/components/mensa/cell/component.html.erb

@@ -0,0 +1 @@
+<td><%= cell.render(:html) %></td>

data/app/components/mensa/column_customizer/component.html.erb

@@ -0,0 +1,31 @@
+<div class="relative"
+     data-controller="mensa-column-customizer"
+     data-mensa-column-customizer-table-name-value="<%= table.name %>"
+     data-mensa-column-customizer-turbo-frame-id-value="<%= table.table_id %>"
+     data-mensa-column-customizer-mensa-table-outlet="#table-<%= table.table_id %>">
+  <button class="mensa-table__control_bar__button" type="button" data-action="click->mensa-column-customizer#toggle">
+    <i class="<%= Mensa.config.icons[:control_bar_edit] %>"></i>
+  </button>
+  <div class="mensa-table__column_customizer__popover hidden" data-mensa-column-customizer-target="popover">
+    <p class="mensa-table__column_customizer__heading">Columns</p>
+    <ul>
+      <% table.columns.reject(&:internal?).each do |column| %>
+        <li class="mensa-table__column_customizer__row"
+            data-mensa-column-customizer-target="columnRow"
+            data-column-name="<%= column.name %>"
+            data-visible="<%= column.visible?.to_s %>"
+            draggable="true"
+            data-action="dragstart->mensa-column-customizer#dragStart dragover->mensa-column-customizer#dragOver drop->mensa-column-customizer#drop dragend->mensa-column-customizer#dragEnd">
+          <i class="mensa-table__column_customizer__handle fa-solid fa-grip-vertical"></i>
+          <span class="mensa-table__column_customizer__name<%= !column.visible? ? " mensa-table__column_customizer__name--hidden" : "" %>">
+            <%= column.human_name %>
+          </span>
+          <button class="mensa-table__column_customizer__visibility" type="button" data-action="click->mensa-column-customizer#toggleVisibility">
+            <i class="fa-solid fa-eye"></i>
+            <i class="fa-solid fa-eye-slash"></i>
+          </button>
+        </li>
+      <% end %>
+    </ul>
+  </div>
+</div>

data/app/components/mensa/control_bar/component.html.erb

@@ -0,0 +1,56 @@
+<div class="mensa-table__control_bar" data-mensa-table-target="controlBar">
+  <div class="flex items-center gap-1 py-0">
+    <% if view_columns_ordering? %>
+      <%= render Mensa::ColumnCustomizer::Component.new(table: table) %>
+    <% end %>
+
+    <div class="mensa-table__save-reset hidden" data-mensa-table-target="saveResetButtons">
+      <button class="mensa-table__control_bar__button" type="button" title="<%= t(".reset", default: "Reset") %>" data-action="mensa-table#cancelFiltersAndSearch">
+        <i class="fa-solid fa-rotate-left"></i>
+      </button>
+      <% if table.current_user && table.supports_custom_views? %>
+        <div class="relative">
+          <button class="mensa-table__control_bar__button hidden" type="button" data-mensa-table-target="saveSimple" data-action="mensa-table#saveAsNewView">
+            <%= t(".save", default: "Save") %>
+          </button>
+          <button class="mensa-table__control_bar__button hidden" type="button" data-mensa-table-target="saveSplit" data-action="mensa-table#toggleSaveDropdown">
+            <%= t(".save", default: "Save") %>
+            <i class="fa-solid fa-chevron-down text-xs"></i>
+          </button>
+          <ul class="mensa-table__control_bar__save-dropdown hidden" data-mensa-table-target="saveDropdown">
+            <li>
+              <button class="mensa-table__control_bar__save-dropdown-item" type="button" data-action="mensa-table#updateCurrentViewAction">
+                <%= t(".update_view", default: "Update view") %>
+              </button>
+            </li>
+            <li>
+              <button class="mensa-table__control_bar__save-dropdown-item" type="button" data-action="mensa-table#saveAsNewView">
+                <%= t(".save_as_new_view", default: "Save as new view") %>
+              </button>
+            </li>
+          </ul>
+        </div>
+      <% else %>
+        <button class="mensa-table__control_bar__button" type="button" data-action="mensa-table#saveAsNewView">
+          <%= t(".save", default: "Save") %>
+        </button>
+      <% end %>
+    </div>
+
+    <button class="mensa-table__control_bar__button hidden" type="button" data-mensa-table-target="eyeButton" data-action="click->mensa-table#toggleViewFilters">
+      <i class="fa-solid fa-eye"></i>
+    </button>
+
+    <% if table.exportable? %>
+      <button class="mensa-table__control_bar__button relative" type="button" data-action="mensa-table#export">
+        <i data-mensa-table-target="exportIcon" class="<%= Mensa.config.icons[:control_bar_export] %>"></i>
+        <%= helpers.render partial: "mensa/exports/badge", locals: {table_name: table.name, user: table.current_user} %>
+      </button>
+    <% end %>
+  </div>
+
+  <% if table.exportable? %>
+    <%= helpers.turbo_stream_from Mensa::Export.stream_name(table.name, table.current_user) %>
+    <%= helpers.render partial: "mensa/exports/dialog", locals: {table: table} %>
+  <% end %>
+</div>

data/app/components/mensa/empty_state/component.html.erb

@@ -0,0 +1,10 @@
+<div class="mensa-empty-state">
+  <div class="mensa-empty-state__icon">
+    <i class="<%= Mensa.config.icons[:search] %>"></i>
+  </div>
+  <h3 class="mensa-empty-state__title"><%= t("mensa.empty_state.title", model: model_name_plural) %></h3>
+  <p class="mensa-empty-state__subtitle"><%= t("mensa.empty_state.subtitle") %></p>
+  <button class="mensa-empty-state__button" type="button" data-action="click->mensa-table#cancelFiltersAndSearch">
+    <%= t("mensa.empty_state.clear_button") %>
+  </button>
+</div>

data/app/components/mensa/filter_pill/component.html.erb

@@ -0,0 +1,20 @@
+<% formatted_value = filter.value.is_a?(Array) ? filter.value.join(", ") : filter.value %>
+<div class="mensa-filter-pill"
+     data-controller="mensa-filter-pill"
+     data-mensa-filter-pill-mensa-filter-pill-list-outlet="#mensa-filter-pill-list-<%= filter.table.table_id %>"
+     data-mensa-filter-pill-column-name-value="<%= filter.column.name %>"
+     data-mensa-filter-pill-value-value="<%= filter.operator_with_value? ? (filter.value.is_a?(Array) ? filter.value.to_json : filter.value) : nil %>"
+     data-mensa-filter-pill-operator-value="<%= filter.operator %>"
+     data-mensa-filter-pill-operator-without-value-value="<%= "true" unless filter.operator_with_value? %>"
+     data-view-filter="<%= "true" if view_filter? %>">
+  <button class="mensa-filter-pill__chip" type="button" data-action="click->mensa-filter-pill#edit">
+    <span class="mensa-filter-pill__column"><%= filter.column.human_name %></span>
+    <span class="mensa-filter-pill__operator"><%= filter.operator_label %></span>
+    <% if formatted_value.present? && filter.operator_with_value? %>
+      <span class="mensa-filter-pill__value"><%= formatted_value %></span>
+    <% end %>
+  </button>
+  <button class="mensa-filter-pill__remove" type="button" title="Remove filter" data-action="click->mensa-filter-pill#remove">
+    <i class="fa-solid fa-xmark"></i>
+  </button>
+</div>

data/app/components/mensa/filter_pill_list/component.html.erb

@@ -0,0 +1,30 @@
+<% has_filterable_columns = table.columns.any?(&:filter?) %>
+<div class="mensa-table__search-bar"
+     id="mensa-filter-pill-list-<%= table.table_id %>"
+     data-controller="mensa-filter-pill-list"
+     data-mensa-table-target="filterList"
+     data-mensa-filter-pill-list-table-name-value="<%= table.name %>"
+     data-mensa-filter-pill-list-mensa-table-outlet=".mensa-table#table-<%= table.table_id %>"
+     data-mensa-filter-pill-list-mensa-filter-pill-outlet=".mensa-filter-pill"
+     data-mensa-filter-pill-list-mensa-add-filter-outlet="[data-controller=mensa-add-filter]">
+  <div class="mensa-table__search-bar__pills-area">
+    <%= render Mensa::FilterPill::Component.with_collection(table.active_filters) %>
+    <% if has_filterable_columns %>
+      <%= render Mensa::AddFilter::Component.new(table: table) %>
+    <% end %>
+    <div class="mensa-table__search-bar__input-wrapper">
+      <input class="mensa-table__search-bar__input"
+             type="text"
+             name="search_query"
+             autocomplete="off"
+             placeholder="<%= t(has_filterable_columns ? ".search" : ".search_only") %>"
+             data-mensa-filter-pill-list-target="searchInput"
+             data-action="input->mensa-filter-pill-list#monitorSearch keydown.enter->mensa-filter-pill-list#search keydown.esc->mensa-filter-pill-list#resetSearch focus->mensa-filter-pill-list#searchFocused keydown.down->mensa-filter-pill-list#navigateDown keydown.up->mensa-filter-pill-list#navigateUp"
+             value="<%= params[:query] %>">
+      <i class="mensa-table__search-bar__search-icon <%= Mensa.config.icons[:search] %>"></i>
+    </div>
+  </div>
+  <button class="mensa-table__search-bar__clear hidden" type="button" data-mensa-filter-pill-list-target="resetSearchButton" data-action="mensa-filter-pill-list#resetSearch">
+    <i class="fas fa-xmark"></i>
+  </button>
+</div>

data/app/components/mensa/header/component.html.erb

@@ -0,0 +1,12 @@
+<th>
+  <% if column.sortable? %>
+    <%= link_to table.path(order: {column.name => column.next_sort_direction}, turbo_frame_id: table.table_id), "data-turbo-frame": "_self", class: "order cursor-pointer" do %>
+      <span><%= column.human_name %></span>
+      <i class="<%= Mensa.config.icons["order_indicator#{column.sort_direction.to_s.present? ? "_#{column.sort_direction}" : ""}".to_sym] %>"></i>
+    <% end %>
+  <% else %>
+    <div class="container">
+      <div class="title"><%= column.human_name %></div>
+    </div>
+  <% end %>
+</th>

data/app/components/mensa/row_action/component.html.erb

@@ -0,0 +1,9 @@
+<% if action.show.call(row.record) %>
+  <%= link_to(action.link ? table.original_view_context.instance_exec(row.record, &action.link) : "", {class: "action", title: action.title}.merge(action.link_attributes || {})) do %>
+    <% if action.icon %>
+      <i class="fa <%= action.icon %>"></i>
+    <% else %>
+      <%= name %>
+    <% end %>
+  <% end %>
+<% end %>

data/app/components/mensa/search/component.html.erb

@@ -0,0 +1,26 @@
+<% if table.current_user %>
+  <dialog class="mensa-table__save-view-dialog" data-mensa-table-target="saveViewDialog" data-action="click->mensa-table#saveViewDialogBackdrop">
+    <form class="mensa-table__save-view-dialog__form" data-action="submit->mensa-table#confirmSaveView">
+      <header class="mensa-table__save-view-dialog__header">
+        <h2 class="mensa-table__save-view-dialog__title"><%= t(".save_view_title", default: "Save view") %></h2>
+        <p class="mensa-table__save-view-dialog__subtitle"><%= t(".save_view_subtitle", default: "Save the current filters, ordering and search as a reusable view.") %></p>
+      </header>
+      <label class="mensa-table__save-view-dialog__field">
+        <span class="mensa-table__save-view-dialog__label"><%= t(".view_name", default: "Name") %></span>
+        <input class="mensa-table__save-view-dialog__input" type="text" required placeholder="<%= t(".view_name_placeholder", default: "e.g. Active customers") %>" data-mensa-table-target="saveViewName">
+      </label>
+      <label class="mensa-table__save-view-dialog__field">
+        <span class="mensa-table__save-view-dialog__label"><%= t(".view_description", default: "Description") %></span>
+        <textarea class="mensa-table__save-view-dialog__textarea" rows="3" placeholder="<%= t(".view_description_placeholder", default: "Optional notes about this view") %>" data-mensa-table-target="saveViewDescription"></textarea>
+      </label>
+      <div class="mensa-table__save-view-dialog__actions">
+        <button class="mensa-table__save-view-dialog__button mensa-table__save-view-dialog__button--secondary" type="button" data-action="mensa-table#cancelSaveView">
+          <%= t(".cancel") %>
+        </button>
+        <button class="mensa-table__save-view-dialog__button mensa-table__save-view-dialog__button--primary" type="submit">
+          <%= t(".save") %>
+        </button>
+      </div>
+    </form>
+  </dialog>
+<% end %>

data/app/components/mensa/table/component.html.erb

@@ -0,0 +1,25 @@
+<div class="mensa-table"
+     id="table-<%= table.table_id %>"
+     data-mensa-table-supports-views-value="<%= table.supports_views? %>"
+     data-mensa-table-table-url-value="<%= helpers.mensa.table_url(table.name, {turbo_frame_id: table.table_id}.merge(params)) %>"
+     data-mensa-table-save-view-url-value="<%= helpers.mensa.table_views_path(table.name) %>"
+     data-mensa-table-views-url-value="<%= helpers.mensa.table_views_path(table.name) %>"
+     data-mensa-table-exports-url-value="<%= helpers.mensa.table_exports_path(table.name) %>"
+     data-controller="mensa-table"
+     data-mensa-table-mensa-filter-pill-outlet="[data-controller='mensa-filter-pill']"
+     data-mensa-table-mensa-filter-pill-list-outlet="#mensa-filter-pill-list-<%= table.table_id %>"
+     data-mensa-table-mensa-column-customizer-outlet="[data-controller='mensa-column-customizer']">
+  <div class="mensa-table__toolbar">
+    <div class="mensa-table__search-container">
+      <% if table.supports_views? && table.show_header? %>
+        <%= render Mensa::Views::Component.new(table: table) %>
+      <% end %>
+      <div class="flex min-w-0 flex-1" id="filters-<%= table.table_id %>">
+        <%= render Mensa::FilterPillList::Component.new(table: table) %>
+      </div>
+    </div>
+    <%= render Mensa::ControlBar::Component.new(table: table) %>
+  </div>
+  <%= render Mensa::Search::Component.new(table: table) %>
+  <turbo-frame id="<%= table.table_id %>" target="_top" data-mensa-table-target="turboFrame" data-turbo-permanent=""></turbo-frame>
+</div>

data/app/components/mensa/table_row/component.html.erb

@@ -0,0 +1,18 @@
+<%= content_tag :tr, **row.link_attributes do %>
+  <% if table.batch_actions? %>
+    <td class="mensa-table__checkbox-col" data-action="click->mensa-selection#stopPropagation">
+      <input class="mensa-table__select-all" type="checkbox" value="<%= row.record.id %>" data-action="change->mensa-selection#toggleRow" data-mensa-selection-target="rowCheckbox">
+    </td>
+  <% end %>
+  <% if table.actions? && Mensa.config.row_actions_position == :front %>
+    <td class="actions">
+      <%= render(Mensa::RowAction::Component.with_collection(table.actions, row: row, table: table)) %>
+    </td>
+  <% end %>
+  <%= render(Mensa::Cell::Component.with_collection(table.display_columns, row: row)) %>
+  <% if table.actions? && Mensa.config.row_actions_position == :back %>
+    <td class="actions">
+      <%= render(Mensa::RowAction::Component.with_collection(table.actions, row: row, table: table)) %>
+    </td>
+  <% end %>
+<% end %>

data/app/components/mensa/view/component.html.erb

@@ -0,0 +1,51 @@
+<div class="overflow-y-auto relative"
+     data-mensa-table-target="view"
+     data-controller="mensa-selection"
+     data-mensa-selection-batch-url-value="<%= table.batch_actions? ? helpers.mensa.table_batch_actions_path(table.name) : "" %>">
+  <% if table.batch_actions? %>
+    <div class="mensa-batch-bar hidden" data-mensa-selection-target="batchBar">
+      <div class="mensa-batch-bar__content">
+        <input class="mensa-table__select-all" type="checkbox" data-action="click->mensa-selection#deselectAll" data-mensa-selection-target="batchAllCheckbox">
+        <span class="mensa-batch-bar__count" data-mensa-selection-target="selectedCount"></span>
+        <% table.batch_actions.each do |batch_action| %>
+          <button class="mensa-batch-bar__button" type="button" data-action="click->mensa-selection#executeBatch" data-mensa-selection-batch-action-param="<%= batch_action.name %>">
+            <%= batch_action.title %>
+          </button>
+        <% end %>
+      </div>
+    </div>
+  <% end %>
+  <table class="w-full">
+    <% if table.show_header? %>
+      <thead>
+        <tr>
+          <% if table.batch_actions? %>
+            <th class="mensa-table__checkbox-col">
+              <div class="container">
+                <input class="mensa-table__select-all" type="checkbox" data-action="change->mensa-selection#toggleAll" data-mensa-selection-target="headerCheckbox">
+              </div>
+            </th>
+          <% end %>
+          <% if table.actions? && Mensa.config.row_actions_position == :front %>
+            <th>Actions</th>
+          <% end %>
+          <%= render(Mensa::Header::Component.with_collection(table.display_columns, table: table)) %>
+          <% if table.actions? && Mensa.config.row_actions_position == :back %>
+            <th>Actions</th>
+          <% end %>
+        </tr>
+      </thead>
+    <% end %>
+    <tbody>
+      <%= render(Mensa::TableRow::Component.with_collection(table.rows, table: table)) %>
+    </tbody>
+  </table>
+  <% if table.pagy_details&.count == 0 %>
+    <%= render Mensa::EmptyState::Component.new(table: table) %>
+  <% elsif table.pagy_details&.last > 1 %>
+    <div class="paging">
+      <span><%= t("mensa.paging.info", model: model_name_plural, from: table.pagy_details.from, to: table.pagy_details.to, count: table.pagy_details.count) %></span>
+      <%== table.pagy_details.series_nav(anchor_string: 'data-turbo-frame="_self"') %>
+    </div>
+  <% end %>
+</div>

data/app/components/mensa/views/component.html.erb

@@ -0,0 +1,74 @@
+<% current_view = table.all_views.find { |v| v.id == table.table_view&.id } || table.all_views.first %>
+<% current_view_name = current_view&.name || t(".all", default: "All") %>
+<% current_view_id = current_view&.id || "" %>
+
+<div class="mensa-table__views"
+     id="mensa-views-<%= table.table_id %>"
+     data-mensa-table-target="views"
+     data-controller="mensa-views"
+     data-mensa-views-mensa-filter-pill-list-outlet="#mensa-filter-pill-list-<%= table.table_id %>"
+     data-mensa-views-table-id-value="<%= table.table_id %>"
+     data-mensa-views-views-url-value="<%= helpers.mensa.table_views_path(table.name) %>">
+  <button class="mensa-table__views__trigger" type="button" data-action="mensa-views#toggleDropdown" data-mensa-views-target="trigger" aria-haspopup="listbox">
+    <span class="mensa-table__views__trigger-label" data-mensa-views-target="triggerLabel"><%= current_view_name %></span>
+    <i class="fa-solid fa-sort mensa-table__views__trigger-icon"></i>
+  </button>
+
+  <div class="mensa-table__views__dropdown hidden" data-mensa-views-target="dropdown">
+    <ul role="listbox">
+      <% table.all_views.each do |view| %>
+        <% is_selected = view.id == table.table_view&.id || (view.id == :default && table.table_view.blank?) %>
+        <% is_user_view = view.id.is_a?(String) && view.id.match?(/\A[0-9a-f-]{32,}\z/i) %>
+        <li class="mensa-table__views__option" role="option" data-view-id="<%= view.id %>" data-view-name="<%= view.name %>" data-mensa-views-target="view">
+          <button class="mensa-table__views__option-btn" type="button" data-action="mensa-views#select" data-view-id="<%= view.id %>">
+            <i class="mensa-table__views__option-check fa-solid fa-check<%= " invisible" unless is_selected %>"></i>
+            <span><%= view.name %></span>
+          </button>
+          <% if is_user_view %>
+            <button class="mensa-table__views__option-menu" type="button" data-action="mensa-views#toggleSubmenu" data-view-id="<%= view.id %>" title="View options">
+              <i class="fa-solid fa-ellipsis"></i>
+            </button>
+          <% else %>
+            <div class="mensa-table__views__option-system">
+              <i class="fa-solid fa-ban"></i>
+            </div>
+          <% end %>
+        </li>
+      <% end %>
+    </ul>
+
+    <div class="mensa-table__views__submenu hidden" data-mensa-views-target="submenu">
+      <button class="mensa-table__views__submenu-item" type="button" data-action="mensa-views#renameView">
+        <i class="fa-solid fa-pencil"></i>
+        <%= t(".rename_view", default: "Rename view") %>
+      </button>
+      <button class="mensa-table__views__submenu-item" type="button" data-action="mensa-views#duplicateView">
+        <i class="fa-solid fa-copy"></i>
+        <%= t(".duplicate_view", default: "Duplicate view") %>
+      </button>
+      <button class="mensa-table__views__submenu-item mensa-table__views__submenu-item--danger" type="button" data-action="mensa-views#deleteView">
+        <i class="fa-solid fa-trash"></i>
+        <%= t(".delete_view", default: "Delete view") %>
+      </button>
+    </div>
+  </div>
+
+  <dialog class="mensa-table__views__rename-dialog" data-mensa-views-target="renameDialog" data-action="click->mensa-views#renameDialogBackdrop">
+    <form class="mensa-table__views__rename-form" data-action="submit->mensa-views#confirmRename">
+      <input type="hidden" data-mensa-views-target="renameViewId">
+      <h3 class="mensa-table__views__rename-title"><%= t(".rename_view", default: "Rename view") %></h3>
+      <label class="mensa-table__views__rename-label">
+        <%= t(".view_name", default: "Name") %>
+        <input class="mensa-table__views__rename-input" type="text" required placeholder="<%= t(".view_name_placeholder", default: "View name") %>" data-mensa-views-target="renameInput">
+      </label>
+      <div class="mensa-table__views__rename-actions">
+        <button class="mensa-table__views__rename-btn mensa-table__views__rename-btn--secondary" type="button" data-action="mensa-views#cancelRename">
+          <%= t(".cancel", default: "Cancel") %>
+        </button>
+        <button class="mensa-table__views__rename-btn mensa-table__views__rename-btn--primary" type="submit">
+          <%= t(".rename", default: "Rename") %>
+        </button>
+      </div>
+    </form>
+  </dialog>
+</div>

data/app/views/mensa/exports/_badge.html.erb

@@ -0,0 +1,6 @@
+<% count = Mensa::Export.completed_count(table_name, user) %>
+<span id="<%= Mensa::Export.badge_dom_id(table_name, user) %>"
+      class="mensa-table__control_bar__badge <%= 'hidden' unless count.positive? %>"
+      aria-hidden="<%= count.positive? ? 'false' : 'true' %>">
+  <%= count %>
+</span>