[Docs] Fix warnings and suggestions from vale

.vale/styles/Microsoft/Acronyms.yml

@@ -70,3 +70,4 @@ exceptions:
   - XSS
   - YAML
   - ZIP
+  - KPI

.vale/styles/Microsoft/Foreign.yml

@@ -7,7 +7,7 @@ nonword: true
 action:
   name: replace
 swap:
-  '\b(?:eg|e\.g\.)[\s,]': for example
-  '\b(?:ie|i\.e\.)[\s,]': that is
+  '\b(?:eg|e\.g\.|e.g)[\s,]': for example
+  '\b(?:ie|i\.e\.|i.e)[\s,]': that is
   '\b(?:viz\.)[\s,]': namely
   '\b(?:ergo)[\s,]': therefore

.vale/styles/Microsoft/Headings.yml

@@ -84,3 +84,8 @@ exceptions:
   - URL
   - URLs
   - Vizro
+  - KPI
+  - HTML
+  - OpenAI
+  - Key Performance Indicator
+  - 3D

CONTRIBUTING.md

@@ -3,4 +3,4 @@
 Contributions of all experience levels are welcome! If you're interested in making a contribution,
 please refer to our [Contributing Guide](https://vizro.readthedocs.io/en/stable/pages/explanation/contributing/) for more information.
 
-The easiest way to get up and running quickly is to [open the repository in GitHub Codespaces](https://github.com/codespaces/new?hide_repo_select=true&ref=main&repo=626855142). This will create a temporary development environment with all the necessary configurations, making it especially convenient for tasks like reviewing pull requests.
+The easiest way to get up and running is to [open the repository in GitHub Codespaces](https://github.com/codespaces/new?hide_repo_select=true&ref=main&repo=626855142). This will create a temporary development environment with all the necessary configurations, making it especially convenient for tasks like reviewing pull requests.

vizro-ai/changelog.d/20240621_124149_huong_li_nguyen_fix_vale.md

@@ -0,0 +1,48 @@
+<!--
+A new scriv changelog fragment.
+
+Uncomment the section that is right (remove the HTML comment wrapper).
+-->
+
+<!--
+### Highlights ✨
+
+- A bullet item for the Highlights ✨ category with a link to the relevant PR at the end of your entry, e.g. Enable feature XXX ([#1](https://github.com/mckinsey/vizro/pull/1))
+
+-->
+<!--
+### Removed
+
+- A bullet item for the Removed category with a link to the relevant PR at the end of your entry, e.g. Enable feature XXX ([#1](https://github.com/mckinsey/vizro/pull/1))
+
+-->
+<!--
+### Added
+
+- A bullet item for the Added category with a link to the relevant PR at the end of your entry, e.g. Enable feature XXX ([#1](https://github.com/mckinsey/vizro/pull/1))
+
+-->
+<!--
+### Changed
+
+- A bullet item for the Changed category with a link to the relevant PR at the end of your entry, e.g. Enable feature XXX ([#1](https://github.com/mckinsey/vizro/pull/1))
+
+-->
+<!--
+### Deprecated
+
+- A bullet item for the Deprecated category with a link to the relevant PR at the end of your entry, e.g. Enable feature XXX ([#1](https://github.com/mckinsey/vizro/pull/1))
+
+-->
+<!--
+### Fixed
+
+- A bullet item for the Fixed category with a link to the relevant PR at the end of your entry, e.g. Enable feature XXX ([#1](https://github.com/mckinsey/vizro/pull/1))
+
+-->
+<!--
+### Security
+
+- A bullet item for the Security category with a link to the relevant PR at the end of your entry, e.g. Enable feature XXX ([#1](https://github.com/mckinsey/vizro/pull/1))
+
+-->

vizro-ai/docs/pages/user-guides/add-generated-chart-usecase.md

@@ -107,9 +107,9 @@ This object must then be passed to the `figure` argument of the Vizro [Graph](ht
 
 ### Use Vizro-AI dynamically to return a `fig` object
 
-Alternatively, we can use Vizro-AI dynamically and assign the output of `plot()` directly to the fig variable, enabling its reuse in the `vm.Graph.figure` argument.
+We can also use Vizro-AI dynamically and assign the output of `plot()` directly to the fig variable, enabling its reuse in the `vm.Graph.figure` argument.
 This method offers streamlined efficiency, eliminating the need for code copying.
-However, it is important to note that each dashboard run triggers an API call to OpenAI, potentially escalating costs, although this can be avoided if the `fig` object is stored and retrieved as needed, instead of making repeated calls to `plot()`.
+However, it is important to note that each dashboard run triggers an API call to OpenAI, possibly escalating costs, although this can be avoided if the `fig` object is stored and retrieved as needed, instead of making repeated calls to `plot()`.
 
 Executing the code below yields the identical dashboard as the example above.
 

vizro-ai/docs/pages/user-guides/chart-examples.md

@@ -5,7 +5,7 @@ Take a look at some more advanced charts that can be created with Vizro-AI using
 ### Polar bar chart
 
 A polar bar chart is a circular graph where each axis represents a different variable, typically used for displaying cyclical or directional data.
-It's suitable for quickly comparing multiple variables across different categories or directions. Let's make one using Vizro-AI.
+It's suitable for comparing multiple variables across different categories or directions. Let's make one using Vizro-AI.
 
 
 !!! example "Polar Bar Chart"

vizro-core/changelog.d/20240621_124137_huong_li_nguyen_fix_vale.md

@@ -0,0 +1,48 @@
+<!--
+A new scriv changelog fragment.
+
+Uncomment the section that is right (remove the HTML comment wrapper).
+-->
+
+<!--
+### Highlights ✨
+
+- A bullet item for the Highlights ✨ category with a link to the relevant PR at the end of your entry, e.g. Enable feature XXX ([#1](https://github.com/mckinsey/vizro/pull/1))
+
+-->
+<!--
+### Removed
+
+- A bullet item for the Removed category with a link to the relevant PR at the end of your entry, e.g. Enable feature XXX ([#1](https://github.com/mckinsey/vizro/pull/1))
+
+-->
+<!--
+### Added
+
+- A bullet item for the Added category with a link to the relevant PR at the end of your entry, e.g. Enable feature XXX ([#1](https://github.com/mckinsey/vizro/pull/1))
+
+-->
+<!--
+### Changed
+
+- A bullet item for the Changed category with a link to the relevant PR at the end of your entry, e.g. Enable feature XXX ([#1](https://github.com/mckinsey/vizro/pull/1))
+
+-->
+<!--
+### Deprecated
+
+- A bullet item for the Deprecated category with a link to the relevant PR at the end of your entry, e.g. Enable feature XXX ([#1](https://github.com/mckinsey/vizro/pull/1))
+
+-->
+<!--
+### Fixed
+
+- A bullet item for the Fixed category with a link to the relevant PR at the end of your entry, e.g. Enable feature XXX ([#1](https://github.com/mckinsey/vizro/pull/1))
+
+-->
+<!--
+### Security
+
+- A bullet item for the Security category with a link to the relevant PR at the end of your entry, e.g. Enable feature XXX ([#1](https://github.com/mckinsey/vizro/pull/1))
+
+-->

vizro-core/docs/pages/explanation/contributing.md

@@ -14,7 +14,7 @@ To raise a feature request, head to our [issues page](https://github.com/mckinse
 
 We are happy to receive general questions around Vizro. Take a look at our [issues page](https://github.com/mckinsey/vizro/issues) and raise a ticket in the category `general question`. We would be grateful if you could check for any similar descriptions in the existing issues before opening a new ticket.
 
-If you are already active on the Plotly Community Forum, you can alternatively ask your question over there in the [Dash Python category](https://community.plotly.com/c/python/25).
+If you are already active on the Plotly Community Forum, you can also ask your question over there in the [Dash Python category](https://community.plotly.com/c/python/25).
 
 ## How to interact with the repository
 

vizro-core/docs/pages/explanation/faq.md

@@ -11,15 +11,14 @@ Here are some answers to frequently asked questions:
 
 * [Which browsers does Vizro support?](#which-browsers-does-vizro-support)
 * [What is the Vizro versioning policy?](#what-is-the-vizro-versioning-policy)
-* [Where can I find example dashboards?](#where-i-can-find-example-dashboards)
+* [Where can I find example dashboards?](#where-can-i-find-example-dashboards)
 * [Why should I use Vizro?](#why-should-i-use-vizro)
 * [How does Vizro differ from Dash or Streamlit?](#how-does-vizro-differ-from-dash-or-streamlit)
 * [How does Vizro compare with Python packages and business intelligence (BI) tools?](#how-does-vizro-compare-with-python-packages-and-business-intelligence-bi-tools)
 * [When would an alternative to Vizro be more suitable?](#when-would-an-alternative-to-vizro-be-more-suitable)
 * [I want to contribute to Vizro, how can I find out more?](contributing.md)
 * [I still have a question. Where can I ask it?](contributing.md/#got-a-vizro-question)
 
-<!-- vale on -->
 
 ## Which browsers does Vizro support?
 Vizro supports the [Chrome browser](https://www.google.com/intl/en_us/chrome/).
@@ -33,11 +32,10 @@ We do not consider frontend changes (such as changing the appearance of a compon
 
     While being in version `0.x.x`, we may introduce breaking changes in minor versions.
 
-## Where I can find example dashboards?
+## Where can I find example dashboards?
 
 Check out our [examples section](../examples/examples.md) which describes the contents of the `examples` folder of the [Vizro GitHub repository](https://github.com/mckinsey/vizro/tree/main/vizro-core/examples).
 
-<!-- vale off -->
 ## Why should I use Vizro?
 
 Vizro is a high-level framework built on top of Dash and Pydantic,

vizro-core/docs/pages/user-guides/custom-figures.md

@@ -125,7 +125,7 @@ adjust the return statement of the function.
 <!-- vale on -->
 
 ### Dynamic HTML header
-Generally, you can create a custom figure for any [Dash component](https://dash.plotly.com/#open-source-component-libraries).
+You can create a custom figure for any [Dash component](https://dash.plotly.com/#open-source-component-libraries).
 Below is an example of a custom figure that returns a `html.H2` component that dynamically updates based on the selected
 name from a filter.
 

vizro-core/docs/pages/user-guides/data.md

@@ -46,7 +46,7 @@ A static data source is the simplest way to send data to your dashboard and shou
 
 ### Supply directly
 
-You can directly supply a pandas DataFrame into components such as [graphs](graph.md), [tables](table.md) and [figures](figure.md).
+You can directly supply a pandas DataFrame into components such as [graphs](graph.md), [tables](table.md), and [figures](figure.md).
 
 The below example uses the Iris data saved to a file `iris.csv` in the same directory as `app.py`. This data can be generated using `px.data.iris()` or [downloaded](../../assets/user_guides/data/iris.csv).
 
@@ -331,7 +331,7 @@ Parametrized data loading is compatible with [caching](#configure-cache). The ca
 
     You should always [treat the content of user input as untrusted](https://community.plotly.com/t/writing-secure-dash-apps-community-thread/54619). For example, you should not expose a filepath to load without passing it through a function like [`werkzeug.utils.secure_filename`](https://werkzeug.palletsprojects.com/en/3.0.x/utils/#werkzeug.utils.secure_filename), or you might enable arbitrary access to files on your server.
 
-It is not possible to pass [nested parameters](parameters.md#nested-parameters) to dynamic data. You can only target top-level arguments of the data loading function and not address nested keys in a dictionary.
+You cannot pass [nested parameters](parameters.md#nested-parameters) to dynamic data. You can only target the top-level arguments of the data loading function, not the nested keys in a dictionary.
 
 ### Filter update limitation
 

vizro-core/docs/pages/user-guides/layouts.md

@@ -1,6 +1,6 @@
 # How to use layouts
 
-The [`Page`][vizro.models.Page] model accepts a `layout` argument that allows for custom arrangement of charts and components on the screen. This guide shows how to customize the grid specifications in the [`Layout`][vizro.models.Layout].
+The [`Page`][vizro.models.Page] model accepts a `layout` argument that enables custom arrangement of charts and components on the screen. This guide shows how to customize the grid specifications in the [`Layout`][vizro.models.Layout].
 
 ## The default layout
 The `layout` argument of the [`Page`][vizro.models.Page] model is optional. If no layout is specified, all charts/components are automatically [**stacked vertically**](layouts.md#vertical-and-horizontal-stacking) on the page in one column.

vizro-core/docs/pages/user-guides/parameters.md

@@ -1,6 +1,6 @@
 # How to use parameters
 
-This guide shows you how to add parameters to your dashboard. One main way to interact with the charts/components on your page is by changing the parameters of the underlying function (`figure` argument) that creates the chart/component. Parameters can also be used to [modify the data loaded into the dashboard itself](data.md/#parametrize-data-loading).
+This guide shows you how to add parameters to your dashboard. One main way to interact with the charts/components on your page is by changing the parameters of the underlying function (`figure` argument) that creates the chart/component. Parameters can also be used to [change the data loaded into the dashboard itself](data.md/#parametrize-data-loading).
 
 The [`Page`][vizro.models.Page] model accepts the `controls` argument, where you can enter a [`Parameter`][vizro.models.Parameter] model. For example, if the charting function has a `title` argument, you could configure a parameter that enables the user to select the chart title with a dropdown.
 

vizro-core/docs/pages/user-guides/table.md

@@ -207,7 +207,7 @@ No specific formatting is available for custom objects and strings, however you
 to format displayed strings automatically.
 
 
-### Styling and modifying the AG Grid
+### Styling and changing the AG Grid
 
 As mentioned above, all [parameters of the Dash AG Grid](https://dash.plotly.com/dash-ag-grid/reference) can be entered as keyword arguments. Below you can find
 an example of a styled AG Grid where some conditional formatting is applied, and where the columns are editable, but not filterable or resizable.
@@ -396,7 +396,7 @@ setting some defaults for some arguments to help with styling.
 
     [Table]: ../../assets/user_guides/table/table.png
 
-### Styling and modifying the Dash DataTable
+### Styling and changing the Dash DataTable
 
 As mentioned above, all [parameters of the Dash DataTable](https://dash.plotly.com/datatable/reference) can be entered as keyword arguments. Below you can find
 an example of a styled table where some conditional formatting is applied. There are many more ways to alter the table beyond this showcase.