moduler 0.2.0 → 0.3.0

data/app/controllers/moduler/profile/sessions_controller.rb

@@ -0,0 +1,21 @@
+module Moduler
+  module Profile
+    class SessionsController < ApplicationController
+      def index
+        @sessions = Current.user.sessions.order(created_at: :desc).page(params[:page]).per(10)
+      end
+
+      def destroy
+        session = Current.user.sessions.active.find(params[:id])
+        session.touch(:signed_out_at)
+
+        if session == Current.session
+          cookies.delete(:session_id)
+          redirect_to moduler.new_session_path, status: :see_other
+        else
+          redirect_to moduler.profile_sessions_path, status: :see_other
+        end
+      end
+    end
+  end
+end

data/app/controllers/moduler/profile_controller.rb

@@ -0,0 +1,27 @@
+module Moduler
+  class ProfileController < ApplicationController
+    def edit
+      @user = Current.user
+    end
+
+    def update
+      @user = Current.user
+
+      @user.assign_attributes(permitted_parameters)
+
+      if @user.save(context: :self_service_update)
+        @user.sessions.active.where.not(id: Current.session.id).update_all(signed_out_at: Time.current) if @user.saved_change_to_password_digest?
+
+        redirect_to moduler.edit_profile_path, notice: t(".notice")
+      else
+        render :edit, status: :unprocessable_entity
+      end
+    end
+
+    private
+
+    def permitted_parameters
+      params.expect(user: %i[ password_challenge password password_confirmation ])
+    end
+  end
+end

data/app/controllers/moduler/sessions_controller.rb

@@ -2,6 +2,13 @@ module Moduler
   class SessionsController < ApplicationController
     allow_unauthenticated_access only: %i[ new create ]
 
+    rate_limit to: 10, within: 3.minutes, only: :create,
+      with: -> { redirect_to moduler.new_session_path, alert: t("moduler.sessions.create.rate_limited") }
+
+    rate_limit to: 5, within: 3.minutes, only: :create,
+      by: -> { params.dig(:user, :email_address) },
+      with: -> { redirect_to moduler.new_session_path, alert: t("moduler.sessions.create.rate_limited") }
+
     def new
       if authenticated?
         redirect_to after_authentication_url
@@ -26,7 +33,7 @@ module Moduler
 
     def destroy
       terminate_session
-      redirect_to moduler.new_session_path
+      redirect_to moduler.new_session_path, status: :see_other
     end
   end
 end

data/app/controllers/moduler/users_controller.rb

@@ -2,6 +2,13 @@ module Moduler
   class UsersController < ApplicationController
     allow_unauthenticated_access only: %i[ new create ]
 
+    rate_limit to: 10, within: 3.minutes, only: :create,
+      with: -> { redirect_to moduler.new_user_path, alert: t("moduler.users.create.rate_limited") }
+
+    rate_limit to: 5, within: 3.minutes, only: :create,
+      by: -> { params.dig(:user, :email_address) },
+      with: -> { redirect_to moduler.new_user_path, alert: t("moduler.users.create.rate_limited") }
+
     def new
       if authenticated?
         redirect_to after_authentication_url

data/app/filters/application_filter.rb

@@ -0,0 +1,41 @@
+class ApplicationFilter
+  include ActiveModel::Model
+  include ActiveModel::Dirty
+  include ActiveModel::Attributes
+
+  class << self
+    def modifiers
+      @modifiers ||= []
+    end
+  end
+
+  def initialize(scope, parameters, options = {})
+    super(parameters)
+
+    @scope = scope
+    @options = options
+  end
+
+  def call
+    [ filter, results ]
+  end
+
+  private
+
+  def filter
+    return self unless changed?
+
+    tap(&:valid?)
+  end
+
+  def results
+    return @scope.none.page(1) if !changed? && @options.fetch(:allow_empty, false)
+    return @scope.none.page(1) if invalid?
+
+    self.class.modifiers.each do |modifier|
+      @scope = modifier.call(@scope, self) || @scope
+    end
+
+    @scope
+  end
+end

data/app/filters/query_filter.rb

