# How to add a new report in an existing program

1. Navigate to the respective program in the client-side code base where the report has to be added.
2. Inside the "pages" folder, create an Angular component named after the report using the following CLI command: `ng g c <report-name>`

<figure><img src="/files/7racJF4jKXX2HXgp9ALM" alt=""><figcaption></figcaption></figure>

3. Once the component is created, it will contain four files - `ts`, `spec-ts`, `html`, and `css`.
4. Fill the TypeScript and HTML files with the reference of other programs. You may need to have knowledge about Angular and how functions have been designed.
5. Include this component in the program HTML file to be rendered.
6. Under the same program name, there will be a config folder that contains a configuration file for the entire program (a JSON file).
7. If any filters are required for the specific report, add an object under the "filter" key in the above configuration file which specifies the filter and its values required for the report. You may need Angular knowledge to fill the object with the appropriate structure.

<figure><img src="/files/t9JtNEYXOdy3s7WOdIgO" alt=""><figcaption></figcaption></figure>

<br>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://cqube.sunbird.org/use-cqube/visualizing-the-data/enhance-customize-cqube/test-for-one-step-installation.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
