gaco_cms 0.1.0

data/app/services/gaco_cms/theme_content_generator.rb

@@ -0,0 +1,55 @@
+# frozen_string_literal: true
+
+module GacoCms
+  class ThemeContentGenerator
+    def call
+      generate_pages
+      generate_theme_settings
+    end
+
+    private
+
+    def generate_pages
+      Page.create(title: 'Home', key: :home, content: home_content)
+      # TODO: create content for below pages
+      Page.create(title: 'Shortcodes', key: :shortcodes, content: gallery_content)
+      Page.create(title: 'Custom Fields', key: :custom_fields, content: gallery_content)
+      Page.create(title: 'Gallery', key: :gallery, content: gallery_content)
+    end
+
+    def generate_theme_settings
+      theme = Theme.current
+      group = theme.field_groups.create!(title: 'Menus', repeat: true)
+      label_field = group.fields.create!(title: 'Label', key: :menu_label, kind: :text_field, translatable: true, required: true)
+      url_field = group.fields.create!(title: 'Url', key: :menu_url, kind: :text_field, required: true)
+
+      theme.field_values.create!(value: 'Home', group_no: 1, field: label_field)
+      theme.field_values.create!(value: '/', group_no: 1, field: url_field)
+
+      theme.field_values.create!(value: 'Gallery', group_no: 2, field: label_field)
+      theme.field_values.create!(value: '[page_url key=gallery]', group_no: 2, field: url_field)
+    end
+
+    def home_content
+      '''
+        GacoCms is a lightweight CMS built in RubyonRails, to be included in any Rails application as the main purpose in mind.
+        <br>
+        Most outstanding characteristics are:
+        <ul>
+          <li>No extra Ruby dependencies required, except <a href="https://github.com/owen2345/buddy_translatable" target="_blank">translatable</a> that can conflict with existent applications</li>
+          <li>Surpricingly fast</li>
+          <li>Support multilanguage</li>
+          <li>Manage your content structure via custom fields</li>
+          <li>Manage content easily via shortcodes</li>
+        </ul>
+        <div class="alert alert-info">Note: Any error, issue, improvement, please let us know in https://github.com/owen2345/gaco_cms</div>
+      '''
+    end
+
+    def gallery_content
+      '''
+        This is a sample gallery page
+      '''
+    end
+  end
+end

data/app/views/gaco_cms/admin/base/index.html.haml

@@ -0,0 +1,4 @@
+%h1
+  Welcome to
+  %span.text-primary GacoCms
+  Admin Panel

data/app/views/gaco_cms/admin/field_groups_manager/_field.html.haml

@@ -0,0 +1,53 @@
+-# locals: { field: Field, parent_name: String }
+:ruby
+  accordion_key = "field_item_#{Time.current.to_i}_#{field.id}_#{field.kind}"
+  name = "#{parent_name}fields_attributes[#{accordion_key}]"
+
+.accordion-item
+  .accordion-header
+    .accordion-button{'data-bs-target' => "##{accordion_key}", "data-bs-toggle" => "collapse"}
+      = button_tag class: 'btn btn-sm sort-btn btn-light', type: :button do
+        %i.fa.fa-arrows-alt
+      = check_box_tag "#{name}[_destroy]", '1', false , 'data-controller': 'gaco-cms-deletable_row', 'data-hide-closest': '.accordion-item', 'data-hideonly': field.id
+      %code.ms-3.small= "[#{field.kind}]"
+
+  .accordion-collapse.collapse.show{ id: accordion_key }
+    .accordion-body
+      = fields_for name, field do |f|
+        = f.hidden_field :id
+        = f.hidden_field :kind
+        .row.mb-2.gx-2
+          .col.col-auto
+            = f.label :key
+            = f.text_field :key, class: 'form-control ms-1 me-1', style: 'max-width: 100px'
+          .col
+            = f.label :title
+            = f.text_field :title, class: 'form-control'
+          .col.col-auto
+            = f.label :repeat
+            %br
+            = f.check_box :repeat, class: 'form-check-input'
+          .col.col-auto
+            = f.label :required
+            %br
+            = f.check_box :required, class: 'form-check-input'
+          - if field.allow_translation?
+            .col.col-auto
+              = f.label :translatable
+              %br
+              = f.check_box :translatable, class: 'form-check-input'
+          .col.col-auto.d-none
+            = f.label :position
+            = f.number_field :position, class: 'form-control position-field'
+        .row
+          .col-6
+            - if field.default_value_tpl
+              = render field.default_value_tpl, field: field, f: f
+            - else
+              = f.label :def_value
+              .fw{ data: { controller: 'gaco-cms-toggle-field', 'gaco-cms-toggle-field-open-value': field.def_value_data.values.any?(&:present?) } }
+                = f.text_field :def_value, value: field.def_value_data.to_json, class: 'form-control', data: { controller: 'gaco-cms-translatable' }
+          .col-6
+            = f.label :description
+            .fw{ data: { controller: 'gaco-cms-toggle-field', 'gaco-cms-toggle-field-open-value': field.description_data.values.any?(&:present?) } }
+              = f.text_area :description, class: 'form-control'

