(CHORE): managing session replay modify capabilities

src/content/docs/accounts/accounts-billing/new-relic-one-user-management/user-permissions.mdx

@@ -125,7 +125,7 @@ To learn more about specific permissions, select a category below, or try search
     * <DNT>**Application settings**</DNT>: relates to browser application settings.
     * <DNT>**Domain conditions**</DNT>: relates to [browser domain conditions](/docs/browser/new-relic-browser/configuration/monitor-or-block-specific-domains-subdomains).
     * <DNT>**Segment allow lists**</DNT>: relates to segmenting [allow lists](/docs/browser/new-relic-browser/configuration/group-browser-metrics-urls).
-    * <DNT>**View session replays**</DNT>: relates to [viewing replays.](/docs/browser/browser-monitoring/browser-pro-features/session-replay).
+    * <DNT>**View session replays**</DNT>: relates to [viewing replays.](/docs/browser/browser-monitoring/browser-pro-features/session-replay/get-started).
   </Collapser>
 
   <Collapser

src/content/docs/browser/browser-monitoring/browser-pro-features/session-replay/additional-information.mdx

@@ -0,0 +1,50 @@
+---
+title: "Additional information"
+metaDescription: "Data consumption, User privacy and security concerns."
+freshnessValidatedDate: 2024-12-19
+---
+
+## Data consumption [#data-consumption]
+
+Session replay follows the same consumption pricing as your other browser bytes. The amount of bytes produced depends on the count, length, and user-activity levels of sessions, as well as the complexity of your site's DOM.
+
+The most accurate way to project your cost per replay is to enable the feature for a short test period and measure your actual consumption. Alternatively, you can use an average of 5.3 MB per replay as a rough approximation, though keep in mind that your actual cost may vary significantly. A simple formula to project your approximate costs is: `sessions` x `sampling_rate` x `gb_per_replay` x `cost_per_gb`.
+
+Here's an example:
+
+1 million (sessions) x 5% (sampling_rate) x 0.0053 (gb_per_replay) x $0.35 (cost_per_gb) = $92.75 for 50,000 replays
+
+To control your consumption, [adjust your sampling rates](/docs/browser/browser-monitoring/browser-pro-features/session-replay/configuration/setup-session-replay/#configure-sampling-rates).
+
+## User privacy and security concerns [#data-security]
+
+We prioritize data privacy and built session replay with strong default settings to minimize the potential exposure of sensitive customer information. You can further [customize privacy settings](/docs/browser/browser-monitoring/browser-pro-features/session-replay/configuration/customize-privacy-settings) to meet your specific needs.
+
+Session replay doesn't capture screenshots or videos. Instead, it records only the essential DOM state changes needed to reconstruct user interactions. This significantly reduces the amount of data stored.
+
+### Compliance with data privacy laws
+
+New Relic acts as a data processor under GDPR and a service provider under CCPA. This means we process data according to your instructions. Ultimately, compliance with these laws depends on how you implement session replay within your application.
+
+By default, all text and user inputs, including personal data, are masked within the recordings. You can selectively unmask specific elements if needed, but the default ensures that no personally identifiable information is readily visible. This approach provides a strong foundation for data privacy while offering flexibility for your specific needs.
+
+## Session replay and your app's performance [#app-performance]
+
+Session replay minimizes impact on your app's performance with:
+
+* **Minimal initial impact**: Session replay loads asynchronously after full page load, ensuring no interference with early page load performance metrics.
+* **DOM mutation tracking**: Once loaded, session replay monitors DOM changes and reports them as compressed payloads. The size of these payloads correlates with the complexity of the DOM tree.
+* **Performance optimization techniques**: Payload size can also increase if the DOM is large. However, session replay uses a number of techniques to reduce payload size, such as:
+  * GZIP compression
+  * Duplication reduction
+  * Strategic payload harvesting: A large (compressed) payload is sent only when the full DOM is captured, which typically occurs when the replay feature is first imported. Subsequently, only small payloads related to the user's actions are sent. The browser agent will harvest data based on the first occurrence of the following conditions:
+    * The payload reaches more than 64 KB compressed.
+    * 60 seconds elapses.
+    * The visibility of the page changes (example, tab change, focus, navigation).
+    * The session ends.
+
+### Key Changes:
+
+- **Clarity:** Improved sentence structure for better readability.
+- **Conciseness:** Removed redundant words and phrases.
+- **Consistency:** Used parallel structure in the list for uniformity.

src/content/docs/browser/browser-monitoring/browser-pro-features/session-replay/advanced-features.mdx

@@ -0,0 +1,123 @@
+---
+title: "Advanced features"
+metaDescription: "Manually record session replays, disable automatic session replay tracking and use nerd graph to configure replay settings."
+freshnessValidatedDate: 2024-12-19
+---
+
+## Manually record session replays [#manual-replays]
+
+If needed, you can programmatically `force` a session replay to start or stop recording using API methods. Here are some use cases:
+
+* Allow users to opt in for interaction recording. For example, if you have a pop-up asking "Allow this session to be recorded for performance analysis?" and a user consents:
+  1. Call `newrelic.recordReplay()`, to initiate recording.
+  2. After the session is complete or consent is withdrawn, use `newrelic.pauseReplay()` to stop capturing data.
+* Record sessions based on specific criteria, such as:
+  * Start recording only for sessions on specific URLs such as a product checkout flow.
+  * Stop recording for sensitive pages such as `/billing` or `/health-records`.
+
+Refer the API documentation for instructions:
+
+* [`newrelic.recordReplay`](/docs/browser/new-relic-browser/browser-apis/recordReplay/)
+* [`newrelic.pauseReplay`](/docs/browser/new-relic-browser/browser-apis/pauseReplay/)
+
+## Disable automatic session replay tracking [#auto-replays]
+
+You can prevent session replays from automatically starting, even when sampled, by setting the API configuration option `autoStart` to `false`. This is useful in scenarios where you need to prioritize specific actions over automatic sampling. For example, you might not want session replays to automatically run on sensitive pages, like HIPAA-compliant ones. In such cases, you can use the `.start()` API to manually trigger the replay feature after user consent is obtained (and your app calls `.start()`)
+
+Setting `autoStart: false` instructs the agent to defer its initialization until explicitly called using `.start()`. This ensures that session replays won't be created at all, even if the backend samples your application for recording.
+
+<Callout variant="important">
+  Calling `.start()` doesn't guarantee that a session replay will be recorded. It simply delays the module import and evaluation of sampling results until this point. If you need to force a recording, refer [Manually record session replays](#manual-replays).
+</Callout>
+
+To start using this API, refer [`newrelic.start`](/docs/browser/new-relic-browser/browser-apis/start/).
+
+## Use Nerdgraph to configure replay settings [#nerdgraph-mutation]
+
+You can configure session replay settings using our [NerdGraph API](/docs/apis/nerdgraph/get-started/introduction-new-relic-nerdgraph/) instead of using the UI. This method is helpful if you need to make bulk changes, such as applying sampling rates to multiple browser entities.
+
+Here's an example mutation and variables to create a new browser application with default settings:
+
+<table>
+  <thead>
+    <tr>
+      <th>
+        Mutation
+      </th>
+
+      <th>
+        Variables
+      </th>
+    </tr>
+  </thead>
+
+  <tbody>
+    <tr>
+      <td>
+        ```graphql
+        mutation SessionReplayConfigUpdate($guid: EntityGuid!, $settings: AgentApplicationSettingsUpdateInput!) {
+          agentApplicationSettingsUpdate(guid: $guid, settings: $settings) {
+            browserSettings {
+              sessionReplay {
+                blockSelector
+                errorSamplingRate
+                maskTextSelector
+                enabled
+                collectFonts
+                inlineImages
+                inlineStylesheet
+                samplingRate
+                maskAllInputs
+                maskInputOptions {
+                  color
+                  date
+                  datetimeLocal
+                  email
+                  month
+                  number
+                  range
+                  search
+                  select
+                  tel
+                  text
+                  textArea
+                  time
+                  url
+                  week
+                }
+              }
+            }
+            errors {
+              field
+              errorClass
+              description
+            }
+          }
+        }
+        ```
+      </td>
+
+      <td>
+        ```json
+        {
+          "sessionReplay": {
+            "enabled": true,
+            "collectFonts": true,
+            "blockSelector": ".private-fields",
+            "maskTextSelector": "*",
+            "inlineStylesheet": false,
+            "maskAllInputs": true,
+            "maskInputOptions": {
+              "color": true,
+              "date": true,
+              "textArea": true
+            },
+            "samplingRate": 9.99,
+            "errorSamplingRate": 1.11
+          }
+        }
+        ```
+      </td>
+    </tr>
+  </tbody>
+</table>

src/content/docs/browser/browser-monitoring/browser-pro-features/session-replay/configuration/customize-privacy-settings.mdx

@@ -0,0 +1,83 @@
+---
+title: "(Optional) Configure privacy settings"
+metaDescription: "Customizing Privacy Settings for user interactions to debug faster and improve page performance."
+freshnessValidatedDate: 2024-12-19
+---
+
+User privacy is a critical consideration when recording session replays. Although default settings are designed to protect sensitive information, you may need to adjust privacy configurations to meet specific needs. This section explains how to mask, block, or ignore certain data to comply with privacy standards while maintaining the functionality of session replays.
+
+By default, all text and inputs are replaced with asterisks. Here's an example of how a replay looks with default privacy:
+
+    <img
+      title="Example of default privacy settings"
+      alt="Example of default privacy settings"
+      src="/images/browser_screenshot-full_text-masking-example.webp"
+    />
+
+  If this setting is appropriate, move on to the next step.
+
+  If you need to customize what content or user input is captured, you have options to mask, block, or ignore specific classes and attributes of content or user input. Make sure to check with your privacy team before changing the privacy settings.
+
+## Mask sensitive text [#mask-text]
+
+  You can mask sensitive text, which means the text will be replaced with asterisks (\*). For example, you can mask a user's account ID that shows in a URL.
+
+  To specify which input should be masked, you have a few options:
+
+  * On the <DNT>**Application settings**</DNT> page, add your own CSS selectors or check the masking boxes. Note that using mask selectors won't mask user input, so if you need to hide user input, we recommend using block selectors.
+
+      <img
+        title="Mask settings"
+        alt="Screenshot of mask settings in the ui"
+        src="/images/browser_screenshot-full_mask-settings.webp"
+      />
+  * Add our CSS class `nr-mask` or attribute `data-nr-mask` to your webpage HTML.
+
+      For example, to mask an account ID from showing in the URL, add `nr-mask` to the `<div>` containing the account ID:
+
+      `<div>Account ID: <span class="nr-mask">99881123</span></div>`
+
+  These options use an asterisk (\*) to mask all text in that element, hiding the actual text but revealing the number of characters entered. However, asterisks aren't valid numbers, so masking number type-specific fields such as telephone or credit card numbers will result in a blank field in a replay.
+
+## Block site content [#block-content]
+
+  You can block entire sections of content on your site, which means the section will appear as an empty placeholder in session replay. For example, if you have an image on your About Us webpage and don’t need it captured, you could block the class containing the image.
+
+  To block specific classes or attributes, you have a few options:
+
+  * On the Application settings page, add your CSS selectors in the \*_Block selectors_ field.
+
+      <img
+        title="Block Selectors"
+        alt="Screenshot of session replay settings"
+        src="/images/browser_screenshot-full_session-replay-app-settings.webp"
+      />
+  * Manually add our CSS class `nr-block` or attribute `data-nr-block` to your webpage HTML. For example, if you wanted to block irrelevant text and images from session replay, add `nr-block` to `<div class>`:
+
+      ```html
+      <html>
+      <head>
+        <title>Sample image and text</title>
+      </head>
+      <body>
+        <div class="image-text-container nr-block">
+          <img src="https://example.com/image.png" alt="Image description">
+        </div>
+      </body>
+      </html>
+      ```
+
+## Ignore user input [#ignore-input]
+
+  You can ignore changes to a user input field, which means the input field will still be displayed in the replay, but you won't display changes to the value. For example, you could ignore the class containing the email address or credit card fields. Password input fields are always masked. 
+
+  To ignore input, add the CSS class `nr-ignore` to the input field’s class name. For example, if you want to ignore sensitive information on a billing page, add `class="nr-ignore"` to `<input type>`:
+
+    ```html
+    <div class="sensitive-information">
+      <h2>Sensitive Information</h2>
+      <p>Credit card number: <input type="number" class="nr-ignore" id="creditCardNumber"></p>
+      <p>Expiration date: <input type="number" class="nr-ignore" id="expirationDate"></p>
+      <p>CVV code: <input type="number" class="nr-ignore" id="cvvCode"></p>
+    </div>
+    ```

src/content/docs/browser/browser-monitoring/browser-pro-features/session-replay/configuration/setup-session-replay.mdx

@@ -0,0 +1,37 @@
+---
+title: "Setup session replay"
+metaDescription: "Enable session replay to play back user interactions and improve page performance."
+freshnessValidatedDate: 2024-12-19
+---
+
+Utilize session replay in New Relic, start by enabling this feature in your browser application settings. This step is essential for capturing user interactions on your web app, providing insights into user journeys, and troubleshooting issues effectively. Follow the steps below to enable session replay and ensure your browser agent is configured correctly.
+
+## Enable session replay [#enable-session-replay]
+
+    1. Go to <DNT>**[one.newrelic.com](https://one.newrelic.com/all-capabilities) > All Capabilities > Browser**</DNT>.
+
+    2. Select your browser app.
+
+    3. In the left-hand menu, click <DNT>**Application settings**</DNT>.
+
+    4. On the <DNT>**Application settings**</DNT> page, make sure <DNT>**Pro**</DNT> or <DNT>**Pro + SPA**</DNT> browser agent is selected. Session replay is not available for the Lite browser agent.
+
+    5. Toggle <DNT>**Session traces**</DNT> and <DNT>**Session replay**</DNT> ON.
+
+        <Callout variant="important">
+          If you are unable to view <DNT>**Session replay**</DNT> settings. Contact your admin for further assistance.
+        </Callout>
+
+## Setting sampling rates [#configure-sampling-rates]
+
+Set a sampling rate (0%-100%) for the following samples:
+
+  * <DNT>**User sessions**</DNT> records a random sample of all user sessions.
+
+  * <DNT>**Errored session**</DNT> records a random sample of all errored sessions. The agent buffers a sliding window of data for up to 30 seconds on the client-side, and if errors occur, the buffered data will be harvested and the remainder of the session will be recorded. If an error doesn't occur, the replay is never harvested.
+
+  For example, if you set the session sampling rate to 50% and the error sampling rate to 100%, it means that:
+
+  * Half of all user sessions will be recorded.
+
+  * All errored sessions will be recorded, even if they're not part of the 50% sample.

src/content/docs/browser/browser-monitoring/browser-pro-features/session-replay/configuration/update-javascript-for-session-replay.mdx

@@ -0,0 +1,23 @@
+---
+title: "Update JavaScript for session replay"
+metaDescription: "Updating JavaScript for session replay to play back user interactions and improve page performance."
+freshnessValidatedDate: 2024-12-19
+---
+
+## (For copy/paste deployed agents) Manually update the JavaScript snippet [#update-snippet]
+
+If you use the copy/paste method to deploy your browser agent, you may need to manually update the JavaScript snippet to include session replay capabilities. This update ensures your application is correctly configured to capture and store replay data.
+
+To update your agent code:
+
+    1. Go to the <DNT>**Application Settings**</DNT> page and copy the JavaScript snippet.
+
+       <img
+         title="Copy/paste installation method"
+         alt="Screenshot of the application settings page."
+         src="/images/browser_screenshot-full_Application-settings-page.webp"
+       />
+
+    2. Paste it in your code where the old snippet was.
+
+    3. Deploy your app.