better_page 2.0.0

data/lib/generators/better_page/templates/custom_base_page.rb.tt

@@ -0,0 +1,83 @@
+# frozen_string_literal: true
+
+# Base class for all custom pages in this application.
+# Use for dashboards, reports, and any page that doesn't fit
+# the standard index/show/form patterns.
+#
+# Components available (from global configuration):
+#   Required: content
+#   Optional: header, footer, alerts
+#
+# Customize this class to:
+#   - Add custom components with register_component
+#   - Override helper methods
+#   - Change stream_components
+#
+# @example Add a custom component
+#   register_component :charts, default: []
+#
+class CustomBasePage < ApplicationPage
+  page_type :custom
+
+  # ─────────────────────────────────────────────────────────────────
+  # CUSTOM COMPONENTS
+  # ─────────────────────────────────────────────────────────────────
+  # Add custom components for all custom pages here:
+  #
+  # register_component :charts, default: []
+  # register_component :kpis, default: []
+  # register_component :filters, default: { enabled: false }
+
+  # Main method that builds the complete custom page configuration
+  # @return [Hash] complete custom page configuration with :klass for rendering
+  def custom
+    build_page
+  end
+
+  # The ViewComponent class used to render this custom page
+  # @return [Class] BetterPage::CustomViewComponent
+  def view_component_class
+    return BetterPage::CustomViewComponent if defined?(BetterPage::CustomViewComponent)
+
+    raise NotImplementedError, "BetterPage::CustomViewComponent not found. Run: rails g better_page:install"
+  end
+
+  # Components to include in stream updates by default
+  # Override to customize which components update via Turbo Streams
+  # @return [Array<Symbol>]
+  def stream_components
+    %i[alerts content]
+  end
+
+  protected
+
+  # Helper to build a widget section
+  # @param title [String] widget title
+  # @param type [Symbol] widget type
+  # @param data [Hash, Array] widget data
+  # @param options [Hash] additional options
+  # @return [Hash] formatted widget
+  def widget_format(title:, type:, data:, **options)
+    {
+      title: title,
+      type: type,
+      data: data,
+      **options
+    }
+  end
+
+  # Helper to build a chart configuration
+  # @param title [String] chart title
+  # @param type [Symbol] chart type (:line, :bar, :pie, etc.)
+  # @param data [Hash] chart data with labels and datasets
+  # @param options [Hash] additional chart options
+  # @return [Hash] formatted chart
+  def chart_format(title:, type:, data:, **options)
+    {
+      title: title,
+      type: type,
+      data: data,
+      **options
+    }
+  end
+end

data/lib/generators/better_page/templates/custom_page.rb.tt

@@ -0,0 +1,31 @@
+# frozen_string_literal: true
+
+<% namespace_path.each_with_index do |ns, i| -%>
+<%= "  " * i %>module <%= ns.camelize %>
+<% end -%>
+<%= "  " * namespace_path.length %>class CustomPage < CustomBasePage
+<%= "  " * namespace_path.length %>  def initialize(data, user)
+<%= "  " * namespace_path.length %>    @data = data
+<%= "  " * namespace_path.length %>    @user = user
+<%= "  " * namespace_path.length %>  end
+
+<%= "  " * namespace_path.length %>  private
+
+<%= "  " * namespace_path.length %>  # Optional: Page header configuration
+<%= "  " * namespace_path.length %>  def header
+<%= "  " * namespace_path.length %>    {
+<%= "  " * namespace_path.length %>      title: "<%= resource_name.titleize %>",
+<%= "  " * namespace_path.length %>      breadcrumbs: breadcrumbs_config
+<%= "  " * namespace_path.length %>    }
+<%= "  " * namespace_path.length %>  end
+
+<%= "  " * namespace_path.length %>  # Required: Custom content configuration
+<%= "  " * namespace_path.length %>  def content
+<%= "  " * namespace_path.length %>    {
+<%= "  " * namespace_path.length %>      # Add your custom content configuration here
+<%= "  " * namespace_path.length %>    }
+<%= "  " * namespace_path.length %>  end
+<%= "  " * namespace_path.length %>end
+<% namespace_path.reverse.each_with_index do |_, i| -%>
+<%= "  " * (namespace_path.length - i - 1) %>end
+<% end -%>

data/lib/generators/better_page/templates/edit_page.rb.tt

