kosmos/akkounts
kosmos/akkounts
8
1
Fork 0
Code Issues 19 Pull Requests 1 Actions Packages Releases 12 Activity

Allow disabling toggles, add toggle fieldset component

Browse Source
This commit is contained in:
Râu Cao 2023-03-12 13:41:36 +07:00 committed by Gitea
parent 805733939c
commit e758e258a8
5 changed files with 41 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
app/components/form_elements/fieldset_toggle_component.html.erb Normal file
View File

@ -0,0 +1,9 @@
<%= tag.public_send(@tag, class: "flex items-center justify-between py-6") do %>
<div class="flex flex-col">
<label class="font-bold mb-1"><%= @title %></label>
<p class="text-gray-500"><%= @descripton %></p>
</div>
<div class="relative ml-4 inline-flex flex-shrink-0">
<%= render FormElements::ToggleComponent.new(enabled: @enabled, input_enabled: @input_enabled) %>
</div>
<% end %>

14
app/components/form_elements/fieldset_toggle_component.rb Normal file
View File

@ -0,0 +1,14 @@
# frozen_string_literal: true
module FormElements
class FieldsetToggleComponent < ViewComponent::Base
def initialize(tag: "li", enabled: false, input_enabled: true, title:, description:)
@tag = tag
@enabled = enabled
@input_enabled = input_enabled
@title = title
@descripton = description
@button_text = @enabled ? "Switch off" : "Switch on"
end
end
end

3
app/components/form_elements/toggle_component.html.erb
View File

@ -1,10 +1,11 @@
<button type="submit" role="switch" aria-checked="false"
<%= @input_enabled ? "" : "disabled=disabled"%>
class="<%= @enabled ? 'bg-indigo-600' : 'bg-gray-200' %>
relative inline-flex h-6 w-11 flex-shrink-0
cursor-pointer rounded-full border-2 border-transparent
transition-colors duration-200 ease-in-out focus:outline-none
focus:ring-2 focus:ring-indigo-600 focus:ring-offset-2">
<!-- <span class="sr&#45;only">Enable</span> -->
<span class="sr-only"><%= @button_text %></span>
<span aria-hidden="true"
class="<%= @enabled ? 'translate-x-5' : 'translate-x-0' %>
pointer-events-none inline-block h-5 w-5 transform rounded-full

3
app/components/form_elements/toggle_component.rb
View File

@ -2,8 +2,9 @@
module FormElements
class ToggleComponent < ViewComponent::Base
def initialize(enabled:)
def initialize(enabled:, input_enabled: true)
@enabled = !!enabled
@input_enabled = input_enabled
end
end
end

32
app/views/admin/settings/services/index.html.erb
View File

@ -15,24 +15,20 @@
<% end %>
<ul role="list" class="mt-2 divide-y divide-gray-200">
<li class="flex items-center justify-between py-6">
<div class="flex flex-col">
<label class="font-bold mb-1">Enable LNDHub integration</label>
<p class="text-gray-500">LNDHub configuration present and wallet features enabled</p>
</div>
<%= f.check_box :lndhub_enabled, checked: Setting.lndhub_enabled?,
disabled: true,
class: "relative ml-4 inline-flex flex-shrink-0" %>
</li>
<li class="flex items-center justify-between py-6">
<div class="flex flex-col">
<label class="font-bold mb-1">Enable LNDHub admin panel</label>
<p class="text-gray-500">LNDHub database configuration present and admin panel enabled</p>
</div>
<%= f.check_box :lndhub_admin_enabled, checked: Setting.lndhub_admin_enabled?,
disabled: true,
class: "relative ml-4 inline-flex flex-shrink-0" %>
</li>
<%= render FormElements::FieldsetToggleComponent.new(
tag: "li",
enabled: Setting.lndhub_enabled?,
input_enabled: false,
title: "Enable LNDHub integration",
description: "LNDHub configuration present and wallet features enabled"
) %>
<%= render FormElements::FieldsetToggleComponent.new(
tag: "li",
enabled: Setting.lndhub_admin_enabled?,
input_enabled: false,
title: "Enable LNDHub admin panel",
description: "LNDHub database configuration present and admin panel enabled"
) %>
</ul>
<% end %>
</section>