oversee 0.3.0 → 0.3.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: c31a8c277449dfaec238f66cfc8e404a64c51dff4beef1a944fee85c5935991c
-  data.tar.gz: f3fcd62d4ff3184f5b9f97273c2269e986b5f03736a9961440aca242b38a1292
+  metadata.gz: 82a5bb3d0823ed6874fe8b7bb09934ed3b72b7b9a2964da6c6d8cdd7b82ac28a
+  data.tar.gz: 5ddf616584c7319a2ef611227fb4f5e0cf876c1dc20b1228c47330411715054c
 SHA512:
-  metadata.gz: ad42840ab6b72667e5e16853cea4d9028fc1356fd4ff2ec7d3909b6102c2fc80dca9287245ad4ab62021181c238beae371f77b473f1f9464bf0b1162a29946c5
-  data.tar.gz: 229f928f44cfe6d6535cd8ef6682472a9f5ecf59e29bc65714ed71e1c6147ab48b582e5c065fc1e9233d5e536155e16d8750a1fc92f3e74bd97e3720cbc58e42
+  metadata.gz: 16cf0583966c0f07deae2be76299544a4fb5678efc5345a292acc0ad628d263a979b44e2d60f8749cc87bbfd5471eb85cfe5619fdc58af5bedb8b9e5a0efe755
+  data.tar.gz: f0d8ae31255ca03aecb010393356d55a9ac63b99699b50b8c9b6bae8d6c11c8f1d3b876dcd6fe9c9118e19c6015989f45f3e7ed74eadb259e885007eb215e764

data/README.md

@@ -1,10 +1,14 @@
-
 # Oversee
 
-Plug & play admin dashboard for Rails applications.
+Plug & play content management system (CMS) for Rails applications. Some may call it an admin dashboard too.
 
+<a href="https://rubygems.org/gems/oversee">
+  <img alt="Oversee GEM Version" src="https://img.shields.io/gem/v/oversee?color=10b981&include_prereleases&logo=ruby&logoColor=f43f5e">
+</a>
 