@@ -0,0 +1,46 @@
+# frozen_string_literal: true
+
+<% namespace_path.each_with_index do |ns, i| -%>
+<%= "  " * i %>module <%= ns.camelize %>
+<% end -%>
+<%= "  " * namespace_path.length %>class EditPage < FormBasePage
+<%= "  " * namespace_path.length %>  def initialize(<%= resource_singular %>, metadata = {})
+<%= "  " * namespace_path.length %>    @<%= resource_singular %> = <%= resource_singular %>
+<%= "  " * namespace_path.length %>    @user = metadata[:user]
+<%= "  " * namespace_path.length %>    super(<%= resource_singular %>, metadata)
+<%= "  " * namespace_path.length %>  end
+
+<%= "  " * namespace_path.length %>  private
+
+<%= "  " * namespace_path.length %>  # Required: Form header configuration
+<%= "  " * namespace_path.length %>  def header
+<%= "  " * namespace_path.length %>    {
+<%= "  " * namespace_path.length %>      title: "Edit <%= resource_singular.humanize %>",
+<%= "  " * namespace_path.length %>      description: "Update <%= resource_singular.humanize.downcase %> details.",
+<%= "  " * namespace_path.length %>      breadcrumbs: breadcrumbs_config
+<%= "  " * namespace_path.length %>    }
+<%= "  " * namespace_path.length %>  end
+
+<%= "  " * namespace_path.length %>  # Required: Form panels with fields
+<%= "  " * namespace_path.length %>  def panels
+<%= "  " * namespace_path.length %>    [
+<%= "  " * namespace_path.length %>      {
+<%= "  " * namespace_path.length %>        title: "Basic Information",
+<%= "  " * namespace_path.length %>        fields: [
+<%= "  " * namespace_path.length %>          # { name: :name, type: :text, label: "Name", required: true },
+<%= "  " * namespace_path.length %>          # { name: :email, type: :email, label: "Email" }
+<%= "  " * namespace_path.length %>        ]
+<%= "  " * namespace_path.length %>      }
+<%= "  " * namespace_path.length %>      # NOTE: Checkbox and radio fields must be in separate panels
+<%= "  " * namespace_path.length %>      # {
+<%= "  " * namespace_path.length %>      #   title: "Settings",
+<%= "  " * namespace_path.length %>      #   fields: [
+<%= "  " * namespace_path.length %>      #     { name: :is_active, type: :checkbox, label: "Active" }
+<%= "  " * namespace_path.length %>      #   ]
+<%= "  " * namespace_path.length %>      # }
+<%= "  " * namespace_path.length %>    ]
+<%= "  " * namespace_path.length %>  end
+<%= "  " * namespace_path.length %>end
+<% namespace_path.reverse.each_with_index do |_, i| -%>
+<%= "  " * (namespace_path.length - i - 1) %>end
+<% end -%>

data/lib/generators/better_page/templates/form_base_page.rb.tt

