{"version":3,"sources":["webpack:///./src/pages/work.js"],"names":["WorkPage","props","state","visible","loadMore","bind","this","setState","prevState","render","works","get","metaData","data","hero","size","isHidden","text","servicesNav","location","className","slice","map","index","node","key","style","alignItems","industry","services","service","src","companyLogo","file","url","alt","companyName","length","type","onClick","React","Component","pageQuery"],"mappings":"4PAMMA,E,YAEF,WAAYC,GAAQ,IAAD,SACf,cAAMA,IAAN,MAEKC,MAAQ,CAClBC,QAAQ,GAGT,EAAKC,SAAW,EAAKA,SAASC,KAAd,QAPK,E,oCAUnBD,SAAA,WACFE,KAAKC,UAAS,SAACC,GACd,MAAO,CACNL,QAAQK,EAAUL,QAAU,O,EAK5BM,OAAA,WACI,IAAMC,EAAQC,IAAIL,KAAM,yCAClBM,EAAWD,IAAIL,KAAKL,MAAO,wCAE3BY,EAAO,CACTC,KAAK,YACLC,KAAK,YACLC,UAAU,EACVC,KAAM,WACNC,YANgBP,IAAIL,KAAKL,MAAM,wCAQnC,OACI,kBAAC,IAAD,CAAQkB,SAAUb,KAAKL,MAAMkB,SAAUN,KAAMA,GACzC,kBAAC,IAAD,CAAUD,SAAUA,IACpB,yBAAKQ,UAAU,gBAEXV,EAAMW,MAAM,EAAGf,KAAKJ,MAAMC,SAASmB,KAAI,WAAQC,GAAW,IAAjBC,EAAgB,EAAhBA,KACrC,OACI,yBAAKJ,UAAU,UAAUK,IAAKF,GAC1B,yBAAKH,UAAU,aACX,yBAAKA,UAAU,uBACX,yBAAKA,UAAU,eACX,yBAAKA,UAAU,OACX,yBAAKA,UAAU,UAAUM,MAAO,CAACC,WAAW,WACxC,yBAAKP,UAAU,iCACX,wBAAIA,UAAU,kCAAd,aACeI,EAAKI,UAEpB,wBAAIR,UAAU,kCAAd,aAGA,wBAAIA,UAAU,aAEVI,EAAKK,SAASP,KAAI,SAACQ,EAAQP,GACvB,OACI,wBAAIE,IAAKF,GACJO,QAOrB,yBAAKV,UAAU,eACX,4BAAQA,UAAU,SACd,yBAAKW,IAAKP,EAAKQ,YAAYC,KAAKC,IAAKC,IAAKX,EAAKY,yBAYzF9B,KAAKJ,MAAMC,QAAUO,EAAM2B,QACzB,yBAAKjB,UAAU,uBACX,yBAAKA,UAAU,eACX,yBAAKA,UAAU,qBACX,4BAAQA,UAAU,6BAA6BkB,KAAK,SAASC,QAASjC,KAAKF,UAA3E,mB,GAjFToC,IAAMC,WA8FdzC,YAER,IAAM0C,EAAS","file":"component---src-pages-work-js-daa96bc565edc6cfd5e9.js","sourcesContent":["import React from 'react'\nimport {graphql} from 'gatsby'\nimport get from 'lodash/get'\nimport SiteMeta from '../components/meta-data'\nimport Layout from '../components/layout'\n\nclass WorkPage extends React.Component {\n\n    constructor(props) {\n        super(props)\n\n        this.state = {\n\t\t\tvisible:4,\n\t\t}\n\n\t\tthis.loadMore = this.loadMore.bind(this)\n    }\n\n    loadMore(){\n\t\tthis.setState((prevState) => {\n\t\t\treturn {\n\t\t\t\tvisible:prevState.visible + 3\n\t\t\t}\n\t\t})\n\t}\n   \n    render() {\n        const works = get(this, 'props.data.allContentfulOurWork.edges')\n        const metaData = get(this.props, 'data.site.siteMetadata.caseStudyPage')\n        const servicesNav = get(this.props,'data.allContentfulOurServices.edges')\n        const data = {\n            hero:'hero-work',\n            size:'is-medium',\n            isHidden: true,\n            text: 'Our Work',\n            servicesNav\n          }\n        return (\n            <Layout location={this.props.location} data={data}>\n                <SiteMeta metaData={metaData}/>\n                <div className=\"work section\">\n                {\n                    works.slice(0, this.state.visible).map(({node},index) => {\n                        return(\n                            <div className=\"section\" key={index}>\n                                <div className=\"container\">\n                                    <div className=\"columns is-centered\">\n                                        <div className=\"column is-9\">\n                                            <div className=\"box\">\n                                                <div className=\"columns\" style={{alignItems:'center'}}>\n                                                    <div className=\"column is-5 has-text-centered\">\n                                                        <h2 className=\"title is-size-5 is-capitalized\">\n                                                            industry: {node.industry}\n                                                        </h2>\n                                                        <h2 className=\"title is-size-5 is-capitalized\">\n                                                            services:\n                                                        </h2>\n                                                        <ul className=\"is-size-5\">\n                                                        {\n                                                            node.services.map((service,index)=>{\n                                                                return(\n                                                                    <li key={index}>\n                                                                        {service}\n                                                                    </li>\n                                                                )\n                                                            })\n                                                        }\n                                                        </ul>\n                                                    </div>\n                                                    <div className=\"column is-7\">\n                                                        <figure className=\"image\">\n                                                            <img src={node.companyLogo.file.url} alt={node.companyName}/>\n                                                        </figure>\n                                                    </div>\n                                                </div>\n                                            </div>\n                                        </div>\n                                    </div>\n                                </div>\n                            </div>\n                        )\n                    })\n                }\n                { this.state.visible < works.length &&\n                    <div className=\"columns is-centered\">\n                        <div className=\"column is-6\">\n                            <div className=\"has-text-centered\">\n                                <button className=\"button is-danger is-medium\" type=\"button\" onClick={this.loadMore}>Load More</button>\n                            </div>\n                        </div>\t\n                    </div>\n                }\n                </div>\n\n            </Layout> \n        )\n\n    }\n}\n\nexport default WorkPage\n\nexport const pageQuery = graphql`\n    query WorkQuery {\n        site {\n            siteMetadata {\n              caseStudyPage {\n                title\n                description\n                imageUrl\n                siteUrl\n              }\n            }\n         } \n        allContentfulOurWork(filter: {node_locale: {eq: \"en-GB\"}}, sort: {fields: [publishDate], order: DESC}) {\n            edges {\n              node {\n                companyName  \n                industry\n                services\n                companyLogo {\n                  file {\n                    url\n                  }\n                }\n              }\n            }\n          }\n          allContentfulOurServices(filter: {node_locale: {eq: \"en-GB\"}}, sort: {order: ASC, fields: order}) {\n            edges {\n              node {\n                title\n                slug\n              }\n            }\n          }  \n    }\n\n`"],"sourceRoot":""}