cm-admin 0.8.9 → 0.9.1

data/app/assets/stylesheets/cm_admin/components/_buttons.scss

@@ -1,14 +1,16 @@
 @import '../helpers/index.scss';
 
 .cta-btn {
-  padding: 8px 16px;
+  padding: 5px 10px;
   @include font($size: $t4-text, $color: $white, $weight: bold);
   background-color: $brand-color;
   border: none;
   border-radius: $radius-4;
   transition: all .2s linear;
   &:hover {
-    background-color: #4D40AA;
+    color: $white;
+    background: $cta-hover-gradient;
+    transform: scale(1.05);
   }
   &:focus {
     outline: 3px auto rgba(47, 128, 237, 0.3);
@@ -25,14 +27,16 @@
 }
 
 .primary-btn {
-  padding: 8px 16px;
+  padding: 5px 10px;
   @include font($size: $t4-text, $color: $brand-color, $weight: bold);
   background-color: $white;
   border: 1px solid $brand-color;
   border-radius: $radius-4;
   transition: all .2s linear;
   &:hover {
+    color: $brand-color;
     background-color: #E6E4FA;
+    transform: scale(1.05);
   }
   &:focus {
     outline: 3px auto rgba(47, 128, 237, 0.3);
@@ -50,14 +54,16 @@
 }
 
 .secondary-btn {
-  padding: 8px 16px;
+  padding: 5px 10px;
   @include font($size: $t4-text, $color: $primary-text-clr, $weight: bold); 
   background-color: $white;
   border: 1px solid $ink-regular-clr;
   border-radius: $radius-4;
   transition: all .2s linear;
   &:hover {
+    color: $primary-text-clr;
     background-color: $grey-light-clr;
+    transform: scale(1.05);
   }
   &:focus {
     outline: 3px auto rgba(47, 128, 237, 0.3);
@@ -75,17 +81,22 @@
   span:nth-child(2) {
     margin: 0 4px 0 8px;
   }
+  span:nth-child(3) {
+    @include font($size: 10px, $color: $ink-lighter-clr, $weight: bold); 
+  }
 }
 
 .gray-border-btn {
-  padding: 7px 16px;
+  padding: 5px 10px;
   @include font($size: $t4-text, $color: $primary-text-clr, $weight: bold); 
   background-color: $white;
   border: 1px solid $ink-regular-clr;
   border-radius: $radius-4;
   transition: all .2s linear;
   &:hover {
+    color: $primary-text-clr;
     background-color: $grey-light-clr;
+    transform: scale(1.05);
   }
   &:focus {
     outline: 3px auto rgba(47, 128, 237, 0.3);
@@ -103,14 +114,16 @@
 }
 
 .ghost-btn {
-  padding: 8px 16px;
+  padding: 5px 10px;
   @include font($size: $t4-text, $color: $primary-text-clr, $weight: bold); 
   background-color: transparent;
   border: none;
   border-radius: $radius-4;
   transition: all .2s linear;
   &:hover {
+    color: $primary-text-clr;
     background: $grey-light-clr;
+    transform: scale(1.05);
   }
   &:focus {
     outline: 3px auto rgba(47, 128, 237, 0.3);

data/app/assets/stylesheets/cm_admin/components/_drawer.scss

@@ -21,21 +21,18 @@
       align-items: center;
       justify-content: space-between;
       padding: 24px;
-      background: #F8F9FA;
+      background: $grey-lightest-clr;
       &__lhs {
         .title {
+          @include font($size: $t1-text, $color: $primary-text-clr, $weight: 600);
           font-family: $primary-font;
-          font-size: $t1-text;
-          font-weight: 600;
           line-height: 28px;
-          color: $primary-text-clr;
           margin-bottom: 8px;
         }
         .description {
+          @include font($size: $t4-text, $color: $primary-text-clr);
           font-family: $primary-font;
-          font-size: $t4-text;
           line-height: 22px;
-          color: $primary-text-clr;
           margin-bottom: 0;
         }
       }
@@ -46,10 +43,9 @@
     .body {
       padding: 24px;
       .info-text {
+        @include font($size: $t4-text, $color: $primary-text-clr);
         font-family: $primary-font;
-        font-size: $t4-text;
         line-height: 22px;
-        color: $primary-text-clr;
       }
     }
   }

data/app/assets/stylesheets/cm_admin/components/_dropdown-popup.scss

@@ -143,9 +143,8 @@
       }
     }
     .cannot-sort {
-      font-size: $t6-text;
+      @include font($size: $t6-text, $color: $ink-lightest-clr);
       line-height: 16px;
-      color: $ink-lightest-clr;
       margin-bottom: 9px;
       padding: 0 16px;
     }

data/app/assets/stylesheets/cm_admin/components/_input.scss

@@ -38,7 +38,7 @@
 .search-input {
   position: relative;
   width: 100%;
-  padding: 8px 0 8px 40px;
+  padding: 5px 0 5px 38px;
   @include font($size: $t4-text, $color: $primary-text-clr);
   line-height: 22px;
   background-color: $white;

data/app/assets/stylesheets/cm_admin/components/_status-tag.scss

@@ -6,6 +6,7 @@
   padding: 4px;
   color: $primary-text-clr;
   background: $grey-lighter-clr;
+  border-radius: 2px;
   &.success {
     color: $green-regular-clr;
     background: $green-lightest-clr;
@@ -25,7 +26,7 @@
   cursor: pointer;
   user-select: none;
   &:hover {
-    background-color: #F3F4F6;
+    background-color: $grey-lighter-clr;
     .filter-chip-remove {
       display: block;
     }
@@ -42,7 +43,7 @@
     top: 0;
     right: 0;
     padding: 4px 16px;
-    background: linear-gradient(270deg, #F3F4F6 81.75%, rgba(243, 244, 246, 0) 100%);
+    background: $gradient-one;
     border-radius: $radius-4;
     i {
       font-size: 10px;

data/app/assets/stylesheets/cm_admin/helpers/_variable.scss

@@ -51,6 +51,10 @@ $subdued-text-clr: #D9DEE3;
 $white: #FFFFFF;
 $black: #000000;
 
+// Gradient Colors
+$gradient-one: linear-gradient(270deg, $grey-lighter-clr 81.75%, rgba(243, 244, 246, 0) 100%);
+$cta-hover-gradient: linear-gradient(0deg, rgba(0, 0, 0, 0.24), rgba(0, 0, 0, 0.24)), $brand-color;
+
 /* Typography */
 $primary-font: 'Open Sans', sans-serif;
 $font-size: (

data/app/assets/stylesheets/cm_admin/scaffold.scss

@@ -2,7 +2,7 @@
 
 .jGrowl {
   color: $ink-regular-clr !important;
-  font-size: 14px !important;
+  font-size: $t4-text !important;
   .success{
     background-color: $green-light-clr !important;
   }
@@ -17,7 +17,7 @@
 
 .nested-field-wrapper {
   label {
-    font-size: 14px;
+    font-size: $t4-text;
     margin-bottom: 16px;
   }
   .nested-fields {

data/app/controllers/cm_admin/resource_controller.rb

@@ -193,7 +193,9 @@ module CmAdmin
     end
 
     def resource_params(params)
-      permittable_fields = @permitted_fields || @model.ar_model.columns.map(&:name).reject { |i| CmAdmin::REJECTABLE_FIELDS.include?(i) }.map(&:to_sym)
+      columns = @model.ar_model.column_names
+      columns += @model.ar_model.stored_attributes.values.flatten
+      permittable_fields = @model.additional_permitted_fields + columns.reject { |i| CmAdmin::REJECTABLE_FIELDS.include?(i) }.map(&:to_sym)
       permittable_fields += @model.ar_model.name.constantize.reflect_on_all_associations.map {|x|
         next if x.options[:polymorphic]
         if x.class.name.include?('HasOne')
@@ -207,7 +209,7 @@ module CmAdmin
       nested_fields = nested_tables.uniq.map {|table|
         Hash[
           table.to_s + '_attributes',
-          table.to_s.classify.constantize.columns.map(&:name).reject { |i| CmAdmin::REJECTABLE_FIELDS.include?(i) }.map(&:to_sym) + [:id, :_destroy]
+          table.to_s.classify.constantize.column_names.reject { |i| CmAdmin::REJECTABLE_FIELDS.include?(i) }.map(&:to_sym) + [:id, :_destroy]
         ]
       }
       permittable_fields += nested_fields

data/app/javascript/packs/cm_admin/filters.js

@@ -54,7 +54,7 @@ var getFilteredData = function(filterType, filterValue, filterColumn=null) {
     success: function(data) {
       var queryParam = jQuery.param(queryString)
       window.history.pushState("", "", url + '?' + queryParam);
-      $('.index-page__table-container').html(data);
+      $('.cm-index-page__table-container').html(data);
     },
     error: function(jqxhr, textStatus, errorThrown) {
       console.log(errorThrown, textStatus);

data/app/javascript/packs/cm_admin/scaffolds.js

@@ -16,6 +16,9 @@ $(document).on('turbolinks:load', function () {
       animation: 150
     });
   }
+  var headerElemHeight = $('.page-top-bar').height() + 64
+  var calculatedHeight = "calc(100vh - " + headerElemHeight+"px"+")"
+  $('.new-admin-table').css("maxHeight", calculatedHeight);
 });
 
 $(document).on("keypress keyup blur", "[data-behaviour='decimal-only'], [data-behaviour='filter'][data-filter-type='range']", function (e) {
@@ -70,4 +73,34 @@ $(document).on('click', '.drawer-close', function(e) {
   setTimeout(() => {
     $('.cm-drawer').addClass('hidden');
   }, 300);
-});
+});
+
+$(document).on('cocoon:after-insert', '.nested-field-wrapper', function(e) {
+  e.stopPropagation();
+  replaceAccordionTitle($(this))
+});
+
+$(document).on('cocoon:after-remove', '.nested-field-wrapper', function(e) {
+  e.stopPropagation();
+  replaceAccordionTitle($(this))
+});
+
+$(document).ready( function () {
+  $('.nested-field-wrapper').each(function() {
+    replaceAccordionTitle($(this))
+  })
+});
+
+var replaceAccordionTitle = function(element) {
+  var i = 0;
+  var table_name = $(element).data('table-name')
+  var model_name = $(element).data('model-name')
+  $(element).find('.accordion-item:visible').each(function() {
+    i++;
+    var accordion_title = model_name + ' ' + i
+    var accordion_id = table_name + '-' + i
+    $(this).find('.accordion-button').text(accordion_title);
+    $(this).find('.accordion-button').attr('data-bs-target', '#' + accordion_id);
+    $(this).find('.accordion-collapse').attr('id', accordion_id);
+  });
+}

data/app/views/cm_admin/main/_actions_dropdown.html.slim

@@ -38,10 +38,10 @@
                 .popup-option
                   span
                     i class="#{custom_action.icon_name}"
-                  = custom_action.name.humanize
+                  = custom_action_title(custom_action)
             - when :modal
               = link_to '', data: { bs_toggle: 'modal', bs_target: "##{custom_action.name.classify}Modal-#{ar_object.id.to_s}" } do
                 .popup-option
                   span
                     i class="#{custom_action.icon_name}"
-                  = custom_action.name.humanize
+                  = custom_action_title(custom_action)

data/app/views/cm_admin/main/_associated_table.html.slim

@@ -1,20 +1,19 @@
-.admin-table-index
-  .table-top
-    - if @associated_model.filters.present? && @action.partial.nil?
-      .index-page__filters
-        == render partial: 'cm_admin/main/filters', locals: { filters: @associated_model.filters }
-    p.table-top__total-count = "#{humanized_ar_collection_count(@associated_ar_object.pagy.count, @action.child_records.to_s)}"
-    .table-top__column-action
-      - if @associated_model && @associated_model.available_actions.map(&:name).include?('new') && has_valid_policy(@associated_model.name, 'new')
-        - association = @ar_object.class.reflect_on_all_associations.select{|x| x.name == @associated_model.name.tableize.to_sym }.first
-        - polymorphic_name = (association && association.inverse_of && association.inverse_of.options[:polymorphic]) ? association.inverse_of.name : ''
-        a href="#{CmAdmin::Engine.mount_path}/#{@associated_model.name.tableize}/new?associated_id=#{@ar_object.id}&associated_class=#{@ar_object.class.name.underscore}&polymorphic_name=#{polymorphic_name}&referrer=#{request.path}"
-          button.secondary-btn.column-btn Add
-      / button.secondary-btn.column-btn data-target="#columnActionModal" data-toggle="modal" type="button"
-      /   span
-      /     i.fa.fa-columns.bolder
-      /   span
-      /     i.fa.fa-angle-down
+.table-top
+  - if @associated_model.filters.present? && @action.partial.nil?
+    .cm-index-page__filters
+      == render partial: 'cm_admin/main/filters', locals: { filters: @associated_model.filters }
+  p.table-top__total-count = "#{humanized_ar_collection_count(@associated_ar_object.pagy.count, @action.child_records.to_s)}"
+  .table-top__column-action
+    - if @associated_model && @associated_model.available_actions.map(&:name).include?('new') && has_valid_policy(@associated_model.name, 'new')
+      - association = @ar_object.class.reflect_on_all_associations.select{|x| x.name == @associated_model.name.tableize.to_sym }.first
+      - polymorphic_name = (association && association.inverse_of && association.inverse_of.options[:polymorphic]) ? association.inverse_of.name : ''
+      a href="#{CmAdmin::Engine.mount_path}/#{@associated_model.name.tableize}/new?associated_id=#{@ar_object.id}&associated_class=#{@ar_object.class.name.underscore}&polymorphic_name=#{polymorphic_name}&referrer=#{request.path}"
+        button.secondary-btn.column-btn Add
+    / button.secondary-btn.column-btn data-target="#columnActionModal" data-toggle="modal" type="button"
+    /   span
+    /     i.fa.fa-columns.bolder
+    /   span
+    /     i.fa.fa-angle-down
 
 .new-admin-table.scrollable
   table.cm-table
@@ -46,9 +45,9 @@
           - if @associated_model
             == render partial: 'cm_admin/main/actions_dropdown', locals: { cm_model: @associated_model, ar_object: ar_object }
 
-.cm-pagination
-  .cm-pagination__lhs Showing #{@associated_ar_object.pagy.from} to #{@associated_ar_object.pagy.to} out of #{@associated_ar_object.pagy.count}
-  .cm-pagination__rhs
-    == render partial: 'cm_admin/main/cm_pagy_nav', locals: { pagy: @associated_ar_object.pagy }
+  .cm-pagination
+    .cm-pagination__lhs Showing #{@associated_ar_object.pagy.from} to #{@associated_ar_object.pagy.to} out of #{@associated_ar_object.pagy.count}
+    .cm-pagination__rhs
+      == render partial: 'cm_admin/main/cm_pagy_nav', locals: { pagy: @associated_ar_object.pagy }
 
 = render partial: 'cm_admin/main/member_custom_action_modal', locals: { cm_model: @associated_model, ar_collection: @associated_ar_object }

data/app/views/cm_admin/main/_member_custom_action_modal.html.slim

@@ -7,7 +7,7 @@
         .modal-dialog
           .modal-content
             .modal-header
-              h5.modal-title id="#{custom_action.name.classify}ModalLabel" = custom_action.name.classify
+              h5.modal-title id="#{custom_action.name.classify}ModalLabel" = custom_action_title(custom_action)
               button.btn-close aria-label='Close' data-bs-dismiss='modal'
             .modal-body
               = render partial: custom_action.partial, locals: { ar_object: ar_object }

data/app/views/cm_admin/main/_nested_fields.html.slim

@@ -1,9 +1,26 @@
-.nested-fields class=assoc_name
-  - @model.available_fields[ action(action_name) ][assoc_name].each do |field|
-    .row
-      .col-sm-10
-        = input_field_for_column(f, field)
-      .col-sm-2
-        - unless field.input_type == :hidden
-          - if @reflections.select {|x| x if x.name == assoc_name}.first.macro == :has_many
-            = link_to_remove_association "x", f
+- fields = @model.available_fields[ action(action_name) ][assoc_name]
+- if fields.count == 1
+  .nested-single-field.nested-fields
+    - fields.each do |field|
+        .field-input
+          = input_field_for_column(f, field)
+        .field-remove-action
+          - unless field.input_type == :hidden
+            - if @reflections.select {|x| x if x.name == assoc_name}.first.macro == :has_many
+              = link_to_remove_association "", f, class: 'fa fa-times'
+- else
+  .accordion-item.nested-fields
+    h2#headingOne.accordion-header
+      button.accordion-button[type="button" data-bs-toggle="collapse" data-bs-target="##{assoc_name}-#{f.object.id}" aria-expanded="true" aria-controls="collapseOne"]
+        | Chapter 1
+      .field-remove-action
+        - if @reflections.select {|x| x if x.name == assoc_name}.first.macro == :has_many
+          = link_to_remove_association "", f, class: 'fa fa-trash ghost-btn accordion-delete-btn'
+    div.accordion-collapse.collapse.show[aria-labelledby="headingOne" id="#{assoc_name}-#{f.object.id}"]
+      .accordion-body
+        - fields.each do |field|
+          .form-field
+            .field-label-wrapper
+              label.field-label = field.field_name.to_s.titleize 
+            .field-input-wrapper
+              = input_field_for_column(f, field)

data/app/views/cm_admin/main/_nested_table_form.html.slim

@@ -1,10 +1,9 @@
-.nested-field-wrapper
-  label.field-label = table_name.to_s.titleize
-  - initialized_record_count = 1
-  = f.fields_for table_name do |record|
-    - if record.object.persisted? || initialized_record_count == 1
-      = render partial: '/cm_admin/main/nested_fields', locals: { f: record, assoc_name: table_name }
-    - initialized_record_count += 1 if record.object.new_record?
-  - if @reflections.select {|x| x if x.name == table_name}.first.macro == :has_many
-    .links
-      = link_to_add_association "+ Add #{table_name.to_s.titleize}", f, table_name, partial: '/cm_admin/main/nested_fields', render_options:  {locals: { assoc_name: table_name }}
+.nested-field-wrapper data-table-name=table_name data-model-name=table_name.to_s.classify
+  label.nested-field-label = table_name.to_s.titleize
+  .accordion.nested-form-accordion
+    = f.fields_for table_name do |record|
+      - if record.object.persisted?
+        = render partial: '/cm_admin/main/nested_fields', locals: { f: record, assoc_name: table_name }
+    - if @reflections.select {|x| x if x.name == table_name}.first.macro == :has_many
+      .links
+        = link_to_add_association "+ Add #{table_name.to_s.titleize}", f, table_name, partial: '/cm_admin/main/nested_fields', render_options:  {locals: { assoc_name: table_name }}, class: 'd-inline-block secondary-btn mt-2'

data/app/views/cm_admin/main/_table.html.slim

@@ -1,13 +1,12 @@
-.admin-table-index
-  .table-top
-    p.table-top__total-count = "#{humanized_ar_collection_count(@ar_object.pagy.count, @model.ar_model.table_name)}"
-    // .table-top__column-action
-    //  button.secondary-btn.column-btn data-bs-target="#columnActionModal" data-bs-toggle="modal"
-    //    span
-    //      i.fa.fa-columns.bolder
-    //    span
-    //      i.fa.fa-angle-down
-.new-admin-table.scrollable
+.table-top
+  p.table-top__total-count = "#{humanized_ar_collection_count(@ar_object.pagy.count, @model.ar_model.table_name)}"
+  // .table-top__column-action
+  //  button.secondary-btn.column-btn data-bs-target="#columnActionModal" data-bs-toggle="modal"
+  //    span
+  //      i.fa.fa-columns.bolder
+  //    span
+  //      i.fa.fa-angle-down
+.new-admin-table
   table.cm-table
     thead.cm-table__header
       tr.header-row
@@ -37,9 +36,9 @@
           - if @model
             == render partial: 'cm_admin/main/actions_dropdown', locals: { cm_model: @model, ar_object: ar_object }
 
-.cm-pagination
-  .cm-pagination__lhs Showing #{@ar_object.pagy.from} to #{@ar_object.pagy.to} out of #{@ar_object.pagy.count}
-  .cm-pagination__rhs
-    == render partial: 'cm_admin/main/cm_pagy_nav', locals: { pagy: @ar_object.pagy }
+  .cm-pagination
+    .cm-pagination__lhs Showing #{@ar_object.pagy.from} to #{@ar_object.pagy.to} out of #{@ar_object.pagy.count}
+    .cm-pagination__rhs
+      == render partial: 'cm_admin/main/cm_pagy_nav', locals: { pagy: @ar_object.pagy }
 
 = render partial: 'cm_admin/main/member_custom_action_modal', locals: { cm_model: @model, ar_collection: @ar_object }

data/app/views/cm_admin/main/_tabs.html.slim

@@ -4,4 +4,4 @@ ul.nav.nav-pills
       - if nav_item.custom_action.empty? || (nav_item.custom_action.present? && policy([:cm_admin, @model.name.classify.constantize]).send(:"#{nav_item.custom_action}?"))
         li.nav-item
           - nav_item_action_name = nav_item.custom_action.present? ? nav_item.custom_action : 'show'
-          = link_to nav_item.nav_item_name.to_s.titleize, cm_admin.send("#{@ar_object.model_name.singular}_#{nav_item_action_name}_path", @ar_object.id), class: "nav-link #{ nav_item_action_name == action_name ? 'active' : ''}"
+          = link_to tab_display_name(nav_item.nav_item_name), cm_admin.send("#{@ar_object.model_name.singular}_#{nav_item_action_name}_path", @ar_object.id), class: "nav-link #{ nav_item_action_name == action_name ? 'active' : ''}"

data/app/views/cm_admin/main/associated_index.html.slim

@@ -1,6 +1,5 @@
-.cm-index-page
-	.index-page
-		.index-page__table-container
-			== render partial: 'cm_admin/main/associated_table'
+.cm-index-page.associated-index
+	.cm-index-page__table-container
+		== render partial: 'cm_admin/main/associated_table'
 
-		// = column_pop_up(@associated_model)
+	// = column_pop_up(@associated_model)

data/app/views/cm_admin/main/index.html.slim

@@ -1,16 +1,15 @@
-.cm-index-page
-  .index-page.page-container
-    .sticky-container
-      == render 'cm_admin/main/top_navbar'
-      - if @model.filters.present? && @action.partial.nil?
-        .index-page__filters
-          == render partial: 'cm_admin/main/filters', locals: { filters: @model.filters }
-    .index-page__table-container
-      - if @action.partial
-        == render @action.partial
-      - else
-        == render 'cm_admin/main/table'
+.cm-index-page.cm-page-container
+  .sticky-container.page-top-bar
+    == render 'cm_admin/main/top_navbar'
+    - if @model.filters.present? && @action.partial.nil?
+      .cm-index-page__filters
+        == render partial: 'cm_admin/main/filters', locals: { filters: @model.filters }
+  .cm-index-page__table-container
+    - if @action.partial
+      == render @action.partial
+    - else
+      == render 'cm_admin/main/table'
 
-    = column_pop_up(@model)
-    = manage_column_pop_up(@model)
+  = column_pop_up(@model)
+  = manage_column_pop_up(@model)
 

data/app/views/cm_admin/main/show.html.slim

@@ -1,5 +1,5 @@
-.show-page.page-container
-  .show-page__tabs.sticky-container
+.show-page.cm-page-container
+  .show-page__tabs.sticky-container.page-top-bar
     .cm-tabs-bar
       == render 'cm_admin/main/top_navbar'
       == render 'cm_admin/main/tabs'

data/app/views/layouts/cm_admin.html.slim

@@ -19,21 +19,21 @@ html
       = render 'layouts/left_sidebar_nav'
       .panel-area
         - if defined?(@action) && (@action&.layout_type.to_s == 'cm_association_show' || @action.parent == "show")
-          .show-page.page-container
-            .show-page__tabs.sticky-container
+          .show-page.cm-page-container
+            .show-page__tabs.sticky-container.page-top-bar
               .cm-tabs-bar
                 == render 'cm_admin/main/top_navbar'
                 == render 'cm_admin/main/tabs'
             .show-page__inner.scrollable
               = yield
         - elsif defined?(@action) && (@action&.layout_type.to_s == 'cm_association_index' || @action.parent == "index")
-          .show-page.page-container
-            .show-page__tabs.sticky-container
+          .show-page.cm-page-container
+            .show-page__tabs.sticky-container.page-top-bar
               .cm-tabs-bar
                 == render 'cm_admin/main/top_navbar'
                 == render 'cm_admin/main/tabs'
                 - if @associated_model && @associated_model.filters.present?
-                  .index-page__filters
+                  .filters-bar
                     == render partial: 'cm_admin/main/filters', locals: { filters: @associated_model.filters }
             = yield
         - else

data/lib/cm_admin/model.rb

@@ -23,7 +23,7 @@ module CmAdmin
     include Pagy::Backend
     include Models::Blocks
     include Models::DslMethod
-    attr_accessor :available_actions, :actions_set, :available_fields, :permitted_fields,
+    attr_accessor :available_actions, :actions_set, :available_fields, :additional_permitted_fields,
       :current_action, :params, :filters, :available_tabs, :icon_name
     attr_reader :name, :ar_model, :is_visible_on_sidebar, :importer
 
@@ -33,6 +33,7 @@ module CmAdmin
       @is_visible_on_sidebar = true
       @icon_name = 'fa fa-th-large'
       @available_actions ||= []
+      @additional_permitted_fields ||= []
       @current_action = nil
       @available_tabs ||= []
       @available_fields ||= {index: [], show: [], edit: {fields: []}, new: {fields: []}}
@@ -94,6 +95,10 @@ module CmAdmin
       @icon_name = name
     end
 
+    def permit_additional_fields(fields=[])
+      @additional_permitted_fields = fields
+    end
+
     # Shared between export controller and resource controller
     def filter_params(params)
       # OPTIMIZE: Need to check if we can permit the filter_params in a better way

data/lib/cm_admin/models/action.rb

@@ -4,7 +4,7 @@ module CmAdmin
   module Models
     class Action
       include Actions::Blocks
-      attr_accessor :name, :verb, :layout_type, :layout, :partial, :path, :page_title, :page_description,
+      attr_accessor :name, :display_name, :verb, :layout_type, :layout, :partial, :path, :page_title, :page_description,
         :child_records, :is_nested_field, :nested_table_name, :parent, :display_if, :route_type, :code_block,
         :display_type, :action_type, :redirection_url, :sort_direction, :sort_column, :icon_name
 

data/lib/cm_admin/models/column.rb

@@ -1,8 +1,13 @@
+require_relative 'utils/associations'
+
 module CmAdmin
   module Models
     class Column
+      include Utils::Associations
+
       attr_accessor :field_name, :field_type, :header, :format, :prefix, :suffix, :exportable, :round, :height, :width,
-      :cm_css_class, :link, :url, :custom_method, :helper_method, :managable, :lockable, :drawer_partial, :tag_class, :display_if
+      :cm_css_class, :link, :url, :custom_method, :helper_method, :managable, :lockable, :drawer_partial, :tag_class,
+      :display_if, :association_name, :association_type
 
       def initialize(field_name, attributes = {})
         @field_name = field_name
@@ -16,11 +21,20 @@ module CmAdmin
         self.height = 50 if self.field_type == :image && self.height.nil?
         self.width = 50 if self.field_type == :image && self.width.nil?
         self.display_if = lambda { |arg| return true } if self.display_if.nil?
+
+        validation_for_association
       end
 
       #returns a string value as a header (either field_name or value present in header attribute)
       def format_header
-        self.header.present? ? self.header.to_s.gsub(/_/, ' ')&.upcase : self.field_name.to_s.gsub(/_/, ' ').upcase
+        header_value = if self.header.present?
+                         self.header
+                       elsif self.field_type.to_s == 'association'
+                         self.association_name
+                       else
+                         self.field_name
+                       end
+        header_value.to_s.titleize.upcase
       end
 
       def set_default_values
@@ -35,7 +49,6 @@ module CmAdmin
           model.available_fields.find { |i| i.name == search_hash[:name] }
         end
       end
-
     end
   end
 end