GITBOOK-22: Updated Adding Icons steps.

Author: eshanrnh

16/umbraco-cms/.gitbook/assets/selecting-an-icon.png

@@ -2,20 +2,6 @@
 description: Your main resource when building and managing an Umbraco CMS website.
 cover: .gitbook/assets/Umbraco 16 - Hero.jpg
 coverY: 0
-layout:
-  cover:
-    visible: true
-    size: full
-  title:
-    visible: true
-  description:
-    visible: true
-  tableOfContents:
-    visible: true
-  outline:
-    visible: true
-  pagination:
-    visible: true
 ---
 
 # Umbraco CMS Documentation

16/umbraco-cms/README.md

@@ -1,6 +1,6 @@
-# Custom Extension Types
+# Custom Extension types
 
-The extension registry is an open system, which can hold any Extension Manifest Type. This article describes how you can declare your types.
+The extension registry is an open system, which can hold any Extension Manifest Type. This article describes how you can declare your types.\
 Types can be declared for re-useability/maintainability or to open up for other package extensions.
 
 ## Manifest Type Declaration

16/umbraco-cms/customizing/extending-overview/custom-extension-type.md

@@ -101,6 +101,9 @@ The dashboard manifest can contain the following properties:
 | elementName | string | (Optional) The name of the Web Component that contains the dashboard (only if not a default export)                                                                                                                                                                                                       |
 | weight      | number | (Optional) The weight of the dashboard, higher numbers are displayed first                                                                                                                                                                                                                                |
 | meta        | object | <p>Additional metadata for the dashboard</p><table><thead><tr><th>Property</th><th>Type</th><th>Description</th></tr></thead><tbody><tr><td>Label</td><td>string</td><td>The label shown to the user</td></tr><tr><td>pathname</td><td>string</td><td>The routable URL pathname</td></tr></tbody></table> |
+| Property    | Type   | Description                                                                                                                                                                                                                                                                                               |
+| Label       | string | The label shown to the user                                                                                                                                                                                                                                                                               |
+| pathname    | string | The routable URL pathname                                                                                                                                                                                                                                                                                 |
 | conditions  | array  | (Optional) [Conditions](condition.md) for when the dashboard should be displayed                                                                                                                                                                                                                          |
 
 ### Full Example

16/umbraco-cms/customizing/extending-overview/extension-types/dashboard.md

@@ -67,7 +67,7 @@ export const My_COUNTER_CONTEXT = new UmbContextToken<MyContextCounterApi>(
 );
 ```
 
-It is recommended to use `UmbWorkspaceContext` as the Context Alias for your Context Token. This will ensure that the requester only retrieves this Context if it's present at their nearest Workspace Context. Use the Extension Manifest Alias as the API Alias for your Context Token to ensure its unique. For more information, see the [Context API](../../../foundation/working-with-data/context-api.md) article.
+It is recommended to use `UmbWorkspaceContext` as the Context Alias for your Context Token. This will ensure that the requester only retrieves this Context if it's present at their nearest Workspace Context. Use the Extension Manifest Alias as the API Alias for your Context Token to ensure its unique. For more information, see the [Context API](../../../foundation/context-api/) article.
 
 ## Use the Workspace Context
 
@@ -133,4 +133,3 @@ Manifest to register this:
     ],
 }
 </code></pre>
-

16/umbraco-cms/customizing/extending-overview/extension-types/workspaces/workspace-context.md

@@ -18,11 +18,11 @@ The Umbraco element brings what you need to integrate your UI.
 
 Learn about Lit Element, the Web Component Framework that most examples and most of the Backoffice are based upon.
 
-## [Context API](working-with-data/context-api.md)
+## [Context API](context-api/)
 
 Learn how to communicate with the rest of the application, whether you want to retrieve data or manipulate it.
 
-## [States — Make reactive UI](working-with-data/states.md)
+## [States — Make reactive UI](states.md)
 
 Bring life into your UI by ensuring it's up to date with the current data.
 

16/umbraco-cms/customizing/foundation/README.md

@@ -1,5 +1,8 @@
 ---
-description: The Fetch API is a modern way to make network requests in JavaScript. It provides a more powerful and flexible feature set than the older XMLHttpRequest.
+description: >-
+  The Fetch API is a modern way to make network requests in JavaScript. It
+  provides a more powerful and flexible feature set than the older
+  XMLHttpRequest.
 ---
 
 # Fetch API
@@ -8,12 +11,12 @@ The [Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) is a
 
 ## Fetch API in Umbraco
 
-The Fetch API can also be used in Umbraco to make network requests to the server. Since it is built into the browser, you do not need to install any additional libraries or packages to use it. The Fetch API is available in the global scope and can be used directly in your JavaScript code.
+The Fetch API can also be used in Umbraco to make network requests to the server. Since it is built into the browser, you do not need to install any additional libraries or packages to use it. The Fetch API is available in the global scope and can be used directly in your JavaScript code.\
 The Fetch API is a great way to make network requests in Umbraco because it provides a lot of flexibility. You can use it to make GET, POST, PUT, DELETE, and other types of requests to the server. You can also use it to handle responses in a variety of formats, including JSON, text, and binary data.
 
 ### Example
 
-For this example, we are using the Fetch API to make a GET request to the `/umbraco/MyApiController/GetData` endpoint. The response is then parsed as JSON and logged to the console. 
+For this example, we are using the Fetch API to make a GET request to the `/umbraco/MyApiController/GetData` endpoint. The response is then parsed as JSON and logged to the console.
 
 {% hint style="info" %}
 The example assumes that you have a controller set up at the `/umbraco/MyApiController/GetData` endpoint that returns JSON data. You can replace this with your own endpoint as needed. Read more about creating a controller in the [Controllers](../../../implementation/controllers.md) article.
@@ -38,7 +41,6 @@ if (data) {
 }
 ```
 
