---
title: "Understanding Groups"
description: "Learn how to organize entries into groups for better navigation"
---

**Groups** are collections of related entries. A group is a sidebar section that can contain multiple pages.

## What is a Group?

A group organizes entries into a logical category:

```
Group: "Getting Started"
��� Entry: Introduction
��� Entry: Installation
���� Entry: First Steps
```

When rendered in the sidebar, a group becomes a collapsible section. Users can expand/collapse the group to see or hide its entries.

## Group Properties

Every group must have:

### Required Properties

**ID** (unique identifier)

```typescript
{ id: "getting-started", ... }
```

**Label** (display name in sidebar)

```typescript
{ label: "Getting Started", ... }
```

### Optional Properties

**Icon** (emoji or SVG reference)

```typescript
{ icon: "", ... }  // Shows next to group label
```

**Path** (folder to scan, defaults to ID)

```typescript
{ path: "my-custom-path", ... }  // If different from ID
```

**AutoGenerated** (auto-discover entries)

```typescript
{ autoGenerated: true, ... }  // Scan folder for files
```

## Creating Groups

### Configuration Location

Groups are configured in `data/config.ts` under `SIDEBAR_NAVIGATION`:

```typescript
export const SIDEBAR_NAVIGATION = {
    "my-docs": {
        defaultTab: { label: "Docs", icon: "�" },
        groups: [
            // Your groups go here
        ],
    },
};
```

### Basic Group Example

```typescript
{
    id: "guides",
    label: "User Guides",
    icon: "�",
    entries: [
        { slug: "guides/getting-started" },
        { slug: "guides/installation" },
        { slug: "guides/configuration" },
    ],
}
```

**Creates sidebar:**

```
� User Guides
��� Getting Started
��� Installation
���� Configuration
```

## Group Types

### Type 1: Manual Groups

Explicitly list every entry in order:

```typescript
{
    id: "getting-started",
    label: "Getting Started",
    entries: [
        { slug: "getting-started/introduction" },
        { slug: "getting-started/installation" },
        { slug: "getting-started/quick-start" },
    ],
}
```

**Advantages:** Full control, precise ordering, curated selection
**Disadvantages:** Must maintain list, new files won't auto-appear

### Type 2: Auto-Generated Groups

Files are discovered automatically from folder:

```typescript
{
    id: "features",
    label: "Features",
    autoGenerated: true,
}
```

**Discovers all .md/.mdx files in `content/my-docs/features/` folder, sorted alphabetically.**

**Advantages:** Convenient, no maintenance, grow naturally
**Disadvantages:** Order is alphabetical, less control

### Type 3: Hybrid Groups

Pin important entries first, rest auto-discover:

```typescript
{
    id: "guides",
    label: "Guides",
    entries: [
        { slug: "guides/overview" },        // Always first
        { slug: "guides/quick-start" },     // Always second
    ],
    autoGenerated: true,  // Rest discovered alphabetically
}
```

**Creates sidebar:**

```
Guides
��� Overview          (manual, position 1)
��� Quick Start       (manual, position 2)
��� API Reference     (auto-discovered)
��� Configuration     (auto-discovered)
���� Troubleshooting   (auto-discovered)
```

## Group in File System

Groups are typically organized by folder, but folder structure is separate from navigation configuration:

```
File System:
��� content/my-docs/
�   ��� getting-started/
�   �   ��� intro.md
�   �   ���� install.md
�   ��� features/
�   �   ��� auth.md
�   �   ���� payments.md
�   ���� troubleshooting.md

Navigation Config (data/config.ts):
groups: [
    {
        id: "getting-started",
        label: "Getting Started",
        autoGenerated: true,  // Scans content/my-docs/getting-started/
    },
    {
        id: "features",
        label: "Features",
        autoGenerated: true,  // Scans content/my-docs/features/
    },
]
```

The folder and group ID match, but they're independent concepts.

## Next Steps

Learn about:

- [Nested Groups](/docs/navigation-system/core-concepts/nested-groups) - Groups within groups
- [Tabs](/docs/navigation-system/core-concepts/tabs) - Top-level navigation contexts
- [Configuration Guide](/docs/configuration/basics/sidebar-structure)