1
mirror of https://github.com/jakejarvis/jarv.is.git synced 2025-11-05 09:05:39 -05:00

refactor favicon imports

This commit is contained in:
2022-11-13 19:11:30 -05:00
parent c339b4df63
commit d4b806dfcf
7 changed files with 71 additions and 79 deletions

13
lib/config/favicons.ts Normal file
View File

@@ -0,0 +1,13 @@
// here we simply import some common image files and re-export them as StaticImageData.
// favicons
export { default as faviconIco } from "../../public/static/favicons/favicon.ico";
export { default as faviconPng } from "../../public/static/favicons/favicon.png";
export { default as appleTouchIconPng } from "../../public/static/favicons/apple-touch-icon.png";
export { default as chrome512Png } from "../../public/static/favicons/android-chrome-512x512.png";
export { default as chrome192Png } from "../../public/static/favicons/android-chrome-192x192.png";
export { default as maskable512Png } from "../../public/static/favicons/maskable-512x512.png";
export { default as maskable192Png } from "../../public/static/favicons/maskable-192x192.png";
// other
export { default as meJpg } from "../../public/static/images/me.jpg";

View File

@@ -1,17 +1,7 @@
import type { StaticImageData } from "next/image";
import type { DefaultSeoProps, SocialProfileJsonLdProps, ArticleJsonLdProps } from "next-seo"; import type { DefaultSeoProps, SocialProfileJsonLdProps, ArticleJsonLdProps } from "next-seo";
import * as config from "."; import * as config from ".";
import { meJpg, faviconPng, faviconIco, appleTouchIconPng } from "./favicons";
// favicons (some used here, some re-exported and used elsewhere)
import faviconIco from "../../public/static/favicons/favicon.ico";
import faviconPng from "../../public/static/favicons/favicon.png";
import appleTouchIconPng from "../../public/static/favicons/apple-touch-icon.png";
import chrome512Png from "../../public/static/favicons/android-chrome-512x512.png";
import chrome192Png from "../../public/static/favicons/android-chrome-192x192.png";
import maskable512Png from "../../public/static/favicons/maskable-512x512.png";
import maskable192Png from "../../public/static/favicons/maskable-192x192.png";
import meJpg from "../../public/static/images/me.jpg";
// Most of this file simply takes the data already defined in ./config.js and translates it into objects that are // Most of this file simply takes the data already defined in ./config.js and translates it into objects that are
// compatible with next-seo's props: // compatible with next-seo's props:
@@ -132,15 +122,3 @@ export const articleJsonLd: Pick<ArticleJsonLdProps, "authorName" | "publisherNa
publisherName: config.siteName, publisherName: config.siteName,
publisherLogo: `${config.baseUrl}${meJpg.src}`, publisherLogo: `${config.baseUrl}${meJpg.src}`,
}; };
// Re-export icons to use their static image data elsewhere
export const favicons: Record<string, StaticImageData> = {
faviconIco,
faviconPng,
appleTouchIconPng,
chrome512Png,
chrome192Png,
maskable512Png,
maskable192Png,
meJpg,
};

View File