-
 {% hint style="warning" %}
 When using the Fetch API, you need to manually handle errors and authentication. For most scenarios, we recommend using the Umbraco HTTP Client, which provides built-in error handling and authentication.
 {% endhint %}
@@ -47,7 +49,7 @@ When using the Fetch API, you need to manually handle errors and authentication.
 
 When making requests to the Umbraco API controllers, you may need to include an authorization token in the request headers. This is especially important when making requests to endpoints that require authentication.
 
-The Fetch API does not automatically include authentication tokens in requests. You need to manually add the authentication token to the request headers. While you can manage tokens manually, the recommended approach in the Backoffice is to use the **UMB_AUTH_CONTEXT**. This context provides tools to manage authentication tokens and ensures that your requests are properly authenticated.
+The Fetch API does not automatically include authentication tokens in requests. You need to manually add the authentication token to the request headers. While you can manage tokens manually, the recommended approach in the Backoffice is to use the **UMB\_AUTH\_CONTEXT**. This context provides tools to manage authentication tokens and ensures that your requests are properly authenticated.
 
 ### Example: Using `UMB_AUTH_CONTEXT` for Authentication
 
@@ -83,19 +85,18 @@ const data = await fetchData(this, '/umbraco/management/api/v1/server/status');
 console.log(data);
 ```
 
-
 {% hint style="warning" %}
 When using the Fetch API with `UMB_AUTH_CONTEXT`, you need to handle token expiration errors manually. If the token is expired, the request will return a 401 error. You will need to refresh the token or prompt the user to log in again.
 {% endhint %}
 
-Why Use **UMB_AUTH_CONTEXT**?
+Why Use **UMB\_AUTH\_CONTEXT**?
 
-- Simplifies Token Management: Automatically retrieves and refreshes tokens when needed.
-- Aligns with Best Practices: Ensures your requests are authenticated in a way that integrates seamlessly with the Backoffice.
-- Reduces Errors: Avoids common pitfalls like expired tokens or incorrect headers.
+* Simplifies Token Management: Automatically retrieves and refreshes tokens when needed.
+* Aligns with Best Practices: Ensures your requests are authenticated in a way that integrates seamlessly with the Backoffice.
+* Reduces Errors: Avoids common pitfalls like expired tokens or incorrect headers.
 
 {% hint style="info" %}
-The **UMB_AUTH_CONTEXT** is only available in the Backoffice. For external applications, you will need to manage tokens manually or use an API user. Read more about API users in the [API Users](../../../fundamentals/data/users/api-users.md) article.
+The **UMB\_AUTH\_CONTEXT** is only available in the Backoffice. For external applications, you will need to manage tokens manually or use an API user. Read more about API users in the [API Users](../../../fundamentals/data/users/api-users.md) article.
 {% endhint %}
 
 ## Management API Controllers
@@ -112,11 +113,11 @@ You can read more about this concept in the [API Users](../../../fundamentals/da
 
 The Fetch API can also be used to make requests to the Management API using a Backoffice token. This is useful for making requests from custom components that are running in the Backoffice. The concept is similar to the API Users, but the Backoffice token represents the current user in the Backoffice. You will share the access policies of the current user, so you can use the token to make requests on behalf of the current user.
 
-To use the Backoffice access token, you will have to consume the **UMB_AUTH_CONTEXT** context. This context is only available in the Backoffice and includes tools to hook on to the authentication process. You can use the [getOpenApiConfiguration](https://apidocs.umbraco.com/v16/ui-api/classes/packages_core_auth.UmbAuthContext.html#getopenapiconfiguration) method to get a configuration object that includes a few useful properties:
+To use the Backoffice access token, you will have to consume the **UMB\_AUTH\_CONTEXT** context. This context is only available in the Backoffice and includes tools to hook on to the authentication process. You can use the [getOpenApiConfiguration](https://apidocs.umbraco.com/v16/ui-api/classes/packages_core_auth.UmbAuthContext.html#getopenapiconfiguration) method to get a configuration object that includes a few useful properties:
 
-- `base`: The base URL of the Management API.
-- `credentials`: The credentials to use for the request.
-- `token()`: A function that returns the current access token.
+* `base`: The base URL of the Management API.
+* `credentials`: The credentials to use for the request.
+* `token()`: A function that returns the current access token.
 
 Read more about this in the [UmbOpenApiConfiguration](https://apidocs.umbraco.com/v16/ui-api/interfaces/packages_core_auth.UmbOpenApiConfiguration.html) interface.
 

16/umbraco-cms/customizing/foundation/fetching-data/fetch-api.md

@@ -24,7 +24,7 @@ Repositories can use different data sources depending on the state of the applic
 
 ### Data flow with a repository <a href="#data-flow-with-a-repository" id="data-flow-with-a-repository"></a>
 
-<figure><img src="../../../.gitbook/assets/data-flow.svg" alt=""><figcaption><p>Data flow</p></figcaption></figure>
+<figure><img src="../../.gitbook/assets/data-flow.svg" alt=""><figcaption><p>Data flow</p></figcaption></figure>
 
 A repository must be instantiated in the context where it is used. It should take a host element as part of the constructor. This ensures that any contexts consumed in the repository, like notifications or modals, are rendered in the correct DOM context.
 

16/umbraco-cms/customizing/foundation/repositories.md

@@ -8,10 +8,10 @@ description: >-
 
 An Umbraco State is a container for a value, it enables you to create [Observables](states.md#observables), which is the name of a hook into the States value — An Observable can then be Observed, such observation provides the current value and if the value of the State changes they will all be updated accordingly.
 
-A typical use case is when you need to implement reactivity across class instances. For example, a State is in a Context and the Observer is a Element. For a concrete example, see the [Extension Type Workspace Context](../../extending-overview/extension-types/workspaces/workspace-context.md) article.
+A typical use case is when you need to implement reactivity across class instances. For example, a State is in a Context and the Observer is a Element. For a concrete example, see the [Extension Type Workspace Context](../extending-overview/extension-types/workspaces/workspace-context.md) article.
 
 {% hint style="info" %}
-Umbraco States are not relevant when dealing with the reactivity of a Web Component. For that, see the [Lit Element](../lit-element.md) article.
+Umbraco States are not relevant when dealing with the reactivity of a Web Component. For that, see the [Lit Element](lit-element.md) article.
 {% endhint %}
 
 The example below demonstrates the basics of working with a State and observing its changes:

16/umbraco-cms/customizing/foundation/states.md

@@ -7,10 +7,10 @@ description: A list of some of the key concepts with working the Umbraco Backoff
 Understanding certain key concepts is essential when customizing the backoffice. These terminologies can help you decode the purpose of code effectively:
 
 * **Repository:** An API that enables communication with a server.
-* **State:** A reactive container holding data, when data is changed, all its Observables will be notified. You can read more about states and observables in the [States](working-with-data/states.md) article.
+* **State:** A reactive container holding data, when data is changed, all its Observables will be notified. You can read more about states and observables in the [States](states.md) article.
   * **Observable:** An observable is the hook for others to subscribe to the data of a State.
   * **Observe:** Observe describes what we do when subscribing to an Observable.
-* **Context-API:** The name used to serve APIs (instances/classes) for a certain context in the DOM. An API that is served via the Context-API is called a Context. You can read more about this in the [Context API](working-with-data/context-api.md) article.
+* **Context-API:** The name used to serve APIs (instances/classes) for a certain context in the DOM. An API that is served via the Context-API is called a Context. You can read more about this in the [Context API](context-api/) article.
   * **Context Provider:** Enables providing a class instance as a Context API.
   * **Context Consumer:** Enables the consumption of a Context API.
 * **Controller:** An abstract term for a thing that hooks into the lifecycle of an element. Many things in our system are Controllers.