@@ -0,0 +1,126 @@
+# frozen_string_literal: true
+
+# Base class for all form pages (new/edit) in this application.
+#
+# FORM ORGANIZATION RULES (MANDATORY):
+# =====================================
+#
+# RULE 1: INPUT TYPE SEPARATION
+# - CHECKBOX fields must be grouped in dedicated panels
+# - RADIO BUTTON fields must be grouped in dedicated panels
+# - Text, email, select, textarea, number, date can be mixed together
+#
+# Components available (from global configuration):
+#   Required: header, panels
+#   Optional: alerts, errors, footer
+#
+# Customize this class to:
+#   - Add custom components with register_component
+#   - Override helper methods
+#   - Change stream_components
+#
+class FormBasePage < ApplicationPage
+  page_type :form
+
+  # ─────────────────────────────────────────────────────────────────
+  # CUSTOM COMPONENTS
+  # ─────────────────────────────────────────────────────────────────
+  # Add custom components for all form pages here:
+  #
+  # register_component :sidebar_help, default: nil
+  # register_component :preview, default: { enabled: false }
+
+  # Main method that builds the complete form page configuration
+  # @return [Hash] complete form page configuration with :klass for rendering
+  def form
+    result = build_page
+    validate_form_panels_rules(result[:panels]) if result[:panels]
+    result
+  end
+
+  # The ViewComponent class used to render this form page
+  # @return [Class] BetterPage::FormViewComponent
+  def view_component_class
+    return BetterPage::FormViewComponent if defined?(BetterPage::FormViewComponent)
+
+    raise NotImplementedError, "BetterPage::FormViewComponent not found. Run: rails g better_page:install"
+  end
+
+  # Components to include in stream updates by default
+  # Override to customize which components update via Turbo Streams
+  # @return [Array<Symbol>]
+  def stream_components
+    %i[alerts errors panels]
+  end
+
+  protected
+
+  # Validates that all panels follow the input separation rules
+  # Logs warnings in development mode when rules are violated
+  # @param panels [Array<Hash>] panels to validate
+  # @return [void]
+  def validate_form_panels_rules(panels)
+    return unless defined?(Rails) && Rails.env.development?
+
+    panels.each_with_index do |panel, index|
+      next unless panel[:fields].is_a?(Array)
+
+      checkbox_count = panel[:fields].count { |field| field[:type] == :checkbox }
+      radio_count = panel[:fields].count { |field| field[:type] == :radio }
+      other_count = panel[:fields].count { |field| %i[checkbox radio].exclude?(field[:type]) }
+
+      if checkbox_count.positive? && other_count.positive?
+        Rails.logger.warn "[FormBasePage] RULE VIOLATION in panel '#{panel[:title]}' (#{index}): " \
+                          "checkboxes mixed with other inputs"
+      end
+
+      if radio_count.positive? && other_count.positive?
+        Rails.logger.warn "[FormBasePage] RULE VIOLATION in panel '#{panel[:title]}' (#{index}): " \
+                          "radio buttons mixed with other inputs"
+      end
+    end
+  end
+
+  # Helper to build a form field
+  # @param name [Symbol] field name
+  # @param type [Symbol] field type (:text, :email, :select, :checkbox, etc.)
+  # @param label [String] field label
+  # @param options [Hash] additional options (required, placeholder, collection, etc.)
+  # @return [Hash] formatted field
+  def field_format(name:, type:, label:, **options)
+    {
+      name: name,
+      type: type,
+      label: label,
+      **options
+    }
+  end
+
+  # Helper to build a form panel
+  # @param title [String] panel title
+  # @param fields [Array<Hash>] panel fields
+  # @param description [String, nil] panel description
+  # @param icon [String, nil] panel icon
+  # @return [Hash] formatted panel
+  def panel_format(title:, fields:, description: nil, icon: nil)
+    panel = {
+      title: title,
+      fields: fields
+    }
+    panel[:description] = description if description
+    panel[:icon] = icon if icon
+    panel
+  end
+
+  # Default breadcrumbs for forms
+  # @return [Array<Hash>] empty breadcrumbs
+  def default_breadcrumbs
+    []
+  end
+
+  # Extract resource name from class name
+  # @return [String] downcased resource name
+  def resource_name
+    self.class.name.split("::").last.gsub(/Page$/, "").downcase
+  end
+end

data/lib/generators/better_page/templates/index_base_page.rb.tt

@@ -0,0 +1,65 @@
+# frozen_string_literal: true
+
+# Base class for all index/list pages in this application.
+#
+# Components available (from global configuration):
+#   Required: header, table
+#   Optional: alerts, statistics, metrics, tabs, search, pagination,
+#             overview, calendar, footer, modals, split_view
+#
+# Customize this class to:
+#   - Add custom components with register_component
+#   - Override helper methods
+#   - Change stream_components
+#
+# @example Add a custom component
+#   register_component :sidebar, default: { enabled: false }
+#
+class IndexBasePage < ApplicationPage
+  page_type :index
+
+  # ─────────────────────────────────────────────────────────────────
+  # CUSTOM COMPONENTS
+  # ─────────────────────────────────────────────────────────────────
+  # Add custom components for all index pages here:
+  #
+  # register_component :filters, default: []
+  # register_component :bulk_actions, default: { enabled: false }
+
+  # Main method that builds the complete index page configuration
+  # @return [Hash] complete index page configuration with :klass for rendering
+  def index
+    build_page
+  end
+
+  # The ViewComponent class used to render this index page
+  # @return [Class] BetterPage::IndexViewComponent
+  def view_component_class
+    return BetterPage::IndexViewComponent if defined?(BetterPage::IndexViewComponent)
+
+    raise NotImplementedError, "BetterPage::IndexViewComponent not found. Run: rails g better_page:install"
+  end
+
+  # Components to include in stream updates by default
+  # Override to customize which components update via Turbo Streams
+  # @return [Array<Symbol>]
+  def stream_components
+    %i[alerts statistics table pagination]
+  end
+
+  protected
+
+  # Helper for split view empty state
+  # @param icon [String] icon name
+  # @param title [String] title text
+  # @param message [String] message text
+  # @return [Hash] empty state configuration
+  def split_view_empty_state_format(icon: "hand-pointer", title: "Select an item",
+                                    message: "Click on an item from the list to see its details")
+    {
+      icon: icon,
+      title: title,
+      message: message
+    }
+  end
+end