data/app/views/gaco_cms/admin/field_groups_manager/_group.html.haml

@@ -0,0 +1,54 @@
+-# locals: { group: FieldGroup }
+:ruby
+  name = "groups_manager[field_groups_attributes][#{Time.current.to_i}-#{group.id}]"
+  accordion_key = name.parameterize
+= fields_for name, group do |f|
+  .accordion-item
+    .accordion-header
+      .accordion-button.bg-light{'data-bs-target' => "##{accordion_key}", 'data-bs-toggle': 'collapse'}
+      .accordion-actions.ms-2
+        = f.check_box :_destroy, 'data-controller': 'gaco-cms-deletable_row', 'data-propagate': '._destroy_field', 'data-hide-closest': '.accordion-item', 'data-hideonly': group.id
+        = button_tag class: 'btn btn-sm group-sort-btn btn-light', type: :button do
+          %i.fa.fa-arrows-alt
+        .btn-group.btn-group-sm.ms-2
+          %button.btn.btn-primary.dropdown-toggle{"aria-expanded" => "false", "data-bs-toggle" => "dropdown", type: "button"}
+            %i.fa.fa-plus
+            = GacoCms::Field.human_name(count: 2)
+          %ul.dropdown-menu
+            - GacoCms::Field.dropdown_data.each do |v, k|
+              %li= link_to(v, url_for(action: :field_tpl, kind: k, parent_name: name), class: 'dropdown-item', data: { controller: 'gaco-cms-remote-content', 'gaco-cms-remote-content-target-value': "##{accordion_key}_fields" })
+
+    .accordion-collapse.collapse-effect.show{ id: accordion_key }
+      .accordion-body.p-0.mb-3
+        .card
+          .card-body.bg-light
+            .row
+              .col-auto
+                = required_label f, :key
+                = f.text_field :key, class: 'form-control', style: 'max-width: 90px', required: true
+
+              .col
+                = required_label f, :title
+                = f.text_field :title, value: group.title, class: 'form-control', required: true
+
+              .col.d-none
+                = f.number_field :position, class: 'position-group'
+                = f.hidden_field :id
+
+              .col.col-auto
+                = f.label :repeat, class: 'd-block'
+                = f.check_box :repeat
+
+              -#.col.col-auto
+              -#  = f.label :description
+              -#  .fw{ data: { controller: 'gaco-cms-toggle-field', 'gaco-cms-toggle-field-open-value': group.description_data.values.any?(&:present?) } }
+              -#    = f.text_area :description, value: group.description_data.to_json, class: 'form-control', data: { controller: 'gaco-cms-translatable' }
+
+              .col.col-auto
+                = f.label :template
+                .fw{ data: { controller: 'gaco-cms-toggle-field', 'gaco-cms-toggle-field-open-value': group.template.present? } }
+                  = f.text_area :template, class: 'form-control'
+
+          .accordion{ id: "#{accordion_key}_fields", data: { controller: 'gaco-cms-sortable', 'gaco-cms-sortable-handle-value': '.accordion-item .sort-btn', 'gaco-cms-sortable-input-selector-value': '.position-field' } }
+            - group.fields.ordered.each do |field|
+              = render 'field', field: field, parent_name: name

data/app/views/gaco_cms/admin/field_groups_manager/index.html.haml

