Controller Inheritance, Polymorphism, and Markup

1

I have a basic “search_route” controller that provides type-ahead functionality and works great in conjunction with Turbo. I’d like to take portions of my application offline and to do that, I want to create an “offline_search_route” controller, and substitute it in where the original online version was. To do this, I was thinking I’d just extend and override “search_route” controller. I quickly run into difficulties because the controller dictates how actions, targets and outlets are defined in the the markup. For example, because the data-controller is defined as search-route, if I want to substitute in offline-search-route, I must then also change data-search-route-new-climb-outlet to data-offline-search-route-new-climb-outlet, and any other targets or params that are used deeper in my markup.

  #searchRouteModal.modal.fade{"data-controller": "search-route",  "data-search-route-new-climb-outlet": "#climbModal"}
    .modal-dialog
      .modal-content
        .modal-header
          %h5.modal-title Route Search
          %button.btn-close{"aria-label" => "Close", "data-bs-dismiss" => "modal", :type => "button"}
        .modal-body
          - if offline?
            = render partial: "routes/offline_search_form"
          - else
            = render partial: "routes/online_search_form"

This must be a fairly common scenario. How do you deal with this?

2

You could make your search-controller extend your new offline-search-controller instead of the other way around. Then you wouldn’t have to change your markup, you would however have to change your original controller