diff --git a/package-lock.json b/package-lock.json
index 2b535d5..76b3045 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -13,7 +13,10 @@
"@mui/icons-material": "^5.4.2",
"@mui/material": "^5.4.3",
"@reduxjs/toolkit": "^1.8.0",
+ "@types/react-big-calendar": "^0.36.2",
+ "moment": "^2.29.1",
"react": "^17.0.2",
+ "react-big-calendar": "^0.39.3",
"react-dom": "^17.0.2",
"react-redux": "^7.2.6",
"react-router-dom": "^6.2.1"
@@ -2228,6 +2231,15 @@
"react-redux": {
"optional": true
}
+ "node_modules/@restart/hooks": {
+ "version": "0.3.27",
+ "resolved": "https://registry.npmjs.org/@restart/hooks/-/hooks-0.3.27.tgz",
+ "integrity": "sha512-s984xV/EapUIfkjlf8wz9weP2O9TNKR96C68FfMEy2bE69+H4cNv3RD4Mf97lW7Htt7PjZrYTjSC8f3SB9VCXw==",
+ "dependencies": {
+ "dequal": "^2.0.2"
+ },
+ "peerDependencies": {
+ "react": ">=16.8.0"
}
},
"node_modules/@sindresorhus/is": {
@@ -2671,6 +2683,15 @@
"csstype": "^3.0.2"
}
},
+ "node_modules/@types/react-big-calendar": {
+ "version": "0.36.2",
+ "resolved": "https://registry.npmjs.org/@types/react-big-calendar/-/react-big-calendar-0.36.2.tgz",
+ "integrity": "sha512-grXQJgeHWXhgcipRB28NnUwIhD6aAKFs7IacGwy2+33hC8yAcR62nsW73aa25K3qxU8RxoLflKSCrsm4QCQpuQ==",
+ "dependencies": {
+ "@types/prop-types": "*",
+ "@types/react": "*"
+ }
+ },
"node_modules/@types/react-dom": {
"version": "17.0.11",
"resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-17.0.11.tgz",
@@ -2767,6 +2788,11 @@
"@types/node": "*"
}
},
+ "node_modules/@types/warning": {
+ "version": "3.0.0",
+ "resolved": "https://registry.npmjs.org/@types/warning/-/warning-3.0.0.tgz",
+ "integrity": "sha1-DSUBJorY+ZYrdA04fEZU9fjiPlI="
+ },
"node_modules/@types/webpack": {
"version": "5.28.0",
"resolved": "https://registry.npmjs.org/@types/webpack/-/webpack-5.28.0.tgz",
@@ -5199,6 +5225,11 @@
"url": "https://github.com/imagemin/cwebp-bin?sponsor=1"
}
},
+ "node_modules/date-arithmetic": {
+ "version": "4.1.0",
+ "resolved": "https://registry.npmjs.org/date-arithmetic/-/date-arithmetic-4.1.0.tgz",
+ "integrity": "sha512-QWxYLR5P/6GStZcdem+V1xoto6DMadYWpMXU82ES3/RfR3Wdwr3D0+be7mgOJ+Ov0G9D5Dmb9T17sNLQYj9XOg=="
+ },
"node_modules/debug": {
"version": "4.3.3",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.3.tgz",
@@ -5544,6 +5575,14 @@
"node": ">= 0.6"
}
},
+ "node_modules/dequal": {
+ "version": "2.0.2",
+ "resolved": "https://registry.npmjs.org/dequal/-/dequal-2.0.2.tgz",
+ "integrity": "sha512-q9K8BlJVxK7hQYqa6XISGmBZbtQQWVXSrRrWreHC94rMt1QL/Impruc+7p2CYSYuVIUr+YCt6hjrs1kkdJRTug==",
+ "engines": {
+ "node": ">=6"
+ }
+ },
"node_modules/destroy": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/destroy/-/destroy-1.0.4.tgz",
@@ -8346,6 +8385,14 @@
"node": ">=4"
}
},
+ "node_modules/invariant": {
+ "version": "2.2.4",
+ "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz",
+ "integrity": "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==",
+ "dependencies": {
+ "loose-envify": "^1.0.0"
+ }
+ },
"node_modules/ip": {
"version": "1.1.5",
"resolved": "https://registry.npmjs.org/ip/-/ip-1.1.5.tgz",
@@ -9023,8 +9070,12 @@
"node_modules/lodash": {
"version": "4.17.21",
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
- "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
- "dev": true
+ "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
+ },
+ "node_modules/lodash-es": {
+ "version": "4.17.21",
+ "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz",
+ "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw=="
},
"node_modules/lodash.debounce": {
"version": "4.0.8",
@@ -9134,6 +9185,11 @@
"node": ">= 4.0.0"
}
},
+ "node_modules/memoize-one": {
+ "version": "5.2.1",
+ "resolved": "https://registry.npmjs.org/memoize-one/-/memoize-one-5.2.1.tgz",
+ "integrity": "sha512-zYiwtZUcYyXKo/np96AGZAckk+FWWsUdJ3cHGGmld7+AhvcWmQyGCYUh1hc4Q/pkOhb65dQR/pqCyK0cOaHz4Q=="
+ },
"node_modules/memory-fs": {
"version": "0.5.0",
"resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.5.0.tgz",
@@ -9277,6 +9333,14 @@
"mkdirp": "bin/cmd.js"
}
},
+ "node_modules/moment": {
+ "version": "2.29.1",
+ "resolved": "https://registry.npmjs.org/moment/-/moment-2.29.1.tgz",
+ "integrity": "sha512-kHmoybcPV8Sqy59DwNDY3Jefr64lK/by/da0ViFcuA4DH0vQg5Q6Ze5VimxkfQNSC+Mls/Kx53s7TjP1RhFEDQ==",
+ "engines": {
+ "node": "*"
+ }
+ },
"node_modules/mozjpeg": {
"version": "7.1.1",
"resolved": "https://registry.npmjs.org/mozjpeg/-/mozjpeg-7.1.1.tgz",
@@ -10513,6 +10577,28 @@
"node": ">=0.10.0"
}
},
+ "node_modules/react-big-calendar": {
+ "version": "0.39.3",
+ "resolved": "https://registry.npmjs.org/react-big-calendar/-/react-big-calendar-0.39.3.tgz",
+ "integrity": "sha512-RLymspfoBeYNBMvKnpMSpHtUAsJhv1Cbp1sE6aE7huQ92xT0mgnFDxUSoWc//C5J8WbYWLtlld521eisNJSjNw==",
+ "dependencies": {
+ "@babel/runtime": "^7.1.5",
+ "clsx": "^1.0.4",
+ "date-arithmetic": "^4.1.0",
+ "dom-helpers": "^5.1.0",
+ "invariant": "^2.2.4",
+ "lodash": "^4.17.11",
+ "lodash-es": "^4.17.11",
+ "memoize-one": "^5.1.1",
+ "prop-types": "^15.7.2",
+ "react-overlays": "^4.1.1",
+ "uncontrollable": "^7.0.0"
+ },
+ "peerDependencies": {
+ "react": "^16.6.1 || ^17",
+ "react-dom": "^16.6.1 || ^17"
+ }
+ },
"node_modules/react-dom": {
"version": "17.0.2",
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-17.0.2.tgz",
@@ -10560,6 +10646,30 @@
"resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
"integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w=="
},
+ "node_modules/react-lifecycles-compat": {
+ "version": "3.0.4",
+ "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
+ "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
+ },
+ "node_modules/react-overlays": {
+ "version": "4.1.1",
+ "resolved": "https://registry.npmjs.org/react-overlays/-/react-overlays-4.1.1.tgz",
+ "integrity": "sha512-WtJifh081e6M24KnvTQoNjQEpz7HoLxqt8TwZM7LOYIkYJ8i/Ly1Xi7RVte87ZVnmqQ4PFaFiNHZhSINPSpdBQ==",
+ "dependencies": {
+ "@babel/runtime": "^7.12.1",
+ "@popperjs/core": "^2.5.3",
+ "@restart/hooks": "^0.3.25",
+ "@types/warning": "^3.0.0",
+ "dom-helpers": "^5.2.0",
+ "prop-types": "^15.7.2",
+ "uncontrollable": "^7.0.0",
+ "warning": "^4.0.3"
+ },
+ "peerDependencies": {
+ "react": ">=16.3.0",
+ "react-dom": ">=16.3.0"
+ }
+ },
"node_modules/react-router": {
"version": "6.2.1",
"resolved": "https://registry.npmjs.org/react-router/-/react-router-6.2.1.tgz",
@@ -12325,6 +12435,20 @@
"through": "^2.3.8"
}
},
+ "node_modules/uncontrollable": {
+ "version": "7.2.1",
+ "resolved": "https://registry.npmjs.org/uncontrollable/-/uncontrollable-7.2.1.tgz",
+ "integrity": "sha512-svtcfoTADIB0nT9nltgjujTi7BzVmwjZClOmskKu/E8FW9BXzg9os8OLr4f8Dlnk0rYWJIWr4wv9eKUXiQvQwQ==",
+ "dependencies": {
+ "@babel/runtime": "^7.6.3",
+ "@types/react": ">=16.9.11",
+ "invariant": "^2.2.4",
+ "react-lifecycles-compat": "^3.0.4"
+ },
+ "peerDependencies": {
+ "react": ">=15.0.0"
+ }
+ },
"node_modules/unicode-canonical-property-names-ecmascript": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.0.tgz",
@@ -12472,6 +12596,14 @@
"node": ">= 0.8"
}
},
+ "node_modules/warning": {
+ "version": "4.0.3",
+ "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz",
+ "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==",
+ "dependencies": {
+ "loose-envify": "^1.0.0"
+ }
+ },
"node_modules/watchpack": {
"version": "2.3.1",
"resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.3.1.tgz",
@@ -14367,6 +14499,12 @@
"redux": "^4.1.2",
"redux-thunk": "^2.4.1",
"reselect": "^4.1.5"
+ "@restart/hooks": {
+ "version": "0.3.27",
+ "resolved": "https://registry.npmjs.org/@restart/hooks/-/hooks-0.3.27.tgz",
+ "integrity": "sha512-s984xV/EapUIfkjlf8wz9weP2O9TNKR96C68FfMEy2bE69+H4cNv3RD4Mf97lW7Htt7PjZrYTjSC8f3SB9VCXw==",
+ "requires": {
+ "dequal": "^2.0.2"
}
},
"@sindresorhus/is": {
@@ -14706,6 +14844,15 @@
"csstype": "^3.0.2"
}
},
+ "@types/react-big-calendar": {
+ "version": "0.36.2",
+ "resolved": "https://registry.npmjs.org/@types/react-big-calendar/-/react-big-calendar-0.36.2.tgz",
+ "integrity": "sha512-grXQJgeHWXhgcipRB28NnUwIhD6aAKFs7IacGwy2+33hC8yAcR62nsW73aa25K3qxU8RxoLflKSCrsm4QCQpuQ==",
+ "requires": {
+ "@types/prop-types": "*",
+ "@types/react": "*"
+ }
+ },
"@types/react-dom": {
"version": "17.0.11",
"resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-17.0.11.tgz",
@@ -14802,6 +14949,11 @@
"@types/node": "*"
}
},
+ "@types/warning": {
+ "version": "3.0.0",
+ "resolved": "https://registry.npmjs.org/@types/warning/-/warning-3.0.0.tgz",
+ "integrity": "sha1-DSUBJorY+ZYrdA04fEZU9fjiPlI="
+ },
"@types/webpack": {
"version": "5.28.0",
"resolved": "https://registry.npmjs.org/@types/webpack/-/webpack-5.28.0.tgz",
@@ -16671,6 +16823,11 @@
"bin-wrapper": "^4.0.1"
}
},
+ "date-arithmetic": {
+ "version": "4.1.0",
+ "resolved": "https://registry.npmjs.org/date-arithmetic/-/date-arithmetic-4.1.0.tgz",
+ "integrity": "sha512-QWxYLR5P/6GStZcdem+V1xoto6DMadYWpMXU82ES3/RfR3Wdwr3D0+be7mgOJ+Ov0G9D5Dmb9T17sNLQYj9XOg=="
+ },
"debug": {
"version": "4.3.3",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.3.tgz",
@@ -16939,6 +17096,11 @@
"integrity": "sha1-m81S4UwJd2PnSbJ0xDRu0uVgtak=",
"dev": true
},
+ "dequal": {
+ "version": "2.0.2",
+ "resolved": "https://registry.npmjs.org/dequal/-/dequal-2.0.2.tgz",
+ "integrity": "sha512-q9K8BlJVxK7hQYqa6XISGmBZbtQQWVXSrRrWreHC94rMt1QL/Impruc+7p2CYSYuVIUr+YCt6hjrs1kkdJRTug=="
+ },
"destroy": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/destroy/-/destroy-1.0.4.tgz",
@@ -19063,6 +19225,14 @@
"p-is-promise": "^1.1.0"
}
},
+ "invariant": {
+ "version": "2.2.4",
+ "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz",
+ "integrity": "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==",
+ "requires": {
+ "loose-envify": "^1.0.0"
+ }
+ },
"ip": {
"version": "1.1.5",
"resolved": "https://registry.npmjs.org/ip/-/ip-1.1.5.tgz",
@@ -19548,8 +19718,12 @@
"lodash": {
"version": "4.17.21",
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
- "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
- "dev": true
+ "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
+ },
+ "lodash-es": {
+ "version": "4.17.21",
+ "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz",
+ "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw=="
},
"lodash.debounce": {
"version": "4.0.8",
@@ -19638,6 +19812,11 @@
"fs-monkey": "1.0.3"
}
},
+ "memoize-one": {
+ "version": "5.2.1",
+ "resolved": "https://registry.npmjs.org/memoize-one/-/memoize-one-5.2.1.tgz",
+ "integrity": "sha512-zYiwtZUcYyXKo/np96AGZAckk+FWWsUdJ3cHGGmld7+AhvcWmQyGCYUh1hc4Q/pkOhb65dQR/pqCyK0cOaHz4Q=="
+ },
"memory-fs": {
"version": "0.5.0",
"resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.5.0.tgz",
@@ -19745,6 +19924,11 @@
"minimist": "^1.2.5"
}
},
+ "moment": {
+ "version": "2.29.1",
+ "resolved": "https://registry.npmjs.org/moment/-/moment-2.29.1.tgz",
+ "integrity": "sha512-kHmoybcPV8Sqy59DwNDY3Jefr64lK/by/da0ViFcuA4DH0vQg5Q6Ze5VimxkfQNSC+Mls/Kx53s7TjP1RhFEDQ=="
+ },
"mozjpeg": {
"version": "7.1.1",
"resolved": "https://registry.npmjs.org/mozjpeg/-/mozjpeg-7.1.1.tgz",
@@ -20653,6 +20837,24 @@
"object-assign": "^4.1.1"
}
},
+ "react-big-calendar": {
+ "version": "0.39.3",
+ "resolved": "https://registry.npmjs.org/react-big-calendar/-/react-big-calendar-0.39.3.tgz",
+ "integrity": "sha512-RLymspfoBeYNBMvKnpMSpHtUAsJhv1Cbp1sE6aE7huQ92xT0mgnFDxUSoWc//C5J8WbYWLtlld521eisNJSjNw==",
+ "requires": {
+ "@babel/runtime": "^7.1.5",
+ "clsx": "^1.0.4",
+ "date-arithmetic": "^4.1.0",
+ "dom-helpers": "^5.1.0",
+ "invariant": "^2.2.4",
+ "lodash": "^4.17.11",
+ "lodash-es": "^4.17.11",
+ "memoize-one": "^5.1.1",
+ "prop-types": "^15.7.2",
+ "react-overlays": "^4.1.1",
+ "uncontrollable": "^7.0.0"
+ }
+ },
"react-dom": {
"version": "17.0.2",
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-17.0.2.tgz",
@@ -20686,6 +20888,24 @@
"resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
"integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w=="
}
+ "react-lifecycles-compat": {
+ "version": "3.0.4",
+ "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
+ "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
+ },
+ "react-overlays": {
+ "version": "4.1.1",
+ "resolved": "https://registry.npmjs.org/react-overlays/-/react-overlays-4.1.1.tgz",
+ "integrity": "sha512-WtJifh081e6M24KnvTQoNjQEpz7HoLxqt8TwZM7LOYIkYJ8i/Ly1Xi7RVte87ZVnmqQ4PFaFiNHZhSINPSpdBQ==",
+ "requires": {
+ "@babel/runtime": "^7.12.1",
+ "@popperjs/core": "^2.5.3",
+ "@restart/hooks": "^0.3.25",
+ "@types/warning": "^3.0.0",
+ "dom-helpers": "^5.2.0",
+ "prop-types": "^15.7.2",
+ "uncontrollable": "^7.0.0",
+ "warning": "^4.0.3"
}
},
"react-router": {
@@ -22058,6 +22278,17 @@
"through": "^2.3.8"
}
},
+ "uncontrollable": {
+ "version": "7.2.1",
+ "resolved": "https://registry.npmjs.org/uncontrollable/-/uncontrollable-7.2.1.tgz",
+ "integrity": "sha512-svtcfoTADIB0nT9nltgjujTi7BzVmwjZClOmskKu/E8FW9BXzg9os8OLr4f8Dlnk0rYWJIWr4wv9eKUXiQvQwQ==",
+ "requires": {
+ "@babel/runtime": "^7.6.3",
+ "@types/react": ">=16.9.11",
+ "invariant": "^2.2.4",
+ "react-lifecycles-compat": "^3.0.4"
+ }
+ },
"unicode-canonical-property-names-ecmascript": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.0.tgz",
@@ -22172,6 +22403,14 @@
"integrity": "sha1-IpnwLG3tMNSllhsLn3RSShj2NPw=",
"dev": true
},
+ "warning": {
+ "version": "4.0.3",
+ "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz",
+ "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==",
+ "requires": {
+ "loose-envify": "^1.0.0"
+ }
+ },
"watchpack": {
"version": "2.3.1",
"resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.3.1.tgz",
diff --git a/package.json b/package.json
index 21ebbf0..75a49c7 100644
--- a/package.json
+++ b/package.json
@@ -13,7 +13,10 @@
"@mui/icons-material": "^5.4.2",
"@mui/material": "^5.4.3",
"@reduxjs/toolkit": "^1.8.0",
+ "@types/react-big-calendar": "^0.36.2",
+ "moment": "^2.29.1",
"react": "^17.0.2",
+ "react-big-calendar": "^0.39.3",
"react-dom": "^17.0.2",
"react-redux": "^7.2.6",
"react-router-dom": "^6.2.1"
diff --git a/src/App.tsx b/src/App.tsx
index 1595743..c29dc31 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -5,7 +5,7 @@ import "./styles.css";
import Login from "./components/login/Login";
import Home from "./components/home/Home";
import Contacts from "./components/contacts/Contacts";
-import Calendar from "./components/calendar/Calendar";
+import CalendarPage from "./components/calendar/CalendarPage";
import { ThemeProvider } from "@emotion/react";
import ProtectedRoute from "./ProtectedRoute";
import MeetingDetails from "./components/meeting-details/MeetingDetails";
diff --git a/src/ProtectedRoute.tsx b/src/ProtectedRoute.tsx
index ad67baa..72167dd 100644
--- a/src/ProtectedRoute.tsx
+++ b/src/ProtectedRoute.tsx
@@ -1,4 +1,4 @@
-import { useLocation, Outlet, Navigate } from "react-router-dom";
+import {useLocation, Outlet, Navigate} from "react-router-dom";
import useAuth from "./hooks/useAuth";
import Navbar from "./components/navbar/Navbar";
import Sidebar from "./components/sidebar/Sidebar";
@@ -10,7 +10,7 @@ import {
import { Box } from "@mui/material";
const ProtectedRoute = () => {
- const { auth }: any = useAuth();
+ const auth= useAuth();
const location = useLocation();
/* Temporary data */
diff --git a/src/components/calendar/Calendar.tsx b/src/components/calendar/Calendar.tsx
deleted file mode 100644
index 300488f..0000000
--- a/src/components/calendar/Calendar.tsx
+++ /dev/null
@@ -1,5 +0,0 @@
-const Calendar: React.FC = () => {
- return Calendar;
-};
-
-export default Calendar;
diff --git a/src/components/calendar/CalendarPage.tsx b/src/components/calendar/CalendarPage.tsx
new file mode 100644
index 0000000..340e0fe
--- /dev/null
+++ b/src/components/calendar/CalendarPage.tsx
@@ -0,0 +1,14 @@
+import { Toolbar } from "@mui/material";
+import UserCalendar from "./UserCalendar";
+
+const CalendarPage: React.FC = () => {
+
+ return (
+ <>
+
+
+ >
+ );
+};
+
+export default CalendarPage;
diff --git a/src/components/calendar/Events.tsx b/src/components/calendar/Events.tsx
new file mode 100644
index 0000000..6b62d47
--- /dev/null
+++ b/src/components/calendar/Events.tsx
@@ -0,0 +1,185 @@
+/*
+Test data from
+https://github.com/jquense/react-big-calendar/blob/master/examples/events.js
+*/
+
+const now = new Date();
+
+export default [
+ {
+ id: 0,
+ title: "All Day Event very long title",
+ allDay: true,
+ start: new Date(2022, 2, 0),
+ end: new Date(2022, 2, 1),
+ },
+ {
+ id: 1,
+ title: "Long Event",
+ start: new Date(2022, 2, 7),
+ end: new Date(2022, 2, 10),
+ },
+
+ {
+ id: 2,
+ title: "DTS STARTS",
+ start: new Date(2022, 1, 13, 0, 0, 0),
+ end: new Date(2022, 1, 20, 0, 0, 0),
+ },
+
+ {
+ id: 3,
+ title: "DTS ENDS",
+ start: new Date(2022, 9, 6, 0, 0, 0),
+ end: new Date(2022, 9, 13, 0, 0, 0),
+ },
+
+ {
+ id: 4,
+ title: "Some Event",
+ start: new Date(2022, 2, 9, 0, 0, 0),
+ end: new Date(2022, 2, 10, 0, 0, 0),
+ },
+ {
+ id: 5,
+ title: "Conference",
+ start: new Date(2022, 2, 11),
+ end: new Date(2022, 2, 13),
+ desc: "Big conference for important people",
+ },
+ {
+ id: 6,
+ title: "Meeting",
+ start: new Date(2022, 2, 12, 10, 30, 0, 0),
+ end: new Date(2022, 2, 12, 12, 30, 0, 0),
+ desc: "Pre-meeting meeting, to prepare for the meeting",
+ },
+ {
+ id: 7,
+ title: "Lunch",
+ start: new Date(2022, 2, 12, 12, 0, 0, 0),
+ end: new Date(2022, 2, 12, 13, 0, 0, 0),
+ desc: "Power lunch",
+ },
+ {
+ id: 8,
+ title: "Meeting",
+ start: new Date(2022, 2, 12, 14, 0, 0, 0),
+ end: new Date(2022, 2, 12, 15, 0, 0, 0),
+ },
+ {
+ id: 9,
+ title: "Happy Hour",
+ start: new Date(2022, 2, 12, 17, 0, 0, 0),
+ end: new Date(2022, 2, 12, 17, 30, 0, 0),
+ desc: "Most important meal of the day",
+ },
+ {
+ id: 10,
+ title: "Dinner",
+ start: new Date(2022, 2, 12, 20, 0, 0, 0),
+ end: new Date(2022, 2, 12, 21, 0, 0, 0),
+ },
+ {
+ id: 11,
+ title: "Planning Meeting with Paige",
+ start: new Date(2022, 2, 13, 8, 0, 0),
+ end: new Date(2022, 2, 13, 10, 30, 0),
+ },
+ {
+ id: 11.1,
+ title: "Inconvenient multi-day Conference Call",
+ start: new Date(2022, 2, 13, 9, 30, 0),
+ end: new Date(2022, 2, 14, 1, 0, 0),
+ },
+ {
+ id: 11.2,
+ title: "Project Kickoff - Lou's Shoes",
+ start: new Date(2022, 2, 13, 11, 30, 0),
+ end: new Date(2022, 2, 13, 14, 0, 0),
+ },
+ {
+ id: 11.3,
+ title: "Quote Follow-up - Tea by Tina",
+ start: new Date(2022, 2, 13, 15, 30, 0),
+ end: new Date(2022, 2, 13, 16, 0, 0),
+ },
+ {
+ id: 12,
+ title: "Late Night Event",
+ start: new Date(2022, 2, 17, 19, 30, 0),
+ end: new Date(2022, 2, 18, 2, 0, 0),
+ },
+ {
+ id: 12.5,
+ title: "Late Same Night Event",
+ start: new Date(2022, 2, 17, 19, 30, 0),
+ end: new Date(2022, 2, 17, 23, 30, 0),
+ },
+ {
+ id: 13,
+ title: "Multi-day Event",
+ start: new Date(2022, 2, 20, 19, 30, 0),
+ end: new Date(2022, 2, 22, 2, 0, 0),
+ },
+ {
+ id: 14,
+ title: "Today",
+ start: new Date(new Date().setHours(new Date().getHours() - 3)),
+ end: new Date(new Date().setHours(new Date().getHours() + 3)),
+ },
+ {
+ id: 15,
+ title: "Point in Time Event",
+ start: now,
+ end: now,
+ },
+ {
+ id: 16,
+ title: "Video Record",
+ start: new Date(2022, 2, 14, 15, 30, 0),
+ end: new Date(2022, 2, 14, 19, 0, 0),
+ },
+ {
+ id: 17,
+ title: "Dutch Song Producing",
+ start: new Date(2022, 2, 14, 16, 30, 0),
+ end: new Date(2022, 2, 14, 20, 0, 0),
+ },
+ {
+ id: 18,
+ title: "Itaewon Halloween Meeting",
+ start: new Date(2022, 2, 14, 16, 30, 0),
+ end: new Date(2022, 2, 14, 17, 30, 0),
+ },
+ {
+ id: 19,
+ title: "Online Coding Test",
+ start: new Date(2022, 2, 14, 17, 30, 0),
+ end: new Date(2022, 2, 14, 20, 30, 0),
+ },
+ {
+ id: 20,
+ title: "An overlapped Event",
+ start: new Date(2022, 2, 14, 17, 0, 0),
+ end: new Date(2022, 2, 14, 18, 30, 0),
+ },
+ {
+ id: 21,
+ title: "Phone Interview",
+ start: new Date(2022, 2, 14, 17, 0, 0),
+ end: new Date(2022, 2, 14, 18, 30, 0),
+ },
+ {
+ id: 22,
+ title: "Cooking Class",
+ start: new Date(2022, 2, 14, 17, 30, 0),
+ end: new Date(2022, 2, 14, 19, 0, 0),
+ },
+ {
+ id: 23,
+ title: "Go to the gym",
+ start: new Date(2022, 2, 14, 18, 30, 0),
+ end: new Date(2022, 2, 14, 20, 0, 0),
+ },
+];
\ No newline at end of file
diff --git a/src/components/calendar/UserCalendar.tsx b/src/components/calendar/UserCalendar.tsx
new file mode 100644
index 0000000..d6a7797
--- /dev/null
+++ b/src/components/calendar/UserCalendar.tsx
@@ -0,0 +1,23 @@
+import { Calendar, momentLocalizer } from "react-big-calendar";
+import moment from "moment";
+import testEvents from "./Events";
+
+import "react-big-calendar/lib/css/react-big-calendar.css";
+
+const localizer = momentLocalizer(moment);
+
+const UserCalendar: React.FC = () => {
+
+ return (
+
+ );
+};
+
+export default UserCalendar;
\ No newline at end of file
diff --git a/src/components/home/CallFavouritesDialog.tsx b/src/components/home/CallFavouritesDialog.tsx
new file mode 100644
index 0000000..61c97ee
--- /dev/null
+++ b/src/components/home/CallFavouritesDialog.tsx
@@ -0,0 +1,44 @@
+import { Button, Checkbox, Dialog, DialogActions, DialogContent, DialogTitle, FormControlLabel, FormGroup, Typography } from "@mui/material";
+import { SidebarUserObj } from "../sidebar/SidebarUser";
+
+interface Props {
+ open: boolean;
+ selectedValue: SidebarUserObj;
+ onClose: (value: SidebarUserObj) => void;
+ users: SidebarUserObj[];
+}
+
+const CallFavouritesDialog: React.FC = ({ open, selectedValue, onClose, users }: Props) => {
+ const handleClose = () => {
+ onClose(selectedValue);
+ };
+
+ return (
+
+ );
+};
+
+export default CallFavouritesDialog;
\ No newline at end of file
diff --git a/src/components/home/Home.tsx b/src/components/home/Home.tsx
index c50a231..43829b6 100644
--- a/src/components/home/Home.tsx
+++ b/src/components/home/Home.tsx
@@ -2,8 +2,22 @@ import MeetingsPanel from "./MeetingsPanel";
import ShortCuts from "./ShortCuts";
import Container from "@mui/material/Container";
import Grid from "@mui/material/Grid";
+import { MeetingStatus, SidebarUserObj } from "../sidebar/SidebarUser";
+import { useState } from "react";
const Home: React.FC = () => {
+
+ /* Temporary data - this is the same as what's in ProtectedRoute.tsx so it should not
+ be duplicated like this in the future (Route components were being weird when I tried
+ to pass it down from App.tsx) */
+ const [mockUsers] = useState([
+ { id: 0, name: "Jincheng L.", meetingStatus: MeetingStatus.ONLINE },
+ { id: 1, name: "Matt B.", meetingStatus: MeetingStatus.IN_MEETING },
+ { id: 2, name: "Taehee C.", meetingStatus: MeetingStatus.OFFLINE },
+ { id: 3, name: "Bob A.", meetingStatus: MeetingStatus.AWAY }
+ ]);
+
+
return (
@@ -11,7 +25,7 @@ const Home: React.FC = () => {
-
+
diff --git a/src/components/home/ShortCuts.tsx b/src/components/home/ShortCuts.tsx
index 61afba9..eae6245 100644
--- a/src/components/home/ShortCuts.tsx
+++ b/src/components/home/ShortCuts.tsx
@@ -4,8 +4,27 @@ import PhoneEnabledIcon from "@mui/icons-material/PhoneEnabled";
import CircleIcon from "@mui/icons-material/Circle";
import Button from "@mui/material/Button";
import Grid from "@mui/material/Grid";
+import { SidebarUserObj } from "../sidebar/SidebarUser";
+import CallFavouritesDialog from "./CallFavouritesDialog";
+import { useState } from "react";
+
+interface Props {
+ users: SidebarUserObj[];
+}
+
+const ShortCuts: React.FC = ({ users }: Props) => {
+ const [open, setOpen] = useState(false);
+ const [selectedValue, setSelectedValue] = useState(users[0]);
+
+ const handleClickOpen = () => {
+ setOpen(true);
+ };
+
+ const handleClose = (value: SidebarUserObj) => {
+ setOpen(false);
+ setSelectedValue(value);
+ };
-const ShortCuts: React.FC = () => {
return (
@@ -24,10 +43,16 @@ const ShortCuts: React.FC = () => {
-
diff --git a/src/components/login/Login.tsx b/src/components/login/Login.tsx
index e1b25b1..230e4bb 100644
--- a/src/components/login/Login.tsx
+++ b/src/components/login/Login.tsx
@@ -9,12 +9,14 @@ import zoomLogo from "../../assets/zoom.png";
import LoginIcon from "@mui/icons-material/Login";
import useAuth from "../../hooks/useAuth";
+interface LocationState {
+ from: { pathname: string };
+}
const Login: React.FC = () => {
- const { setAuth }: any = useAuth();
-
const navigate = useNavigate();
- const location: any = useLocation();
- const from = location.state?.from?.pathname || "/";
+ const location = useLocation();
+ const state = location.state as LocationState;
+ const from = state?.from?.pathname || "/";
const [username, setUsername] = useState("");
const [password, setPassword] = useState("");
@@ -33,8 +35,10 @@ const Login: React.FC = () => {
const handleLogin = () => {
if (username === "" && password === "") {
- setAuth({ username: username, isLoggedIn: true });
- navigate(from, { replace: true });
+ // setAuth({username: username, isLoggedIn: true});
+ setAuth["username"] = username;
+ setAuth["isLoggedIn"] = true;
+ navigate(from, {replace: true});
}
setUsername("");
setPassword("");
@@ -45,27 +49,8 @@ const Login: React.FC = () => {
{/* {errMsg}
*/}
- {
- setUsername(event.target.value);
- }}
- />
- {
- setPassword(event.target.value);
- }}
- />
+ {setUsername(event.target.value);}}/>
+ {setPassword(event.target.value);}}/>
Forgot your password?
diff --git a/src/context/AuthProvider.tsx b/src/context/AuthProvider.tsx
index 8411ab4..bf70402 100644
--- a/src/context/AuthProvider.tsx
+++ b/src/context/AuthProvider.tsx
@@ -1,12 +1,17 @@
import { createContext, useState } from "react";
-const AuthContext = createContext({});
+interface loginInfo {
+ username: string;
+ isLoggedIn: boolean;
+}
-export const AuthProvider = ({ children }: {children: any}) => {
- const [auth, setAuth] = useState({});
+const AuthContext = createContext({username: "", isLoggedIn: false});
+
+export const AuthProvider = ({ children }: {children: React.ReactNode}) => {
+ const [auth] = useState({username: "", isLoggedIn: false});
return (
-
+
{children}
);
diff --git a/src/hooks/useAuth.tsx b/src/hooks/useAuth.tsx
index e1d0b6d..ebe7cc6 100644
--- a/src/hooks/useAuth.tsx
+++ b/src/hooks/useAuth.tsx
@@ -1,8 +1,13 @@
import { useContext } from "react";
import AuthContext from "../context/AuthProvider";
+interface loginInfo {
+ username: string;
+ isLoggedIn: boolean;
+}
+
const useAuth = () => {
- return useContext(AuthContext);
+ return useContext(AuthContext);
};
export default useAuth;
\ No newline at end of file