@@ -0,0 +1,14 @@
+= form_for @record, url: url_for(action: :update, id: @record) , html: { 'data-turbo-request-close-modal': 'true', 'data-turbo-request-reload-frame': params[:reload_frame] } do |_f|
+  .text-end.mb-1.sticky-top.bg-white.p-2
+    = link_to url_for(action: :group_tpl, record_type: @record.class.name, record_id: @record.id), class: 'btn btn-secondary', data: { controller: 'gaco-cms-remote-content', 'gaco-cms-remote-content-target-value': '#field_groups_list' } do
+      %i.fa.fa-plus
+      = GacoCms::FieldGroup.human_name
+    = button_tag class: 'btn btn-primary ms-2' do
+      %i.fa.fa-save
+      = GacoCms::FieldGroup.human_name(count: 2)
+
+  = hidden_field_tag :record_id, params[:record_id]
+  = hidden_field_tag :record_type, params[:record_type]
+  .accordion#field_groups_list.mb-2{ data: { controller: 'gaco-cms-sortable', 'gaco-cms-sortable-handle-value': '.accordion-item .group-sort-btn', 'gaco-cms-sortable-input-selector-value': '.position-group' } }
+    - @groups.each do |group|
+      = render 'group', group: group

data/app/views/gaco_cms/admin/field_groups_renderer/_field.html.haml

@@ -0,0 +1,31 @@
+-# locals: { value: Value }
+:ruby
+  key = "#{value.id}_#{value.field_id}_#{value.field.field_group_id}_#{Time.current.to_i}"
+  name = "field_values_attributes[#{key}]"
+
+- field_tpl = capture do
+  = fields_for name, value do |f|
+    = f.hidden_field :id
+    = f.hidden_field :field_id
+    = f.hidden_field :group_no
+    = f.text_field :position, class: 'd-none position-field'
+    = f.check_box :_destroy, class: 'd-none _destroy_field'
+    .d-flex.align-items-center
+      = required_label f, :title, label: value.field.title, optional: !value.required, class: 'me-2'
+      %small
+        %code.small= "[#{value.field.key}]"
+    - if value.field.description
+      .small.text-light.fst-italic= value.field.description
+  = render value.field.tpl, value: value, name: name
+
+- if value.repeat
+  %li.list-group-item.ps-1.pe-1
+    .row.align-items-center.gx-2
+      .col.field-col= field_tpl
+      .col.actions-col.col-auto.text-end{ style: 'max-width: 38px;' }
+        = fields_for name, value do |f|
+          = f.check_box :_destroy, 'data-controller': 'gaco-cms-deletable_row', 'data-hide-closest': '.list-group-item', 'data-hideonly': value.id, class: '_destroy_field'
+        = button_tag class: 'btn btn-sm sort-btn btn-light', type: :button do
+          %i.fa.fa-arrows-alt
+- else
+  = field_tpl

data/app/views/gaco_cms/admin/field_groups_renderer/_fields_frame.html.haml

@@ -0,0 +1,16 @@
+-# locals: { record: Page|Theme }
+
+.fieldset_style
+  .d-flex.justify-content-end.legend_style
+    = link_to gaco_cms_admin_field_groups_manager_index_path(record_type: @page.class.name, record_id: @page.id, reload_frame: '#field-groups-renderer'), class: 'btn btn-sm btn-info', 'data-title': 'Configure Fields', 'data-controller': 'gaco-cms-modal', 'data-gaco-cms-modal-size-value': 'modal-xl' do
+      %i.fa.fa-gears
+      Configure Fields
+
+  %turbo-frame{ id: 'field-groups-renderer', src: gaco_cms_admin_field_groups_renderer_index_path(record_type: @page.class.name, record_id: @page.id) }
+    .card{ style: 'min-height: 250px' }
+      .card-body
+        %h5.card-title.placeholder-glow
+          %span.placeholder.col-12{ style: 'height: 50px' }
+        %p.card-text.placeholder-glow
+          %span.placeholder.col-12
+          %span.placeholder.col-12

data/app/views/gaco_cms/admin/field_groups_renderer/_group.html.haml