@@ -0,0 +1,18 @@
+class QueryFilter < ApplicationFilter
+  attribute :query, :string
+  attribute :page, :integer
+
+  validates :query, length: { maximum: 100 }
+
+  modifiers << proc do |scope, filter|
+    scope.page(filter.page).per(10)
+  end
+
+  modifiers << proc do |scope, _filter|
+    scope.order(created_at: :desc)
+  end
+
+  modifiers << proc do |scope, filter|
+    scope.search_by_query(filter.query) if filter.query.present?
+  end
+end

data/app/lib/moduler/form_builder.rb

@@ -5,7 +5,7 @@ module Moduler
 
       @template.content_tag :div, **options do
         @object.errors[field].first
-      end.html_safe
+      end
     end
 
     def full_error(field, options = {})
@@ -13,7 +13,7 @@ module Moduler
 
       @template.content_tag :div, **options do
         @object.errors.full_messages_for(field).first
-      end.html_safe
+      end
     end
 
     def error?(field)

data/app/models/moduler/session.rb

@@ -1,5 +1,17 @@
 module Moduler
   class Session < ApplicationRecord
+    include PgSearch::Model
+
+    LIFETIME = 30.days
+
     belongs_to :user, class_name: "Moduler::User", foreign_key: "moduler_user_id"
+
+    scope :active, -> { where(signed_out_at: nil) }
+
+    pg_search_scope :search_by_query, against: %i[ ip_address user_agent ], associated_against: { user: %i[ email_address ] }, using: { trigram: { word_similarity: true } }
+
+    def active?
+      signed_out_at.nil?
+    end
   end
 end

data/app/models/moduler/user.rb

@@ -1,9 +1,18 @@
 module Moduler
   class User < ApplicationRecord
+    include PgSearch::Model
+
     has_many :sessions, class_name: "Moduler::Session", foreign_key: "moduler_user_id", dependent: :destroy
 
     has_secure_password
 
+    normalizes :email_address, with: ->(email_address) { email_address.strip.downcase }
+
     validates :email_address, presence: true, uniqueness: true, format: { with: URI::MailTo::EMAIL_REGEXP }
+    validates :password, length: { minimum: 8 }, allow_nil: true
+
+    enum :role, { member: 0, administrator: 1 }
+
+    pg_search_scope :search_by_query, against: %i[ email_address ], using: { trigram: { word_similarity: true } }
   end
 end

data/app/policies/moduler/administration/base_policy.rb

@@ -0,0 +1,11 @@
+module Moduler
+  module Administration
+    class BasePolicy < ApplicationPolicy
+      private
+
+      def administrator?
+        user&.administrator?
+      end
+    end
+  end
+end

data/app/policies/moduler/administration/home_policy.rb

@@ -0,0 +1,9 @@
+module Moduler
+  module Administration
+    class HomePolicy < BasePolicy
+      def index?
+        administrator?
+      end
+    end
+  end
+end

data/app/policies/moduler/administration/session_policy.rb

@@ -0,0 +1,13 @@
+module Moduler
+  module Administration
+    class SessionPolicy < BasePolicy
+      def index?
+        administrator?
+      end
+
+      def destroy?
+        administrator?
+      end
+    end
+  end
+end

data/app/policies/moduler/administration/user_policy.rb

@@ -0,0 +1,25 @@
+module Moduler
+  module Administration
+    class UserPolicy < BasePolicy
+      def index?
+        administrator?
+      end
+
+      def create?
+        administrator?
+      end
+
+      def update?
+        administrator? && record != user
+      end
+
+      def new?
+        create?
+      end
+
+      def edit?
+        update?
+      end
+    end
+  end
+end

data/app/policies/moduler/application_policy.rb

@@ -0,0 +1,38 @@
+module Moduler
+  class ApplicationPolicy
+    attr_reader :user, :record
+
+    def initialize(user, record)
+      @user = user
+      @record = record
+    end
+
+    def index?
+      false
+    end
+
+    def show?
+      false
+    end
+
+    def create?
+      false
+    end
+
+    def new?
+      create?
+    end
+
+    def update?
+      false
+    end
+
+    def edit?
+      update?
+    end
+
+    def destroy?
+      false
+    end
+  end
+end

data/app/views/kaminari/_gap.html.erb

@@ -0,0 +1 @@
+<span class="px-2 text-slate-400"><%= raw(t("views.pagination.truncate")) %></span>

data/app/views/kaminari/_next_page.html.erb

@@ -0,0 +1 @@
+<%= link_to raw(t("views.pagination.next")), url, rel: "next", remote: remote, class: "rounded px-3 py-1 text-slate-600 hover:bg-slate-100" %>

data/app/views/kaminari/_page.html.erb

@@ -0,0 +1,3 @@
+<%= link_to page, url, remote: remote, rel: page.rel,
+      class: "rounded px-3 py-1 #{page.current? ? 'bg-slate-900 text-white' : 'text-slate-600 hover:bg-slate-100'}",
+      "aria-current": (page.current? ? "page" : nil) %>

data/app/views/kaminari/_paginator.html.erb

@@ -0,0 +1,13 @@
+<%= paginator.render do %>
+  <nav class="flex flex-wrap items-center justify-end gap-1 text-sm" aria-label="Pagination">
+    <%= prev_page_tag unless current_page.first? %>
+    <% each_page do |page| %>
+      <% if page.left_outer? || page.right_outer? || page.inside_window? %>
+        <%= page_tag page %>
+      <% elsif !page.was_truncated? %>
+        <%= gap_tag %>
+      <% end %>
+    <% end %>
+    <%= next_page_tag unless current_page.last? %>
+  </nav>
+<% end %>

data/app/views/kaminari/_prev_page.html.erb

@@ -0,0 +1 @@
+<%= link_to raw(t("views.pagination.previous")), url, rel: "prev", remote: remote, class: "rounded px-3 py-1 text-slate-600 hover:bg-slate-100" %>

data/app/views/layouts/moduler/application.html.erb

@@ -2,6 +2,7 @@
 <html>
   <head>
     <title>Moduler</title>
+    <meta name="viewport" content="width=device-width,initial-scale=1">
     <%= csrf_meta_tags %>
     <%= csp_meta_tag %>
 
@@ -9,14 +10,12 @@
 
     <%= stylesheet_link_tags_if_exist "moduler/tailwind", "moduler/application", media: "all" %>
 
-    <%# Include host application stylesheets %>
-    <%= stylesheet_link_tags_if_exist "tailwind", "application", media: "all" %>
-
     <%= javascript_importmap_tags "moduler/application" %>
   </head>
-  <body>
-    <div class="min-h-full">
-      <%= render "moduler/common/header" %>
+  <body class="flex min-h-screen flex-col">
+    <div class="flex flex-1 flex-col">
+      <%= render "moduler/common/header" if authenticated? %>
+      <%= render "moduler/common/flash" %>
 
       <%= yield %>
     </div>

data/app/views/moduler/administration/home/index.html.erb

@@ -0,0 +1,6 @@
+<main class="mx-auto flex w-full flex-1 max-w-[120rem] flex-col gap-4 px-4 md:flex-row md:gap-8 md:pl-0 md:pr-6">
+  <%= render "moduler/common/administration/sidebar" %>
+
+  <div class="flex min-w-0 flex-1 flex-col pb-4 md:mt-8">
+  </div>
+</main>

data/app/views/moduler/administration/sessions/_session.html.erb

@@ -0,0 +1,30 @@
+<% current = session == Moduler::Current.session %>
+
+<%= render(Moduler::ListItemComponent.new(session.user.email_address, id: dom_id(session))) do |item| %>
+  <% if current %>
+    <% item.with_badge(t(".status.current"), variant: :success) %>
+  <% elsif session.active? %>
+    <% item.with_badge(t(".status.active")) %>
+  <% else %>
+    <% item.with_badge(t(".status.signed_out"), variant: :muted) %>
+  <% end %>
+
+  <% item.with_meta do %>
+    <%= session.ip_address.presence || t(".unknown_ip") %>
+    <span aria-hidden="true">&middot;</span>
+    <span title="<%= session.user_agent %>"><%= truncate(session.user_agent.presence || t(".unknown_device"), length: 60) %></span>
+    <span aria-hidden="true">&middot;</span>
+    <%= time_tag session.signed_in_at, t(".signed_in", time: time_ago_in_words(session.signed_in_at)), title: l(session.signed_in_at, format: :long) %>
+    <% if session.signed_out_at %>
+      <span aria-hidden="true">&middot;</span>
+      <%= time_tag session.signed_out_at, t(".signed_out", time: time_ago_in_words(session.signed_out_at)), title: l(session.signed_out_at, format: :long) %>
+    <% end %>
+  <% end %>
+
+  <% if session.active? %>
+    <% item.with_action do %>
+      <%= render(Moduler::ButtonComponent.new(t(".action.destroy"), moduler.administration_session_path(session), method: :delete, size: :sm,
+            confirm: t(current ? ".confirmation.destroy_current" : ".confirmation.destroy"))) %>
+    <% end %>
+  <% end %>
+<% end %>

data/app/views/moduler/administration/sessions/index.html.erb

@@ -0,0 +1,9 @@
+<%= render(Moduler::Administration::PageComponent.new) do %>
+  <%= render(Moduler::PageHeaderComponent.new(t(".title"), description: t(".description"))) %>
+
+  <%= render(Moduler::FilterComponent.new(@filter, moduler.administration_sessions_path)) %>
+
+  <%= render(Moduler::ListComponent.new(@sessions, id: "sessions", empty: t(".empty"))) do %>
+    <%= render partial: "moduler/administration/sessions/session", collection: @sessions %>
+  <% end %>
+<% end %>

data/app/views/moduler/administration/users/_user.html.erb

@@ -0,0 +1,13 @@
+<%= render(Moduler::ListItemComponent.new(user.email_address, id: dom_id(user))) do |item| %>
+  <% item.with_badge(t("moduler.administration.users.roles.#{user.role}"), variant: user.administrator? ? :success : :neutral) %>
+
+  <% item.with_meta do %>
+    <%= time_tag user.created_at, t(".created", time: time_ago_in_words(user.created_at)), title: l(user.created_at, format: :long) %>
+  <% end %>
+
+  <% if Moduler::Administration::UserPolicy.new(current_user, user).edit? %>
+    <% item.with_action do %>
+      <%= render(Moduler::ButtonLinkComponent.new(t(".action.edit"), moduler.edit_administration_user_path(user), size: :sm)) %>
+    <% end %>
+  <% end %>
+<% end %>

data/app/views/moduler/administration/users/edit.html.erb

@@ -0,0 +1,14 @@
+<%= render(Moduler::Administration::PageComponent.new) do %>
+  <%= render(Moduler::PageHeaderComponent.new(t(".title"))) %>
+
+  <%= form_with model: @user, url: moduler.administration_user_path(@user), method: :patch, data: { turbo: false }, class: "w-full max-w-lg space-y-6" do |form| %>
+    <%= render(::Moduler::Form::BaseErrorComponent.new(form)) %>
+
+    <%= render(::Moduler::Form::SectionComponent.new(t(".section.data"))) do %>
+      <%= render(::Moduler::Form::EmailComponent.new(form, :email_address, label: t(".label.email_address"))) %>
+      <%= render(::Moduler::Form::SelectComponent.new(form, :role, Moduler::User.roles.keys.map { |role| [ t("moduler.administration.users.roles.#{role}"), role ] }, label: t(".label.role"))) %>
+    <% end %>
+
+    <%= render(::Moduler::Form::SubmitComponent.new(form, text: t(".action.save"))) %>
+  <% end %>
+<% end %>

data/app/views/moduler/administration/users/index.html.erb

@@ -0,0 +1,13 @@
+<%= render(Moduler::Administration::PageComponent.new) do %>
+  <%= render(Moduler::PageHeaderComponent.new(t(".title"), description: t(".description"))) do |header| %>
+    <% header.with_action do %>
+      <%= render(Moduler::ButtonLinkComponent.new(t(".action.new"), moduler.new_administration_user_path)) %>
+    <% end %>
+  <% end %>
+
+  <%= render(Moduler::FilterComponent.new(@filter, moduler.administration_users_path)) %>
+
+  <%= render(Moduler::ListComponent.new(@users, id: "users", empty: t(".empty"))) do %>
+    <%= render partial: "moduler/administration/users/user", collection: @users %>
+  <% end %>
+<% end %>

data/app/views/moduler/administration/users/new.html.erb

@@ -0,0 +1,18 @@
+<%= render(Moduler::Administration::PageComponent.new) do %>
+  <%= render(Moduler::PageHeaderComponent.new(t(".title"))) %>
+
+  <%= form_with model: @user, url: moduler.administration_users_path, data: { turbo: false }, class: "w-full max-w-lg space-y-6" do |form| %>
+    <%= render(::Moduler::Form::BaseErrorComponent.new(form)) %>
+
+    <%= render(::Moduler::Form::SectionComponent.new(t(".section.data"))) do %>
+      <%= render(::Moduler::Form::EmailComponent.new(form, :email_address, label: t(".label.email_address"))) %>
+      <%= render(::Moduler::Form::SelectComponent.new(form, :role, Moduler::User.roles.keys.map { |role| [ t("moduler.administration.users.roles.#{role}"), role ] }, label: t(".label.role"))) %>
+    <% end %>
+
+    <%= render(::Moduler::Form::SectionComponent.new(t(".section.password"), divider: true)) do %>
+      <%= render(::Moduler::Form::PasswordComponent.new(form, :password, label: t(".label.password"), description: t(".description.password"))) %>
+    <% end %>
+
+    <%= render(::Moduler::Form::SubmitComponent.new(form, text: t(".action.create"))) %>
+  <% end %>
+<% end %>

data/app/views/moduler/common/_flash.html.erb

@@ -0,0 +1,16 @@
+<% if flash.any? { |_, message| message.present? } %>
+  <div class="fixed top-4 right-4 z-50 flex w-full max-w-sm flex-col gap-2 px-4 sm:px-0">
+    <% flash.each do |key, message| %>
+      <% next if message.blank? %>
+      <div data-controller="flash"
+          class="flex items-start gap-3 rounded-md border px-4 py-3 text-sm shadow-lg transition duration-200 <%= key.to_s.in?(%w[alert error]) ? "border-red-200 bg-red-50 text-red-700" : key.to_s == "warning" ? "border-amber-200 bg-amber-50 text-amber-700" : "border-emerald-200 bg-emerald-50 text-emerald-700" %>">
+        <p class="flex-1"><%= message %></p>
+        <button type="button" data-action="flash#dismiss" class="shrink-0 cursor-pointer text-slate-400 transition hover:text-slate-600">
+          <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" class="h-4 w-4">
+            <path d="M18 6 6 18M6 6l12 12" />
+          </svg>
+        </button>
+      </div>
+    <% end %>
+  </div>
+<% end %>

data/app/views/moduler/common/_header.html.erb

@@ -1,9 +1,18 @@
 <nav class="border-b border-gray-200 bg-white">
-  <div class="mx-auto flex h-16 max-w-7xl items-center justify-between px-4 sm:px-6 lg:px-8">
-    <div class="flex items-center gap-8">
+  <div class="flex h-16 w-full items-center justify-between gap-4 px-4 sm:px-6 lg:px-6">
+    <div class="flex shrink-0 items-center gap-4 sm:gap-8">
       <%= link_to t(".nav.home"), moduler.root_path, class: "text-sm/6 font-semibold text-gray-900 hover:text-custom" %>
+
+      <% if policy([:moduler, :administration, :home]).index? %>
+        |
+        <%= link_to t(".nav.administration"), moduler.administration_root_path, class: "text-sm/6 font-semibold text-gray-900 hover:text-custom" %>
+      <% end %>
     </div>
 
-    <%= button_to t(".action.sign_out"), moduler.session_path, method: :delete, class: "cursor-pointer rounded-md px-3 py-1.5 text-sm/6 font-semibold text-gray-900 hover:bg-gray-50" %>
+    <div class="flex min-w-0 items-center gap-3 text-sm text-gray-900 sm:gap-6">
+      <%= link_to current_user.email_address, moduler.edit_profile_path, class: "truncate" %>
+      |
+      <%= button_to t(".action.sign_out"), moduler.session_path, method: :delete, class: "cursor-pointer whitespace-nowrap font-semibold" %>
+    </div>
   </div>
 </nav>

data/app/views/moduler/common/_sidebar.html.erb

@@ -0,0 +1,6 @@
+<aside class="-mx-4 border-b border-gray-200 px-2 md:mx-0 md:w-1/8 md:shrink-0 md:border-b-0 md:border-r md:px-0">
+  <nav class="flex gap-1 overflow-x-auto md:flex-col text-sm p-2">
+    <%= render(Moduler::SidebarActionComponent.new(t(".action.profile"), moduler.edit_profile_path, "moduler/profile")) %>
+    <%= render(Moduler::SidebarActionComponent.new(t(".action.sessions"), moduler.profile_sessions_path, "moduler/profile/sessions")) %>
+  </nav>
+</aside>

data/app/views/moduler/common/administration/_sidebar.html.erb

@@ -0,0 +1,6 @@
+<aside class="-mx-4 border-b border-gray-200 px-2 md:mx-0 md:w-1/8 md:shrink-0 md:border-b-0 md:border-r md:px-0">
+  <nav class="flex gap-1 overflow-x-auto md:flex-col text-sm p-2">
+    <%= render(Moduler::SidebarActionComponent.new(t(".action.users"), moduler.administration_users_path, "moduler/administration/users")) %>
+    <%= render(Moduler::SidebarActionComponent.new(t(".action.sessions"), moduler.administration_sessions_path, "moduler/administration/sessions")) %>
+  </nav>
+</aside>

data/app/views/moduler/profile/edit.html.erb

@@ -0,0 +1,28 @@
+<main class="mx-auto flex w-full flex-1 max-w-[120rem] flex-col gap-4 px-4 md:flex-row md:gap-8 md:pl-0 md:pr-6">
+  <%= render "moduler/common/sidebar" %>
+
+  <div class="flex min-w-0 flex-1 flex-col pb-4 md:mt-8">
+    <div class="mb-4 flex min-h-9 items-center justify-between gap-4">
+      <h1 class="text-base font-semibold text-gray-900"><%= t(".title") %></h1>
+    </div>
+
+    <%= form_with model: @user, url: moduler.profile_path, method: :patch, data: { turbo: false }, class: "w-full max-w-lg space-y-6" do |form| %>
+      <%= render(::Moduler::Form::BaseErrorComponent.new(form)) %>
+
+      <%= render(::Moduler::Form::SectionComponent.new(t(".section.data"))) do %>
+        <%= render(::Moduler::Form::EmailComponent.new(form, :email_address, label: t(".label.email_address"), disabled: :disabled)) %>
+      <% end %>
+
+      <%= render(::Moduler::Form::SectionComponent.new(t(".section.password"), divider: true)) do %>
+        <%= render(::Moduler::Form::PasswordComponent.new(form, :password, label: t(".label.password"))) %>
+        <%= render(::Moduler::Form::PasswordComponent.new(form, :password_confirmation, label: t(".label.password_confirmation"), description: t(".description.password_confirmation"))) %>
+      <% end %>
+
+      <%= render(::Moduler::Form::SectionComponent.new(t(".section.current_password"), divider: true)) do %>
+        <%= render(::Moduler::Form::PasswordComponent.new(form, :password_challenge, label: t(".label.password_challenge"), description: t(".description.password_challenge"))) %>
+      <% end %>
+
+      <%= render(::Moduler::Form::SubmitComponent.new(form, text: t(".action.save"))) %>
+    <% end %>
+  </div>
+</main>

data/app/views/moduler/profile/sessions/_session.html.erb

@@ -0,0 +1,52 @@
+<% current = session == Moduler::Current.session %>
+<% mobile = session.user_agent.to_s.match?(/Mobile|Android|iPhone|iPad/) %>
+
+<li id="<%= dom_id(session) %>" class="flex items-center justify-between gap-4 px-4 py-4 sm:px-5 <%= "bg-slate-50/60" unless session.active? %>">
+  <div class="flex min-w-0 items-start gap-4">
+    <div class="flex size-10 shrink-0 items-center justify-center rounded-full <%= session.active? ? "bg-slate-100 text-slate-600" : "bg-slate-100/60 text-slate-400" %>">
+      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="size-5" aria-hidden="true">
+        <% if mobile %>
+          <rect x="7" y="2.5" width="10" height="19" rx="2" />
+          <path d="M11 18.5h2" />
+        <% else %>
+          <rect x="3" y="4" width="18" height="12" rx="1.5" />
+          <path d="M8 20h8M12 16v4" />
+        <% end %>
+      </svg>
+    </div>
+
+    <div class="min-w-0">
+      <div class="flex flex-wrap items-center gap-2">
+        <p class="text-sm font-semibold <%= session.active? ? "text-gray-900" : "text-slate-500" %>">
+          <%= session.ip_address.presence || t(".unknown_ip") %>
+        </p>
+
+        <% if current %>
+          <span class="inline-flex items-center rounded-full bg-emerald-50 px-2 py-0.5 text-xs font-medium text-emerald-700 ring-1 ring-inset ring-emerald-600/20"><%= t(".status.current") %></span>
+        <% elsif session.active? %>
+          <span class="inline-flex items-center rounded-full bg-slate-50 px-2 py-0.5 text-xs font-medium text-slate-600 ring-1 ring-inset ring-slate-500/20"><%= t(".status.active") %></span>
+        <% else %>
+          <span class="inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium text-slate-400 ring-1 ring-inset ring-slate-200"><%= t(".status.signed_out") %></span>
+        <% end %>
+      </div>
+
+      <p class="mt-1 truncate text-xs text-slate-500" title="<%= session.user_agent %>">
+        <%= session.user_agent.presence || t(".unknown_device") %>
+      </p>
+
+      <p class="mt-1 text-xs text-slate-400">
+        <%= time_tag session.signed_in_at, t(".signed_in", time: time_ago_in_words(session.signed_in_at)), title: l(session.signed_in_at, format: :long) %>
+        <% if session.signed_out_at %>
+          <span aria-hidden="true">&middot;</span>
+          <%= time_tag session.signed_out_at, t(".signed_out", time: time_ago_in_words(session.signed_out_at)), title: l(session.signed_out_at, format: :long) %>
+        <% end %>
+      </p>
+    </div>
+  </div>
+
+  <% if session.active? %>
+    <%= button_to t(".action.destroy"), moduler.profile_session_path(session), method: :delete,
+          class: "cursor-pointer rounded-md bg-white px-2.5 py-1 text-sm font-medium text-slate-600 shadow-sm ring-1 ring-inset ring-slate-300 hover:bg-slate-50 hover:text-red-600",
+          form: { class: "shrink-0", data: { turbo_confirm: t(current ? ".confirmation.destroy_current" : ".confirmation.destroy") } } %>
+  <% end %>
+</li>

data/app/views/moduler/profile/sessions/index.html.erb

@@ -0,0 +1,26 @@
+<main class="mx-auto flex w-full flex-1 max-w-[120rem] flex-col gap-4 px-4 md:flex-row md:gap-8 md:pl-0 md:pr-6">
+  <%= render "moduler/common/sidebar" %>
+
+  <div class="flex min-w-0 flex-1 flex-col pb-4 md:mt-8">
+    <div class="mb-6 flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between">
+      <div>
+        <h1 class="text-base font-semibold text-gray-900"><%= t(".title") %></h1>
+        <p class="mt-1 text-sm text-slate-500"><%= t(".description") %></p>
+      </div>
+
+      <%= button_to t(".action.revoke_all"), moduler.profile_sessions_revocation_path, method: :delete,
+            class: "cursor-pointer whitespace-nowrap rounded-md bg-white px-3 py-1.5 text-sm/6 font-semibold text-red-600 shadow-sm ring-1 ring-inset ring-slate-300 hover:bg-red-50 hover:ring-red-200 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-red-600",
+            form: { class: "shrink-0", data: { turbo_confirm: t(".confirmation.revoke") } } %>
+    </div>
+
+    <div class="flex-1">
+      <ul id="sessions" role="list" class="divide-y divide-slate-100 rounded-lg border border-slate-200 bg-white">
+        <%= render partial: "moduler/profile/sessions/session", collection: @sessions %>
+      </ul>
+    </div>
+
+    <div class="mt-4 flex justify-end">
+      <%= paginate @sessions %>
+    </div>
+  </div>
+</main>