Vercel dependencies (#80)

* upgrading nonbreaking dependencies and adding vercel integration

* vercel build fix

* using regular build to get proper out directory for static files

* graph sizing adjustments for improved prof detail visibility

* pandering to 100% view browsers

* mobile minimum height suggestion

Author: emw8105

.nvmrc

@@ -0,0 +1 @@
+22

client/package.json

@@ -1,37 +1,49 @@
 {
   "name": "@utd-grades/client",
   "version": "1.4.0",
+  "engines": {
+    "node": ">=22.0.0",
+    "npm": ">=10.0.0"
+  },
   "scripts": {
     "dev": "next dev",
     "build": "next build",
     "export": "next export",
     "start": "next start",
-    "lint": "npx eslint src/*"
+    "lint": "npx eslint \"src/**/*.{ts,tsx}\""
   },
   "dependencies": {
-    "@ant-design/icons": "^4.7.0",
+    "@ant-design/icons": "^4.8.3",
     "@utd-grades/db": "^1.0.0",
-    "antd": "^4.19.3",
-    "chart.js": "^3.7.1",
+    "antd": "^4.24.16",
+    "chart.js": "^3.9.1",
     "lodash.debounce": "^4.0.8",
-    "next": "^12.3.4",
+    "next": "^12.3.7",
     "react": "^17.0.2",
-    "react-chartjs-2": "^4.0.1",
+    "react-chartjs-2": "^4.3.1",
     "react-dom": "^17.0.2",
-    "react-query": "^3.34.18",
-    "react-scroll": "^1.8.6",
-    "react-transition-group": "^4.4.2",
-    "styled-components": "^5.3.5"
+    "react-query": "^3.39.3",
+    "react-scroll": "^1.9.3",
+    "react-transition-group": "^4.4.5",
+    "sql.js": "^1.13.0",
+    "styled-components": "^5.3.11"
   },
   "devDependencies": {
-    "@types/lodash.debounce": "^4.0.6",
-    "@types/react": "^17.0.43",
-    "@types/react-scroll": "^1.8.3",
-    "@types/styled-components": "^5.1.24",
-    "eslint-config-next": "^12.1.4",
+    "@types/lodash.debounce": "^4.0.9",
+    "@types/react": "^17.0.88",
+    "@types/react-scroll": "^1.8.10",
+    "@types/sql.js": "^1.4.9",
+    "@types/styled-components": "^5.1.34",
+    "@typescript-eslint/eslint-plugin": "^5.62.0",
+    "@typescript-eslint/parser": "^5.62.0",
+    "eslint": "^8.57.0",
+    "eslint-config-next": "^12.3.7",
+    "eslint-config-prettier": "^8.10.0",
+    "eslint-plugin-jest": "^26.9.0",
     "node-polyfill-webpack-plugin": "^1.1.4",
     "path": "^0.12.7",
-    "webpack": "^5.70.0"
+    "typescript": "^4.9.5",
+    "webpack": "^5.101.0"
   },
   "optionalDependencies": {
     "@next/swc-linux-x64-gnu": "^12.3.4"

client/src/components/SectionContent.tsx

@@ -39,10 +39,16 @@ const Container = styled.div`
 
 const GraphContainer = styled.div`
   width: 100%;
+  height: 50vh;
+  min-height: 300px;
+  max-height: 400px;
 
   @media (max-width: 992px) {
     & {
       padding-top: 20px;
+      height: 30vh;
+      min-height: 200px;
+      max-height: 300px;
     }
   }
 
@@ -326,6 +332,8 @@ export default function SectiSonContent({
   };
 
   const options: ChartOptions<"bar"> = {
+    responsive: true,
+    maintainAspectRatio: false,
     plugins: {
       tooltip: {
         enabled: true,

db/package.json

@@ -11,10 +11,10 @@
     "test": "jest"
   },
   "dependencies": {
-    "csv-parse": "^5.0.4",
-    "sql.js": "^1.6.2"
+    "csv-parse": "^5.6.0",
+    "sql.js": "^1.13.0"
   },
   "devDependencies": {
-    "@types/node": "^17.0.23"
+    "@types/node": "^17.0.45"
   }
 }