finally fix slow typescript compilation!

see https://github.com/stitchesjs/stitches/issues/1038

components/Captcha/Captcha.tsx

@@ -28,7 +28,7 @@ const Captcha = ({ size = "normal", theme, className, ...rest }: CaptchaProps) =
     <div className={className}>
       {hasMounted && (
         <HCaptcha
-          sitekey={process.env.NEXT_PUBLIC_HCAPTCHA_SITE_KEY}
+          sitekey={process.env.NEXT_PUBLIC_HCAPTCHA_SITE_KEY || ""}
           reCaptchaCompat={false}
           tabIndex={0}
           size={size}

components/ContactForm/ContactForm.tsx

@@ -142,7 +142,7 @@ export type ContactFormProps = {
 const ContactForm = ({ className }: ContactFormProps) => {
   // status/feedback:
   const [submitted, setSubmitted] = useState(false);
-  const [success, setSuccess] = useState(null);
+  const [success, setSuccess] = useState(false);
   const [feedback, setFeedback] = useState("");
 
   const handleSubmit = (values: Values, { setSubmitting }: FormikHelpers<Values>) => {
@@ -197,7 +197,7 @@ const ContactForm = ({ className }: ContactFormProps) => {
         "h-captcha-response": "",
       }}
       validate={(values: Values) => {
-        const errors: { name?: boolean; email?: boolean; message?: boolean; "h-captcha-response"?: boolean } = {};
+        const errors: Partial<Record<keyof Values, boolean>> = {};
 
         errors.name = !values.name;
         errors.email = !values.email; // also loosely validated that it's email-like via browser (not foolproof)
@@ -206,7 +206,7 @@ const ContactForm = ({ className }: ContactFormProps) => {
 
         if (!errors.name && !errors.email && !errors.message && !errors["h-captcha-response"]) {
           setFeedback("");
-          return null;
+          return {};
         } else {
           setSuccess(false);
           setFeedback("Please make sure that all fields are properly filled in.");
@@ -218,6 +218,7 @@ const ContactForm = ({ className }: ContactFormProps) => {
       {({ setFieldValue, isSubmitting }) => (
         <Form className={className} name="contact">
           <Field name="name">
+            {/* @ts-ignore */}
             {({ field, meta }) => (
               <Input
                 type="text"
@@ -230,6 +231,7 @@ const ContactForm = ({ className }: ContactFormProps) => {
           </Field>
 
           <Field name="email">
+            {/* @ts-ignore */}
             {({ field, meta }) => (
               <Input
                 type="email"
@@ -243,6 +245,7 @@ const ContactForm = ({ className }: ContactFormProps) => {
           </Field>
 
           <Field name="message">
+            {/* @ts-ignore */}
             {({ field, meta }) => (
               <TextArea
                 placeholder="Write something..."

components/Footer/Footer.tsx

@@ -96,7 +96,7 @@ const Footer = ({ ...rest }: FooterProps) => {
           <Link href="/previously/" prefetch={false} title="Previously on...">
             2001
           </Link>{" "}
-          – {new Date(process.env.NEXT_PUBLIC_RELEASE_DATE).getUTCFullYear()}.
+          – {new Date(process.env.NEXT_PUBLIC_RELEASE_DATE || Date.now()).getUTCFullYear()}.
         </div>
 
         <div>

components/Image/Image.tsx

@@ -20,10 +20,9 @@ const RoundedImage = styled(NextImage, {
   borderRadius: "$rounded",
 });
 
-export type ImageProps = NextImageProps &
-  ComponentProps<typeof RoundedImage> & {
-    href?: string; // optionally wrap image in a link
-  };
+export type ImageProps = ComponentProps<typeof RoundedImage> & {
+  href?: string; // optionally wrap image in a link
+};
 
 const Image = ({
   src,

components/Link/Link.tsx

@@ -2,7 +2,6 @@ import NextLink from "next/link";
 import { styled } from "../../lib/styles/stitches.config";
 import { baseUrl } from "../../lib/config";
 import type { ComponentProps } from "react";
-import type { LinkProps as NextLinkProps } from "next/link";
 
 const StyledLink = styled(NextLink, {
   color: "$link",
@@ -37,11 +36,9 @@ const StyledLink = styled(NextLink, {
   },
 });
 
-export type LinkProps = Omit<ComponentProps<typeof StyledLink>, "href"> &
-  NextLinkProps & {
-    underline?: boolean;
-    openInNewTab?: boolean;
-  };
+export type LinkProps = ComponentProps<typeof StyledLink> & {
+  openInNewTab?: boolean;
+};
 
 const Link = ({ href, rel, target, prefetch = false, underline = true, openInNewTab, ...rest }: LinkProps) => {
   // This component auto-detects whether or not this link should open in the same window (the default for internal

components/NoteMeta/NoteMeta.tsx

@@ -118,7 +118,7 @@ const NoteMeta = ({ slug, date, title, htmlTitle, tags = [] }: NoteMetaProps) =>
         )}
       </Wrapper>
 
-      <NoteTitle slug={slug} htmlTitle={htmlTitle || title} />
+      <NoteTitle {...{ slug, title, htmlTitle }} />
     </>
   );
 };

components/NoteTitle/NoteTitle.tsx

@@ -23,9 +23,9 @@ const Link = styled(NextLink, {
   textDecoration: "none",
 });
 
-export type NoteTitleProps = Pick<NoteFrontMatter, "slug" | "htmlTitle"> & ComponentProps<typeof Title>;
+export type NoteTitleProps = Pick<NoteFrontMatter, "slug" | "title" | "htmlTitle"> & ComponentProps<typeof Title>;
 
-const NoteTitle = ({ slug, htmlTitle, ...rest }: NoteTitleProps) => {
+const NoteTitle = ({ slug, title, htmlTitle, ...rest }: NoteTitleProps) => {
   return (
     <Title {...rest}>
       <Link
@@ -33,7 +33,7 @@ const NoteTitle = ({ slug, htmlTitle, ...rest }: NoteTitleProps) => {
           pathname: "/notes/[slug]/",
           query: { slug },
         }}
-        dangerouslySetInnerHTML={{ __html: htmlTitle }}
+        dangerouslySetInnerHTML={{ __html: htmlTitle || title }}
       />
     </Title>
   );

components/NotesList/NotesList.tsx

@@ -1,6 +1,7 @@
 import Link from "../Link";
 import Time from "../Time";
 import { styled } from "../../lib/styles/stitches.config";
+import type { ReactElement } from "react";
 import type { NoteFrontMatter } from "../../types";
 
 const Section = styled("section", {
@@ -54,18 +55,18 @@ const PostDate = styled(Time, {
 });
 
 export type NotesListProps = {
-  notesByYear: Record<string, NoteFrontMatter[]>;
+  notesByYear: { [key: string]: NoteFrontMatter[] };
 };
 
 const NotesList = ({ notesByYear }: NotesListProps) => {
-  const sections = [];
+  const sections: ReactElement[] = [];
 
   Object.entries(notesByYear).forEach(([year, notes]: [string, NoteFrontMatter[]]) => {
     sections.push(
       <Section key={year}>
         <Year>{year}</Year>
         <List>
-          {notes.map(({ slug, date, htmlTitle }) => (
+          {notes.map(({ slug, date, title, htmlTitle }) => (
             <Post key={slug}>
               <PostDate date={date} format="MMM D" />
               <span>
@@ -74,7 +75,7 @@ const NotesList = ({ notesByYear }: NotesListProps) => {
                     pathname: "/notes/[slug]/",
                     query: { slug },
                   }}
-                  dangerouslySetInnerHTML={{ __html: htmlTitle }}
+                  dangerouslySetInnerHTML={{ __html: htmlTitle || title }}
                 />
               </span>
             </Post>

components/RepositoryCard/RepositoryCard.tsx

@@ -96,7 +96,7 @@ const RepositoryCard = ({
           </MetaItem>
         )}
 
-        {stars > 0 && (
+        {stars && stars > 0 && (
           <MetaItem>
             <MetaLink
               href={`${url}/stargazers`}
@@ -110,7 +110,7 @@ const RepositoryCard = ({
           </MetaItem>
         )}
 
-        {forks > 0 && (
+        {forks && forks > 0 && (
           <MetaItem>
             <MetaLink
               href={`${url}/network/members`}

components/VNC/VNC.tsx

@@ -1,5 +1,6 @@
 import { useRef, useEffect, useState, memo } from "react";
 import { useRouter } from "next/router";
+// @ts-ignore
 import RFB from "@novnc/novnc/core/rfb.js";
 import Terminal from "../Terminal";
 import { styled } from "../../lib/styles/stitches.config";
@@ -54,7 +55,8 @@ const VNC = ({ server }: VNCProps) => {
   const [message, setMessage] = useState({ message: "", anyKey: false });
 
   // the actual connection and virtual screen (injected by noVNC when it's ready)
-  const rfbRef = useRef(null);
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  const rfbRef = useRef<any>(null);
   const screenRef = useRef<HTMLDivElement>(null);
 
   // ends the session forcefully