Commit 0f1ea43b authored by Muhammad Ameen's avatar Muhammad Ameen 💻

Product api integration complete

parent 861fcedb
...@@ -13,6 +13,7 @@ ...@@ -13,6 +13,7 @@
"@testing-library/react": "^13.2.0", "@testing-library/react": "^13.2.0",
"@testing-library/user-event": "^13.5.0", "@testing-library/user-event": "^13.5.0",
"antd": "^4.20.5", "antd": "^4.20.5",
"axios": "^0.27.2",
"bootstrap": "^5.1.3", "bootstrap": "^5.1.3",
"react": "^18.1.0", "react": "^18.1.0",
"react-bootstrap": "^2.3.1", "react-bootstrap": "^2.3.1",
...@@ -21,6 +22,7 @@ ...@@ -21,6 +22,7 @@
"react-redux": "^8.0.1", "react-redux": "^8.0.1",
"react-router-dom": "^6.3.0", "react-router-dom": "^6.3.0",
"react-scripts": "5.0.1", "react-scripts": "5.0.1",
"react-select": "^5.3.2",
"react-toastify": "^8.1.0", "react-toastify": "^8.1.0",
"redux-thunk": "^2.4.1", "redux-thunk": "^2.4.1",
"sass": "^1.51.0", "sass": "^1.51.0",
...@@ -2066,6 +2068,152 @@ ...@@ -2066,6 +2068,152 @@
"node": ">=10" "node": ">=10"
} }
}, },
"node_modules/@emotion/babel-plugin": {
"version": "11.9.2",
"resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.9.2.tgz",
"integrity": "sha512-Pr/7HGH6H6yKgnVFNEj2MVlreu3ADqftqjqwUvDy/OJzKFgxKeTQ+eeUf20FOTuHVkDON2iNa25rAXVYtWJCjw==",
"dependencies": {
"@babel/helper-module-imports": "^7.12.13",
"@babel/plugin-syntax-jsx": "^7.12.13",
"@babel/runtime": "^7.13.10",
"@emotion/hash": "^0.8.0",
"@emotion/memoize": "^0.7.5",
"@emotion/serialize": "^1.0.2",
"babel-plugin-macros": "^2.6.1",
"convert-source-map": "^1.5.0",
"escape-string-regexp": "^4.0.0",
"find-root": "^1.1.0",
"source-map": "^0.5.7",
"stylis": "4.0.13"
},
"peerDependencies": {
"@babel/core": "^7.0.0"
}
},
"node_modules/@emotion/babel-plugin/node_modules/babel-plugin-macros": {
"version": "2.8.0",
"resolved": "https://registry.npmjs.org/babel-plugin-macros/-/babel-plugin-macros-2.8.0.tgz",
"integrity": "sha512-SEP5kJpfGYqYKpBrj5XU3ahw5p5GOHJ0U5ssOSQ/WBVdwkD2Dzlce95exQTs3jOVWPPKLBN2rlEWkCK7dSmLvg==",
"dependencies": {
"@babel/runtime": "^7.7.2",
"cosmiconfig": "^6.0.0",
"resolve": "^1.12.0"
}
},
"node_modules/@emotion/babel-plugin/node_modules/cosmiconfig": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-6.0.0.tgz",
"integrity": "sha512-xb3ZL6+L8b9JLLCx3ZdoZy4+2ECphCMo2PwqgP1tlfVq6M6YReyzBJtvWWtbDSpNr9hn96pkCiZqUcFEc+54Qg==",
"dependencies": {
"@types/parse-json": "^4.0.0",
"import-fresh": "^3.1.0",
"parse-json": "^5.0.0",
"path-type": "^4.0.0",
"yaml": "^1.7.2"
},
"engines": {
"node": ">=8"
}
},
"node_modules/@emotion/babel-plugin/node_modules/escape-string-regexp": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz",
"integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==",
"engines": {
"node": ">=10"
},
"funding": {
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/@emotion/babel-plugin/node_modules/source-map": {
"version": "0.5.7",
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
"integrity": "sha512-LbrmJOMUSdEVxIKvdcJzQC+nQhe8FUZQTXQy6+I75skNgn3OoQ0DZA8YnFa7gp8tqtL3KPf1kmo0R5DoApeSGQ==",
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/@emotion/cache": {
"version": "11.9.3",
"resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.9.3.tgz",
"integrity": "sha512-0dgkI/JKlCXa+lEXviaMtGBL0ynpx4osh7rjOXE71q9bIF8G+XhJgvi+wDu0B0IdCVx37BffiwXlN9I3UuzFvg==",
"dependencies": {
"@emotion/memoize": "^0.7.4",
"@emotion/sheet": "^1.1.1",
"@emotion/utils": "^1.0.0",
"@emotion/weak-memoize": "^0.2.5",
"stylis": "4.0.13"
}
},
"node_modules/@emotion/hash": {
"version": "0.8.0",
"resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz",
"integrity": "sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow=="
},
"node_modules/@emotion/memoize": {
"version": "0.7.5",
"resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.5.tgz",
"integrity": "sha512-igX9a37DR2ZPGYtV6suZ6whr8pTFtyHL3K/oLUotxpSVO2ASaprmAe2Dkq7tBo7CRY7MMDrAa9nuQP9/YG8FxQ=="
},
"node_modules/@emotion/react": {
"version": "11.9.3",
"resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.9.3.tgz",
"integrity": "sha512-g9Q1GcTOlzOEjqwuLF/Zd9LC+4FljjPjDfxSM7KmEakm+hsHXk+bYZ2q+/hTJzr0OUNkujo72pXLQvXj6H+GJQ==",
"dependencies": {
"@babel/runtime": "^7.13.10",
"@emotion/babel-plugin": "^11.7.1",
"@emotion/cache": "^11.9.3",
"@emotion/serialize": "^1.0.4",
"@emotion/utils": "^1.1.0",
"@emotion/weak-memoize": "^0.2.5",
"hoist-non-react-statics": "^3.3.1"
},
"peerDependencies": {
"@babel/core": "^7.0.0",
"react": ">=16.8.0"
},
"peerDependenciesMeta": {
"@babel/core": {
"optional": true
},
"@types/react": {
"optional": true
}
}
},
"node_modules/@emotion/serialize": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.0.4.tgz",
"integrity": "sha512-1JHamSpH8PIfFwAMryO2bNka+y8+KA5yga5Ocf2d7ZEiJjb7xlLW7aknBGZqJLajuLOvJ+72vN+IBSwPlXD1Pg==",
"dependencies": {
"@emotion/hash": "^0.8.0",
"@emotion/memoize": "^0.7.4",
"@emotion/unitless": "^0.7.5",
"@emotion/utils": "^1.0.0",
"csstype": "^3.0.2"
}
},
"node_modules/@emotion/sheet": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-1.1.1.tgz",
"integrity": "sha512-J3YPccVRMiTZxYAY0IOq3kd+hUP8idY8Kz6B/Cyo+JuXq52Ek+zbPbSQUrVQp95aJ+lsAW7DPL1P2Z+U1jGkKA=="
},
"node_modules/@emotion/unitless": {
"version": "0.7.5",
"resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.7.5.tgz",
"integrity": "sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg=="
},
"node_modules/@emotion/utils": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.1.0.tgz",
"integrity": "sha512-iRLa/Y4Rs5H/f2nimczYmS5kFJEbpiVvgN3XVfZ022IYhuNA1IRSHEizcof88LtCTXtl9S2Cxt32KgaXEu72JQ=="
},
"node_modules/@emotion/weak-memoize": {
"version": "0.2.5",
"resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.2.5.tgz",
"integrity": "sha512-6U71C2Wp7r5XtFtQzYrW5iKFT67OixrSxjI4MptCHzdSVlgabczzqLe0ZSgnub/5Kp4hSbpDB1tMytZY9pwxxA=="
},
"node_modules/@eslint/eslintrc": { "node_modules/@eslint/eslintrc": {
"version": "1.2.3", "version": "1.2.3",
"resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-1.2.3.tgz", "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-1.2.3.tgz",
...@@ -4735,6 +4883,28 @@ ...@@ -4735,6 +4883,28 @@
"node": ">=4" "node": ">=4"
} }
}, },
"node_modules/axios": {
"version": "0.27.2",
"resolved": "https://registry.npmjs.org/axios/-/axios-0.27.2.tgz",
"integrity": "sha512-t+yRIyySRTp/wua5xEr+z1q60QmLq8ABsS5O9Me1AsE5dfKqgnCFzwiCZZ/cGNd1lq4/7akDWMxdhVlucjmnOQ==",
"dependencies": {
"follow-redirects": "^1.14.9",
"form-data": "^4.0.0"
}
},
"node_modules/axios/node_modules/form-data": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz",
"integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==",
"dependencies": {
"asynckit": "^0.4.0",
"combined-stream": "^1.0.8",
"mime-types": "^2.1.12"
},
"engines": {
"node": ">= 6"
}
},
"node_modules/axobject-query": { "node_modules/axobject-query": {
"version": "2.2.0", "version": "2.2.0",
"resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-2.2.0.tgz", "resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-2.2.0.tgz",
...@@ -7768,6 +7938,11 @@ ...@@ -7768,6 +7938,11 @@
"url": "https://github.com/avajs/find-cache-dir?sponsor=1" "url": "https://github.com/avajs/find-cache-dir?sponsor=1"
} }
}, },
"node_modules/find-root": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz",
"integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng=="
},
"node_modules/find-up": { "node_modules/find-up": {
"version": "5.0.0", "version": "5.0.0",
"resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz", "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz",
...@@ -14598,6 +14773,29 @@ ...@@ -14598,6 +14773,29 @@
} }
} }
}, },
"node_modules/react-select": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/react-select/-/react-select-5.3.2.tgz",
"integrity": "sha512-W6Irh7U6Ha7p5uQQ2ZnemoCQ8mcfgOtHfw3wuMzG6FAu0P+CYicgofSLOq97BhjMx8jS+h+wwWdCBeVVZ9VqlQ==",
"dependencies": {
"@babel/runtime": "^7.12.0",
"@emotion/cache": "^11.4.0",
"@emotion/react": "^11.8.1",
"@types/react-transition-group": "^4.4.0",
"memoize-one": "^5.0.0",
"prop-types": "^15.6.0",
"react-transition-group": "^4.3.0"
},
"peerDependencies": {
"react": "^16.8.0 || ^17.0.0 || ^18.0.0",
"react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
}
},
"node_modules/react-select/node_modules/memoize-one": {
"version": "5.2.1",
"resolved": "https://registry.npmjs.org/memoize-one/-/memoize-one-5.2.1.tgz",
"integrity": "sha512-zYiwtZUcYyXKo/np96AGZAckk+FWWsUdJ3cHGGmld7+AhvcWmQyGCYUh1hc4Q/pkOhb65dQR/pqCyK0cOaHz4Q=="
},
"node_modules/react-toastify": { "node_modules/react-toastify": {
"version": "8.1.0", "version": "8.1.0",
"resolved": "https://registry.npmjs.org/react-toastify/-/react-toastify-8.1.0.tgz", "resolved": "https://registry.npmjs.org/react-toastify/-/react-toastify-8.1.0.tgz",
...@@ -15780,6 +15978,11 @@ ...@@ -15780,6 +15978,11 @@
"postcss": "^8.2.15" "postcss": "^8.2.15"
} }
}, },
"node_modules/stylis": {
"version": "4.0.13",
"resolved": "https://registry.npmjs.org/stylis/-/stylis-4.0.13.tgz",
"integrity": "sha512-xGPXiFVl4YED9Jh7Euv2V220mriG9u4B2TA6Ybjc1catrstKD2PpIdU3U0RKpkVBC2EhmL/F0sPCr9vrFTNRag=="
},
"node_modules/supports-color": { "node_modules/supports-color": {
"version": "5.5.0", "version": "5.5.0",
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
...@@ -18802,6 +19005,127 @@ ...@@ -18802,6 +19005,127 @@
"resolved": "https://registry.npmjs.org/@ctrl/tinycolor/-/tinycolor-3.4.1.tgz", "resolved": "https://registry.npmjs.org/@ctrl/tinycolor/-/tinycolor-3.4.1.tgz",
"integrity": "sha512-ej5oVy6lykXsvieQtqZxCOaLT+xD4+QNarq78cIYISHmZXshCvROLudpQN3lfL8G0NL7plMSSK+zlyvCaIJ4Iw==" "integrity": "sha512-ej5oVy6lykXsvieQtqZxCOaLT+xD4+QNarq78cIYISHmZXshCvROLudpQN3lfL8G0NL7plMSSK+zlyvCaIJ4Iw=="
}, },
"@emotion/babel-plugin": {
"version": "11.9.2",
"resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.9.2.tgz",
"integrity": "sha512-Pr/7HGH6H6yKgnVFNEj2MVlreu3ADqftqjqwUvDy/OJzKFgxKeTQ+eeUf20FOTuHVkDON2iNa25rAXVYtWJCjw==",
"requires": {
"@babel/helper-module-imports": "^7.12.13",
"@babel/plugin-syntax-jsx": "^7.12.13",
"@babel/runtime": "^7.13.10",
"@emotion/hash": "^0.8.0",
"@emotion/memoize": "^0.7.5",
"@emotion/serialize": "^1.0.2",
"babel-plugin-macros": "^2.6.1",
"convert-source-map": "^1.5.0",
"escape-string-regexp": "^4.0.0",
"find-root": "^1.1.0",
"source-map": "^0.5.7",
"stylis": "4.0.13"
},
"dependencies": {
"babel-plugin-macros": {
"version": "2.8.0",
"resolved": "https://registry.npmjs.org/babel-plugin-macros/-/babel-plugin-macros-2.8.0.tgz",
"integrity": "sha512-SEP5kJpfGYqYKpBrj5XU3ahw5p5GOHJ0U5ssOSQ/WBVdwkD2Dzlce95exQTs3jOVWPPKLBN2rlEWkCK7dSmLvg==",
"requires": {
"@babel/runtime": "^7.7.2",
"cosmiconfig": "^6.0.0",
"resolve": "^1.12.0"
}
},
"cosmiconfig": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-6.0.0.tgz",
"integrity": "sha512-xb3ZL6+L8b9JLLCx3ZdoZy4+2ECphCMo2PwqgP1tlfVq6M6YReyzBJtvWWtbDSpNr9hn96pkCiZqUcFEc+54Qg==",
"requires": {
"@types/parse-json": "^4.0.0",
"import-fresh": "^3.1.0",
"parse-json": "^5.0.0",
"path-type": "^4.0.0",
"yaml": "^1.7.2"
}
},
"escape-string-regexp": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz",
"integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA=="
},
"source-map": {
"version": "0.5.7",
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
"integrity": "sha512-LbrmJOMUSdEVxIKvdcJzQC+nQhe8FUZQTXQy6+I75skNgn3OoQ0DZA8YnFa7gp8tqtL3KPf1kmo0R5DoApeSGQ=="
}
}
},
"@emotion/cache": {
"version": "11.9.3",
"resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.9.3.tgz",
"integrity": "sha512-0dgkI/JKlCXa+lEXviaMtGBL0ynpx4osh7rjOXE71q9bIF8G+XhJgvi+wDu0B0IdCVx37BffiwXlN9I3UuzFvg==",
"requires": {
"@emotion/memoize": "^0.7.4",
"@emotion/sheet": "^1.1.1",
"@emotion/utils": "^1.0.0",
"@emotion/weak-memoize": "^0.2.5",
"stylis": "4.0.13"
}
},
"@emotion/hash": {
"version": "0.8.0",
"resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz",
"integrity": "sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow=="
},
"@emotion/memoize": {
"version": "0.7.5",
"resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.5.tgz",
"integrity": "sha512-igX9a37DR2ZPGYtV6suZ6whr8pTFtyHL3K/oLUotxpSVO2ASaprmAe2Dkq7tBo7CRY7MMDrAa9nuQP9/YG8FxQ=="
},
"@emotion/react": {
"version": "11.9.3",
"resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.9.3.tgz",
"integrity": "sha512-g9Q1GcTOlzOEjqwuLF/Zd9LC+4FljjPjDfxSM7KmEakm+hsHXk+bYZ2q+/hTJzr0OUNkujo72pXLQvXj6H+GJQ==",
"requires": {
"@babel/runtime": "^7.13.10",
"@emotion/babel-plugin": "^11.7.1",
"@emotion/cache": "^11.9.3",
"@emotion/serialize": "^1.0.4",
"@emotion/utils": "^1.1.0",
"@emotion/weak-memoize": "^0.2.5",
"hoist-non-react-statics": "^3.3.1"
}
},
"@emotion/serialize": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.0.4.tgz",
"integrity": "sha512-1JHamSpH8PIfFwAMryO2bNka+y8+KA5yga5Ocf2d7ZEiJjb7xlLW7aknBGZqJLajuLOvJ+72vN+IBSwPlXD1Pg==",
"requires": {
"@emotion/hash": "^0.8.0",
"@emotion/memoize": "^0.7.4",
"@emotion/unitless": "^0.7.5",
"@emotion/utils": "^1.0.0",
"csstype": "^3.0.2"
}
},
"@emotion/sheet": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-1.1.1.tgz",
"integrity": "sha512-J3YPccVRMiTZxYAY0IOq3kd+hUP8idY8Kz6B/Cyo+JuXq52Ek+zbPbSQUrVQp95aJ+lsAW7DPL1P2Z+U1jGkKA=="
},
"@emotion/unitless": {
"version": "0.7.5",
"resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.7.5.tgz",
"integrity": "sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg=="
},
"@emotion/utils": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.1.0.tgz",
"integrity": "sha512-iRLa/Y4Rs5H/f2nimczYmS5kFJEbpiVvgN3XVfZ022IYhuNA1IRSHEizcof88LtCTXtl9S2Cxt32KgaXEu72JQ=="
},
"@emotion/weak-memoize": {
"version": "0.2.5",
"resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.2.5.tgz",
"integrity": "sha512-6U71C2Wp7r5XtFtQzYrW5iKFT67OixrSxjI4MptCHzdSVlgabczzqLe0ZSgnub/5Kp4hSbpDB1tMytZY9pwxxA=="
},
"@eslint/eslintrc": { "@eslint/eslintrc": {
"version": "1.2.3", "version": "1.2.3",
"resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-1.2.3.tgz", "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-1.2.3.tgz",
...@@ -20772,6 +21096,27 @@ ...@@ -20772,6 +21096,27 @@
"resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.4.1.tgz", "resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.4.1.tgz",
"integrity": "sha512-gd1kmb21kwNuWr6BQz8fv6GNECPBnUasepcoLbekws23NVBLODdsClRZ+bQ8+9Uomf3Sm3+Vwn0oYG9NvwnJCw==" "integrity": "sha512-gd1kmb21kwNuWr6BQz8fv6GNECPBnUasepcoLbekws23NVBLODdsClRZ+bQ8+9Uomf3Sm3+Vwn0oYG9NvwnJCw=="
}, },
"axios": {
"version": "0.27.2",
"resolved": "https://registry.npmjs.org/axios/-/axios-0.27.2.tgz",
"integrity": "sha512-t+yRIyySRTp/wua5xEr+z1q60QmLq8ABsS5O9Me1AsE5dfKqgnCFzwiCZZ/cGNd1lq4/7akDWMxdhVlucjmnOQ==",
"requires": {
"follow-redirects": "^1.14.9",
"form-data": "^4.0.0"
},
"dependencies": {
"form-data": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz",
"integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==",
"requires": {
"asynckit": "^0.4.0",
"combined-stream": "^1.0.8",
"mime-types": "^2.1.12"
}
}
}
},
"axobject-query": { "axobject-query": {
"version": "2.2.0", "version": "2.2.0",
"resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-2.2.0.tgz", "resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-2.2.0.tgz",
...@@ -23013,6 +23358,11 @@ ...@@ -23013,6 +23358,11 @@
"pkg-dir": "^4.1.0" "pkg-dir": "^4.1.0"
} }
}, },
"find-root": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz",
"integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng=="
},
"find-up": { "find-up": {
"version": "5.0.0", "version": "5.0.0",
"resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz", "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz",
...@@ -27774,6 +28124,27 @@ ...@@ -27774,6 +28124,27 @@
"workbox-webpack-plugin": "^6.4.1" "workbox-webpack-plugin": "^6.4.1"
} }
}, },
"react-select": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/react-select/-/react-select-5.3.2.tgz",
"integrity": "sha512-W6Irh7U6Ha7p5uQQ2ZnemoCQ8mcfgOtHfw3wuMzG6FAu0P+CYicgofSLOq97BhjMx8jS+h+wwWdCBeVVZ9VqlQ==",
"requires": {
"@babel/runtime": "^7.12.0",
"@emotion/cache": "^11.4.0",
"@emotion/react": "^11.8.1",
"@types/react-transition-group": "^4.4.0",
"memoize-one": "^5.0.0",
"prop-types": "^15.6.0",
"react-transition-group": "^4.3.0"
},
"dependencies": {
"memoize-one": {
"version": "5.2.1",
"resolved": "https://registry.npmjs.org/memoize-one/-/memoize-one-5.2.1.tgz",
"integrity": "sha512-zYiwtZUcYyXKo/np96AGZAckk+FWWsUdJ3cHGGmld7+AhvcWmQyGCYUh1hc4Q/pkOhb65dQR/pqCyK0cOaHz4Q=="
}
}
},
"react-toastify": { "react-toastify": {
"version": "8.1.0", "version": "8.1.0",
"resolved": "https://registry.npmjs.org/react-toastify/-/react-toastify-8.1.0.tgz", "resolved": "https://registry.npmjs.org/react-toastify/-/react-toastify-8.1.0.tgz",
...@@ -28652,6 +29023,11 @@ ...@@ -28652,6 +29023,11 @@
"postcss-selector-parser": "^6.0.4" "postcss-selector-parser": "^6.0.4"
} }
}, },
"stylis": {
"version": "4.0.13",
"resolved": "https://registry.npmjs.org/stylis/-/stylis-4.0.13.tgz",
"integrity": "sha512-xGPXiFVl4YED9Jh7Euv2V220mriG9u4B2TA6Ybjc1catrstKD2PpIdU3U0RKpkVBC2EhmL/F0sPCr9vrFTNRag=="
},
"supports-color": { "supports-color": {
"version": "5.5.0", "version": "5.5.0",
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
...@@ -8,6 +8,7 @@ ...@@ -8,6 +8,7 @@
"@testing-library/react": "^13.2.0", "@testing-library/react": "^13.2.0",
"@testing-library/user-event": "^13.5.0", "@testing-library/user-event": "^13.5.0",
"antd": "^4.20.5", "antd": "^4.20.5",
"axios": "^0.27.2",
"bootstrap": "^5.1.3", "bootstrap": "^5.1.3",
"react": "^18.1.0", "react": "^18.1.0",
"react-bootstrap": "^2.3.1", "react-bootstrap": "^2.3.1",
...@@ -16,6 +17,7 @@ ...@@ -16,6 +17,7 @@
"react-redux": "^8.0.1", "react-redux": "^8.0.1",
"react-router-dom": "^6.3.0", "react-router-dom": "^6.3.0",
"react-scripts": "5.0.1", "react-scripts": "5.0.1",
"react-select": "^5.3.2",
"react-toastify": "^8.1.0", "react-toastify": "^8.1.0",
"redux-thunk": "^2.4.1", "redux-thunk": "^2.4.1",
"sass": "^1.51.0", "sass": "^1.51.0",
......
...@@ -12,7 +12,7 @@ const MainCard = ({ data, openNotification }) => { ...@@ -12,7 +12,7 @@ const MainCard = ({ data, openNotification }) => {
return ( return (
<div> <div>
<Card <Card
cover={<img alt="example" src={data?.image} style={{ height: 280 }} />} cover={<img alt="example" src={data?.thumbnail} style={{ height: 280 }} />}
> >
<Meta title={firstLatter + data?.title?.substring(1)} /> <Meta title={firstLatter + data?.title?.substring(1)} />
<div className={style.priceAndButton}> <div className={style.priceAndButton}>
......
...@@ -8,7 +8,7 @@ import { ...@@ -8,7 +8,7 @@ import {
removeItem, removeItem,
increaseQuantity, increaseQuantity,
decreaseQuantity, decreaseQuantity,
submitRequest submitRequest,
} from "../../store/Reducers/cartReducer"; } from "../../store/Reducers/cartReducer";
import { notification } from "antd"; import { notification } from "antd";
...@@ -31,7 +31,7 @@ const MainDrawer = ({ visible, setVisible }) => { ...@@ -31,7 +31,7 @@ const MainDrawer = ({ visible, setVisible }) => {
setVisible(false); setVisible(false);
}; };
console.log(window.innerWidth); // console.log(window.innerWidth);
if (window.innerWidth < 600) { if (window.innerWidth < 600) {
setSmallScreen(false); setSmallScreen(false);
...@@ -77,7 +77,11 @@ const MainDrawer = ({ visible, setVisible }) => { ...@@ -77,7 +77,11 @@ const MainDrawer = ({ visible, setVisible }) => {
<MdCancel className={style.crossIcon} /> <MdCancel className={style.crossIcon} />
</div> </div>
<div className={style.imageContainer}> <div className={style.imageContainer}>
<img src={item?.data?.image} alt="" /> <img
className={style.image}
src={item?.data?.thumbnail}
alt=""
/>
</div> </div>
<div className={style.rightContainer}> <div className={style.rightContainer}>
<p>{item?.data?.title}</p> <p>{item?.data?.title}</p>
...@@ -125,7 +129,7 @@ const MainDrawer = ({ visible, setVisible }) => { ...@@ -125,7 +129,7 @@ const MainDrawer = ({ visible, setVisible }) => {
: style.submitBtn : style.submitBtn
} }
disabled={Object.values(cart)?.length === 0} disabled={Object.values(cart)?.length === 0}
onClick={()=> dispatch(submitRequest())} onClick={() => dispatch(submitRequest())}
> >
{loading ? "Submit..." : "Submit"} {loading ? "Submit..." : "Submit"}
</button> </button>
......
...@@ -50,8 +50,8 @@ ...@@ -50,8 +50,8 @@
} }
} }
.imageContainer { .imageContainer {
width: 30%; width: 120px;
height: 80%; height: 120px;
object-fit: contain; object-fit: contain;
margin-left: 20px; margin-left: 20px;
margin-right: 20px; margin-right: 20px;
......
import React from "react"; import React, { useEffect, useState } from "react";
import { Container, Navbar, Nav } from "react-bootstrap"; import { Container, Navbar, Nav } from "react-bootstrap";
import style from "./Navbar.module.scss"; import style from "./Navbar.module.scss";
import logo from "../../assets/images/logo.png"; import logo from "../../assets/images/logo.png";
import { Input } from "antd"; import { Input } from "antd";
import { IoCartOutline } from "react-icons/io5"; import { IoCartOutline } from "react-icons/io5";
import { headerData } from "../../Helper/dummyData"; import { headerData } from "../../Helper/dummyData";
import { useSelector } from "react-redux"; import { useDispatch, useSelector } from "react-redux";
import AsyncSelect from "react-select/async";
import {
resetProduct,
searchProduct,
} from "../../store/Reducers/searchReducer";
import Select from "react-select/";
const { Search } = Input; const { Search } = Input;
const MainNavbar = ({ setVisible }) => { const MainNavbar = ({ setVisible }) => {
const dispatch = useDispatch();
const { cart } = useSelector((state) => state.cart); const { cart } = useSelector((state) => state.cart);
const { searchResult } = useSelector((state) => state.search);
const [searchResultArr, setSearchResultArr] = useState([]);
// debugger;
const onSearch = (e) => {
console.log(e, "e");
};
const onInput = () => {
console.log("abc");
};
const customStyles = {
control: (styles, { isFocused, isDisabled }) => ({
...styles,
height: "100%",
borderColor: "black",
borderRadius: 0,
boxShadow: "none",
width: "700px",
}),
};
const onSearchInput = (e) => {
console.log(e.target.value);
dispatch(searchProduct());
};
const input = (e) => {
console.log(e);
};
const options = [
{ value: "OPPOF19", label: "OPPOF19" },
{ value: "IPhone X", label: "IPhone X" },
{ value: "Samsung Universe", label: "Samsung Universe" },
];
return ( return (
<> <>
<div className={style.mainCOntainer}> <div className={style.mainCOntainer}>
...@@ -38,10 +78,27 @@ const MainNavbar = ({ setVisible }) => { ...@@ -38,10 +78,27 @@ const MainNavbar = ({ setVisible }) => {
<Navbar.Collapse id="responsive-navbar-nav"> <Navbar.Collapse id="responsive-navbar-nav">
<Nav className="me-auto"></Nav> <Nav className="me-auto"></Nav>
<Nav className={`me-auto ${style.searchContainer}`}> <Nav className={`me-auto ${style.searchContainer}`}>
<Search {/* <Search
placeholder="Search Products" placeholder="Search Products"
enterButton="Search" enterButton="Search"
size="large" size="large"
onSearch={onSearch}
onInput={onInput}
allowClear={true}
/> */}
{/* <AsyncSelect
cacheOptions
// defaultOptions={options}
styles={customStyles}
loadOptions={promiseOptions}
placeholder="Search"
// options={options}
/> */}
<Select
options={options}
styles={customStyles}
onChange={onSearchInput}
placeholder="Search"
/> />
{/* <Nav.Link href="#features">Features</Nav.Link> {/* <Nav.Link href="#features">Features</Nav.Link>
<Nav.Link href="#pricing">Pricing</Nav.Link> */} <Nav.Link href="#pricing">Pricing</Nav.Link> */}
...@@ -53,7 +110,9 @@ const MainNavbar = ({ setVisible }) => { ...@@ -53,7 +110,9 @@ const MainNavbar = ({ setVisible }) => {
onClick={() => setVisible(true)} onClick={() => setVisible(true)}
> >
<IoCartOutline className={style.cartIcon} /> <IoCartOutline className={style.cartIcon} />
<p className={style.cartCount}>{Object.values(cart).length}</p> <p className={style.cartCount}>
{Object.values(cart).length}
</p>
</div> </div>
</Nav.Link> </Nav.Link>
</Nav> </Nav>
......
import React, { useState } from "react"; import React, { useEffect, useState } from "react";
import MainNavbar from "../../Components/Navbar/Navbar"; import MainNavbar from "../../Components/Navbar/Navbar";
import MainCarousel from "../../Components/Carousel/Carousel"; import MainCarousel from "../../Components/Carousel/Carousel";
import style from "./Home.module.scss"; import style from "./Home.module.scss";
...@@ -14,10 +14,15 @@ import { useDispatch, useSelector } from "react-redux"; ...@@ -14,10 +14,15 @@ import { useDispatch, useSelector } from "react-redux";
import MainDrawer from "../../Components/Drawer/Drawer"; import MainDrawer from "../../Components/Drawer/Drawer";
import { notification } from "antd"; import { notification } from "antd";
import {
getAllProducts,
getProducts,
} from "../../store/Reducers/productReducer";
const Home = () => { const Home = () => {
const dispatch = useDispatch(); const dispatch = useDispatch();
const { cart } = useSelector((state) => state.cart); const { cart } = useSelector((state) => state.cart);
const { products } = useSelector((state) => state.products);
const [visible, setVisible] = useState(false); const [visible, setVisible] = useState(false);
...@@ -52,6 +57,10 @@ const Home = () => { ...@@ -52,6 +57,10 @@ const Home = () => {
} }
}; };
useEffect(() => {
dispatch(getAllProducts());
}, []);
// console.log(count); // console.log(count);
return ( return (
...@@ -89,7 +98,8 @@ const Home = () => { ...@@ -89,7 +98,8 @@ const Home = () => {
<h3>Mobile Phone</h3> <h3>Mobile Phone</h3>
</div> </div>
<Row> <Row>
{cardData?.map((item, index) => { {products &&
products?.map((item, index) => {
return ( return (
<Col <Col
key={index} key={index}
...@@ -105,6 +115,22 @@ const Home = () => { ...@@ -105,6 +115,22 @@ const Home = () => {
</Col> </Col>
); );
})} })}
{/* {cardData?.map((item, index) => {
return (
<Col
key={index}
xl={3}
md={4}
sm={12}
className={style.cardCol}
>
<MainCard
data={item}
openNotification={openNotification}
/>
</Col>
);
})} */}
</Row> </Row>
</Container> </Container>
</div> </div>
......
const api = "https://dummyjson.com/";
export { api };
...@@ -86,11 +86,6 @@ export const cartSlice = createSlice({ ...@@ -86,11 +86,6 @@ export const cartSlice = createSlice({
}, },
submitRequest(state, action) { submitRequest(state, action) {
state.loading = true; state.loading = true;
// setTimeout(() => {
// state.cart = {};
// state.total = 0;
// state.loading = false;
// }, 1000);
}, },
}, },
}); });
......
import { createSlice } from "@reduxjs/toolkit";
import { api } from "../Constants/apiUrl";
import axios from "axios";
export const productSlice = createSlice({
name: "products",
initialState: {
loading: false,
products: [],
},
reducers: {
getProducts(state, action) {
state.loading = true;
state.products = action.payload.products;
},
},
});
const getAllProducts = () => {
return async (dispatch) => {
await axios
.get(`${api}products/category/smartphones`)
.then((response) => {
dispatch(getProducts(response.data));
})
.catch((error) => {
console.log(error, "error");
});
};
};
// each case under reducers becomes an action
export const { getProducts } = productSlice.actions;
export { getAllProducts };
export default productSlice.reducer;
import { createSlice } from "@reduxjs/toolkit";
import { api } from "../Constants/apiUrl";
import axios from "axios";
export const searchSlice = createSlice({
name: "search",
initialState: {
loading: false,
searchResult: [],
},
reducers: {
getProducts(state, action) {
state.loading = true;
// console.log("abcb", action.payload);
let testArr = [];
action.payload.products.map((item) => {
return testArr.push({
...item,
value: item["title"],
label: item["title"],
});
});
state.searchResult = testArr;
console.log(testArr, "teeetetete");
},
resetProduct(state, action) {
// console.log("first");
state.searchResult = [];
},
},
});
const searchProduct = (val) => {
return async (dispatch) => {
await axios
.get(`${api}products/search?q=${val}`)
.then((response) => {
// console.log(response.data);
dispatch(getProducts(response.data));
})
.catch((error) => {
console.log(error, "error");
});
};
};
// each case under reducers becomes an action
export const { getProducts, resetProduct } = searchSlice.actions;
export { searchProduct };
export default searchSlice.reducer;
...@@ -2,11 +2,15 @@ import { configureStore, applyMiddleware } from "@reduxjs/toolkit"; ...@@ -2,11 +2,15 @@ import { configureStore, applyMiddleware } from "@reduxjs/toolkit";
import thunk from "redux-thunk"; import thunk from "redux-thunk";
import counterSlice from "./Reducers/counterReducer"; import counterSlice from "./Reducers/counterReducer";
import cartSlice from "./Reducers/cartReducer"; import cartSlice from "./Reducers/cartReducer";
import productSlice from "./Reducers/productReducer";
import searchSlice from "./Reducers/searchReducer";
const store = configureStore({ const store = configureStore({
reducer: { reducer: {
counter: counterSlice, counter: counterSlice,
cart: cartSlice, cart: cartSlice,
products: productSlice,
search: searchSlice,
}, //add reducers here }, //add reducers here
}); });
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment