import {AthenaXAIRecommender} from '../global/recommenders/athena-recommenders.js';
import {athenaConfig, athenaConfigDemo} from '../global/athena-config.js';

export function recommenderTabs(){

    let homePageRecommenderTabs = document.querySelectorAll('.recommenders-tabs-home-page button');
    if(homePageRecommenderTabs.length){
        Array.from(homePageRecommenderTabs).forEach(function (element){
            if(element.classList.contains('active')){
                let sku = element.getAttribute('data-recommender-home-sku');
                let recommenderId = element.getAttribute('data-recommender-home-id');
                if(sku && recommenderId){
                    new AthenaXAIRecommender({
                        websiteToken: athenaConfig.websiteToken,
                        apiUrl: athenaConfigDemo.storyUrl,
                        recommenderId: recommenderId,
                        productSkus: [`${sku}`],
                        renderElementSelector: '.recommenders-home-page',
                        checkDOMContentLoaded: false
                    });
                }
            }

            element.addEventListener('click', function(){
                if(!element.classList.contains('active')){
                    Array.from(homePageRecommenderTabs).forEach(function (elementInner){
                        elementInner.classList.remove('active')
                    });
                    element.classList.add('active');
                    let sku = element.getAttribute('data-recommender-home-sku');
                    let recommenderId = element.getAttribute('data-recommender-home-id');
                    if(sku && recommenderId){
                        new AthenaXAIRecommender({
                            websiteToken: athenaConfig.websiteToken,
                            apiUrl: athenaConfigDemo.storyUrl,
                            recommenderId: recommenderId,
                            productSkus: [`${sku}`],
                            renderElementSelector: '.recommenders-home-page',
                            checkDOMContentLoaded: false
                        });
                    }
                }
            });

        });
    }

}