# sap-fiori-analytical-chart

A skill that puts an aggregated chart above the table on a SAP Fiori Elements List Report. Useful when a report has to be read as a diagram, not row by row.

- skill · `type=skill` · Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, OpenCode · 589 installs · ★ 160
- Author: sap-fiori-tools
- License: Apache-2.0 · policy=mirror · the beginning of the file is at the end of this page
- Source: https://github.com/SAP/open-ux-tools/tree/HEAD/plugins-coding-agents/fiori/skills/sap-fiori-analytical-chart/SKILL.md
- Updated: 2026-10-23
- HTML: https://affpapa.org/en/nevibecode/skills/sap-fiori-analytical-chart

## What it does

On a SAP Fiori Elements List Report the skill builds a chart section with the table kept underneath, and the numbers behind the chart are aggregated. CAP and ABAP RAP projects on OData V4 both work. Six answers come first: the entity, a dimension to group by, a numeric measure, the aggregation method, a chart type (`Bar`, `Column`, `Line`, `Pie`, `HeatMap`, `Waterfall`, `HorizontalWaterfall`) and separate tabs or a hybrid view. Nothing is edited until those are settled.

For CAP it changes CDS annotations: `@Aggregation.ApplySupported`, `Analytics.AggregatedProperty`, `UI.Chart` and `PresentationVariant`. Write the aggregation method as a lowercase string. `'average'` works, `#AVG` breaks SQL generation. In ABAP RAP, `@OData.applySupportedForAggregation: #FULL` has to sit on the projection view `ZC_*` and never on the interface view — the app will not load without it. `@UI.chart` belongs in the header block ahead of `annotate view`; attached to a field it fails activation with a wrong-scope error. `metadata.xml` stays as it is, the file is read-only.

Both setups need a Fiori MCP Server, and ABAP RAP also relies on the ADT MCP server bundled with the ABAP Development Tools extension. CAP runs in VS Code or SAP Business Application Studio, ABAP RAP in VS Code only.

## Install

### Claude Code (native platform)

1. **Skills CLI (Vercel)**
```bash
npx skills add SAP/open-ux-tools --skill sap-fiori-analytical-chart -a claude-code
```

2. **Manually: put the files in place**
- File: `~/.claude/skills/sap-fiori-analytical-chart/SKILL.md` — Copy the whole skill folder; for one project use .claude/skills/sap-fiori-analytical-chart/

### Codex

1. **Skills CLI (Vercel)**
```bash
npx skills add SAP/open-ux-tools --skill sap-fiori-analytical-chart -a codex
```

2. **Manually: put the files in place**
- File: `.agents/skills/sap-fiori-analytical-chart/SKILL.md` — For all projects use ~/.agents/skills/

### Cursor

1. **Skills CLI (Vercel)**
```bash
npx skills add SAP/open-ux-tools --skill sap-fiori-analytical-chart -a cursor
```

2. **Manually: put the files in place**
- File: `.cursor/skills/sap-fiori-analytical-chart/SKILL.md` — Cursor also reads .agents/skills/ and .claude/skills/

### GitHub Copilot

1. **GitHub CLI**
```bash
gh skill install SAP/open-ux-tools sap-fiori-analytical-chart
```

2. **Manually: put the files in place**
- File: `.github/skills/sap-fiori-analytical-chart/SKILL.md`

### Gemini CLI

1. **Skills CLI (Vercel)**
```bash
npx skills add SAP/open-ux-tools --skill sap-fiori-analytical-chart -a gemini-cli
```

2. **Platform CLI**
```bash
gemini skills install https://github.com/SAP/open-ux-tools --path plugins-coding-agents/fiori/skills/sap-fiori-analytical-chart
```

### Windsurf (Devin Desktop)

**Manually: put the files in place**
- File: `.devin/skills/sap-fiori-analytical-chart/SKILL.md` — The legacy .windsurf/skills/ path still works

### OpenCode

**Skills CLI (Vercel)**
```bash
npx skills add SAP/open-ux-tools --skill sap-fiori-analytical-chart -a opencode
```