@@ -1,8 +1,8 @@
import { Feed } from "feed"; import { Feed } from "feed";
import { getAllNotes } from "./parse-notes"; import { getAllNotes } from "./parse-notes";
import * as config from "../config"; import * as config from "../config";
import { meJpg } from "../config/favicons";
import { RELEASE_DATE } from "../config/constants"; import { RELEASE_DATE } from "../config/constants";
import { favicons } from "../config/seo";
import type { GetServerSideProps } from "next"; import type { GetServerSideProps } from "next";
export type GetServerSideFeedProps = GetServerSideProps<Record<string, never>>; export type GetServerSideFeedProps = GetServerSideProps<Record<string, never>>;
@@ -28,7 +28,7 @@ export const buildFeed = async (
description: config.longDescription, description: config.longDescription,
copyright: config.licenseUrl, copyright: config.licenseUrl,
updated: new Date(RELEASE_DATE), updated: new Date(RELEASE_DATE),
image: `${config.baseUrl}${favicons.meJpg.src}`, image: `${config.baseUrl}${meJpg.src}`,
feedLinks: { feedLinks: {
rss: `${config.baseUrl}/feed.xml`, rss: `${config.baseUrl}/feed.xml`,
atom: `${config.baseUrl}/feed.atom`, atom: `${config.baseUrl}/feed.atom`,

80
package-lock.json generated
View File

@@ -7,7 +7,7 @@
"name": "jarv.is", "name": "jarv.is",
"license": "(MIT AND CC-BY-4.0)", "license": "(MIT AND CC-BY-4.0)",
"dependencies": { "dependencies": {
"@giscus/react": "^2.2.2", "@giscus/react": "^2.2.3",
"@hcaptcha/react-hcaptcha": "^1.4.4", "@hcaptcha/react-hcaptcha": "^1.4.4",
"@next/font": "13.0.2", "@next/font": "13.0.2",
"@novnc/novnc": "github:novnc/novnc#cd94c2aed2582fd85ec5ecc444967fc7ec60a649", "@novnc/novnc": "github:novnc/novnc#cd94c2aed2582fd85ec5ecc444967fc7ec60a649",
@@ -20,7 +20,7 @@
"@sentry/tracing": "^7.19.0", "@sentry/tracing": "^7.19.0",
"@stitches/react": "^1.2.8", "@stitches/react": "^1.2.8",
"comma-number": "^2.1.0", "comma-number": "^2.1.0",
"copy-to-clipboard": "^3.3.2", "copy-to-clipboard": "^3.3.3",
"dayjs": "^1.11.6", "dayjs": "^1.11.6",
"fast-glob": "^3.2.12", "fast-glob": "^3.2.12",
"fathom-client": "^3.5.0", "fathom-client": "^3.5.0",
@@ -1916,11 +1916,11 @@
} }
}, },
"node_modules/@giscus/react": { "node_modules/@giscus/react": {
"version": "2.2.2", "version": "2.2.3",
"resolved": "https://registry.npmjs.org/@giscus/react/-/react-2.2.2.tgz", "resolved": "https://registry.npmjs.org/@giscus/react/-/react-2.2.3.tgz",
"integrity": "sha512-UXU2pzJEnsjEh36//UlqmWd7j3FJTGL7ijZIaijwbrsERtzkPkRhOkJ7eqRytCOdpcJSji3XX07/5rPGknmm3w==", "integrity": "sha512-zsu+ADvxR12PyGZBYMFxYfSQL1eefq/Wkh5g0Eg75BWBiaIT8jSFss4l0Xb2BLQpNAjZ5bzLfJcirz/dPQOkGQ==",
"dependencies": { "dependencies": {
"giscus": "^1.2.2" "giscus": "^1.2.3"
}, },
"peerDependencies": { "peerDependencies": {
"react": "^16 || ^17 || ^18", "react": "^16 || ^17 || ^18",
@@ -4016,17 +4016,17 @@
} }
}, },
"node_modules/copy-to-clipboard": { "node_modules/copy-to-clipboard": {
"version": "3.3.2", "version": "3.3.3",
"resolved": "https://registry.npmjs.org/copy-to-clipboard/-/copy-to-clipboard-3.3.2.tgz", "resolved": "https://registry.npmjs.org/copy-to-clipboard/-/copy-to-clipboard-3.3.3.tgz",
"integrity": "sha512-Vme1Z6RUDzrb6xAI7EZlVZ5uvOk2F//GaxKUxajDqm9LhOVM1inxNAD2vy+UZDYsd0uyA9s7b3/FVZPSxqrCfg==", "integrity": "sha512-2KV8NhB5JqC3ky0r9PMCAZKbUHSwtEo4CwCs0KXgruG43gX5PMqDEBbVU4OUzw2MuAWUfsuFmWvEKG5QRfSnJA==",
"dependencies": { "dependencies": {
"toggle-selection": "^1.0.6" "toggle-selection": "^1.0.6"
} }
}, },
"node_modules/core-js": { "node_modules/core-js": {
"version": "3.26.0", "version": "3.26.1",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-3.26.0.tgz", "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.26.1.tgz",
"integrity": "sha512-+DkDrhoR4Y0PxDz6rurahuB+I45OsEUv8E1maPTB6OuHRohMMcznBq9TMpdpDMm/hUPob/mJJS3PqgbHpMTQgw==", "integrity": "sha512-21491RRQVzUn0GGM9Z1Jrpr6PNPxPi+Za8OM9q4tksTSnlbXXGKK1nXNg/QvwFYettXvSX6zWKCtHHfjN4puyA==",
"hasInstallScript": true, "hasInstallScript": true,
"funding": { "funding": {
"type": "opencollective", "type": "opencollective",
@@ -4034,9 +4034,9 @@
} }
}, },
"node_modules/core-js-compat": { "node_modules/core-js-compat": {
"version": "3.26.0", "version": "3.26.1",
"resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.26.0.tgz", "resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.26.1.tgz",
"integrity": "sha512-piOX9Go+Z4f9ZiBFLnZ5VrOpBl0h7IGCkiFUN11QTe6LjAvOT3ifL/5TdoizMh99hcGy5SoLyWbapIY/PIb/3A==", "integrity": "sha512-622/KzTudvXCDLRw70iHW4KKs1aGpcRcowGWyYJr2DEBfRrd6hNJybxSWJFuZYD4ma86xhrwDDHxmDaIq4EA8A==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"browserslist": "^4.21.4" "browserslist": "^4.21.4"
@@ -4047,9 +4047,9 @@
} }
}, },
"node_modules/core-js-pure": { "node_modules/core-js-pure": {
"version": "3.26.0", "version": "3.26.1",
"resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.26.0.tgz", "resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.26.1.tgz",
"integrity": "sha512-LiN6fylpVBVwT8twhhluD9TzXmZQQsr2I2eIKtWNbZI1XMfBT7CV18itaN6RA7EtQd/SDdRx/wzvAShX2HvhQA==", "integrity": "sha512-VVXcDpp/xJ21KdULRq/lXdLzQAtX7+37LzpyfFM973il0tWSsDEoyzG38G14AjTpK9VTfiNM9jnFauq/CpaWGQ==",
"dev": true, "dev": true,
"hasInstallScript": true, "hasInstallScript": true,
"funding": { "funding": {
@@ -5607,9 +5607,9 @@
} }
}, },
"node_modules/giscus": { "node_modules/giscus": {
"version": "1.2.2", "version": "1.2.3",
"resolved": "https://registry.npmjs.org/giscus/-/giscus-1.2.2.tgz", "resolved": "https://registry.npmjs.org/giscus/-/giscus-1.2.3.tgz",
"integrity": "sha512-H71M3V5K/mmWr5/OwCMCH+s7Z2wVT6uQ1AXe5B0f0jjAGvJ9unAklfp4cNJU5zamjDdMZFVFi/9xhhbHIG3ZTQ==", "integrity": "sha512-1sYu6B3cUzPVZHH93f1DX5PJHf5ak2bPp8N1xZrAPxqccN7C/R6r93usllmCVESJ8cvnyYUaNVyXzOYz9B6OxQ==",
"dependencies": { "dependencies": {
"lit": "^2.4.1" "lit": "^2.4.1"
} }
@@ -12799,11 +12799,11 @@
} }
}, },
"@giscus/react": { "@giscus/react": {
"version": "2.2.2", "version": "2.2.3",
"resolved": "https://registry.npmjs.org/@giscus/react/-/react-2.2.2.tgz", "resolved": "https://registry.npmjs.org/@giscus/react/-/react-2.2.3.tgz",
"integrity": "sha512-UXU2pzJEnsjEh36//UlqmWd7j3FJTGL7ijZIaijwbrsERtzkPkRhOkJ7eqRytCOdpcJSji3XX07/5rPGknmm3w==", "integrity": "sha512-zsu+ADvxR12PyGZBYMFxYfSQL1eefq/Wkh5g0Eg75BWBiaIT8jSFss4l0Xb2BLQpNAjZ5bzLfJcirz/dPQOkGQ==",
"requires": { "requires": {
"giscus": "^1.2.2" "giscus": "^1.2.3"
} }
}, },
"@hcaptcha/react-hcaptcha": { "@hcaptcha/react-hcaptcha": {
@@ -14223,31 +14223,31 @@
"integrity": "sha512-aSWTXFzaKWkvHO1Ny/s+ePFpvKsPnjc551iI41v3ny/ow6tBG5Vd+FuqGNhh1LxOmVzOlGUriIlOaokOvhaStA==" "integrity": "sha512-aSWTXFzaKWkvHO1Ny/s+ePFpvKsPnjc551iI41v3ny/ow6tBG5Vd+FuqGNhh1LxOmVzOlGUriIlOaokOvhaStA=="
}, },
"copy-to-clipboard": { "copy-to-clipboard": {
"version": "3.3.2", "version": "3.3.3",
"resolved": "https://registry.npmjs.org/copy-to-clipboard/-/copy-to-clipboard-3.3.2.tgz", "resolved": "https://registry.npmjs.org/copy-to-clipboard/-/copy-to-clipboard-3.3.3.tgz",
"integrity": "sha512-Vme1Z6RUDzrb6xAI7EZlVZ5uvOk2F//GaxKUxajDqm9LhOVM1inxNAD2vy+UZDYsd0uyA9s7b3/FVZPSxqrCfg==", "integrity": "sha512-2KV8NhB5JqC3ky0r9PMCAZKbUHSwtEo4CwCs0KXgruG43gX5PMqDEBbVU4OUzw2MuAWUfsuFmWvEKG5QRfSnJA==",
"requires": { "requires": {
"toggle-selection": "^1.0.6" "toggle-selection": "^1.0.6"
} }
}, },
"core-js": { "core-js": {
"version": "3.26.0", "version": "3.26.1",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-3.26.0.tgz", "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.26.1.tgz",
"integrity": "sha512-+DkDrhoR4Y0PxDz6rurahuB+I45OsEUv8E1maPTB6OuHRohMMcznBq9TMpdpDMm/hUPob/mJJS3PqgbHpMTQgw==" "integrity": "sha512-21491RRQVzUn0GGM9Z1Jrpr6PNPxPi+Za8OM9q4tksTSnlbXXGKK1nXNg/QvwFYettXvSX6zWKCtHHfjN4puyA=="
}, },
"core-js-compat": { "core-js-compat": {
"version": "3.26.0", "version": "3.26.1",
"resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.26.0.tgz", "resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.26.1.tgz",
"integrity": "sha512-piOX9Go+Z4f9ZiBFLnZ5VrOpBl0h7IGCkiFUN11QTe6LjAvOT3ifL/5TdoizMh99hcGy5SoLyWbapIY/PIb/3A==", "integrity": "sha512-622/KzTudvXCDLRw70iHW4KKs1aGpcRcowGWyYJr2DEBfRrd6hNJybxSWJFuZYD4ma86xhrwDDHxmDaIq4EA8A==",
"dev": true, "dev": true,
"requires": { "requires": {
"browserslist": "^4.21.4" "browserslist": "^4.21.4"
} }
}, },
"core-js-pure": { "core-js-pure": {
"version": "3.26.0", "version": "3.26.1",
"resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.26.0.tgz", "resolved": "https://registry.npmjs.org/core-js-pure/-/core-js-pure-3.26.1.tgz",
"integrity": "sha512-LiN6fylpVBVwT8twhhluD9TzXmZQQsr2I2eIKtWNbZI1XMfBT7CV18itaN6RA7EtQd/SDdRx/wzvAShX2HvhQA==", "integrity": "sha512-VVXcDpp/xJ21KdULRq/lXdLzQAtX7+37LzpyfFM973il0tWSsDEoyzG38G14AjTpK9VTfiNM9jnFauq/CpaWGQ==",
"dev": true "dev": true
}, },
"cosmiconfig": { "cosmiconfig": {
@@ -15394,9 +15394,9 @@
} }
}, },
"giscus": { "giscus": {
"version": "1.2.2", "version": "1.2.3",
"resolved": "https://registry.npmjs.org/giscus/-/giscus-1.2.2.tgz", "resolved": "https://registry.npmjs.org/giscus/-/giscus-1.2.3.tgz",
"integrity": "sha512-H71M3V5K/mmWr5/OwCMCH+s7Z2wVT6uQ1AXe5B0f0jjAGvJ9unAklfp4cNJU5zamjDdMZFVFi/9xhhbHIG3ZTQ==", "integrity": "sha512-1sYu6B3cUzPVZHH93f1DX5PJHf5ak2bPp8N1xZrAPxqccN7C/R6r93usllmCVESJ8cvnyYUaNVyXzOYz9B6OxQ==",
"requires": { "requires": {
"lit": "^2.4.1" "lit": "^2.4.1"
} }

View File

@@ -17,7 +17,7 @@
"lint": "eslint . --ext js,jsx,ts,tsx,md,mdx" "lint": "eslint . --ext js,jsx,ts,tsx,md,mdx"
}, },
"dependencies": { "dependencies": {
"@giscus/react": "^2.2.2", "@giscus/react": "^2.2.3",
"@hcaptcha/react-hcaptcha": "^1.4.4", "@hcaptcha/react-hcaptcha": "^1.4.4",
"@next/font": "13.0.2", "@next/font": "13.0.2",
"@novnc/novnc": "github:novnc/novnc#cd94c2aed2582fd85ec5ecc444967fc7ec60a649", "@novnc/novnc": "github:novnc/novnc#cd94c2aed2582fd85ec5ecc444967fc7ec60a649",
@@ -30,7 +30,7 @@
"@sentry/tracing": "^7.19.0", "@sentry/tracing": "^7.19.0",
"@stitches/react": "^1.2.8", "@stitches/react": "^1.2.8",
"comma-number": "^2.1.0", "comma-number": "^2.1.0",
"copy-to-clipboard": "^3.3.2", "copy-to-clipboard": "^3.3.3",
"dayjs": "^1.11.6", "dayjs": "^1.11.6",
"fast-glob": "^3.2.12", "fast-glob": "^3.2.12",
"fathom-client": "^3.5.0", "fathom-client": "^3.5.0",

View File

@@ -8,7 +8,8 @@ import * as mdxComponents from "../../lib/helpers/mdx-components";
import { getNoteSlugs } from "../../lib/helpers/parse-notes"; import { getNoteSlugs } from "../../lib/helpers/parse-notes";
import { compileNote } from "../../lib/helpers/compile-note"; import { compileNote } from "../../lib/helpers/compile-note";
import * as config from "../../lib/config"; import * as config from "../../lib/config";
import { articleJsonLd, favicons } from "../../lib/config/seo"; import { articleJsonLd } from "../../lib/config/seo";
import { meJpg } from "../../lib/config/favicons";
import type { GetStaticProps, GetStaticPaths, InferGetStaticPropsType } from "next"; import type { GetStaticProps, GetStaticPaths, InferGetStaticPropsType } from "next";
import type { NoteWithSource, NoteFrontMatter } from "../../types"; import type { NoteWithSource, NoteFrontMatter } from "../../types";
@@ -31,7 +32,7 @@ const Note = ({ frontMatter, source }: InferGetStaticPropsType<typeof getStaticP
}, },
images: [ images: [
{ {
url: `${config.baseUrl}${frontMatter.image || favicons.meJpg.src}`, url: `${config.baseUrl}${frontMatter.image || meJpg.src}`,
alt: frontMatter.title, alt: frontMatter.title,
}, },
], ],
@@ -46,7 +47,7 @@ const Note = ({ frontMatter, source }: InferGetStaticPropsType<typeof getStaticP
description={frontMatter.description || config.longDescription} description={frontMatter.description || config.longDescription}
datePublished={frontMatter.date} datePublished={frontMatter.date}
dateModified={frontMatter.date} dateModified={frontMatter.date}
images={[`${config.baseUrl}${frontMatter.image || favicons.meJpg.src}`]} images={[`${config.baseUrl}${frontMatter.image || meJpg.src}`]}
{...articleJsonLd} {...articleJsonLd}
/> />

View File

@@ -1,5 +1,5 @@
import * as config from "../lib/config"; import * as config from "../lib/config";
import { favicons } from "../lib/config/seo"; import { chrome512Png, chrome192Png, maskable512Png, maskable192Png } from "../lib/config/favicons";
import type { GetServerSideProps } from "next"; import type { GetServerSideProps } from "next";
export const getServerSideProps: GetServerSideProps<Record<string, never>> = async (context) => { export const getServerSideProps: GetServerSideProps<Record<string, never>> = async (context) => {
@@ -17,26 +17,26 @@ export const getServerSideProps: GetServerSideProps<Record<string, never>> = asy
lang: config.siteLocale, lang: config.siteLocale,
icons: [ icons: [
{ {
src: favicons.chrome512Png.src, src: chrome512Png.src,
sizes: `${favicons.chrome512Png.width}x${favicons.chrome512Png.height}`, sizes: `${chrome512Png.width}x${chrome512Png.height}`,
type: "image/png", type: "image/png",
purpose: "any", purpose: "any",
}, },
{ {
src: favicons.chrome192Png.src, src: chrome192Png.src,
sizes: `${favicons.chrome192Png.width}x${favicons.chrome192Png.height}`, sizes: `${chrome192Png.width}x${chrome192Png.height}`,
type: "image/png", type: "image/png",
purpose: "any", purpose: "any",
}, },
{ {
src: favicons.maskable512Png.src, src: maskable512Png.src,
sizes: `${favicons.maskable512Png.width}x${favicons.maskable512Png.height}`, sizes: `${maskable512Png.width}x${maskable512Png.height}`,
type: "image/png", type: "image/png",
purpose: "maskable", purpose: "maskable",
}, },
{ {
src: favicons.maskable192Png.src, src: maskable192Png.src,
sizes: `${favicons.maskable192Png.width}x${favicons.maskable192Png.height}`, sizes: `${maskable192Png.width}x${maskable192Png.height}`,
type: "image/png", type: "image/png",
purpose: "maskable", purpose: "maskable",
}, },