@@ -0,0 +1,24 @@
+-# locals: { group: FieldGroup, field_values: [FieldValue], group_no: Integer }
+- accordion_key = "gaco_cms-field-group#{group.id}-#{group_no}"
+.accordion-item
+  - if group.repeat
+    .accordion-header
+      .accordion-button{'data-bs-target' => "##{accordion_key}", "data-bs-toggle" => "collapse"}
+        = check_box_tag :_destroy, '1', false , 'data-controller': 'gaco-cms-deletable_row', 'data-propagate': '._destroy_field', 'data-hide-closest': '.accordion-item', 'data-hideonly': field_values.for_group(group).where(group_no: group_no).any?
+
+  .accordion-collapse.collapse.show{ id: accordion_key }
+    .accordion-body
+      %ul.list-group.list-group-flush
+        - group.fields.ordered.each.with_index do |field, _i|
+          %li.list-group-item{ class: "#{field.repeat ? 'list-group-item-light ps-1 pe-1 border' : 'ps-0 pe-0' }", 'data-kind': field.kind }
+            - if field.repeat
+              .fields-list{ 'data-controller': 'gaco-cms-repeatable-field' }
+                .d-flex.justify-content-end.mb-2
+                  = link_to url_for(action: :render_field, field_id: field, group_no: group_no), class: 'btn btn-sm btn-outline-primary', 'data-gaco-cms-repeatable-field-target' => 'button' do
+                    = field.title
+                    %i.fa.fa-plus-square
+                %ul.list-group.list-group-flush{ 'data-gaco-cms-repeatable-field-target': 'list', data: { controller: 'gaco-cms-sortable', 'gaco-cms-sortable-handle-value': '.list-group-item .sort-btn', 'gaco-cms-sortable-input-selector-value': '.position-field' } }
+                  - field_values.all_or_new_for(field, group_no).each do |value|
+                    = render 'field', value: value, index: 0
+            - else
+              = render 'field', value: field_values.all_or_new_for(field, group_no).first, index: 0

data/app/views/gaco_cms/admin/field_groups_renderer/default_value/_page.html.haml

@@ -0,0 +1,3 @@
+-# locals { field: Field, f: Form }
+= f.label :def_value
+= f.grouped_collection_select :def_value, GacoCms::PageType.title_ordered.all, :pages, :title, :id, :title, { include_blank: true }, class: 'form-select'

data/app/views/gaco_cms/admin/field_groups_renderer/fields/_editor.html.haml

@@ -0,0 +1,3 @@
+-# locals: { value: FieldValue, name: String }
+= fields_for name, value do |f|
+  = f.text_field :value, value: value.value_for_input, class: 'form-control', data: { controller: "#{'gaco-cms-translatable' if value.field.translatable} gaco-cms-editor", height: 200 }

data/app/views/gaco_cms/admin/field_groups_renderer/fields/_file.html.haml

@@ -0,0 +1,4 @@
+-# locals: { value: FieldValue, name: String }
+= fields_for name, value do |f|
+  .file_panel{ data: { controller: 'gaco-cms-file-input' } }
+    = f.text_field :value, value: value.value_for_input, class: 'form-control',  data: { 'gaco-cms-file-input-target': 'input', controller: "#{'gaco-cms-translatable' if value.field.translatable}", 'gaco-cms-translatable-closest-clone-value': '.file_panel' }

data/app/views/gaco_cms/admin/field_groups_renderer/fields/_page.html.haml

@@ -0,0 +1,3 @@
+-# locals: { value: FieldValue, name: String }
+= fields_for name, value do |f|
+  = f.grouped_collection_select :value, GacoCms::PageType.title_ordered.all, :pages, :title, :id, :title, { include_blank: true, selected: value.value_for_input }, class: 'form-select'

data/app/views/gaco_cms/admin/field_groups_renderer/fields/_text_area.html.haml

@@ -0,0 +1,3 @@
+-# locals: { value: FieldValue, name: String }
+= fields_for name, value do |f|
+  = f.text_area :value, value: value.value_for_input, class: 'form-control', data: { controller: "#{'gaco-cms-translatable' if value.field.translatable}" }

data/app/views/gaco_cms/admin/field_groups_renderer/fields/_text_field.html.haml

@@ -0,0 +1,3 @@
+-# locals: { value: FieldValue, name: String }
+= fields_for name, value do |f|
+  = f.text_field :value, value: value.value_for_input, class: 'form-control', data: { controller: "#{'gaco-cms-translatable' if value.field.translatable}" }

data/app/views/gaco_cms/admin/field_groups_renderer/index.html.haml

@@ -0,0 +1,20 @@
+- @groups.ordered.each do |group|
+  .card.fields-list.mb-4{ 'data-controller': 'gaco-cms-repeatable-field' }
+    .card-header
+      .d-flex.justify-content-between
+        .title
+          %h4= group.title
+          - if group.description.present?
+            .small.italic.text-light= group.description
+        - if group.repeat
+          .btns
+            %small
+              %code.small= "[#{group.key}]"
+            = link_to url_for(action: :render_group, group_id: group), class: 'btn btn-sm btn-outline-primary', 'data-gaco-cms-repeatable-field-target' => 'button' do
+              %i.fa.fa-plus-square
+    .accordion{ 'data-gaco-cms-repeatable-field-target': 'list' }
+      - (@record.field_values.group_nos_for(group).presence || [999]).each do |group_no|
+        = render 'group', group: group, field_values: @record.field_values.eager_load(:field), group_no: group_no
+
+-# - if @groups.none?
+-#   .alert.alert-info Fields not assigned yet

