{"version":3,"sources":["webpack:///./src/components/elements/audio-grid.js","webpack:///./src/hooks/use-asmet-audios.js","webpack:///./src/pages/audios.js"],"names":["filtersTypeDefault","Todos","type","label","Cuna","Programa","Entrevista","Otro","AudioGrid","allAudios","location","useLocation","queryString","parse","search","t","c","useState","categories","setCategories","filterType","updateFilterType","filterCategory","updateFilterCategory","filteredAudios","setFilteredAudios","useEffect","updateCategories","filteredArr","el","blog_subcategorias","nombre","length","tipo","filteredArr2","navigate","arr","newCategories","id","slug","forEach","ca","className","Object","keys","map","f","i","key","name","defaultValue","onChange","checked","htmlFor","audio","index","controls","src","archivo","publicURL","default","kind","srcLang","titulo","format","publicado_en","to","role","defaultProps","strapiId","useAsmetAudios","useStaticQuery","allStrapiMediaAudio","edges","AudiosPage","asmetHome","useAsmetHome","flattenAudios","concat","values","meta","og_titulo","crumbs","path","menuSecundario","menu_secundario"],"mappings":"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","file":"component---src-pages-audios-js-c1bb551cd6271932f2c6.js","sourcesContent":["import React, { useState, useEffect } from \"react\"\nimport PropTypes from \"prop-types\"\nimport Moment from \"react-moment\"\nimport { Link } from \"gatsby\"\nimport _ from \"lodash\"\n\nimport { useLocation, navigate } from \"@reach/router\"\nimport queryString from \"query-string\"\n\n// Default Filters by Type\nconst filtersTypeDefault = {\n  Todos: {\n    type: \"Todos\",\n    label: \"Todos\",\n  },\n  Cuna: {\n    type: \"Cuna\",\n    label: \"Cuña\",\n  },\n  Programa: {\n    type: \"Programa\",\n    label: \"Programa\",\n  },\n  Entrevista: {\n    type: \"Entrevista\",\n    label: \"Entrevista\",\n  },\n  Otro: {\n    type: \"Otro\",\n    label: \"Otro\",\n  },\n}\n\nconst AudioGrid = ({ allAudios }) => {\n  const location = useLocation()\n  // Get variables (t,c) from Url params\n  let { t, c } = queryString.parse(location.search)\n  t = t in filtersTypeDefault ? t : \"Todos\"\n\n  const [categories, setCategories] = useState([])\n  const [filterType, updateFilterType] = useState(t || \"Todos\")\n  const [filterCategory, updateFilterCategory] = useState(c || \"Todos\")\n  const [filteredAudios, setFilteredAudios] = useState(allAudios)\n\n  useEffect(() => {\n    if (filterType === \"Todos\") {\n      updateCategories(allAudios)\n      if (filterCategory === \"Todos\") {\n        setFilteredAudios(allAudios)\n      } else {\n        let filteredArr = _.filter(allAudios, function (el) {\n          return _.filter(el.blog_subcategorias, { nombre: filterCategory })\n            .length > 0\n            ? el\n            : null\n        })\n        setFilteredAudios(filteredArr)\n      }\n    } else {\n      let filteredArr = _.filter(allAudios, { tipo: filterType })\n      updateCategories(filteredArr)\n      if (filterCategory === \"Todos\") {\n        setFilteredAudios(filteredArr)\n      } else {\n        let filteredArr2 = _.filter(filteredArr, function (el) {\n          return _.filter(el.blog_subcategorias, { nombre: filterCategory })\n            .length > 0\n            ? el\n            : null\n        })\n        setFilteredAudios(filteredArr2)\n      }\n    }\n  }, [filterType, filterCategory, allAudios])\n\n  useEffect(() => {\n    navigate(`?t=${filterType}&c=${filterCategory}`)\n  }, [filterType, filterCategory])\n\n  const updateCategories = arr => {\n    let newCategories = [{ id: \"01\", slug: \"todos\", nombre: \"Todos\" }]\n    arr.forEach(el => {\n      el.blog_subcategorias.forEach(ca => {\n        newCategories = [...newCategories, ca]\n      })\n    })\n    setCategories(_.uniqBy(newCategories, \"id\"))\n  }\n\n  return (\n    <div className=\"asm-media-grid\">\n      <div className=\"row justify-content-center mb-5\">\n        {Object.keys(filtersTypeDefault).map((f, i) => (\n          <div className=\"form-check form-check-inline\" key={i}>\n            <input\n              className=\"form-check-input\"\n              type=\"radio\"\n              name=\"filterTypeAudioRadios\"\n              id={`typeAudio${filtersTypeDefault[f].type}`}\n              defaultValue={filtersTypeDefault[f].type || \"\"}\n              onChange={() => updateFilterType(filtersTypeDefault[f].type)}\n              {...(filterType === filtersTypeDefault[f].type\n                ? { checked: true }\n                : { checked: false })}\n            />\n            <label\n              className=\"form-check-label\"\n              htmlFor={`typeAudio${filtersTypeDefault[f].type}`}\n            >\n              {filtersTypeDefault[f].label}\n            </label>\n          </div>\n        ))}\n      </div>\n      <div className=\"row mb-5\">\n        {categories.map((c, i) => (\n          <div className=\"form-check form-check-inline\" key={i}>\n            <input\n              className=\"form-check-input\"\n              type=\"radio\"\n              name=\"filterCategoryAudioRadios\"\n              id={`categoryAudio${c.nombre}`}\n              defaultValue={c.nombre || \"\"}\n              onChange={() => updateFilterCategory(c.nombre)}\n              {...(filterCategory === c.nombre\n                ? { checked: true }\n                : { checked: false })}\n            />\n            <label className=\"form-check-label\" htmlFor={`categoryAudio${c.nombre}`}>\n              {c.nombre}\n            </label>\n          </div>\n        ))}\n      </div>\n      <div className=\"row row-cols-1 row-cols-md-3\">\n        {filteredAudios.length > 0 ? (\n          filteredAudios.map((audio, index) => {\n            return (\n              <div className=\"col mb-5\" key={index}>\n                <div className=\"card h-100 rounded-0 border-0\">\n                  <audio\n                    controls\n                    className=\"w-100\"\n                    src={audio.archivo.publicURL}\n                  >\n                    <track default kind=\"captions\" srcLang=\"en\" />\n                    Su navegador no soporta elementos de\n                    <code>audio</code>.\n                  </audio>\n                  <div className=\"card-body\">\n                    {audio.tipo && (\n                      <p className=\"card-subtitle\">\n                        <i className=\"fa fa-headphones mr-1\"></i>\n                        {audio.tipo}\n                      </p>\n                    )}\n                    <h5 className=\"card-title\">{audio.titulo}</h5>\n                    <p className=\"card-text mb-0\">\n                      Publicado el&nbsp;\n                      <Moment format=\"LL\">{audio.publicado_en}</Moment>\n                    </p>\n                    <Link\n                      to={`/audios/${audio.slug}`}\n                      className=\"stretched-link\"\n                    ></Link>\n                  </div>\n                  <div className=\"card-footer\">\n                    <div className=\"card-tags\">\n                      {audio.blog_subcategorias.map((c, i) => (\n                        <span key={i} className=\"badge badge-info mr-1\">\n                          {c.nombre}\n                        </span>\n                      ))}\n                    </div>\n                  </div>\n                </div>\n              </div>\n            )\n          })\n        ) : (\n          <div className=\"alert alert-info\" role=\"alert\">\n            {`Ops! No encontramos ningún audio con la categoría \"${filterCategory}\"`}\n          </div>\n        )}\n      </div>\n    </div>\n  )\n}\n\nAudioGrid.propTypes = {\n  allAudios: PropTypes.arrayOf(\n    PropTypes.shape({\n      strapiId: PropTypes.string,\n      slug: PropTypes.string.isRequired,\n      titulo: PropTypes.string.isRequired,\n      publicado_en: PropTypes.string.isRequired,\n      archivo: PropTypes.shape({\n        publicURL: PropTypes.string.isRequired,\n      }),\n      tipo: PropTypes.string,\n      blog_subcategorias: PropTypes.arrayOf(\n        PropTypes.shape({\n          slug: PropTypes.string.isRequired,\n          nombre: PropTypes.string.isRequired,\n        })\n      ),\n    })\n  ).isRequired,\n}\n\nAudioGrid.defaultProps = {\n  allAudios: [\n    {\n      strapiId: `5ff3ac07ce1b5e19cb07092b`,\n      slug: `cambio-de-regimen`,\n      titulo: `Cambio de régimen`,\n      publicado_en: `2020-12-17T17:00:00.000Z`,\n      archivo: {\n        publicURL: `/static/0c481e87f2774b1bd41a0a70d9b70d11/4d1eaa21992d880810d7f98e7ceb959d.mp3`,\n      },\n      tipo: `Entrevista`,\n      blog_subcategorias: [\n        {\n          slug: `vih`,\n          nombre: `VIH`,\n        },\n      ],\n    },\n  ],\n}\n\nexport default AudioGrid\n","import { useStaticQuery, graphql } from \"gatsby\"\n\nexport const useAsmetAudios = () => {\n  const data = useStaticQuery(\n    graphql`\n      query AudiosQuery {\n        allStrapiMediaAudio(sort: { order: DESC, fields: publicado_en }) {\n          edges {\n            node {\n              strapiId\n              slug\n              titulo\n              meta {\n                og_titulo\n                og_imagen {\n                  publicURL\n                }\n                og_descripcion\n              }\n              publicado_en\n              descripcion\n              archivo {\n                publicURL\n              }\n              tipo\n              blog_subcategorias {\n                id\n                slug\n                nombre\n              }\n            }\n          }\n        }\n      }\n    `\n  )\n  return data.allStrapiMediaAudio.edges\n}\n","import React from \"react\"\n\n// Layout\nimport Layout from \"../components/layout\"\n// Components\nimport Menu from \"../components/home/menu\"\nimport Breadcrumb from \"../components/elements/breadcrumb\"\nimport AudioGrid from \"../components/elements/audio-grid\"\n// Hooks\nimport { useAsmetHome } from \"../hooks/use-asmet-home\"\nimport { useAsmetAudios } from \"../hooks/use-asmet-audios\"\n\nconst AudiosPage = () => {\n  const asmetHome = useAsmetHome()\n  const allAudios = useAsmetAudios()\n\n  const crumbs = [\n    { path: `/media`, label: \"Media\" },\n    { path: `/audios`, label: \"Audios\" },\n  ]\n\n  let flattenAudios = []\n  allAudios.forEach(el => {\n    flattenAudios = flattenAudios.concat(Object.values(el))\n  })\n\n  return (\n    <Layout meta={{ og_titulo: \"Audios\" }}>\n      <div id=\"asm-template-header\" className=\"contanier-fluid pt-3 pb-3\">\n        <div className=\"container\">\n          <div className=\"row\">\n            <div className=\"col\">\n              <Breadcrumb crumbs={crumbs} />\n              <h3 className=\"text-white-alpha text-left pt-4\">Galería de Audios</h3>\n            </div>\n          </div>\n        </div>\n      </div>\n      <div className=\"asm-media-main container my-5\">\n        <AudioGrid allAudios={flattenAudios} />\n      </div>\n      <hr />\n      <Menu menuSecundario={asmetHome.menu_secundario}/>\n    </Layout>\n  )\n}\n\nexport default AudiosPage\n"],"sourceRoot":""}