import RecoSelect from '@/components/atomic/RecoSelect.vue';

/*
* Builds category select modal
* -----------------------------------------------------------
* self object needs to contain the following reactive keys:
*  - category
*  - categorySelectModal
*/

export default (self, animations, callbacks, isFilterSelect) => {
	return self.$ionic.modalController.create({
      component: RecoSelect,
      enterAnimation: animations.enterAnimation,
      leaveAnimation: animations.leaveAnimation,
      componentProps: {
        propsData: {
          title: 'Select Category',
          options: self.categories,
          selected: self.category,
          backButtonClicked: callbacks.backButtonClicked ? callbacks.backButtonClicked : () => { return },
  	      doneButtonClicked: callbacks.doneButtonClicked ? callbacks.doneButtonClicked : () => { return },
          isNextButton: self.isNextButton,
          isFilterSelect,
  	      withBackButton: callbacks.backButtonClicked ? true : false,
  	      withDoneButton: callbacks.doneButtonClicked ? true : false,
        },
        methods: {
          onSelectOption(option) {
            self.category = option;
            if (callbacks.doneButtonClicked) {
              callbacks.doneButtonClicked();
            }
            self.categorySelectModal.dismiss();
          }
        }
      },
    })
    .then(m => {
      self.categorySelectModal = m;
      self.categorySelectModal.present();
    })
}