jake/jarv.is
1
Fork 0
mirror of https://github.com/jakejarvis/jarv.is.git synced 2025-07-01 04:26:37 -04:00
Code Issues Activity

random organization

Browse Source
This commit is contained in:
Jake Jarvis
2022-04-28 19:28:16 -04:00
parent 9e8c3eaa67
commit 383c88d5ef
5 changed files with 39 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
components/CopyButton/CopyButton.tsx
View File

@ -56,17 +56,17 @@ const CopyButton = forwardRef(function CopyButton(
};
useEffect(() => {
// reset to original icon after given ms (defaults to 2 seconds)
if (copied) {
const reset = setTimeout(() => {
setCopied(false);
}, timeout);
return () => clearTimeout(reset);
if (!copied) {
return;
}
// eslint-disable-next-line @typescript-eslint/no-empty-function
return () => {};
// reset to original icon after given ms (defaults to 2 seconds)
const reset = setTimeout(() => {
setCopied(false);
}, timeout);
// cancel timeout to avoid memory leaks if unmounted in the middle of this
return () => clearTimeout(reset);
}, [timeout, copied]);
return (

7
components/Menu/Menu.tsx
View File

@ -1,6 +1,7 @@
import { memo } from "react";
import { useRouter } from "next/router";
import MenuItem from "../MenuItem";
import ThemeToggle from "../ThemeToggle";
import { styled } from "../../lib/styles/stitches.config";
import { menuItems } from "../../lib/config/menu";
import type { ComponentProps } from "react";
@ -22,9 +23,9 @@ const Wrapper = styled("ul", {
});
const Item = styled("li", {
listStyle: "none",
display: "inline-block",
marginLeft: "1em",
listStyle: "none",
"@medium": {
marginLeft: 0,
@ -51,6 +52,10 @@ const Menu = ({ ...rest }: MenuProps) => {
<MenuItem {...item} current={item.href === `/${router.pathname.split("/")[1]}`} />
</Item>
))}
<Item>
<MenuItem icon={ThemeToggle} />
</Item>
</Wrapper>
);
};

4
lib/config/menu.ts
View File

@ -1,4 +1,3 @@
import ThemeToggle from "../../components/ThemeToggle";
import { HomeIcon, NotesIcon, ProjectsIcon, ContactIcon } from "../../components/Icons";
import type { MenuItemProps } from "../../components/MenuItem";
@ -23,7 +22,4 @@ export const menuItems: MenuItemProps[] = [
text: "Contact",
href: "/contact",
},
{
icon: ThemeToggle,
},
];

29
pages/_app.tsx
View File

@ -1,5 +1,6 @@
import { useEffect } from "react";
import { useRouter } from "next/router";
import Head from "next/head";
import { DefaultSeo, SocialProfileJsonLd } from "next-seo";
import * as Fathom from "fathom-client";
import urlJoin from "url-join";
@ -8,7 +9,7 @@ import Layout from "../components/Layout";
import * as config from "../lib/config";
import { defaultSeo, socialProfileJsonLd } from "../lib/config/seo";
import { themeClassNames } from "../lib/config/themes";
import { globalStyles } from "../lib/styles/stitches.config";
import { globalStyles, preloadUrls } from "../lib/styles/stitches.config";
import type { AppProps as NextAppProps } from "next/app";
// https://nextjs.org/docs/basic-features/layouts#with-typescript
@ -46,7 +47,7 @@ const App = ({ Component, pageProps }: NextAppProps) => {
globalStyles();
return (
<ThemeProvider classNames={themeClassNames}>
<>
{/* all SEO config is in ../lib/config/seo.ts except for canonical URLs, which require access to next router */}
<DefaultSeo
{...defaultSeo}
@ -61,10 +62,26 @@ const App = ({ Component, pageProps }: NextAppProps) => {
/>
<SocialProfileJsonLd {...socialProfileJsonLd} />
<Layout>
<Component {...pageProps} />
</Layout>
</ThemeProvider>
{/* preload highest priority fonts defined in ../lib/styles/fonts/ */}
<Head>
{preloadUrls.map((relativeUrl, index) => (
<link
key={`font-${index}`}
rel="preload"
as="font"
type="font/woff2"
href={relativeUrl}
crossOrigin="anonymous"
/>
))}
</Head>
<ThemeProvider classNames={themeClassNames}>
<Layout>
<Component {...pageProps} />
</Layout>
</ThemeProvider>
</>
);
};

14
pages/_document.tsx
View File

@ -1,6 +1,6 @@
import { Html, Head, Main, NextScript } from "next/document";
import ThemeScript from "../components/ThemeScript/ThemeScript";
import { getCssText, preloadUrls } from "../lib/styles/stitches.config";
import { getCssText } from "../lib/styles/stitches.config";
import * as config from "../lib/config";
// https://nextjs.org/docs/advanced-features/custom-document
@ -11,18 +11,6 @@ const Document = () => {
{/* inject a small script to set/restore the user's theme ASAP */}
<ThemeScript />
{/* preload highest priority fonts defined in ../lib/styles/fonts/ */}
{preloadUrls.map((relativeUrl, index) => (
<link
key={`font-${index}`}
rel="preload"
as="font"
type="font/woff2"
href={relativeUrl}
crossOrigin="anonymous"
/>
))}
{/* stitches SSR: https://stitches.dev/blog/using-nextjs-with-stitches#step-3-ssr */}
<style id="stitches" dangerouslySetInnerHTML={{ __html: getCssText() }} />
</Head>