jake/jarv.is
1
Fork 0
mirror of https://github.com/jakejarvis/jarv.is.git synced 2025-09-16 19:45:33 -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(() => { useEffect(() => {
// reset to original icon after given ms (defaults to 2 seconds) if (!copied) {
if (copied) { return;
const reset = setTimeout(() => {
setCopied(false);
}, timeout);
return () => clearTimeout(reset);
} }
// eslint-disable-next-line @typescript-eslint/no-empty-function // reset to original icon after given ms (defaults to 2 seconds)
return () => {}; const reset = setTimeout(() => {
setCopied(false);
}, timeout);
// cancel timeout to avoid memory leaks if unmounted in the middle of this
return () => clearTimeout(reset);
}, [timeout, copied]); }, [timeout, copied]);
return ( return (

7
components/Menu/Menu.tsx
View File

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

29
pages/_app.tsx
View File

@@ -1,5 +1,6 @@
import { useEffect } from "react"; import { useEffect } from "react";
import { useRouter } from "next/router"; import { useRouter } from "next/router";
import Head from "next/head";
import { DefaultSeo, SocialProfileJsonLd } from "next-seo"; import { DefaultSeo, SocialProfileJsonLd } from "next-seo";
import * as Fathom from "fathom-client"; import * as Fathom from "fathom-client";
import urlJoin from "url-join"; import urlJoin from "url-join";
@@ -8,7 +9,7 @@ import Layout from "../components/Layout";
import * as config from "../lib/config"; import * as config from "../lib/config";
import { defaultSeo, socialProfileJsonLd } from "../lib/config/seo"; import { defaultSeo, socialProfileJsonLd } from "../lib/config/seo";
import { themeClassNames } from "../lib/config/themes"; 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"; import type { AppProps as NextAppProps } from "next/app";
// https://nextjs.org/docs/basic-features/layouts#with-typescript // https://nextjs.org/docs/basic-features/layouts#with-typescript
@@ -46,7 +47,7 @@ const App = ({ Component, pageProps }: NextAppProps) => {
globalStyles(); globalStyles();
return ( return (
<ThemeProvider classNames={themeClassNames}> <>
{/* all SEO config is in ../lib/config/seo.ts except for canonical URLs, which require access to next router */} {/* all SEO config is in ../lib/config/seo.ts except for canonical URLs, which require access to next router */}
<DefaultSeo <DefaultSeo
{...defaultSeo} {...defaultSeo}
@@ -61,10 +62,26 @@ const App = ({ Component, pageProps }: NextAppProps) => {
/> />
<SocialProfileJsonLd {...socialProfileJsonLd} /> <SocialProfileJsonLd {...socialProfileJsonLd} />
<Layout> {/* preload highest priority fonts defined in ../lib/styles/fonts/ */}
<Component {...pageProps} /> <Head>
</Layout> {preloadUrls.map((relativeUrl, index) => (
</ThemeProvider> <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 { Html, Head, Main, NextScript } from "next/document";
import ThemeScript from "../components/ThemeScript/ThemeScript"; 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"; import * as config from "../lib/config";
// https://nextjs.org/docs/advanced-features/custom-document // 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 */} {/* inject a small script to set/restore the user's theme ASAP */}
<ThemeScript /> <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 */} {/* stitches SSR: https://stitches.dev/blog/using-nextjs-with-stitches#step-3-ssr */}
<style id="stitches" dangerouslySetInnerHTML={{ __html: getCssText() }} /> <style id="stitches" dangerouslySetInnerHTML={{ __html: getCssText() }} />
</Head> </Head>