[
  {
    "path": ".gitignore",
    "content": "# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.\n\n# dependencies\n./node_modules/\n/.pnp\n.pnp.js\n\n# testing\n/coverage\n\n# production\n/build\n\n# misc\n.DS_Store\n.env.local\n.env.development.local\n.env.test.local\n.env.production.local\n\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\nnode_modules\n"
  },
  {
    "path": ".prettierrc.js",
    "content": "// prettier.config.js or .prettierrc.js\nmodule.exports = {\n\ttrailingComma: 'es5',\n\ttabWidth: 4,\n\tuseTabs: true,\n\tsemi: true,\n\tsingleQuote: true,\n\t'editor.formatOnSave': true,\n\t// printWidth: 80,\n\tproseWrap: 'always',\n};\n"
  },
  {
    "path": ".travis.yml",
    "content": "language: node_js\nnode_js:\n  - 10.15.3\ncache: npm\n\ninstall:\n  - npm install\n\nscript:\n  - npm run test -- --coverage\n  - npm run build\n\nafter_success:\n  - CODECOV_TOKEN=$codecov_token npm run report-coverage\n\nafter_script:\n  - COVERALLS_REPO_TOKEN=$coveralls_repo_token npm run coveralls\n\ndeploy:\n  provider: pages\n  skip-cleanup: true\n  github-token: $GITHUB_TOKEN\n  local_dir: build\n  on:\n    branch: master\n"
  },
  {
    "path": "LICENSE",
    "content": "MIT License\n\nCopyright (c) 2019 GermaVinsmoke\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n"
  },
  {
    "path": "README.md",
    "content": "## BMI Calculator\n\n[![Build Status](https://travis-ci.com/GermaVinsmoke/bmi-calculator.svg?branch=master)](https://travis-ci.com/GermaVinsmoke/bmi-calculator)\n[![Coverage Status](https://coveralls.io/repos/github/GermaVinsmoke/bmi-calculator/badge.svg?branch=master)](https://coveralls.io/github/GermaVinsmoke/bmi-calculator?branch=master)\n[![codecov](https://codecov.io/gh/GermaVinsmoke/bmi-calculator/branch/master/graph/badge.svg)](https://codecov.io/gh/GermaVinsmoke/bmi-calculator)\n\nReact Hooks app to calculate the BMI of a person. It can store the data for 7 days with the help of LocalStorage.\n\n![](images/1.jpg)\n\nCreated with _create-react-app_. See the [full create-react-app guide](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md).\n\n## Install\n\n`npm install`\n\n## Usage\n\n`npm start`\n\n## Enhancement\n\n1. Removing the dependency of Materialize-CSS module\n\n~~2. Chart going crazy on hovering over the old points~~\n"
  },
  {
    "path": "cypress/.eslintrc.json",
    "content": "{\n  \"plugins\": [\"cypress\"],\n  \"env\": {\n    \"cypress/globals\": true\n  }\n}\n"
  },
  {
    "path": "cypress/integration/BmiForm.spec.js",
    "content": "describe('BmiForm Component', () => {\n  beforeEach(() => {\n    cy.visit('/');\n  });\n\n  it('accepts input', () => {\n    const weight = '50';\n    const height = '176';\n\n    cy.get('#weight')\n      .type(weight)\n      .should('have.value', weight);\n    cy.get('#height')\n      .type(height)\n      .should('have.value', height);\n  });\n\n  context('Form submission', () => {\n    it('Adds a new bmi card data', () => {\n      let weight = '50';\n      const height = '176';\n      let today = new Date().toLocaleString().split(',')[0];\n\n      cy.get('#weight')\n        .type(weight)\n        .should('have.value', weight);\n      cy.get('#height')\n        .type(height)\n        .should('have.value', height);\n\n      cy.get('#bmi-btn').click();\n      cy.get('#weight').should('have.value', '');\n      cy.get('#height').should('have.value', '');\n\n      cy.get(\"[data-test='weight']\").should('contain', weight);\n      cy.get(\"[data-test='height']\").should('contain', height);\n      cy.get(\"[data-test='bmi']\").should('contain', '16.14');\n      cy.get(\"[data-test='date']\").should('contain', today);\n    });\n  });\n});\n"
  },
  {
    "path": "cypress/plugins/index.js",
    "content": "// ***********************************************************\n// This example plugins/index.js can be used to load plugins\n//\n// You can change the location of this file or turn off loading\n// the plugins file with the 'pluginsFile' configuration option.\n//\n// You can read more here:\n// https://on.cypress.io/plugins-guide\n// ***********************************************************\n\n// This function is called when a project is opened or re-opened (e.g. due to\n// the project's config changing)\n\nmodule.exports = (on, config) => {\n  // `on` is used to hook into various events Cypress emits\n  // `config` is the resolved Cypress config\n}\n"
  },
  {
    "path": "cypress/support/commands.js",
    "content": "// ***********************************************\n// This example commands.js shows you how to\n// create various custom commands and overwrite\n// existing commands.\n//\n// For more comprehensive examples of custom\n// commands please read more here:\n// https://on.cypress.io/custom-commands\n// ***********************************************\n//\n//\n// -- This is a parent command --\n// Cypress.Commands.add(\"login\", (email, password) => { ... })\n//\n//\n// -- This is a child command --\n// Cypress.Commands.add(\"drag\", { prevSubject: 'element'}, (subject, options) => { ... })\n//\n//\n// -- This is a dual command --\n// Cypress.Commands.add(\"dismiss\", { prevSubject: 'optional'}, (subject, options) => { ... })\n//\n//\n// -- This will overwrite an existing command --\n// Cypress.Commands.overwrite(\"visit\", (originalFn, url, options) => { ... })\n"
  },
  {
    "path": "cypress/support/index.js",
    "content": "// ***********************************************************\n// This example support/index.js is processed and\n// loaded automatically before your test files.\n//\n// This is a great place to put global configuration and\n// behavior that modifies Cypress.\n//\n// You can change the location of this file or turn off\n// automatically serving support files with the\n// 'supportFile' configuration option.\n//\n// You can read more here:\n// https://on.cypress.io/configuration\n// ***********************************************************\n\n// Import commands.js using ES2015 syntax:\nimport './commands'\n\n// Alternatively you can use CommonJS syntax:\n// require('./commands')\n"
  },
  {
    "path": "cypress.json",
    "content": "{\n  \"baseUrl\": \"http://localhost:3000/\"\n}\n"
  },
  {
    "path": "jsconfig.json",
    "content": "{\n  \"typeAcquisition\": {\n    \"include\": [\"jest\"]\n  }\n}\n"
  },
  {
    "path": "package.json",
    "content": "{\n  \"name\": \"bmical\",\n  \"version\": \"0.1.0\",\n  \"private\": true,\n  \"homepage\": \"http://GermaVinsmoke.github.io/bmi-calculator\",\n  \"dependencies\": {\n    \"@types/jest\": \"24.0.20\",\n    \"chart.js\": \"2.9.1\",\n    \"materialize-css\": \"1.0.0\",\n    \"prop-types\": \"15.7.2\",\n    \"react\": \"16.11.0\",\n    \"react-chartjs-2\": \"2.8.0\",\n    \"react-dom\": \"16.11.0\",\n    \"react-scripts\": \"3.1.1\",\n    \"uuid\": \"3.3.3\"\n  },\n  \"scripts\": {\n    \"start\": \"react-scripts start\",\n    \"build\": \"react-scripts build\",\n    \"test\": \"react-scripts test\",\n    \"eject\": \"react-scripts eject\",\n    \"predeploy\": \"npm run build\",\n    \"deploy\": \"gh-pages -d build\",\n    \"coveralls\": \"cat ./coverage/lcov.info | node node_modules/.bin/coveralls\",\n    \"report-coverage\": \"cat ./coverage/lcov.info | codecov\",\n    \"cypress\": \"cypress open\"\n  },\n  \"jest\": {\n    \"collectCoverageFrom\": [\n      \"src/**/*.{js,jsx}\",\n      \"!src/index.js\"\n    ]\n  },\n  \"eslintConfig\": {\n    \"extends\": \"react-app\"\n  },\n  \"browserslist\": {\n    \"production\": [\n      \">0.2%\",\n      \"not dead\",\n      \"not op_mini all\"\n    ],\n    \"development\": [\n      \"last 1 chrome version\",\n      \"last 1 firefox version\",\n      \"last 1 safari version\"\n    ]\n  },\n  \"devDependencies\": {\n    \"codecov.io\": \"^0.1.6\",\n    \"coveralls\": \"^3.0.11\",\n    \"cypress\": \"^3.8.3\",\n    \"enzyme\": \"^3.11.0\",\n    \"enzyme-adapter-react-16\": \"^1.15.2\",\n    \"eslint-plugin-cypress\": \"^2.10.3\",\n    \"gh-pages\": \"^2.2.0\",\n    \"jest-enzyme\": \"^7.1.2\"\n  }\n}\n"
  },
  {
    "path": "public/index.html",
    "content": "<!DOCTYPE html>\n<html lang=\"en\">\n  <head>\n    <meta charset=\"utf-8\" />\n    <link rel=\"shortcut icon\" type=\"image/png\" href=\"./icon.png\" />\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" />\n    <meta name=\"theme-color\" content=\"#172b4d\" />\n    <meta\n      name=\"description\"\n      content=\"Web site created using create-react-app\"\n    />\n    <title>BMI Calculator</title>\n  </head>\n  <body>\n    <noscript>You need to enable JavaScript to run this app.</noscript>\n    <div id=\"root\"></div>\n    <!--\n      This HTML file is a template.\n      If you open it directly in the browser, you will see an empty page.\n\n      You can add webfonts, meta tags, or analytics to this file.\n      The build step will place the bundled scripts into the <body> tag.\n\n      To begin the development, run `npm start` or `yarn start`.\n      To create a production bundle, use `npm run build` or `yarn build`.\n    -->\n  </body>\n</html>\n"
  },
  {
    "path": "public/robots.txt",
    "content": "# https://www.robotstxt.org/robotstxt.html\nUser-agent: *\n"
  },
  {
    "path": "src/components/App/App.css",
    "content": "body {\n  background-color: #172b4d;\n}\n\ninput {\n  background-color: #fff !important;\n  border-radius: 44px !important;\n  width: 90% !important;\n  padding: 0px 15px !important;\n}\n\ninput:focus {\n  border-bottom: none !important;\n  box-shadow: none !important;\n}\n\nlabel {\n  display: block;\n  color: #fff !important;\n  font-size: 1rem !important;\n}\n\n.calculate-btn {\n  background-color: #3f51b5;\n  padding: 15px 50px;\n  color: white;\n  font-size: 16px;\n  border-radius: 44px;\n  cursor: pointer;\n  border: 1px solid #3f51b5;\n  margin-bottom: 40px;\n  transform: translate3d(0, 0, 0);\n  transition: all 0.2s ease;\n}\n\n.calculate-btn:hover {\n  background-color: #fff;\n  transform: translate(0px, -2px);\n  color: #5364c3;\n  box-shadow: 0px 15px 30px -12px rgba(255, 255, 255, 0.2);\n}\n\n.calculate-btn:focus {\n  background-color: #32408f;\n}\n\n.calculate-btn:focus:hover {\n  color: white;\n}\n\n.calculate-btn:disabled {\n  border: 1px solid #999999;\n  background-color: #cccccc;\n  color: #666666;\n  cursor: default;\n}\n\n.calculate-btn:disabled:hover {\n  box-shadow: none;\n  transform: translate(0, 0);\n}\n\n.data-container {\n  background-color: #1f3a67;\n  border-radius: 11px;\n  margin-top: 40px;\n  padding-top: 40px;\n  padding-bottom: 40px;\n}\n\n.card {\n  background-color: #274881 !important;\n  color: white;\n}\n\n.card-title {\n  font-weight: 500 !important;\n  text-align: center;\n}\n\n.card-data {\n  display: flex;\n  justify-content: space-around;\n}\n\n.delete-btn {\n  background-color: #e74c3c;\n  color: white;\n  border: none;\n  border-radius: 50%;\n  font-weight: 700;\n  padding: 5px 9px;\n  cursor: pointer;\n  position: absolute;\n  top: -12px;\n  right: -12px;\n}\n\n.delete-btn:focus {\n  background-color: #e74c3c;\n}\n"
  },
  {
    "path": "src/components/App/App.jsx",
    "content": "import React, { useState, useEffect } from 'react';\nimport { v4 as uuidv4 } from 'uuid';\nimport 'materialize-css/dist/css/materialize.min.css';\nimport './App.css';\nimport BmiForm from '../BmiForm/BmiForm';\nimport Info from '../Info/Info';\nimport Bar from '../Bar/Bar';\nimport { getData, storeData } from '../../helpers/localStorage';\n\nconst App = () => {\n  const initialState = () => getData('data') || [];\n  const [state, setState] = useState(initialState);\n  const [data, setData] = useState({});\n\n  useEffect(() => {\n    storeData('data', state);\n    const date = state.map(obj => obj.date);\n    const bmi = state.map(obj => obj.bmi);\n    let newData = { date, bmi };\n    setData(newData);\n  }, [state]);\n\n  const handleChange = val => {\n    let heightInM = val.height / 100;\n    val.bmi = (val.weight / (heightInM * heightInM)).toFixed(2);\n    val.id = uuidv4();\n    let newVal = [...state, val];\n    let len = newVal.length;\n    if (len > 7) newVal = newVal.slice(1, len);\n    setState(newVal);\n  };\n\n  const handleDelete = id => {\n    storeData('lastState', state);\n    let newState = state.filter(i => {\n      return i.id !== id;\n    });\n    setState(newState);\n  };\n\n  const handleUndo = () => {\n    setState(getData('lastState'));\n  };\n\n  return (\n    <div className='container'>\n      <div className='row center'>\n        <h1 className='white-text'> BMI Tracker </h1>\n      </div>\n      <div className='row'>\n        <div className='col m12 s12'>\n          <BmiForm change={handleChange} />\n          <Bar labelData={data.date} bmiData={data.bmi} />\n          <div>\n            <div className='row center'>\n              <h4 className='white-text'>7 Day Data</h4>\n            </div>\n            <div className='data-container row'>\n              {state.length > 0 ? (\n                <>\n                  {state.map(info => (\n                    <Info\n                      key={info.id}\n                      id={info.id}\n                      weight={info.weight}\n                      height={info.height}\n                      date={info.date}\n                      bmi={info.bmi}\n                      deleteCard={handleDelete}\n                    />\n                  ))}\n                </>\n              ) : (\n                  <div className='center white-text'>No log found</div>\n                )}\n            </div>\n          </div>\n          {getData('lastState') !== null ? (\n            <div className='center'>\n              <button className='calculate-btn' onClick={handleUndo}>\n                Undo\n              </button>\n            </div>\n          ) : (\n              ''\n            )}\n        </div>\n      </div>\n    </div>\n  );\n};\n\nexport default App;\n"
  },
  {
    "path": "src/components/App/App.test.js",
    "content": "import React from 'react';\nimport { shallow } from 'enzyme';\nimport App from './App';\n\ndescribe('App Component', () => {\n  let wrapper;\n  beforeEach(() => {\n    wrapper = shallow(<App />);\n  });\n\n  it('renders', () => {\n    expect(wrapper).not.toBeNull();\n  });\n});\n"
  },
  {
    "path": "src/components/Bar/Bar.jsx",
    "content": "import React from 'react';\nimport { Line } from 'react-chartjs-2';\nimport PropTypes from 'prop-types';\n\nconst Bar = ({ labelData, bmiData }) => {\n  const data = canvas => {\n    const ctx = canvas.getContext('2d');\n    const gradient = ctx.createLinearGradient(63, 81, 181, 700);\n    gradient.addColorStop(0, '#929dd9');\n    gradient.addColorStop(1, '#172b4d');\n\n    return {\n      labels: labelData,\n      datasets: [\n        {\n          label: 'BMI',\n          data: bmiData,\n          backgroundColor: gradient,\n          borderColor: '#3F51B5',\n          pointRadius: 6,\n          pointHoverRadius: 8,\n          pointHoverBorderColor: 'white',\n          pointHoverBorderWidth: 2\n        }\n      ]\n    };\n  };\n\n  const options = {\n    responsive: true,\n    scales: {\n      xAxes: [\n        {\n          scaleLabel: {\n            display: true,\n            labelString: 'Date',\n            fontSize: 18,\n            fontColor: 'white'\n          },\n          gridLines: {\n            display: false,\n            color: 'white'\n          },\n          ticks: {\n            fontColor: 'white',\n            fontSize: 16\n          }\n        }\n      ],\n      yAxes: [\n        {\n          scaleLabel: {\n            display: true,\n            labelString: 'BMI',\n            fontSize: 18,\n            fontColor: 'white'\n          },\n          gridLines: {\n            display: false,\n            color: 'white'\n          },\n          ticks: {\n            fontColor: 'white',\n            fontSize: 16,\n            beginAtZero: true\n          }\n        }\n      ]\n    },\n    tooltips: {\n      titleFontSize: 13,\n      bodyFontSize: 13\n    }\n  };\n\n  return (\n    <>\n      <Line data={data} options={options} />\n    </>\n  );\n};\n\nBar.propTypes = {\n  labelData: PropTypes.array,\n  bmiData: PropTypes.array\n};\n\nexport default Bar;\n"
  },
  {
    "path": "src/components/Bar/Bar.test.js",
    "content": "import React from \"react\";\nimport { mount } from \"enzyme\";\nimport Bar from \"./Bar\";\n\njest.mock(\"react-chartjs-2\", () => ({\n  Line: () => null\n}));\n\ndescribe(\"Bar component\", () => {\n  let wrapper;\n  const prop = {\n    labelData: [\"27/10/2019\"],\n    bmiData: [\"16.14\"]\n  };\n\n  beforeEach(() => {\n    wrapper = mount(<Bar {...prop} />);\n  });\n\n  it(\"renders\", () => {\n    expect(wrapper).not.toBeNull();\n\n    console.log(wrapper.debug());\n  });\n});\n"
  },
  {
    "path": "src/components/BmiForm/BmiForm.jsx",
    "content": "import React, { useState } from 'react';\nimport PropTypes from 'prop-types';\nimport '../App/App.css';\n\nconst initialValues = {\n\tweight: '',\n\theight: '',\n\tdate: ''\n}\n\nconst BmiForm = ({ change }) => {\n\tconst [state, setState] = useState(initialValues);\n\n\tconst handleChange = e => {\n\t\tlet { value, name } = e.target;\n\t\tif (value > 999) {\n\t\t\tvalue = 999;\n\t\t}\n\t\tconst date = new Date().toLocaleString().split(',')[0];\n\t\tsetState({\n\t\t\t...state,\n\t\t\t[name]: value,\n\t\t\tdate\n\t\t});\n\t};\n\n\tconst handleSubmit = () => {\n\t\tchange(state);\n\t\tsetState(initialValues);\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<div className=\"row\">\n\t\t\t\t<div className=\"col m6 s12\">\n\t\t\t\t\t<label htmlFor=\"weight\">Weight (in kg)</label>\n\t\t\t\t\t<input\n\t\t\t\t\t\tid=\"weight\"\n\t\t\t\t\t\tname=\"weight\"\n\t\t\t\t\t\ttype=\"number\"\n\t\t\t\t\t\tmin=\"1\"\n\t\t\t\t\t\tmax=\"999\"\n\t\t\t\t\t\tplaceholder=\"50\"\n\t\t\t\t\t\tvalue={state.weight}\n\t\t\t\t\t\tonChange={handleChange}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\n\t\t\t\t<div className=\"col m6 s12\">\n\t\t\t\t\t<label htmlFor=\"height\">Height (in cm)</label>\n\t\t\t\t\t<input\n\t\t\t\t\t\tid=\"height\"\n\t\t\t\t\t\tname=\"height\"\n\t\t\t\t\t\ttype=\"number\"\n\t\t\t\t\t\tmin=\"1\"\n\t\t\t\t\t\tmax=\"999\"\n\t\t\t\t\t\tplaceholder=\"176\"\n\t\t\t\t\t\tvalue={state.height}\n\t\t\t\t\t\tonChange={handleChange}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t<div className=\"center\">\n\t\t\t\t<button\n\t\t\t\t\tid=\"bmi-btn\"\n\t\t\t\t\tclassName=\"calculate-btn\"\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tdisabled={state.weight === '' || state.height === ''}\n\t\t\t\t\tonClick={handleSubmit}\n\t\t\t\t>\n\t\t\t\t\tCalculate BMI\n\t\t\t\t</button>\n\t\t\t</div>\n\t\t</>\n\t);\n};\n\nBmiForm.propTypes = {\n\tchange: PropTypes.func.isRequired\n};\n\nexport default BmiForm;\n"
  },
  {
    "path": "src/components/BmiForm/BmiForm.test.js",
    "content": "import React from \"react\";\nimport { shallow } from \"enzyme\";\nimport BmiForm from \"./BmiForm\";\n\ndescribe(\"BmiForm Component\", () => {\n  let wrapper;\n  const prop = {\n    change: jest.fn()\n  };\n\n  beforeEach(() => {\n    wrapper = shallow(<BmiForm {...prop} />);\n  });\n\n  it(\"renders\", () => {\n    expect(wrapper).not.toBeNull();\n  });\n\n  it(\"should update the weight\", () => {\n    const weight = wrapper.find(\"#weight\");\n    weight.simulate(\"change\", { target: { name: \"weight\", value: \"50\" } });\n    expect(wrapper.find(\"#weight\").props().value).toEqual(\"50\");\n  });\n\n  it(\"should update the height\", () => {\n    const height = wrapper.find(\"#height\");\n    height.simulate(\"change\", { target: { name: \"height\", value: \"176\" } });\n    expect(wrapper.find(\"#height\").props().value).toEqual(\"176\");\n  });\n\n  it(\"should call change\", () => {\n    wrapper.find(\"button\").simulate(\"click\");\n    expect(prop.change).toHaveBeenCalledTimes(1);\n  });\n});\n"
  },
  {
    "path": "src/components/Info/Info.jsx",
    "content": "import React from 'react';\nimport PropTypes from 'prop-types';\n\nconst Info = ({ weight, height, id, date, bmi, deleteCard }) => {\n  const handleDelete = () => {\n    deleteCard(id);\n  };\n\n  return (\n    <div className=\"col m6 s12\">\n      <div className=\"card\">\n        <div className=\"card-content\">\n          <span className=\"card-title\" data-test=\"bmi\">\n            BMI: {bmi}\n          </span>\n          <div className=\"card-data\">\n            <span data-test=\"weight\">Weight: {weight} kg</span>\n            <span data-test=\"height\">Height: {height} cm</span>\n            <span data-test=\"date\">Date: {date}</span>\n          </div>\n\n          <button className=\"delete-btn\" onClick={handleDelete}>\n            X\n          </button>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nInfo.propTypes = {\n  weight: PropTypes.string,\n  height: PropTypes.string,\n  id: PropTypes.string,\n  date: PropTypes.string,\n  bmi: PropTypes.string,\n  deleteCard: PropTypes.func\n};\n\nexport default Info;\n"
  },
  {
    "path": "src/components/Info/Info.test.js",
    "content": "import React from \"react\";\nimport { shallow } from \"enzyme\";\nimport Info from \"./Info\";\n\ndescribe(\"Info Component\", () => {\n  let wrapper;\n  const props = {\n    weight: \"50\",\n    height: \"176\",\n    id: \"2b926f1b-db1f-45ac-af87-2130da1e1a2f\",\n    date: \"10/25/2019\",\n    bmi: \"16.14\",\n    deleteCard: jest.fn()\n  };\n  beforeEach(() => {\n    wrapper = shallow(<Info {...props} />);\n  });\n\n  it(\"renders\", () => {\n    expect(wrapper).not.toBeNull();\n  });\n\n  it(\"renders with props\", () => {\n    expect(wrapper.find(\"[data-test='bmi']\").text()).toEqual(\"BMI: 16.14\");\n\n    expect(wrapper.find(\"[data-test='weight']\").text()).toEqual(\n      \"Weight: 50 kg\"\n    );\n\n    expect(wrapper.find(\"[data-test='height']\").text()).toEqual(\n      \"Height: 176 cm\"\n    );\n\n    expect(wrapper.find(\"[data-test='date']\").text()).toEqual(\n      \"Date: 10/25/2019\"\n    );\n  });\n\n  it(\"should delete the card\", () => {\n    wrapper.find(\"button\").simulate(\"click\");\n\n    expect(props.deleteCard).toHaveBeenCalledTimes(1);\n  });\n});\n"
  },
  {
    "path": "src/helpers/localStorage.js",
    "content": "export const getData = (key) => {\n\tif (!localStorage) return;\n\n\ttry {\n\t\treturn JSON.parse(localStorage.getItem(key));\n\t} catch (err) {\n\t\tconsole.error(`Error getting item ${key} from localStorage`, err);\n\t}\n};\n\nexport const storeData = (key, item) => {\n\tif (!localStorage) return;\n\n\ttry {\n\t\treturn localStorage.setItem(key, JSON.stringify(item));\n\t} catch (err) {\n\t\tconsole.error(`Error storing item ${key} to localStorage`, err);\n\t}\n};\n"
  },
  {
    "path": "src/index.css",
    "content": "body {\n  margin: 0;\n  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',\n    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',\n    sans-serif;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n  box-sizing: border-box;\n}\n"
  },
  {
    "path": "src/index.js",
    "content": "import React from \"react\";\nimport ReactDOM from \"react-dom\";\nimport \"./index.css\";\nimport App from \"./components/App/App.jsx\";\n\nReactDOM.render(<App />, document.getElementById(\"root\"));\n"
  },
  {
    "path": "src/setupTests.js",
    "content": "import Enzyme from 'enzyme';\nimport EnzymeAdapter from 'enzyme-adapter-react-16';\n\nEnzyme.configure({\n  adapter: new EnzymeAdapter(),\n  disableLifecycleMethods: true\n});\n"
  }
]