-[![Gem Version](https://badge.fury.io/rb/oversee.svg)](https://badge.fury.io/rb/oversee)
+<a href="https://rubygems.org/gems/oversee">
+  <img alt="Oversee GEM Version" src="https://img.shields.io/gem/dt/oversee?color=10b981&include_prereleases&logo=ruby&logoColor=f43f5e">
+</a>
 
 ---
 
@@ -35,6 +39,7 @@ $ bundle add oversee
 
 > [!TIP]
 > Currently, we don't release new gem versions too often due to the fragile nature of the gem. However, you can use the edge version of the gem by pointing directly to the git repository.
+>
 > ```ruby
 > gem "oversee", git: "https://github.com/primevise/oversee", branch: :main
 > ```

data/app/components/oversee/dashboard/actions.rb

@@ -0,0 +1,58 @@
+class Oversee::Dashboard::Actions < Oversee::Base
+  def initialize(params: nil)
+    @params = params
+  end
+
+  def view_template(&)
+    div(class: "flex items-center justify-between") do
+      div(class: "flex items-center gap-2") do
+        if show_action_section?
+          button(
+            class:"rounded-full bg-gray-100 inline-flex gap-2 items-center text-xs px-4 py-2 font-medium hover:bg-gray-200",
+            data: { controller: "reveal", action: "reveal#toggle", reveal_revealable_id_value: "oversee-filters" }
+          ) do
+            render Phlex::Icons::Iconoir::FilterAlt.new(class: "size-3")
+            plain "Filters"
+          end
+        end
+        if false
+          a(class:"rounded-full bg-gray-100 inline-flex gap-2 items-center text-xs px-4 py-2 font-medium hover:bg-gray-200") do
+            render Phlex::Icons::Iconoir::XMark.new(class: "size-4 text-gray-500")
+            plain "Clear sorting"
+          end
+        end
+      end
+      div(class: "flex items-center gap-4") do
+        form(action: "", class: "flex items-center gap-2") do
+          input(
+            type: :search,
+            name: :query,
+            value: @params[:query],
+            placeholder: search_placeholder,
+            class: "flex bg-gray-100 min-w-64 w-64 focus:w-96 transition-all h-10 items-center pl-4 py-2 placeholder:text-gray-500 rounded-sm text-sm"
+          )
+          button(class: "size-10 inline-flex items-center justify-center bg-gray-100 hover:bg-gray-200 transition-colors") { render Phlex::Icons::Iconoir::Search.new(class: "size-4 text-gray-600") }
+        end
+      end
+    end
+    render Oversee::Dashboard::Filters.new if show_action_section?
+  end
+
+  private
+
+  def show_action_section?
+    Rails.env.development? || @params[:experimental] == "true"
+  end
+
+  def sortless_path
+    sortless_query_params = @params.except(:sort_attribute, :sort_direction, :controller, :action)
+    # helpers.resources_path(sortless_query_params)
+  end
+
+  def search_placeholder
+    context = Oversee::Search.new(collection: nil, resource_class: @params[:resource_class_name].constantize)
+    attr = context.default_searchable_attribute
+
+    "Search by #{attr}"
+  end
+ end

data/app/components/oversee/dashboard/filter.rb

@@ -0,0 +1,12 @@
+# frozen_string_literal: true
+class Oversee::Dashboard::Filter < Oversee::Base
+  def view_template
+    div(class: "flex items-center gap-2") do
+      render Phlex::Icons::Iconoir::LongArrowDownRight.new(class: "size-4 text-gray-500")
+      form(action: "", class: "flex items-center gap-2") do
+        input(type: :text, placeholder: "Title [EQ]", name: "filters[title][eq][]", class: "bg-gray-100 px-4 py-2 text-xs")
+        button(type: :submit, class: "button", class: "bg-gray-900 text-white px-4 py-2 text-xs font-medium") { plain "Apply" }
+      end
+    end
+  end
+end

data/app/components/oversee/dashboard/filters.rb

@@ -1,58 +1,8 @@
+# frozen_string_literal: true
 class Oversee::Dashboard::Filters < Oversee::Base
-  def initialize(params: nil)
-
-    @params = params
-
-    puts "params: #{params}"
-    puts "sortless_path: #{sortless_path}"
-  end
-
-  def view_template(&)
-    div(class: "flex items-center justify-between") do
-      div(class: "flex items-center gap-2") do
-        if show_action_section?
-          button(class:"rounded-full bg-gray-100 inline-flex gap-2 items-center text-xs px-4 py-2 font-medium hover:bg-gray-200") do
-            render Phlex::Icons::Iconoir::FilterAlt.new(class: "size-3")
-            plain "Filters"
-          end
-        end
-        if false
-          a(class:"rounded-full bg-gray-100 inline-flex gap-2 items-center text-xs px-4 py-2 font-medium hover:bg-gray-200") do
-            render Phlex::Icons::Iconoir::XMark.new(class: "size-4 text-gray-500")
-            plain "Clear sorting"
-          end
-        end
-      end
-      div(class: "flex items-center gap-4") do
-        form(action: "", class: "flex items-center gap-2") do
-          input(
-            type: :search,
-            name: :query,
-            value: @params[:query],
-            placeholder: search_placeholder,
-            class: "flex bg-gray-100 min-w-64 w-64 focus:w-96 transition-all h-10 items-center pl-4 py-2 placeholder:text-gray-500 rounded-sm text-sm"
-          )
-          button(class: "size-10 inline-flex items-center justify-center bg-gray-100 hover:bg-gray-200 transition-colors") { render Phlex::Icons::Iconoir::Search.new(class: "size-4 text-gray-600") }
-        end
-      end
+  def view_template
+    div(id: :oversee_filters, class: "hidden pt-4 mt-4 border-t flex flex-col gap-2") do
+      render Oversee::Dashboard::Filter.new
     end
   end
-
-  private
-
-  def show_action_section?
-    Rails.env.development? || @params[:experimental] == "true"
-  end
-
-  def sortless_path
-    sortless_query_params = @params.except(:sort_attribute, :sort_direction, :controller, :action)
-    # helpers.resources_path(sortless_query_params)
-  end
-
-  def search_placeholder
-    context = Oversee::Search.new(collection: nil, resource_class: @params[:resource_class_name].constantize)
-    attr = context.default_searchable_attribute
-
-    "Search by #{attr}"
-  end
- end
+end

data/app/components/oversee/field/display.rb

@@ -1,38 +1,20 @@
-class Oversee::Field::Display < Oversee::Base
-
-  attr_reader :resource
-  attr_reader :key
-  attr_reader :value
-  attr_reader :datatype
-
-  def initialize(resource:, key: nil, value: nil, datatype: :string, **options)
-    @resource = resource
-    @key = key
-    @value = value
-    @datatype = datatype
-    @options = options
-  end
-
+class Oversee::Field::Display < Oversee::Field
   def view_template
     html_tag(
       id: dom_id(resource, key),
       href: helpers.resource_input_path(resource_class_name:, key:, datatype:),
-      class: "bg-gray-100 h-10 flex items-center px-4 py-2 hover:bg-gray-200 transition-colors w-full cursor-pointer",
+      title: key.to_s.titleize,
+      class: "bg-gray-100 h-10 flex items-center justify-between px-4 py-2 hover:bg-gray-200 transition-colors w-full cursor-pointer group",
       data: { turbo_stream: true }
     ) do
       render Oversee::Field::Value.new(key:, value:, datatype:, **@options)
+      render Phlex::Icons::Iconoir::Edit.new(class: "text-gray-500 size-4 opacity-0 group-hover:opacity-100 transition-opacity", stroke_width: 1.75)
     end
   end
 
   private
 
-  def resource_class_name
-    @resource_class_name ||= @resource.class.name
-  end
-
-  def html_tag(...)
-    edittable? ? a(...) : div(...)
-  end
-
   def edittable? = @options[:edittable] || true
+
+  def html_tag(...) = edittable? ? a(...) : div(...)
 end

data/app/components/oversee/field/form.rb

@@ -1,30 +1,17 @@
-class Oversee::Field::Form < Oversee::Base
+class Oversee::Field::Form < Oversee::Field
   include Phlex::Rails::Helpers::FormWith
 
-  def initialize(resource:, key: nil, value: nil, datatype: :string, method: :patch, **options)
-    @resource = resource
-    @key = key
-    @value = value
-    @datatype = datatype
-    @method = method
-    @options = options
-  end
-
   def view_template
-    form_with(id: dom_id(@resource, @key), model: @resource, url: helpers.update_resource_path(resource_class_name: resource_class_name, id: @resource.id), method: @method, class: "flex items-center w-full gap-4") do |form|
+    form_with(id: field_form_id, model: resource, url: helpers.update_resource_path(resource_class_name: resource_class_name, id: @resource.id), method: @method, class: "flex items-center w-full gap-4") do |form|
       input type: :hidden, id: "oversee_key", name: "oversee_key", value: @key.to_s
       input type: :hidden, id: "oversee_datatype", name: "oversee_datatype", value: @datatype
       render Oversee::Field::Input.new(key: @key, value: @value, datatype: @datatype, **@options)
-      button(class:"h-9 bg-gray-900 hover:bg-gray-700 text-white inline-flex items-center cursor-pointer gap-2 px-4 rounded-full text-xs font-medium") {
-        render Phlex::Icons::Iconoir::Check.new(class: "size-4")
-        plain "Save"
-      }
     end
   end
 
   private
 
-  def resource_class_name
-    @resource.class.name
+  def method
+    @method ||= @options[:method] || :patch
   end
 end

data/app/components/oversee/field/input/belongs_to.rb

@@ -1,22 +1,5 @@
 class Oversee::Field::Input::BelongsTo < Oversee::Field::Input
-  def initialize(key:, value:, **options)
-    @key = key
-    @value = value
-  end
-
   def view_template
-    input type: "text", id: field_id, name: field_name, value: @value, class: "flex border px-4 py-2 text-sm w-full rounded-sm"
-
-    # select(id: field_id, name: field_name, class: "flex w-full border rounded-sm px-4 py-2 text-sm") do
-
-    #   option(value: 1, selected: @value) { "True" }
-    #   option(value: 0, selected: !@value) { "False" }
-    # end
-  end
-
-  private
-
-  def select_values
-
+    input(type: "text", id: field_id, name: field_name, value:, class: "flex border px-4 py-2 text-sm w-full rounded-sm")
   end
 end

data/app/components/oversee/field/input/boolean.rb

@@ -1,13 +1,8 @@
 class Oversee::Field::Input::Boolean < Oversee::Field::Input
-  def initialize(key:, value:)
-    @key = key
-    @value = value
-  end
-
   def view_template
     select(id: field_id, name: field_name, class: "flex w-full border rounded-sm px-4 py-2 text-sm") do
-      option(value: 1, selected: @value) { "True" }
-      option(value: 0, selected: !@value) { "False" }
+      option(value: 1, selected: value) { "True" }
+      option(value: 0, selected: !value) { "False" }
     end
   end
 end

data/app/components/oversee/field/input/date.rb

@@ -0,0 +1,5 @@
+class Oversee::Field::Input::Date < Oversee::Field::Input
+  def view_template
+    input(type: "datetime-local", id: field_id, name: field_name, value: value&.strftime("%Y-%m-%dT%T"), class: "flex w-full border rounded-sm px-4 py-2 text-sm")
+  end
+end

data/app/components/oversee/field/input/datetime.rb

@@ -1,10 +1,5 @@
 class Oversee::Field::Input::Datetime < Oversee::Field::Input
-  def initialize(key:, value:)
-    @key = key
-    @value = value
-  end
-
   def view_template
-    input type: "datetime-local", id: field_id, name: field_name, value: @value&.strftime("%Y-%m-%dT%T"), class: "flex w-full border rounded-sm px-4 py-2 text-sm"
+    input(type: "datetime-local", id: field_id, name: field_name, value: value&.strftime("%Y-%m-%dT%T"), class: "flex w-full border rounded-sm px-4 py-2 text-sm")
   end
 end

data/app/components/oversee/field/input/integer.rb

@@ -1,10 +1,5 @@
 class Oversee::Field::Input::Integer < Oversee::Field::Input
-  def initialize(key:, value:)
-    @key = key
-    @value = value
-  end
-
   def view_template
-    input type: "number", id: field_id, name: field_name, value: @value, class: "flex w-full border rounded-sm px-4 py-2 text-sm"
+    input(type: "number", id: field_id, name: field_name, value:, class: "flex w-full border rounded-sm px-4 py-2 text-sm")
   end
 end

data/app/components/oversee/field/input/json.rb

@@ -0,0 +1,5 @@
+class Oversee::Field::Input::Json < Oversee::Field::Input
+  def view_template
+    textarea(type: "text", id: field_id, name: field_name, class: "flex border px-4 py-2 text-sm w-full rounded-sm") { value.to_s }
+  end
+end

data/app/components/oversee/field/input/rich_text.rb

@@ -1,14 +1,6 @@
 class Oversee::Field::Input::RichText < Oversee::Field::Input
   register_element :trix_editor
 
-  attr_reader :key
-  attr_reader :value
-
-  def initialize(key:, value:)
-    @key = key
-    @value = value
-  end
-
   def view_template
     div do
       input(type: "hidden", id: field_id, name: field_name, value:)

data/app/components/oversee/field/input/string.rb

@@ -1,10 +1,5 @@
 class Oversee::Field::Input::String < Oversee::Field::Input
-  def initialize(key:, value:)
-    @key = key
-    @value = value
-  end
-
   def view_template
-    input type: "text", id: field_id, name: field_name, value: @value, class: "flex border px-4 py-2 text-sm w-full rounded-sm"
+    input(type: "text", id: field_id, name: field_name, value:, class: "flex border px-4 py-2 text-sm w-full rounded-sm")
   end
 end

data/app/components/oversee/field/input.rb

@@ -1,24 +1,20 @@
-class Oversee::Field::Input < Oversee::Base
+class Oversee::Field::Input < Oversee::Field
   MAP = {
     belongs_to: Oversee::Field::Input::BelongsTo,
     boolean: Oversee::Field::Input::Boolean,
+    date: Oversee::Field::Input::Date,
     datetime: Oversee::Field::Input::Datetime,
     enum: Oversee::Field::Input::String,
     integer: Oversee::Field::Input::Integer,
+    json: Oversee::Field::Input::Json,
+    jsonb: Oversee::Field::Input::Json,
     rich_text: Oversee::Field::Input::RichText,
     string: Oversee::Field::Input::String,
     text: Oversee::Field::Input::String,
   }
 
-  def initialize(key: nil, value: nil, datatype: :string, **options)
-    @key = key
-    @value = value
-    @datatype = datatype
-    @options = options
-  end
-
   def view_template
-    render component_class.new(key: @key, value: @value, **@options)
+    render component_class.new(key:, value:, **@options)
   end
 
   private
@@ -29,6 +25,4 @@ class Oversee::Field::Input < Oversee::Base
 
   private
 
-  def field_id = "resource_#{@key.to_s}"
-  def field_name = "resource[#{@key.to_s}]"
 end

data/app/components/oversee/field/label.rb

@@ -1,25 +1,25 @@
-class Oversee::Field::Label < Oversee::Base
+class Oversee::Field::Label < Oversee::Field
   ICON_MAP = {
-    string: Phlex::Icons::Iconoir::Text,
-    text: Phlex::Icons::Iconoir::TextSquare,
-    rich_text: Phlex::Icons::Iconoir::TextSquare,
-    integer: Phlex::Icons::Iconoir::Number0Square,
-    datetime: Phlex::Icons::Iconoir::Calendar,
     boolean: Phlex::Icons::Iconoir::SwitchOn,
     data: Phlex::Icons::Iconoir::Page,
+    date: Phlex::Icons::Iconoir::Calendar,
+    datetime: Phlex::Icons::Iconoir::Calendar,
+    integer: Phlex::Icons::Iconoir::Number0Square,
+    json: Phlex::Icons::Iconoir::CodeBracketsSquare,
+    jsonb: Phlex::Icons::Iconoir::CodeBracketsSquare,
+    rich_text: Phlex::Icons::Iconoir::TextSquare,
+    string: Phlex::Icons::Iconoir::Text,
+    text: Phlex::Icons::Iconoir::TextSquare,
   }
 
-  def initialize(datatype: :string, key: nil)
-    @datatype = datatype
-    @key = key
-  end
-
   def view_template
-    div(id: "#{@key}_label", class:"inline-flex items-center space-x-2") do
-      div(class: "size-5 bg-gray-100 inline-flex items-center justify-center") do
-        render ICON_MAP[@datatype] ? ICON_MAP[@datatype].new(class: "size-3") : ICON_MAP[:data].new(class: "size-3")
-      end
-      label(class: "uppercase text-xs text-gray-700 font-medium block cursor-auto") { @key.to_s.humanize(keep_id_suffix: true) }
+    div(id: "#{key}_label", class:"inline-flex items-center space-x-2") do
+      div(class: "size-5 bg-gray-100 inline-flex items-center justify-center") { render icon.new(class: "size-3") }
+      label(class: "uppercase text-xs text-gray-700 font-medium block cursor-auto", for: key) { key.to_s.humanize(keep_id_suffix: true) }
     end
   end
+
+  def icon
+    ICON_MAP[datatype&.to_sym] || ICON_MAP[:data]
+  end
 end

data/app/components/oversee/field/set.rb

@@ -0,0 +1,36 @@
+# frozen_string_literal: true
+
+class Oversee::Field::Set < Oversee::Field
+  def view_template
+    div(id: dom_id(resource, key), class:"flex flex-col gap-2") do
+      div(class:"flex items-center justify-between h-10 gap-4") do
+        render Oversee::Field::Label.new(key:, datatype:)
+        button(type: :submit, class: "bg-black text-white text-xs font-medium px-6 py-2 hover:opacity-75 transition-opacity", form: field_form_id) { "Save" } if state == :input
+      end
+      div(class: "flex items-center justify-between gap-2") { send("#{state}_state") }
+    end
+  end
+
+  def value_state
+    render Oversee::Field::Display.new(resource:, key:, value:, datatype:, **@options)
+    div(id: dom_id(@resource, :"#{key}_actions")) do
+      button(
+        class: "bg-gray-100 hover:bg-gray-200 text-gray-400 hover:text-blue-500 size-10 aspect-square inline-flex items-center justify-center transition-colors",
+        data: { controller: "clipboard", action: "click->clipboard#copy", clipboard_content_value: value.to_s }
+      ) do
+        span(class: "hidden", data: { clipboard_target: "successIcon"}) { render Phlex::Icons::Iconoir::Check.new(class: "size-4 text-emerald-500", stroke_width: 1.75) }
+        span(data: { clipboard_target: "copyIcon"}) { render Phlex::Icons::Iconoir::Copy.new(class: "size-4", stroke_width: 1.75) }
+      end
+    end
+  end
+
+  def input_state
+    render Oversee::Field::Form.new(resource: @resource, datatype:, key:, value:)
+  end
+
+  private
+
+  def state
+    @state ||= @options[:state] || :value
+  end
+end

data/app/components/oversee/field/value/belongs_to.rb

@@ -1,17 +1,11 @@
-class Oversee::Field::Value::BelongsTo < Phlex::HTML
-  def initialize(key: nil, value: nil, **options)
-    @key = key
-    @value = value
-    @options = options
-  end
-
+class Oversee::Field::Value::BelongsTo < Oversee::Field::Value
   def view_template
-    p(title: @value, class:"inline-flex items-center gap-1") do
+    p(title: value, class:"inline-flex items-center gap-1") do
       if display_key?
-        span { @key.humanize }
+        span { key.humanize }
         span {"|"}
       end
-      span { @value }
+      span { value }
     end
   end
 

data/app/components/oversee/field/value/boolean.rb

@@ -1,50 +1,5 @@
-class Oversee::Field::Value::Boolean < Phlex::HTML
-  def initialize(key: nil, value: nil, kind: :value)
-    @value = value
-  end
-
+class Oversee::Field::Value::Boolean < Oversee::Field::Value
   def view_template
-    @value ? check_icon : x_icon
-  end
-
-  private
-
-  def check_icon
-    svg(
-      stroke_width: "2",
-      viewbox: "0 0 24 24",
-      fill: "none",
-      xmlns: "http://www.w3.org/2000/svg",
-      color: "currentColor",
-      class: "size-4 text-emerald-500"
-    ) do |s|
-      s.path(
-        d: "M5 13L9 17L19 7",
-        stroke: "currentColor",
-        stroke_width: "2",
-        stroke_linecap: "round",
-        stroke_linejoin: "round"
-      )
-    end
-  end
-
-  def x_icon
-    svg(
-      stroke_width: "1.5",
-      viewbox: "0 0 24 24",
-      fill: "none",
-      xmlns: "http://www.w3.org/2000/svg",
-      color: "currentColor",
-      class: "size-4 text-rose-500"
-    ) do |s|
-      s.path(
-        d:
-          "M6.75827 17.2426L12.0009 12M17.2435 6.75736L12.0009 12M12.0009 12L6.75827 6.75736M12.0009 12L17.2435 17.2426",
-        stroke: "currentColor",
-        stroke_width: "1.5",
-        stroke_linecap: "round",
-        stroke_linejoin: "round"
-      )
-    end
+    render value ? Phlex::Icons::Iconoir::Check.new(class: "size-4 text-emerald-500") : Phlex::Icons::Iconoir::Xmark.new(class: "size-4 text-rose-500")
   end
 end

data/app/components/oversee/field/value/date.rb

@@ -0,0 +1,5 @@
+class Oversee::Field::Value::Date < Oversee::Field::Value
+  def view_template
+    time(title: value.to_s) { value&.to_fs(:long) }
+  end
+end

data/app/components/oversee/field/value/datetime.rb

@@ -1,9 +1,5 @@
-class Oversee::Field::Value::Datetime < Phlex::HTML
-  def initialize(key: nil, value: nil, kind: :value)
-    @value = value
-  end
-
+class Oversee::Field::Value::Datetime < Oversee::Field::Value
   def view_template
-    time(title: @value.to_s) { @value&.to_fs(:long) || "N/A" }
+    time(title: value.to_s) { value&.to_fs(:long) || "N/A" }
   end
 end

data/app/components/oversee/field/value/enum.rb

@@ -1,9 +1,5 @@
-class Oversee::Field::Value::Enum < Phlex::HTML
-  def initialize(key: nil, value: nil, kind: :value)
-    @value = value
-  end
-
+class Oversee::Field::Value::Enum < Oversee::Field::Value
   def view_template
-    p(class:"inline-flex px-2 py-1 text-red-500") { @value.to_s }
+    p(class:"inline-flex px-2 py-1 text-red-500") { value.to_s }
   end
 end

data/app/components/oversee/field/value/integer.rb

@@ -1,9 +1,5 @@
-class Oversee::Field::Value::Integer < Phlex::HTML
-  def initialize(key: nil, value: nil, kind: :value)
-    @value = value
-  end
-
+class Oversee::Field::Value::Integer < Oversee::Field::Value
   def view_template
-    p { @value }
+    p { value }
   end
 end

data/app/components/oversee/field/value/json.rb

@@ -0,0 +1,6 @@
+class Oversee::Field::Value::Json < Oversee::Field::Value
+  def view_template
+    return p(class: "text-gray-400 text-xs uppercase") { "JSON" } if for_table?
+    p(class: "truncate") { value.to_s }
+  end
+end

data/app/components/oversee/field/value/rich_text.rb

@@ -1,9 +1,5 @@
-class Oversee::Field::Value::RichText < Phlex::HTML
-  def initialize(datatype: :string, key: nil, value: nil, kind: :value)
-    @value = value
-  end
-
+class Oversee::Field::Value::RichText < Oversee::Field::Value
   def view_template
-    p(class: "truncate") { @value }
+    p(class: "truncate") { value }
   end
 end

data/app/components/oversee/field/value/string.rb

@@ -1,20 +1,13 @@
-class Oversee::Field::Value::String < Phlex::HTML
-  def initialize(key: nil, value: nil, kind: :value)
-    @key = key
-    @value = value
-    @kind = kind
-  end
-
+class Oversee::Field::Value::String < Oversee::Field::Value
   def view_template
     return p(class: "text-gray-400 text-xs uppercase") { "Empty" } if @value == ""
     return p(class: "text-gray-400 text-xs uppercase") { "Redacted" } if sensitive?
-
-    p(class: "truncate") { @value }
+    p(class: "truncate") { value }
   end
 
   private
 
   def sensitive?
-    @key&.downcase&.include?("password") ||  @key&.downcase&.include?("token")
+    key&.downcase&.include?("password") || key&.downcase&.include?("token")
   end
 end

data/app/components/oversee/field/value/text.rb

@@ -1,9 +1,5 @@
-class Oversee::Field::Value::Text < Phlex::HTML
-  def initialize(datatype: :string, key: nil, value: nil, kind: :value)
-    @value = value
-  end
-
+class Oversee::Field::Value::Text < Oversee::Field::Value
   def view_template
-    p(class: "truncate") { @value }
+    p(class: "truncate") { value }
   end
 end

data/app/components/oversee/field/value.rb

@@ -3,9 +3,12 @@ class Oversee::Field::Value < Oversee::Base
     string: Oversee::Field::Value::String,
     belongs_to: Oversee::Field::Value::BelongsTo,
     boolean: Oversee::Field::Value::Boolean,
+    date: Oversee::Field::Value::Date,
     datetime: Oversee::Field::Value::Datetime,
     enum: Oversee::Field::Value::Enum,
     integer: Oversee::Field::Value::Integer,
+    json: Oversee::Field::Value::Json,
+    jsonb: Oversee::Field::Value::Json,
     rich_text: Oversee::Field::Value::RichText,
     text: Oversee::Field::Value::Text,
   }

data/app/components/oversee/field.rb

@@ -0,0 +1,42 @@
+class Oversee::Field < Oversee::Base
+  attr_reader :resource
+  attr_reader :key
+  attr_reader :value
+  attr_reader :datatype
+
+  def initialize(resource: nil, key: nil, value: nil, datatype: nil, **options)
+    @resource = resource
+    @key = key
+    @value = value
+    @datatype = datatype
+    @options = options
+  end
+
+  def view_template
+    plain "Oversee::Field"
+  end
+
+  # Sub-components
+  def __LABEL__ = Oversee::Field::Label.new(resource:, key:, value:, datatype:, **@options)
+  def __VALUE__ = Oversee::Field::Value.new(resource:, key:, value:, datatype:, **@options)
+  def __INPUT__ = Oversee::Field::Input.new(resource:, key:, value:, datatype:, **@options)
+  def __FORM__ = Oversee::Field::Form.new(resource:, key:, value:, datatype:, **@options)
+  def __SET__ = Oversee::Field::Set.new(resource:, key:, value:, datatype:, **@options)
+
+  # Helpers & Decorators
+  def field_id
+    @field_id ||= "resource_#{key}"
+  end
+
+  def field_name
+    @field_name ||= "resource[#{key}]"
+  end
+
+  def field_form_id
+    @form_id ||= dom_id(resource, "#{key}_form")
+  end
+
+  def resource_class_name
+    @resource_class_name ||= @resource.class.name
+  end
+end

data/app/components/oversee/flash.rb

@@ -0,0 +1,39 @@
+# frozen_string_literal: true
+
+class Oversee::Flash < Phlex::HTML
+  include Phlex::Rails::Helpers::Flash
+
+  def view_template
+    div(id: :flash, class: "fixed bottom-0 right-0 mb-8 mr-8 w-80 z-50") do
+      if !flash.empty?
+        div(
+          class: "flex flex-col gap-2 p-4 bg-white border border-gray-200/75 border-b-2 rounded-lg transition-all opacity-0 transform duration-300",
+          data: { controller: :notification }
+        ) do
+          notice if notice?
+          alert if alert?
+        end
+      end
+    end
+  end
+
+  private
+
+  def notice?
+    flash[:notice].present?
+  end
+
+  def notice
+    render Phlex::Icons::Iconoir::CheckCircle.new(class: "size-5 text-emerald-500", stroke_width: 2)
+    p(class: "text-sm text-gray-700") { flash[:notice] }
+  end
+
+  def alert?
+    flash[:alert].present?
+  end
+
+  def alert
+    render Phlex::Icons::Iconoir::MessageAlert.new(class: "size-5 text-red-500", stroke_width: 2)
+    p(class: "text-sm text-gray-700") { flash[:alert] }
+  end
+end

data/app/components/oversee/layout/application.rb

@@ -28,7 +28,7 @@ class Oversee::Layout::Application < Oversee::Base
       end
 
       body(class: "min-h-screen bg-gray-100 p-4") do
-        # render Flash.new
+        render Oversee::Flash.new
 
         div(class: "flex gap-4 w-full") do
           div(class: "w-72 shrink-0") { render Oversee::Dashboard::Sidebar.new }

data/app/components/oversee/resources/index.rb

@@ -29,7 +29,7 @@ class Oversee::Resources::Index < Oversee::Base
     end
     hr(class: "my-4")
 
-    render Oversee::Dashboard::Filters.new(params: @params)
+    render Oversee::Dashboard::Actions.new(params: @params)
 
     hr(class: "mt-4")
     render Oversee::Resources::Table.new(resource_class: @resource_class, resources: @resources, params: @params)

data/app/components/oversee/resources/show.rb

@@ -57,30 +57,20 @@ class Oversee::Resources::Show < Oversee::Base
 
     hr(class: "my-4")
 
-
-
-
     # COLUMNS
-    @resource_class.columns_hash.each do |key, metadata|
-      next if @oversee_resource.foreign_keys.include?(key.to_s)
-
-      div(class: "py-4") do
-        div(class: "space-y-2") do
-          render Oversee::Field::Label.new(key: key, datatype: metadata.sql_type_metadata.type)
-          div(id: dom_id(@resource, :"#{key}_row"), class: "flex items-center gap-2 mt-4") do
-            render Oversee::Field::Display.new(resource:, key:, value: @resource.send(key), datatype: metadata.sql_type_metadata.type)
-            # div(id: dom_id(@resource, :"#{key}_actions")) do
-            #   button(class: "bg-gray-100 hover:bg-gray-200 text-gray-400 hover:text-blue-500 size-10 aspect-square inline-flex items-center justify-center transition-colors") { render Phlex::Icons::Iconoir::Copy.new(class: "size-4") }
-            # end
-          end
-        end
+    div(class: "flex flex-col gap-4") do
+      @resource_class.columns_hash.each do |key, metadata|
+        next if @oversee_resource.foreign_keys.include?(key.to_s)
+        value = @resource.send(key)
+        datatype = metadata.sql_type_metadata.type
+        render Oversee::Field::Set.new(resource:, key:, value:, datatype:)
       end
     end
 
-    hr(class: "my-4")
 
     # RICH TEXT Associations
     if !!rich_text_associations.length
+    hr(class: "my-4")
       rich_text_associations.each do |association|
 
         # Remove the "rich_text_" prefix from the association name

data/app/components/oversee/resources/table.rb

@@ -78,7 +78,7 @@ class Oversee::Resources::Table < Oversee::Base
                 next if @oversee_resource.foreign_keys.include?(key.to_s)
                 row.data do
                   div(class: "max-w-96") do
-                    render Oversee::Field::Value.new(datatype: metadata.sql_type_metadata.type, value: resource.send(key), key: key)
+                    render Oversee::Field::Value.new(key:, datatype: metadata.sql_type_metadata.type, value: resource.send(key), for_table: true)
                   end
                 end
               end

data/app/controllers/oversee/resources/fields_controller.rb

@@ -1,29 +1,33 @@
 class Oversee::Resources::FieldsController < Oversee::ResourcesController
+  before_action :set_resource, only: %i[input]
+
   # Renders the display field for a resource
   def show
   end
 
   # Renders the input field for a resource
   def input
-    set_resource
-
-    key = params[:key].to_sym
-    value = params[:value] || @resource.send(key)
-    datatype = params[:datatype] || @resource.class.columns_hash[key.to_s].type
-
-    # puts "---" * 30
-    # puts "key: #{key}"
-    # puts "value: #{value}"
-    # puts "datatype: #{datatype}"
-    # puts "---" * 30
-
-    field_dom_id = dom_id(@resource, key)
-    field = Oversee::Field::Form.new(resource: @resource, datatype:, key:, value:)
+    component_dom_id = dom_id(@resource, key)
+    component = Oversee::Field::Set.new(resource: @resource, datatype:, key:, value:, state: :input)
 
     respond_to do |format|
       format.turbo_stream do
-        render turbo_stream: turbo_stream.replace(field_dom_id, field)
+        render turbo_stream: turbo_stream.replace(component_dom_id, component)
       end
     end
   end
+
+  private
+
+  def key
+    params[:key].to_sym
+  end
+
+  def value
+    params[:value] || @resource.send(key)
+  end
+
+  def datatype
+    params[:datatype] || @resource.class.columns_hash[key.to_s].type
+  end
 end

data/app/controllers/oversee/resources_controller.rb

@@ -31,6 +31,7 @@ module Oversee
 
       respond_to do |format|
         if @resource.update(resource_params)
+          flash.now[:notice] = "Resource was successfully created."
           format.html { redirect_to resource_path(@resource.id, resource_class_name: @resource_class) }
           format.turbo_stream { redirect_to resource_path(@resource.id, resource_class_name: @resource_class), status: :see_other }
         else
@@ -58,10 +59,14 @@ module Oversee
 
       respond_to do |format|
         if @resource.update(resource_params)
+          flash.now[:notice] = "#{@resource.class.to_s.titleize.capitalize.gsub("::"," ")} was successfully updated!"
           format.html { redirect_to resource_path(@resource.id, resource: @resource_class) }
           format.turbo_stream do
-            component = Oversee::Field::Display.new(resource: @resource, datatype:, key:, value: @resource.send(key))
-            render turbo_stream: turbo_stream.replace(dom_id(@resource, key), component)
+            component = Oversee::Field::Set.new(resource: @resource, datatype:, key:, value: @resource.send(key))
+            render turbo_stream: [
+              turbo_stream.replace(dom_id(@resource, key), component),
+              turbo_stream.replace(:flash, Oversee::Flash)
+            ]
           end
         else
         end

data/app/javascript/oversee/controllers/clipboard_controller.js

@@ -0,0 +1,21 @@
+import { Controller } from "@hotwired/stimulus";
+
+export default class extends Controller {
+  static targets = ["copyIcon", "successIcon"];
+  static values = { content: String };
+
+  async copy() {
+    try {
+      await navigator.clipboard.writeText(this.contentValue);
+      this.toggleIcons(true);
+      setTimeout(() => this.toggleIcons(false), 1500);
+    } catch (error) {
+      console.error(error.message);
+    }
+  }
+
+  toggleIcons(isCopied) {
+    this.copyIconTarget.classList.toggle("hidden", isCopied);
+    this.successIconTarget.classList.toggle("hidden", !isCopied);
+  }
+}

data/app/javascript/oversee/controllers/index.js

@@ -1,4 +1,5 @@
 import { Application } from "@hotwired/stimulus";
+
 const application = Application.start();
 
 application.debug = false;

data/app/javascript/oversee/controllers/notification_controller.js

@@ -0,0 +1,17 @@
+import { Controller } from "@hotwired/stimulus";
+
+export default class extends Controller {
+  connect() {
+    setTimeout(() => {
+      this.element.classList.remove("opacity-0");
+    }, 100);
+
+    setTimeout(() => {
+      this.element.classList.remove("opacity-100");
+      this.element.classList.add("opacity-0");
+    }, 2500);
+    setTimeout(() => {
+      this.element.outerHTML = "";
+    }, 3000);
+  }
+}

data/app/javascript/oversee/controllers/reveal_controller.js

@@ -1,7 +1,19 @@
 import { Controller } from "@hotwired/stimulus";
 
 export default class extends Controller {
+  static targets = ["revealable"];
+  static values = { revealableId: String };
+
   connect() {
-    console.log("Hello from reveal_controller.js");
+    if (this.hasRevealableIdValue)
+      this.target = document.getElementById(this.revealableIdValue);
+
+    if (!this.target && this.hasRevealableTarget)
+      this.target = this.revealableTarget;
+  }
+
+  toggle() {
+    if (!this.target) return;
+    this.target.classList.toggle("hidden");
   }
 }

data/app/models/oversee/resource.rb

@@ -2,22 +2,21 @@ class Oversee::Resource
   attr_reader :resource_class
   attr_reader :resource_class_name
   attr_reader :instance
-  attr_reader :rich_text_associations
-
-  attr_accessor :associations
+  attr_reader :associations
 
   def initialize(resource_class:, instance: nil)
     @resource_class = resource_class
-    @resource_class_name = resource_class.to_s
     @instance = instance
   end
 
   # Route helpers
-  def resources_path
-
+  def index_path
+    "/resources/#{resource_class_name}"
   end
 
-  def resource_path
+  def show_path
+    # Rails.application.routes.url_helpers.resource_path(instance || object, resource_class_name:)
+    "/resources/#{resource_class_name}/#{instance.to_param}"
   end
 
   # Columns
@@ -59,4 +58,8 @@ class Oversee::Resource
   def rich_text_associations
     @rich_text_associations ||= associations[:has_one].select { |association| association[:rich_text] }
   end
+
+  def resource_class_name
+    @resource_class_name ||= resource_class.to_s
+  end
 end

data/lib/oversee/version.rb

@@ -1,3 +1,3 @@
 module Oversee
-  VERSION = "0.3.0"
+  VERSION = "0.3.1"
 end

data/lib/oversee.rb

@@ -11,6 +11,7 @@ require "phlex-rails"
 
 # Pagy
 require "pagy"
+require "pagy/extras/i18n"
 
 # Zeitwerk
 loader = Zeitwerk::Loader.for_gem

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: oversee
 version: !ruby/object:Gem::Version
-  version: 0.3.0
+  version: 0.3.1
 platform: ruby
 authors:
 - Elvinas Predkelis
@@ -9,10 +9,38 @@ authors:
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2024-12-06 00:00:00.000000000 Z
+date: 2024-12-10 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
-  name: rails
+  name: activerecord
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 7.0.0
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 7.0.0
+- !ruby/object:Gem::Dependency
+  name: activesupport
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 7.0.0
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 7.0.0
+- !ruby/object:Gem::Dependency
+  name: activestorage
   requirement: !ruby/object:Gem::Requirement
     requirements:
     - - ">="
@@ -122,6 +150,8 @@ files:
 - app/assets/config/oversee_manifest.js
 - app/components/oversee/base.rb
 - app/components/oversee/card.rb
+- app/components/oversee/dashboard/actions.rb
+- app/components/oversee/dashboard/filter.rb
 - app/components/oversee/dashboard/filters.rb
 - app/components/oversee/dashboard/header.rb
 - app/components/oversee/dashboard/index.rb
@@ -129,25 +159,32 @@ files:
 - app/components/oversee/dashboard/pagination.rb
 - app/components/oversee/dashboard/sidebar.rb
 - app/components/oversee/dashboard/tailwind.rb
+- app/components/oversee/field.rb
 - app/components/oversee/field/display.rb
 - app/components/oversee/field/form.rb
 - app/components/oversee/field/input.rb
 - app/components/oversee/field/input/belongs_to.rb
 - app/components/oversee/field/input/boolean.rb
+- app/components/oversee/field/input/date.rb
 - app/components/oversee/field/input/datetime.rb
 - app/components/oversee/field/input/integer.rb
+- app/components/oversee/field/input/json.rb
 - app/components/oversee/field/input/rich_text.rb
 - app/components/oversee/field/input/string.rb
 - app/components/oversee/field/label.rb
+- app/components/oversee/field/set.rb
 - app/components/oversee/field/value.rb
 - app/components/oversee/field/value/belongs_to.rb
 - app/components/oversee/field/value/boolean.rb
+- app/components/oversee/field/value/date.rb
 - app/components/oversee/field/value/datetime.rb
 - app/components/oversee/field/value/enum.rb
 - app/components/oversee/field/value/integer.rb
+- app/components/oversee/field/value/json.rb
 - app/components/oversee/field/value/rich_text.rb
 - app/components/oversee/field/value/string.rb
 - app/components/oversee/field/value/text.rb
+- app/components/oversee/flash.rb
 - app/components/oversee/layout/application.rb
 - app/components/oversee/resources/base.rb
 - app/components/oversee/resources/errors.rb
@@ -167,7 +204,9 @@ files:
 - app/controllers/oversee/resources/fields_controller.rb
 - app/controllers/oversee/resources_controller.rb
 - app/javascript/oversee/application.js
+- app/javascript/oversee/controllers/clipboard_controller.js
 - app/javascript/oversee/controllers/index.js
+- app/javascript/oversee/controllers/notification_controller.js
 - app/javascript/oversee/controllers/reveal_controller.js
 - app/javascript/oversee/controllers/sidebar/state_controller.js
 - app/models/oversee/application_record.rb