Fix GitHub contributions chart.

.gitignore

@@ -1 +1,3 @@
 .env
+portfolio_frontend/src/styles/index.css
+postgres_data/

portfolio_backend/src/lib.rs

@@ -44,8 +44,8 @@ fn run_migrations(rocket: Rocket) -> Result<Rocket, Rocket> {
 fn create_cors() -> Cors {
     let allowed_origins = AllowedOrigins::some_exact(&[
         "https://dennispham.me",
-        "http://localhost:8000",
-        "http://127.0.0.1:8000",
+        "http://localhost:3000",
+        "http://127.0.0.1:3000",
     ]);
 
     CorsOptions {

portfolio_frontend/package.json

@@ -30,12 +30,13 @@
     "react-scripts": "4.0.3",
     "react-scroll": "^1.8.1",
     "react-typed": "^1.2.0",
+    "react-use-event-hook": "^0.9.6",
     "typescript": "^4.0.3",
     "web-vitals": "^1.0.0"
   },
   "scripts": {
-    "start": "react-scripts start",
-    "build": "react-scripts --openssl-legacy-provider build",
+    "start": "postcss src/styles/tailwind.css -o src/styles/index.css --watch & react-scripts --openssl-legacy-provider start",
+    "build": "postcss src/styles/tailwind.css -o src/styles/index.css && react-scripts --openssl-legacy-provider build",
     "test": "react-scripts test",
     "eject": "react-scripts eject"
   },
@@ -57,5 +58,12 @@
       "last 1 safari version"
     ]
   },
-  "proxy": "http://localhost:8000"
+  "proxy": "http://localhost:8000",
+  "devDependencies": {
+    "@tailwindcss/typography": "^0.5.9",
+    "postcss": "^8.4.27",
+    "postcss-cli": "^10.1.0",
+    "postcss-preset-env": "^9.1.0",
+    "tailwindcss": "^3.3.3"
+  }
 }

portfolio_frontend/postcss.config.js

@@ -0,0 +1,3 @@
+module.exports = {
+  plugins: [require("tailwindcss"), require("postcss-preset-env")],
+};

portfolio_frontend/src/App.tsx

@@ -6,6 +6,7 @@ import "bootstrap/dist/css/bootstrap.min.css";
 import Loading from "./components/Loading";
 import NavBar from "./components/NavBar";
 import PrivateSuspenseRoute from "./components/PrivateSuspenseRoute";
+import { GraphDataProvider } from "./hooks/contribGraph";
 
 const IndexPage = React.lazy(() => import("./pages/IndexPage"));
 const ProjectsPage = React.lazy(() => import("./pages/ProjectsPage"));
@@ -29,25 +30,27 @@ function App() {
   return (
     <Router>
       <Switch>
-        {routes.map(({ path, Component }) => (
-          <Route exact key={path} path={path}>
-            {path.startsWith("/auth") ? null : <NavBar />}
-
-            <Suspense fallback={<Loading />}>
-              <Component />
-            </Suspense>
-          </Route>
-        ))}
-
-        {adminRoutes.map(({ path, Component }) => (
-          <PrivateSuspenseRoute
-            exact
-            key={path}
-            path={path}
-            component={Component}
-            fallback={<Loading />}
-          />
-        ))}
+        <GraphDataProvider>
+          {routes.map(({ path, Component }) => (
+            <Route exact key={path} path={path}>
+              {path.startsWith("/auth") ? null : <NavBar />}
+
+              <Suspense fallback={<Loading />}>
+                <Component />
+              </Suspense>
+            </Route>
+          ))}
+
+          {adminRoutes.map(({ path, Component }) => (
+            <PrivateSuspenseRoute
+              exact
+              key={path}
+              path={path}
+              component={Component}
+              fallback={<Loading />}
+            />
+          ))}
+        </GraphDataProvider>
       </Switch>
     </Router>
   );