data/lib/generators/better_page/templates/index_page.rb.tt

@@ -0,0 +1,56 @@
+# frozen_string_literal: true
+
+<% namespace_path.each_with_index do |ns, i| -%>
+<%= "  " * i %>module <%= ns.camelize %>
+<% end -%>
+<%= "  " * namespace_path.length %>class IndexPage < IndexBasePage
+<%= "  " * namespace_path.length %>  def initialize(<%= resource_plural %>, metadata = {})
+<%= "  " * namespace_path.length %>    @<%= resource_plural %> = <%= resource_plural %>
+<%= "  " * namespace_path.length %>    @user = metadata[:user]
+<%= "  " * namespace_path.length %>    @params = metadata[:params] || {}
+<%= "  " * namespace_path.length %>    super(<%= resource_plural %>, metadata)
+<%= "  " * namespace_path.length %>  end
+
+<%= "  " * namespace_path.length %>  private
+
+<%= "  " * namespace_path.length %>  # Required: Page header configuration
+<%= "  " * namespace_path.length %>  def header
+<%= "  " * namespace_path.length %>    {
+<%= "  " * namespace_path.length %>      title: "<%= resource_name.titleize %>",
+<%= "  " * namespace_path.length %>      breadcrumbs: breadcrumbs_config,
+<%= "  " * namespace_path.length %>      metadata: [],
+<%= "  " * namespace_path.length %>      actions: [
+<%= "  " * namespace_path.length %>        # { label: "New", path: new_<%= resource_singular %>_path, icon: "plus", style: "primary" }
+<%= "  " * namespace_path.length %>      ]
+<%= "  " * namespace_path.length %>    }
+<%= "  " * namespace_path.length %>  end
+
+<%= "  " * namespace_path.length %>  # Required: Table configuration
+<%= "  " * namespace_path.length %>  def table
+<%= "  " * namespace_path.length %>    {
+<%= "  " * namespace_path.length %>      items: @<%= resource_plural %>,
+<%= "  " * namespace_path.length %>      columns: [
+<%= "  " * namespace_path.length %>        # { key: :id, label: "ID", type: :text },
+<%= "  " * namespace_path.length %>        # { key: :name, label: "Name", type: :link, path: ->(item) { <%= resource_singular %>_path(item) } }
+<%= "  " * namespace_path.length %>      ],
+<%= "  " * namespace_path.length %>      actions: table_actions,
+<%= "  " * namespace_path.length %>      empty_state: {
+<%= "  " * namespace_path.length %>        icon: "inbox",
+<%= "  " * namespace_path.length %>        title: "No <%= resource_plural.humanize.downcase %> found",
+<%= "  " * namespace_path.length %>        message: "There are no <%= resource_plural.humanize.downcase %> to display at the moment."
+<%= "  " * namespace_path.length %>      }
+<%= "  " * namespace_path.length %>    }
+<%= "  " * namespace_path.length %>  end
+
+<%= "  " * namespace_path.length %>  def table_actions
+<%= "  " * namespace_path.length %>    lambda { |item|
+<%= "  " * namespace_path.length %>      [
+<%= "  " * namespace_path.length %>        # { label: "View", path: <%= resource_singular %>_path(item), icon: "eye", style: "secondary" },
+<%= "  " * namespace_path.length %>        # { label: "Edit", path: edit_<%= resource_singular %>_path(item), icon: "edit", style: "secondary" }
+<%= "  " * namespace_path.length %>      ]
+<%= "  " * namespace_path.length %>    }
+<%= "  " * namespace_path.length %>  end
+<%= "  " * namespace_path.length %>end
+<% namespace_path.reverse.each_with_index do |_, i| -%>
+<%= "  " * (namespace_path.length - i - 1) %>end
+<% end -%>

