{"version":3,"sources":["component/Header.js","component/Gallery.js","component/Form.js","component/Loader.js","App.js","serviceWorker.js","index.js"],"names":["Header","Component","constructor","props","super","render","className","this","recipes","length","isLoading","Gallery","console","log","map","results","index","key","src","recipe","image","alt","label","href","url","Form","onSubmit","handleSubmit","htmlFor","type","id","placeholder","required","onChange","handleChange","value","Loader","App","event","setState","userInput","target","preventDefault","userInputString","state","axios","method","responseType","params","q","app_id","app_key","format","to","diet","then","response","data","hits","alert","catch","error","Boolean","window","location","hostname","match","ReactDOM","document","getElementById","navigator","serviceWorker","ready","registration","unregister"],"mappings":"+RAOA,MAAMA,UAAeC,YACjBC,YAAYC,GACZC,MAAMD,GAENE,SACI,OACI,4BAAQC,UAAW,eAAiBC,KAAKJ,MAAMK,QAAQC,OAAS,IAAMF,KAAKJ,MAAMO,UAAY,OAAS,SAClG,6BACI,uDAOLV,Q,MCDAW,MAlBER,IACbS,QAAQC,IAAIV,GAER,yBAAKG,UAAU,eACVH,EAAMK,QAAQM,KAAI,CAACC,EAASC,IAEzB,yBAAKV,UAAU,cAAcW,IAAKD,GAC9B,yBAAKE,IAAKH,EAAQI,OAAOC,MAAOC,IAAKN,EAAQI,OAAOG,QACpD,4BAAKP,EAAQI,OAAOG,OACpB,uBAAGC,KAAMR,EAAQI,OAAOK,KAAxB,e,MCTpB,MAAMC,UAAaxB,YACfC,YAAYC,GACRC,MAAMD,GAGVE,SACI,OACI,0BAAMC,UAAU,SAASoB,SAAUnB,KAAKJ,MAAMwB,cAC1C,2BAAOC,QAAQ,UAAf,8BACA,2BAAOtB,UAAU,eAAeuB,KAAK,OAAOC,GAAG,SAASC,YAAY,eAAeC,UAAQ,EAACC,SAAU1B,KAAKJ,MAAM+B,eACjH,2BAAO5B,UAAU,SAASuB,KAAK,SAASM,MAAM,aAK3CV,Q,MCTJW,MANA,IAEP,yBAAK9B,UAAU,W,iBCOvB,MAAM+B,UAAYpC,YAClBC,cACEE,QADW,KASb8B,aAAgBI,IACd/B,KAAKgC,SAAS,CACVC,UAAWF,EAAMG,OAAON,SAXjB,KAebR,aAAeW,IACbA,EAAMI,iBACNnC,KAAKgC,SAAS,CAAC7B,WAAW,IAC1B,MAAMiC,EAAkBpC,KAAKqC,MAAMJ,UACnCK,IAAM,CACFC,OAAO,MACPtB,IAAK,gCACLuB,aAAa,QACbC,OACE,CACEC,EAAGN,EACHO,OA7BI,WA8BJC,QA/BK,mCAgCLC,OAAO,OACPC,GAAI,GACJC,KAAM,cAEbC,MAAKC,IACJA,EAAWA,EAASC,KAAKC,KACzB9C,QAAQC,IAAI2C,GACY,IAApBA,EAAS/C,QACXkD,MAAM,oBAERpD,KAAKgC,SAAS,CACb/B,QAASgD,EACThB,UAAW,GACX9B,WAAW,OAEZkD,OAAMC,IACPjD,QAAQiD,MAAMA,OA1CftD,KAAKqC,MAAO,CACVpC,QAAS,GACTE,WAAW,GA4CbL,SACE,OACE,6BACE,kBAAC,EAAD,CAAQG,QAASD,KAAKqC,MAAMpC,QAASE,UAAWH,KAAKqC,MAAMlC,YAC3D,8BACE,6BAASJ,UAAU,qBACjB,kBAAC,EAAD,CAAMqB,aAAgBpB,KAAKoB,aAAcO,aAAgB3B,KAAK2B,aAAcM,UAAWjC,KAAKqC,MAAMJ,aAEpG,6BAASlC,UAAU,eAEbC,KAAKqC,MAAMlC,UAAY,kBAAC,EAAD,MAAa,kBAAC,EAAD,CAASF,QAASD,KAAKqC,MAAMpC,cASlE6B,QCpEKyB,QACW,cAA7BC,OAAOC,SAASC,UAEe,UAA7BF,OAAOC,SAASC,UAEhBF,OAAOC,SAASC,SAASC,MACvB,2DCZNC,IAAS9D,OAAO,kBAAC,EAAD,MAAS+D,SAASC,eAAe,SD2H3C,kBAAmBC,WACrBA,UAAUC,cAAcC,MAAMjB,MAAKkB,IACjCA,EAAaC,kB","file":"static/js/main.7398e0c7.chunk.js","sourcesContent":["import React, { Component } from 'react';\nimport \"./Header.css\"\n// import heroImage from \"./assets/heroImage.jpg\"; // Tell Webpack this JS file uses this image\n\n\n\n\nclass Header extends Component {\n    constructor(props){\n    super(props)\n    }\n    render(){\n        return(\n            <header className={\"App-header \" + (this.props.recipes.length > 0 && !this.props.isLoading ? 'hide' : 'show')}>\n                <div>\n                    <h1>low carb & delicious</h1>\n                </div>\n            </header>      \n        )\n    }\n}\n\nexport default Header;","import React, { Component } from 'react';\nimport \"./Gallery.css\"\n\nconst Gallery = (props) => {\n    console.log(props)\n    return ( \n        <div className=\"App-gallery\" >\n            {props.recipes.map((results, index) =>{\n                return(\n                <div className=\"Recipe-card\" key={index}>\n                    <img src={results.recipe.image} alt={results.recipe.label} />\n                    <h2>{results.recipe.label}</h2>\n                    <a href={results.recipe.url}>Recipe</a>\n                </div>\n                    )  \n                })\n            }   \n        </div>\n    )\n}\n\nexport default Gallery;","import React, { Component } from 'react';\nimport './Form.css'\n\nclass Form extends Component {\n    constructor(props){\n        super(props)\n    }\n    \n    render(){\n        return(\n            <form className=\"Search\" onSubmit={this.props.handleSubmit}>\n                <label htmlFor=\"search\">Enter your main ingredient</label>\n                <input className=\"Search-input\" type=\"text\" id=\"search\" placeholder=\"i.e. chicken\" required onChange={this.props.handleChange} />\n                <input className=\"Submit\" type=\"submit\" value=\"Search\" />\n            </form>\n        )}\n    }\n\n    export default Form;","import React from 'react';\nimport \"./Loader.css\"\n\nconst Loader = () => {\n    return (\n        <div className=\"loader\"></div> \n    )\n}\n\nexport default Loader;","import React, { Component } from 'react';\nimport './App.css';\nimport Header from './component/Header';\nimport Gallery from './component/Gallery';\nimport Form from './component/Form';\nimport Loader from './component/Loader';\nimport axios from 'axios';\n\n\nconst apiKey = \"4d616a3fe66b009185305fec33387408\";\nconst apiId = \"0766a929\";\n\nclass App extends Component {\nconstructor(){\n  super();\n  this.state ={\n    recipes: [],\n    isLoading: false\n  }\n}\n  \n//every time the user type his input, this input will be saved into this state below.\nhandleChange = (event) => {\n  this.setState({\n      userInput: event.target.value\n  })\n}\n\nhandleSubmit =(event) => {\n  event.preventDefault();\n  this.setState({isLoading: true})\n  const userInputString = this.state.userInput;    \n  axios({\n      method:'get',\n      url: \"https://api.edamam.com/search\",\n      responseType:'jsonp',\n      params:\n        {\n          q: userInputString,\n          app_id: apiId,\n          app_key: apiKey,\n          format:'json',\n          to: 20,\n          diet: 'low-carb'\n        }\n}).then(response => {\n    response = response.data.hits\n    console.log(response)\n    if (response.length === 0) {\n      alert('Please try again')\n    }\n    this.setState({\n     recipes: response,\n     userInput: \"\",\n     isLoading: false\n    })\n }).catch(error => {\n   console.error(error)\n })\n}\n\n  render() {\n    return (\n      <div>\n        <Header recipes={this.state.recipes} isLoading={this.state.isLoading}/>\n        <main>\n          <section className=\"App-form clearfix\">\n            <Form handleSubmit = {this.handleSubmit} handleChange = {this.handleChange} userInput={this.state.userInput}/>\n          </section> \n          <section className=\"App-results\">\n              {\n                this.state.isLoading ? <Loader /> : <Gallery recipes={this.state.recipes} />\n              }\n          </section>\n        </main>\n      </div>\n    );\n  }\n}\n\nexport default App;\n\n","// This optional code is used to register a service worker.\n// register() is not called by default.\n\n// This lets the app load faster on subsequent visits in production, and gives\n// it offline capabilities. However, it also means that developers (and users)\n// will only see deployed updates on subsequent visits to a page, after all the\n// existing tabs open on the page have been closed, since previously cached\n// resources are updated in the background.\n\n// To learn more about the benefits of this model and instructions on how to\n// opt-in, read http://bit.ly/CRA-PWA\n\nconst isLocalhost = Boolean(\n  window.location.hostname === 'localhost' ||\n    // [::1] is the IPv6 localhost address.\n    window.location.hostname === '[::1]' ||\n    // 127.0.0.1/8 is considered localhost for IPv4.\n    window.location.hostname.match(\n      /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\n    )\n);\n\nexport function register(config) {\n  if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\n    // The URL constructor is available in all browsers that support SW.\n    const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);\n    if (publicUrl.origin !== window.location.origin) {\n      // Our service worker won't work if PUBLIC_URL is on a different origin\n      // from what our page is served on. This might happen if a CDN is used to\n      // serve assets; see https://github.com/facebook/create-react-app/issues/2374\n      return;\n    }\n\n    window.addEventListener('load', () => {\n      const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\n\n      if (isLocalhost) {\n        // This is running on localhost. Let's check if a service worker still exists or not.\n        checkValidServiceWorker(swUrl, config);\n\n        // Add some additional logging to localhost, pointing developers to the\n        // service worker/PWA documentation.\n        navigator.serviceWorker.ready.then(() => {\n          console.log(\n            'This web app is being served cache-first by a service ' +\n              'worker. To learn more, visit http://bit.ly/CRA-PWA'\n          );\n        });\n      } else {\n        // Is not localhost. Just register service worker\n        registerValidSW(swUrl, config);\n      }\n    });\n  }\n}\n\nfunction registerValidSW(swUrl, config) {\n  navigator.serviceWorker\n    .register(swUrl)\n    .then(registration => {\n      registration.onupdatefound = () => {\n        const installingWorker = registration.installing;\n        if (installingWorker == null) {\n          return;\n        }\n        installingWorker.onstatechange = () => {\n          if (installingWorker.state === 'installed') {\n            if (navigator.serviceWorker.controller) {\n              // At this point, the updated precached content has been fetched,\n              // but the previous service worker will still serve the older\n              // content until all client tabs are closed.\n              console.log(\n                'New content is available and will be used when all ' +\n                  'tabs for this page are closed. See http://bit.ly/CRA-PWA.'\n              );\n\n              // Execute callback\n              if (config && config.onUpdate) {\n                config.onUpdate(registration);\n              }\n            } else {\n              // At this point, everything has been precached.\n              // It's the perfect time to display a\n              // \"Content is cached for offline use.\" message.\n              console.log('Content is cached for offline use.');\n\n              // Execute callback\n              if (config && config.onSuccess) {\n                config.onSuccess(registration);\n              }\n            }\n          }\n        };\n      };\n    })\n    .catch(error => {\n      console.error('Error during service worker registration:', error);\n    });\n}\n\nfunction checkValidServiceWorker(swUrl, config) {\n  // Check if the service worker can be found. If it can't reload the page.\n  fetch(swUrl)\n    .then(response => {\n      // Ensure service worker exists, and that we really are getting a JS file.\n      const contentType = response.headers.get('content-type');\n      if (\n        response.status === 404 ||\n        (contentType != null && contentType.indexOf('javascript') === -1)\n      ) {\n        // No service worker found. Probably a different app. Reload the page.\n        navigator.serviceWorker.ready.then(registration => {\n          registration.unregister().then(() => {\n            window.location.reload();\n          });\n        });\n      } else {\n        // Service worker found. Proceed as normal.\n        registerValidSW(swUrl, config);\n      }\n    })\n    .catch(() => {\n      console.log(\n        'No internet connection found. App is running in offline mode.'\n      );\n    });\n}\n\nexport function unregister() {\n  if ('serviceWorker' in navigator) {\n    navigator.serviceWorker.ready.then(registration => {\n      registration.unregister();\n    });\n  }\n}\n","import React from 'react';\nimport ReactDOM from 'react-dom';\nimport './index.css';\nimport App from './App';\nimport * as serviceWorker from './serviceWorker';\n\nReactDOM.render(<App />, document.getElementById('root'));\n\n// If you want your app to work offline and load faster, you can change\n// unregister() to register() below. Note this comes with some pitfalls.\n// Learn more about service workers: http://bit.ly/CRA-PWA\nserviceWorker.unregister();\n"],"sourceRoot":""}