Component not accessible from route

My ember app uses a pod structure so that I have a structure similar to:

├───pods
│   ├───application
│   ├───components
│   │   └───modal-picker
│   ├───login
│   ├───profile
│   │   ├───energy
│   │   │   └───source
│   │   ├───food
│   │   ├───transport
│   │   ├───travel
│   │   └───user
│   └───register

I have a component modal-picker component that I want to inject into the profile/transport template as follows:

  <form>
    <button class="btn btn-primary" {{action 'showPicker' 'modal-picker'}}><i class="fa fa-plus"></i> Car</button>
    {{outlet 'modal-picker'}}
  </form>

The showPicker action triggers the display of said picker via an action configured in the route:

showPicker: (name, model)->
       @render('modal-picker', Ember.Object.create().reopen
         outlet: 'modal-picker'
       )

here's the code in the component

`import Ember from 'ember'`

ModalPickerComponent = Ember.Component.extend

  actions:
    show: (->
      @.$('.modal').modal().on 'hidden.bs.modal', =>
        @sendAction 'action', vehicule
    ).on('didInsertElement')

    pick: (vehicule)->
      @.$('.modal').modal('hide')
      @sendAction 'action', vehicule

`export default ModalPickerComponent`

When I click on the showPicker button I get the following error:

Error: Assertion Failed: Could not find "modal-picker" template or view.

I tried doing an import of the component by adding the following line to my ProfileTransportRoute

`import ModalPickerComponent from 'components/modal-picker'`

But then I get the following error:

 Could not find module `components/modal-picker` imported from `impact-frontend/pods/profile/transport/route`

I also tried variations of the import, but without success.

am I doing something fundamentally wrong?