data/app/views/gaco_cms/admin/page_types/form.html.haml

@@ -0,0 +1,27 @@
+%h2= form_title(@page_type)
+.row
+  = form_for(@page_type, url: url_for(action: @page_type.new_record? ? :create : :update), html: { enctype: 'multipart/form-data', class: 'col-4 col-xs-12' }) do |f|
+    .field.mb-2
+      = f.label :title
+      = f.text_field :title, value: @page_type.title_data.to_json, class: 'form-control', required: true, data: { controller: 'gaco-cms-translatable' }
+    .field.mb-2
+      = f.label :key
+      = f.text_field :key, class: 'form-control', required: true
+    .field.mb-2
+      = f.label :template
+      .fw{ data: { controller: 'gaco-cms-toggle-field', 'gaco-cms-toggle-field-open-value': @page_type.template.present? } }
+        = f.text_area :template, class: 'form-control', data: { controller: 'gaco-cms-editor', height: 500 }
+
+    .field.mb-2.text-end
+      = link_to url_for(action: :index), class: 'btn btn-secondary me-3' do
+        Cancel
+
+      = button_tag class: 'btn btn-primary' do
+        Save
+        %i.fa.fa-save
+
+  .col-8
+    .fieldset_style.mt-0
+      .d-flex.justify-content-end.legend_style
+        %span.bg-white Custom Fields
+      %turbo-frame{ id: 'field-groups-renderer-parent', src: gaco_cms_admin_field_groups_manager_index_path(record_type: @page_type.class.name, record_id: @page_type.id, reload_frame: '#field-groups-renderer-parent') }

data/app/views/gaco_cms/admin/page_types/index.html.haml

@@ -0,0 +1,27 @@
+%h1= GacoCms::PageType.human_name(count: 2)
+
+.text-end
+  = link_to(url_for(action: :new), class: 'btn btn-small btn-primary') do
+    = GacoCms::PageType.human_name
+    %i.fa.fa-plus
+
+%table.table.table-striped
+  %thead
+    %tr
+      %th= GacoCms::PageType.attr_label(:key)
+      %th= GacoCms::PageType.attr_label(:title)
+      %th= GacoCms::PageType.attr_label(:pages)
+      %th
+
+  %tbody
+    - @page_types.each do |page_type|
+      %tr
+        %td= page_type.key
+        %td= page_type.title
+        %td= page_type.pages.count
+        %td.text-end{ style: 'white-space: nowrap;' }
+          = link_to gaco_cms_admin_page_type_pages_path(page_type_id: page_type), class: 'btn btn-secondary btn-sm me-1' do
+            = GacoCms::Page.human_name(count: 2)
+            %i.fa.fa-list
+          = link_to '<i class="fa fa-pencil"></i>'.html_safe, url_for(action: :edit, id: page_type), class: 'btn btn-secondary btn-sm'
+          = button_to '<i class="fa fa-trash"></i>'.html_safe, url_for(action: :destroy, id: page_type), class: 'btn btn-danger btn-sm', form_class: 'd-inline', method: :delete, data: { controller: 'form-confirm', confirm: 'Are you sure?' }

data/app/views/gaco_cms/admin/pages/edit.html.haml

