diff --git a/apps/docs/content/docs/headless/contentlayer/config.mdx b/apps/docs/content/docs/headless/contentlayer/config.mdx
deleted file mode 100644
index 6e1283d38..000000000
--- a/apps/docs/content/docs/headless/contentlayer/config.mdx
+++ /dev/null
@@ -1,58 +0,0 @@
----
-title: Configuration
-description: Learn how to use Contentlayer with Next Docs
----
-
-Next Docs has native support for Contentlayer, and provides default
-configuration with required MDX plugins.
-
-## Setup
-
-1. Edit your configuration.
-
-```ts title="contentlayer.config.ts"
-import { makeSource } from 'contentlayer/source-files';
-import { defaultConfig } from 'next-docs-zeta/contentlayer/configuration';
-
-export default makeSource(defaultConfig);
-```
-
-
- Configuration file **can't** be imported from Next.js runtime.
-
-
-2. Load the files with Source API.
-
-```ts
-import { allDocs, allMeta } from 'contentlayer/generated';
-import { createContentlayerSource } from 'next-docs-zeta/contentlayer';
-import { loader } from 'next-docs-zeta/source';
-
-export const docs = loader({
- baseUrl: '/docs',
- rootDir: 'docs',
- source: createContentlayerSource(allMeta, allDocs),
-});
-```
-
-## Pages Structure
-
-All documents should be located in `/content` or `/content/docs`.
-
-
-
-
-
-## Advanced
-
-Next Docs Zeta also adds extra functionalities to Contentlayer, making it more
-convenient to use and straightforward.
-
-### Adding Icons
-
-You can configure the icon handler in
-the [`loader`](/docs/headless/source-api#icons).
diff --git a/apps/docs/content/docs/headless/contentlayer/index.mdx b/apps/docs/content/docs/headless/contentlayer/index.mdx
index e9d495b81..6e1283d38 100644
--- a/apps/docs/content/docs/headless/contentlayer/index.mdx
+++ b/apps/docs/content/docs/headless/contentlayer/index.mdx
@@ -1,5 +1,58 @@
---
-title: Contentlayer
-index: true
-description: Use Next Docs with Contentlayer
+title: Configuration
+description: Learn how to use Contentlayer with Next Docs
---
+
+Next Docs has native support for Contentlayer, and provides default
+configuration with required MDX plugins.
+
+## Setup
+
+1. Edit your configuration.
+
+```ts title="contentlayer.config.ts"
+import { makeSource } from 'contentlayer/source-files';
+import { defaultConfig } from 'next-docs-zeta/contentlayer/configuration';
+
+export default makeSource(defaultConfig);
+```
+
+
+ Configuration file **can't** be imported from Next.js runtime.
+
+
+2. Load the files with Source API.
+
+```ts
+import { allDocs, allMeta } from 'contentlayer/generated';
+import { createContentlayerSource } from 'next-docs-zeta/contentlayer';
+import { loader } from 'next-docs-zeta/source';
+
+export const docs = loader({
+ baseUrl: '/docs',
+ rootDir: 'docs',
+ source: createContentlayerSource(allMeta, allDocs),
+});
+```
+
+## Pages Structure
+
+All documents should be located in `/content` or `/content/docs`.
+
+
+
+
+
+## Advanced
+
+Next Docs Zeta also adds extra functionalities to Contentlayer, making it more
+convenient to use and straightforward.
+
+### Adding Icons
+
+You can configure the icon handler in
+the [`loader`](/docs/headless/source-api#icons).
diff --git a/apps/docs/content/docs/ui/index.mdx b/apps/docs/content/docs/ui/index.mdx
index 272001cb6..c3ee44164 100644
--- a/apps/docs/content/docs/ui/index.mdx
+++ b/apps/docs/content/docs/ui/index.mdx
@@ -34,7 +34,7 @@ you prefer, such as [Contentlayer](https://contentlayer.dev) and `next-docs-mdx`
This is a list of sources supported by Next Docs:
- [Next Docs MDX](/docs/mdx)
-- [Contentlayer](/docs/headless/contentlayer/config)
+- [Contentlayer](/docs/headless/contentlayer)
You have to configure the library correctly following their setup guide before continuing.
diff --git a/packages/headless/test/graph.test.ts b/packages/headless/test/storage.test.ts
similarity index 66%
rename from packages/headless/test/graph.test.ts
rename to packages/headless/test/storage.test.ts
index 5ce46b3ce..dd8a48624 100644
--- a/packages/headless/test/graph.test.ts
+++ b/packages/headless/test/storage.test.ts
@@ -1,7 +1,40 @@
import { loader } from '@/source';
+import { Storage } from '@/source/file-system';
import { parseFilePath, parseFolderPath } from '@/source/path';
import { describe, expect, test } from 'vitest';
+describe('Virtual Storage', () => {
+ const storage = new Storage();
+
+ test('Writing', () => {
+ storage.write('test.mdx', {
+ type: 'page',
+ data: { title: 'Hello' },
+ slugs: ['test'],
+ url: '/test',
+ });
+ storage.write('meta.json', { type: 'meta', data: { pages: ['test'] } });
+
+ expect(storage.list().length).toBe(2);
+ });
+
+ test('Reading', () => {
+ expect(storage.read('test')).toBeDefined();
+ expect(storage.read('meta')).toBeDefined();
+ });
+
+ test('Nested Directories', () => {
+ storage.write('dir1/dir2/meta.json', {
+ type: 'meta',
+ data: { pages: ['test'] },
+ });
+
+ expect(storage.readDir('dir1')).toBeDefined();
+ expect(storage.readDir('dir1/dir2')).toBeDefined();
+ expect(storage.read('dir1/dir2/meta')).toBeDefined();
+ });
+});
+
describe('Building File Graph', () => {
test('Simple', () => {
loader({
@@ -41,60 +74,6 @@ describe('Building File Graph', () => {
});
test('Nested Directories', async () => {
- loader({
- source: {
- files: [
- {
- type: 'page',
- path: 'test.mdx',
- data: {
- title: 'Hello',
- },
- },
- {
- type: 'meta',
- path: 'meta.json',
- data: {
- pages: ['test', 'nested'],
- },
- },
- {
- type: 'page',
- path: '/nested/test.mdx',
- data: {
- title: 'Nested Page',
- },
- },
- ],
- },
- transformers: [
- ({ storage }) => {
- expect(storage.root().children).toEqual([
- expect.objectContaining({
- type: 'page',
- file: parseFilePath('test.mdx'),
- }),
- expect.objectContaining({
- type: 'meta',
- file: parseFilePath('meta.json'),
- }),
- expect.objectContaining({
- type: 'folder',
- file: parseFolderPath('nested'),
- children: [
- expect.objectContaining({
- type: 'page',
- file: parseFilePath('nested/test.mdx'),
- }),
- ],
- }),
- ]);
- },
- ],
- });
- });
-
- test('Complicated Directories', async () => {
loader({
source: {
files: [