Merge pull request #14 from jerboa88/2-rewrite-in-typescript

2 rewrite in typescript

Author: jerboa88

.vscode/settings.json

@@ -0,0 +1,6 @@
+{
+	"typescript.tsdk": "node_modules/typescript/lib",
+	"editor.codeActionsOnSave": {
+		"source.organizeImports.biome": "explicit"
+	}
+}

README.md

@@ -263,11 +263,30 @@ These options must be passed to the `createImage()` function.
 ## Contributing
 Contributions, issues, and forks are welcome. [SemVer](http://semver.org/) is used for versioning.
 
+This project is written in [TypeScript] so files in the `src/` directory need to be built when you make changes. Compiled JavaScript files can be found in the `dist/` directory.
+
+### Commands
+#### Build
+```sh
+npm run build
+```
+
+#### Build and watch for changes
+```sh
+npm run watch
+```
+
+#### Clean the build directory
+```sh
+npm run clean
+```
+
 
 ## License
 This project is licensed under the MIT License. See [LICENSE](LICENSE) for details. This project includes various resources which carry their own copyright notices and license terms. See [LICENSE-THIRD-PARTY.md](LICENSE-THIRD-PARTY.md) for more details.
 
 
+[Typescript]: https://www.typescriptlang.org/
 [Puppeteer]: https://pptr.dev/
 [vercel/satori]: https://github.com/vercel/satori
 [gatsby-plugin-open-graph-images]: https://github.com/squer-solutions/gatsby-plugin-open-graph-images/

gatsby-node.js

@@ -1,33 +1,2 @@
-const { setReporter, info } = require('./src/logger');
-const {
-	setGatsbyCreatePageFunction,
-	setDefaultOptions,
-} = require('./src/config');
-const { generateImages } = require('./src/generator');
-const { setJoi, getPluginOptionsSchema } = require('./src/validator');
-const { prettify } = require('./src/utilities');
-
-// Save the reporter and createPage function for later use
-exports.onPluginInit = async ({ reporter, actions: { createPage } }) => {
-	setReporter(reporter);
-	setGatsbyCreatePageFunction(createPage);
-};
-
-// Save Joi for later and return the schema for plugin options validation by Gatsby
-exports.pluginOptionsSchema = ({ Joi }) => {
-	setJoi(Joi);
-
-	return getPluginOptionsSchema();
-};
-
-// Get plugin options from gatsby-config.js and set default options
-exports.onPreBootstrap = async (_, pluginOptions) => {
-	const defaultOptions = setDefaultOptions(pluginOptions);
-
-	info(`Default options set to:\n${prettify(defaultOptions)}`);
-};
-
-// Generate images after pages have been built
-exports.onPostBuild = async () => {
-	await generateImages();
-};
+// Proxy to the dist/gatsby-node.js file
+module.exports = require('./dist/gatsby-node');

package.json

@@ -22,7 +22,12 @@
 		"pdf-generation"
 	],
 	"license": "MIT",
-	"main": "./index.js",
+	"main": "dist/index.js",
+	"types": "dist/index.d.ts",
+	"files": [
+		"/dist",
+		"gatsby-node.js"
+	],
 	"homepage": "https://github.com/jerboa88/gatsby-plugin-component-to-image",
 	"repository": {
 		"type": "git",
@@ -31,11 +36,28 @@
 	"bugs": {
 		"url": "https://github.com/jerboa88/gatsby-plugin-component-to-image/issues"
 	},
+	"scripts": {
+		"build": "tsc",
+		"watch": "tsc --watch",
+		"clean": "tsc --build --clean",
+		"prepare": "npm run build"
+	},
+	"peerDependencies": {
+		"gatsby": "^5.0.0-next"
+	},
 	"dependencies": {
 		"express": "^4.19.2",
 		"puppeteer": "^22.9.0"
 	},
 	"devDependencies": {
-		"@biomejs/biome": "1.7.3"
+		"@biomejs/biome": "1.7.3",
+		"@tsconfig/node20": "^20.1.4",
+		"@types/express": "^4.17.21",
+		"gatsby": "^5.0.0-next",
+		"gatsby-plugin-utils": "^4.0.0",
+		"typescript": "^5.4.5"
+	},
+	"engines": {
+		"node": ">=20.0.0"
 	}
 }

src/config.js

@@ -0,0 +1,51 @@
+import type { Actions } from 'gatsby';
+import type { DefaultOptions, JobOptions } from './types';
+import { validateDefaultOptions } from './validator';
+
+const jobQueue: JobOptions[] = [];
+
+let gatsbyCreatePageFunction: Actions['createPage'];
+let defaultOptions: DefaultOptions = {
+	verbose: false,
+	component: undefined,
+	context: {},
+	size: {
+		width: 1200,
+		height: 630,
+	},
+	type: 'png',
+	quality: undefined,
+	optimizeForSpeed: false,
+};
+
+export function getDefaultOptions() {
+	return defaultOptions;
+}
+
+export function setDefaultOptions(
+	newDefaultOptions: Partial<DefaultOptions>,
+): DefaultOptions {
+	defaultOptions = validateDefaultOptions(newDefaultOptions, defaultOptions);
+
+	return defaultOptions;
+}
+
+export function addJob(job: JobOptions) {
+	jobQueue.push(job);
+}
+
+export function getAllJobs() {
+	return jobQueue;
+}
+
+// Store the Gatsby createPage function to use later
+export function setGatsbyCreatePageFunction(
+	newGatsbyCreatePageFunction: Actions['createPage'],
+) {
+	gatsbyCreatePageFunction = newGatsbyCreatePageFunction;
+}
+
+// Call the Gatsby createPage function
+export function createPage(...args: Parameters<Actions['createPage']>) {
+	return gatsbyCreatePageFunction(...args);
+}

src/config.ts

@@ -0,0 +1,43 @@
+import type { GatsbyNode } from 'gatsby';
+import { setDefaultOptions, setGatsbyCreatePageFunction } from './config';
+import { generateImages } from './generator';
+import { info, setReporter } from './logger';
+import type { DefaultOptions } from './types';
+import { prettify } from './utilities';
+import { getPluginOptionsSchema, setJoi } from './validator';
+
+// Save the reporter and createPage function for later use
+export const onPluginInit: GatsbyNode['onPluginInit'] = async ({
+	reporter,
+	actions: { createPage },
+}) => {
+	setReporter(reporter);
+	setGatsbyCreatePageFunction(createPage);
+};
+
+// Save Joi for later and return the schema for plugin options validation by Gatsby
+export const pluginOptionsSchema: GatsbyNode['pluginOptionsSchema'] = ({
+	Joi,
+}) => {
+	setJoi(Joi);
+
+	return getPluginOptionsSchema();
+};
+
+// Get plugin options from gatsby-config.js and set default options
+export const onPreBootstrap: GatsbyNode['onPreBootstrap'] = async (
+	_,
+	pluginOptions,
+) => {
+	// PluginOptions should be a superset of DefaultOptions
+	const defaultOptions = setDefaultOptions(
+		pluginOptions as unknown as Partial<DefaultOptions>,
+	);
+
+	info(`Default options set to:\n${prettify(defaultOptions)}`);
+};
+
+// Generate images after pages have been built
+export const onPostBuild: GatsbyNode['onPostBuild'] = async () => {
+	await generateImages();
+};