DOCS-1188 - Fix broken images in reuse files (#5902)

* Add useBaseUrl statement

* Add useBaseUrl links

* Cleanup

Author: jpipkin1

docs/reuse/apps/app-collection-option-1.md

@@ -1,3 +1,5 @@
+import useBaseUrl from '@docusaurus/useBaseUrl';
+
 To set up collection and install the app, do the following:
 :::note
     Next-Gen App: To install or update the app, you must be an account administrator or a user with Manage Apps, Manage Monitors, Manage Fields, Manage Metric Rules, and Manage Collectors capabilities depending upon the different content types part of the app.
@@ -12,8 +14,8 @@ To set up collection and install the app, do the following:
     1. **Collector Name**. Enter a Name to display the Source in the Sumo Logic web application. The description is optional.
     1. **Timezone**. Set the default time zone when it is not extracted from the log timestamp. Time zone settings on Sources override a Collector time zone setting.
     1. (Optional) **Metadata**.  Click the **+Add Metadata** link to add a custom log [Metadata Fields](/docs/manage/fields). Define the fields you want to associate, each metadata field needs a name (key) and value.
-        * <img src="/img/reuse/green-check-circle.png" alt="green check circle.png" width="20"/> A green circle with a checkmark is shown when the field exists and is enabled in the Fields table schema.
-        * <img src="/img/reuse/orange-exclamation-point.png" alt="orange exclamation point.png" width="20"/> An orange triangle with an exclamation point is shown when the field doesn't exist, or is disabled in the Fields table schema. In this case, you'll see an option to automatically add or enable the nonexistent fields to the Fields table schema. If a field is sent to Sumo Logic but isn’t present or enabled in the schema, it’s ignored and marked as **Dropped**.
+        * <img src={useBaseUrl('img/reuse/green-check-circle.png')} alt="green check circle.png" width="20"/> A green circle with a checkmark is shown when the field exists and is enabled in the Fields table schema.
+        * <img src={useBaseUrl('img/reuse/orange-exclamation-point.png')} alt="orange exclamation point.png" width="20"/> An orange triangle with an exclamation point is shown when the field doesn't exist, or is disabled in the Fields table schema. In this case, you'll see an option to automatically add or enable the nonexistent fields to the Fields table schema. If a field is sent to Sumo Logic but isn’t present or enabled in the schema, it’s ignored and marked as **Dropped**.
     1. Click **Next**.
 1. Configure the source as specified in the `Info` box above, ensuring all required fields are included.
 1. In the **Configure** section of your respective app, complete the following fields.

docs/reuse/apps/app-install-index-apps-v2.md

@@ -1,9 +1,11 @@
+import useBaseUrl from '@docusaurus/useBaseUrl';
+
 To install the app:
 
 1. Select **App Catalog**.
 1. In the **Search Apps** field, search for and then select your app.
 1. Optionally, you can scroll down to preview the dashboards included with the app. Then, click **Install App** (sometimes this button says **Add Integration**).
 1. Click **Next**.
-1. Look for the dialog confirming that your app was installed successfully.<br/><img src="/img/get-started/library/app-success-sumo-apps.png" alt="app-success-sumo-apps.png" style={{border:'1px solid gray'}} width="80%" />
+1. Look for the dialog confirming that your app was installed successfully.<br/><img src={useBaseUrl('img/get-started/library/app-success-sumo-apps.png')} alt="app-success-sumo-apps.png" style={{border:'1px solid gray'}} width="80%" />
 
 Once an app is installed, it will appear in your **Personal** folder or the folder that you specified. From here, you can share it with other users in your organization. Dashboard panels will automatically start to fill with data matching the time range query received since you created the panel. Results won't be available immediately, but within about 20 minutes, you'll see completed graphs and maps.

docs/reuse/apps/app-install-sumo-apps.md

@@ -1,3 +1,5 @@
+import useBaseUrl from '@docusaurus/useBaseUrl';
+
 To install the app:
 
 1. Select **App Catalog**.
@@ -7,6 +9,6 @@ To install the app:
    * **Folder Name**. You can retain the existing name or enter a custom name of your choice for the app.
    * **All Folders** (optional). Default location is the **Personal** folder in your **Library**. If desired, you can choose a different location and/or click **New Folder** to add it to a new folder.
 1. Click **Next**.
-1. Look for the dialog confirming that your app was installed successfully.<br/><img src="/img/get-started/library/app-success-sumo-apps.png" alt="app-success-sumo-apps.png" style={{border:'1px solid gray'}} width="80%" />
+1. Look for the dialog confirming that your app was installed successfully.<br/><img src={useBaseUrl('img/get-started/library/app-success-sumo-apps.png')} alt="app-success-sumo-apps.png" style={{border:'1px solid gray'}} width="80%" />
 
 Once an app is installed, it will appear in your **Personal** folder or the folder that you specified. From here, you can share it with other users in your organization. Dashboard panels will automatically start to fill with data matching the time range query received since you created the panel. Results won't be available immediately, but within about 20 minutes, you'll see completed graphs and maps.

docs/reuse/apps/app-install.md

@@ -1,3 +1,5 @@
+import useBaseUrl from '@docusaurus/useBaseUrl';
+
 To install the app:
 
 1. Select **App Catalog**.
@@ -13,7 +15,7 @@ To install the app:
    * **Folder Name**. You can retain the existing name or enter a custom name of your choice for the app.
    * **All Folders** (optional). The default location is the **Personal** folder in your **Library**. If desired, you can choose a different location and/or click **New Folder** to add it to a new folder.
 1. Click **Next**.
-1. Look for the dialog confirming that your app was installed successfully.<br/><img src="/img/get-started/library/app-success.png" alt="app-success.png" width="80%" />
+1. Look for the dialog confirming that your app was installed successfully.<br/><img src={useBaseUrl('img/get-started/library/app-success.png')} alt="app-success.png" width="80%" />
 
 **Post-installation**
 

docs/reuse/apps/create-aws-s3-source.md

@@ -1,3 +1,5 @@
+import useBaseUrl from '@docusaurus/useBaseUrl';
+
 When you create an AWS Source, you'll need to identify the Hosted Collector you want to use or create a new Hosted Collector. Once you create an AWS Source, associate it with a Hosted Collector. For instructions, see [Configure a Hosted Collector](/docs/send-data/hosted-collectors/configure-hosted-collector).
 
 #### Rules
@@ -46,8 +48,8 @@ These configuration instructions apply to log collection from all AWS Source typ
     * Add an **account** field and assign it a value which is a friendly name / alias to your AWS account from which you are collecting logs. Logs can be queried via the “account field”.
     * Add a **region** field and assign it the value of respective AWS region where the Load Balancer exists.
     * Add an **accountId** field and assign it the value of the respective AWS account id which is being used.
-    * <img src="/img/reuse/green-check-circle.png" alt="green check circle.png" width="20"/> A green circle with a check mark is shown when the field exists and is enabled in the Fields table schema.
-    * <img src="/img/reuse/orange-exclamation-point.png" alt="orange exclamation point.png" width="20"/> An orange triangle with an exclamation point is shown when the field doesn't exist, or is disabled in the Fields table schema. In this case, you'll see an option to automatically add or enable the nonexistent fields to the Fields table schema. If a field is sent to Sumo Logic but isn’t present or enabled in the schema, it’s ignored and marked as **Dropped**.
+    * <img src={useBaseUrl('img/reuse/green-check-circle.png')} alt="green check circle.png" width="20"/> A green circle with a check mark is shown when the field exists and is enabled in the Fields table schema.
+    * <img src={useBaseUrl('img/reuse/orange-exclamation-point.png')} alt="orange exclamation point.png" width="20"/> An orange triangle with an exclamation point is shown when the field doesn't exist, or is disabled in the Fields table schema. In this case, you'll see an option to automatically add or enable the nonexistent fields to the Fields table schema. If a field is sent to Sumo Logic but isn’t present or enabled in the schema, it’s ignored and marked as **Dropped**.
 11. For **AWS Access**, choose between the two **Access Method** options below, based on the AWS authentication you are providing.
     * For **Role-based access**, enter the Role ARN that was provided by AWS after creating the role. Role-based access is recommended (this was completed in the prerequisite step [Grant Sumo Logic access to an AWS Product](/docs/send-data/hosted-collectors/amazon-aws/grant-access-aws-product)).
     * For **Key access**, enter the **Access Key ID** and **Secret Access Key**. See [AWS Access Key ID](http://docs.aws.amazon.com/STS/latest/UsingSTS/UsingTokens.html#RequestWithSTS) and [AWS Secret Access Key](https://aws.amazon.com/iam/) for details.

docs/reuse/apps/opentelemetry/collector-installation.md

@@ -1,3 +1,5 @@
+import useBaseUrl from '@docusaurus/useBaseUrl';
+
 In this step, we'll install the collector and add a uniquely identifiable tag to these collectors.
 
 1. [**Classic UI**](/docs/get-started/sumo-logic-ui-classic). In the main Sumo Logic menu, select **Manage Data > Collection > OpenTelemetry Collection**.<br/>[**New UI**](/docs/get-started/sumo-logic-ui). In the Sumo Logic main menu select **Data Management**, and then under **Data Collection** select **OpenTelemetry Collection**. You can also click the **Go To...** menu at the top of the screen and select **OpenTelemetry Collection**.
@@ -9,6 +11,6 @@ In this step, we'll install the collector and add a uniquely identifiable tag to
    1. Leave the **Collector Settings** at their default values to configure collectors as remotely managed.
    1. Under **Generate and run the command to install the collector**, copy and run the installation command in your system terminal where the collector needs to be installed.
 1. After installation is complete, click **Next** to proceed.
-1. Select a source template (for example, Apache source template) to start collecting logs from all linked collectors, then proceed with the data configuration.<br/><img src="/img/send-data/source-template.png" alt="source template page" style={{border:'1px solid gray'}} width="90%" />
+1. Select a source template (for example, Apache source template) to start collecting logs from all linked collectors, then proceed with the data configuration.<br/><img src={useBaseUrl('img/send-data/source-template.png')} alt="source template page" style={{border:'1px solid gray'}} width="90%" />
 
 To revisit this screen later: From the [**Classic UI**](/docs/get-started/sumo-logic-ui-classic), select **Manage Data > Collection > Source Template**. From the [**New UI**](/docs/get-started/sumo-logic-ui), select **Data Management** and under **Data Collection** select **Source Template**.

docs/reuse/apps/opentelemetry/data-configuration.md

@@ -1,12 +1,14 @@
+import useBaseUrl from '@docusaurus/useBaseUrl';
+
 :::info
 A new source template will always be created with the latest version of the source template.
 :::
 
 Follow the below steps to create a data collection configuration to gather the required logs and link them to all the collectors with the help of collector tags.
 
 1. Complete the source template form with the name and file path for your logs (for example, error logs or access logs), then click **Next**.
-1. Under **Link Collectors**, you will have the option to link the collectors using the collector name or by adding tags to find the group of collectors (for example, `application = Apache`).<br/><img src="/img/send-data/local-file-apache.png" alt="Screenshot of the file path configuration for Apache logs" style={{border:'1px solid gray'}} width="80%" />
-1. Preview and confirm the collectors that will be linked (fetched automatically) to the newly created source template.<br/><img src="/img/send-data/preview-collectors1.png" alt="Screenshot showing the linked collectors preview" style={{border:'1px solid gray'}} width="90%" /><br/><img src="/img/send-data/preview-collectors2.png" alt="Screenshot showing the linked collectors preview" style={{border:'1px solid gray'}} width="90%" />
+1. Under **Link Collectors**, you will have the option to link the collectors using the collector name or by adding tags to find the group of collectors (for example, `application = Apache`).<br/><img src={useBaseUrl('img/send-data/local-file-apache.png')} alt="Screenshot of the file path configuration for Apache logs" style={{border:'1px solid gray'}} width="80%" />
+1. Preview and confirm the collectors that will be linked (fetched automatically) to the newly created source template.<br/><img src={useBaseUrl('img/send-data/preview-collectors1.png')} alt="Screenshot showing the linked collectors preview" style={{border:'1px solid gray'}} width="90%" /><br/><img src={useBaseUrl('img/send-data/preview-collectors2.png')} alt="Screenshot showing the linked collectors preview" style={{border:'1px solid gray'}} width="90%" />
 1. Click **Next** to complete the source template creation. In the background, the system will apply the configuration to all the linked collectors and will start collecting the respective telemetry data from the remote host (in the example, it would start collecting Apache error logs).
 1. Click the **Log Search** or **Metrics Search** icons to search for and analyze your data collected for this source template.
 

docs/reuse/apps/opentelemetry/process-metric-collection.md

@@ -1,9 +1,11 @@
+import useBaseUrl from '@docusaurus/useBaseUrl';
+
 By default, the collector will not send process metrics to Sumo Logic. This is because the number of processes running on a host can be very large, which would result in a significant increase in Data Points per Minute (DPM).
 
 Click the **Enable process metric collection** checkbox to collect [process-level metrics](https://github.com/open-telemetry/opentelemetry-collector-contrib/blob/main/receiver/hostmetricsreceiver/internal/scraper/processscraper/documentation.md).
 - **Name of process**. Add the list of process names.
 - **Include/Exclude the above pattern**. Signifies if you want to exclude or include the metrics for the processes listed previously.
-- **Match type for process name**. Select if the process name given should be considered for a strict match with the host machine processes or if it should be considered as regex when matching.<br/><img src="/img/integrations/hosts-operating-systems/process-metric-collection.png" style={{border:'1px solid gray'}} alt="process-metric-collection" width="500" />
+- **Match type for process name**. Select if the process name given should be considered for a strict match with the host machine processes or if it should be considered as regex when matching.<br/><img src={useBaseUrl('img/integrations/hosts-operating-systems/process-metric-collection.png')} style={{border:'1px solid gray'}} alt="process-metric-collection" width="500" />
 
 :::note
 

docs/reuse/aws-cost-explorer.md

@@ -1,13 +1,15 @@
+import useBaseUrl from '@docusaurus/useBaseUrl';
+
 To configure an AWS Cost Explorer Source:
 
 1. [**Classic UI**](/docs/get-started/sumo-logic-ui-classic). In the main Sumo Logic menu, select **Manage Data > Collection > Collection**. <br/>[**New UI**](/docs/get-started/sumo-logic-ui). In the Sumo Logic main menu select **Data Management**, and then under **Data Collection** select **Collection**. You can also click the **Go To...** menu at the top of the screen and select **Collection**. 
 1. On the Collection page, click **Add Source** next to a Hosted Collector.
-1. Search for and select **AWS Cost Explorer**.<br/>  <img src="/img/send-data/aws-cost-explorer-icon.png" alt="aws-cost-explorer-icon" width="10%" />
-1. Enter a **Name** for the Source in the Sumo Logic console. The **Description** is optional.<br/>  <img src="/img/integrations/amazon-aws/cost-explorer-v2-1-1.png" alt="cost-explorer-v2-1-1.png" width="400" />
+1. Search for and select **AWS Cost Explorer**.<br/>  <img src={useBaseUrl('img/send-data/aws-cost-explorer-icon.png')} alt="aws-cost-explorer-icon" width="10%" />
+1. Enter a **Name** for the Source in the Sumo Logic console. The **Description** is optional.<br/>  <img src={useBaseUrl('img/integrations/amazon-aws/cost-explorer-v2-1-1.png')} alt="cost-explorer-v2-1-1.png" width="400" />
 1. (Optional) For **Source Category**, enter any string to tag the output collected from the Source. Category [metadata](/docs/search/get-started-with-search/search-basics/built-in-metadata) is stored in a searchable field called `_sourceCategory`.
 1. For [Fields](/docs/manage/fields), click the **+Add** link to add custom log metadata. Define the fields you want to associate. Each field needs a name (key) and value.
-   * <img src="/img/reuse/green-check-circle.png" alt="green check circle.png" width="20"/> A green circle with a check mark is shown when the field exists and is enabled in the Fields table schema.
-   * <img src="/img/reuse/orange-exclamation-point.png" alt="orange exclamation point.png" width="20"/> An orange triangle with an exclamation point is shown when the field doesn't exist, or is disabled in the Fields table schema. In this case, you'll see an option to automatically add or enable the nonexistent fields to the Fields table schema. If a field is sent to Sumo Logic but isn’t present or enabled in the schema, it’s ignored and marked as **Dropped**.<br/><br/>It is preferable to add an **account** field (for the dashboards) and assign it a friendly name to identify the corresponding AWS account.<br/> ![accountField.png](/img/send-data/accountField.png)
+   * <img src={useBaseUrl('img/reuse/green-check-circle.png')} alt="green check circle.png" width="20"/> A green circle with a check mark is shown when the field exists and is enabled in the Fields table schema.
+   * <img src={useBaseUrl('img/reuse/orange-exclamation-point.png')} alt="orange exclamation point.png" width="20"/> An orange triangle with an exclamation point is shown when the field doesn't exist, or is disabled in the Fields table schema. In this case, you'll see an option to automatically add or enable the nonexistent fields to the Fields table schema. If a field is sent to Sumo Logic but isn’t present or enabled in the schema, it’s ignored and marked as **Dropped**.<br/><br/>It is preferable to add an **account** field (for the dashboards) and assign it a friendly name to identify the corresponding AWS account.<br/> ![accountField.png](/img/send-data/accountField.png)
 1. For the **AWS Access Key** and **AWS Secret Key**, provide the IAM User access key and secret key you want to use to authenticate collection requests. Make sure your IAM user has the following IAM policy attached with it.
    ```json
    {

docs/reuse/filter-dashboards.md

@@ -1,5 +1,7 @@
+import useBaseUrl from '@docusaurus/useBaseUrl';
+
 All dashboards have a set of filters that you can apply to the entire dashboard. Use these filters to drill down and examine the data to a granular level.
 
 - You can change the time range for a dashboard or panel by selecting a predefined interval from a drop-down list, choosing a recently used time range, or specifying custom dates and times. [Learn more](/docs/dashboards/set-custom-time-ranges/).
 - If required, [configure](/docs/dashboards/about/#auto-refresh) the refresh interval rate for a dashboard or panel by clicking the drop-down arrow next to the refresh icon.
-- Click the funnel icon in the dashboard top menu bar to [filter dashboard with Template Variables](/docs/dashboards/filter-template-variables/).<br/> <img src="/img/dashboards/filter-dashboards.png" alt="filter-dashboards" style={{border: '1px solid gray'}} width="200" />
+- Click the funnel icon in the dashboard top menu bar to [filter dashboard with Template Variables](/docs/dashboards/filter-template-variables/).<br/> <img src={useBaseUrl('img/dashboards/filter-dashboards.png')} alt="filter-dashboards" style={{border: '1px solid gray'}} width="200" />