Hide contrib, small copy updates

src/App.tsx

@@ -1,24 +1,24 @@
 import "./App.scss";
-import { QueryClient, QueryClientProvider } from "react-query";
-import { Contributions } from "./contributions/Contributions";
+// import { QueryClient, QueryClientProvider } from "react-query";
+// import { Contributions } from "./contributions/Contributions";
 import { History } from "./history/History";
 import { SelfTaught } from "./self-taught/SelfTaught";
 import { Stats } from "./stats/Stats";
 import { Hero } from "./hero/Hero";
 import { Footer } from "./footer/Footer";
 
-const queryClient = new QueryClient();
+// const queryClient = new QueryClient();
 
 function App() {
   return (
-    <QueryClientProvider client={queryClient}>
+    <>
       <Hero />
       <History />
       <SelfTaught />
       <Stats />
-      <Contributions />
+      {/* <Contributions /> */}
       <Footer />
-    </QueryClientProvider>
+    </>
   );
 }
 

src/hero/Hero.tsx

@@ -2,9 +2,16 @@ import { useState } from "react";
 import { address } from "../footer/Footer";
 import "./hero.scss";
 import waving from "./waving.png";
+import { jobs } from "../history/History";
+import { differenceInYears } from "date-fns";
 
 export function Hero() {
   const [showMore, setShowMore] = useState(false);
+  const [totalYrsExperience] = useState(() => {
+    const startDate = new Date(jobs[0].start);
+    const today = new Date();
+    return differenceInYears(today, startDate);
+  });
 
   return (
     <section className="hero">
@@ -26,8 +33,9 @@ export function Hero() {
         </a>
       </header>
       <p className="content">
-        I’m a curiosity-driven developer with over 8 years of experience. For
-        the last 5 years I've been working primarily with React and Typescript.{" "}
+        I’m a curiosity-driven developer with over {totalYrsExperience} years of
+        experience working full-stack. Lately I'm using Go, Postgres, K8s,
+        TypeScript.{" "}
         {showMore ? null : (
           <button
             className="link noprint"
@@ -60,8 +68,14 @@ export function Hero() {
         <p>
           I've got a strong background in the web fundamentals of HTML, CSS, and
           Javascript while having the wealth of experience of using React and
-          Typescript since nearly the beginning. Currently working remotely from
-          my home state of Arkansas.{" "}
+          Typescript since nearly the beginning.
+        </p>
+        <p>
+          These days I enjoy working full-stack building systems with a variety
+          of languages and tech such as Go, Typescript, Kafka, K8s, and more.
+        </p>
+        <p>
+          Currently working remotely from my home state of Arkansas.{" "}
           <button
             className="link noprint"
             tabIndex={showMore ? undefined : -1}