{"version":3,"sources":["webpack:///./Scripts/Containers/BrandsList.container.js"],"names":["BrandsListContainer","props","brands","availableCategories","useState","brandItems","setBrandItems","selectedCategory","setSelectedCategory","setVisibleBrands","category","itemToSet","x","SelectedCategories","length","className","onClick","brand","href","Url","src","ImageUrl","Name","Title","Categorys"],"mappings":"kOAEe,SAASA,EAAoBC,GAAO,IACvCC,EAAgCD,EAAhCC,OAAQC,EAAwBF,EAAxBE,oBAD+B,EAEXC,mBAASF,GAFE,WAExCG,EAFwC,KAE5BC,EAF4B,OAGCF,mBAAS,IAHV,WAGxCG,EAHwC,KAGtBC,EAHsB,KAKzCC,EAAmB,SAACC,GACtBF,EAAoBE,GACpB,IAAIC,EAAwB,IAAZD,EAAiB,IAAAR,GAAM,KAANA,GAAc,SAAAU,GAAC,aAAI,MAAAA,EAAEC,oBAAF,OAA8BH,MAAaR,EAC/FI,EAAcK,IAGlB,OACI,oCACKR,GAAuBA,EAAoBW,OAAS,GACjD,wBAAIC,UAAU,yCACV,wBAAIC,QAAS,kBAAMP,EAAiB,KAAKM,UAA+B,IAApBR,GAA0B,YAA9E,aACC,IAAAJ,GAAmB,KAAnBA,GAAwB,SAACO,GAAD,OACrB,wBAAIK,UAAWR,GAAoBG,GAAY,WAAYM,QAAS,kBAAMP,EAAiBC,KAAYA,OAIlHL,GAAcA,EAAWS,OAAS,GAC/B,wBAAIC,UAAU,eACT,IAAAV,GAAU,KAAVA,GAAe,SAACY,GAAD,aACZ,wBAAIF,UAAU,iEACV,yBAAKA,UAAU,8BACX,uBAAGG,KAAMD,EAAME,KACX,yBAAKJ,UAAU,oCACX,yBAAKK,IAAKH,EAAMI,SAAUN,UAAU,8BAExC,wBAAIA,UAAU,2BAA2BE,EAAMK,MAC/C,uBAAGP,UAAU,4BAA4BE,EAAMM,QAElDN,EAAMO,WAAaP,EAAMO,UAAUV,OAAS,GACzC,wBAAIC,UAAU,iCACT,MAAAE,EAAMO,WAAN,QAAoB,SAACd,GAAD,OACjB,wBAAIK,UAAU,+BACV,uBAAGG,KAAMR,EAASS,KAAMT,EAASY","file":"21.f23379d9317b492b5be8.js","sourcesContent":["import React, { useEffect, useState } from 'react';\r\n\r\nexport default function BrandsListContainer(props) {\r\n const { brands, availableCategories } = props;\r\n const [brandItems, setBrandItems] = useState(brands);\r\n const [selectedCategory, setSelectedCategory] = useState('');\r\n\r\n const setVisibleBrands = (category) => {\r\n setSelectedCategory(category);\r\n let itemToSet = category != '' ? brands.filter(x => x.SelectedCategories.includes(category)) : brands;\r\n setBrandItems(itemToSet);\r\n };\r\n\r\n return (\r\n <>\r\n {availableCategories && availableCategories.length > 0 &&\r\n <ul className=\"brands-list__button-container columns\">\r\n <li onClick={() => setVisibleBrands('')} className={selectedCategory == '' && 'selected'}>Visa alla</li>\r\n {availableCategories.map((category) =>\r\n <li className={selectedCategory == category && 'selected'} onClick={() => setVisibleBrands(category)}>{category}</li>\r\n )}\r\n </ul>\r\n }\r\n {brandItems && brandItems.length > 0 &&\r\n <ul className=\"brands-list\">\r\n {brandItems.map((brand) =>\r\n <li className=\"brands-list__brand-container large-3 medium-4 small-12 column\">\r\n <div className=\"brands-list__brand columns\">\r\n <a href={brand.Url}>\r\n <div className=\"brands-list__brand-image-wrapper\">\r\n <img src={brand.ImageUrl} className=\"brands-list__brand-image\" />\r\n </div>\r\n <h6 className=\"brands-list__brand-name\">{brand.Name}</h6>\r\n <p className=\"brands-list__brand-title\">{brand.Title}</p>\r\n </a>\r\n {brand.Categorys && brand.Categorys.length > 0 &&\r\n <ul className=\"brands-list__brand-categories\">\r\n {brand.Categorys.map((category) =>\r\n <li className=\"brands-list__brand-category\">\r\n <a href={category.Url}>{category.Name}</a>\r\n </li>\r\n )}\r\n </ul>\r\n }\r\n </div>\r\n </li>\r\n )}\r\n </ul>\r\n }\r\n </>\r\n );\r\n}\r\n"],"sourceRoot":""}