From bddd9a0c0eaf2120d1028a3ad6cc97aa7be953f4 Mon Sep 17 00:00:00 2001 From: Emily <107147744+emarsh1995@users.noreply.github.com> Date: Thu, 18 Dec 2025 17:09:34 -0800 Subject: [PATCH 01/13] Update some READMEs --- README.md | 37 +++++++++++++++++++++++----- astro-alt-text-toolkit/README.md | 8 +++--- astro-ao3-loader/README.md | 42 +++++++++++++++++++++++++------- 3 files changed, 69 insertions(+), 18 deletions(-) diff --git a/README.md b/README.md index 6f362df..e42bed3 100644 --- a/README.md +++ b/README.md @@ -1,10 +1,35 @@ # FujoCoded Plugins -A repository of plugins for true webdev fujin. Includes plugins for: +
-- Remark -- Rehype -- Zod -- Astro + -You can learn about each plugin by looking at the `README.md` file within their directories. +A repository of plugins for true webdev fujin. + + + + Fandom Coders badge + +
+ +## What is `fujocoded-plugins`? + +This repo includes a collection of plugins for [remark](https://remark.js.org/), [rehype](https://github.com/rehypejs/rehype), [Zod](https://zod.dev/), and [Astro](https://astro.build/). + +You can learn more about each plugin by looking at the `README.md` file in its directory. + +- [`astro-alt-text-toolkit`](/astro-alt-text-toolkit/README.md) - (WIP) Makes it easier to manage alt text on your Astro site, and beyond. +- [`astro-ao3-loader`](/astro-ao3-loader/README.md) - Uses [AO3.js](https://github.com/fujowebdev/ao3.js) to load data from AO3 to your Astro site. +- [`astro-authproto`](/astro-authproto/README.md) - Adds ATproto authentication to your Astro site. +- [`astro-dev-only`](/astro-dev-only/README.md) - Renders pages to your Astro site when you build it locally, and removes them from the final build. +- [`astro-rehype-html-headings`](/astro-rehype-html-headings/README.md) - Returns Astro headings from an `.md` or `.mdx` file with a list of their HTML properties. +- [`astro-remark-collect-components`](/astro-remark-collect-components/README.md) - Adds a list of attributes from Astro components to the `remarkFrontmatter` property for later use. +- [`astro-smooth-actions`](/astro-smooth-actions/README.md) - Makes Astro Action smoother by persisting form action results in the session. +- [`expressive-code-caption`](/expressive-code-caption/README.md) - Allows adding captions to [`expressive-code`](https://github.com/expressive-code/expressive-code) code blocks. +- [`expressive-code-output`](/expressive-code-output/README.md) - Allows separating code in [`expressive-code`](https://github.com/expressive-code/expressive-code) code blocks from the output. +- [`rehype-code-params`](/rehype-code-params/README.md) - Styles param values in inline code. +- [`remark-alt-text-files`](/remark-alt-text-files/README.md) - Allows loading alt text from a file. +- [`remark-capitalize-titles`](/remark-capitalize-titles/README.md) - Transforms all Markdown titles using [title.sh](https://github.com/zeit/title). +- [`remark-excalidraw`](/remark-excalidraw/README.md) - Allows loading [Excalidraw](https://github.com/excalidraw/excalidraw) files in Markdown. +- [`remark-jsx-auto-slug`](/remark-jsx-auto-slug/README.md) - Automatically adds slugs to Astro components. +- [`zod-transform-socials`](/zod-transform-socials/README.md) - Applies a Zod transformation to a list of social contacts to surface the appropriate website, username, and icon name. diff --git a/astro-alt-text-toolkit/README.md b/astro-alt-text-toolkit/README.md index 551670d..cf4f9e5 100644 --- a/astro-alt-text-toolkit/README.md +++ b/astro-alt-text-toolkit/README.md @@ -1,4 +1,6 @@ -# @fujocoded/astro-alt-text-toolkit +# `@fujocoded/astro-alt-text-toolkit` -A WIP bundle of ALT text utilities to make the ALT text of your -Astro site (and beyond) easier to manage +> [!WARNING] +> This plugin is a work in progress. + +A bundle of utilities that make the alt text of your Astro site (and beyond) easier to manage. diff --git a/astro-ao3-loader/README.md b/astro-ao3-loader/README.md index 8807d09..55677df 100644 --- a/astro-ao3-loader/README.md +++ b/astro-ao3-loader/README.md @@ -1,16 +1,40 @@ -# Astro AO3 loader +# `@fujocoded/astro-ao3-loader` + +
+ +Load data from Archive of Our Own to your Astro site. + + + + NPM license + + + Gitpod Ready-to-Code + + + Fandom Coders badge + + + +![npm version](https://badge.fury.io/js/%40fujocoded%2Fastro-ao3-loader.svg) + + +
+ +## What is `@fujocoded/astro-ao3-loader`? > [!WARNING] -> This is an experimental library with only basic functionality. If you -> want to help us expand it, contact us via GitHub, Fandom Coders, or at -> contacts@fujocoded.com. +> This is an experimental library with only basic functionality. If you want to help us expand it, you can reach out via GitHub, Fandom Coders, or contacts@fujocoded.com. > -> If you've never joined an open source project before, this is an excellent -> first place to contribute! +> If you've never joined an open source project before, this is an excellent first place to contribute! + +This plugin uses the experimental content layer and [AO3.js](https://github.com/fujowebdev/ao3.js) to load data from [Archive of Our Own](https://archiveofourown.org/) to your [Astro](https://astro.build/) website. + +## What can `@fujocoded/astro-ao3-loader` do? -A AO3 data loader for Astro using the experimental content layer and -[AO3.js](https://github.com/fujowebdev/ao3.js) to load data from AO3 to your -Astro website. +| **Method** | **Description** | **Parameters** | **Return Type** | +| ---------- | --------------- | -------------- | --------------- | +| `getNextFicGroupFetcher` | Retrieves a group of works from AO3. | `{ workIds: string[], logger: LoaderContext["logger"] }` - A list of work IDs | | You can see an example of its usage [in our sample repository](https://github.com/FujoWebDev/ao3-content-layer-example). From 1d73dc9c68c5575ed089bc76c0d9ffe553b728b7 Mon Sep 17 00:00:00 2001 From: Emily <107147744+emarsh1995@users.noreply.github.com> Date: Sun, 28 Dec 2025 11:15:57 -0500 Subject: [PATCH 02/13] Look ma I'm learning TS --- astro-ao3-loader/README.md | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/astro-ao3-loader/README.md b/astro-ao3-loader/README.md index 55677df..b5202db 100644 --- a/astro-ao3-loader/README.md +++ b/astro-ao3-loader/README.md @@ -28,13 +28,14 @@ Load data from Archive of Our Own to your Astro site. > > If you've never joined an open source project before, this is an excellent first place to contribute! -This plugin uses the experimental content layer and [AO3.js](https://github.com/fujowebdev/ao3.js) to load data from [Archive of Our Own](https://archiveofourown.org/) to your [Astro](https://astro.build/) website. +This plugin uses the [Content Loader API](https://docs.astro.build/en/reference/content-loader-reference/) and [AO3.js](https://github.com/fujowebdev/ao3.js) to load data from [Archive of Our Own](https://archiveofourown.org/) to your [Astro](https://astro.build/) website. ## What can `@fujocoded/astro-ao3-loader` do? | **Method** | **Description** | **Parameters** | **Return Type** | | ---------- | --------------- | -------------- | --------------- | -| `getNextFicGroupFetcher` | Retrieves a group of works from AO3. | `{ workIds: string[], logger: LoaderContext["logger"] }` - A list of work IDs | | +| `getFetcher` | Retrieves a | `{ logger: LoaderContext["logger"] }` - An [Astro content loader](https://docs.astro.build/en/reference/content-loader-reference/#loadercontext). | `{ response }` - The HTTP status response from the server. | +| `getNextFicGroupFetcher` | Retrieves a group of works from AO3 using the specified `workIds`. | `{ workIds: string[], logger: LoaderContext["logger"] }` - A list of work IDs and an [Astro content loader](https://docs.astro.build/en/reference/content-loader-reference/#loadercontext). | `{ nextGroup }` - The next group of fics to be loaded. | You can see an example of its usage [in our sample repository](https://github.com/FujoWebDev/ao3-content-layer-example). From 1f7f3a1af5381be654256660abd93aac431c03b8 Mon Sep 17 00:00:00 2001 From: Emily <107147744+emarsh1995@users.noreply.github.com> Date: Wed, 14 Jan 2026 19:48:42 -0500 Subject: [PATCH 03/13] Last bits of astro-ao3-loader README --- astro-ao3-loader/README.md | 75 +++++++++++++++++++++----------------- 1 file changed, 42 insertions(+), 33 deletions(-) diff --git a/astro-ao3-loader/README.md b/astro-ao3-loader/README.md index b5202db..04c484f 100644 --- a/astro-ao3-loader/README.md +++ b/astro-ao3-loader/README.md @@ -37,20 +37,14 @@ This plugin uses the [Content Loader API](https://docs.astro.build/en/reference/ | `getFetcher` | Retrieves a | `{ logger: LoaderContext["logger"] }` - An [Astro content loader](https://docs.astro.build/en/reference/content-loader-reference/#loadercontext). | `{ response }` - The HTTP status response from the server. | | `getNextFicGroupFetcher` | Retrieves a group of works from AO3 using the specified `workIds`. | `{ workIds: string[], logger: LoaderContext["logger"] }` - A list of work IDs and an [Astro content loader](https://docs.astro.build/en/reference/content-loader-reference/#loadercontext). | `{ nextGroup }` - The next group of fics to be loaded. | -You can see an example of its usage [in our sample -repository](https://github.com/FujoWebDev/ao3-content-layer-example). +## How to use `@fujocoded/astro-ao3-loader` -## Installation +> [!SUCCESS] +> Want to see some examples? Take a look at [our sample repository](https://github.com/FujoWebDev/ao3-content-layer-example). -```sh -npm install @fujocoded/astro-ao3-loader -``` - -## Usage +### Prerequisites -This package requires Astro 4.14.0 or later. You must enable the experimental -content layer in Astro unless you are using version 5.0.0-beta or later. You can -do this by adding the following to your `astro.config.mjs`: +This package requires [Astro](https://astro.build/) 4.14.0 or later and Astro's built-in [Content Loader API](https://docs.astro.build/en/reference/content-loader-reference). If you're using a version of Astro earlier than 5.0.0-beta, you can enable the API by adding the following code to `astro.config.mjs`: ```javascript export default defineConfig({ @@ -61,35 +55,50 @@ export default defineConfig({ }); ``` -Currently, this package contains only a single loader called `worksLoader`, -which loads the details of a series of works whose id is listed in the -`src/content/ao3/works.yaml` file. +You'll also need to add the latest version of [AO3.js](https://github.com/fujowebdev/ao3.js) to your project. -First add the configuration in `src/content/config.ts`: +```bash +# Install plugin using NPM. +npm install @fujocoded/ao3.js -```typescript -// src/content/config.ts -import { defineCollection } from "astro:content"; -import { feedLoader } from "@fujocoded/astro-ao3-loader"; - -export const collections = { - fanfictions: defineCollection({ loader: worksLoader }), -}; +# Install plugin using yarn. +yarn add @fujocoded/ao3.js ``` -Then create your `src/content/ao3/works.yaml` file: +### Installation -```yaml -- 38226814 -- 49238326 -- 59988091 -- 41160522 -- 11728554 -- 12928950 -- 58869805 +```bash +npm install @fujocoded/astro-ao3-loader ``` -You can then use this like any other collection in Astro: +### Configuration + +This package contains a loader called `worksLoader` that loads the details of a series of works whose IDs are listed in `src/content/ao3/works.yaml`. + +1. Configure the plugin in `src/content/config.ts`. + + ```ts + import { defineCollection } from "astro:content"; + import { feedLoader } from "@fujocoded/astro-ao3-loader"; + + export const collections = { + fanfictions: defineCollection({ loader: worksLoader }), + }; + ``` + +2. Create `src/content/ao3/works.yaml` and add a list of work IDs to the file. + + ```yaml + - 38226814 + - 49238326 + - 59988091 + - 41160522 + - 11728554 + - 12928950 + - 58869805 + ``` + +Once configured, you can use the `astro-ao3-loader` like any other Astro collection. ```astro --- From b287096838165c2f7ae6dda4b24a1c387fb24d20 Mon Sep 17 00:00:00 2001 From: Emily <107147744+emarsh1995@users.noreply.github.com> Date: Wed, 14 Jan 2026 19:50:03 -0500 Subject: [PATCH 04/13] Fix admonition --- astro-ao3-loader/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/astro-ao3-loader/README.md b/astro-ao3-loader/README.md index 04c484f..0bd88ff 100644 --- a/astro-ao3-loader/README.md +++ b/astro-ao3-loader/README.md @@ -39,7 +39,7 @@ This plugin uses the [Content Loader API](https://docs.astro.build/en/reference/ ## How to use `@fujocoded/astro-ao3-loader` -> [!SUCCESS] +> [!TIP] > Want to see some examples? Take a look at [our sample repository](https://github.com/FujoWebDev/ao3-content-layer-example). ### Prerequisites From 6a228f0dd90d11b482c158fcb03af174203a831b Mon Sep 17 00:00:00 2001 From: Emily <107147744+emarsh1995@users.noreply.github.com> Date: Mon, 19 Jan 2026 12:51:39 -0500 Subject: [PATCH 05/13] Updates from 2026/01/15 stream --- astro-ao3-loader/README.md | 19 ++++--------------- 1 file changed, 4 insertions(+), 15 deletions(-) diff --git a/astro-ao3-loader/README.md b/astro-ao3-loader/README.md index 0bd88ff..632dc06 100644 --- a/astro-ao3-loader/README.md +++ b/astro-ao3-loader/README.md @@ -32,10 +32,9 @@ This plugin uses the [Content Loader API](https://docs.astro.build/en/reference/ ## What can `@fujocoded/astro-ao3-loader` do? -| **Method** | **Description** | **Parameters** | **Return Type** | -| ---------- | --------------- | -------------- | --------------- | -| `getFetcher` | Retrieves a | `{ logger: LoaderContext["logger"] }` - An [Astro content loader](https://docs.astro.build/en/reference/content-loader-reference/#loadercontext). | `{ response }` - The HTTP status response from the server. | -| `getNextFicGroupFetcher` | Retrieves a group of works from AO3 using the specified `workIds`. | `{ workIds: string[], logger: LoaderContext["logger"] }` - A list of work IDs and an [Astro content loader](https://docs.astro.build/en/reference/content-loader-reference/#loadercontext). | `{ nextGroup }` - The next group of fics to be loaded. | +| **Method** | **Description** | +| ------------- | -------------------------------------------------------------------------------------------------------- | +| `worksLoader` | Fetches and loads data from a set of works hosted on [Archive of Our Own](https://archiveofourown.org/). | ## How to use `@fujocoded/astro-ao3-loader` @@ -55,16 +54,6 @@ export default defineConfig({ }); ``` -You'll also need to add the latest version of [AO3.js](https://github.com/fujowebdev/ao3.js) to your project. - -```bash -# Install plugin using NPM. -npm install @fujocoded/ao3.js - -# Install plugin using yarn. -yarn add @fujocoded/ao3.js -``` - ### Installation ```bash @@ -79,7 +68,7 @@ This package contains a loader called `worksLoader` that loads the details of a ```ts import { defineCollection } from "astro:content"; - import { feedLoader } from "@fujocoded/astro-ao3-loader"; + import { worksLoader } from "@fujocoded/astro-ao3-loader"; export const collections = { fanfictions: defineCollection({ loader: worksLoader }), From 018cbc38f1ca2fe0d621d523c9c26444f87c1776 Mon Sep 17 00:00:00 2001 From: Essential Randomness Date: Mon, 26 Jan 2026 18:49:10 -0800 Subject: [PATCH 06/13] Add comments to implementation and make it more readable --- astro-ao3-loader/src/{utils.ts => fetcher.ts} | 59 +------------- astro-ao3-loader/src/index.ts | 45 +++++------ astro-ao3-loader/src/logger.ts | 77 +++++++++++++++++++ 3 files changed, 101 insertions(+), 80 deletions(-) rename astro-ao3-loader/src/{utils.ts => fetcher.ts} (71%) create mode 100644 astro-ao3-loader/src/logger.ts diff --git a/astro-ao3-loader/src/utils.ts b/astro-ao3-loader/src/fetcher.ts similarity index 71% rename from astro-ao3-loader/src/utils.ts rename to astro-ao3-loader/src/fetcher.ts index 83678e4..5f7a661 100644 --- a/astro-ao3-loader/src/utils.ts +++ b/astro-ao3-loader/src/fetcher.ts @@ -6,7 +6,6 @@ const CONCURRENCY = 5; const CACHE_TTL_MS = 1000 * 60 * 5; // 5 minutes const REQUEST_TIMEOUT_MS = 120_000; // 2 minutes total (includes all retries) const MAX_RETRIES = 5; -const PROGRESS_INTERVAL_MS = 15 * 1000; // 15 seconds const RESPONSE_CACHE = new Map(); const getRetryReason = (error: Error): string => { @@ -86,7 +85,9 @@ const createFetcher = (logger: LoaderContext["logger"]) => { ], beforeRetry: [ async ({ request, error, retryCount }) => { - logger.warn(`${getRetryReason(error)}, retrying (${retryCount}/${MAX_RETRIES}): ${request.url}`); + logger.warn( + `${getRetryReason(error)}, retrying (${retryCount}/${MAX_RETRIES}): ${request.url}`, + ); }, ], }, @@ -94,7 +95,7 @@ const createFetcher = (logger: LoaderContext["logger"]) => { return async ( input: RequestInfo | URL, - init?: RequestInit + init?: RequestInit, ): Promise => { // We skip the queue if the response is already cached if (RESPONSE_CACHE.has(input.toString())) { @@ -104,7 +105,6 @@ const createFetcher = (logger: LoaderContext["logger"]) => { }; }; - let AO3_FETCHER: typeof fetch | null = null; export const getFetcher = (logger: LoaderContext["logger"]) => { if (!AO3_FETCHER) { @@ -112,54 +112,3 @@ export const getFetcher = (logger: LoaderContext["logger"]) => { } return AO3_FETCHER; }; - -export const getProgressTracker = ({ - logger, - prefix, - total, - itemsType -}: { - logger: LoaderContext["logger"], - prefix: string, - total: number, - itemsType: string -}) => { - let successCount = 0; - // TODO: add details of failed items - let failCount = 0; - let timeout: NodeJS.Timeout | undefined; - - const log = () => { - const completed = successCount + failCount; - logger.info( - `${prefix} ${completed}/${total} ${itemsType} loaded ${failCount > 0 ? `(${failCount} failed)` : "" - }` - ); - - clearTimeout(timeout); - if (completed < total) { - timeout = setTimeout(log, PROGRESS_INTERVAL_MS); - } - }; - - return { - start: () => { - logger.info(`${prefix} Loading ${total} ${itemsType}...`); - timeout = setTimeout(log, PROGRESS_INTERVAL_MS); - }, - incrementSuccess: () => { - successCount++; - log(); - }, - incrementFail: () => { - failCount++; - log(); - }, - finish: () => { - clearTimeout(timeout); - logger.info( - `${prefix} Loaded ${successCount} of ${total} ${itemsType} (${failCount} failed)` - ); - }, - }; -}; diff --git a/astro-ao3-loader/src/index.ts b/astro-ao3-loader/src/index.ts index 661d357..d6cb25f 100644 --- a/astro-ao3-loader/src/index.ts +++ b/astro-ao3-loader/src/index.ts @@ -4,27 +4,21 @@ import { workSummarySchema, seriesSchema } from "@fujocoded/ao3.js/zod-schemas"; import { parse } from "yaml"; import type { Loader, LoaderContext } from "astro/loaders"; import { z } from "zod"; -import { getFetcher, getProgressTracker } from "./utils.ts"; - -const PREFIX_ANSI_COLORS = { - works: "\x1b[36m", // Cyan - series: "\x1b[35m", // Magenta - reset: "\x1b[0m", -}; - -const getPrefix = (type: "works" | "series") => { - const color = PREFIX_ANSI_COLORS[type]; - return `${color}[${type}]${PREFIX_ANSI_COLORS.reset}`; -}; +import { getFetcher } from "./fetcher.ts"; +import { getProgressTracker} from "./logger.ts"; +/** + * Loads the items of the given "type" from the given file ("yamlPath"). + * It uses the "itemFetcher" function to fetch it from the archive. + */ const loadItems = async ( { store, logger }: LoaderContext, config: { type: "works" | "series"; yamlPath: string; - fetchFn: (id: string) => Promise>; - } + itemFetcher: (id: string) => Promise>; + }, ) => { setFetcher(getFetcher(logger)); @@ -33,31 +27,32 @@ const loadItems = async ( const tracker = getProgressTracker({ logger, - prefix: getPrefix(config.type), total: ids.length, - itemsType: config.type + itemsType: config.type, }); + // Start tracking our progress for this itemsType tracker.start(); try { await Promise.all( ids.map(async (id) => { try { - const item = await config.fetchFn(id); + // Fetch the item with the given id from the archive + const item = await config.itemFetcher(id); + // If that works, add it to the store, and mark success store.set({ id: item.id.toString(), data: { ...item } }); tracker.incrementSuccess(); } catch (error) { - tracker.incrementFail(); - logger.error( - `${getPrefix(config.type)} Failed to fetch ${config.type.slice(0, -1)} ${id}: ${error}` - ); + // If there's an error, increment the fail count + tracker.incrementFail(id, error); } - }) + }), ); } finally { + // Once everything is done, close off our tracking of progress tracker.finish(); } -} +}; export const worksLoader: Loader = { name: "ao3-loader", @@ -65,7 +60,7 @@ export const worksLoader: Loader = { loadItems(context, { type: "works", yamlPath: "./src/content/ao3/works.yaml", - fetchFn: (workId) => getWork({ workId }), + itemFetcher: (workId) => getWork({ workId }), }), schema: workSummarySchema, }; @@ -76,7 +71,7 @@ export const seriesLoader: Loader = { loadItems(context, { type: "series", yamlPath: "./src/content/ao3/series.yaml", - fetchFn: (seriesId) => getSeries({ seriesId }), + itemFetcher: (seriesId) => getSeries({ seriesId }), }), schema: seriesSchema, }; diff --git a/astro-ao3-loader/src/logger.ts b/astro-ao3-loader/src/logger.ts new file mode 100644 index 0000000..6806734 --- /dev/null +++ b/astro-ao3-loader/src/logger.ts @@ -0,0 +1,77 @@ + +import type { LoaderContext } from "astro/loaders"; + +const PROGRESS_INTERVAL_MS = 15 * 1000; // 15 seconds + +const PREFIX_ANSI_COLORS = { + works: "\x1b[36m", // Cyan + series: "\x1b[35m", // Magenta + reset: "\x1b[0m", // Resets the terminal color to the original +}; + +/** + * Get the name (with colors!) of the type of content we're loading so that it's + * easier to distinguish the load state of our content. + */ +const getPrefix = (type: "works" | "series") => { + const color = PREFIX_ANSI_COLORS[type]; + return `${color}[${type}]${PREFIX_ANSI_COLORS.reset}`; +}; + +/** + * Logs download progress for "itemsType" to the command line, using + * the appropriate prefix. + */ +export const getProgressTracker = ({ + logger, + total, + itemsType, +}: { + logger: LoaderContext["logger"]; + total: number; + itemsType: "works" | "series"; +}) => { + let successCount = 0; + // TODO: add details of failed items + let failCount = 0; + let timeout: NodeJS.Timeout | undefined; + const prefix = getPrefix(itemsType); + + const log = () => { + const completed = successCount + failCount; + logger.info( + `${prefix} ${completed}/${total} ${itemsType} loaded ${ + failCount > 0 ? `(${failCount} failed)` : "" + }`, + ); + + clearTimeout(timeout); + if (completed < total) { + timeout = setTimeout(log, PROGRESS_INTERVAL_MS); + } + }; + + return { + start: () => { + logger.info(`${prefix} Loading ${total} ${itemsType}...`); + timeout = setTimeout(log, PROGRESS_INTERVAL_MS); + }, + incrementSuccess: () => { + successCount++; + log(); + }, + incrementFail: (id: string, error: unknown) => { + failCount++; + log(); + logger.error( + `${prefix} Failed to fetch ${itemsType.slice(0, -1)} ${id}: ${error}`, + ); + }, + finish: () => { + clearTimeout(timeout); + logger.info( + `${prefix} Loaded ${successCount} of ${total} ${itemsType} (${failCount} failed)`, + ); + }, + }; +}; From ca009687da9c375ef67efb0a995360cbc9000241 Mon Sep 17 00:00:00 2001 From: Essential Randomness Date: Mon, 26 Jan 2026 19:48:58 -0800 Subject: [PATCH 07/13] Do small updates to the READMEs --- README.md | 4 +- astro-ao3-loader/README.md | 57 +++++++++++-------- .../__examples__/astro-5/README.md | 41 ++++++------- 3 files changed, 51 insertions(+), 51 deletions(-) diff --git a/README.md b/README.md index e42bed3..bfc266b 100644 --- a/README.md +++ b/README.md @@ -21,8 +21,8 @@ You can learn more about each plugin by looking at the `README.md` file in its d - [`astro-alt-text-toolkit`](/astro-alt-text-toolkit/README.md) - (WIP) Makes it easier to manage alt text on your Astro site, and beyond. - [`astro-ao3-loader`](/astro-ao3-loader/README.md) - Uses [AO3.js](https://github.com/fujowebdev/ao3.js) to load data from AO3 to your Astro site. - [`astro-authproto`](/astro-authproto/README.md) - Adds ATproto authentication to your Astro site. -- [`astro-dev-only`](/astro-dev-only/README.md) - Renders pages to your Astro site when you build it locally, and removes them from the final build. -- [`astro-rehype-html-headings`](/astro-rehype-html-headings/README.md) - Returns Astro headings from an `.md` or `.mdx` file with a list of their HTML properties. +- [`astro-dev-only`](/astro-dev-only/README.md) - Renders pages to your Astro site during development (`npm run dev`), and removes them from the final build (`npm run build`). +- [`astro-rehype-html-headings`](/astro-rehype-html-headings/README.md) - Returns Astro headings from an `.md` or `.mdx` including their rendered HTML. - [`astro-remark-collect-components`](/astro-remark-collect-components/README.md) - Adds a list of attributes from Astro components to the `remarkFrontmatter` property for later use. - [`astro-smooth-actions`](/astro-smooth-actions/README.md) - Makes Astro Action smoother by persisting form action results in the session. - [`expressive-code-caption`](/expressive-code-caption/README.md) - Allows adding captions to [`expressive-code`](https://github.com/expressive-code/expressive-code) code blocks. diff --git a/astro-ao3-loader/README.md b/astro-ao3-loader/README.md index 632dc06..2d251c4 100644 --- a/astro-ao3-loader/README.md +++ b/astro-ao3-loader/README.md @@ -5,54 +5,50 @@ Load data from Archive of Our Own to your Astro site. - + NPM license - - Gitpod Ready-to-Code - Fandom Coders badge - -![npm version](https://badge.fury.io/js/%40fujocoded%2Fastro-ao3-loader.svg) - + Np PM version badge + + + Open in GitHub Codespaces ## What is `@fujocoded/astro-ao3-loader`? > [!WARNING] -> This is an experimental library with only basic functionality. If you want to help us expand it, you can reach out via GitHub, Fandom Coders, or contacts@fujocoded.com. +> This is an experimental library with only basic functionality. If you want to help us expand it, you can reach out via GitHub, Fandom Coders, our socials, or contacts@fujocoded.com. > > If you've never joined an open source project before, this is an excellent first place to contribute! -This plugin uses the [Content Loader API](https://docs.astro.build/en/reference/content-loader-reference/) and [AO3.js](https://github.com/fujowebdev/ao3.js) to load data from [Archive of Our Own](https://archiveofourown.org/) to your [Astro](https://astro.build/) website. +This library makes it easy to use the [Content Loader API](https://docs.astro.build/en/reference/content-loader-reference/) and [AO3.js](https://github.com/fujowebdev/ao3.js) to load data from [Archive of Our Own](https://archiveofourown.org/) to your [Astro](https://astro.build/) website. ## What can `@fujocoded/astro-ao3-loader` do? +`@fujocoded/astro-ao3-loader` lets you easily grab data about content hosted on [Archive of Our Own](https://archiveofourown.org/) to use in your Astro websiteβ€”however you wish to ✨ + +It includes the following loaders: + | **Method** | **Description** | | ------------- | -------------------------------------------------------------------------------------------------------- | -| `worksLoader` | Fetches and loads data from a set of works hosted on [Archive of Our Own](https://archiveofourown.org/). | +| `worksLoader` | Loads data from a set of works hosted on [Archive of Our Own](https://archiveofourown.org/). | +| `seriesLoader` | Loads data from series hosted on [Archive of Our Own](https://archiveofourown.org/). | ## How to use `@fujocoded/astro-ao3-loader` > [!TIP] -> Want to see some examples? Take a look at [our sample repository](https://github.com/FujoWebDev/ao3-content-layer-example). +> Want to see it in action? Take a look at [our sample repository](https://github.com/FujoWebDev/ao3-content-layer-example). ### Prerequisites -This package requires [Astro](https://astro.build/) 4.14.0 or later and Astro's built-in [Content Loader API](https://docs.astro.build/en/reference/content-loader-reference). If you're using a version of Astro earlier than 5.0.0-beta, you can enable the API by adding the following code to `astro.config.mjs`: - -```javascript -export default defineConfig({ - // ... - experimental: { - contentLayer: true, - }, -}); -``` +This package requires [Astro](https://astro.build/) 5.0.0 or later and Astro's +built-in [Content Loader +API](https://docs.astro.build/en/reference/content-loader-reference). Astro 4 is not supported at this moment, but if you're interested, [open an issue](https://github.com/FujoWebDev/fujocoded-plugins/issues/new?labels=ao3-content-loader) to let us know. ### Installation @@ -62,9 +58,14 @@ npm install @fujocoded/astro-ao3-loader ### Configuration -This package contains a loader called `worksLoader` that loads the details of a series of works whose IDs are listed in `src/content/ao3/works.yaml`. +This package contains loaders that let you download different types of content +from AO3. The configuration is the same for each loader. + +In this example, we'll use a loader called `worksLoader` that lets you get the details of a list of works whose IDs are listed in the `src/content/ao3/works.yaml` file. + +To set it up, follow these steps: -1. Configure the plugin in `src/content/config.ts`. +1. Set up a content collection in `src/content/config.ts` that uses your chosen loader. ```ts import { defineCollection } from "astro:content"; @@ -75,7 +76,7 @@ This package contains a loader called `worksLoader` that loads the details of a }; ``` -2. Create `src/content/ao3/works.yaml` and add a list of work IDs to the file. +2. Create a file at `src/content/ao3/works.yaml` and add a list of work IDs to the file. ```yaml - 38226814 @@ -87,6 +88,12 @@ This package contains a loader called `worksLoader` that loads the details of a - 58869805 ``` +> [!TIP] +> This file is in a language called YAML. If you're running into issues, +> check your syntax by using one of the many YAML validators out there. + +...and that's all! + Once configured, you can use the `astro-ao3-loader` like any other Astro collection. ```astro @@ -110,3 +117,5 @@ const fanfictions = await getCollection("fanfictions"); } ``` + +For a more complete example, you can take a look at [our sample repository](https://github.com/FujoWebDev/ao3-content-layer-example). \ No newline at end of file diff --git a/astro-ao3-loader/__examples__/astro-5/README.md b/astro-ao3-loader/__examples__/astro-5/README.md index 87b813a..ba87171 100644 --- a/astro-ao3-loader/__examples__/astro-5/README.md +++ b/astro-ao3-loader/__examples__/astro-5/README.md @@ -1,33 +1,30 @@ -# Astro Starter Kit: Minimal +# Astro AO3 Loader Example -```sh -npm create astro@latest -- --template minimal -``` - -> πŸ§‘β€πŸš€ **Seasoned astronaut?** Delete this file. Have fun! - -## πŸš€ Project Structure +This example features `@fujocoded/astro-ao3-loader` in action. -Inside of your Astro project, you'll see the following folders and files: +Inside, you'll see (among others) the following folders and files: ```text / -β”œβ”€β”€ public/ -β”œβ”€β”€ src/ -β”‚ └── pages/ -β”‚ └── index.astro -└── package.json +β”œβ”€ ... +β”œβ”€ src/ +β”‚ └─ content/ +β”‚ └── ao3/ +β”‚ └── series.yaml +β”‚ └── works.yaml +β”‚ └── config.ts +β”‚ └─ pages/ +β”‚ └── index.astro +└─ package.json ``` -Astro looks for `.astro` or `.md` files in the `src/pages/` directory. Each page is exposed as a route based on its file name. +Explore them at your leisure and open an issue if you have any question. -There's nothing special about `src/components/`, but that's where we like to put any Astro/React/Vue/Svelte/Preact components. -Any static assets, like images, can be placed in the `public/` directory. -## 🧞 Commands +## Commands -All commands are run from the root of the project, from a terminal: +These commands are Astro's built-in functionality and should be run from the root of the project, from a terminal: | Command | Action | | :------------------------ | :----------------------------------------------- | @@ -35,9 +32,3 @@ All commands are run from the root of the project, from a terminal: | `npm run dev` | Starts local dev server at `localhost:4321` | | `npm run build` | Build your production site to `./dist/` | | `npm run preview` | Preview your build locally, before deploying | -| `npm run astro ...` | Run CLI commands like `astro add`, `astro check` | -| `npm run astro -- --help` | Get help using the Astro CLI | - -## πŸ‘€ Want to learn more? - -Feel free to check [our documentation](https://docs.astro.build) or jump into our [Discord server](https://astro.build/chat). From 848e81cc9bf0b3c7642257709d436065e664b166 Mon Sep 17 00:00:00 2001 From: Emily <107147744+emarsh1995@users.noreply.github.com> Date: Fri, 30 Jan 2026 12:33:56 -0500 Subject: [PATCH 08/13] Final tweaks --- astro-ao3-loader/README.md | 85 ++++++++----------- .../__examples__/astro-5/README.md | 24 +++--- astro-ao3-loader/src/index.ts | 17 ++-- 3 files changed, 54 insertions(+), 72 deletions(-) diff --git a/astro-ao3-loader/README.md b/astro-ao3-loader/README.md index 2d251c4..952616d 100644 --- a/astro-ao3-loader/README.md +++ b/astro-ao3-loader/README.md @@ -4,19 +4,19 @@ Load data from Archive of Our Own to your Astro site. - - + + NPM license - - + + Fandom Coders badge - - + + Np PM version badge - - + + Open in GitHub Codespaces - + ## What is `@fujocoded/astro-ao3-loader`? @@ -30,25 +30,22 @@ This library makes it easy to use the [Content Loader API](https://docs.astro.bu ## What can `@fujocoded/astro-ao3-loader` do? -`@fujocoded/astro-ao3-loader` lets you easily grab data about content hosted on [Archive of Our Own](https://archiveofourown.org/) to use in your Astro websiteβ€”however you wish to ✨ +You can use the following loaders to fetch data from [Archive of Our Own](https://archiveofourown.org/). -It includes the following loaders: - -| **Method** | **Description** | -| ------------- | -------------------------------------------------------------------------------------------------------- | -| `worksLoader` | Loads data from a set of works hosted on [Archive of Our Own](https://archiveofourown.org/). | -| `seriesLoader` | Loads data from series hosted on [Archive of Our Own](https://archiveofourown.org/). | +| **Method** | **Description** | +| -------------- | -------------------------------------------------------------------------------------------- | +| `worksLoader` | Loads data from a set of works hosted on [Archive of Our Own](https://archiveofourown.org/). | +| `seriesLoader` | Loads data from series hosted on [Archive of Our Own](https://archiveofourown.org/). | ## How to use `@fujocoded/astro-ao3-loader` > [!TIP] > Want to see it in action? Take a look at [our sample repository](https://github.com/FujoWebDev/ao3-content-layer-example). +> Want to see some examples? Take a look at [our sample repository](https://github.com/FujoWebDev/ao3-content-layer-example) or the [examples folder](/astro-ao3-loader/__examples__/). ### Prerequisites -This package requires [Astro](https://astro.build/) 5.0.0 or later and Astro's -built-in [Content Loader -API](https://docs.astro.build/en/reference/content-loader-reference). Astro 4 is not supported at this moment, but if you're interested, [open an issue](https://github.com/FujoWebDev/fujocoded-plugins/issues/new?labels=ao3-content-loader) to let us know. +This library requires [Astro](https://astro.build/) 5.0.0 or later, and Astro's built-in [Content Loader API](https://docs.astro.build/en/reference/content-loader-reference/). Astro 4 isn't currently supported, but if you'd like to use the library on an older version, [open an issue](https://github.com/FujoWebDev/fujocoded-plugins/issues/new?labels=ao3-content-loader) to let us know! ### Installation @@ -58,41 +55,33 @@ npm install @fujocoded/astro-ao3-loader ### Configuration -This package contains loaders that let you download different types of content -from AO3. The configuration is the same for each loader. - -In this example, we'll use a loader called `worksLoader` that lets you get the details of a list of works whose IDs are listed in the `src/content/ao3/works.yaml` file. - -To set it up, follow these steps: +The configuration steps are the same for each loader. In this example, we'll use the `worksLoader` to get information from a list of works specified in `src/content/ao3/works.yaml`. 1. Set up a content collection in `src/content/config.ts` that uses your chosen loader. - ```ts - import { defineCollection } from "astro:content"; - import { worksLoader } from "@fujocoded/astro-ao3-loader"; + ```ts + import { defineCollection } from "astro:content"; + import { worksLoader } from "@fujocoded/astro-ao3-loader"; - export const collections = { - fanfictions: defineCollection({ loader: worksLoader }), - }; - ``` + export const collections = { + fanfictions: defineCollection({ loader: worksLoader }), + }; + ``` -2. Create a file at `src/content/ao3/works.yaml` and add a list of work IDs to the file. +2. Create `src/content/ao3/works.yaml` and add a list of work IDs to the file. - ```yaml - - 38226814 - - 49238326 - - 59988091 - - 41160522 - - 11728554 - - 12928950 - - 58869805 - ``` + ```yaml + - 38226814 + - 49238326 + - 59988091 + - 41160522 + - 11728554 + - 12928950 + - 58869805 + ``` -> [!TIP] -> This file is in a language called YAML. If you're running into issues, -> check your syntax by using one of the many YAML validators out there. - -...and that's all! +> [!TIP] +> This file uses the YAML data format to list work IDs. If you're running into issues, check your syntax using one of the many YAML validators out there. Once configured, you can use the `astro-ao3-loader` like any other Astro collection. @@ -117,5 +106,3 @@ const fanfictions = await getCollection("fanfictions"); } ``` - -For a more complete example, you can take a look at [our sample repository](https://github.com/FujoWebDev/ao3-content-layer-example). \ No newline at end of file diff --git a/astro-ao3-loader/__examples__/astro-5/README.md b/astro-ao3-loader/__examples__/astro-5/README.md index ba87171..f6b0cfb 100644 --- a/astro-ao3-loader/__examples__/astro-5/README.md +++ b/astro-ao3-loader/__examples__/astro-5/README.md @@ -1,8 +1,6 @@ -# Astro AO3 Loader Example +# `@fujocoded/astro-ao3-loader` Example -This example features `@fujocoded/astro-ao3-loader` in action. - -Inside, you'll see (among others) the following folders and files: +This example shows the `@fujocoded/astro-ao3-loader` library in action. Inside, you'll see (among others) the following folders and files: ```text / @@ -18,17 +16,15 @@ Inside, you'll see (among others) the following folders and files: └─ package.json ``` -Explore them at your leisure and open an issue if you have any question. - - +Explore at your leisure, and feel free to open an Issue if you have any questions. ## Commands -These commands are Astro's built-in functionality and should be run from the root of the project, from a terminal: +The following commands are Astro's built-in functionality. You can run these from a terminal pointing to your project's root. -| Command | Action | -| :------------------------ | :----------------------------------------------- | -| `npm install` | Installs dependencies | -| `npm run dev` | Starts local dev server at `localhost:4321` | -| `npm run build` | Build your production site to `./dist/` | -| `npm run preview` | Preview your build locally, before deploying | +| **Command** | **Action** | +| ----------------- | --------------------------------------------- | +| `npm install` | Install dependencies. | +| `npm run dev` | Start a local dev server at `localhost:4321`. | +| `npm run build` | Build your production site to `./dist/`. | +| `npm run preview` | Preview your build locally before deploying. | diff --git a/astro-ao3-loader/src/index.ts b/astro-ao3-loader/src/index.ts index d6cb25f..8f597ac 100644 --- a/astro-ao3-loader/src/index.ts +++ b/astro-ao3-loader/src/index.ts @@ -7,11 +7,10 @@ import { z } from "zod"; import { getFetcher } from "./fetcher.ts"; import { getProgressTracker} from "./logger.ts"; - /** - * Loads the items of the given "type" from the given file ("yamlPath"). - * It uses the "itemFetcher" function to fetch it from the archive. - */ + * Loads items of the given "type" from the specified file ("yamlPath"). This uses the "itemFetcher" + * function to fetch items from Archive of Our Own. +**/ const loadItems = async ( { store, logger }: LoaderContext, config: { @@ -31,25 +30,25 @@ const loadItems = async ( itemsType: config.type, }); - // Start tracking our progress for this itemsType + // Start tracking progress for this "itemsType". tracker.start(); try { await Promise.all( ids.map(async (id) => { try { - // Fetch the item with the given id from the archive + // Fetch the item with the specified ID from the archive. const item = await config.itemFetcher(id); - // If that works, add it to the store, and mark success + // If that works, add it to the store and mark success. store.set({ id: item.id.toString(), data: { ...item } }); tracker.incrementSuccess(); } catch (error) { - // If there's an error, increment the fail count + // If there's an error, increment the fail count. tracker.incrementFail(id, error); } }), ); } finally { - // Once everything is done, close off our tracking of progress + // Once everything is done, close off progress tracking. tracker.finish(); } }; From e3aad54622dc912eab24b60317bfb27d33ecea29 Mon Sep 17 00:00:00 2001 From: Emily <107147744+emarsh1995@users.noreply.github.com> Date: Sun, 1 Feb 2026 10:58:09 -0500 Subject: [PATCH 09/13] Updates from comments --- astro-ao3-loader/README.md | 13 ++++++++----- 1 file changed, 8 insertions(+), 5 deletions(-) diff --git a/astro-ao3-loader/README.md b/astro-ao3-loader/README.md index 952616d..cd42dd1 100644 --- a/astro-ao3-loader/README.md +++ b/astro-ao3-loader/README.md @@ -30,9 +30,11 @@ This library makes it easy to use the [Content Loader API](https://docs.astro.bu ## What can `@fujocoded/astro-ao3-loader` do? -You can use the following loaders to fetch data from [Archive of Our Own](https://archiveofourown.org/). +You can use this library to easily grab data about content hosted on [Archive of Our Own](https://archiveofourown.org/) to use in your [Astro](https://astro.build/) siteβ€”however you wish to. ✨ -| **Method** | **Description** | +The library includes the following loaders: + +| **Loader** | **Description** | | -------------- | -------------------------------------------------------------------------------------------- | | `worksLoader` | Loads data from a set of works hosted on [Archive of Our Own](https://archiveofourown.org/). | | `seriesLoader` | Loads data from series hosted on [Archive of Our Own](https://archiveofourown.org/). | @@ -40,8 +42,7 @@ You can use the following loaders to fetch data from [Archive of Our Own](https: ## How to use `@fujocoded/astro-ao3-loader` > [!TIP] -> Want to see it in action? Take a look at [our sample repository](https://github.com/FujoWebDev/ao3-content-layer-example). -> Want to see some examples? Take a look at [our sample repository](https://github.com/FujoWebDev/ao3-content-layer-example) or the [examples folder](/astro-ao3-loader/__examples__/). +> Want to see some examples? Take a look around the [examples folder](/astro-ao3-loader/__examples__/). πŸ‘€ ### Prerequisites @@ -55,7 +56,7 @@ npm install @fujocoded/astro-ao3-loader ### Configuration -The configuration steps are the same for each loader. In this example, we'll use the `worksLoader` to get information from a list of works specified in `src/content/ao3/works.yaml`. +The configuration steps are the same for each [loader](#what-can-fujocodedastro-ao3-loader-do). In this example, we'll use the `worksLoader` to get information from a list of works specified in `src/content/ao3/works.yaml`. 1. Set up a content collection in `src/content/config.ts` that uses your chosen loader. @@ -106,3 +107,5 @@ const fanfictions = await getCollection("fanfictions"); } ``` + +For a more complete example, you can take a look at [our example directory](/astro-ao3-loader/__examples__/astro-5/src/pages/index.astro). From 043131078b83e5b8ef7fd37dc62636846da514d0 Mon Sep 17 00:00:00 2001 From: Essential Randomness Date: Sun, 1 Feb 2026 15:37:35 -0800 Subject: [PATCH 10/13] rename example and add last polish to ao3-content-loader example --- astro-ao3-loader/README.md | 7 +- .../astro-5/src/content/config.ts | 7 -- .../astro-5/src/pages/index.astro | 63 --------------- .../{astro-5 => works-list}/.gitignore | 0 .../{astro-5 => works-list}/README.md | 0 .../{astro-5 => works-list}/astro.config.mjs | 0 .../{astro-5 => works-list}/package-lock.json | 0 .../{astro-5 => works-list}/package.json | 0 .../public/favicon.svg | 0 .../src/content/ao3/series.yaml | 0 .../src/content/ao3/works.yaml | 0 .../works-list/src/content/config.ts | 17 ++++ .../works-list/src/pages/index.astro | 81 +++++++++++++++++++ .../{astro-5 => works-list}/tsconfig.json | 0 14 files changed, 102 insertions(+), 73 deletions(-) delete mode 100644 astro-ao3-loader/__examples__/astro-5/src/content/config.ts delete mode 100644 astro-ao3-loader/__examples__/astro-5/src/pages/index.astro rename astro-ao3-loader/__examples__/{astro-5 => works-list}/.gitignore (100%) rename astro-ao3-loader/__examples__/{astro-5 => works-list}/README.md (100%) rename astro-ao3-loader/__examples__/{astro-5 => works-list}/astro.config.mjs (100%) rename astro-ao3-loader/__examples__/{astro-5 => works-list}/package-lock.json (100%) rename astro-ao3-loader/__examples__/{astro-5 => works-list}/package.json (100%) rename astro-ao3-loader/__examples__/{astro-5 => works-list}/public/favicon.svg (100%) rename astro-ao3-loader/__examples__/{astro-5 => works-list}/src/content/ao3/series.yaml (100%) rename astro-ao3-loader/__examples__/{astro-5 => works-list}/src/content/ao3/works.yaml (100%) create mode 100644 astro-ao3-loader/__examples__/works-list/src/content/config.ts create mode 100644 astro-ao3-loader/__examples__/works-list/src/pages/index.astro rename astro-ao3-loader/__examples__/{astro-5 => works-list}/tsconfig.json (100%) diff --git a/astro-ao3-loader/README.md b/astro-ao3-loader/README.md index cd42dd1..37c32dd 100644 --- a/astro-ao3-loader/README.md +++ b/astro-ao3-loader/README.md @@ -58,7 +58,7 @@ npm install @fujocoded/astro-ao3-loader The configuration steps are the same for each [loader](#what-can-fujocodedastro-ao3-loader-do). In this example, we'll use the `worksLoader` to get information from a list of works specified in `src/content/ao3/works.yaml`. -1. Set up a content collection in `src/content/config.ts` that uses your chosen loader. +1. Set up [a content collection](https://docs.astro.build/en/guides/content-collections/#defining-collections) in `src/content/config.ts` that uses your chosen loader. ```ts import { defineCollection } from "astro:content"; @@ -84,7 +84,8 @@ The configuration steps are the same for each [loader](#what-can-fujocodedastro- > [!TIP] > This file uses the YAML data format to list work IDs. If you're running into issues, check your syntax using one of the many YAML validators out there. -Once configured, you can use the `astro-ao3-loader` like any other Astro collection. +Once configured, you can use the collection created with `astro-ao3-loader` like you +would any other [Astro content collection](https://docs.astro.build/en/guides/content-collections/#using-content-in-astro-templates). ```astro --- @@ -108,4 +109,4 @@ const fanfictions = await getCollection("fanfictions"); ``` -For a more complete example, you can take a look at [our example directory](/astro-ao3-loader/__examples__/astro-5/src/pages/index.astro). +For a more complete example, you can take a look at [our example page](/astro-ao3-loader/__examples__/works-list/src/pages/index.astro). diff --git a/astro-ao3-loader/__examples__/astro-5/src/content/config.ts b/astro-ao3-loader/__examples__/astro-5/src/content/config.ts deleted file mode 100644 index 46638e3..0000000 --- a/astro-ao3-loader/__examples__/astro-5/src/content/config.ts +++ /dev/null @@ -1,7 +0,0 @@ -import { defineCollection } from "astro:content"; -import { worksLoader, seriesLoader } from "@fujocoded/astro-ao3-loader"; - -export const collections = { - fanfictions: defineCollection({ loader: worksLoader }), - series: defineCollection({ loader: seriesLoader }), -}; \ No newline at end of file diff --git a/astro-ao3-loader/__examples__/astro-5/src/pages/index.astro b/astro-ao3-loader/__examples__/astro-5/src/pages/index.astro deleted file mode 100644 index 0183a5f..0000000 --- a/astro-ao3-loader/__examples__/astro-5/src/pages/index.astro +++ /dev/null @@ -1,63 +0,0 @@ ---- -import { getCollection } from "astro:content"; - -const fanfictions = await getCollection("fanfictions"); -const series = await getCollection("series"); - -// Uncomment the next line to see what's inside the `fanfictions` -// or `series`variables and what data you can access -// console.dir(fanfictions, { depth: null }); -// console.dir(series, {depth: null}) ---- - - - - - - - - Astro - - -

Hello fujin

- - - - - diff --git a/astro-ao3-loader/__examples__/astro-5/.gitignore b/astro-ao3-loader/__examples__/works-list/.gitignore similarity index 100% rename from astro-ao3-loader/__examples__/astro-5/.gitignore rename to astro-ao3-loader/__examples__/works-list/.gitignore diff --git a/astro-ao3-loader/__examples__/astro-5/README.md b/astro-ao3-loader/__examples__/works-list/README.md similarity index 100% rename from astro-ao3-loader/__examples__/astro-5/README.md rename to astro-ao3-loader/__examples__/works-list/README.md diff --git a/astro-ao3-loader/__examples__/astro-5/astro.config.mjs b/astro-ao3-loader/__examples__/works-list/astro.config.mjs similarity index 100% rename from astro-ao3-loader/__examples__/astro-5/astro.config.mjs rename to astro-ao3-loader/__examples__/works-list/astro.config.mjs diff --git a/astro-ao3-loader/__examples__/astro-5/package-lock.json b/astro-ao3-loader/__examples__/works-list/package-lock.json similarity index 100% rename from astro-ao3-loader/__examples__/astro-5/package-lock.json rename to astro-ao3-loader/__examples__/works-list/package-lock.json diff --git a/astro-ao3-loader/__examples__/astro-5/package.json b/astro-ao3-loader/__examples__/works-list/package.json similarity index 100% rename from astro-ao3-loader/__examples__/astro-5/package.json rename to astro-ao3-loader/__examples__/works-list/package.json diff --git a/astro-ao3-loader/__examples__/astro-5/public/favicon.svg b/astro-ao3-loader/__examples__/works-list/public/favicon.svg similarity index 100% rename from astro-ao3-loader/__examples__/astro-5/public/favicon.svg rename to astro-ao3-loader/__examples__/works-list/public/favicon.svg diff --git a/astro-ao3-loader/__examples__/astro-5/src/content/ao3/series.yaml b/astro-ao3-loader/__examples__/works-list/src/content/ao3/series.yaml similarity index 100% rename from astro-ao3-loader/__examples__/astro-5/src/content/ao3/series.yaml rename to astro-ao3-loader/__examples__/works-list/src/content/ao3/series.yaml diff --git a/astro-ao3-loader/__examples__/astro-5/src/content/ao3/works.yaml b/astro-ao3-loader/__examples__/works-list/src/content/ao3/works.yaml similarity index 100% rename from astro-ao3-loader/__examples__/astro-5/src/content/ao3/works.yaml rename to astro-ao3-loader/__examples__/works-list/src/content/ao3/works.yaml diff --git a/astro-ao3-loader/__examples__/works-list/src/content/config.ts b/astro-ao3-loader/__examples__/works-list/src/content/config.ts new file mode 100644 index 0000000..769e137 --- /dev/null +++ b/astro-ao3-loader/__examples__/works-list/src/content/config.ts @@ -0,0 +1,17 @@ +import { defineCollection } from "astro:content"; +import { worksLoader, seriesLoader } from "@fujocoded/astro-ao3-loader"; + +/** + * You can configure content collections in Astro by exporting + * "collections" from `src/content/config`, like you see here. + * + * This loader exports two collections: + * - fanfictions, which uses our worksLoader + * - series, which uses our seriesLoader + * + * Learn more: https://docs.astro.build/en/guides/content-collections/#defining-collections + */ +export const collections = { + fanfictions: defineCollection({ loader: worksLoader }), + series: defineCollection({ loader: seriesLoader }), +}; diff --git a/astro-ao3-loader/__examples__/works-list/src/pages/index.astro b/astro-ao3-loader/__examples__/works-list/src/pages/index.astro new file mode 100644 index 0000000..5e6d7cd --- /dev/null +++ b/astro-ao3-loader/__examples__/works-list/src/pages/index.astro @@ -0,0 +1,81 @@ +--- +import { getCollection } from "astro:content"; + +/** + * We use getCollection with the name of our collection to + * load the data we want to use in our page. + * + * See: https://docs.astro.build/en/guides/content-collections/#using-content-in-astro-templates + */ +const fanfictions = await getCollection("fanfictions"); +const series = await getCollection("series"); + +// Uncomment the next line to see what's inside the `fanfictions` +// or `series`variables and what data you can access. The data will +// appear in your terminal when you refresh the page. +// console.dir(fanfictions, { depth: null }); +// console.dir(series, {depth: null}) +--- + + + + + + + + @fujocoded/astro-ao3-loader example + + +

Hello fujin

+ + + + + diff --git a/astro-ao3-loader/__examples__/astro-5/tsconfig.json b/astro-ao3-loader/__examples__/works-list/tsconfig.json similarity index 100% rename from astro-ao3-loader/__examples__/astro-5/tsconfig.json rename to astro-ao3-loader/__examples__/works-list/tsconfig.json From 621cbe976bf720cb91f99ea156055171630a0570 Mon Sep 17 00:00:00 2001 From: Essential Randomness Date: Sun, 1 Feb 2026 15:48:07 -0800 Subject: [PATCH 11/13] add preview to the example --- .../__examples__/works-list/README.md | 8 ++++++++ .../works-list/src/pages/index.astro | 2 +- .../__examples__/works-list/works-list.png | Bin 0 -> 150214 bytes 3 files changed, 9 insertions(+), 1 deletion(-) create mode 100644 astro-ao3-loader/__examples__/works-list/works-list.png diff --git a/astro-ao3-loader/__examples__/works-list/README.md b/astro-ao3-loader/__examples__/works-list/README.md index f6b0cfb..6aa3da0 100644 --- a/astro-ao3-loader/__examples__/works-list/README.md +++ b/astro-ao3-loader/__examples__/works-list/README.md @@ -1,5 +1,13 @@ # `@fujocoded/astro-ao3-loader` Example +
+ A list of works from AO3 as shown in this example. Features title, author, ratings and relationships +
+ This example shows the `@fujocoded/astro-ao3-loader` library in action. Inside, you'll see (among others) the following folders and files: ```text diff --git a/astro-ao3-loader/__examples__/works-list/src/pages/index.astro b/astro-ao3-loader/__examples__/works-list/src/pages/index.astro index 5e6d7cd..e141cf7 100644 --- a/astro-ao3-loader/__examples__/works-list/src/pages/index.astro +++ b/astro-ao3-loader/__examples__/works-list/src/pages/index.astro @@ -26,7 +26,7 @@ const series = await getCollection("series"); @fujocoded/astro-ao3-loader example -

Hello fujin

+

Hello, fujin!