Fixing issue #317 - RUM section of workshop

rcastley · rcastley · commit 31aa8fe66c2d · 2024-09-27T17:24:32.000+01:00
diff --git a/content/en/ninja-workshops/1-automatic-discovery/2-petclinic-kubernetes/8-rum/1-rebuild-app.md b/content/en/ninja-workshops/1-automatic-discovery/2-petclinic-kubernetes/8-rum/1-rebuild-app.md
@@ -2,6 +2,7 @@
 title: Rebuild PetClinic with RUM enabled
 linkTitle: 1. Rebuild PetClinic
 weight: 1
+hidden: true
 ---
 
 At the top of the previous code snippet, there is a reference to the file `/static/env.js`, which contains/sets the variables used by RUM, currently these are not configured and therefore no RUM traces are currently being sent.
diff --git a/content/en/ninja-workshops/1-automatic-discovery/2-petclinic-kubernetes/8-rum/1-rum-tour.md b/content/en/ninja-workshops/1-automatic-discovery/2-petclinic-kubernetes/8-rum/1-rum-tour.md
@@ -1,7 +1,7 @@
 ---
 title: Select the RUM view for the Petclinic App
-linkTitle: 2. Verify RUM Data
-weight: 2
+linkTitle: 1. Verify RUM Data
+weight: 1
 ---
 
 Once RUM has been configured and you have added a visit for a pet, you can log in to **Splunk Observability Cloud** and verify that RUM traces are flowing in.
diff --git a/content/en/ninja-workshops/1-automatic-discovery/2-petclinic-kubernetes/8-rum/2-rum-tour.md b/content/en/ninja-workshops/1-automatic-discovery/2-petclinic-kubernetes/8-rum/2-rum-tour.md
@@ -1,7 +1,7 @@
 ---
 title: RUM trace Waterfall view & linking to APM 
 linkTitle: 2. Follow RUM Traces
-weight: 3
+weight: 2
 ---
 In the TAG Spotlight view, you are presented with all the tags associated with the RUM data. Tags are key-value pairs that are used to identify the data. In this case, the tags are automatically generated by the OpenTelemetry instrumentation. The tags are used to filter the data and to create the charts and tables. The Tag Spotlight view allows you detect trends in behavior and to drill down into a user session.
 
diff --git a/content/en/ninja-workshops/1-automatic-discovery/2-petclinic-kubernetes/8-rum/3-rum-tour.md b/content/en/ninja-workshops/1-automatic-discovery/2-petclinic-kubernetes/8-rum/3-rum-tour.md
@@ -1,7 +1,7 @@
 ---
 title: RUM trace Waterfall view & linking to APM 
-linkTitle: 2. RUM Waterfall
-weight: 4
+linkTitle: 3. RUM Waterfall
+weight: 3
 ---
 
 We are now looking at the RUM Trace waterfall, this will tell you what happened during the session on the user device as they visited the page of our petclinic application.
diff --git a/content/en/ninja-workshops/1-automatic-discovery/2-petclinic-kubernetes/8-rum/_index.md b/content/en/ninja-workshops/1-automatic-discovery/2-petclinic-kubernetes/8-rum/_index.md
@@ -5,84 +5,16 @@ weight: 9
 time: 10 minutes
 ---
 
-To enable Real User Monitoring (RUM) instrumentation for your application, you need to add the Open Telemetry Javascript [**https://github.com/signalfx/splunk-otel-js-web**](https://github.com/signalfx/splunk-otel-js-web) snippet to your code.
+To enable Real User Monitoring (RUM) instrumentation for an application, you need to add the Open Telemetry Javascript [**https://github.com/signalfx/splunk-otel-js-web**](https://github.com/signalfx/splunk-otel-js-web) snippet to the code base.
 
-The Spring PetClinic application uses a single HTML page as the "index" page, that is reused across all pages of the application. This is the perfect location to insert the Splunk RUM Instrumentation Library as it will be loaded for all pages automatically.
+The Spring PetClinic application uses a single [**index**](https://github.com/spring-petclinic/spring-petclinic-microservices/blob/main/spring-petclinic-api-gateway/src/main/resources/static/index.html) HTML page, that is reused across all views of the application. This is the perfect location to insert the Splunk RUM instrumentation library as it will be loaded for all pages automatically.
 
-The following snippet is inserted into the **<head>** section of the `index.html` page:
+The `api-gateway` service is already running the instrumentation and sending RUM traces to Splunk Observability Cloud and we will review the data in the next section.
 
-``` html
-<script src="/static/env.js"></script>
-<script src="https://cdn.signalfx.com/o11y-gdi-rum/latest/splunk-otel-web.js" crossorigin="anonymous"></script>
-<script src="https://cdn.signalfx.com/o11y-gdi-rum/latest/splunk-otel-web-session-recorder.js" crossorigin="anonymous"></script>
-<script>
-    var realm = env.RUM_REALM;
-    console.log('Realm:', realm);
-    var auth = env.RUM_AUTH;
-    var appName = env.RUM_APP_NAME;
-    var environmentName = env.RUM_ENVIRONMENT
-    if (realm && auth) {
-        SplunkRum.init({
-            realm: realm,
-            rumAccessToken: auth,
-            applicationName: appName,
-            deploymentEnvironment: environmentName,
-            version: '1.0.0',
-        });
-
-        SplunkSessionRecorder.init({
-            app: appName,
-            realm: realm,
-            rumAccessToken: auth
-        });
-        const Provider = SplunkRum.provider; 
-        var tracer=Provider.getTracer('appModuleLoader');
-    } else {
-    // Realm or auth is empty, provide default values or skip initialization
-    console.log("Realm or auth is empty. Skipping Splunk Rum initialization.");
-    }
-</script>
-```
-
-The above snippet of code has already been added to `index.html` in the repository you cloned earlier, but it is not yet activated, we will do that in the next section.
-
-If you want you can verify the snippet, we added to the index.html by viewing the file:
-
-{{< tabs >}}
-{{% tab title="View index.html" %}}
-
-``` bash
- more ~/spring-petclinic-microservices/spring-petclinic-api-gateway/src/main/resources/static/index.html
-```
-
-{{% /tab %}}
-{{% tab title="Output" %}}
-
-```text
-<!DOCTYPE html>
+If you want you can verify the snippet, you can view the page source in your browser by right-clicking on the page and selecting **View Page Source**.
 
-<html ng-app="petClinicApp" lang="en">
-
-<head>
-    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
-    <meta charset="utf-8"/>
-    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
-    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0, minimal-ui"/>
-    <!-- The above 4 meta tags *must* come first in the head; any other head content must come *after* these tags -->
-
-    <link rel="shortcut icon" type="image/x-icon" href="/images/favicon.png"/>
-
-    <title>PetClinic :: a Spring Framework demonstration</title>
-    <link rel="stylesheet" href="/webjars/bootstrap/css/bootstrap.min.css"/>
-    <link rel="stylesheet" href="/css/petclinic.css"/>
-
-    <script src="/webjars/jquery/jquery.min.js"></script>
-    <script src="/webjars/bootstrap/js/bootstrap.min.js"></script>
-
-    <script src="/webjars/angularjs/angular.min.js"></script>
-    <script src="/webjars/angular-ui-router/angular-ui-router.min.js"></script>
-    <!-- Section added for  RUM -->
-    <script src="/scripts/env.js"></script>
+``` html
+    <script src="/env.js"></script>  
     <script src="https://cdn.signalfx.com/o11y-gdi-rum/latest/splunk-otel-web.js" crossorigin="anonymous"></script>
     <script src="https://cdn.signalfx.com/o11y-gdi-rum/latest/splunk-otel-web-session-recorder.js" crossorigin="anonymous"></script>
     <script>
@@ -99,22 +31,18 @@ If you want you can verify the snippet, we added to the index.html by viewing th
                 deploymentEnvironment: environmentName,
                 version: '1.0.0',
             });
-
+    
             SplunkSessionRecorder.init({
                 app: appName,
                 realm: realm,
                 rumAccessToken: auth
             });
-            const Provider = SplunkRum.provider;
+            const Provider = SplunkRum.provider; 
             var tracer=Provider.getTracer('appModuleLoader');
         } else {
         // Realm or auth is empty, provide default values or skip initialization
         console.log("Realm or auth is empty. Skipping Splunk Rum initialization.");
         }
     </script>
      <!-- Section added for  RUM -->
-    <script src="/scripts/app.js"></script>
- ```
-    
-{{% /tab %}}
-{{< /tabs >}}
+```
diff --git a/workshop/petclinic/petclinic-deploy.yaml b/workshop/petclinic/petclinic-deploy.yaml
@@ -155,7 +155,7 @@ spec:
             - java
             - org.springframework.boot.loader.JarLauncher
           name: api-gateway
-          image: quay.io/phagen/spring-petclinic-api-gateway:0.1  #Multi-arch
+          image: quay.io/phagen/spring-petclinic-api-gateway:0.0.7
           #image: localhost:9999/spring-petclinic-api-gateway:local
           imagePullPolicy: Always
           ports:
