kommandant 0.1.0 → 0.2.1

data/app/controllers/kommandant/commands_controller.rb

@@ -0,0 +1,17 @@
+module Kommandant
+  class CommandsController < ApplicationController
+    before_action :set_command
+
+    def show
+      if Kommandant.config.recent_commands.enabled
+        current_user.recent_commands.prepend(@command.id)
+      end
+    end
+
+    private
+
+    def set_command
+      @command = Kommandant::Command.find(params[:id])
+    end
+  end
+end

data/app/controllers/kommandant/searches_controller.rb

@@ -0,0 +1,14 @@
+module Kommandant
+  class SearchesController < ApplicationController
+    def index
+      @results = Kommandant::Command.search(params[:query])
+
+      unless Kommandant.config.admin_only_filter_lambda.present? && Kommandant.config.admin_only_filter_lambda.call(current_user, current_admin)
+        @results.reject!(&:admin_only?)
+      end
+    end
+
+    def new
+    end
+  end
+end

data/app/models/kommandant/command.rb

@@ -0,0 +1,88 @@
+module Kommandant
+  class Command
+    class << self
+      def reindex!
+        index.add_documents(
+          JSON.parse(File.read(Kommandant.config.commands_path))
+        )
+      end
+
+      def search(query)
+        result = index.search(query)["hits"]
+
+        result.map do |command|
+          new(**command.symbolize_keys)
+        end
+      end
+
+      def find(id)
+        search(id).find { |command| command.id == id }
+      end
+
+      def all
+        JSON.parse(File.read(Kommandant.config.commands_path)).map do |hash|
+          Kommandant::Command.new(**hash.symbolize_keys)
+        end
+      end
+
+      def index
+        client.index("commands")
+      end
+
+      def client
+        MeiliSearch::Rails.client
+      end
+    end
+
+    def initialize(id:, icon:, path:, http_method:, resource_class: nil, redirect_path: nil, text_keys: [], admin_only: false, translations: {})
+      @id = id
+      @icon = icon
+      @path = path
+      @http_method = http_method
+      @resource_class = resource_class
+      @redirect_path = redirect_path
+      @text_keys = text_keys
+      @admin_only = admin_only
+      @translator = I18n::Backend::KeyValue.new({})
+      translations.each_pair do |locale, data|
+        @translator.store_translations(locale, data)
+      end
+    end
+
+    def ==(other)
+      instance_variables.all? do |ivar|
+        instance_variable_get(ivar) == other.instance_variable_get(ivar)
+      end
+    end
+
+    attr_reader :id, :path, :http_method, :resource_class, :redirect_path, :text_keys, :translator
+
+    def name
+      return "no translation for #{I18n.locale}.name in Meilisearch" unless translator.exists?(I18n.locale, "name")
+
+      translator.translate(I18n.locale, "name")
+    end
+
+    def placeholder
+      return unless translator.exists?(I18n.locale, "placeholder")
+
+      translator.translate(I18n.locale, "placeholder")
+    end
+
+    def admin_only?
+      admin_only
+    end
+
+    def icon?
+      icon.present?
+    end
+
+    def icon
+      @icon.to_s.dasherize
+    end
+
+    private
+
+    attr_reader :admin_only
+  end
+end

data/app/models/kommandant/commands/search_result.rb

@@ -0,0 +1,44 @@
+module Kommandant
+  class Commands::SearchResult
+    def initialize(command:, resource:)
+      @command = command
+      @resource = resource
+      @translator = command.translator
+    end
+
+    attr_reader :resource
+    delegate :icon, to: :command
+
+    def name
+      if translator.exists?(I18n.locale, "result_text")
+        translation_attributes = {}
+        command.text_keys.each do |key|
+          translation_attributes[key.to_sym] = indexed_attribute_for(resource, key)
+        end
+        translator.translate(I18n.locale, "result_text", **translation_attributes)
+      else
+        command.text_keys.map do |text_key|
+          indexed_attribute_for(resource, text_key)
+        end.join(", ")
+      end
+    end
+
+    def path
+      return command.redirect_path.gsub(":id", resource.id.to_s) if command.redirect_path
+
+      "/#{command.resource_class.downcase.pluralize}/#{resource.id}"
+    end
+
+    def http_method
+      :get
+    end
+
+    private
+
+    attr_reader :command, :translator
+
+    def indexed_attribute_for(resource, text_key)
+      resource.meilisearch_settings.get_attributes(resource)[text_key]
+    end
+  end
+end

data/app/views/kommandant/commands/searches/show.html.erb

@@ -0,0 +1,69 @@
+<%= turbo_frame_tag :command_palette do %>
+  <div data-command-palette-target="content">
+    <div class="kommandant-flex kommandant-px-4">
+      <div class="kommandant-flex kommandant-items-center kommandant-space-x-1 kommandant-text-gray-400">
+        <%= link_to(Kommandant::Engine.routes.url_helpers.searches_path, class: "kommandant-inline-flex kommandant-items-center kommandant-space-x-2 kommandant-border kommandant-shadow-sm kommandant-font-medium kommandant-rounded-md focus:kommandant-outline-none focus:kommandant-ring-2 focus:kommandant-ring-offset-2 disabled:kommandant-opacity-50 disabled:kommandant-cursor-not-allowed kommandant-border-gray-300 kommandant-text-gray-700 kommandant-bg-white hover:kommandant-bg-gray-50 hover:kommandant-cursor-pointer focus:kommandant-ring-gray-500 kommandant-text-xs kommandant-px-2.5 kommandant-py-1.5") do %>
+          <span><%= @command.name %></span>
+        <% end %>
+
+        <%= render "kommandant/shared/icons/chevron_right" %>
+      </div>
+
+      <%= form_with url: Kommandant::Engine.routes.url_helpers.command_searches_path(@command.id), method: :get, class: "kommandant-flex-grow" do |form| %>
+        <%= form.text_field :query, class: "kommandant-h-12 kommandant-w-full kommandant-border-0 kommandant-bg-transparent kommandant-pl-1 kommandant-pr-4 kommandant-text-gray-800 kommandant-placeholder-gray-400 focus:kommandant-ring-0 sm:kommandant-text-sm", value: params[:query], placeholder: @command.placeholder, autocomplete: "off", data: {command_palette_target: "input", action: "keyup->command-palette#submit"} %>
+      <% end %>
+    </div>
+
+    <% if @results.any? %>
+      <ul class="kommandant-overflow-y-auto kommandant-p-2 kommandant-text-sm kommandant-text-gray-700">
+        <% @results.each do |result| %>
+          <%# TODO: How about a default? %>
+          <% if partial_exists_for_result?(result) %>
+            <%= render result.resource, result: result %>
+          <% else %>
+            <%= render "kommandant/shared/command_palette/result", result: result %>
+          <% end %>
+        <% end %>
+      </ul>
+
+      <% if Kommandant.config.pagination.enabled %>
+        <div class="kommandant-px-4 kommandant-py-2 kommandant-flex kommandant-justify-between kommandant-items-baseline">
+          <span class="text-sm"><%= @pagination_info_label %></span>
+
+          <div class="kommandant-space-x-4">
+            <%= link_to(t("kommandant.pagination.prev"), Kommandant::Engine.routes.url_helpers.command_searches_path(@command.id, page: @pagination.prev, query: @query), class: "kommandant-font-medium kommandant-text-sm kommandant-text-gray-600 hover:kommandant-text-gray-800", data: {command_palette_target: "previousPageLink"}) if @pagination.prev %>
+            <%= link_to(t("kommandant.pagination.next"), Kommandant::Engine.routes.url_helpers.command_searches_path(@command.id, page: @pagination.next, query: @query), class: "kommandant-font-medium kommandant-text-sm kommandant-text-gray-600 hover:kommandant-text-gray-800", data: {command_palette_target: "nextPageLink"}) if @pagination.next %>
+          </div>
+        </div>
+      <% end %>
+    <% else %>
+      <%= render "kommandant/shared/command_palette/empty_state", query: params[:query] %>
+    <% end %>
+  </div>
+
+  <%= render "kommandant/shared/command_palette/loading_message" %>
+
+  <% if Kommandant.config.pagination.enabled && @pagination.pages > 1 %>
+    <div class="kommandant-flex kommandant-justify-end kommandant-items-center kommandant-divide-x kommandant-bg-gray-50 kommandant-py-2.5 kommandant-px-4 kommandant-text-xs kommandant-text-gray-700">
+      <div class="kommandant-pr-2 kommandant-flex kommandant-flex-wrap kommandant-justify-end kommandant-items-center kommandant-space-x-2">
+        <span><%= t("kommandant.pagination.prev").html_safe %>:</span>
+        
+        <div class="kommandant-flex kommandant-items-center kommandant-space-x-1">
+          <kbd class="kommandant-px-1 kommandant-py-0.5 kommandant-rounded kommandant-border kommandant-border-gray-400 kommandant-bg-white kommandant-font-semibold kommandant-text-gray-900">Ctrl</kbd>
+          <span>+</span>
+          <kbd class="kommandant-px-1 kommandant-py-0.5 kommandant-rounded kommandant-border kommandant-border-gray-400 kommandant-bg-white kommandant-font-semibold kommandant-text-gray-900">J</kbd>
+        </div>
+      </div>
+
+      <div class="kommandant-pl-2 kommandant-flex kommandant-flex-wrap kommandant-justify-end kommandant-items-center kommandant-space-x-2">
+        <span><%= t("kommandant.pagination.next").html_safe %>:</span>
+        
+        <div class="kommandant-flex kommandant-items-center kommandant-space-x-1">
+          <kbd class="kommandant-px-1 kommandant-py-0.5 kommandant-rounded kommandant-border kommandant-border-gray-400 kommandant-bg-white kommandant-font-semibold kommandant-text-gray-900">Ctrl</kbd>
+          <span>+</span>
+          <kbd class="kommandant-px-1 kommandant-py-0.5 kommandant-rounded kommandant-border kommandant-border-gray-400 kommandant-bg-white kommandant-font-semibold kommandant-text-gray-900">L</kbd>
+        </div>
+      </div>
+    </div>
+  <% end %>
+<% end %>

data/app/views/kommandant/commands/show.html.erb

@@ -0,0 +1,20 @@
+<%= turbo_frame_tag :command_palette do %>
+  <div data-command-palette-target="content">
+    <div class="kommandant-flex kommandant-px-4">
+      <div class="kommandant-flex kommandant-items-center kommandant-space-x-1 kommandant-text-gray-400">
+        <%= link_to(Kommandant::Engine.routes.url_helpers.searches_path, class: "kommandant-inline-flex kommandant-items-center kommandant-space-x-2 kommandant-border kommandant-shadow-sm kommandant-font-medium kommandant-rounded-md focus:kommandant-outline-none focus:kommandant-ring-2 focus:kommandant-ring-offset-2 disabled:kommandant-opacity-50 disabled:kommandant-cursor-not-allowed kommandant-border-gray-300 kommandant-text-gray-700 kommandant-bg-white hover:kommandant-bg-gray-50 hover:kommandant-cursor-pointer focus:kommandan
+        tring-gray-500 kommandant-text-xs kommandant-px-2.5 kommandant-py-1.5") do %>
+          <span><%= @command.name %></span>
+        <% end %>
+
+        <%= render "kommandant/shared/icons/chevron_right" %>
+      </div>
+
+      <%= form_with url: Kommandant::Engine.routes.url_helpers.command_searches_path(@command.id), method: :get, class: "kommandant-flex-grow" do |form| %>
+        <%= form.text_field :query, class: "kommandant-h-12 kommandant-w-full kommandant-border-0 kommandant-bg-transparent kommandant-pl-1 kommandant-pr-4 kommandant-text-gray-800 kommandant-placeholder-gray-400 focus:kommandant-ring-0 sm:kommandant-text-sm", value: @query, placeholder: @command.placeholder, autocomplete: "off", data: {command_palette_target: "input", action: "keyup->command-palette#submit"} %>
+      <% end %>
+    </div>
+  </div>
+  
+  <%= render "kommandant/shared/command_palette/loading_message" %>
+<% end %>

data/app/views/kommandant/searches/index.html.erb

@@ -0,0 +1 @@
+<%= render "kommandant/shared/command_palette", results: @results, query: params[:query] %>

data/app/views/kommandant/searches/new.html.erb

@@ -0,0 +1 @@
+<%= render "kommandant/shared/command_palette", recent_commands: @recent_commands %>

data/app/views/kommandant/shared/_command_palette.html.erb

@@ -0,0 +1,53 @@
+<div class="kommandant-relative kommandant-z-50" role="dialog" aria-modal="true" data-action="click->command-palette#hideWithBackgroundOverlay keydown.ctrl+l->command-palette#nextPage keydown.ctrl+j->command-palette#previousPage keydown.meta+l->command-palette#nextPage keydown.meta+j->command-palette#previousPage">
+  <div class="hidden kommandant-fixed kommandant-inset-0 kommandant-bg-gray-500 kommandant-bg-opacity-25 kommandant-transition-opacity"  
+    data-command-palette-target="background"
+    data-transition-enter="kommandant-ease-out kommandant-duration-300"
+    data-transition-enter-start="kommandant-opacity-0"
+    data-transition-enter-end="kommandant-opacity-100"
+    data-transition-leave="kommandant-ease-in kommandant-duration-200"
+    data-transition-leave-start="kommandant-opacity-100"
+    data-transition-leave-end="kommandant-opacity-0">
+  </div>
+
+  <div class="hidden kommandant-fixed kommandant-inset-0 kommandant-z-10 kommandant-overflow-y-auto kommandant-p-4 sm:kommandant-p-6 md:kommandant-p-20"
+    data-command-palette-target="panel"
+    data-transition-enter="kommandant-ease-out kommandant-duration-300"
+    data-transition-enter-start="kommandant-opacity-0 kommandant-scale-95"
+    data-transition-enter-end="kommandant-opacity-100 kommandant-scale-100"
+    data-transition-leave="kommandant-ease-in kommandant-duration-200"
+    data-transition-leave-start="kommandant-opacity-100 kommandant-scale-100"
+    data-transition-leave-end="kommandant-opacity-0 kommandant-scale-95">
+    
+    <div class="kommandant-mx-auto kommandant-max-w-2xl kommandant-transform kommandant-divide-y kommandant-divide-gray-100 kommandant-overflow-hidden kommandant-rounded-xl kommandant-bg-white kommandant-shadow-2xl kommandant-ring-1 kommandant-ring-black kommandant-ring-opacity-5 kommandant-transition-all">
+      <%= turbo_frame_tag :command_palette do %>
+        <div data-command-palette-target="content">
+          <div class="kommandant-relative">
+            <div class="kommandant-pointer-events-none kommandant-absolute kommandant-top-3 kommandant-left-4 kommandant-text-gray-400">
+              <%= render "kommandant/shared/icons/search" %>
+            </div>
+            <%= form_with url: Kommandant::Engine.routes.url_helpers.searches_path, method: :get do |form| %>
+              <%= form.text_field :query, value: local_assigns[:query], class: "kommandant-h-12 kommandant-w-full kommandant-border-0 kommandant-bg-transparent kommandant-pl-11 kommandant-pr-4 kommandant-text-gray-800 kommandant-placeholder-gray-400 focus:kommandant-ring-0 sm:kommandant-text-sm", placeholder: t(".input_placeholder"), autocomplete: "off", data: {command_palette_target: "input", action: "keyup->command-palette#submit"} %>
+            <% end %>
+          </div>
+          <% if local_assigns[:results] %>
+            <% if local_assigns[:results].empty? && local_assigns[:query] %>
+              <%= render "kommandant/shared/command_palette/empty_state", query: query %>
+            <% elsif local_assigns[:results].any? %>
+              <!-- Results, show/hide based on command palette state. -->
+              <ul class="kommandant-max-h-96 kommandant-overflow-y-auto kommandant-p-2 kommandant-text-sm kommandant-text-gray-700">
+                <% local_assigns[:results].each do |result| %>
+                  <%= render "kommandant/shared/command_palette/command", command: result %>
+                <% end %>
+              </ul>
+            <% end %>
+          <% else %>
+            <%= render "kommandant/shared/command_palette/default_state", recent_commands: local_assigns[:recent_commands] %>
+          <% end %>
+        </div>
+        
+        <%= render "kommandant/shared/command_palette/loading_message" %>
+      <% end %>
+    </div>
+  </div>
+</div>
+

data/app/views/kommandant/shared/command_palette/_command.html.erb

@@ -0,0 +1,14 @@
+<li>
+  <%= link_to command.path, class: "kommandant-group kommandant-cursor-default kommandant-select-none kommandant-flex kommandant-items-center kommandant-px-3 kommandant-py-2 kommandant-rounded-md data-[active=true]:kommandant-bg-slate-600 data-[active=true]:kommandant-text-white group-data-[active=true]:kommandant-outline-none", data: {active: false, keyboard_navigation_target: "focusable", action: "mouseenter->keyboard-navigation#focus click->command-palette#showLoadingMessage", turbo_method: command.http_method} do %>
+    <% if command.icon? %>
+      <!-- For some reason the line below works, but the uncommented line does not color the icon... I have no idea why... -->
+      <!-- <div class="kommandant-flex-none kommandant-text-gray-400 group-data-[active=true]:text-white"> -->
+      <div class="kommandant-flex-none kommandant-text-gray-400 group-data-[active=true]:kommandant-text-white">
+        <%= render "kommandant/shared/icons/command", icon: command.icon %>
+      </div>
+    <% end %>
+  
+    <span class="kommandant-ml-3 kommandant-flex-auto kommandant-truncate"><%= command.name %></span>
+    <span class="kommandant-ml-3 kommandant-hidden group-data[active=true]:kommandant-inline kommandant-flex-none kommandant-text-indigo-100"><%= t("kommandant.navigation.jump_to") %></span>
+  <% end %>
+</li>

data/app/views/kommandant/shared/command_palette/_default_state.html.erb

@@ -0,0 +1,14 @@
+<% if local_assigns[:recent_commands] %>
+  <ul class="kommandant-max-h-80 kommandant-scroll-py-2 kommandant-divide-y kommandant-divide-gray-100 kommandant-overflow-y-auto">
+    <% if recent_commands.any? %>
+      <li class="kommandant-p-2">
+        <h2 class="kommandant-mt-4 kommandant-mb-2 kommandant-px-3 kommandant-text-xs kommandant-font-semibold kommandant-text-gray-500"><%= t(".recent_commands") %></h2>
+        <ul class="kommandant-text-sm kommandant-text-gray-700">
+          <% recent_commands.each do |command| %>
+            <%= render "kommandant/shared/command_palette/command", command: command %>
+          <% end %>
+        </ul>
+      </li>
+    <% end %>
+  </ul>
+<% end %>

data/app/views/kommandant/shared/command_palette/_empty_state.html.erb

@@ -0,0 +1,7 @@
+<div class="kommandant-py-14 kommandant-px-6 kommandant-text-center sm:kommandant-px-14">
+  <span class="kommandant-p-2 kommandant-shadow-sm kommandant-inline-flex kommandant-items-center kommandant-justify-center kommandant-text-xs kommandant-leading-5 kommandant-font-semibold kommandant-rounded-full kommandant-flex-shrink-0 kommandant-h-10 kommandant-w-10 kommandant-bg-slate-700 kommandant-text-white">
+    <%= render "kommandant/shared/icons/search" %>
+  </span>
+
+  <p class="kommandant-mt-4 kommandant-text-sm kommandant-text-gray-900"><%= t(".text") %> <span class="kommandant-font-medium"><%= query %></span></p>
+</div>

data/app/views/kommandant/shared/command_palette/_loading_message.html.erb

@@ -0,0 +1,7 @@
+<div data-command-palette-target="loadingMessage" class="hidden">
+  <div class="kommandant-flex kommandant-items-center kommandant-space-x-2 kommandant-px-4 kommandant-h-12">
+    <%= render "kommandant/shared/icons/spinner" %>
+
+    <p class="kommandant-text-sm kommandant-font-medium kommandant-text-gray-700"><%= t(".text") %></p>
+  </div>
+</div>

data/app/views/kommandant/shared/command_palette/_result.html.erb

@@ -0,0 +1,6 @@
+<li>
+  <%= link_to result.path, data: {active: false, keyboard_navigation_target: "focusable", action: "mouseenter->keyboard-navigation#focus click->command-palette#showLoadingMessage", turbo_method: result.http_method, turbo_frame: "_top"}, class: "kommandant-group kommandant-cursor-default kommandant-select-none kommandant-flex kommandant-items-center kommandant-px-3 kommandant-py-2 kommandant-rounded-md data-[active=true]:kommandant-bg-slate-600 data-[active=true]:kommandant-text-white group-data-[active=true]:kommandant-outline-none" do %>
+    <span class="kommandant-ml-3 kommandant-flex-auto kommandant-truncate"><%= result.name %></span>
+    <span class="kommandant-ml-3 kommandant-hidden group-data-[active=true]:kommandant-inline kommandant-flex-none kommandant-text-indigo-100"><%= t("kommandant.navigation.jump_to") %></span>
+  <% end %>
+</li>

data/app/views/kommandant/shared/icons/_chevron_right.html.erb

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="kommandant-w-6 kommandant-h-6">
+  <path fill-rule="evenodd" d="M16.28 11.47a.75.75 0 010 1.06l-7.5 7.5a.75.75 0 01-1.06-1.06L14.69 12 7.72 5.03a.75.75 0 011.06-1.06l7.5 7.5z" clip-rule="evenodd" />
+</svg>

data/app/views/kommandant/shared/icons/_command.erb

@@ -0,0 +1,7 @@
+<div class="kommandant-flex kommandant-space-x-2">
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="kommandant-w-5 kommandant-h-5">
+    <path fill-rule="evenodd" d="M8.485 2.495c.673-1.167 2.357-1.167 3.03 0l6.28 10.875c.673 1.167-.17 2.625-1.516 2.625H3.72c-1.347 0-2.189-1.458-1.515-2.625L8.485 2.495zM10 5a.75.75 0 01.75.75v3.5a.75.75 0 01-1.5 0v-3.5A.75.75 0 0110 5zm0 9a1 1 0 100-2 1 1 0 000 2z" clip-rule="evenodd" />
+  </svg>
+
+  <span><%= t(".icon_missing", icon_name: icon) %></span>
+</div>

data/app/views/kommandant/shared/icons/_search.erb

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="kommandant-w-5 kommandant-h-5">
+  <path fill-rule="evenodd" d="M9 3.5a5.5 5.5 0 100 11 5.5 5.5 0 000-11zM2 9a7 7 0 1112.452 4.391l3.328 3.329a.75.75 0 11-1.06 1.06l-3.329-3.328A7 7 0 012 9z" clip-rule="evenodd" />
+</svg>

data/app/views/kommandant/shared/icons/_spinner.erb

@@ -0,0 +1,4 @@
+<svg class="kommandant-animate-spin kommandant-h-5 kommandant-w-5 kommandant-text-gray-900" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
+  <circle class="kommandant-opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
+  <path class="kommandant-opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
+</svg>

data/config/locales/da.yml

@@ -0,0 +1,19 @@
+da:
+  kommandant:
+    shared:
+      command_palette:
+        input_placeholder: Søg
+        default_state:
+          recent_commands: Sidst brugte
+        empty_state:
+          text: Vi kunne ikke finde nogen resultater for
+        loading_message:
+          text: Henter...
+      icons:
+        command:
+          icon_missing: Command icon mangler med navn '%{icon_name}'
+    navigation:
+      jump_to: Gå til
+    pagination:
+      prev: Forrige
+      next: Næste

data/config/locales/en.yml

@@ -0,0 +1,19 @@
+en:
+  kommandant:
+    shared:
+      command_palette:
+        input_placeholder: Search
+        default_state:
+          recent_commands: Recently used
+        empty_state:
+          text: No results found for
+        loading_message:
+          text: Loading...
+      icons:
+        command:
+          icon_missing: Command icon missing with name '%{icon_name}'
+    navigation:
+      jump_to: Jump to
+    pagination:
+      prev: Previous
+      next: Next

data/config/routes.rb

@@ -1,2 +1,6 @@
 Kommandant::Engine.routes.draw do
+  resources :searches, only: [:index, :new]
+  resources :commands, only: [:show] do
+    resource :searches, module: :commands, only: [:show]
+  end
 end

data/lib/kommandant/engine.rb

@@ -1,5 +1,12 @@
 module Kommandant
   class Engine < ::Rails::Engine
     isolate_namespace Kommandant
+  
+    PRECOMPILE_ASSETS = %w( kommandant.js )
+    initializer "kommandant.assets" do |app|
+      if Rails.application.config.respond_to?(:assets)
+        Rails.application.config.assets.precompile += PRECOMPILE_ASSETS
+      end
+    end
   end
 end

data/lib/kommandant/version.rb

@@ -1,3 +1,3 @@
 module Kommandant
-  VERSION = "0.1.0"
+  VERSION = "0.2.1"
 end

data/lib/kommandant.rb

@@ -1,6 +1,26 @@
 require "kommandant/version"
 require "kommandant/engine"
+require "meilisearch-rails"
+require "dry-configurable"
 
 module Kommandant
-  # Your code goes here...
+  extend Dry::Configurable
+
+  setting :commands_path, default: "config/kommandant/commands.json"
+  setting :search_result_filter_lambda
+  setting :admin_only_filter_lambda
+  setting :parent_controller, default: "::ApplicationController"
+  setting :current_user_method, default: "current_user"
+  setting :recent_commands do
+    setting :enabled, default: true
+  end
+  setting :pagination do
+    setting :enabled, default: true
+    setting :items_per_page, default: 10
+    setting :pagination_lambda, default: ->(results, items, controller) { controller.send(:pagy_array, results, items: items) }
+    setting :info_label_lambda, default: ->(pagination, controller) { controller.send(:pagy_info, pagination).html_safe }
+    setting :module, default: "Pagy::Frontend"
+  end
+
+  autoload :Command, "kommandant/command"
 end

data/vendor/assets/javascripts/command_palette.js

@@ -0,0 +1,120 @@
+import { Controller } from "@hotwired/stimulus"
+import { enter, leave, toggle } from "./transition"
+
+export default class extends Controller {
+  static targets = ["background", "panel", "input", "content", "loadingMessage", "previousPageLink", "nextPageLink"]
+  static values = {
+    open: { type: Boolean, default: false },
+    loadingMessageDelay: { type: Number, default: 100 },
+    animationDuration: { type: Number, default: 200 },
+    modifierKeyDown: { type: Boolean, default: false }
+  }
+
+  initialize() {
+    this.submit = this.debounce(this.submit, 500).bind(this);
+  }
+
+  toggle(event) {
+    event.preventDefault()
+
+    toggle(this.backgroundTarget)
+    toggle(this.panelTarget)
+    this.openValue = !this.openValue
+  }
+
+  show(event) {
+    event.preventDefault()
+
+    enter(this.backgroundTarget)
+    enter(this.panelTarget)
+    this.openValue = true
+  }
+
+  hide(event) {
+    event.preventDefault()
+
+    leave(this.backgroundTarget)
+    leave(this.panelTarget)
+    this.openValue = false
+  }
+
+  hideWithBackgroundOverlay(event) {
+    if (event.target === this.panelTarget) {
+      this.hide(event)
+    }
+  }
+
+  submit(event) {
+    const ignoreKeys = ["Enter", "Tab", "Escape", "ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight", "Home", "End", "Alt", "Control", "Meta", "Shift"]
+    const modifierKeyPressed = event.ctrlKey || event.metaKey
+
+    if (!modifierKeyPressed && !ignoreKeys.includes(event.key) && this.inputTarget.value !== "") {
+      this.inputTarget.form.requestSubmit()
+    }
+  }
+
+  reset() {
+    setTimeout(() => {
+      Turbo.visit("/kommandant/searches/new", { frame: "command_palette" })
+    }, this.animationDurationValue)
+  }
+
+  showLoadingMessage() {
+    this.loadingTimeout = setTimeout(() => {
+      this.contentTarget.classList.add("hidden")
+      this.loadingMessageTarget.classList.remove("hidden")
+    }, this.loadingMessageDelayValue)
+  }
+
+  nextPage(event) {
+    event.preventDefault()
+
+    if (this.hasNextPageLinkTarget) {
+      this.nextPageLinkTarget.click()
+    }
+  }
+
+  previousPage(event) {
+    event.preventDefault()
+
+    if (this.hasPreviousPageLinkTarget) {
+      this.previousPageLinkTarget.click()
+    }
+  }
+
+  // Private
+
+  openValueChanged(value, previousValue) {
+    this.focusInputTarget()
+
+    if (value === false && previousValue !== undefined) {
+      this.reset()
+    }
+  }
+
+  inputTargetConnected() {
+    this.focusInputTarget()
+    clearTimeout(this.loadingTimeout)
+  }
+
+  focusInputTarget() {
+    if (this.openValue) {
+      this.inputTarget.focus()
+
+      // Set cursor at end of inputted text
+      let temp = this.inputTarget.value
+      this.inputTarget.value = ""
+      this.inputTarget.value = temp
+    }
+  }
+
+  debounce(func, delay) {
+    let timeoutId;
+    return function (...args) {
+      clearTimeout(timeoutId);
+      timeoutId = setTimeout(() => {
+        func.apply(this, args);
+      }, delay);
+    };
+  }
+}