Initial changes to falcon package
* include changes to the templates to match new ui design. * musician listing and filtering (initial phase) * showing current logged in user in header
This commit is contained in:
Nuwan Chathuranga
Nuwan
parent
ea4fc496a1
commit
fa8cd2fa7c
|
|
@ -1882,6 +1882,11 @@
|
|||
"@babel/types": "^7.3.0"
|
||||
}
|
||||
},
|
||||
"@types/cookie": {
|
||||
"version": "0.3.3",
|
||||
"resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.3.3.tgz",
|
||||
"integrity": "sha512-LKVP3cgXBT9RYj+t+9FDKwS5tdI+rPBXaNSkma7hvqy35lc7mAokC2zsqWJH0LaqIt3B962nuYI77hsJoT1gow=="
|
||||
},
|
||||
"@types/eslint-visitor-keys": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@types/eslint-visitor-keys/-/eslint-visitor-keys-1.0.0.tgz",
|
||||
|
|
@ -5831,9 +5836,9 @@
|
|||
"integrity": "sha1-s55/HabrCnW6nBcySzR1PEfgZU0="
|
||||
},
|
||||
"dns-packet": {
|
||||
"version": "1.3.1",
|
||||
"resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-1.3.1.tgz",
|
||||
"integrity": "sha512-0UxfQkMhYAUaZI+xrNZOz/as5KgDU0M/fQ9b6SpkyLbk3GEswDi6PADJVaYJradtRVsRIlF1zLyOodbcTCDzUg==",
|
||||
"version": "1.3.4",
|
||||
"resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-1.3.4.tgz",
|
||||
"integrity": "sha512-BQ6F4vycLXBvdrJZ6S3gZewt6rcrks9KBgM9vrhW+knGRqc8uEdT7fuCwloc7nny5xNoMJ17HGH0R/6fpo8ECA==",
|
||||
"requires": {
|
||||
"ip": "^1.1.0",
|
||||
"safe-buffer": "^5.0.1"
|
||||
|
|
@ -5920,11 +5925,18 @@
|
|||
}
|
||||
},
|
||||
"domhandler": {
|
||||
"version": "2.4.2",
|
||||
"resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.4.2.tgz",
|
||||
"integrity": "sha512-JiK04h0Ht5u/80fdLMCEmV4zkNh2BcoMFBmZ/91WtYZ8qVXSKjiw7fXMgFPnHcSZgOo3XdinHvmnDUeMf5R4wA==",
|
||||
"version": "4.2.0",
|
||||
"resolved": "https://registry.npmjs.org/domhandler/-/domhandler-4.2.0.tgz",
|
||||
"integrity": "sha512-zk7sgt970kzPks2Bf+dwT/PLzghLnsivb9CcxkvR8Mzr66Olr0Ofd8neSbglHJHaHa2MadfoSdNlKYAaafmWfA==",
|
||||
"requires": {
|
||||
"domelementtype": "1"
|
||||
"domelementtype": "^2.2.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"domelementtype": {
|
||||
"version": "2.2.0",
|
||||
"resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.2.0.tgz",
|
||||
"integrity": "sha512-DtBMo82pv1dFtUmHyr48beiuq792Sxohr+8Hm9zoxklYPfa6n0Z3Byjj2IV7bmr2IyqClnqEQhfgHJJ5QF0R5A=="
|
||||
}
|
||||
}
|
||||
},
|
||||
"domutils": {
|
||||
|
|
@ -6168,9 +6180,9 @@
|
|||
}
|
||||
},
|
||||
"ws": {
|
||||
"version": "7.4.5",
|
||||
"resolved": "https://registry.npmjs.org/ws/-/ws-7.4.5.tgz",
|
||||
"integrity": "sha512-xzyu3hFvomRfXKH8vOFMU3OguG6oOvhXMo3xsGy3xWExqaM2dxBbVxuD99O7m3ZUFMvvscsZDqxfgMaRr/Nr1g==",
|
||||
"version": "7.4.6",
|
||||
"resolved": "https://registry.npmjs.org/ws/-/ws-7.4.6.tgz",
|
||||
"integrity": "sha512-YmhHDO4MzaDLB+M9ym/mDA5z0naX8j7SIlT8f8z+I0VtzsRbekxEutHSme7NPS2qE8StCYQNUnfWdXta/Yu85A==",
|
||||
"dev": true
|
||||
}
|
||||
}
|
||||
|
|
@ -6210,9 +6222,9 @@
|
|||
"dev": true
|
||||
},
|
||||
"ws": {
|
||||
"version": "7.4.5",
|
||||
"resolved": "https://registry.npmjs.org/ws/-/ws-7.4.5.tgz",
|
||||
"integrity": "sha512-xzyu3hFvomRfXKH8vOFMU3OguG6oOvhXMo3xsGy3xWExqaM2dxBbVxuD99O7m3ZUFMvvscsZDqxfgMaRr/Nr1g==",
|
||||
"version": "7.4.6",
|
||||
"resolved": "https://registry.npmjs.org/ws/-/ws-7.4.6.tgz",
|
||||
"integrity": "sha512-YmhHDO4MzaDLB+M9ym/mDA5z0naX8j7SIlT8f8z+I0VtzsRbekxEutHSme7NPS2qE8StCYQNUnfWdXta/Yu85A==",
|
||||
"dev": true
|
||||
}
|
||||
}
|
||||
|
|
@ -9033,22 +9045,40 @@
|
|||
}
|
||||
},
|
||||
"htmlparser2": {
|
||||
"version": "3.10.1",
|
||||
"resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.10.1.tgz",
|
||||
"integrity": "sha512-IgieNijUMbkDovyoKObU1DUhm1iwNYE/fuifEoEHfd1oZKZDaONBSkal7Y01shxsM49R4XaMdGez3WnF9UfiCQ==",
|
||||
"version": "6.1.0",
|
||||
"resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-6.1.0.tgz",
|
||||
"integrity": "sha512-gyyPk6rgonLFEDGoeRgQNaEUvdJ4ktTmmUh/h2t7s+M8oPpIPxgNACWa+6ESR57kXstwqPiCut0V8NRpcwgU7A==",
|
||||
"requires": {
|
||||
"domelementtype": "^1.3.1",
|
||||
"domhandler": "^2.3.0",
|
||||
"domutils": "^1.5.1",
|
||||
"entities": "^1.1.1",
|
||||
"inherits": "^2.0.1",
|
||||
"readable-stream": "^3.1.1"
|
||||
"domelementtype": "^2.0.1",
|
||||
"domhandler": "^4.0.0",
|
||||
"domutils": "^2.5.2",
|
||||
"entities": "^2.0.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"entities": {
|
||||
"version": "1.1.2",
|
||||
"resolved": "https://registry.npmjs.org/entities/-/entities-1.1.2.tgz",
|
||||
"integrity": "sha512-f2LZMYl1Fzu7YSBKg+RoROelpOaNrcGmE9AZubeDfrCEia483oW4MI4VyFd5VNHIgQ/7qm1I0wUHK1eJnn2y2w=="
|
||||
"dom-serializer": {
|
||||
"version": "1.3.2",
|
||||
"resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.3.2.tgz",
|
||||
"integrity": "sha512-5c54Bk5Dw4qAxNOI1pFEizPSjVsx5+bpJKmL2kPn8JhBUq2q09tTCa3mjijun2NfK78NMouDYNMBkOrPZiS+ig==",
|
||||
"requires": {
|
||||
"domelementtype": "^2.0.1",
|
||||
"domhandler": "^4.2.0",
|
||||
"entities": "^2.0.0"
|
||||
}
|
||||
},
|
||||
"domelementtype": {
|
||||
"version": "2.2.0",
|
||||
"resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.2.0.tgz",
|
||||
"integrity": "sha512-DtBMo82pv1dFtUmHyr48beiuq792Sxohr+8Hm9zoxklYPfa6n0Z3Byjj2IV7bmr2IyqClnqEQhfgHJJ5QF0R5A=="
|
||||
},
|
||||
"domutils": {
|
||||
"version": "2.7.0",
|
||||
"resolved": "https://registry.npmjs.org/domutils/-/domutils-2.7.0.tgz",
|
||||
"integrity": "sha512-8eaHa17IwJUPAiB+SoTYBo5mCdeMgdcAoXJ59m6DT1vw+5iLS3gNoqYaRowaBKtGVrOF1Jz4yDTgYKLK2kvfJg==",
|
||||
"requires": {
|
||||
"dom-serializer": "^1.0.1",
|
||||
"domelementtype": "^2.2.0",
|
||||
"domhandler": "^4.2.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
|
@ -13031,9 +13061,9 @@
|
|||
"integrity": "sha1-AerA/jta9xoqbAL+q7jB/vfgDqs="
|
||||
},
|
||||
"postcss": {
|
||||
"version": "7.0.35",
|
||||
"resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.35.tgz",
|
||||
"integrity": "sha512-3QT8bBJeX/S5zKTTjTCIjRF3If4avAT6kqxcASlTWEtAFCb9NH0OUxNDfgZSWdP5fJnBYCMEWkIFfWeugjzYMg==",
|
||||
"version": "7.0.36",
|
||||
"resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
|
||||
"integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
|
||||
"requires": {
|
||||
"chalk": "^2.4.2",
|
||||
"source-map": "^0.6.1",
|
||||
|
|
@ -14357,6 +14387,16 @@
|
|||
"prop-types": "^15.7.2"
|
||||
}
|
||||
},
|
||||
"react-cookie": {
|
||||
"version": "4.0.3",
|
||||
"resolved": "https://registry.npmjs.org/react-cookie/-/react-cookie-4.0.3.tgz",
|
||||
"integrity": "sha512-cmi6IpdVgTSvjqssqIEvo779Gfqc4uPGHRrKMEdHcqkmGtPmxolGfsyKj95bhdLEKqMdbX8MLBCwezlnhkHK0g==",
|
||||
"requires": {
|
||||
"@types/hoist-non-react-statics": "^3.0.1",
|
||||
"hoist-non-react-statics": "^3.0.0",
|
||||
"universal-cookie": "^4.0.0"
|
||||
}
|
||||
},
|
||||
"react-countup": {
|
||||
"version": "4.3.3",
|
||||
"resolved": "https://registry.npmjs.org/react-countup/-/react-countup-4.3.3.tgz",
|
||||
|
|
@ -14655,9 +14695,9 @@
|
|||
}
|
||||
},
|
||||
"react-hook-form": {
|
||||
"version": "4.10.2",
|
||||
"resolved": "https://registry.npmjs.org/react-hook-form/-/react-hook-form-4.10.2.tgz",
|
||||
"integrity": "sha512-Ule/KqHBwUvuubqGC4WDvOARS6VjlULSS+WHspgQ5FhFKR4ytHDc4AMpjVfnv+Wbz2TEbMp9/ZHmuZsUksPCiA=="
|
||||
"version": "7.11.1",
|
||||
"resolved": "https://registry.npmjs.org/react-hook-form/-/react-hook-form-7.11.1.tgz",
|
||||
"integrity": "sha512-lBt428oU03dNUF5qZy5xqEdANaH3L/ilKWQS2t8wD6zF7FypOv46kEkZmg+oHf3n2xgeGYJgbMIGtYExsfKJ8A=="
|
||||
},
|
||||
"react-image-lightbox": {
|
||||
"version": "5.1.1",
|
||||
|
|
@ -15405,15 +15445,15 @@
|
|||
"integrity": "sha1-wkvOKig62tW8P1jg1IJJuSN52O8="
|
||||
},
|
||||
"renderkid": {
|
||||
"version": "2.0.5",
|
||||
"resolved": "https://registry.npmjs.org/renderkid/-/renderkid-2.0.5.tgz",
|
||||
"integrity": "sha512-ccqoLg+HLOHq1vdfYNm4TBeaCDIi1FLt3wGojTDSvdewUv65oTmI3cnT2E4hRjl1gzKZIPK+KZrXzlUYKnR+vQ==",
|
||||
"version": "2.0.7",
|
||||
"resolved": "https://registry.npmjs.org/renderkid/-/renderkid-2.0.7.tgz",
|
||||
"integrity": "sha512-oCcFyxaMrKsKcTY59qnCAtmDVSLfPbrv6A3tVbPdFMMrv5jaK10V6m40cKsoPNhAqN6rmHW9sswW4o3ruSrwUQ==",
|
||||
"requires": {
|
||||
"css-select": "^2.0.2",
|
||||
"dom-converter": "^0.2",
|
||||
"htmlparser2": "^3.10.1",
|
||||
"lodash": "^4.17.20",
|
||||
"strip-ansi": "^3.0.0"
|
||||
"css-select": "^4.1.3",
|
||||
"dom-converter": "^0.2.0",
|
||||
"htmlparser2": "^6.1.0",
|
||||
"lodash": "^4.17.21",
|
||||
"strip-ansi": "^3.0.1"
|
||||
},
|
||||
"dependencies": {
|
||||
"ansi-regex": {
|
||||
|
|
@ -15421,6 +15461,56 @@
|
|||
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
|
||||
"integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
|
||||
},
|
||||
"css-select": {
|
||||
"version": "4.1.3",
|
||||
"resolved": "https://registry.npmjs.org/css-select/-/css-select-4.1.3.tgz",
|
||||
"integrity": "sha512-gT3wBNd9Nj49rAbmtFHj1cljIAOLYSX1nZ8CB7TBO3INYckygm5B7LISU/szY//YmdiSLbJvDLOx9VnMVpMBxA==",
|
||||
"requires": {
|
||||
"boolbase": "^1.0.0",
|
||||
"css-what": "^5.0.0",
|
||||
"domhandler": "^4.2.0",
|
||||
"domutils": "^2.6.0",
|
||||
"nth-check": "^2.0.0"
|
||||
}
|
||||
},
|
||||
"css-what": {
|
||||
"version": "5.0.1",
|
||||
"resolved": "https://registry.npmjs.org/css-what/-/css-what-5.0.1.tgz",
|
||||
"integrity": "sha512-FYDTSHb/7KXsWICVsxdmiExPjCfRC4qRFBdVwv7Ax9hMnvMmEjP9RfxTEZ3qPZGmADDn2vAKSo9UcN1jKVYscg=="
|
||||
},
|
||||
"dom-serializer": {
|
||||
"version": "1.3.2",
|
||||
"resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.3.2.tgz",
|
||||
"integrity": "sha512-5c54Bk5Dw4qAxNOI1pFEizPSjVsx5+bpJKmL2kPn8JhBUq2q09tTCa3mjijun2NfK78NMouDYNMBkOrPZiS+ig==",
|
||||
"requires": {
|
||||
"domelementtype": "^2.0.1",
|
||||
"domhandler": "^4.2.0",
|
||||
"entities": "^2.0.0"
|
||||
}
|
||||
},
|
||||
"domelementtype": {
|
||||
"version": "2.2.0",
|
||||
"resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.2.0.tgz",
|
||||
"integrity": "sha512-DtBMo82pv1dFtUmHyr48beiuq792Sxohr+8Hm9zoxklYPfa6n0Z3Byjj2IV7bmr2IyqClnqEQhfgHJJ5QF0R5A=="
|
||||
},
|
||||
"domutils": {
|
||||
"version": "2.7.0",
|
||||
"resolved": "https://registry.npmjs.org/domutils/-/domutils-2.7.0.tgz",
|
||||
"integrity": "sha512-8eaHa17IwJUPAiB+SoTYBo5mCdeMgdcAoXJ59m6DT1vw+5iLS3gNoqYaRowaBKtGVrOF1Jz4yDTgYKLK2kvfJg==",
|
||||
"requires": {
|
||||
"dom-serializer": "^1.0.1",
|
||||
"domelementtype": "^2.2.0",
|
||||
"domhandler": "^4.2.0"
|
||||
}
|
||||
},
|
||||
"nth-check": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/nth-check/-/nth-check-2.0.0.tgz",
|
||||
"integrity": "sha512-i4sc/Kj8htBrAiH1viZ0TgU8Y5XqCaV/FziYK6TBczxmeKm3AEFWqqF3195yKudrarqy7Zu80Ra5dobFjn9X/Q==",
|
||||
"requires": {
|
||||
"boolbase": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"strip-ansi": {
|
||||
"version": "3.0.1",
|
||||
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
|
||||
|
|
@ -16724,9 +16814,9 @@
|
|||
}
|
||||
},
|
||||
"ssri": {
|
||||
"version": "7.1.0",
|
||||
"resolved": "https://registry.npmjs.org/ssri/-/ssri-7.1.0.tgz",
|
||||
"integrity": "sha512-77/WrDZUWocK0mvA5NTRQyveUf+wsrIc6vyrxpS8tVvYBcX215QbafrJR3KtkpskIzoFLqqNuuYQvxaMjXJ/0g==",
|
||||
"version": "7.1.1",
|
||||
"resolved": "https://registry.npmjs.org/ssri/-/ssri-7.1.1.tgz",
|
||||
"integrity": "sha512-w+daCzXN89PseTL99MkA+fxJEcU3wfaE/ah0i0lnOlpG1CYLJ2ZjzEry68YBKfLs4JfoTShrTEsJkAZuNZ/stw==",
|
||||
"requires": {
|
||||
"figgy-pudding": "^3.5.1",
|
||||
"minipass": "^3.1.1"
|
||||
|
|
@ -17916,6 +18006,15 @@
|
|||
"through2-filter": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"universal-cookie": {
|
||||
"version": "4.0.4",
|
||||
"resolved": "https://registry.npmjs.org/universal-cookie/-/universal-cookie-4.0.4.tgz",
|
||||
"integrity": "sha512-lbRVHoOMtItjWbM7TwDLdl8wug7izB0tq3/YVKhT/ahB4VDvWMyvnADfnJI8y6fSvsjh51Ix7lTGC6Tn4rMPhw==",
|
||||
"requires": {
|
||||
"@types/cookie": "^0.3.3",
|
||||
"cookie": "^0.4.0"
|
||||
}
|
||||
},
|
||||
"universalify": {
|
||||
"version": "0.1.2",
|
||||
"resolved": "https://registry.npmjs.org/universalify/-/universalify-0.1.2.tgz",
|
||||
|
|
|
|||
|
|
@ -43,13 +43,14 @@
|
|||
"react-bootstrap-table-next": "^3.3.5",
|
||||
"react-bootstrap-table2-paginator": "^2.1.2",
|
||||
"react-chartjs-2": "^2.10.0",
|
||||
"react-cookie": "^4.0.3",
|
||||
"react-countup": "^4.3.3",
|
||||
"react-datetime": "^2.16.3",
|
||||
"react-dom": "^16.13.1",
|
||||
"react-dropzone": "^10.2.2",
|
||||
"react-es6-progressbar.js": "^1.1.0",
|
||||
"react-flatpickr": "^3.10.6",
|
||||
"react-hook-form": "^4.10.2",
|
||||
"react-hook-form": "^7.11.1",
|
||||
"react-image-lightbox": "^5.1.1",
|
||||
"react-image-video-lightbox": "^2.0.1",
|
||||
"react-leaflet": "^2.7.0",
|
||||
|
|
@ -72,7 +73,7 @@
|
|||
"uuid": "^3.4.0"
|
||||
},
|
||||
"scripts": {
|
||||
"start": "react-scripts start",
|
||||
"start": "HOST=beta.jamkazam.local react-scripts start",
|
||||
"build": "react-scripts build",
|
||||
"eject": "react-scripts eject",
|
||||
"scss": "gulp",
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700|Poppins:100,200,300,400,500,600,700,800,900&display=swap"
|
||||
/>
|
||||
|
||||
<title>Falcon React | ReactJS Dashboard & WebApp Template</title>
|
||||
<title>JamKazam</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
|
|
|||
|
|
@ -7,7 +7,8 @@ import 'react-datetime/css/react-datetime.css';
|
|||
import 'react-image-lightbox/style.css';
|
||||
|
||||
const App = () => {
|
||||
return (
|
||||
|
||||
return (
|
||||
<Router basename={process.env.PUBLIC_URL}>
|
||||
<Layout />
|
||||
</Router>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
import React, { useState, useEffect } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import AppContext from './context/Context';
|
||||
import { AuthProvider } from "./context/AuthContext";
|
||||
import { settings } from './config';
|
||||
import toggleStylesheet from './helpers/toggleStylesheet';
|
||||
import { getItemFromStore, setItemToStore, themeColors } from './helpers/utils';
|
||||
|
|
@ -18,7 +19,7 @@ const Main = props => {
|
|||
const [currency, setCurrency] = useState(settings.currency);
|
||||
const [showBurgerMenu, setShowBurgerMenu] = useState(settings.showBurgerMenu);
|
||||
const [isLoaded, setIsLoaded] = useState(false);
|
||||
const [isOpenSidePanel, setIsOpenSidePanel] = useState(false);
|
||||
const [isOpenSidePanel, setIsOpenSidePanel] = useState(true);
|
||||
const [navbarCollapsed, setNavbarCollapsed] = useState(false);
|
||||
|
||||
const [navbarStyle, setNavbarStyle] = useState(getItemFromStore('navbarStyle', settings.navbarStyle));
|
||||
|
|
@ -114,7 +115,11 @@ const Main = props => {
|
|||
);
|
||||
}
|
||||
|
||||
return <AppContext.Provider value={value}>{props.children}</AppContext.Provider>;
|
||||
return <AppContext.Provider value={value}>
|
||||
<AuthProvider>
|
||||
{props.children}
|
||||
</AuthProvider>
|
||||
</AppContext.Provider>;
|
||||
};
|
||||
|
||||
Main.propTypes = { children: PropTypes.node };
|
||||
|
|
|
|||
|
|
@ -0,0 +1,8 @@
|
|||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
width="18px" height="18px">
|
||||
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<path d="M8.85,0 C3.963,0 0,3.962 0,8.85 C0,13.738 3.963,17.7 8.85,17.7 C13.737,17.7 17.7,13.738 17.7,8.85 C17.7,3.962 13.737,0 8.85,0 L8.85,0 Z M8.85,16.644 C7.816,16.644 7.092,15.921 7.092,14.886 C7.092,13.881 7.831,13.15 8.85,13.15 C9.869,13.15 10.608,13.881 10.608,14.886 C10.608,15.954 9.917,16.644 8.85,16.644 L8.85,16.644 Z M11.149,9.208 C10.629,9.728 10.139,10.22 10.139,10.577 C10.139,10.879 10.012,10.849 10.213,11.198 C10.292,11.354 10.288,11.514 10.21,11.641 C10.132,11.767 9.991,11.842 9.833,11.842 L8.028,11.842 C7.869,11.842 7.737,11.827 7.555,11.647 C7.088,11.128 7.178,10.757 7.178,10.33 C7.178,9.375 7.91,8.654 8.618,7.957 C9.26,7.325 9.867,6.728 9.867,6.041 C9.867,5.326 9.243,4.864 8.279,4.864 C7.202,4.864 6.483,5.11 5.922,5.351 L5.735,5.393 L5.586,5.393 L5.354,5.163 L5.331,4.974 L5.331,3.352 C5.331,3.253 5.331,2.992 5.588,2.861 C6.229,2.554 7.299,2.191 8.792,2.191 C11.34,2.191 13.053,3.664 13.053,5.857 C13.053,7.302 11.997,8.359 11.149,9.208 L11.149,9.208 Z" id="Imported-Layers" fill="#575757"></path>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
|
|
@ -3,3 +3,5 @@
|
|||
// user.scss
|
||||
//
|
||||
// Place your own theme CSS or SCSS rules below this line, these rules will override any Bootstrap and theme variables.
|
||||
|
||||
@import './custom/user.css';
|
||||
|
|
@ -0,0 +1,66 @@
|
|||
|
||||
/*# sourceMappingURL=user.min.css.map */
|
||||
:root {
|
||||
--jk-good: #198754;
|
||||
--jk-fair: #e0a500;
|
||||
--jk-high: #990000;
|
||||
}
|
||||
|
||||
.nav-active .nav-link-text{
|
||||
color: --falcon-blue;
|
||||
}
|
||||
.nav-link-icon {
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.navbar-vertical {
|
||||
z-index: 1031;
|
||||
}
|
||||
|
||||
.latency-good {
|
||||
background-color: var(--jk-good);
|
||||
color: white;
|
||||
min-width: 50px;
|
||||
}
|
||||
.latency-fair {
|
||||
background-color: var(--jk-fair);
|
||||
color: white;
|
||||
min-width: 50px;
|
||||
}
|
||||
|
||||
.latency-high {
|
||||
background-color: var(--jk-high);
|
||||
color: white;
|
||||
min-width: 50px;
|
||||
}
|
||||
|
||||
.swiper-button-prev:after,
|
||||
.swiper-button-next:after {
|
||||
font-size: 25px !important;
|
||||
}
|
||||
|
||||
/* Hover dropdown */
|
||||
|
||||
.hover_drop_down.btn-group ul.dropdown-menu{margin-top:42px;}/*To avoid unwanted close*/
|
||||
.hover_drop_down:hover ul.dropdown-menu{
|
||||
display: block;
|
||||
}
|
||||
|
||||
.hover_drop_down.btn-group ul.dropdown-menu a {
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.hover_drop_down.btn-group ul.dropdown-menu a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.alert-top-fixed {
|
||||
position: fixed;
|
||||
width: 75%;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 0;
|
||||
z-index: 2000;
|
||||
}
|
||||
|
|
@ -1,11 +1,13 @@
|
|||
import React, { useState, useEffect } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Link } from 'react-router-dom';
|
||||
import { Link, useHistory } from 'react-router-dom';
|
||||
import { toast } from 'react-toastify';
|
||||
import { Button, Form, Row, Col, FormGroup, Input, CustomInput, Label } from 'reactstrap';
|
||||
import Divider from '../common/Divider';
|
||||
import SocialAuthButtons from './SocialAuthButtons';
|
||||
import withRedirect from '../../hoc/withRedirect';
|
||||
import { useAuth } from '../../context/AuthContext';
|
||||
import { signin } from '../../services/authService';
|
||||
|
||||
const LoginForm = ({ setRedirect, hasLabel, layout }) => {
|
||||
// State
|
||||
|
|
@ -14,11 +16,24 @@ const LoginForm = ({ setRedirect, hasLabel, layout }) => {
|
|||
const [remember, setRemember] = useState(true);
|
||||
const [isDisabled, setIsDisabled] = useState(true);
|
||||
|
||||
const history = useHistory();
|
||||
const { setCurrentUser} = useAuth();
|
||||
|
||||
// Handler
|
||||
const handleSubmit = e => {
|
||||
const handleSubmit = async e => {
|
||||
e.preventDefault();
|
||||
toast.success(`Logged in as ${email}`);
|
||||
setRedirect(true);
|
||||
const credentials = {email, password}
|
||||
const user = await signin(credentials)
|
||||
console.log("handleSubmit", user);
|
||||
if(user){
|
||||
setCurrentUser(user)
|
||||
localStorage.setItem('user', user)
|
||||
toast.success(`Signed in as ${email}`);
|
||||
setRedirect(true);
|
||||
}else{
|
||||
toast.error("Incorrect email or password");
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
|
|
|
|||
|
|
@ -1,20 +1,29 @@
|
|||
import React, { Fragment } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Button } from 'reactstrap';
|
||||
import { Link } from 'react-router-dom';
|
||||
//import { Link } from 'react-router-dom';
|
||||
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
||||
import rocket from '../../assets/img/illustrations/rocket.png';
|
||||
|
||||
const LogoutContent = ({ layout, titleTag: TitleTag }) => {
|
||||
const goToLogin = () => {
|
||||
window.location.href = `${process.env.REACT_APP_LEGACY_BASE_URL}/signin`
|
||||
}
|
||||
return (
|
||||
<Fragment>
|
||||
<img className="d-block mx-auto mb-4" src={rocket} alt="shield" width={70} />
|
||||
<TitleTag>See you again!</TitleTag>
|
||||
<p>
|
||||
Thanks for using Falcon. You are <br className="d-none d-sm-block" />
|
||||
Thanks for using JamKazam. You are <br className="d-none d-sm-block" />
|
||||
now successfully signed out.
|
||||
{process.env.REACT_APP_LEGACY_BASE_URL}
|
||||
</p>
|
||||
<Button tag={Link} color="primary" size="sm" className="mt-3" to={`/authentication/${layout}/login`}>
|
||||
{/* <Button tag={Link} color="primary" size="sm" className="mt-3" to={`/authentication/${layout}/login`}>
|
||||
<FontAwesomeIcon icon="chevron-left" transform="shrink-4 down-1" className="mr-1" />
|
||||
Return to Login
|
||||
</Button> */}
|
||||
|
||||
<Button color="primary" size="sm" className="mt-3" onClick={goToLogin} target="_blank">
|
||||
<FontAwesomeIcon icon="chevron-left" transform="shrink-4 down-1" className="mr-1" />
|
||||
Return to Login
|
||||
</Button>
|
||||
|
|
|
|||
|
|
@ -1,23 +1,25 @@
|
|||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Redirect, Route, Switch, withRouter } from 'react-router-dom';
|
||||
import Login from './Login';
|
||||
//import Login from './Login';
|
||||
import Start from './Start';
|
||||
import Logout from './Logout';
|
||||
import Registration from './Registration';
|
||||
import ForgetPassword from './ForgetPassword';
|
||||
import PasswordReset from './PasswordReset';
|
||||
import ConfirmMail from './ConfirmMail';
|
||||
import LockScreen from './LockScreen';
|
||||
// import Registration from './Registration';
|
||||
// import ForgetPassword from './ForgetPassword';
|
||||
// import PasswordReset from './PasswordReset';
|
||||
// import ConfirmMail from './ConfirmMail';
|
||||
// import LockScreen from './LockScreen';
|
||||
|
||||
const AuthBasicRoutes = ({ match: { url } }) => (
|
||||
<Switch>
|
||||
<Route path={`${url}/login`} exact component={Login} />
|
||||
{/* <Route path={`${url}/login`} exact component={Login} /> */}
|
||||
<Route path={`${url}/start`} exact component={Start} />
|
||||
<Route path={`${url}/logout`} exact component={Logout} />
|
||||
<Route path={`${url}/register`} exact component={Registration} />
|
||||
{/* <Route path={`${url}/register`} exact component={Registration} />
|
||||
<Route path={`${url}/forget-password`} exact component={ForgetPassword} />
|
||||
<Route path={`${url}/confirm-mail`} exact component={ConfirmMail} />
|
||||
<Route path={`${url}/password-reset`} exact component={PasswordReset} />
|
||||
<Route path={`${url}/lock-screen`} exact component={LockScreen} />
|
||||
<Route path={`${url}/lock-screen`} exact component={LockScreen} /> */}
|
||||
|
||||
{/*Redirect*/}
|
||||
<Redirect to="/errors/404" />
|
||||
|
|
|
|||
|
|
@ -0,0 +1,28 @@
|
|||
import React from 'react';
|
||||
import { Row, Col, Button } from "reactstrap";
|
||||
import { Fragment } from 'react';
|
||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
||||
|
||||
const Start = () => {
|
||||
const goToLogin = () => {
|
||||
window.open(`${process.env.REACT_APP_LEGACY_BASE_URL}/signin`, '_blank')
|
||||
}
|
||||
return(
|
||||
<Fragment>
|
||||
<Row className="text-left justify-content-between">
|
||||
<Col xs="auto">
|
||||
<h5>Start</h5>
|
||||
</Col>
|
||||
<Col xs="auto">
|
||||
<p>To begin please login to your JamKazam account and reload this page</p>
|
||||
<Button color="primary" size="sm" className="mt-3" onClick={goToLogin} target="_blank">
|
||||
<FontAwesomeIcon icon="chevron-left" transform="shrink-4 down-1" className="mr-1" />
|
||||
Go to Login
|
||||
</Button>
|
||||
</Col>
|
||||
</Row>
|
||||
</Fragment>
|
||||
)
|
||||
}
|
||||
|
||||
export default Start;
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
import React, { useState, useRef } from 'react';
|
||||
import { Tooltip } from 'reactstrap';
|
||||
|
||||
const JKTooltip = props => {
|
||||
const [tooltipOpen, setTooltipOpen] = useState(false);
|
||||
const iconRef = useRef();
|
||||
const toggle = () => setTooltipOpen(!tooltipOpen);
|
||||
|
||||
return (
|
||||
<a href="#">
|
||||
<img
|
||||
ref={iconRef}
|
||||
src={require('../../assets/img/icons/question_icon.svg')}
|
||||
height="12"
|
||||
width="12"
|
||||
style={{ opacity: '.7' }}
|
||||
/>
|
||||
<Tooltip placement="auto" isOpen={tooltipOpen} target={iconRef} toggle={toggle}>
|
||||
{props.title}
|
||||
</Tooltip>
|
||||
</a>
|
||||
);
|
||||
};
|
||||
|
||||
export default JKTooltip;
|
||||
|
|
@ -13,10 +13,12 @@ import DashBoardDepositStatus from './DashboardDepositStatus';
|
|||
const PurchasesTable = loadable(() => import('./PurchasesTable'));
|
||||
const ActiveUsersMap = loadable(() => import('./ActiveUsersMap'));
|
||||
|
||||
|
||||
const Dashboard = () => {
|
||||
// State
|
||||
const [isSelected, setIsSelected] = useState(false);
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
toast(
|
||||
<Fragment>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,10 @@
|
|||
import React from "react";
|
||||
|
||||
const JKDashboard = () => {
|
||||
|
||||
return(
|
||||
<h1>Dashboard</h1>
|
||||
)
|
||||
}
|
||||
|
||||
export default JKDashboard;
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
import React, {useEffect} from "react";
|
||||
import { useAuth } from '../../context/AuthContext';
|
||||
import avatar from "../../assets/img/team/avatar.png";
|
||||
|
||||
const JKCurrentUserAvatar = () => {
|
||||
const { currentUser } = useAuth();
|
||||
|
||||
if(currentUser && currentUser.photo_url) {
|
||||
return ( <img className="avatar avatar-xl rounded-circle" src={currentUser.photo_url} /> );
|
||||
}else {
|
||||
return ( <img className="avatar avatar-xl rounded-circle" src={avatar} /> );
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
export default JKCurrentUserAvatar;
|
||||
|
|
@ -0,0 +1,55 @@
|
|||
import React, { useEffect, useState } from 'react';
|
||||
import { useAuth } from '../../context/AuthContext';
|
||||
import { getCurrentUser } from '../../helpers/rest';
|
||||
import { Dropdown, DropdownToggle, DropdownMenu, DropdownItem } from 'reactstrap';
|
||||
import { Link } from 'react-router-dom';
|
||||
import JKCurrentUserAvatar from './JKCurrentUserAvatar'
|
||||
|
||||
const JKNavbarTopCurrentUser = () => {
|
||||
const { currentUser, setCurrentUser } = useAuth();
|
||||
const [dropdownOpen, setDropdownOpen] = useState(false);
|
||||
|
||||
const toggle = () => setDropdownOpen(prevState => !prevState);
|
||||
|
||||
const fetchCurrentUser = () => {
|
||||
getCurrentUser()
|
||||
.then(resp => {
|
||||
if (resp.ok) {
|
||||
return resp.json();
|
||||
}
|
||||
})
|
||||
.then(data => {
|
||||
console.log('CURRENT_USER', data);
|
||||
setCurrentUser(data);
|
||||
})
|
||||
.catch(error => console.log(error));
|
||||
};
|
||||
|
||||
const handleLogout = () => {};
|
||||
|
||||
useEffect(() => {
|
||||
fetchCurrentUser();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div>
|
||||
{currentUser &&
|
||||
<Dropdown isOpen={dropdownOpen} toggle={toggle}>
|
||||
<DropdownToggle nav={true} caret>
|
||||
<JKCurrentUserAvatar />
|
||||
{currentUser.name}
|
||||
</DropdownToggle>
|
||||
<DropdownMenu>
|
||||
<DropdownItem tag={Link} to="/pages/settings">
|
||||
My Profile
|
||||
</DropdownItem>
|
||||
<DropdownItem onClick={handleLogout}>Logout</DropdownItem>
|
||||
</DropdownMenu>
|
||||
</Dropdown>
|
||||
}
|
||||
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default JKNavbarTopCurrentUser;
|
||||
|
|
@ -2,7 +2,7 @@ import React from 'react';
|
|||
import PropTypes from 'prop-types';
|
||||
import classNames from 'classnames';
|
||||
import { Link } from 'react-router-dom';
|
||||
import logo from '../../assets/img/illustrations/falcon.png';
|
||||
import logo from '../../assets/img/logos/JK_Logo_blue-2021.png';
|
||||
|
||||
const Logo = ({ at, width, className, ...rest }) => {
|
||||
return (
|
||||
|
|
@ -17,7 +17,7 @@ const Logo = ({ at, width, className, ...rest }) => {
|
|||
>
|
||||
<div
|
||||
className={classNames(
|
||||
'd-flex',
|
||||
|
||||
{
|
||||
'align-items-center py-3': at === 'navbar-vertical',
|
||||
'align-items-center': at === 'navbar-top',
|
||||
|
|
@ -25,9 +25,11 @@ const Logo = ({ at, width, className, ...rest }) => {
|
|||
},
|
||||
className
|
||||
)}
|
||||
style={{ overflow: "visible" }}
|
||||
>
|
||||
<img className="mr-2" src={logo} alt="Logo" width={width} />
|
||||
<span className="text-sans-serif">falcon</span>
|
||||
|
||||
<img className="mr-2" src={logo} alt="Logo" width={width} />
|
||||
|
||||
</div>
|
||||
</Link>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -46,7 +46,7 @@ const NavbarTop = () => {
|
|||
</button>
|
||||
</div>
|
||||
<Logo at="navbar-top" width={40} id="topLogo" />
|
||||
{isTopNav ? (
|
||||
{/* {isTopNav ? (
|
||||
<Collapse navbar isOpen={navbarCollapsed} className="scrollbar">
|
||||
<Nav navbar>
|
||||
<NavbarTopDropDownMenus setNavbarCollapsed={setNavbarCollapsed} />
|
||||
|
|
@ -58,7 +58,7 @@ const NavbarTop = () => {
|
|||
<SearchBox autoCompleteItem={autoCompleteInitialItem} />
|
||||
</NavItem>
|
||||
</Nav>
|
||||
)}
|
||||
)} */}
|
||||
|
||||
<TopNavRightSideNavItem />
|
||||
</Navbar>
|
||||
|
|
|
|||
|
|
@ -64,11 +64,11 @@ const NavbarVertical = ({ navbarStyle }) => {
|
|||
light
|
||||
>
|
||||
<Flex align="center">
|
||||
<ToggleButton
|
||||
{/* <ToggleButton
|
||||
isNavbarVerticalCollapsed={isNavbarVerticalCollapsed}
|
||||
setIsNavbarVerticalCollapsed={setIsNavbarVerticalCollapsed}
|
||||
/>
|
||||
<Logo at="navbar-vertical" width={40} />
|
||||
/> */}
|
||||
<Logo at="navbar-vertical" width={250} />
|
||||
</Flex>
|
||||
|
||||
<Collapse
|
||||
|
|
|
|||
|
|
@ -1,14 +1,32 @@
|
|||
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
||||
import React, { useState } from 'react';
|
||||
import { Link } from 'react-router-dom';
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import { Link, useHistory } from 'react-router-dom';
|
||||
import { DropdownItem, DropdownMenu, DropdownToggle, Dropdown } from 'reactstrap';
|
||||
import team3 from '../../assets/img/team/3.jpg';
|
||||
import Avatar from '../common/Avatar';
|
||||
import { useAuth } from '../../context/AuthContext';
|
||||
|
||||
const ProfileDropdown = () => {
|
||||
const [dropdownOpen, setDropdownOpen] = useState(false);
|
||||
const toggle = () => setDropdownOpen(prevState => !prevState);
|
||||
const {currentUser, setCurrentUser} = useAuth();
|
||||
const history = useHistory();
|
||||
//const [cookies, setCookie, removeCookie] = useCookies(['remember_token']);
|
||||
|
||||
const handleLogout = () => {
|
||||
//setCurrentUser(null);
|
||||
//localStorage.setItem('user', null);
|
||||
// removeCookie("remember_token", {
|
||||
// domain: ".jamkazam.local"
|
||||
// });
|
||||
history.push('/authentication/basic/logout');
|
||||
console.log("signout...");
|
||||
}
|
||||
|
||||
|
||||
return (
|
||||
|
||||
// <Avatar src={team3} />
|
||||
<Dropdown
|
||||
nav
|
||||
inNavbar
|
||||
|
|
@ -24,11 +42,11 @@ const ProfileDropdown = () => {
|
|||
}}
|
||||
>
|
||||
<DropdownToggle nav className="pr-0">
|
||||
<Avatar src={team3} />
|
||||
{currentUser && currentUser.name}
|
||||
</DropdownToggle>
|
||||
<DropdownMenu right className="dropdown-menu-card">
|
||||
<div className="bg-white rounded-soft py-2">
|
||||
<DropdownItem className="font-weight-bold text-warning" href="#!">
|
||||
{/* <DropdownItem className="font-weight-bold text-warning" href="#!">
|
||||
<FontAwesomeIcon icon="crown" className="mr-1" />
|
||||
<span>Go Pro</span>
|
||||
</DropdownItem>
|
||||
|
|
@ -41,8 +59,11 @@ const ProfileDropdown = () => {
|
|||
<DropdownItem divider />
|
||||
<DropdownItem tag={Link} to="/pages/settings">
|
||||
Settings
|
||||
</DropdownItem>
|
||||
<DropdownItem tag={Link} to="/authentication/basic/logout">
|
||||
</DropdownItem> */}
|
||||
<DropdownItem tag={Link} to="/pages/settings">
|
||||
My Profile
|
||||
</DropdownItem>
|
||||
<DropdownItem onClick={handleLogout}>
|
||||
Logout
|
||||
</DropdownItem>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,23 +1,24 @@
|
|||
import React, { useContext } from 'react';
|
||||
import { Nav, NavItem, NavLink, UncontrolledTooltip } from 'reactstrap';
|
||||
import ProfileDropdown from './ProfileDropdown';
|
||||
import NotificationDropdown from './NotificationDropdown';
|
||||
import SettingsAnimatedIcon from './SettingsAnimatedIcon';
|
||||
import CartNotification from './CartNotification';
|
||||
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
||||
import { Link } from 'react-router-dom';
|
||||
// import ProfileDropdown from './ProfileDropdown';
|
||||
// import NotificationDropdown from './NotificationDropdown';
|
||||
// import SettingsAnimatedIcon from './SettingsAnimatedIcon';
|
||||
// import CartNotification from './CartNotification';
|
||||
// import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
||||
// import { Link } from 'react-router-dom';
|
||||
import AppContext from '../../context/Context';
|
||||
import classNames from 'classnames';
|
||||
import { navbarBreakPoint } from '../../config';
|
||||
// import classNames from 'classnames';
|
||||
// import { navbarBreakPoint } from '../../config';
|
||||
import JKNavbarTopProfile from './JKNavbarTopProfile';
|
||||
|
||||
const TopNavRightSideNavItem = () => {
|
||||
const { isTopNav, isCombo } = useContext(AppContext);
|
||||
return (
|
||||
<Nav navbar className="navbar-nav-icons ml-auto flex-row align-items-center">
|
||||
<NavItem>
|
||||
{/* <NavItem>
|
||||
<SettingsAnimatedIcon />
|
||||
</NavItem>
|
||||
{(isCombo || isTopNav) && (
|
||||
</NavItem> */}
|
||||
{/* {(isCombo || isTopNav) && (
|
||||
<NavItem className={classNames(`p-2 px-lg-0 cursor-pointer`, { [`d-${navbarBreakPoint}-none`]: isCombo })}>
|
||||
<NavLink tag={Link} to="/changelog" id="changelog">
|
||||
<FontAwesomeIcon icon="code-branch" transform="right-6 grow-4" />
|
||||
|
|
@ -26,10 +27,18 @@ const TopNavRightSideNavItem = () => {
|
|||
Changelog
|
||||
</UncontrolledTooltip>
|
||||
</NavItem>
|
||||
)}
|
||||
<CartNotification />
|
||||
<NotificationDropdown />
|
||||
<ProfileDropdown />
|
||||
)} */}
|
||||
{/* <CartNotification /> */}
|
||||
{/* <NotificationDropdown /> */}
|
||||
|
||||
<NavItem className="me-4 d-none d-md-inline">
|
||||
<div className="navbar-text d-inline">Keep JamKazam Improving:</div>
|
||||
<NavLink className="text-green d-inline navbar-text nav-link">Subscribe</NavLink>
|
||||
</NavItem>
|
||||
|
||||
<NavItem className="nav-item me-2">
|
||||
<JKNavbarTopProfile />
|
||||
</NavItem>
|
||||
</Nav>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -0,0 +1,99 @@
|
|||
import React, {useState, useEffect} from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Alert, Card, CardBody, Col, Row, Button } from 'reactstrap';
|
||||
import Loader from '../common/Loader';
|
||||
import FalconCardHeader from '../common/FalconCardHeader';
|
||||
import { isIterableArray } from '../../helpers/utils';
|
||||
// import useFakeFetch from '../../hooks/useFakeFetch';
|
||||
// import rawPeople from '../../data/people/people';
|
||||
// import peopleCategories from '../../data/people/peopleCategories';
|
||||
// import apiFetch from '../../helpers/apiFetch';
|
||||
import JKPeopleSearch from "./JKPeopleSearch";
|
||||
import JKPeopleList from './JKPeopleList';
|
||||
import { getPeople } from "../../helpers/rest";
|
||||
|
||||
const JKPeople = ({ className }) => {
|
||||
//const { loading, data: people, setData: setPeople } = useFakeFetch(rawPeople);
|
||||
|
||||
const [people, setPeople] = useState([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [showSearch, setShowSearch] = useState(false);
|
||||
|
||||
const fetchPeople = React.useCallback( () => {
|
||||
getPeople()
|
||||
.then(response => {
|
||||
if(!response.ok){
|
||||
//TODO: handle failure
|
||||
console.log(response);
|
||||
throw new Error('Network response was not ok');
|
||||
}
|
||||
return response.json();
|
||||
})
|
||||
.then(data => {
|
||||
console.log('people received', data);
|
||||
setPeople(data.musicians);
|
||||
})
|
||||
.catch( error => {
|
||||
//TODO: handle error
|
||||
console.log(error);
|
||||
}).finally(() => {
|
||||
setLoading(false)
|
||||
});
|
||||
}, [])
|
||||
|
||||
useEffect(() => {
|
||||
fetchPeople();
|
||||
}, [fetchPeople])
|
||||
|
||||
const searchPeople = ({ target }) => {
|
||||
const keyword = target.value.toLowerCase();
|
||||
const filteredResult = people.filter(
|
||||
person => person.name.toLowerCase().includes(keyword) || person.institution.toLowerCase().includes(keyword)
|
||||
);
|
||||
|
||||
setPeople(keyword.length ? filteredResult : people);
|
||||
};
|
||||
|
||||
return (
|
||||
<Card>
|
||||
<FalconCardHeader title="Find New Friends">
|
||||
|
||||
<div className="col-12 col-sm-auto">
|
||||
<Button color="primary" className="me-2 fs--1" onClick={() => setShowSearch(!showSearch)}>Update Search</Button>
|
||||
<Button outline disabled color="secondary" className="fs--1">Reset Filters</Button>
|
||||
</div>
|
||||
|
||||
</FalconCardHeader>
|
||||
|
||||
<JKPeopleSearch show={showSearch} setShow={setShowSearch} setPeople={setPeople} />
|
||||
|
||||
<CardBody className="pt-0">
|
||||
{loading ? (
|
||||
<Loader />
|
||||
) : isIterableArray(people) ? (
|
||||
//Start Find Friends table hidden on small screens
|
||||
|
||||
<JKPeopleList people={people} />
|
||||
|
||||
) : (
|
||||
<Row className="p-card">
|
||||
<Col>
|
||||
<Alert color="info" className="mb-0">
|
||||
No Records!
|
||||
</Alert>
|
||||
</Col>
|
||||
</Row>
|
||||
)}
|
||||
</CardBody>
|
||||
</Card>);
|
||||
}
|
||||
|
||||
JKPeople.propTypes = {
|
||||
className: PropTypes.string
|
||||
};
|
||||
|
||||
JKPeople.defaultProps = {
|
||||
className: 'col-6 col-md-4 col-lg-3 col-xxl-2'
|
||||
};
|
||||
|
||||
export default JKPeople;
|
||||
|
|
@ -0,0 +1,35 @@
|
|||
import React from "react";
|
||||
import { Table } from 'reactstrap';
|
||||
import JKPerson from './JKPerson';
|
||||
import PropTypes from "prop-types";
|
||||
|
||||
const JKPeopleList = ({people}) => {
|
||||
return (
|
||||
<Table className="table-bordered table-striped fs--1">
|
||||
<thead className="bg-200 text-900">
|
||||
<tr>
|
||||
<th scope="col">Name</th>
|
||||
<th scope="col" style={{ minWidth: 250 }}>About</th>
|
||||
<th scope="col">Instruments</th>
|
||||
<th scope="col">Genres</th>
|
||||
<th scope="col">Action</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="list">
|
||||
{people.map((person, index) => (
|
||||
<tr className="align-middle" key={person.id}>
|
||||
<JKPerson {...person} />
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</Table>
|
||||
);
|
||||
}
|
||||
|
||||
JKPeopleList.propTypes = {
|
||||
people: PropTypes.arrayOf(
|
||||
PropTypes.instanceOf(Object)
|
||||
)
|
||||
}
|
||||
|
||||
export default JKPeopleList;
|
||||
|
|
@ -0,0 +1,289 @@
|
|||
import React, { useState, useEffect, useRef } from 'react';
|
||||
import { Button, Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap';
|
||||
import Select from 'react-select';
|
||||
import JKTooltip from '../common/JKTooltip';
|
||||
import PropTypes from 'prop-types';
|
||||
import { getGenres, getInstruments, postPeopleSearch } from '../../helpers/rest';
|
||||
import { useForm, Controller } from 'react-hook-form';
|
||||
|
||||
const JKPeopleSearch = props => {
|
||||
const { show, setShow, setPeople } = props;
|
||||
const [instruments, setInstruments] = useState([]);
|
||||
const [genres, setGenres] = useState([]);
|
||||
|
||||
const { register, handleSubmit, setValue, control } = useForm({
|
||||
defaultValues: {
|
||||
latency_good: true,
|
||||
latency_fair: true,
|
||||
latency_high: true,
|
||||
proficiency_beginner: true,
|
||||
proficiency_intermediate: true,
|
||||
proficiency_expert: true,
|
||||
instruments: []
|
||||
}
|
||||
});
|
||||
|
||||
const toggle = () => setShow(!show);
|
||||
|
||||
const fetchInstruments = async () => {
|
||||
await getInstruments()
|
||||
.then(response => {
|
||||
if (response.ok) {
|
||||
return response.json();
|
||||
}
|
||||
})
|
||||
.then(data => {
|
||||
//console.log(data);
|
||||
setInstruments(
|
||||
data.map(instrument => {
|
||||
return {
|
||||
value: instrument.id,
|
||||
label: instrument.description
|
||||
};
|
||||
})
|
||||
);
|
||||
})
|
||||
.catch(error => console.log(error));
|
||||
};
|
||||
|
||||
const fetchGenres = async () => {
|
||||
await getGenres()
|
||||
.then(response => {
|
||||
if (response.ok) {
|
||||
return response.json();
|
||||
}
|
||||
})
|
||||
.then(data => {
|
||||
console.log(data);
|
||||
setGenres(
|
||||
data.map(genre => {
|
||||
return {
|
||||
value: genre.id,
|
||||
label: genre.description
|
||||
};
|
||||
})
|
||||
);
|
||||
})
|
||||
.catch(error => {
|
||||
console.log(error);
|
||||
});
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
fetchGenres();
|
||||
fetchInstruments();
|
||||
}, []);
|
||||
|
||||
const submitForm = event => {
|
||||
console.log('submitForm');
|
||||
event.preventDefault();
|
||||
handleSubmit(onSubmit)();
|
||||
setShow(false);
|
||||
};
|
||||
|
||||
const onSubmit = async (data) => {
|
||||
let genres = []
|
||||
if(data.genres){
|
||||
genres = data.genres.map(genre => genre.value)
|
||||
}
|
||||
const updatedData = {...data, genres}
|
||||
console.log('submitting...', updatedData);
|
||||
await postPeopleSearch(updatedData)
|
||||
.then(response => {
|
||||
if(!response.ok){
|
||||
//TODO: handle failure
|
||||
console.log(response);
|
||||
throw new Error('Network response was not ok');
|
||||
}
|
||||
return response.json();
|
||||
})
|
||||
.then(data => {
|
||||
console.log('people received', data);
|
||||
setPeople(data.musicians);
|
||||
})
|
||||
.catch(err => console.log(err))
|
||||
};
|
||||
|
||||
const lastActiveOpts = [
|
||||
{ value: '', label: 'Any Range' },
|
||||
{ value: 'Within Last 1 Day', label: 'Within Last 1 Day' },
|
||||
{ value: 'Within Last 7 Day', label: 'Within Last 7 Day' },
|
||||
{ value: 'Within Last 30 Day', label: 'Within Last 30 Day' },
|
||||
{ value: 'Within Last 90 Day', label: 'Within Last 90 Day' }
|
||||
];
|
||||
|
||||
const joinedOpts = [
|
||||
{ value: '', label: 'Any Range' },
|
||||
{ value: 'Within Last 1 Day', label: 'Within Last 1 Day' },
|
||||
{ value: 'Within Last 7 Day', label: 'Within Last 7 Day' },
|
||||
{ value: 'Within Last 30 Day', label: 'Within Last 30 Day' },
|
||||
{ value: 'Within Last 90 Day', label: 'Within Last 90 Day' }
|
||||
];
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Modal isOpen={show} toggle={toggle} size="xl">
|
||||
<ModalHeader toggle={toggle}>Update Search</ModalHeader>
|
||||
<ModalBody>
|
||||
<div className="px-4 pb-4">
|
||||
<form>
|
||||
<div className="row justify-content-start mt-2">
|
||||
{/* first column */}
|
||||
<div className="col-12 col-md-6 mb-3 mb-md-0">
|
||||
<div className="row justify-content-start">
|
||||
<div className="col-6">
|
||||
<label className="form-label">
|
||||
Latency{' '}
|
||||
<JKTooltip title="Latency is the round-trip travel time over the Internet between you and your friend in a session. JamKazam works best with the lowest latency, measured in milliseconds (ms)" />
|
||||
</label>
|
||||
<div className="form-check">
|
||||
<input
|
||||
{...register('latency_good')}
|
||||
type="checkbox"
|
||||
className="form-check-input"
|
||||
defaultChecked
|
||||
onChange={e => setValue('latency_good', e.target.checked)}
|
||||
/>
|
||||
<label className="form-check-label">Good (40ms or less)</label>
|
||||
</div>
|
||||
<div className="form-check">
|
||||
<input
|
||||
{...register('latency_fair')}
|
||||
type="checkbox"
|
||||
className="form-check-input"
|
||||
defaultChecked
|
||||
onChange={e => setValue('latency_fair', e.target.checked)}
|
||||
/>
|
||||
<label className="form-check-label">Fair (41-80ms)</label>
|
||||
</div>
|
||||
<div className="form-check">
|
||||
<input
|
||||
{...register('latency_high')}
|
||||
type="checkbox"
|
||||
className="form-check-input"
|
||||
defaultChecked
|
||||
onChange={e => setValue('latency_high', e.target.checked)}
|
||||
/>
|
||||
<label className="form-check-label">High (81ms +)</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="col-6">
|
||||
<label className="form-label">
|
||||
Skill Level <JKTooltip title="Select the skill levels you want to filter for." />
|
||||
</label>
|
||||
<div className="form-check">
|
||||
<input
|
||||
{...register('proficiency_beginner')}
|
||||
type="checkbox"
|
||||
className="form-check-input"
|
||||
defaultChecked
|
||||
onChange={e => setValue('proficiency_beginner', e.target.checked)}
|
||||
/>
|
||||
<label className="form-check-label">Beginner</label>
|
||||
</div>
|
||||
<div className="form-check">
|
||||
<input
|
||||
{...register('proficiency_intermediate')}
|
||||
type="checkbox"
|
||||
className="form-check-input"
|
||||
defaultChecked
|
||||
onChange={e => setValue('proficiency_intermediate', e.target.checked)}
|
||||
/>
|
||||
<label className="form-check-label">Intermediate</label>
|
||||
</div>
|
||||
<div className="form-check">
|
||||
<input
|
||||
{...register('proficiency_expert')}
|
||||
type="checkbox"
|
||||
className="form-check-input"
|
||||
defaultChecked
|
||||
onChange={e => setValue('proficiency_expert', e.target.checked)}
|
||||
/>
|
||||
<label className="form-check-label">Expert</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* second column */}
|
||||
<div className="col-12 col-md-6">
|
||||
<label className="form-label" htmlFor="instruments">
|
||||
Instruments{' '}
|
||||
<JKTooltip title="Select one or more instruments to filter for. If this field is blank, all instruments will be searched for." />
|
||||
</label>
|
||||
<div>
|
||||
<Controller
|
||||
name="instruments"
|
||||
control={control}
|
||||
render={({ field }) => (
|
||||
<Select {...field} options={instruments} isMulti closeMenuOnSelect={false} />
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
<label className="form-label" htmlFor="genres">
|
||||
Genres{' '}
|
||||
<JKTooltip title="Select one or more genres to filter for. If this field is blank, all genres will be included." />
|
||||
</label>
|
||||
<div>
|
||||
<Controller
|
||||
name="genres"
|
||||
control={control}
|
||||
render={({ field }) => (
|
||||
<Select {...field} options={genres} isMulti closeMenuOnSelect={false} />
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
<label className="form-label" htmlFor="lastActive">
|
||||
Last Active <JKTooltip title="Select onefor when the user was last active on JamKazam." />
|
||||
</label>
|
||||
<div>
|
||||
<Controller
|
||||
name="last_active"
|
||||
control={control}
|
||||
render={({ field }) => (
|
||||
<Select {...field } options={lastActiveOpts} />
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
<label className="form-label" htmlFor="joined">
|
||||
Joined JamKazam <JKTooltip title="Select onefor when the user joined JamKazam." />
|
||||
</label>
|
||||
<div>
|
||||
<Controller
|
||||
name="joined"
|
||||
control={control}
|
||||
render={({ field}) => (
|
||||
<Select {...field} options={joinedOpts} />
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</ModalBody>
|
||||
<ModalFooter>
|
||||
<Button color="secondary" onClick={toggle}>
|
||||
Cancel
|
||||
</Button>{' '}
|
||||
<Button color="primary" onClick={submitForm}>
|
||||
Update Search
|
||||
</Button>
|
||||
</ModalFooter>
|
||||
</Modal>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
JKPeopleSearch.propTypes = {
|
||||
show: PropTypes.bool,
|
||||
setShow: PropTypes.func,
|
||||
setPeople: PropTypes.func
|
||||
};
|
||||
|
||||
JKPeopleSearch.defaultProps = {
|
||||
show: false
|
||||
};
|
||||
|
||||
export default JKPeopleSearch;
|
||||
|
|
@ -0,0 +1,120 @@
|
|||
import React, { Fragment, useState } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Link } from 'react-router-dom';
|
||||
import { Row, Col } from 'reactstrap';
|
||||
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
||||
import avatar from '../../assets/img/team/avatar.png';
|
||||
import JKProfileSidePanel from '../profile/JKProfileSidePanel';
|
||||
import JKProfileAvatar from '../profile/JKProfileAvatar';
|
||||
import JKProfileInstrumentsList from '../profile/JKProfileInstrumentsList';
|
||||
import {getUserProfile} from '../../helpers/rest';
|
||||
|
||||
const JKPerson = ({ id, name, biography, photo_url, instruments }) => {
|
||||
|
||||
const [showSidePanel, setShowSidePanel] = useState(false)
|
||||
const [user, setUser] = useState(null);
|
||||
|
||||
const fetchPerson = () => {
|
||||
console.log("fetchPerson called");
|
||||
getUserProfile(id)
|
||||
.then(response => {
|
||||
if(response.ok){
|
||||
return response.json()
|
||||
}else{
|
||||
|
||||
}
|
||||
})
|
||||
.then(json => {
|
||||
console.log("USER", json);
|
||||
setUser(json)
|
||||
})
|
||||
.catch(error => console.log(error))
|
||||
}
|
||||
|
||||
|
||||
const toggleMoreDetails = () => {
|
||||
setShowSidePanel(prev => !prev)
|
||||
if(!user){
|
||||
fetchPerson()
|
||||
}
|
||||
}
|
||||
return(
|
||||
<Fragment>
|
||||
<td className="text-nowrap">
|
||||
<a onClick={toggleMoreDetails} className="d-flex align-items-center mb-1 fs-0">
|
||||
<div className="avatar avatar-xl">
|
||||
<JKProfileAvatar url={photo_url} />
|
||||
</div>
|
||||
<div className="ms-2">
|
||||
<strong>{name}</strong>
|
||||
</div>
|
||||
</a>
|
||||
<div>
|
||||
<strong>Latency To Me:</strong> 24ms <span className="badge latency-good">GOOD</span>
|
||||
</div>
|
||||
<div>
|
||||
<strong>Last Active:</strong> 1 hour
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
{ biography }
|
||||
{ biography.length > 0 && (
|
||||
<a onClick={toggleMoreDetails}>
|
||||
{' '} more »
|
||||
</a>
|
||||
)}
|
||||
</td>
|
||||
<td>
|
||||
</td>
|
||||
<td>
|
||||
<JKProfileInstrumentsList instruments={instruments} />
|
||||
</td>
|
||||
<td className="text-nowrap">
|
||||
<a
|
||||
href="#"
|
||||
className="btn fs--1 btn-primary px-2 py-1 mr-1"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-placement="top"
|
||||
title="Connect with This Friend"
|
||||
>
|
||||
<FontAwesomeIcon icon="plus" transform="shrink-4 down-1" className="mr-1" />
|
||||
</a>
|
||||
|
||||
<a
|
||||
href="#"
|
||||
className="btn btn-primary fs--1 px-2 py-1 mr-1"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-placement="top"
|
||||
title="Send a Message"
|
||||
>
|
||||
<FontAwesomeIcon icon="comments" transform="shrink-4 down-1" className="mr-1" />
|
||||
</a>
|
||||
|
||||
<a onClick={toggleMoreDetails}>
|
||||
<span className="btn btn-primary fs--1 px-2 py-1" data-bs-toggle="tooltip" title="View Profile">
|
||||
<FontAwesomeIcon icon="user" transform="shrink-4 down-1" className="mr-1" />
|
||||
</span>
|
||||
</a>
|
||||
</td>
|
||||
<JKProfileSidePanel user={user} show={showSidePanel} setShow={setShowSidePanel} />
|
||||
</Fragment>
|
||||
)
|
||||
}
|
||||
|
||||
JKPerson.propTypes = {
|
||||
id: PropTypes.string.isRequired,
|
||||
name: PropTypes.string.isRequired,
|
||||
biography: PropTypes.string.isRequired,
|
||||
photo_url: PropTypes.string,
|
||||
//instruments: PropTypes.arrayOf(PropTypes.string)
|
||||
};
|
||||
|
||||
const JKPersonAvator = ({ url }) => {
|
||||
if (url) {
|
||||
return <img className="avatar avatar-xl rounded-circle" src={url} />;
|
||||
} else {
|
||||
return <img className="avatar avatar-xl rounded-circle" src={avatar} />;
|
||||
}
|
||||
};
|
||||
|
||||
export default JKPerson;
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
import React from "react";
|
||||
import avatar from "../../assets/img/team/avatar.png";
|
||||
|
||||
const JKProfileAvatar = ({url}) => {
|
||||
|
||||
|
||||
if(url) {
|
||||
return ( <img className="avatar avatar-xl rounded-circle" src={url} /> );
|
||||
}else {
|
||||
return ( <img className="avatar avatar-xl rounded-circle" src={avatar} /> );
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
export default JKProfileAvatar;
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
import React from "react";
|
||||
|
||||
const JKProfileGenres = ({genres}) => {
|
||||
let items = []
|
||||
|
||||
const getGenresNames = () => {
|
||||
for(let genre of genres){
|
||||
items.push(genre.genre_id)
|
||||
}
|
||||
return items.join(', ');
|
||||
}
|
||||
|
||||
return (
|
||||
<div>{getGenresNames()}</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default JKProfileGenres;
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
const JKPersonInstrumentsList = ({ instruments }) => {
|
||||
const proficiencies = {
|
||||
'1': 'Beginner',
|
||||
'2': 'Intermediate',
|
||||
'3': 'Expert'
|
||||
};
|
||||
return (
|
||||
instruments &&
|
||||
instruments.map(instrument => (
|
||||
<div key={instrument.instrument_id} className="text-nowrap">
|
||||
<strong>{instrument.description}:</strong> {proficiencies[instrument.proficiency_level]}
|
||||
</div>
|
||||
))
|
||||
);
|
||||
};
|
||||
|
||||
JKPersonInstrumentsList.propTypes = {
|
||||
instruments: PropTypes.arrayOf(PropTypes.object)
|
||||
}
|
||||
|
||||
export default JKPersonInstrumentsList
|
||||
|
|
@ -0,0 +1,167 @@
|
|||
import React, { useEffect, useState } from 'react';
|
||||
import { titleize } from '../../helpers/utils';
|
||||
|
||||
const JKProfileInterests = ({ user }) => {
|
||||
const [freeSessionGenres, setFreeSessionGenres] = useState([]);
|
||||
const [paidSessionGenres, setPaidSessionGenres] = useState([]);
|
||||
const [traditionalBandSessionGenres, setTraditionalBandSessionGenres] = useState([]);
|
||||
const [virtualBandSessionGenres, setVirtualBandSessionGenres] = useState([]);
|
||||
const [coWritingSessionGenres, setCoWritingSessionGenres] = useState([]);
|
||||
|
||||
const { genres } = user;
|
||||
|
||||
const USER_TYPE = 'JamRuby::User';
|
||||
|
||||
// genre types
|
||||
var PROFILE_GENRE_TYPE = 'profile';
|
||||
var VIRTUAL_BAND_GENRE_TYPE = 'virtual_band';
|
||||
var TRADITIONAL_BAND_GENRE_TYPE = 'traditional_band';
|
||||
var PAID_SESSION_GENRE_TYPE = 'paid_sessions';
|
||||
var FREE_SESSION_GENRE_TYPE = 'free_sessions';
|
||||
var COWRITING_GENRE_TYPE = 'cowriting';
|
||||
|
||||
const init = () => {
|
||||
if (user.paid_sessions) {
|
||||
const filteredGenres = genres.filter(genre => {
|
||||
return genre.player_type === USER_TYPE && genre.genre_type === PAID_SESSION_GENRE_TYPE;
|
||||
});
|
||||
setPaidSessionGenres(filteredGenres);
|
||||
}
|
||||
|
||||
if (user.free_sessions) {
|
||||
const filteredGenres = genres.filter(genre => {
|
||||
return genre.player_type === USER_TYPE && genre.genre_type === FREE_SESSION_GENRE_TYPE;
|
||||
});
|
||||
setFreeSessionGenres(filteredGenres);
|
||||
}
|
||||
|
||||
if (user.cowriting) {
|
||||
const filteredGenres = genres.filter(genre => {
|
||||
return genre.player_type === USER_TYPE && genre.genre_type === COWRITING_GENRE_TYPE;
|
||||
});
|
||||
setCoWritingSessionGenres(filteredGenres);
|
||||
}
|
||||
|
||||
if (user.traditional_band) {
|
||||
const filteredGenres = genres.filter(genre => {
|
||||
return genre.player_type === USER_TYPE && genre.genre_type === TRADITIONAL_BAND_GENRE_TYPE;
|
||||
});
|
||||
setTraditionalBandSessionGenres(filteredGenres);
|
||||
}
|
||||
|
||||
if (user.virtual_band) {
|
||||
const filteredGenres = genres.filter(genre => {
|
||||
return genre.player_type === USER_TYPE && genre.genre_type === VIRTUAL_BAND_GENRE_TYPE;
|
||||
});
|
||||
setVirtualBandSessionGenres(filteredGenres);
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
init();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div>
|
||||
{user.paid_sessions && <PaidSessionInterests genres={paidSessionGenres} hourlyRate={user.paid_sessions_hourly_rate} dailyRate={user.paid_sessions_daily_rate} />}
|
||||
|
||||
{user.free_sessions && <FreeSessionInterests genres={freeSessionGenres} />}
|
||||
|
||||
{user.cowriting && <CoWritingSessionInterests genres={coWritingSessionGenres} purpose={user.cowriting_purpose } />}
|
||||
|
||||
{user.traditional_band && <TraditioalBandSessionInterests genres={traditionalBandSessionGenres} commitment={user.traditional_band_commitment} touring={user.traditional_band_touring} />}
|
||||
|
||||
{user.virtual_band && <VirtualBandSessionInterests genres={virtualBandSessionGenres} commitment={user.virtual_band_commitment}/>}
|
||||
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
const FreeSessionInterests = ({ genres }) => {
|
||||
const genresList = genres.map(genre => titleize(genre.genre_id)).join(', ');
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div>I'm interested in playing free gigs</div>
|
||||
<ul>
|
||||
<li>Genre(s): {genres.length > 0 ? genresList : 'Not specified'}</li>
|
||||
</ul>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
const PaidSessionInterests = ({ genres, hourlyRate, dailyRate }) => {
|
||||
const genresList = genres.map(genre => titleize(genre.genre_id)).join(', ');
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div>I'm interested in playing paid gigs</div>
|
||||
<ul>
|
||||
<li>Genre(s): {genres.length > 0 ? genresList : 'Not specified'}</li>
|
||||
<li>Horly rate: {hourlyRate ? hourlyRate : 'Not specified'}</li>
|
||||
<li>Daily rate: {dailyRate ? dailyRate : 'Not specified'}</li>
|
||||
</ul>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
const TraditioalBandSessionInterests = ({ genres, commitment, touring }) => {
|
||||
const genresList = genres.map(genre => titleize(genre.genre_id)).join(', ');
|
||||
const bandCommitmentMap = {
|
||||
"1": "infrequent",
|
||||
"2": "once a week",
|
||||
"3": "2-3 times a week",
|
||||
"4": "4+ times a week"
|
||||
};
|
||||
const canTour = touring ? "Yes" : (canTour === false ? "No" : 'Not specified')
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div>I'm interested in forming traditional band(s)</div>
|
||||
<ul>
|
||||
<li>Genre(s): {genres.length > 0 ? genresList : 'Not specified'}</li>
|
||||
<li>Commitment: {commitment ? bandCommitmentMap[commitment] : 'Not specified' }</li>
|
||||
<li>Touring: {canTour}</li>
|
||||
</ul>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
const VirtualBandSessionInterests = ({ genres, commitment }) => {
|
||||
const genresList = genres.map(genre => titleize(genre.genre_id)).join(', ');
|
||||
const bandCommitmentMap = {
|
||||
"1": "infrequent",
|
||||
"2": "once a week",
|
||||
"3": "2-3 times a week",
|
||||
"4": "4+ times a week"
|
||||
};
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div>I'm interested in forming virtual band(s)</div>
|
||||
<ul>
|
||||
<li>Genre(s): {genres.length > 0 ? genresList : 'Not specified'}</li>
|
||||
<li>Commitment: {commitment ? bandCommitmentMap[commitment] : 'Not specified' }</li>
|
||||
</ul>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
const CoWritingSessionInterests = ({ genres, purpose }) => {
|
||||
const genresList = genres.map(genre => titleize(genre.genre_id)).join(', ');
|
||||
const purposeMap = {
|
||||
"1": "just for fun",
|
||||
"2": "sell music"
|
||||
}
|
||||
return (
|
||||
<div>
|
||||
<div>I'm interested in co-writing - {purpose}</div>
|
||||
<ul>
|
||||
<li>Genre(s): {genres.length > 0 ? genresList : 'Not specified'}</li>
|
||||
<li>Purpose: {purpose ? purposeMap[purpose] : 'Not specified'}</li>
|
||||
</ul>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default JKProfileInterests;
|
||||
|
|
@ -0,0 +1,57 @@
|
|||
import React from 'react';
|
||||
import { Link } from 'react-router-dom';
|
||||
import { titleize } from '../../helpers/utils';
|
||||
|
||||
const JKProfileOnlinePresence = ({ onlinePresences, userId }) => {
|
||||
const itemList = [];
|
||||
|
||||
const serviceUrl = item => {
|
||||
let url;
|
||||
switch (item.service_type) {
|
||||
case 'soundcloud':
|
||||
url = 'www.soundcloud.com';
|
||||
break;
|
||||
|
||||
case 'reverbnation':
|
||||
url = 'www.reverbnation.com';
|
||||
break;
|
||||
|
||||
case 'bandcamp':
|
||||
url = 'www.bandcamp.com';
|
||||
break;
|
||||
|
||||
case 'fandalism':
|
||||
url = 'www.fandalism.com';
|
||||
break;
|
||||
|
||||
case 'youtube':
|
||||
url = 'www.youtube.com';
|
||||
break;
|
||||
|
||||
case 'facebook':
|
||||
url = 'www.facebook.com';
|
||||
break;
|
||||
|
||||
case 'twitter':
|
||||
url = 'www.twitter.com';
|
||||
break;
|
||||
}
|
||||
return url;
|
||||
};
|
||||
|
||||
|
||||
|
||||
return (
|
||||
<div>
|
||||
{onlinePresences.map(item => (
|
||||
<Link to={serviceUrl(item)} key={`${item.service_type}-${userId}`}>
|
||||
{titleize(item.service_type)}
|
||||
</Link>
|
||||
)).reduce((prev, curr) => [prev, ', ', curr])
|
||||
}
|
||||
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default JKProfileOnlinePresence;
|
||||
|
|
@ -0,0 +1,37 @@
|
|||
import React from 'react';
|
||||
import { titleize } from '../../helpers/utils';
|
||||
|
||||
const JKProfilePerformanceSamples = ({samples}) => {
|
||||
const SAMPLE_TYPES = {
|
||||
JAMKAZAM: { description: 'jamkazam' },
|
||||
SOUNDCLOUD: { description: 'soundcloud' },
|
||||
YOUTUBE: { description: 'youtube' }
|
||||
};
|
||||
|
||||
const jamkasamSamples = samples.filter(sample => sample.service_type === SAMPLE_TYPES.JAMKAZAM.description);
|
||||
|
||||
const soundCloudSamples = samples.filter(sample => sample.service_type === SAMPLE_TYPES.SOUNDCLOUD.description);
|
||||
|
||||
const youTubeSamples = samples.filter(sample => sample.service_type === SAMPLE_TYPES.YOUTUBE.description);
|
||||
|
||||
return (
|
||||
<div>
|
||||
<strong>Jamkazam : </strong>
|
||||
{jamkasamSamples.map(sample => (
|
||||
<a href={`/recordings/${sample.claimed_recording.id}`}>{titleize(sample.claimed_recording.name)}</a>
|
||||
))}
|
||||
<br />
|
||||
<strong>SoundCloud: </strong>
|
||||
{soundCloudSamples.map(sample => (
|
||||
<a href={`${sample.claimed_recording.id}`}>{titleize(sample.claimed_recording.name)}</a>
|
||||
))}
|
||||
<br />
|
||||
<strong>Youtube : </strong>
|
||||
{youTubeSamples.map(sample => (
|
||||
<a href={`${sample.claimed_recording.id}`}>{titleize(sample.claimed_recording.name)}</a>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default JKProfilePerformanceSamples;
|
||||
|
|
@ -0,0 +1,140 @@
|
|||
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
||||
import PropTypes from 'prop-types';
|
||||
import React, { useContext, useEffect } from 'react';
|
||||
import classNames from 'classnames';
|
||||
import { Modal, ModalBody, ModalHeader } from 'reactstrap';
|
||||
import ScrollBarCustom from '../common/ScrollBarCustom';
|
||||
import JKProfileAvatar from './JKProfileAvatar';
|
||||
import JKProfileInstrumentsList from './JKProfileInstrumentsList';
|
||||
import { Fragment } from 'react';
|
||||
import JKProfileOnlinePresence from './JKProfileOnlinePresence';
|
||||
import JKProfileInterests from './JKProfileInterests';
|
||||
import JKProfileGenres from './JKProfileGenres';
|
||||
import JKProfilePerformanceSamples from './JKProfilePerformanceSamples';
|
||||
|
||||
const JKProfileSidePanel = props => {
|
||||
const { show, setShow, user } = props;
|
||||
|
||||
const toggle = () => setShow(!show);
|
||||
|
||||
return (
|
||||
<Modal
|
||||
isOpen={show}
|
||||
toggle={toggle}
|
||||
modalClassName="overflow-hidden modal-fixed-right modal-theme"
|
||||
className="modal-dialog-vertical"
|
||||
contentClassName="vh-100 border-0"
|
||||
>
|
||||
<ModalHeader tag="div" toggle={toggle} className="modal-header-settings">
|
||||
{user && (
|
||||
<Fragment>
|
||||
<div className="avatar avatar-2xl d-inline-block me-2">
|
||||
<JKProfileAvatar url={user.photo_url} />
|
||||
</div>
|
||||
<h4 className="d-inline-block align-middle mt-1">{user.name}</h4>
|
||||
</Fragment>
|
||||
)}
|
||||
</ModalHeader>
|
||||
<ScrollBarCustom
|
||||
className="modal-body"
|
||||
contentProps={{
|
||||
renderer: ({ elementRef, ...restProps }) => (
|
||||
<span {...restProps} ref={elementRef} className={classNames('p-card position-absolute')} />
|
||||
)
|
||||
}}
|
||||
>
|
||||
<ModalBody>
|
||||
{user && (
|
||||
<div>
|
||||
<p>
|
||||
<strong>Latency to Me:</strong> 18ms Internet + 8ms Audio{' '}
|
||||
<span className="badge latency-good">GOOD</span>
|
||||
<br />
|
||||
<strong>Location:</strong> {`${user.city}, ${user.country}`}
|
||||
<br />
|
||||
<strong>Skill Level:</strong> Intermediate
|
||||
<br />
|
||||
<strong>Joined JamKazam:</strong> June 1, 2020
|
||||
<br />
|
||||
<strong>Last Active:</strong> 1 Hour Ago
|
||||
</p>
|
||||
|
||||
{user.biography && user.biography.length > 0 && (
|
||||
<div>
|
||||
<h5>About</h5>
|
||||
<p>{user.biography}</p>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{user.instruments && user.instruments.length && (
|
||||
<div>
|
||||
|
||||
<h5>Instruments</h5>
|
||||
<JKProfileInstrumentsList instruments={user.instruments} />
|
||||
</div>
|
||||
)}
|
||||
|
||||
{user.genres && user.genres.length > 0 && (
|
||||
<div>
|
||||
<br />
|
||||
<h5>Genres</h5>
|
||||
<JKProfileGenres genres={user.genres} />
|
||||
</div>
|
||||
)}
|
||||
|
||||
{user.bands && user.bands.length > 0 && (
|
||||
<div>
|
||||
<br />
|
||||
<h5>Bands</h5>
|
||||
{user.bands.map(band => (
|
||||
<p>
|
||||
<a key={band} href="#">
|
||||
{band}
|
||||
</a>
|
||||
</p>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{ user.performance_samples && user.performance_samples.length > 0 &&
|
||||
<div>
|
||||
<h5>Performance Samples</h5>
|
||||
<JKProfilePerformanceSamples samples={user.performance_samples} />
|
||||
</div>
|
||||
}
|
||||
|
||||
{user.online_presences && user.online_presences.length > 0 && (
|
||||
<div>
|
||||
<br />
|
||||
<h5>Online Presence</h5>
|
||||
<JKProfileOnlinePresence onlinePresences={user.online_presences} userId={user.id} />
|
||||
</div>
|
||||
)}
|
||||
|
||||
<br />
|
||||
<h5>Interests</h5>
|
||||
<JKProfileInterests user={user} />
|
||||
|
||||
<div className="p-3 bg-white border-top fixed-bottom">
|
||||
<button className="btn btn-primary">
|
||||
<span className="fas fa-plus" /> Add Friend
|
||||
</button>{' '}
|
||||
<button className="btn btn-outline-primary">
|
||||
<span className="fas fa-comment" /> Send Message
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</ModalBody>
|
||||
</ScrollBarCustom>
|
||||
</Modal>
|
||||
);
|
||||
};
|
||||
|
||||
JKProfileSidePanel.propTypes = {
|
||||
user_id: PropTypes.string
|
||||
};
|
||||
|
||||
JKProfileSidePanel.defaultProps = {};
|
||||
|
||||
export default JKProfileSidePanel;
|
||||
|
|
@ -2,7 +2,7 @@ export const version = '2.10.2';
|
|||
export const navbarBreakPoint = 'xl'; // Vertical navbar breakpoint
|
||||
export const topNavbarBreakpoint = 'lg';
|
||||
export const settings = {
|
||||
isFluid: false,
|
||||
isFluid: true,
|
||||
isRTL: false,
|
||||
isDark: false,
|
||||
isTopNav: false,
|
||||
|
|
|
|||
|
|
@ -0,0 +1,16 @@
|
|||
import React from 'react'
|
||||
|
||||
const AuthContext = React.createContext(null)
|
||||
|
||||
export const AuthProvider = ({ user, children}) => {
|
||||
|
||||
const [currentUser, setCurrentUser] = React.useState(user)
|
||||
|
||||
return(
|
||||
<AuthContext.Provider value={ {currentUser, setCurrentUser} }>
|
||||
{children}
|
||||
</AuthContext.Provider>
|
||||
)
|
||||
}
|
||||
|
||||
export const useAuth = () => React.useContext(AuthContext)
|
||||
|
|
@ -0,0 +1,62 @@
|
|||
function updateOptions(options) {
|
||||
const defaults = {
|
||||
mode: 'cors',
|
||||
credentials: 'include',
|
||||
// cache: 'no-cache',
|
||||
// referrer: 'no-referrer',
|
||||
// redirect: 'follow'
|
||||
}
|
||||
|
||||
const update = { ...options, ...defaults };
|
||||
|
||||
update.headers = {
|
||||
...update.headers,
|
||||
'Content-Type': 'application/json',
|
||||
'Accept': 'application/json'
|
||||
};
|
||||
|
||||
return update;
|
||||
}
|
||||
|
||||
function secureFetch(path, options) {
|
||||
const baseUrl = process.env.REACT_APP_API_BASE_URL
|
||||
return new Promise((resolve, reject) => {
|
||||
fetch(baseUrl + path, options).then(response => {
|
||||
// response only can be ok in range of 2XX
|
||||
if (response.ok) {
|
||||
//console.log('apiFetch response', response)
|
||||
// you can call response.json() here too if you want to return json
|
||||
resolve(response);
|
||||
} else {
|
||||
//handle errors in the way you want to
|
||||
switch (response.status) {
|
||||
case 403:
|
||||
console.log('apiFetch Authentication error');
|
||||
// window.location.href = `${process.env.REACT_APP_LEGACY_BASE_URL}/signin`
|
||||
break;
|
||||
case 404:
|
||||
console.log('apiFetch Object not found');
|
||||
break;
|
||||
case 500:
|
||||
console.log('apiFetch Internal server error');
|
||||
break;
|
||||
default:
|
||||
console.log('apiFetch Some error occured');
|
||||
break;
|
||||
}
|
||||
//here you also can thorow custom error too
|
||||
reject(response);
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
//it will be invoked mostly for network errors
|
||||
//do what ever you want to do with error here
|
||||
console.log(error);
|
||||
reject(error);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
export default function apiFetch(path, options) {
|
||||
return secureFetch(path, updateOptions(options));
|
||||
}
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
import { useAuth } from "../context/AuthContext";
|
||||
import { Route, Redirect } from "react-router-dom";
|
||||
|
||||
const ProtectedRoute = ({component: Component, ...rest}) => {
|
||||
const {currentUser} = useAuth();
|
||||
return (
|
||||
// Show the component only when the user is logged in
|
||||
// Otherwise, redirect the user to /login page
|
||||
<Route {...rest} render={props => (
|
||||
currentUser ?
|
||||
<Component {...props} />
|
||||
: <Redirect to={{pathname: '/authentication/basic/start'}} />
|
||||
)} />
|
||||
);
|
||||
};
|
||||
|
||||
export default ProtectedRoute;
|
||||
|
|
@ -0,0 +1,53 @@
|
|||
import { reject } from "lodash";
|
||||
import apiFetch from "./apiFetch";
|
||||
|
||||
export const getPeople = () => {
|
||||
return new Promise((resolve, reject) => {
|
||||
apiFetch("/search/musicians?results=true")
|
||||
.then(response => resolve(response))
|
||||
.catch(error => reject(error))
|
||||
})
|
||||
}
|
||||
|
||||
export const getUserProfile = (id) => {
|
||||
return new Promise((resolve, reject) => (
|
||||
apiFetch(`/users/${id}/profile?show_teacher=true`)
|
||||
.then(response => resolve(response))
|
||||
.catch(error => reject(error))
|
||||
))
|
||||
}
|
||||
|
||||
export const postPeopleSearch = (data) => {
|
||||
return new Promise((resolve, reject) => {
|
||||
apiFetch("/filter", {
|
||||
method: 'POST',
|
||||
body: JSON.stringify(data)
|
||||
})
|
||||
.then(response => resolve(response))
|
||||
.catch(error => reject(error))
|
||||
})
|
||||
}
|
||||
|
||||
export const getGenres = () => {
|
||||
return new Promise((resolve, reject) => {
|
||||
apiFetch('/genres')
|
||||
.then(response => resolve(response))
|
||||
.catch(error => reject(error))
|
||||
})
|
||||
}
|
||||
|
||||
export const getInstruments = () => {
|
||||
return new Promise((resolve, reject) => {
|
||||
apiFetch('/instruments')
|
||||
.then(response => resolve(response))
|
||||
.catch(error => reject(error))
|
||||
})
|
||||
}
|
||||
|
||||
export const getCurrentUser = () => {
|
||||
return new Promise((resolve, reject) => {
|
||||
apiFetch('/me')
|
||||
.then(response => resolve(response))
|
||||
.catch(error => reject(error))
|
||||
})
|
||||
}
|
||||
|
|
@ -178,6 +178,15 @@ export const getPaginationArray = (totalSize, sizePerPage) => {
|
|||
|
||||
export const capitalize = str => (str.charAt(0).toUpperCase() + str.slice(1)).replace(/-/g, ' ');
|
||||
|
||||
export const titleize = (str) => {
|
||||
return str.replace(
|
||||
/\w\S*/g,
|
||||
(txt) => {
|
||||
return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
export const routesSlicer = ({ routes, columns = 3, rows }) => {
|
||||
const routesCollection = [];
|
||||
routes.map(route => {
|
||||
|
|
@ -211,3 +220,4 @@ export const copyToClipBoard = textFieldRef => {
|
|||
textField.select();
|
||||
document.execCommand('copy');
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@ import Main from './Main';
|
|||
import './helpers/initFA';
|
||||
|
||||
ReactDOM.render(
|
||||
<Main>
|
||||
<App />
|
||||
</Main>,
|
||||
<Main>
|
||||
<App />
|
||||
</Main>,
|
||||
document.getElementById('main')
|
||||
);
|
||||
|
|
|
|||
|
|
@ -1,8 +1,12 @@
|
|||
import React, { useContext, useEffect } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Route, Switch } from 'react-router-dom';
|
||||
import { Route, Switch, Redirect } from 'react-router-dom';
|
||||
|
||||
import Dashboard from '../components/dashboard/Dashboard';
|
||||
import DashboardAlt from '../components/dashboard-alt/DashboardAlt';
|
||||
import JKDashboard from '../components/dashboard/JkDashboard';
|
||||
//import DashboardAlt from '../components/dashboard-alt/DashboardAlt';
|
||||
|
||||
|
||||
import NavbarTop from '../components/navbar/NavbarTop';
|
||||
import NavbarVertical from '../components/navbar/NavbarVertical';
|
||||
import Footer from '../components/footer/Footer';
|
||||
|
|
@ -12,6 +16,8 @@ import ProductProvider from '../components/e-commerce/ProductProvider';
|
|||
import SidePanelModal from '../components/side-panel/SidePanelModal';
|
||||
import { getPageName } from '../helpers/utils';
|
||||
|
||||
import { useAuth } from '../context/AuthContext';
|
||||
|
||||
const DashboardRoutes = loadable(() => import('./DashboardRoutes'));
|
||||
|
||||
const DashboardLayout = ({ location }) => {
|
||||
|
|
@ -34,8 +40,10 @@ const DashboardLayout = ({ location }) => {
|
|||
<div className="content">
|
||||
<NavbarTop />
|
||||
<Switch>
|
||||
<Route path="/" exact component={Dashboard} />
|
||||
<Route path="/dashboard-alt" exact component={DashboardAlt} />
|
||||
|
||||
{/* <Route path="/" exact component={Dashboard} /> */}
|
||||
{/* <Route path="/dashboard-alt" exact component={DashboardAlt} /> */}
|
||||
<Route path="/" exact component={JKDashboard} />
|
||||
<DashboardRoutes />
|
||||
</Switch>
|
||||
{!isKanban && <Footer />}
|
||||
|
|
@ -46,6 +54,19 @@ const DashboardLayout = ({ location }) => {
|
|||
);
|
||||
};
|
||||
|
||||
const ProtectedRoute = ({component: Component, ...rest}) => {
|
||||
const {currentUser} = useAuth();
|
||||
return (
|
||||
// Show the component only when the user is logged in
|
||||
// Otherwise, redirect the user to /login page
|
||||
<Route {...rest} render={props => (
|
||||
currentUser ?
|
||||
<Component {...props} />
|
||||
: <Redirect to={{pathname: '/authentication/basic/start'}} />
|
||||
)} />
|
||||
);
|
||||
};
|
||||
|
||||
DashboardLayout.propTypes = { location: PropTypes.object.isRequired };
|
||||
|
||||
export default DashboardLayout;
|
||||
|
|
|
|||
|
|
@ -1,148 +1,153 @@
|
|||
import { fn } from 'moment';
|
||||
import React from 'react';
|
||||
import { Redirect, Route, Switch } from 'react-router-dom';
|
||||
import Alerts from '../components/bootstrap-components/Alerts';
|
||||
import Avatar from '../components/bootstrap-components/Avatar';
|
||||
import AutocompleteExample from '../components/bootstrap-components/AutocompleteExample';
|
||||
import Backgrounds from '../components/bootstrap-components/Backgrounds';
|
||||
import Badges from '../components/bootstrap-components/Badges';
|
||||
import Breadcrumbs from '../components/bootstrap-components/Breadcrumb';
|
||||
import Buttons from '../components/bootstrap-components/Buttons';
|
||||
import Cards from '../components/bootstrap-components/Cards';
|
||||
import Carousel from '../components/bootstrap-components/Carousel';
|
||||
import Collapses from '../components/bootstrap-components/Collapses';
|
||||
import Combo from '../components/bootstrap-components/Combo';
|
||||
import CookieNotice from '../components/bootstrap-components/CookieNotice';
|
||||
import Dropdowns from '../components/bootstrap-components/Dropdowns';
|
||||
import FalconAccordions from '../components/bootstrap-components/FalconAccordions';
|
||||
import Forms from '../components/bootstrap-components/Forms';
|
||||
import ListGroups from '../components/bootstrap-components/ListGroups';
|
||||
import Modals from '../components/bootstrap-components/Modals';
|
||||
import Navbars from '../components/bootstrap-components/Navbars';
|
||||
import NavBarTop from '../components/bootstrap-components/NavBarTop';
|
||||
import Navs from '../components/bootstrap-components/Navs';
|
||||
import PageHeaders from '../components/bootstrap-components/PageHeaders';
|
||||
import Paginations from '../components/bootstrap-components/Paginations';
|
||||
import Popovers from '../components/bootstrap-components/Popovers';
|
||||
import ProgressBar from '../components/bootstrap-components/ProgressBar';
|
||||
import Sidepanel from '../components/bootstrap-components/Sidepanel';
|
||||
import Spinners from '../components/bootstrap-components/Spinners';
|
||||
import Tables from '../components/bootstrap-components/Tables';
|
||||
import Tabs from '../components/bootstrap-components/Tabs';
|
||||
import Tooltips from '../components/bootstrap-components/Tooltips';
|
||||
import VerticalNavbar from '../components/bootstrap-components/VerticalNavbar';
|
||||
import Calendar from '../components/calendar/Calendar';
|
||||
import ChangeLog from '../components/changelog/ChangeLog';
|
||||
import Chat from '../components/chat/Chat';
|
||||
import GettingStarted from '../components/documentation/GettingStarted';
|
||||
import Checkout from '../components/e-commerce/Checkout';
|
||||
import Customers from '../components/e-commerce/Customers';
|
||||
import FavouriteItems from '../components/e-commerce/FavouriteItems';
|
||||
import OrderDetails from '../components/e-commerce/OrderDetails';
|
||||
import Orders from '../components/e-commerce/Orders';
|
||||
import ProductDetails from '../components/e-commerce/ProductDetails';
|
||||
import Products from '../components/e-commerce/Products';
|
||||
import ShoppingCart from '../components/e-commerce/ShoppingCart';
|
||||
import Compose from '../components/email/Compose';
|
||||
import EmailDetail from '../components/email/EmailDetail';
|
||||
import Inbox from '../components/email/Inbox';
|
||||
import InboxProvider from '../components/email/inbox/InboxProvider';
|
||||
import Starter from '../components/extra/Starter';
|
||||
import Feed from '../components/feed/Feed';
|
||||
import Kanban from '../components/kanban/Kanban';
|
||||
import Activity from '../components/page/Activity';
|
||||
import Associations from '../components/page/Associations';
|
||||
import Billing from '../components/page/Billing';
|
||||
import CustomerDetails from '../components/page/CustomerDetails';
|
||||
import EventCreate from '../components/page/EventCreate';
|
||||
import EventDetail from '../components/page/EventDetail';
|
||||
import Events from '../components/page/Events';
|
||||
import Faq from '../components/page/Faq';
|
||||
import InvitePeople from '../components/page/InvitePeople';
|
||||
import Invoice from '../components/page/Invoice';
|
||||
import Notifications from '../components/page/Notifications';
|
||||
import People from '../components/page/People';
|
||||
import Settings from '../components/page/Settings';
|
||||
import BulkSelect from '../components/plugins/BulkSelect';
|
||||
import CalendarExample from '../components/plugins/CalendarExample';
|
||||
import Chart from '../components/plugins/Chart';
|
||||
import CodeHighlightDoc from '../components/plugins/CodeHighlightDoc';
|
||||
import CountUpExample from '../components/plugins/Countup';
|
||||
import DatetimeExample from '../components/plugins/Datetime';
|
||||
import Dropzone from '../components/plugins/Dropzone';
|
||||
import EchartMap from '../components/plugins/EchartMap';
|
||||
import Echarts from '../components/plugins/Echarts';
|
||||
import EmojiMart from '../components/plugins/EmojiMart';
|
||||
import FontAwesome from '../components/plugins/FontAwesome';
|
||||
import GoogleMapExample from '../components/plugins/GoogleMap';
|
||||
import ImageLightbox from '../components/plugins/ImageLightbox';
|
||||
import Leaflet from '../components/plugins/Leaflet';
|
||||
import Lottie from '../components/plugins/Lottie';
|
||||
import Plyr from '../components/plugins/Plyr';
|
||||
import ProgressBarJs from '../components/plugins/ProgressBarJs';
|
||||
import QuillEditorExample from '../components/plugins/Quill';
|
||||
import ReactBeautifulDnD from '../components/plugins/ReactBeautifulDnD';
|
||||
import ReactBootstrapTable2 from '../components/plugins/ReactBootstrapTable2';
|
||||
import ReactHookFrom from '../components/plugins/ReactHookFrom';
|
||||
import Scrollbar from '../components/plugins/Scrollbar';
|
||||
import Select from '../components/plugins/Select';
|
||||
import SlickCarousel from '../components/plugins/SlickCarousel';
|
||||
import Toastify from '../components/plugins/Toastify';
|
||||
import Typed from '../components/plugins/Typed';
|
||||
import Pricing from '../components/pricing/Pricing';
|
||||
import PricingAlt from '../components/pricing/PricingAlt';
|
||||
import Profile from '../components/profile/Profile';
|
||||
import Borders from '../components/utilities/Borders';
|
||||
import Clearfix from '../components/utilities/Clearfix';
|
||||
import CloseIcon from '../components/utilities/CloseIcon';
|
||||
import Colors from '../components/utilities/Colors';
|
||||
import Display from '../components/utilities/Display';
|
||||
import Embed from '../components/utilities/Embed';
|
||||
import Figures from '../components/utilities/Figures';
|
||||
import Flex from '../components/utilities/Flex';
|
||||
import Grid from '../components/utilities/Grid';
|
||||
import Sizing from '../components/utilities/Sizing';
|
||||
import Spacing from '../components/utilities/Spacing';
|
||||
import StretchedLink from '../components/utilities/StretchedLink';
|
||||
import Typography from '../components/utilities/Typography';
|
||||
import VerticalAlign from '../components/utilities/VerticalAlign';
|
||||
import Visibility from '../components/utilities/Visibility';
|
||||
import Widgets from '../components/widgets/Widgets';
|
||||
// import Alerts from '../components/bootstrap-components/Alerts';
|
||||
// import Avatar from '../components/bootstrap-components/Avatar';
|
||||
// import AutocompleteExample from '../components/bootstrap-components/AutocompleteExample';
|
||||
// import Backgrounds from '../components/bootstrap-components/Backgrounds';
|
||||
// import Badges from '../components/bootstrap-components/Badges';
|
||||
// import Breadcrumbs from '../components/bootstrap-components/Breadcrumb';
|
||||
// import Buttons from '../components/bootstrap-components/Buttons';
|
||||
// import Cards from '../components/bootstrap-components/Cards';
|
||||
// import Carousel from '../components/bootstrap-components/Carousel';
|
||||
// import Collapses from '../components/bootstrap-components/Collapses';
|
||||
// import Combo from '../components/bootstrap-components/Combo';
|
||||
// import CookieNotice from '../components/bootstrap-components/CookieNotice';
|
||||
// import Dropdowns from '../components/bootstrap-components/Dropdowns';
|
||||
// import FalconAccordions from '../components/bootstrap-components/FalconAccordions';
|
||||
// import Forms from '../components/bootstrap-components/Forms';
|
||||
// import ListGroups from '../components/bootstrap-components/ListGroups';
|
||||
// import Modals from '../components/bootstrap-components/Modals';
|
||||
// import Navbars from '../components/bootstrap-components/Navbars';
|
||||
// import NavBarTop from '../components/bootstrap-components/NavBarTop';
|
||||
// import Navs from '../components/bootstrap-components/Navs';
|
||||
// import PageHeaders from '../components/bootstrap-components/PageHeaders';
|
||||
// import Paginations from '../components/bootstrap-components/Paginations';
|
||||
// import Popovers from '../components/bootstrap-components/Popovers';
|
||||
// import ProgressBar from '../components/bootstrap-components/ProgressBar';
|
||||
// import Sidepanel from '../components/bootstrap-components/Sidepanel';
|
||||
// import Spinners from '../components/bootstrap-components/Spinners';
|
||||
// import Tables from '../components/bootstrap-components/Tables';
|
||||
// import Tabs from '../components/bootstrap-components/Tabs';
|
||||
// import Tooltips from '../components/bootstrap-components/Tooltips';
|
||||
// import VerticalNavbar from '../components/bootstrap-components/VerticalNavbar';
|
||||
// import Calendar from '../components/calendar/Calendar';
|
||||
// import ChangeLog from '../components/changelog/ChangeLog';
|
||||
// import Chat from '../components/chat/Chat';
|
||||
// import GettingStarted from '../components/documentation/GettingStarted';
|
||||
// import Checkout from '../components/e-commerce/Checkout';
|
||||
// import Customers from '../components/e-commerce/Customers';
|
||||
// import FavouriteItems from '../components/e-commerce/FavouriteItems';
|
||||
// import OrderDetails from '../components/e-commerce/OrderDetails';
|
||||
// import Orders from '../components/e-commerce/Orders';
|
||||
// import ProductDetails from '../components/e-commerce/ProductDetails';
|
||||
// import Products from '../components/e-commerce/Products';
|
||||
// import ShoppingCart from '../components/e-commerce/ShoppingCart';
|
||||
// import Compose from '../components/email/Compose';
|
||||
// import EmailDetail from '../components/email/EmailDetail';
|
||||
// import Inbox from '../components/email/Inbox';
|
||||
// import InboxProvider from '../components/email/inbox/InboxProvider';
|
||||
// import Starter from '../components/extra/Starter';
|
||||
// import Feed from '../components/feed/Feed';
|
||||
// import Kanban from '../components/kanban/Kanban';
|
||||
// import Activity from '../components/page/Activity';
|
||||
// import Associations from '../components/page/Associations';
|
||||
// import Billing from '../components/page/Billing';
|
||||
// import CustomerDetails from '../components/page/CustomerDetails';
|
||||
// import EventCreate from '../components/page/EventCreate';
|
||||
// import EventDetail from '../components/page/EventDetail';
|
||||
// import Events from '../components/page/Events';
|
||||
// import Faq from '../components/page/Faq';
|
||||
// import InvitePeople from '../components/page/InvitePeople';
|
||||
// import Invoice from '../components/page/Invoice';
|
||||
// import Notifications from '../components/page/Notifications';
|
||||
// import People from '../components/page/People';
|
||||
// import Settings from '../components/page/Settings';
|
||||
// import BulkSelect from '../components/plugins/BulkSelect';
|
||||
// import CalendarExample from '../components/plugins/CalendarExample';
|
||||
// import Chart from '../components/plugins/Chart';
|
||||
// import CodeHighlightDoc from '../components/plugins/CodeHighlightDoc';
|
||||
// import CountUpExample from '../components/plugins/Countup';
|
||||
// import DatetimeExample from '../components/plugins/Datetime';
|
||||
// import Dropzone from '../components/plugins/Dropzone';
|
||||
// import EchartMap from '../components/plugins/EchartMap';
|
||||
// import Echarts from '../components/plugins/Echarts';
|
||||
// import EmojiMart from '../components/plugins/EmojiMart';
|
||||
// import FontAwesome from '../components/plugins/FontAwesome';
|
||||
// import GoogleMapExample from '../components/plugins/GoogleMap';
|
||||
// import ImageLightbox from '../components/plugins/ImageLightbox';
|
||||
// import Leaflet from '../components/plugins/Leaflet';
|
||||
// import Lottie from '../components/plugins/Lottie';
|
||||
// import Plyr from '../components/plugins/Plyr';
|
||||
// import ProgressBarJs from '../components/plugins/ProgressBarJs';
|
||||
// import QuillEditorExample from '../components/plugins/Quill';
|
||||
// import ReactBeautifulDnD from '../components/plugins/ReactBeautifulDnD';
|
||||
// import ReactBootstrapTable2 from '../components/plugins/ReactBootstrapTable2';
|
||||
// import ReactHookFrom from '../components/plugins/ReactHookFrom';
|
||||
// import Scrollbar from '../components/plugins/Scrollbar';
|
||||
// import Select from '../components/plugins/Select';
|
||||
// import SlickCarousel from '../components/plugins/SlickCarousel';
|
||||
// import Toastify from '../components/plugins/Toastify';
|
||||
// import Typed from '../components/plugins/Typed';
|
||||
// import Pricing from '../components/pricing/Pricing';
|
||||
// import PricingAlt from '../components/pricing/PricingAlt';
|
||||
// import Profile from '../components/profile/Profile';
|
||||
// import Borders from '../components/utilities/Borders';
|
||||
// import Clearfix from '../components/utilities/Clearfix';
|
||||
// import CloseIcon from '../components/utilities/CloseIcon';
|
||||
// import Colors from '../components/utilities/Colors';
|
||||
// import Display from '../components/utilities/Display';
|
||||
// import Embed from '../components/utilities/Embed';
|
||||
// import Figures from '../components/utilities/Figures';
|
||||
// import Flex from '../components/utilities/Flex';
|
||||
// import Grid from '../components/utilities/Grid';
|
||||
// import Sizing from '../components/utilities/Sizing';
|
||||
// import Spacing from '../components/utilities/Spacing';
|
||||
// import StretchedLink from '../components/utilities/StretchedLink';
|
||||
// import Typography from '../components/utilities/Typography';
|
||||
// import VerticalAlign from '../components/utilities/VerticalAlign';
|
||||
// import Visibility from '../components/utilities/Visibility';
|
||||
// import Widgets from '../components/widgets/Widgets';
|
||||
import JKPeople from '../components/page/JKPeople';
|
||||
|
||||
const InboxRoutes = ({ match: { url } }) => (
|
||||
<InboxProvider>
|
||||
<Switch>
|
||||
<Route path={`${url}/email-detail`} exact component={EmailDetail} />
|
||||
<Route path={`${url}/inbox`} exact component={Inbox} />
|
||||
<Route path={`${url}/compose`} exact component={Compose} />
|
||||
// const InboxRoutes = ({ match: { url } }) => (
|
||||
// <InboxProvider>
|
||||
// <Switch>
|
||||
// <Route path={`${url}/email-detail`} exact component={EmailDetail} />
|
||||
// <Route path={`${url}/inbox`} exact component={Inbox} />
|
||||
// <Route path={`${url}/compose`} exact component={Compose} />
|
||||
|
||||
{/*Redirect*/}
|
||||
<Redirect to="/errors/404" />
|
||||
</Switch>
|
||||
</InboxProvider>
|
||||
);
|
||||
// {/*Redirect*/}
|
||||
// <Redirect to="/errors/404" />
|
||||
// </Switch>
|
||||
// </InboxProvider>
|
||||
// );
|
||||
|
||||
const ProductRoutes = ({ match: { url } }) => (
|
||||
<Switch>
|
||||
<Route path={`${url}/products/:productLayout`} exact component={Products} />
|
||||
<Route path={`${url}/checkout`} exact component={Checkout} />
|
||||
<Route path={`${url}/product-details/:id`} exact component={ProductDetails} />
|
||||
<Route path={`${url}/product-details/`} exact component={ProductDetails} />
|
||||
<Route path={`${url}/shopping-cart`} exact component={ShoppingCart} />
|
||||
<Route path={`${url}/orders`} exact component={Orders} />
|
||||
<Route path={`${url}/order-details`} exact component={OrderDetails} />
|
||||
<Route path={`${url}/customers`} exact component={Customers} />
|
||||
<Route path={`${url}/favourite-items`} exact component={FavouriteItems} />
|
||||
// const ProductRoutes = ({ match: { url } }) => (
|
||||
// <Switch>
|
||||
// <Route path={`${url}/products/:productLayout`} exact component={Products} />
|
||||
// <Route path={`${url}/checkout`} exact component={Checkout} />
|
||||
// <Route path={`${url}/product-details/:id`} exact component={ProductDetails} />
|
||||
// <Route path={`${url}/product-details/`} exact component={ProductDetails} />
|
||||
// <Route path={`${url}/shopping-cart`} exact component={ShoppingCart} />
|
||||
// <Route path={`${url}/orders`} exact component={Orders} />
|
||||
// <Route path={`${url}/order-details`} exact component={OrderDetails} />
|
||||
// <Route path={`${url}/customers`} exact component={Customers} />
|
||||
// <Route path={`${url}/favourite-items`} exact component={FavouriteItems} />
|
||||
|
||||
{/*Redirect*/}
|
||||
<Redirect to="/errors/404" />
|
||||
</Switch>
|
||||
);
|
||||
// {/*Redirect*/}
|
||||
// <Redirect to="/errors/404" />
|
||||
// </Switch>
|
||||
// );
|
||||
|
||||
const DashboardRoutes = () => (
|
||||
|
||||
<Switch>
|
||||
<Route path="/feed" exact component={Feed} />
|
||||
<Route path="/friends" component={JKPeople} />
|
||||
|
||||
{/* <Route path="/feed" exact component={Feed} /> */}
|
||||
{/*Pages*/}
|
||||
<Route path="/pages/activity" exact component={Activity} />
|
||||
{/* <Route path="/pages/activity" exact component={Activity} />
|
||||
<Route path="/pages/associations" exact component={Associations} />
|
||||
<Route path="/pages/billing" exact component={Billing} />
|
||||
<Route path="/pages/customer-details" exact component={CustomerDetails} />
|
||||
|
|
@ -158,30 +163,30 @@ const DashboardRoutes = () => (
|
|||
<Route path="/pages/pricing-alt" exact component={PricingAlt} />
|
||||
<Route path="/pages/profile" exact component={Profile} />
|
||||
<Route path="/pages/settings" exact component={Settings} />
|
||||
<Route path="/pages/starter" exact component={Starter} />
|
||||
<Route path="/pages/starter" exact component={Starter} /> */}
|
||||
{/*chat*/}
|
||||
<Route path="/chat" exact component={Chat} />
|
||||
{/* <Route path="/chat" exact component={Chat} /> */}
|
||||
{/*calendar*/}
|
||||
<Route path="/calendar" exact component={Calendar} />
|
||||
{/* <Route path="/calendar" exact component={Calendar} /> */}
|
||||
{/*kanban*/}
|
||||
<Route path="/kanban" exact component={Kanban} />
|
||||
{/* <Route path="/kanban" exact component={Kanban} /> */}
|
||||
{/*E commerce*/}
|
||||
<Route path="/e-commerce" component={ProductRoutes} />
|
||||
{/* <Route path="/e-commerce" component={ProductRoutes} /> */}
|
||||
|
||||
{/*Email*/}
|
||||
<Route path="/email" component={InboxRoutes} />
|
||||
{/* <Route path="/email" component={InboxRoutes} /> */}
|
||||
|
||||
{/*widgets*/}
|
||||
<Route path="/widgets" component={Widgets} />
|
||||
{/* <Route path="/widgets" component={Widgets} /> */}
|
||||
|
||||
{/*Documentation*/}
|
||||
<Route path="/documentation" exact component={GettingStarted} />
|
||||
{/* <Route path="/documentation" exact component={GettingStarted} /> */}
|
||||
|
||||
{/*Changelog*/}
|
||||
<Route path="/changelog" exact component={ChangeLog} />
|
||||
{/* <Route path="/changelog" exact component={ChangeLog} /> */}
|
||||
|
||||
{/*Components*/}
|
||||
<Route path="/components/alerts" exact component={Alerts} />
|
||||
{/* <Route path="/components/alerts" exact component={Alerts} />
|
||||
<Route path="/components/autocomplete" exact component={AutocompleteExample} />
|
||||
<Route path="/components/accordions" exact component={FalconAccordions} />
|
||||
<Route path="/components/avatar" exact component={Avatar} />
|
||||
|
|
@ -210,10 +215,10 @@ const DashboardRoutes = () => (
|
|||
<Route path="/components/tables" exact component={Tables} />
|
||||
<Route path="/components/tooltips" exact component={Tooltips} />
|
||||
<Route path="/components/spinners" exact component={Spinners} />
|
||||
<Route path="/components/carousel" exact component={Carousel} />
|
||||
<Route path="/components/carousel" exact component={Carousel} /> */}
|
||||
|
||||
{/*Utilities*/}
|
||||
<Route path="/utilities/borders" exact component={Borders} />
|
||||
{/* <Route path="/utilities/borders" exact component={Borders} />
|
||||
<Route path="/utilities/clearfix" exact component={Clearfix} />
|
||||
<Route path="/utilities/closeIcon" exact component={CloseIcon} />
|
||||
<Route path="/utilities/colors" exact component={Colors} />
|
||||
|
|
@ -227,10 +232,10 @@ const DashboardRoutes = () => (
|
|||
<Route path="/utilities/stretchedLink" exact component={StretchedLink} />
|
||||
<Route path="/utilities/typography" exact component={Typography} />
|
||||
<Route path="/utilities/verticalAlign" exact component={VerticalAlign} />
|
||||
<Route path="/utilities/visibility" exact component={Visibility} />
|
||||
<Route path="/utilities/visibility" exact component={Visibility} /> */}
|
||||
|
||||
{/*Plugins*/}
|
||||
<Route path="/plugins/calendar-example" exact component={CalendarExample} />
|
||||
{/* <Route path="/plugins/calendar-example" exact component={CalendarExample} />
|
||||
<Route path="/plugins/bulk-select" exact component={BulkSelect} />
|
||||
<Route path="/plugins/typed" exact component={Typed} />
|
||||
<Route path="/plugins/image-lightbox" exact component={ImageLightbox} />
|
||||
|
|
@ -255,11 +260,12 @@ const DashboardRoutes = () => (
|
|||
<Route path="/plugins/code-highlight" exact component={CodeHighlightDoc} />
|
||||
<Route path="/plugins/emoji-mart" exact component={EmojiMart} />
|
||||
<Route path="/plugins/react-bootstrap-table2" exact component={ReactBootstrapTable2} />
|
||||
<Route path="/plugins/react-beautiful-dnd" exact component={ReactBeautifulDnD} />
|
||||
<Route path="/plugins/react-beautiful-dnd" exact component={ReactBeautifulDnD} /> */}
|
||||
|
||||
{/*Redirect*/}
|
||||
<Redirect to="/errors/404" />
|
||||
</Switch>
|
||||
);
|
||||
|
||||
|
||||
export default DashboardRoutes;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import React, { useEffect } from 'react';
|
||||
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import { BrowserRouter as Router, Route, Switch, Redirect } from 'react-router-dom';
|
||||
import { toast, ToastContainer } from 'react-toastify';
|
||||
import { CloseButton, Fade } from '../components/common/Toast';
|
||||
|
||||
|
|
@ -7,35 +7,61 @@ import DashboardLayout from './DashboardLayout';
|
|||
import ErrorLayout from './ErrorLayout';
|
||||
|
||||
import loadable from '@loadable/component';
|
||||
|
||||
|
||||
const AuthBasicLayout = loadable(() => import('./AuthBasicLayout'));
|
||||
const Landing = loadable(() => import('../components/landing/Landing'));
|
||||
const WizardLayout = loadable(() => import('../components/auth/wizard/WizardLayout'));
|
||||
const AuthCardRoutes = loadable(() => import('../components/auth/card/AuthCardRoutes'));
|
||||
const AuthSplitRoutes = loadable(() => import('../components/auth/split/AuthSplitRoutes'));
|
||||
//const Landing = loadable(() => import('../components/landing/Landing'));
|
||||
//const WizardLayout = loadable(() => import('../components/auth/wizard/WizardLayout'));
|
||||
//const AuthCardRoutes = loadable(() => import('../components/auth/card/AuthCardRoutes'));
|
||||
//const AuthSplitRoutes = loadable(() => import('../components/auth/split/AuthSplitRoutes'));
|
||||
|
||||
const Layout = () => {
|
||||
|
||||
useEffect(() => {
|
||||
AuthBasicLayout.preload();
|
||||
Landing.preload();
|
||||
WizardLayout.preload();
|
||||
AuthCardRoutes.preload();
|
||||
AuthSplitRoutes.preload();
|
||||
//Landing.preload();
|
||||
//WizardLayout.preload();
|
||||
//AuthCardRoutes.preload();
|
||||
//AuthSplitRoutes.preload();
|
||||
}, []);
|
||||
|
||||
// async function fetchUserData(){
|
||||
// await apiFetch('/users/current_user_data')
|
||||
// .then(resp => {
|
||||
// if(!resp.ok){
|
||||
// //handle error
|
||||
// console.log("fetchUserData failed", resp);
|
||||
// }else{
|
||||
// return resp.json()
|
||||
// }
|
||||
// })
|
||||
// .then(json => {
|
||||
// setCurrentUser(json)
|
||||
// console.log("USER>>>>>>>", json);
|
||||
// })
|
||||
// .catch(error => console.log(error))
|
||||
// }
|
||||
|
||||
return (
|
||||
<Router fallback={<span />}>
|
||||
<Switch>
|
||||
<Route path="/landing" exact component={Landing} />
|
||||
<Route path="/authentication/card" component={AuthCardRoutes} />
|
||||
<Route path="/authentication/split" component={AuthSplitRoutes} />
|
||||
<Route path="/authentication/wizard" component={WizardLayout} />
|
||||
<Route path="/errors" component={ErrorLayout} />
|
||||
<Route path="/authentication/basic" component={AuthBasicLayout} />
|
||||
<Route component={DashboardLayout} />
|
||||
</Switch>
|
||||
<Switch>
|
||||
{/* <Route path="/friends" exact component={PeopleList} /> */}
|
||||
{/* <Route path="/landing" exact component={Landing} /> */}
|
||||
{/* <Route path="/authentication/card" component={AuthCardRoutes} />
|
||||
<Route path="/authentication/split" component={AuthSplitRoutes} />
|
||||
<Route path="/authentication/wizard" component={WizardLayout} /> */}
|
||||
<Route path="/errors" component={ErrorLayout} />
|
||||
<Route path="/authentication/basic" component={AuthBasicLayout} />
|
||||
|
||||
<Route component={DashboardLayout} />
|
||||
|
||||
</Switch>
|
||||
|
||||
<ToastContainer transition={Fade} closeButton={<CloseButton />} position={toast.POSITION.BOTTOM_LEFT} />
|
||||
</Router>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
|
||||
export default Layout;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,33 @@
|
|||
import { version } from './config';
|
||||
|
||||
export const homeRoute = {
|
||||
name: 'Home',
|
||||
to: '/',
|
||||
exact: true,
|
||||
icon: 'home',
|
||||
}
|
||||
|
||||
export const friendsRoute = {
|
||||
name: 'Friends',
|
||||
to: '/friends',
|
||||
exact: true,
|
||||
icon: 'users',
|
||||
}
|
||||
|
||||
export const helpRoute = {
|
||||
name: 'Help',
|
||||
to: '/help',
|
||||
exact: true,
|
||||
icon: 'search',
|
||||
}
|
||||
|
||||
export const legacyRoute = {
|
||||
name: 'Legacy',
|
||||
to: '/legacy',
|
||||
exact: true,
|
||||
icon: 'home',
|
||||
}
|
||||
|
||||
export const homeRoutes = {
|
||||
name: 'Home',
|
||||
to: '/',
|
||||
|
|
@ -68,6 +96,7 @@ export const authenticationRoutes = {
|
|||
]
|
||||
};
|
||||
|
||||
|
||||
export const ECommerceRoutes = {
|
||||
name: 'E commerce',
|
||||
to: '/e-commerce',
|
||||
|
|
@ -316,18 +345,22 @@ export const utilityRoutes = {
|
|||
};
|
||||
|
||||
export default [
|
||||
homeRoutes,
|
||||
pageRoutes,
|
||||
chatRoutes,
|
||||
kanbanRoutes,
|
||||
calenderRoutes,
|
||||
emailRoutes,
|
||||
authenticationRoutes,
|
||||
ECommerceRoutes,
|
||||
widgetsRoutes,
|
||||
componentRoutes,
|
||||
utilityRoutes,
|
||||
pluginRoutes,
|
||||
documentationRoutes,
|
||||
changelogRoutes
|
||||
homeRoute,
|
||||
friendsRoute,
|
||||
helpRoute,
|
||||
legacyRoute,
|
||||
//homeRoutes,
|
||||
//pageRoutes,
|
||||
//chatRoutes,
|
||||
//kanbanRoutes,
|
||||
//calenderRoutes,
|
||||
//emailRoutes,
|
||||
//authenticationRoutes,
|
||||
//ECommerceRoutes,
|
||||
//widgetsRoutes,
|
||||
//componentRoutes,
|
||||
//utilityRoutes,
|
||||
//pluginRoutes,
|
||||
//documentationRoutes,
|
||||
//changelogRoutes
|
||||
];
|
||||
|
|
|
|||
Loading…
Reference in New Issue