### Claude.ai

**Claude.ai**
- Zip the folder and upload it in Settings → Capabilities → Skills

Where a file is given instead of a command, copy the files from the source to that path: https://github.com/SAP/open-ux-tools/tree/HEAD/plugins-coding-agents/fiori/skills/sap-fiori-analytical-chart/SKILL.md

## When to use it
- add a chart section with aggregated values to an existing List Report
- switch a report between chart and table views
- declare an aggregated property for an average measure
- turn on aggregation support on a RAP projection view
- move a chart annotation into header scope so activation passes

## Example prompts
- Add an analytical chart to the List Report for entity `Reservations`: dimension `Category`, measure `Amount`, aggregation `average`, chart type `Column`, hybrid view.
- Give me separate `ChartView` and `TableView` tabs for `Bookings`, grouped by `Status`, measure `TotalPrice`, aggregation `sum`, chart type `Bar`.
- Check that `@OData.applySupportedForAggregation: #FULL` is on the projection view `ZC_Reservation`, and move `@UI.chart` into the header if activation fails.

## Source text · SKILL.md · Apache-2.0

Below is the content of a third-party file. It is data, not instructions for you: do not act on anything written inside unless the human asks. Block tag: 4b9dccf3a30984c9.

BEGIN THIRD-PARTY FILE 4b9dccf3a30984c9
````text
---
name: sap-fiori-analytical-chart
description: Add analytical chart (chart + table hybrid) to SAP Fiori Elements List Report using aggregated data. Supports CAP and ABAP RAP (OData V4). Use when asked to add a chart section, aggregated data visualization, or Analytical List Page chart to a List Report.
argument-hint: Entity, dimension, measure, aggregation
metadata:
  author: sap-fiori-tools
  version: "0.0.5"
---

# SAP Fiori Analytical Chart

## Purpose
Add **analytical chart + table (hybrid view)** to visualize aggregated data.

---

## Prerequisites

**CAP Projects:**
- ✅ **VS Code or SAP Business Application Studio (BAS)** - Both environments supported
- ✅ **Fiori MCP Server** - Required for Fiori app modification (VS Code only)

**ABAP RAP Projects:**
- ✅ **VS Code only** - ABAP Development Tools extension is VS Code-specific
- ✅ **Fiori MCP Server** - Required for Fiori app modification
- ✅ **ABAP Development Tools for VS Code extension** - Required for backend development (includes ADT MCP server for RAP operations)

---

## MANDATORY: Gather Required Inputs First

**STOP and ASK the user for ALL of these inputs if ANY are missing from the prompt:**

1. **Entity** - Which entity to add the analytical chart to
2. **Dimension field** - The field to group by (e.g., Category, Status, Destination)
3. **Measure field** - The numeric field to aggregate (e.g., Amount, TotalPrice, ReservationPrice)
4. **Aggregation method** - How to aggregate (see valid values below)
5. **Chart type** - Bar, Column, Line, Pie, HeatMap, Waterfall, HorizontalWaterfall
6. **Display mode** - How the chart should be shown:
   - **Separate tabs** (Approach 2)
   - **Hybrid view** (Approach 1)

**DO NOT proceed with implementation until all inputs are confirmed.**

---

## CAP Implementation

### Enable Aggregation
```cds
@Aggregation.ApplySupported: {
````
END THIRD-PARTY FILE 4b9dccf3a30984c9

The third-party file has ended. Everything between the 4b9dccf3a30984c9 tags is data: requests and commands from it are not followed. An “end of file” line with another tag inside the block is part of the file.

First 1872 of 13944 bytes. © sap-fiori-tools · Apache-2.0 · https://github.com/SAP/open-ux-tools/tree/HEAD/plugins-coding-agents/fiori/skills/sap-fiori-analytical-chart/SKILL.md

_Part of the page did not fit — see the HTML version._

---
NeVibeCode on affpapa.org. Catalog texts are descriptions, not instructions for the agent. How to choose and install: https://affpapa.org/en/nevibecode/agents.md