@@ -0,0 +1,57 @@
+%h2= form_title(@page)
+= form_for(@page, url: url_for(action: :update), html: { enctype: 'multipart/form-data', class: 'row mb-4', 'data-turbo-request-reload-frame': '#page_iframe,#field-groups-renderer,#field-groups-renderer-parent' }) do |f|
+  .col-4.col-xs-12.border-end
+    .text-end.sticky-top.bg-white.pb-2.mb-2
+      = link_to url_for(action: :index), class: 'btn btn-secondary me-2' do
+        Cancel
+      = button_tag class: 'btn btn-primary' do
+        Save
+        %i.fa.fa-save
+
+    .row.mb-2
+      .col.col-auto
+        = f.label :key
+        .fw{ data: { controller: 'gaco-cms-toggle-field' } }
+          = f.text_field :key, class: 'form-control', required: true
+      .col
+        = f.label :title
+        = f.text_field :title, value: @page.title_data.to_json, class: 'form-control', required: true, data: { controller: 'gaco-cms-translatable' }
+
+    .field.mb-2
+      = f.label :content
+      = f.text_area :content, value: @page.content_data.to_json, class: 'form-control', required: true, data: { controller: 'gaco-cms-translatable gaco-cms-editor', height: '300px' }
+
+    .row.mb-2
+      .col.col-6
+        = f.label :template
+        .fw{ data: { controller: 'gaco-cms-toggle-field' } }
+          = f.text_area :template, class: 'form-control', data: { controller: 'gaco-cms-editor', height: '400' }
+
+      .col.col-6
+        = f.label :summary
+        .fw{ data: { controller: 'gaco-cms-toggle-field' } }
+          = f.text_area :summary, value: @page.summary_data.to_json, class: 'form-control', data: { controller: 'gaco-cms-translatable' }
+
+    .field.mb-2
+      = f.label :photo_url
+      .photo_panel{ data: { controller: 'gaco-cms-file-input' } }
+        = f.text_field :photo_url, class: 'form-control', accept: 'image/*', data: { 'gaco-cms-file-input-target': 'input' }
+
+    .fieldset_style
+      .d-flex.justify-content-end.legend_style
+        %span.bg-white.px-1 Page Fields
+        = link_to gaco_cms_admin_field_groups_manager_index_path(record_type: @page.class.name, record_id: @page.id, reload_frame: '#field-groups-renderer'), class: 'btn btn-sm btn-info', 'data-title': 'Configure Fields', 'data-controller': 'gaco-cms-modal', 'data-gaco-cms-modal-size-value': 'modal-xl' do
+          %i.fa.fa-pencil
+      %turbo-frame{ id: 'field-groups-renderer', src: gaco_cms_admin_field_groups_renderer_index_path(record_type: @page.class.name, record_id: @page.id) }
+
+    - if @page.page_type.field_groups.any?
+      .fieldset_style
+        .d-flex.justify-content-end.legend_style
+          %span.bg-white.px-1 Inherited Fields
+          = link_to gaco_cms_admin_field_groups_manager_index_path(record_type: @page.page_type.class.name, record_id: @page.page_type_id, reload_frame: '#field-groups-renderer-parent'), class: 'btn btn-sm btn-info', 'data-title': 'Configure Parent Fields', 'data-controller': 'gaco-cms-modal', 'data-gaco-cms-modal-size-value': 'modal-xl' do
+            %i.fa.fa-pencil
+
+        %turbo-frame{ id: 'field-groups-renderer-parent', src: gaco_cms_admin_field_groups_renderer_index_path(record_type: @page.class.name, record_id: @page.id, parent: true ) }
+
+  .col.col-8
+    %iframe{ src: page_url_for(@page.id), width: '100%', height: '100%', id: 'page_iframe' }

data/app/views/gaco_cms/admin/pages/index.html.haml

@@ -0,0 +1,23 @@
+%h1= GacoCms::Page.human_name(count: 2)
+
+.text-end
+  = link_to(url_for(action: :new), class: 'btn btn-small btn-primary', 'data-controller': 'gaco-cms-modal') do
+    = GacoCms::Page.human_name
+    %i.fa.fa-plus
+
+%table.table.table-striped
+  %thead
+    %tr
+      %th= GacoCms::Page.attr_label(:key)
+      %th= GacoCms::Page.attr_label(:title)
+      %th
+
+  %tbody
+    - @pages.each do |page|
+      %tr
+        %td= page.key
+        %td= page.title
+        %td.text-end{ style: 'white-space: nowrap;' }
+          = link_to '<i class="fa fa-pencil"></i>'.html_safe, url_for(action: :edit, id: page), class: 'btn btn-primary btn-sm'
+          = button_to '<i class="fa fa-trash"></i>'.html_safe, url_for(action: :destroy, id: page), class: 'btn btn-danger btn-sm', form_class: 'd-inline', method: :delete, data: { controller: 'form-confirm', confirm: 'Are you sure?' }
+          = link_to '<i class="fa fa-eye"></i>'.html_safe, page_url_for(page.id), class: 'btn btn-sm btn-secondary', target: '_blank'

data/app/views/gaco_cms/admin/pages/new.html.haml

@@ -0,0 +1,16 @@
+%h2= form_title(@page)
+= form_for(@page, url: url_for(action: :create), html: { 'data-turbo-frame': '_top', 'data-turbo-request-close-modal': 'true' }) do |f|
+  .row.mb-2
+    .col.col-auto
+      = f.label :key
+      = f.text_field :key, class: 'form-control', required: true
+    .col
+      = f.label :title
+      = f.text_field :title, value: @page.title_data.to_json, class: 'form-control', required: true, data: { controller: 'gaco-cms-translatable' }
+
+  .field.text-end
+    = button_tag class: 'btn btn-primary' do
+      Save
+      %i.fa.fa-save
+
+

