diff --git a/src/components/About/Github.tsx b/src/components/About/Github.tsx
index bc259a80..165d3d7a 100644
--- a/src/components/About/Github.tsx
+++ b/src/components/About/Github.tsx
@@ -1,16 +1,20 @@
-import React from "react";
+import React, { useState } from "react";
 import GitHubCalendar from "react-github-calendar";
 import { Row } from "react-bootstrap";
 import { githubUsername } from "../data";
+import { githubUsername } from "../data";
 
 function Github() {
+  const [newGitHubUsername, setNewGitHubUsername] = useState(
+    "validGitHubUsername",
+  );
   return (
     <Row style={{ justifyContent: "center", paddingBottom: "10px" }}>
       <h1 className="project-heading" style={{ paddingBottom: "20px" }}>
         Days I <strong className="purple">Code</strong>
       </h1>
       <GitHubCalendar
-        username={githubUsername}
+        username={"newGitHubUsername"}
         blockSize={15}
         blockMargin={5}
         colorScheme="dark"