upgraded packages in package.json file and created useWithRouter hook
This commit is contained in:
16570
package-lock.json
generated
16570
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
82
package.json
82
package.json
@@ -16,61 +16,61 @@
|
||||
"author": "Andres Alcocer",
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"axios": "^0.22.0",
|
||||
"dotenv": "^16.0.0",
|
||||
"firebase": "^9.1.2",
|
||||
"prop-types": "^15.7.2",
|
||||
"react": "^17.0.2",
|
||||
"react-dom": "^17.0.2",
|
||||
"react-player": "^2.9.0",
|
||||
"react-redux": "^7.2.5",
|
||||
"react-router-dom": "^5.3.0",
|
||||
"react-scripts": "^5.0.0",
|
||||
"redux": "^4.1.1",
|
||||
"axios": "^1.2.0",
|
||||
"dotenv": "^16.0.3",
|
||||
"firebase": "^9.14.0",
|
||||
"prop-types": "^15.8.1",
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"react-player": "^2.11.0",
|
||||
"react-redux": "^8.0.5",
|
||||
"react-router-dom": "^6.4.3",
|
||||
"react-scripts": "^5.0.1",
|
||||
"redux": "^4.2.0",
|
||||
"redux-promise": "^0.6.0",
|
||||
"redux-thunk": "^2.3.0",
|
||||
"swiper": "^7.0.8"
|
||||
"redux-thunk": "^2.4.2",
|
||||
"swiper": "^8.4.5"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.15.5",
|
||||
"@babel/plugin-proposal-class-properties": "^7.14.5",
|
||||
"@babel/plugin-proposal-export-namespace-from": "^7.14.5",
|
||||
"@babel/plugin-proposal-throw-expressions": "^7.14.5",
|
||||
"@babel/core": "^7.20.2",
|
||||
"@babel/plugin-proposal-class-properties": "^7.18.6",
|
||||
"@babel/plugin-proposal-export-namespace-from": "^7.18.9",
|
||||
"@babel/plugin-proposal-throw-expressions": "^7.18.6",
|
||||
"@babel/plugin-syntax-dynamic-import": "^7.8.3",
|
||||
"@babel/polyfill": "^7.0.0-beta.51",
|
||||
"@babel/preset-env": "^7.15.6",
|
||||
"@babel/preset-react": "^7.14.5",
|
||||
"babel-loader": "^8.2.2",
|
||||
"@babel/preset-env": "^7.20.2",
|
||||
"@babel/preset-react": "^7.18.6",
|
||||
"babel-loader": "^9.1.0",
|
||||
"clean-webpack-plugin": "^4.0.0",
|
||||
"copy-webpack-plugin": "^9.0.1",
|
||||
"css-loader": "^6.3.0",
|
||||
"eslint": "^7.32.0",
|
||||
"eslint-config-airbnb": "^18.2.1",
|
||||
"eslint-config-prettier": "^8.3.0",
|
||||
"eslint-plugin-import": "^2.24.2",
|
||||
"eslint-plugin-jsx-a11y": "^6.4.1",
|
||||
"eslint-plugin-prettier": "^4.0.0",
|
||||
"eslint-plugin-react": "^7.26.1",
|
||||
"eslint-plugin-react-hooks": "^4.2.0",
|
||||
"copy-webpack-plugin": "^11.0.0",
|
||||
"css-loader": "^6.7.2",
|
||||
"eslint": "^8.28.0",
|
||||
"eslint-config-airbnb": "^19.0.4",
|
||||
"eslint-config-prettier": "^8.5.0",
|
||||
"eslint-plugin-import": "^2.26.0",
|
||||
"eslint-plugin-jsx-a11y": "^6.6.1",
|
||||
"eslint-plugin-prettier": "^4.2.1",
|
||||
"eslint-plugin-react": "^7.31.11",
|
||||
"eslint-plugin-react-hooks": "^4.6.0",
|
||||
"extract-text-webpack-plugin": "^3.0.2",
|
||||
"file-loader": "^6.2.0",
|
||||
"html-loader": "^2.1.2",
|
||||
"html-webpack-plugin": "^5.3.2",
|
||||
"image-webpack-loader": "^8.0.1",
|
||||
"mini-css-extract-plugin": "^2.4.1",
|
||||
"node-sass": "^6.0.1",
|
||||
"html-loader": "^4.2.0",
|
||||
"html-webpack-plugin": "^5.5.0",
|
||||
"image-webpack-loader": "^8.1.0",
|
||||
"mini-css-extract-plugin": "^2.7.0",
|
||||
"node-sass": "^8.0.0",
|
||||
"optimize-css-assets-webpack-plugin": "^6.0.1",
|
||||
"prettier": "^2.4.1",
|
||||
"prettier": "^2.8.0",
|
||||
"react-owl-carousel2": "^0.3.0",
|
||||
"sass-loader": "^12.1.0",
|
||||
"style-loader": "^3.3.0",
|
||||
"sass-loader": "^13.2.0",
|
||||
"style-loader": "^3.3.1",
|
||||
"svg-inline-loader": "^0.8.2",
|
||||
"svg-react-loader": "^0.4.6",
|
||||
"tap-nirvana": "^1.1.0",
|
||||
"uglifyjs-webpack-plugin": "^2.2.0",
|
||||
"watch": "^1.0.2",
|
||||
"webpack": "^5.57.1",
|
||||
"webpack-cli": "^4.8.0",
|
||||
"webpack-dev-server": "^4.3.1"
|
||||
"webpack": "^5.75.0",
|
||||
"webpack-cli": "^5.0.0",
|
||||
"webpack-dev-server": "^4.11.1"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import React from 'react'
|
||||
import { BrowserRouter, Redirect, Route, Switch } from 'react-router-dom'
|
||||
import { BrowserRouter, Redirect, Route, Routes } from 'react-router-dom'
|
||||
import Footer from './components/Footer'
|
||||
import Navbar from './components/Navbar'
|
||||
import Home from './pages/Home'
|
||||
@@ -9,12 +9,12 @@ import Search from './pages/Search'
|
||||
const AppRouter = () => (
|
||||
<BrowserRouter>
|
||||
<Navbar />
|
||||
<Switch>
|
||||
<Route path='/' exact render={() => <Redirect to='/browse' />} />
|
||||
<Routes>
|
||||
<Route path='/' exact render={() => <Navigate to='/browse' />} />
|
||||
<Route path='/browse' component={Home} />
|
||||
<Route path='/search' component={Search} />
|
||||
<Route component={NotFound} />
|
||||
</Switch>
|
||||
</Routes>
|
||||
<Footer />
|
||||
</BrowserRouter>
|
||||
)
|
||||
|
||||
17
src/hooks/useWIthRouter.js
Normal file
17
src/hooks/useWIthRouter.js
Normal file
@@ -0,0 +1,17 @@
|
||||
import { useLocation, useNavigate, useParams } from 'react-router-dom'
|
||||
|
||||
/**
|
||||
* @description Provides react router dom props
|
||||
* @param {*} Component React component - JSX Element
|
||||
* @returns React component with route props
|
||||
*/
|
||||
export const withRouter = (Component) => {
|
||||
const ComponentWithRouterProp = (props) => {
|
||||
let location = useLocation()
|
||||
let navigate = useNavigate()
|
||||
let params = useParams()
|
||||
return <Component {...props} router={{ location, navigate, params }} />
|
||||
}
|
||||
|
||||
return ComponentWithRouterProp
|
||||
}
|
||||
@@ -10,6 +10,7 @@ module.exports = () => {
|
||||
// call dotenv and it will return an Object with a parsed key
|
||||
const env = dotenv.config().parsed
|
||||
// reduce env variables to an oject
|
||||
console.log('ENV IS', dotenv.config())
|
||||
const envKeys = Object.keys(env).reduce((prev, next) => {
|
||||
prev[`process.env.${next}`] = JSON.stringify(env[next])
|
||||
return prev
|
||||
|
||||
Reference in New Issue
Block a user