data/lib/generators/better_page/templates/javascript/controllers/app_nav_controller.js

@@ -0,0 +1,57 @@
+import { Controller } from "@hotwired/stimulus"
+
+/**
+ * AppNav Controller
+ *
+ * A Stimulus controller for the application navigation bar.
+ * Connects to data-controller="app-nav"
+ *
+ * Features:
+ * - Toggle mobile navigation menu
+ * - Toggle notification panel
+ *
+ * Usage:
+ *   <nav data-controller="app-nav">
+ *     <button data-action="click->app-nav#toggleMobile">
+ *       <svg data-app-nav-target="menuIcon">...</svg>
+ *       <svg data-app-nav-target="closeIcon" class="hidden">...</svg>
+ *     </button>
+ *     <div data-app-nav-target="mobileMenu" class="hidden">
+ *       <!-- mobile menu content -->
+ *     </div>
+ *     <button data-action="click->app-nav#toggleNotification">
+ *       Notifications
+ *     </button>
+ *     <div data-app-nav-target="notificationPanel" class="hidden">
+ *       <!-- notification content -->
+ *     </div>
+ *   </nav>
+ */
+export default class extends Controller {
+  static targets = ["mobileMenu", "menuIcon", "closeIcon", "notificationPanel"]
+
+  /**
+   * Toggle the mobile navigation menu visibility
+   * Swaps between hamburger and close icons
+   */
+  toggleMobile() {
+    if (this.hasMobileMenuTarget) {
+      this.mobileMenuTarget.classList.toggle("hidden")
+    }
+    if (this.hasMenuIconTarget) {
+      this.menuIconTarget.classList.toggle("hidden")
+    }
+    if (this.hasCloseIconTarget) {
+      this.closeIconTarget.classList.toggle("hidden")
+    }
+  }
+
+  /**
+   * Toggle the notification panel visibility
+   */
+  toggleNotification() {
+    if (this.hasNotificationPanelTarget) {
+      this.notificationPanelTarget.classList.toggle("hidden")
+    }
+  }
+}

data/lib/generators/better_page/templates/javascript/controllers/drawer_controller.js

@@ -0,0 +1,99 @@
+import { Controller } from "@hotwired/stimulus"
+
+/**
+ * Drawer Controller
+ *
+ * A Stimulus controller for slide-out drawer panels.
+ * Connects to data-controller="drawer"
+ *
+ * Usage:
+ *   <div data-controller="drawer" data-drawer-direction-value="right">
+ *     <button data-action="click->drawer#open">Open Drawer</button>
+ *
+ *     <div data-drawer-target="container" class="hidden">
+ *       <div data-drawer-target="backdrop" data-action="click->drawer#backdropClick"></div>
+ *       <div data-drawer-target="panel">
+ *         <button data-action="click->drawer#close">Close</button>
+ *         <!-- content -->
+ *       </div>
+ *     </div>
+ *   </div>
+ */
+export default class extends Controller {
+  static targets = ["container", "panel", "backdrop"]
+  static values = {
+    direction: { type: String, default: "right" },
+    open: { type: Boolean, default: false },
+    confirmClose: { type: Boolean, default: false }
+  }
+
+  connect() {
+    this.boundKeydown = this.keydown.bind(this)
+    document.addEventListener("keydown", this.boundKeydown)
+  }
+
+  disconnect() {
+    document.removeEventListener("keydown", this.boundKeydown)
+    document.body.classList.remove("overflow-hidden")
+  }
+
+  open() {
+    this.openValue = true
+    this.containerTarget.classList.remove("hidden")
+    document.body.classList.add("overflow-hidden")
+
+    // Trigger animation on next frame
+    requestAnimationFrame(() => {
+      this.panelTarget.classList.remove(this.hiddenClass)
+      this.backdropTarget.classList.remove("opacity-0")
+    })
+  }
+
+  close() {
+    this.openValue = false
+    this.panelTarget.classList.add(this.hiddenClass)
+    this.backdropTarget.classList.add("opacity-0")
+
+    // Wait for animation to complete
+    setTimeout(() => {
+      this.containerTarget.classList.add("hidden")
+      document.body.classList.remove("overflow-hidden")
+    }, 300)
+  }
+
+  toggle() {
+    this.openValue ? this.close() : this.open()
+  }
+
+  requestClose() {
+    if (this.confirmCloseValue) {
+      if (confirm("Sei sicuro di voler chiudere? I dati non salvati andranno persi.")) {
+        this.close()
+      }
+    } else {
+      this.close()
+    }
+  }
+
+  keydown(event) {
+    if (event.key === "Escape" && this.openValue) {
+      this.requestClose()
+    }
+  }
+
+  backdropClick(event) {
+    if (event.target === this.backdropTarget) {
+      this.requestClose()
+    }
+  }
+
+  get hiddenClass() {
+    const classes = {
+      right: "translate-x-full",
+      left: "-translate-x-full",
+      top: "-translate-y-full",
+      bottom: "translate-y-full"
+    }
+    return classes[this.directionValue] || "translate-x-full"
+  }
+}

data/lib/generators/better_page/templates/javascript/controllers/dropdown_controller.js

@@ -0,0 +1,60 @@
+import { Controller } from "@hotwired/stimulus"
+
+// Connects to data-controller="dropdown"
+export default class extends Controller {
+  static targets = ["menu"]
+
+  connect() {
+    this.boundHide = this.hide.bind(this)
+    this.boundUpdatePosition = this.updatePosition.bind(this)
+    document.addEventListener("click", this.boundHide)
+    window.addEventListener("scroll", this.boundUpdatePosition, true)
+    window.addEventListener("resize", this.boundUpdatePosition)
+  }
+
+  disconnect() {
+    document.removeEventListener("click", this.boundHide)
+    window.removeEventListener("scroll", this.boundUpdatePosition, true)
+    window.removeEventListener("resize", this.boundUpdatePosition)
+  }
+
+  toggle(event) {
+    event.stopPropagation()
+    const isHidden = this.menuTarget.classList.contains("hidden")
+
+    if (isHidden) {
+      this.menuTarget.classList.remove("hidden")
+      this.menuTarget.style.position = "fixed"
+      this.updatePosition()
+    } else {
+      this.menuTarget.classList.add("hidden")
+    }
+  }
+
+  updatePosition() {
+    if (this.menuTarget.classList.contains("hidden")) return
+
+    const button = this.element.querySelector("button")
+    const rect = button.getBoundingClientRect()
+    const menuRect = this.menuTarget.getBoundingClientRect()
+
+    // Posiziona sotto il bottone, allineato a destra
+    let top = rect.bottom + 8
+    let left = rect.right - menuRect.width
+
+    // Controlla se esce dalla viewport
+    if (left < 0) left = rect.left
+    if (top + menuRect.height > window.innerHeight) {
+      top = rect.top - menuRect.height - 8
+    }
+
+    this.menuTarget.style.top = `${top}px`
+    this.menuTarget.style.left = `${left}px`
+  }
+
+  hide(event) {
+    if (!this.element.contains(event.target)) {
+      this.menuTarget.classList.add("hidden")
+    }
+  }
+}

data/lib/generators/better_page/templates/javascript/controllers/index.js

@@ -0,0 +1,36 @@
+// BetterPage Stimulus Controllers
+// This file exports all controllers for easy registration
+
+import DropdownController from "./dropdown_controller"
+import TableController from "./table_controller"
+import DrawerController from "./drawer_controller"
+import ModalController from "./modal_controller"
+import TabsController from "./tabs_controller"
+import SidebarController from "./sidebar_controller"
+import AppNavController from "./app_nav_controller"
+
+// Export individual controllers
+export { DropdownController, TableController, DrawerController, ModalController, TabsController, SidebarController, AppNavController }
+
+// Helper function to register all controllers at once
+export function registerBetterPageControllers(application) {
+  application.register("dropdown", DropdownController)
+  application.register("table", TableController)
+  application.register("drawer", DrawerController)
+  application.register("modal", ModalController)
+  application.register("tabs", TabsController)
+  application.register("sidebar", SidebarController)
+  application.register("app-nav", AppNavController)
+}
+
+// Default export for convenience
+export default {
+  DropdownController,
+  TableController,
+  DrawerController,
+  ModalController,
+  TabsController,
+  SidebarController,
+  AppNavController,
+  registerBetterPageControllers
+}