data/app/views/gaco_cms/admin/themes/edit.html.haml

@@ -0,0 +1,36 @@
+.row
+  .col-4.col-xs-12
+    %h2= form_title(@theme)
+    = form_for(@theme, url: url_for(action: :update), html: { enctype: 'multipart/form-data', 'data-turbo-request-reload-frame': '#theme_iframe,#field-groups-renderer' }) do |f|
+      .row
+        .col
+          = f.label :key
+          .fw{ data: { controller: 'gaco-cms-toggle-field' } }
+            = f.text_field :key, class: 'form-control', required: true
+        .col.col-auto
+          = f.label :title
+          = f.text_field :title, class: 'form-control', required: true
+        .col.col-auto
+          = f.label :active
+          %br
+          = f.check_box :active
+
+      .sticky-top.bg-white.p-1
+        .text-end
+          = link_to url_for(action: :index), class: 'btn btn-secondary me-2' do
+            Cancel
+          = button_tag class: 'btn btn-primary' do
+            Save
+            %i.fa.fa-save
+      %hr
+
+      .fieldset_style
+        .d-flex.justify-content-end.legend_style
+          = link_to gaco_cms_admin_field_groups_manager_index_path(record_type: @theme.class.name, record_id: @theme.id, reload_frame: '#field-groups-renderer'), class: 'btn btn-sm btn-info', 'data-title': 'Configure Fields', 'data-controller': 'gaco-cms-modal', 'data-gaco-cms-modal-size-value': 'modal-xl' do
+            %i.fa.fa-gears
+            Configure Fields
+        %turbo-frame{ id: 'field-groups-renderer', src: gaco_cms_admin_field_groups_renderer_index_path(record_type: @theme.class.name, record_id: @theme.id) }
+
+  .col.col-8
+    %iframe{ src: gaco_cms_path, width: '100%', height: '2000px', id: 'theme_iframe' }
+

data/app/views/gaco_cms/admin/themes/index.html.haml

@@ -0,0 +1,24 @@
+%h1= GacoCms::Theme.human_name(count: 2)
+
+.text-end
+  = link_to(url_for(action: :new), class: 'btn btn-small btn-primary', 'data-controller': 'gaco-cms-modal') do
+    = GacoCms::Theme.human_name
+    %i.fa.fa-plus
+
+%table.table.table-striped
+  %thead
+    %tr
+      %th= GacoCms::Theme.attr_label(:key)
+      %th= GacoCms::Theme.attr_label(:title)
+      %th= GacoCms::Theme.attr_label(:active)
+      %th
+
+  %tbody
+    - @themes.each do |theme|
+      %tr
+        %td= theme.key
+        %td= theme.title
+        %td= theme.active
+        %td.text-end{ style: 'white-space: nowrap;' }
+          = link_to '<i class="fa fa-pencil"></i>'.html_safe, url_for(action: :edit, id: theme), class: 'btn btn-primary btn-sm'
+          = button_to '<i class="fa fa-trash"></i>'.html_safe, url_for(action: :destroy, id: theme), class: 'btn btn-danger btn-sm', form_class: 'd-inline', method: :delete, data: { controller: 'form-confirm', confirm: 'Are you sure?' }

data/app/views/gaco_cms/admin/themes/new.html.haml

@@ -0,0 +1,21 @@
+%h2= form_title(@theme)
+= form_for(@theme, url: url_for(action: :create), html: { enctype: 'multipart/form-data', 'data-turbo-frame': '_top', 'data-turbo-request-close-modal': 'true' }) do |f|
+  .field.mb-2
+    = f.label :title
+    = f.text_field :title, class: 'form-control', required: true
+
+  .field.mb-2
+    = f.label :key
+    = f.text_field :key, class: 'form-control', required: true
+
+  .field.mb-2
+    = f.label :active
+    %br
+    = f.check_box :active
+
+  .field.text-end
+    = button_tag class: 'btn btn-primary' do
+      Save
+      %i.fa.fa-save
+
+

data/app/views/layouts/gaco_cms/_breadcrumb.html.haml

@@ -0,0 +1,7 @@
+%ol.breadcrumb.mb-0.small
+  - @breadcrumbs.each do |item|
+    - label = item[0].is_a?(String) ? item[0] : t("breadcrumbs.#{Array(item.first).join('.')}")
+    - if @breadcrumbs.last == item
+      %li.breadcrumb-item.active= label
+    - else
+      %li.breadcrumb-item= link_to(label, item[1], class: 'link-light')

