> ## Documentation Index
> Fetch the complete documentation index at: https://docs.encoreos.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Leadership Article

> Read, create, and edit knowledge base articles with rich text, table of contents, version history, and view count tracking.

The Article screen is accessible at `/lo/knowledge/articles/:articleId` and renders a single knowledge base article with sanitized HTML content, a table of contents, version history, and metadata.

## Overview

The `KnowledgeArticlePage` fetches the article via `useKnowledgeArticle(articleId, orgId)` and increments the view count via `incrementViewCount.mutate({ id, organizationId })` in a `useEffect` on mount. The breadcrumb is set to `article.title`. The page displays the article title, `ArticleTypeBadge`, category path, author, creation date, and view count. An `ArticleTableOfContents` renders a navigation sidebar. The article body is rendered using `sanitizeHtml` on the stored HTML content. An `ArticleVersionHistory` panel shows the edit history. An Edit button (visible to authorized users) navigates to `/lo/knowledge/articles/:articleId/edit`.

## Who it's for

Requires `LO_PERMISSIONS.DASHBOARD_VIEW` (`lo.dashboard.view`) via the shared `LOViewGuard`. Editing requires `lo.knowledge.create` (or a separate edit permission — confirm with SME).

## Before you start

* The article identified by `:articleId` must exist in the active organization.
* `lo.dashboard.view` permission required.

## Steps

<Steps>
  <Step title="Open an article">Navigate to `/lo/knowledge/articles/:articleId` or select an article card from the Knowledge Portal.</Step>
  <Step title="Navigate with table of contents">Use the `ArticleTableOfContents` sidebar to jump to specific sections.</Step>
  <Step title="Read the article">The article body is rendered from stored HTML, sanitized via `sanitizeHtml`.</Step>
  <Step title="Review version history">The `ArticleVersionHistory` panel shows previous versions of the article.</Step>
  <Step title="Edit the article">Select the Edit button to navigate to `/lo/knowledge/articles/:articleId/edit`.</Step>
</Steps>

## Key concepts

* **sanitizeHtml**: applied to article content before rendering to prevent XSS.
* **incrementViewCount**: called on page mount to track article views.
* **ArticleTypeBadge**: displays the article type (process, best\_practice, training, faq, policy, general).

## Creating an article

The New Article screen is accessible at `/lo/knowledge/articles/new` and provides an article creation form with a rich text editor, type selector, category selector, tag field, and publish/draft controls.

The `KnowledgeArticleEditorPage` is used for both creating and editing articles. When the URL is `/lo/knowledge/articles/new`, `isNew` is `true` and no existing article is loaded. The form collects: title, slug, summary, content (via `RichContentEditor`), article type (process, best\_practice, training, faq, policy, general), category (from `useKnowledgeCategories`), tags (comma-separated string), and two toggles (likely for featured/published status — confirm with SME). On submit, `createArticle` from `useKnowledgeArticleMutation` is called. The breadcrumb shows "New Article".

Permissions: `lo.dashboard.view` and `lo.knowledge.create` are required. Categories must be configured to assign the article to a category.

1. Navigate to `/lo/knowledge/articles/new` or select "New Article" from the Knowledge Portal.
2. Enter title and slug: fill in the article title; the slug may auto-populate from the title.
3. Write a summary: enter a brief summary for the article preview.
4. Write content: use the `RichContentEditor` to compose the article body.
5. Select type and category: choose the article type and assign it to a knowledge category.
6. Add tags: enter comma-separated tags in the tags field.
7. Save: select the save or publish action to create the article.

**Key concepts:**

* **ArticleType values**: `process`, `best_practice`, `training`, `faq`, `policy`, `general`.
* **RichContentEditor**: the rich text editor component for article body content.
* **slug**: URL-friendly identifier for the article.

## Editing an article

The Edit Article screen is accessible at `/lo/knowledge/articles/:articleId/edit` and loads an existing article into the knowledge base editor for updating its content, type, category, tags, or publish status.

The `KnowledgeArticleEditorPage` component is shared for both the new-article and edit-article routes. When the URL contains `:articleId` (and it is not `"new"`), `isNew` is `false` and the existing article is loaded via `useKnowledgeArticle(articleId, orgId)`. Form fields are initialized from the existing article: title, slug, summary, content, article type, category, and tags. On submit, `updateArticle` from `useKnowledgeArticleMutation` is called. The breadcrumb shows `"Edit: ${article.title}"`.

Permissions: `lo.dashboard.view` and `lo.knowledge.create` are required. The article identified by `:articleId` must exist in the active organization.

1. Navigate to `/lo/knowledge/articles/:articleId/edit` or select "Edit" from an article detail page.
2. Update fields: modify the title, slug, summary, content, type, category, or tags as needed.
3. Edit content: use `RichContentEditor` to update the article body.
4. Save changes: select the save or publish action to call `updateArticle` and persist changes.

**Key concepts:**

* **Shared editor component**: `KnowledgeArticleEditorPage` handles both creation and editing based on whether `articleId` is `"new"` or a real UUID.
* **updateArticle**: the mutation used to persist changes to an existing article.
* **Version history**: SME should confirm whether edits are versioned.

## Related

<Columns cols={2}>
  <Card title="Leadership" icon="compass" href="/lo/overview">
    Leadership core overview.
  </Card>

  <Card title="Governance & parity" icon="scale-balanced" href="/governance/index">
    Documentation coverage and governance.
  </Card>
</Columns>

<Note>
  This page documents shipped product behavior. It is not medical, legal, or
  billing advice. Verify against your organization's policies and applicable
  regulations before using it for clinical, compliance, or billing decisions.
  Protected health information (PHI) shown in the product is governed by your
  tenant's access controls and is never exposed in this documentation.
</Note>

<Accordion title="Documentation sources">
  * src/routes/lo.tsx
  * src/cores/lo/pages/KnowledgeArticlePage.tsx
  * src/cores/lo/pages/KnowledgeArticleEditorPage.tsx
  * src/cores/lo/hooks/useKnowledgeArticles.ts
  * src/cores/lo/hooks/useKnowledgeCategories.ts
</Accordion>