{"version":3,"file":"component---src-pages-opensource-index-js-17130b66619e835e3401.js","mappings":"mMAcA,MAAMA,EAAU,CACdC,MAAO,CAAC,QACRC,OAAQ,CAAC,OAAQ,QACjBC,MAAO,CAAC,OAAQ,OAAQ,QACxBC,OAAQ,CAAC,OAAQ,OAAQ,SAGrBC,EAAO,CACXJ,MAAO,CAAC,OAAQ,OAAQ,QACxBC,OAAQ,CAAC,OAAQ,QACjBC,MAAO,CAAC,QACRC,OAAQ,CAAC,SA+HX,UA5HA,SAAmBE,GAAY,IAAX,KAAEC,GAAMD,EAC1B,MAAME,EAAWD,EAAKE,kBAAkBC,MAElCC,GADeC,EAAAA,EAAAA,KACUC,MAmC/B,OACEC,EAAAA,cAACC,EAAAA,GAAM,CAACF,MAAOF,GACbG,EAAAA,cAACE,EAAAA,GAAG,CAACH,MAAM,gBAEXC,EAAAA,cAACG,EAAAA,GAAe,CACdC,MAAM,iCACNL,MAAM,cACNM,UAAU,QACVC,IAAI,mBAEJN,EAAAA,cAACO,EAAAA,EAAG,CAACC,IAAI,SACPR,EAAAA,cAACS,EAAAA,EAAS,CAACC,KAAK,SAAQ,0JAKxBV,EAAAA,cAACW,EAAAA,EAAM,CACLC,SAAO,EACPC,KAAK,6CACLC,OAAO,SACPC,IAAI,sBACJV,UAAU,QACVW,MAAM,4BAqBZhB,EAAAA,cAACiB,EAAAA,GAAa,CAACC,MAAM,SACnBlB,EAAAA,cAACmB,EAAAA,GAAc,CAACX,IAAI,QAAQjB,KAAMA,EAAML,QAASA,GAC9CQ,EAAS0B,KAAIC,IAAA,IAAC,KAAEC,GAAMD,EAAA,OACrBrB,EAAAA,cAACuB,EAAAA,GAAc,CACbC,IAAKF,EAAKG,GACV1B,MAAOuB,EAAKI,YAAY3B,MACxB4B,YAAaL,EAAKI,YAAYC,YAC9BC,KAAMN,EAAKI,YAAYE,KACvBxB,MAAOkB,EAAKI,YAAYtB,MACxByB,SAAUP,EAAKI,YAAYG,UAC3B,MAOd,C","sources":["webpack://hpe-dev-portal/./src/pages/opensource/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { graphql } from 'gatsby';\nimport { Box, Button, Paragraph } from 'grommet';\nimport {\n  OpenSourceCard,\n  Layout,\n  SEO,\n  PageDescription,\n  ResponsiveGrid,\n  SectionHeader,\n} from '../../components';\nimport { useSiteMetadata } from '../../hooks/use-site-metadata';\n\nconst columns = {\n  small: ['auto'],\n  medium: ['auto', 'auto'],\n  large: ['auto', 'auto', 'auto'],\n  xlarge: ['auto', 'auto', 'auto'],\n};\n\nconst rows = {\n  small: ['auto', 'auto', 'auto'],\n  medium: ['auto', 'auto'],\n  large: ['auto'],\n  xlarge: ['auto'],\n};\n\nfunction Opensource({ data }) {\n  const projects = data.allMarkdownRemark.edges;\n  const siteMetadata = useSiteMetadata();\n  const siteTitle = siteMetadata.title;\n  // Create box for each platform\n  // const [index, setIndex] = useState(0);\n  // let [categoryMap, setCategoryMap] = useState(new Map());\n  // const onActive = nextIndex => setIndex(nextIndex);\n  // const categoryArray = [];\n\n  // useEffect(() => {\n  //   projects.forEach(({ node }) => {\n  //     categoryArray.push(node.frontmatter.category);\n  //   });\n  //   // Reduce function returns a single value operating with an array\n  //   categoryMap = categoryArray.reduce(\n  //     (acc, e) => acc.set(e, (acc.get(e) || 0) + 1),\n  //     new Map(),\n  //   );\n  //   // categoryMap1.forEach((value, key) => {\n  //   //   // categoryMap.set(key, value);\n  //   //   setCategoryMap(prev => new Map([...prev, [key, value]]));\n  //   //   // setCategoryMap(prev => new Map(prev).set(key, value));\n  //   // });\n  //   setCategoryMap(categoryMap);\n  //   // const obj = Object.fromEntries(categoryMap);\n  //   // const iterator1 = categoryMap.entries();\n  //   // console.log('iterator', iterator1.next().value);\n\n  //   // categoryMap.forEach((value, key) => console.log(key + ' = ' + value));\n\n  //   // Object.entries(Object.fromEntries(categoryMap)).forEach(entry =>\n  //   //   console.log('key', entry[0]),\n  //   // );\n  //   // categoryMap.forEach((value, key) => {\n  //   //   console.log('myelement', key, value);\n  //   // });\n  // }, []);\n  return (\n    <Layout title={siteTitle}>\n      <SEO title=\"Open Source\" />\n      {/* <Box flex overflow=\"auto\" gap=\"large\" pad=\"xlarge\" wrap> */}\n      <PageDescription\n        image=\"/img/opensource/opensource.svg\"\n        title=\"Open Source\"\n        alignSelf=\"start\"\n        alt=\"opensource logo\"\n      >\n        <Box gap=\"small\">\n          <Paragraph size=\"large\">\n            Dedicated to innovation through collaboration, HPE is proud to lead\n            and contribute to many open source projects. Learn more about these\n            projects here.\n          </Paragraph>\n          <Button\n            primary\n            href=\"https://www.hpe.com/us/en/open-source.html\"\n            target=\"_blank\"\n            rel=\"noreferrer noopener\"\n            alignSelf=\"start\"\n            label=\"Visit HPE Open Source\"\n          />\n        </Box>\n      </PageDescription>\n      {/* <Box gap=\"medium\" pad=\"medium\">\n          <Tabs\n            // height=\"medium\"\n            // flex=\"grow\"\n            alignSelf=\"center\"\n            activeIndex={index}\n            onActive={onActive}\n          >\n            {categoryMap.forEach((value, key) => (\n              <Tab title={key}>\n                <Box margin=\"small\" pad=\"small\">\n                  <Text>{value}</Text>\n                </Box>\n              </Tab>\n            ))}\n          </Tabs>\n        </Box> */}\n      <SectionHeader color=\"green\">\n        <ResponsiveGrid gap=\"large\" rows={rows} columns={columns}>\n          {projects.map(({ node }) => (\n            <OpenSourceCard\n              key={node.id}\n              title={node.frontmatter.title}\n              description={node.frontmatter.description}\n              link={node.frontmatter.link}\n              image={node.frontmatter.image}\n              category={node.frontmatter.category}\n            />\n          ))}\n        </ResponsiveGrid>\n      </SectionHeader>\n      {/* </Box> */}\n    </Layout>\n  );\n}\nOpensource.propTypes = {\n  data: PropTypes.shape({\n    allMarkdownRemark: PropTypes.shape({\n      edges: PropTypes.arrayOf(\n        PropTypes.shape({\n          node: PropTypes.shape({\n            id: PropTypes.string,\n            frontmatter: PropTypes.shape({\n              title: PropTypes.string.isRequired,\n              category: PropTypes.string.isRequired,\n              description: PropTypes.string.isRequired,\n              image: PropTypes.string,\n              priority: PropTypes.number,\n            }).isRequired,\n            excerpt: PropTypes.string.isRequired,\n            fields: PropTypes.shape({\n              // slug: PropTypes.string.isRequired,\n              sourceInstanceName: PropTypes.string.isRequired,\n            }),\n          }).isRequired,\n        }).isRequired,\n      ).isRequired,\n    }).isRequired,\n  }).isRequired,\n};\nexport default Opensource;\nexport const pageQuery = graphql`\n  query {\n    allMarkdownRemark(\n      filter: {\n        fields: { sourceInstanceName: { eq: \"opensource\" } }\n        frontmatter: { active: { eq: true } }\n      }\n      sort: {frontmatter: {priority: ASC}}\n    ) {\n      edges {\n        node {\n          id\n          rawMarkdownBody\n          fields {\n            slug\n            sourceInstanceName\n          }\n          excerpt\n          frontmatter {\n            title\n            category\n            description\n            link\n            image\n            priority\n          }\n        }\n      }\n    }\n  }\n`;\n"],"names":["columns","small","medium","large","xlarge","rows","_ref","data","projects","allMarkdownRemark","edges","siteTitle","useSiteMetadata","title","React","Layout","SEO","PageDescription","image","alignSelf","alt","Box","gap","Paragraph","size","Button","primary","href","target","rel","label","SectionHeader","color","ResponsiveGrid","map","_ref2","node","OpenSourceCard","key","id","frontmatter","description","link","category"],"sourceRoot":""}