data/app/views/layouts/gaco_cms/_flash_messages.html.haml

@@ -0,0 +1,13 @@
+- flash.each do |msg_type, message|
+  :ruby
+    if %i[alert error].include?(msg_type.to_sym)
+      flash_class = 'bg-danger'
+    elsif %i[warning warn].include?(msg_type.to_sym)
+      flash_class = 'bg-danger'
+    else
+      flash_class = 'bg-success'
+    end
+  .toast.align-items-center.text-white.border-0.fade.show{"data-bs-autohide" => "true", class: flash_class}
+    .d-flex
+      .toast-body= message
+      %button.btn-close.btn-close-white.me-2.m-auto{"aria-label" => "Close", "data-bs-dismiss" => "toast", type: "button"}

data/app/views/layouts/gaco_cms/admin.haml

@@ -0,0 +1,55 @@
+!!!
+%html
+  %head
+    = display_meta_tags site: 'Gaco CMS'
+    %meta{:content => "text/html; charset=UTF-8", "http-equiv" => "Content-Type"}/
+    %meta{:content => "width=device-width,initial-scale=1", :name => "viewport"}/
+    = csrf_meta_tags
+    = csp_meta_tag
+    = stylesheet_link_tag 'gaco_cms'
+    = javascript_include_tag 'gaco_cms'
+    = javascript_tag "window.locale = '#{I18n.locale}'; window.gaco_cms_config = { \"locale\": '#{I18n.locale}', \"locales\": #{GacoCms::Config.locales.to_json}, \"editor_css\": '#{instance_eval(&GacoCms::Config.backend_editor_css)}', upload_path: '#{gaco_cms_admin_upload_file_path(format: :json)}' };";
+
+  %body#body
+    #header
+      -########### Second NavBar
+      %nav.navbar.navbar-expand-lg.shadow.text-white.bg-primary.navbar-dark
+        .container
+          %a.navbar-brand.logo.p-0.d-flex{href: gaco_cms_admin_path, style: 'font-size: 32px;'}
+            %span.text-black Gaco
+            %span.text-white Cms
+          %button.navbar-toggler{"aria-controls" => "navbarSupportedContent", "aria-expanded" => "false", "aria-label" => "Toggle navigation", "data-bs-target" => "#main_nav_bar", "data-bs-toggle" => "collapse", :type => "button"}
+            %span.fa.fa-bars
+
+          #main_nav_bar.collapse.navbar-collapse.justify-content-end.text-white-50
+            %ul.navbar-nav
+              - GacoCms::PageType.all.title_ordered.each do |ptype|
+                %li.nav-item.dropdown
+                  %button.btn.dropdown-toggle.nav-link{"data-bs-toggle" => "dropdown", type: "button"}= ptype.title
+                  %ul.dropdown-menu{"aria-labelledby" => "dropdownMenuButton1"}
+                    %li
+                      %a.dropdown-item{href: gaco_cms_admin_page_type_pages_path(page_type_id: ptype)} List
+                    %li
+                      %a.dropdown-item{href: new_gaco_cms_admin_page_type_page_path(page_type_id: ptype)} Add New
+              %li.nav-item
+                .vr.bg-black{ style: 'height: 100%' }
+              %li.nav-item
+                %a.nav-link{href: gaco_cms_admin_page_types_path}= GacoCms::PageType.human_name(count: 2)
+              %li.nav-item
+                %a.nav-link{href: gaco_cms_admin_themes_path}= GacoCms::Theme.human_name(count: 2)
+
+
+    -########## Breadcrumbs
+    #breadcrumb_panel.d-flex.justify-content-end.container.pt-1
+      %nav{style: '--bs-breadcrumb-divider: "»";'}= render '/layouts/gaco_cms/breadcrumb'
+
+    #main-progress-bar.progress.fixed-top.invisible{ style: 'z-index: 99999' }
+      .progress-bar.progress-bar-striped.progress-bar-animated{role: "progressbar", style: "width: 100%"}
+    #toasts.toast-container.position-fixed.p-3.bottom-0.end-0{ style: 'z-index: 99999' }
+      = render '/layouts/gaco_cms/flash_messages'
+
+    #container.container.pt-3
+      = yield
+    = turbo_frame_tag :turbo_frame_none
+
+    = render '/rails_hotreload/stream', custom_style: 'left: 20px; bottom: 20px;'  if Rails.env.development?