Skip to content

Commit

Permalink
Proposal to move path configuration to dedicated page (#540)
Browse files Browse the repository at this point in the history
  • Loading branch information
simonswiss committed Aug 18, 2023
1 parent dde276d commit 412a577
Show file tree
Hide file tree
Showing 5 changed files with 101 additions and 89 deletions.
4 changes: 4 additions & 0 deletions docs/src/content/navigation.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,10 @@ navGroups:
link:
discriminant: page
value: singletons
- label: Path configuration
link:
discriminant: page
value: path-configuration
- label: Reader API
link:
discriminant: page
Expand Down
2 changes: 1 addition & 1 deletion docs/src/content/pages/collections.mdoc
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,7 @@ testimonials: collection({

By default, Keystatic will store entries at the root of your project, in a directory that matches the collection key.

You can learn more about the `path` option on the [Organised content page](/docs/how-keystatic-organises-your-content#collections).
You can learn more about the `path` option on the [Path configuration page](/docs/path-configuration).

## Type signature

Expand Down
90 changes: 3 additions & 87 deletions docs/src/content/pages/how-keystatic-organises-your-content.mdoc
Original file line number Diff line number Diff line change
Expand Up @@ -8,95 +8,11 @@ Those are defined in the [Keystatic configuration](/docs/configuration).

You get a lot of control and flexibility with *where* your content gets generated, both at the `collection` or `singleton` level, and at the `field` level for certain field types, like images.

## Content path
### Path configuration

You can define *where* Keystatic should store collection entries and singletons via the `path` property in the collection/singleton top-level options.
You can define _where_ Keystatic should store collection entries and singletons via the `path` property in the collection/singleton top-level options.

```javascript
// Keystatic config
export default config({
collections: {
posts: collection({
label: 'Posts',
path: 'content/posts/*/',
// ...
})
},
singletons: {
settings: singleton({
label: 'Settings',
path: 'content/posts/',
// ...
})
}
})

```

The optional trailing slash `/` on that path has an impact on the content structure - read below for more details on `collection paths` and `singleton paths`.

### Path wildcard for collections

The `path` property for `collections` must contain a `*` wildcard.

It represents the `slug` of an entry.

This wildcard gives you flexibility and control over your where your content is being output.

### Nested folder output example

{% aside icon="👉" %}
`path: 'packages/design-system/*/docs/'`
{% /aside %}

Imagine a Design System inside a monorepo:

```sh
root
├── packages
├── design-system
├── button
└── src
├── dropdown
└── src
└── apps
└── docs(keystatic)
```

Your Keystatic site lives in `apps/docs`, but you want your documentation entries in `packages/design-system/{component-name}/docs/`, to collocate them with each component.

The following path will let you do exactly that:

```
path: 'packages/design-system/*/docs/'
```

### Nested slug example

{% aside icon="👉" %}
`path: 'content/posts/**'`
{% /aside %}

There may be situations where you need the `slug` of an entry to be following a multi-folder structure.

Say you want the **same collection** to support this following tree structure:

```sh
content
├── posts
├── en
└── post-1.mdoc
├── fr
└── post-1.mdoc
```

You can enable this by using the `**` wildcard in your `path`:

```
path: 'content/posts/**'
```

Since Keystatic `slugs` can contain `/` characters, you construct a multi-folder structure with `slug` field values like: `en/post-1` and `fr/post-1`.
We will go over core concepts here, but check out the [Path configuration page](/docs/path-configuration) for more details and examples.

---

Expand Down
92 changes: 92 additions & 0 deletions docs/src/content/pages/path-configuration.mdoc
Original file line number Diff line number Diff line change
@@ -0,0 +1,92 @@
---
title: Path configuration
summary: Granular control over where Keystatic stores content.
---

You can define *where* Keystatic should store collection entries and singletons via the `path` property in the collection/singleton top-level options.

```javascript
// Keystatic config
export default config({
collections: {
posts: collection({
label: 'Posts',
path: 'content/posts/*/',
// ...
})
},
singletons: {
settings: singleton({
label: 'Settings',
path: 'content/posts/',
// ...
})
}
})

```

The optional trailing slash `/` on that path has an impact on the content structure - read below for more details on `collection paths` and `singleton paths`.

## Path wildcard for collections

The `path` property for [collections](/docs/collections) must contain a `*` wildcard.

It represents the `slug` of an entry.

This wildcard gives you flexibility and control over your where your content is being output.

## Nested folder output example

{% aside icon="👉" %}
`path: 'packages/design-system/*/docs/'`
{% /aside %}

Imagine a Design System inside a monorepo:

```sh
root
├── packages
├── design-system
├── button
└── src
├── dropdown
└── src
└── apps
└── docs(keystatic)
```

Your Keystatic site lives in `apps/docs`, but you want your documentation entries in `packages/design-system/{component-name}/docs/`, to collocate them with each component.

The following path will let you do exactly that:

```
path: 'packages/design-system/*/docs/'
```

## Nested slug example

{% aside icon="👉" %}
`path: 'content/posts/**'`
{% /aside %}

There may be situations where you need the `slug` of an entry to be following a multi-folder structure.

Say you want the **same collection** to support this following tree structure:

```sh
content
├── posts
├── en
└── post-1.mdoc
├── fr
└── post-1.mdoc
```

You can enable this by using the `**` wildcard in your `path`:

```
path: 'content/posts/**'
```

Since Keystatic `slugs` can contain `/` characters, you construct a multi-folder structure with `slug` field values like: `en/post-1` and `fr/post-1`.
2 changes: 1 addition & 1 deletion docs/src/content/pages/singletons.mdoc
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@ settings: singleton({

By default, Keystatic will store a singleton at the root of your project, in a directory that matches the singleton key.

You can learn more about the `path` option on the [Organised content page](/docs/how-keystatic-organises-your-content#singletons).
You can learn more about the `path` option on the [Path configuration page](/docs/path-configuration).

## Type signature

Expand Down

3 comments on commit 412a577

@vercel
Copy link

@vercel vercel bot commented on 412a577 Aug 18, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

keystatic – ./dev-projects/next-app

keystatic-thinkmill-labs.vercel.app
keystatic.vercel.app
keystatic-git-main-thinkmill-labs.vercel.app

@vercel
Copy link

@vercel vercel bot commented on 412a577 Aug 18, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

keystar-ui – ./design-system/docs

keystar-ui-thinkmill-labs.vercel.app
keystar-ui-git-main-thinkmill-labs.vercel.app
keystar-ui.vercel.app
voussoir.vercel.app

@vercel
Copy link

@vercel vercel bot commented on 412a577 Aug 18, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please sign in to comment.