From 68368d1c7123357859b277b06c593dfcf4714ad1 Mon Sep 17 00:00:00 2001 From: jveebs <83558932+jveebs@users.noreply.github.com> Date: Sun, 16 Apr 2023 00:48:59 -0400 Subject: [PATCH] Design Changes & Expenses by Category --- package-lock.json | 382 +++++++++++++--------------- package.json | 20 +- public/manifest.json | 10 - src/Main.js | 2 +- src/components/AddExpenseForm.js | 182 +++++++++---- src/components/CategorizedBudget.js | 84 ++++++ src/components/ExpenseList.js | 5 +- src/components/ExpenseTotal.js | 2 +- src/components/NavBar.css | 3 +- src/components/NavBar.js | 5 +- src/components/Remaining.js | 2 +- src/components/SideNav.js | 2 +- src/components/budget.js | 2 +- src/pages/Dashboard.jsx | 22 +- src/pages/Login.jsx | 1 - src/styles.css | 36 +-- src/utils/utils.js | 7 +- 17 files changed, 454 insertions(+), 313 deletions(-) create mode 100644 src/components/CategorizedBudget.js diff --git a/package-lock.json b/package-lock.json index cc86a7d..e205f7f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -12,21 +12,23 @@ "@emotion/styled": "^11.10.6", "@material-ui/core": "^4.12.4", "@material-ui/icons": "^4.11.3", - "@mui/icons-material": "^5.11.11", - "@mui/material": "^5.11.15", - "@mui/styled-engine-sc": "^5.11.11", + "@mui/icons-material": "^5.11.16", + "@mui/material": "^5.12.0", + "@mui/styled-engine-sc": "^5.12.0", "@testing-library/jest-dom": "^5.16.5", - "@testing-library/react": "^13.4.0", - "@testing-library/user-event": "^13.5.0", + "@testing-library/react": "^14.0.0", + "@testing-library/user-event": "^14.4.3", "bootstrap": "^5.2.3", - "react": "^18.2.0", - "react-bootstrap": "^2.7.2", + "chart.js": "^4.2.1", + "react": "^18.0.0", + "react-bootstrap": "^2.7.4", "react-bootstrap-validation": "^0.1.11", - "react-dom": "^18.2.0", + "react-chartjs-2": "^5.2.0", + "react-dom": "^18.0.0", "react-pro-sidebar": "^1.0.0", "react-scripts": "5.0.1", "styled-components": "^5.3.9", - "web-vitals": "^2.1.4" + "web-vitals": "^3.3.1" } }, "node_modules/@adobe/css-tools": { @@ -2254,9 +2256,9 @@ } }, "node_modules/@emotion/cache": { - "version": "11.10.5", - "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.10.5.tgz", - "integrity": "sha512-dGYHWyzTdmK+f2+EnIGBpkz1lKc4Zbj2KHd4cX3Wi8/OWr5pKslNjc3yABKH4adRGCvSX4VDC0i04mrrq0aiRA==", + "version": "11.10.7", + "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.10.7.tgz", + "integrity": "sha512-VLl1/2D6LOjH57Y8Vem1RoZ9haWF4jesHDGiHtKozDQuBIkJm2gimVo0I02sWCuzZtVACeixTVB4jeE8qvCBoQ==", "dependencies": { "@emotion/memoize": "^0.8.0", "@emotion/sheet": "^1.2.1", @@ -3483,6 +3485,11 @@ "@jridgewell/sourcemap-codec": "1.4.14" } }, + "node_modules/@kurkle/color": { + "version": "0.3.2", + "resolved": "https://registry.npmjs.org/@kurkle/color/-/color-0.3.2.tgz", + "integrity": "sha512-fuscdXJ9G1qb7W8VdHi+IwRqij3lBkosAm4ydQtEmbY58OzHXqQhvlxqEkoz0yssNVn38bcpRWgA9PP+OGoisw==" + }, "node_modules/@leichtgewicht/ip-codec": { "version": "2.0.4", "resolved": "https://registry.npmjs.org/@leichtgewicht/ip-codec/-/ip-codec-2.0.4.tgz", @@ -3525,29 +3532,7 @@ } } }, - "node_modules/@material-ui/icons": { - "version": "4.11.3", - "resolved": "https://registry.npmjs.org/@material-ui/icons/-/icons-4.11.3.tgz", - "integrity": "sha512-IKHlyx6LDh8n19vzwH5RtHIOHl9Tu90aAAxcbWME6kp4dmvODM3UvOHJeMIDzUbd4muuJKHmlNoBN+mDY4XkBA==", - "dependencies": { - "@babel/runtime": "^7.4.4" - }, - "engines": { - "node": ">=8.0.0" - }, - "peerDependencies": { - "@material-ui/core": "^4.0.0", - "@types/react": "^16.8.6 || ^17.0.0", - "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" - }, - "peerDependenciesMeta": { - "@types/react": { - "optional": true - } - } - }, - "node_modules/@material-ui/styles": { + "node_modules/@material-ui/core/node_modules/@material-ui/styles": { "version": "4.11.5", "resolved": "https://registry.npmjs.org/@material-ui/styles/-/styles-4.11.5.tgz", "integrity": "sha512-o/41ot5JJiUsIETME9wVLAJrmIWL3j0R0Bj2kCOLbSfqEkKf0fmaPt+5vtblUh5eXr2S+J/8J3DaCb10+CzPGA==", @@ -3588,7 +3573,7 @@ } } }, - "node_modules/@material-ui/system": { + "node_modules/@material-ui/core/node_modules/@material-ui/system": { "version": "4.12.2", "resolved": "https://registry.npmjs.org/@material-ui/system/-/system-4.12.2.tgz", "integrity": "sha512-6CSKu2MtmiJgcCGf6nBQpM8fLkuB9F55EKfbdTC80NND5wpTmKzwdhLYLH3zL4cLlK0gVaaltW7/wMuyTnN0Lw==", @@ -3616,20 +3601,7 @@ } } }, - "node_modules/@material-ui/types": { - "version": "5.1.0", - "resolved": "https://registry.npmjs.org/@material-ui/types/-/types-5.1.0.tgz", - "integrity": "sha512-7cqRjrY50b8QzRSYyhSpx4WRw2YuO0KKIGQEVk5J8uoz2BanawykgZGoWEqKm7pVIbzFDN0SpPcVV4IhOFkl8A==", - "peerDependencies": { - "@types/react": "*" - }, - "peerDependenciesMeta": { - "@types/react": { - "optional": true - } - } - }, - "node_modules/@material-ui/utils": { + "node_modules/@material-ui/core/node_modules/@material-ui/utils": { "version": "4.11.3", "resolved": "https://registry.npmjs.org/@material-ui/utils/-/utils-4.11.3.tgz", "integrity": "sha512-ZuQPV4rBK/V1j2dIkSSEcH5uT6AaHuKWFfotADHsC0wVL1NLd2WkFCm4ZZbX33iO4ydl6V0GPngKm8HZQ2oujg==", @@ -3646,15 +3618,50 @@ "react-dom": "^16.8.0 || ^17.0.0" } }, + "node_modules/@material-ui/icons": { + "version": "4.11.3", + "resolved": "https://registry.npmjs.org/@material-ui/icons/-/icons-4.11.3.tgz", + "integrity": "sha512-IKHlyx6LDh8n19vzwH5RtHIOHl9Tu90aAAxcbWME6kp4dmvODM3UvOHJeMIDzUbd4muuJKHmlNoBN+mDY4XkBA==", + "dependencies": { + "@babel/runtime": "^7.4.4" + }, + "engines": { + "node": ">=8.0.0" + }, + "peerDependencies": { + "@material-ui/core": "^4.0.0", + "@types/react": "^16.8.6 || ^17.0.0", + "react": "^16.8.0 || ^17.0.0", + "react-dom": "^16.8.0 || ^17.0.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@material-ui/types": { + "version": "5.1.0", + "resolved": "https://registry.npmjs.org/@material-ui/types/-/types-5.1.0.tgz", + "integrity": "sha512-7cqRjrY50b8QzRSYyhSpx4WRw2YuO0KKIGQEVk5J8uoz2BanawykgZGoWEqKm7pVIbzFDN0SpPcVV4IhOFkl8A==", + "peerDependencies": { + "@types/react": "*" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, "node_modules/@mui/base": { - "version": "5.0.0-alpha.123", - "resolved": "https://registry.npmjs.org/@mui/base/-/base-5.0.0-alpha.123.tgz", - "integrity": "sha512-pxzcAfET3I6jvWqS4kijiLMn1OmdMw+mGmDa0SqmDZo3bXXdvLhpCCPqCkULG3UykhvFCOcU5HclOX3JCA+Zhg==", + "version": "5.0.0-alpha.125", + "resolved": "https://registry.npmjs.org/@mui/base/-/base-5.0.0-alpha.125.tgz", + "integrity": "sha512-hAHJJ97SATu6SrkLH/HsAayK1zMZt89lrWyKuAInBKVyn363H78d1MnwyZwre9vDK5MrPoDL/NnZxtAXhwTnBA==", "dependencies": { "@babel/runtime": "^7.21.0", "@emotion/is-prop-valid": "^1.2.0", - "@mui/types": "^7.2.3", - "@mui/utils": "^5.11.13", + "@mui/types": "^7.2.4", + "@mui/utils": "^5.12.0", "@popperjs/core": "^2.11.7", "clsx": "^1.2.1", "prop-types": "^15.8.1", @@ -3684,18 +3691,18 @@ "integrity": "sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==" }, "node_modules/@mui/core-downloads-tracker": { - "version": "5.11.15", - "resolved": "https://registry.npmjs.org/@mui/core-downloads-tracker/-/core-downloads-tracker-5.11.15.tgz", - "integrity": "sha512-Q0e2oBsjHyIWWj1wLzl14btunvBYC0yl+px7zL9R69tF87uenj6q72ieS369BJ6jxYpJwvXfR6/f+TC+ZUsKKg==", + "version": "5.12.0", + "resolved": "https://registry.npmjs.org/@mui/core-downloads-tracker/-/core-downloads-tracker-5.12.0.tgz", + "integrity": "sha512-1hoFIdlLI0sG+mkJgm70FjgIVpfLcE1vxPtNolg1tLFXrvbXGUYp9NHy3d6c41nDkg2OajuVS+Mn6A8UirFuMw==", "funding": { "type": "opencollective", "url": "https://opencollective.com/mui" } }, "node_modules/@mui/icons-material": { - "version": "5.11.11", - "resolved": "https://registry.npmjs.org/@mui/icons-material/-/icons-material-5.11.11.tgz", - "integrity": "sha512-Eell3ADmQVE8HOpt/LZ3zIma8JSvPh3XgnhwZLT0k5HRqZcd6F/QDHc7xsWtgz09t+UEFvOYJXjtrwKmLdwwpw==", + "version": "5.11.16", + "resolved": "https://registry.npmjs.org/@mui/icons-material/-/icons-material-5.11.16.tgz", + "integrity": "sha512-oKkx9z9Kwg40NtcIajF9uOXhxiyTZrrm9nmIJ4UjkU2IdHpd4QVLbCc/5hZN/y0C6qzi2Zlxyr9TGddQx2vx2A==", "dependencies": { "@babel/runtime": "^7.21.0" }, @@ -3718,19 +3725,19 @@ } }, "node_modules/@mui/material": { - "version": "5.11.15", - "resolved": "https://registry.npmjs.org/@mui/material/-/material-5.11.15.tgz", - "integrity": "sha512-E5RbLq9/OvRKmGyeZawdnmFBCvhKkI/Zqgr0xFqW27TGwKLxObq/BreJc6Uu5Sbv8Fjj34vEAbRx6otfOyxn5w==", + "version": "5.12.0", + "resolved": "https://registry.npmjs.org/@mui/material/-/material-5.12.0.tgz", + "integrity": "sha512-IMellv153zJ6+xfhLWgXpAm/9hsX8qE6gP66xWcW/Pf2B8ubyVhmkTXsp8pAJxk81D6p/EyYcnAjo5DiDVkj9g==", "dependencies": { "@babel/runtime": "^7.21.0", - "@mui/base": "5.0.0-alpha.123", - "@mui/core-downloads-tracker": "^5.11.15", - "@mui/system": "^5.11.15", - "@mui/types": "^7.2.3", - "@mui/utils": "^5.11.13", + "@mui/base": "5.0.0-alpha.125", + "@mui/core-downloads-tracker": "^5.12.0", + "@mui/system": "^5.12.0", + "@mui/types": "^7.2.4", + "@mui/utils": "^5.12.0", "@types/react-transition-group": "^4.4.5", "clsx": "^1.2.1", - "csstype": "^3.1.1", + "csstype": "^3.1.2", "prop-types": "^15.8.1", "react-is": "^18.2.0", "react-transition-group": "^4.4.5" @@ -3762,9 +3769,9 @@ } }, "node_modules/@mui/material/node_modules/csstype": { - "version": "3.1.1", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.1.tgz", - "integrity": "sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw==" + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.2.tgz", + "integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==" }, "node_modules/@mui/material/node_modules/react-is": { "version": "18.2.0", @@ -3772,12 +3779,12 @@ "integrity": "sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==" }, "node_modules/@mui/private-theming": { - "version": "5.11.13", - "resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-5.11.13.tgz", - "integrity": "sha512-PJnYNKzW5LIx3R+Zsp6WZVPs6w5sEKJ7mgLNnUXuYB1zo5aX71FVLtV7geyPXRcaN2tsoRNK7h444ED0t7cIjA==", + "version": "5.12.0", + "resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-5.12.0.tgz", + "integrity": "sha512-w5dwMen1CUm1puAtubqxY9BIzrBxbOThsg2iWMvRJmWyJAPdf3Z583fPXpqeA2lhTW79uH2jajk5Ka4FuGlTPg==", "dependencies": { "@babel/runtime": "^7.21.0", - "@mui/utils": "^5.11.13", + "@mui/utils": "^5.12.0", "prop-types": "^15.8.1" }, "engines": { @@ -3798,13 +3805,13 @@ } }, "node_modules/@mui/styled-engine": { - "version": "5.11.11", - "resolved": "https://registry.npmjs.org/@mui/styled-engine/-/styled-engine-5.11.11.tgz", - "integrity": "sha512-wV0UgW4lN5FkDBXefN8eTYeuE9sjyQdg5h94vtwZCUamGQEzmCOtir4AakgmbWMy0x8OLjdEUESn9wnf5J9MOg==", + "version": "5.12.0", + "resolved": "https://registry.npmjs.org/@mui/styled-engine/-/styled-engine-5.12.0.tgz", + "integrity": "sha512-frh8L7CRnvD0RDmIqEv6jFeKQUIXqW90BaZ6OrxJ2j4kIsiVLu29Gss4SbBvvrWwwatR72sBmC3w1aG4fjp9mQ==", "dependencies": { "@babel/runtime": "^7.21.0", - "@emotion/cache": "^11.10.5", - "csstype": "^3.1.1", + "@emotion/cache": "^11.10.7", + "csstype": "^3.1.2", "prop-types": "^15.8.1" }, "engines": { @@ -3829,9 +3836,9 @@ } }, "node_modules/@mui/styled-engine-sc": { - "version": "5.11.11", - "resolved": "https://registry.npmjs.org/@mui/styled-engine-sc/-/styled-engine-sc-5.11.11.tgz", - "integrity": "sha512-6+HsfcKHlhjQklDoEup7Itl+Xgn+BCsqEpIdIIhlxED4YlOZ38xghxIKrx78XFZznTorbhAspUgDDKIaB5vDMg==", + "version": "5.12.0", + "resolved": "https://registry.npmjs.org/@mui/styled-engine-sc/-/styled-engine-sc-5.12.0.tgz", + "integrity": "sha512-3MgYoY2YG5tx0E5oKqvCv94oL0ABVBr+qpcyvciXW/v0wzPG6bXvuZV80GHYlJfasgnnRa1AbRWf5a9FcX8v6g==", "dependencies": { "@babel/runtime": "^7.21.0", "prop-types": "^15.8.1" @@ -3854,22 +3861,22 @@ } }, "node_modules/@mui/styled-engine/node_modules/csstype": { - "version": "3.1.1", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.1.tgz", - "integrity": "sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw==" + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.2.tgz", + "integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==" }, "node_modules/@mui/system": { - "version": "5.11.15", - "resolved": "https://registry.npmjs.org/@mui/system/-/system-5.11.15.tgz", - "integrity": "sha512-vCatoWCTnAPquoNifHbqMCMnOElEbLosVUeW0FQDyjCq+8yMABD9E6iY0s14O7iq1wD+qqU7rFAuDIVvJ/AzzA==", + "version": "5.12.0", + "resolved": "https://registry.npmjs.org/@mui/system/-/system-5.12.0.tgz", + "integrity": "sha512-Zi+WHuiJfK1ya+9+oeJQ1rLIBdY8CGDYT5oVlQg/6kIuyiCaE6SnN9PVzxBxfY77wHuOPwz4kxcPe9srdZc12Q==", "dependencies": { "@babel/runtime": "^7.21.0", - "@mui/private-theming": "^5.11.13", - "@mui/styled-engine": "^5.11.11", - "@mui/types": "^7.2.3", - "@mui/utils": "^5.11.13", + "@mui/private-theming": "^5.12.0", + "@mui/styled-engine": "^5.12.0", + "@mui/types": "^7.2.4", + "@mui/utils": "^5.12.0", "clsx": "^1.2.1", - "csstype": "^3.1.1", + "csstype": "^3.1.2", "prop-types": "^15.8.1" }, "engines": { @@ -3898,14 +3905,14 @@ } }, "node_modules/@mui/system/node_modules/csstype": { - "version": "3.1.1", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.1.tgz", - "integrity": "sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw==" + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.2.tgz", + "integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==" }, "node_modules/@mui/types": { - "version": "7.2.3", - "resolved": "https://registry.npmjs.org/@mui/types/-/types-7.2.3.tgz", - "integrity": "sha512-tZ+CQggbe9Ol7e/Fs5RcKwg/woU+o8DCtOnccX6KmbBc7YrfqMYEYuaIcXHuhpT880QwNkZZ3wQwvtlDFA2yOw==", + "version": "7.2.4", + "resolved": "https://registry.npmjs.org/@mui/types/-/types-7.2.4.tgz", + "integrity": "sha512-LBcwa8rN84bKF+f5sDyku42w1NTxaPgPyYKODsh01U1fVstTClbUoSA96oyRBnSNyEiAVjKm6Gwx9vjR+xyqHA==", "peerDependencies": { "@types/react": "*" }, @@ -3916,9 +3923,9 @@ } }, "node_modules/@mui/utils": { - "version": "5.11.13", - "resolved": "https://registry.npmjs.org/@mui/utils/-/utils-5.11.13.tgz", - "integrity": "sha512-5ltA58MM9euOuUcnvwFJqpLdEugc9XFsRR8Gt4zZNb31XzMfSKJPR4eumulyhsOTK1rWf7K4D63NKFPfX0AxqA==", + "version": "5.12.0", + "resolved": "https://registry.npmjs.org/@mui/utils/-/utils-5.12.0.tgz", + "integrity": "sha512-RmQwgzF72p7Yr4+AAUO6j1v2uzt6wr7SWXn68KBsnfVpdOHyclCzH2lr/Xu6YOw9su4JRtdAIYfJFXsS6Cjkmw==", "dependencies": { "@babel/runtime": "^7.21.0", "@types/prop-types": "^15.7.5", @@ -4083,9 +4090,9 @@ } }, "node_modules/@restart/ui": { - "version": "1.6.2", - "resolved": "https://registry.npmjs.org/@restart/ui/-/ui-1.6.2.tgz", - "integrity": "sha512-hcYs8PwpmHEtwjihLVn2Jr89yrYajfhxN5HtTq3HA9U3+feg1SC3swBM8/qibMTCFsXWToEEtzJMV+LWE+Qjpg==", + "version": "1.6.3", + "resolved": "https://registry.npmjs.org/@restart/ui/-/ui-1.6.3.tgz", + "integrity": "sha512-7HM5aiSWvJBWr+FghZj/n3PSuH2kUrOPiu/D92aIv1zTL8IBwFoQ3oz/f76svoN5v2PKaP6pQbg6vTcIiSffzg==", "dependencies": { "@babel/runtime": "^7.21.0", "@popperjs/core": "^2.11.6", @@ -4094,7 +4101,7 @@ "@types/warning": "^3.0.0", "dequal": "^2.0.3", "dom-helpers": "^5.2.0", - "uncontrollable": "^8.0.0", + "uncontrollable": "^7.2.1", "warning": "^4.0.3" }, "peerDependencies": { @@ -4102,32 +4109,6 @@ "react-dom": ">=16.14.0" } }, - "node_modules/@restart/ui/node_modules/@types/react": { - "version": "18.0.34", - "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.34.tgz", - "integrity": "sha512-NO1UO8941541CJl1BeOXi8a9dNKFK09Gnru5ZJqkm4Q3/WoQJtHvmwt0VX0SB9YCEwe7TfSSxDuaNmx6H2BAIQ==", - "dependencies": { - "@types/prop-types": "*", - "@types/scheduler": "*", - "csstype": "^3.0.2" - } - }, - "node_modules/@restart/ui/node_modules/csstype": { - "version": "3.1.2", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.2.tgz", - "integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==" - }, - "node_modules/@restart/ui/node_modules/uncontrollable": { - "version": "8.0.0", - "resolved": "https://registry.npmjs.org/uncontrollable/-/uncontrollable-8.0.0.tgz", - "integrity": "sha512-a954G/0JyXoZdpt0YIzTfoQyWtRS1VvygOBsHttCtZL8jDTKd6vQlUo811y46XnWoXIqQ36QKi3cSEdPuFADkA==", - "dependencies": { - "@types/react": ">=18.0.28" - }, - "peerDependencies": { - "react": ">=17.0.0" - } - }, "node_modules/@rollup/plugin-babel": { "version": "5.3.1", "resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz", @@ -4455,9 +4436,9 @@ } }, "node_modules/@testing-library/dom": { - "version": "8.20.0", - "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-8.20.0.tgz", - "integrity": "sha512-d9ULIT+a4EXLX3UU8FBjauG9NnsZHkHztXoIcTsOKoOw030fyjheN9svkTULjJxtYag9DZz5Jz5qkWZDPxTFwA==", + "version": "9.2.0", + "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-9.2.0.tgz", + "integrity": "sha512-xTEnpUKiV/bMyEsE5bT4oYA0x0Z/colMtxzUY8bKyPXBNLn/e0V4ZjBZkEhms0xE4pv9QsPfSRu9AWS4y5wGvA==", "dependencies": { "@babel/code-frame": "^7.10.4", "@babel/runtime": "^7.12.5", @@ -4465,11 +4446,11 @@ "aria-query": "^5.0.0", "chalk": "^4.1.0", "dom-accessibility-api": "^0.5.9", - "lz-string": "^1.4.4", + "lz-string": "^1.5.0", "pretty-format": "^27.0.2" }, "engines": { - "node": ">=12" + "node": ">=14" } }, "node_modules/@testing-library/dom/node_modules/chalk": { @@ -4509,16 +4490,16 @@ } }, "node_modules/@testing-library/react": { - "version": "13.4.0", - "resolved": "https://registry.npmjs.org/@testing-library/react/-/react-13.4.0.tgz", - "integrity": "sha512-sXOGON+WNTh3MLE9rve97ftaZukN3oNf2KjDy7YTx6hcTO2uuLHuCGynMDhFwGw/jYf4OJ2Qk0i4i79qMNNkyw==", + "version": "14.0.0", + "resolved": "https://registry.npmjs.org/@testing-library/react/-/react-14.0.0.tgz", + "integrity": "sha512-S04gSNJbYE30TlIMLTzv6QCTzt9AqIF5y6s6SzVFILNcNvbV/jU96GeiTPillGQo+Ny64M/5PV7klNYYgv5Dfg==", "dependencies": { "@babel/runtime": "^7.12.5", - "@testing-library/dom": "^8.5.0", + "@testing-library/dom": "^9.0.0", "@types/react-dom": "^18.0.0" }, "engines": { - "node": ">=12" + "node": ">=14" }, "peerDependencies": { "react": "^18.0.0", @@ -4526,14 +4507,11 @@ } }, "node_modules/@testing-library/user-event": { - "version": "13.5.0", - "resolved": "https://registry.npmjs.org/@testing-library/user-event/-/user-event-13.5.0.tgz", - "integrity": "sha512-5Kwtbo3Y/NowpkbRuSepbyMFkZmHgD+vPzYB/RJ4oxt5Gj/avFFBYjhw27cqSVPVw/3a67NK1PbiIr9k4Gwmdg==", - "dependencies": { - "@babel/runtime": "^7.12.5" - }, + "version": "14.4.3", + "resolved": "https://registry.npmjs.org/@testing-library/user-event/-/user-event-14.4.3.tgz", + "integrity": "sha512-kCUc5MEwaEMakkO5x7aoD+DLi02ehmEM2QCGWvNqAS1dV/fAvORWEjnjsEIvml59M7Y5kCkWN6fCCyPOe8OL6Q==", "engines": { - "node": ">=10", + "node": ">=12", "npm": ">=6" }, "peerDependencies": { @@ -6369,6 +6347,17 @@ "node": ">=10" } }, + "node_modules/chart.js": { + "version": "4.2.1", + "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-4.2.1.tgz", + "integrity": "sha512-6YbpQ0nt3NovAgOzbkSSeeAQu/3za1319dPUQTXn9WcOpywM8rGKxJHrhS8V8xEkAlk8YhEfjbuAPfUyp6jIsw==", + "dependencies": { + "@kurkle/color": "^0.3.0" + }, + "engines": { + "pnpm": "^7.0.0" + } + }, "node_modules/check-types": { "version": "11.2.2", "resolved": "https://registry.npmjs.org/check-types/-/check-types-11.2.2.tgz", @@ -9080,19 +9069,6 @@ "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz", "integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==" }, - "node_modules/fsevents": { - "version": "2.3.2", - "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", - "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==", - "hasInstallScript": true, - "optional": true, - "os": [ - "darwin" - ], - "engines": { - "node": "^8.16.0 || ^10.6.0 || >=11.0.0" - } - }, "node_modules/function-bind": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz", @@ -12729,9 +12705,9 @@ } }, "node_modules/jss/node_modules/csstype": { - "version": "3.1.1", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.1.tgz", - "integrity": "sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw==" + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.2.tgz", + "integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==" }, "node_modules/jsx-ast-utils": { "version": "3.3.3", @@ -15248,9 +15224,9 @@ } }, "node_modules/react": { - "version": "18.2.0", - "resolved": "https://registry.npmjs.org/react/-/react-18.2.0.tgz", - "integrity": "sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==", + "version": "18.0.0", + "resolved": "https://registry.npmjs.org/react/-/react-18.0.0.tgz", + "integrity": "sha512-x+VL6wbT4JRVPm7EGxXhZ8w8LTROaxPXOqhlGyVSrv0sB1jkyFGgXxJ8LVoPRLvPR6/CIZGFmfzqUa2NYeMr2A==", "dependencies": { "loose-envify": "^1.1.0" }, @@ -15275,20 +15251,20 @@ } }, "node_modules/react-bootstrap": { - "version": "2.7.2", - "resolved": "https://registry.npmjs.org/react-bootstrap/-/react-bootstrap-2.7.2.tgz", - "integrity": "sha512-WDSln+mG4RLLFO01stkj2bEx/3MF4YihK9D/dWnHaSxOiQZLbhhlf95D2Jb20X3t2m7vMxRe888FVrfLJoGmmA==", - "dependencies": { - "@babel/runtime": "^7.17.2", - "@restart/hooks": "^0.4.6", - "@restart/ui": "^1.4.1", - "@types/react-transition-group": "^4.4.4", - "classnames": "^2.3.1", + "version": "2.7.4", + "resolved": "https://registry.npmjs.org/react-bootstrap/-/react-bootstrap-2.7.4.tgz", + "integrity": "sha512-EPKPwhfbxsKsNBhJBitJwqul9fvmlYWSft6jWE2EpqhEyjhqIqNihvQo2onE5XtS+QHOavUSNmA+8Lnv5YeAyg==", + "dependencies": { + "@babel/runtime": "^7.21.0", + "@restart/hooks": "^0.4.9", + "@restart/ui": "^1.6.3", + "@types/react-transition-group": "^4.4.5", + "classnames": "^2.3.2", "dom-helpers": "^5.2.1", "invariant": "^2.2.4", "prop-types": "^15.8.1", "prop-types-extra": "^1.1.0", - "react-transition-group": "^4.4.2", + "react-transition-group": "^4.4.5", "uncontrollable": "^7.2.1", "warning": "^4.0.3" }, @@ -15317,6 +15293,15 @@ "react": ">=0.13" } }, + "node_modules/react-chartjs-2": { + "version": "5.2.0", + "resolved": "https://registry.npmjs.org/react-chartjs-2/-/react-chartjs-2-5.2.0.tgz", + "integrity": "sha512-98iN5aguJyVSxp5U3CblRLH67J8gkfyGNbiK3c+l1QI/G4irHMPQw44aEPmjVag+YKTyQ260NcF82GTQ3bdscA==", + "peerDependencies": { + "chart.js": "^4.1.1", + "react": "^16.8.0 || ^17.0.0 || ^18.0.0" + } + }, "node_modules/react-dev-utils": { "version": "12.0.1", "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-12.0.1.tgz", @@ -15375,15 +15360,15 @@ } }, "node_modules/react-dom": { - "version": "18.2.0", - "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.2.0.tgz", - "integrity": "sha512-6IMTriUmvsjHUjNtEDudZfuDQUoWXVxKHhlEGSk81n4YFS+r/Kl99wXiwlVXtPBtJenozv2P+hxDsw9eA7Xo6g==", + "version": "18.0.0", + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.0.0.tgz", + "integrity": "sha512-XqX7uzmFo0pUceWFCt7Gff6IyIMzFUn7QMZrbrQfGxtaxXZIcGQzoNpRLE3fQLnS4XzLLPMZX2T9TRcSrasicw==", "dependencies": { "loose-envify": "^1.1.0", - "scheduler": "^0.23.0" + "scheduler": "^0.21.0" }, "peerDependencies": { - "react": "^18.2.0" + "react": "^18.0.0" } }, "node_modules/react-error-overlay": { @@ -15990,9 +15975,9 @@ } }, "node_modules/scheduler": { - "version": "0.23.0", - "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.0.tgz", - "integrity": "sha512-CtuThmgHNg7zIZWAXi3AsyIzA3n4xx7aNyjwC2VJldO2LMVDhFK+63xGqq6CsJH4rTAt6/M+N4GhZiDYPx9eUw==", + "version": "0.21.0", + "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.21.0.tgz", + "integrity": "sha512-1r87x5fz9MXqswA2ERLo0EbOAU74DpIUO090gIasYTqlVoJeMcl+Z1Rg7WHz+qtPujhS/hGIt9kxZOYBV3faRQ==", "dependencies": { "loose-envify": "^1.1.0" } @@ -17263,19 +17248,6 @@ "is-typedarray": "^1.0.0" } }, - "node_modules/typescript": { - "version": "4.9.5", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.5.tgz", - "integrity": "sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==", - "peer": true, - "bin": { - "tsc": "bin/tsc", - "tsserver": "bin/tsserver" - }, - "engines": { - "node": ">=4.2.0" - } - }, "node_modules/unbox-primitive": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/unbox-primitive/-/unbox-primitive-1.0.2.tgz", @@ -17549,9 +17521,9 @@ } }, "node_modules/web-vitals": { - "version": "2.1.4", - "resolved": "https://registry.npmjs.org/web-vitals/-/web-vitals-2.1.4.tgz", - "integrity": "sha512-sVWcwhU5mX6crfI5Vd2dC4qchyTqxV8URinzt25XqVh+bHEPGH4C3NPrNionCP7Obx59wrYEbNlw4Z8sjALzZg==" + "version": "3.3.1", + "resolved": "https://registry.npmjs.org/web-vitals/-/web-vitals-3.3.1.tgz", + "integrity": "sha512-LTfY5GjcY3ngFzNsYFSYL+AmVmlWrzPTUxSMDis2rZbf+SzT7HH3NH4Y/l45XOlrAIunOBeURN9qtBHkRskAiA==" }, "node_modules/webidl-conversions": { "version": "6.1.0", diff --git a/package.json b/package.json index cec5eac..d3edeaf 100644 --- a/package.json +++ b/package.json @@ -7,21 +7,23 @@ "@emotion/styled": "^11.10.6", "@material-ui/core": "^4.12.4", "@material-ui/icons": "^4.11.3", - "@mui/icons-material": "^5.11.11", - "@mui/material": "^5.11.15", - "@mui/styled-engine-sc": "^5.11.11", + "@mui/icons-material": "^5.11.16", + "@mui/material": "^5.12.0", + "@mui/styled-engine-sc": "^5.12.0", "@testing-library/jest-dom": "^5.16.5", - "@testing-library/react": "^13.4.0", - "@testing-library/user-event": "^13.5.0", + "@testing-library/react": "^14.0.0", + "@testing-library/user-event": "^14.4.3", "bootstrap": "^5.2.3", - "react": "^18.2.0", - "react-bootstrap": "^2.7.2", + "chart.js": "^4.2.1", + "react": "^18.0.0", + "react-bootstrap": "^2.7.4", "react-bootstrap-validation": "^0.1.11", - "react-dom": "^18.2.0", + "react-chartjs-2": "^5.2.0", + "react-dom": "^18.0.0", "react-pro-sidebar": "^1.0.0", "react-scripts": "5.0.1", "styled-components": "^5.3.9", - "web-vitals": "^2.1.4" + "web-vitals": "^3.3.1" }, "scripts": { "start": "react-scripts start", diff --git a/public/manifest.json b/public/manifest.json index 080d6c7..1f2f141 100644 --- a/public/manifest.json +++ b/public/manifest.json @@ -6,16 +6,6 @@ "src": "favicon.ico", "sizes": "64x64 32x32 24x24 16x16", "type": "image/x-icon" - }, - { - "src": "logo192.png", - "type": "image/png", - "sizes": "192x192" - }, - { - "src": "logo512.png", - "type": "image/png", - "sizes": "512x512" } ], "start_url": ".", diff --git a/src/Main.js b/src/Main.js index 02b3954..61b8fd8 100644 --- a/src/Main.js +++ b/src/Main.js @@ -71,7 +71,7 @@ export default function Main() {
-
+
diff --git a/src/components/AddExpenseForm.js b/src/components/AddExpenseForm.js index ef4096c..5ff9a44 100644 --- a/src/components/AddExpenseForm.js +++ b/src/components/AddExpenseForm.js @@ -1,16 +1,82 @@ -import React, { useContext, useState } from 'react'; +import React, { useContext, useEffect, useState } from 'react'; import { AppContext } from '../context/AppContext'; import { v4 as uuidv4 } from 'uuid'; import './AddExpenseForm.css' +import { getSessionKey } from '../utils/utils.js' const AddExpenseForm = (props) => { const { dispatch } = useContext(AppContext); const [name, setName] = useState(''); const [cost, setCost] = useState(''); + const [category, setCategory] = useState(''); + const [categoryList, setCategoryList] = useState([]); + + useEffect(() => { + try { + fetch('http://127.0.0.1:3030/w/budget', { + method: 'GET', + headers: { + 'x-session-key' : getSessionKey(), + } + }) + .then(response => response.json()) + .then(data => { + if (data.status != 200) { + console.log(data.error); + } else { + setCategoryList(data.categories); + } + }) + } catch(error) { + console.error(error); + } + }, []) const onSubmit = (event) => { event.preventDefault(); + + const formData = new FormData(); + + let currency = "USD" + let whole = 0; + let decimal = 0; + let type = 'expenses'; + + + if (cost.includes(".")) { + whole = parseInt(cost.split(".")[0]); + decimal = parseInt(cost.split(".")[1]); + } else { + whole = parseInt(cost); + } + formData.append('category', category) + formData.append('currency', currency); + formData.append('whole', whole); + formData.append('decimal', decimal); + formData.append('type', type) + + try { + fetch(`http://127.0.0.1:3030/w/transactions?whole=${whole}&decimal=${decimal}¤cy=${currency}&category=${category}&type=${type}`, { + method: 'POST', + body: formData, + headers: { + 'x-session-key' : getSessionKey(), + } + }) + .then(response => response.json()) + .then(data => { + if (data.status != 200) { + console.log(data.error); + } else { + + } + }) + } catch(error) { + console.error(error); + } + + /* const expense = { id: uuidv4(), name, @@ -21,60 +87,82 @@ const AddExpenseForm = (props) => { type: 'ADD_EXPENSE', payload: expense, }); + */ setName(''); setCost(''); }; + const handleAddCategory = () => { + const newCategory = prompt('Enter the new category name:'); + if (newCategory) { + if (categoryList.indexOf(newCategory) == -1) { + const newCategories = [...categoryList, newCategory]; + setCategoryList(newCategories); + } + setCategory(newCategory); + } + } + return ( -
-
- {/*
- - - - -
*/} -

Add Expense

-
- - setName(event.target.value)} - > - -
-
- - setCost(event.target.value)} - /> +
+

Add Expense

+
+
+ {/* +
+ + setName(event.target.value)} + > +
+ */} +
+
+
+ + setCost(event.target.value)} + /> +
+
+ + +
-
-
- +
+
+ + +
-
- -
+ +
); }; diff --git a/src/components/CategorizedBudget.js b/src/components/CategorizedBudget.js new file mode 100644 index 0000000..842bba4 --- /dev/null +++ b/src/components/CategorizedBudget.js @@ -0,0 +1,84 @@ +import { Doughnut } from "react-chartjs-2"; +import { Chart as ChartJS, ArcElement, Tooltip, Legend, defaults } from 'chart.js'; + +import { AppProvider } from "../context/AppContext"; +import { useState, useEffect } from 'react' +import { getSessionKey } from '../utils/utils.js' + +ChartJS.register(ArcElement, Tooltip, Legend); + +export default function CategorizedBudget() { + const [chartData, setChartData] = useState(null); + + useEffect(() => { + async function getChartData() { + try { + fetch('http://127.0.0.1:3030/w/budget', { + method: 'GET', + headers: { + 'x-session-key' : 'b36efa01-7824-4f61-a274-63131b58d8fe', + } + }) + .then(response => response.json()) + .then(data => { + if (data.status != 200) { + console.log(data.error); + } else { + const chartData = { + labels: [data.categories.length > 0 ? data.categories : "no expenses"], + datasets: [ + { + data: data.expenses_by_category.length > 0 + ? data.expenses_by_category.map(category => { + return category['whole'] + }) + : [1], + backgroundColor: [ + 'rgba(255, 99, 132, 0.2)', + 'rgba(54, 162, 235, 0.2)', + 'rgba(255, 206, 86, 0.2)', + 'rgba(75, 192, 192, 0.2)', + 'rgba(153, 102, 255, 0.2)', + 'rgba(255, 159, 64, 0.2)', + ], + borderColor: [ + "black" + ], + borderWidth: 1, + }, + ], + } + setChartData(chartData); + } + }) + .catch(error => { + console.log(error); + }); + } catch(error) { + console.error(error); + } + } + getChartData(); + }, []); + + if (!chartData) { + return

Loading...

+ } + + return ( +
+

Expenses by Category

+ +
+ ) +} \ No newline at end of file diff --git a/src/components/ExpenseList.js b/src/components/ExpenseList.js index aeae5ba..520667b 100644 --- a/src/components/ExpenseList.js +++ b/src/components/ExpenseList.js @@ -19,13 +19,14 @@ const ExpenseList = () => { }; return ( - <> +
{/* */} +

Expenses

    {filteredExpenses.map((expense) => ( { /> ))}
- +
); }; diff --git a/src/components/ExpenseTotal.js b/src/components/ExpenseTotal.js index 0887e0b..c8fe744 100644 --- a/src/components/ExpenseTotal.js +++ b/src/components/ExpenseTotal.js @@ -11,7 +11,7 @@ const ExpenseTotal = () => { }, 0); return ( -
+
This Month's Expenses: ${total}
diff --git a/src/components/NavBar.css b/src/components/NavBar.css index 5fdcc29..5989484 100644 --- a/src/components/NavBar.css +++ b/src/components/NavBar.css @@ -1,6 +1,5 @@ .bar { - padding: 10px; - margin-bottom: 20px; + margin-bottom: 10px; } .logo { diff --git a/src/components/NavBar.js b/src/components/NavBar.js index 9f69fa2..9d1fc9f 100644 --- a/src/components/NavBar.js +++ b/src/components/NavBar.js @@ -11,6 +11,7 @@ import { async } from "q"; export default function NavBar() { const [name, setName] = useState(null); + useEffect(() => { async function fetchName() { @@ -21,11 +22,11 @@ export default function NavBar() { }, []); return ( - + BudgetBuddy diff --git a/src/components/Remaining.js b/src/components/Remaining.js index 889fc8d..77d5117 100644 --- a/src/components/Remaining.js +++ b/src/components/Remaining.js @@ -13,7 +13,7 @@ const RemainingBudget = () => { const alertType = totalExpenses > budget ? 'alert-danger' : 'alert-success'; return ( -
+
Budget Remaining: ${budget - totalExpenses}
diff --git a/src/components/SideNav.js b/src/components/SideNav.js index 7e9df1f..644a248 100644 --- a/src/components/SideNav.js +++ b/src/components/SideNav.js @@ -31,7 +31,7 @@ export default function SideNav() {
- Welcome, {firstName} + Welcome, {firstName}! Your Budget Overiew
diff --git a/src/components/budget.js b/src/components/budget.js index 2d71893..1ab0a5d 100644 --- a/src/components/budget.js +++ b/src/components/budget.js @@ -20,7 +20,7 @@ const Budget = () => { }; return ( -
+
{isEditing ? ( ) : ( diff --git a/src/pages/Dashboard.jsx b/src/pages/Dashboard.jsx index c2c456c..abf9e08 100644 --- a/src/pages/Dashboard.jsx +++ b/src/pages/Dashboard.jsx @@ -8,13 +8,14 @@ import ExpenseList from '../components/ExpenseList'; import AddExpenseForm from '../components/AddExpenseForm'; import RemainingBudget from '../components/Remaining'; import AddIncome from '../components/AddIncome' +import CategorizedBudget from '../components/CategorizedBudget'; +import { Typography } from '@mui/material'; export default function Dashboard() { return (
-

My Budget Planner

-
+
@@ -27,19 +28,24 @@ export default function Dashboard() {
-
-

Expenses

+
+
-
+
- +
-
- {/*

Add Income

*/} +
+ +
+
+
+ +
diff --git a/src/pages/Login.jsx b/src/pages/Login.jsx index beefdbd..944ba38 100644 --- a/src/pages/Login.jsx +++ b/src/pages/Login.jsx @@ -29,7 +29,6 @@ export default function Login() { document.cookie = `session=${session}; path=/;` window.location.href = '/dashboard'; } - console.log(data); // Log the response from the server }) .catch((error) => { diff --git a/src/styles.css b/src/styles.css index ea6503a..e2117d7 100644 --- a/src/styles.css +++ b/src/styles.css @@ -13,39 +13,39 @@ code { } .app { - background-color: #F7F7F2; - color: #444444; + background-color: #EFEFE6; + color: #191910; min-height: 100vh; } .main-body { display: flex; - width: 100vw; + width: 100%; } .page-display { - margin: 0 40px; + padding: 0 10px; margin-bottom: 30px; - border-radius: 20px; - padding: 20px 30px; - width: 100vw; - background-color: #FFFFFF; - /*display: grid; COMMENTED OUT BY CHRIS FOR PUSH ON WIDGETS, not sure if need for welcome page or not, do not need anymore for widgets - grid-template-columns: repeat(4, 1fr); - grid-template-rows: 125px 250px 100px 100px; - gap: 10px; - padding: 10px; - box-sizing: border-box; */ + width: 100%; } .elevated { filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25)); } -.page-display div { - padding: 10px; -} - .page-display > * { margin: 0; +} + +.widget { + border-radius: 10px; + padding: 15px 20px; + height: 100%; + background-color: #F7F7F3; + filter: drop-shadow(0 4px 2px rgba(0, 0, 0, 0.10)); +} + +.btn-primary, .btn-primary:hover, .btn-primary:active, .btn-primary:visited { + background-color: #5672C7 !important; + border-color: #4766C2 !important; } \ No newline at end of file diff --git a/src/utils/utils.js b/src/utils/utils.js index 7a004c7..fddc0c1 100644 --- a/src/utils/utils.js +++ b/src/utils/utils.js @@ -11,7 +11,7 @@ export function checkLogin() { return false; } -function getSessionKey() { +export function getSessionKey() { var cookies = document.cookie.split(';'); for (let i = 0; i < cookies.length; i++) { const cookie = cookies[i].trim(); // Remove any leading or trailing whitespace @@ -31,9 +31,8 @@ export async function getName() { }, }); const data = await response.json(); - const firstName = data.name; - console.log(firstName); // Logs the first name correctly - return firstName; + const name = data.name; + return name; } catch (error) { console.error(error); }