[DOCS] Updates runtime example in Discover (#100926) (#101112)

* [DOCS] Updates runtime example in Discover

* [DOCS] Updates images

* [DOCS] Adds link to runtime fields

docs/user/discover.asciidoc

@@ -101,22 +101,24 @@ image:images/find-manufacturer-field.png[Fields list that displays the top five
 
 . Click image:images/add-icon.png[Add icon] to toggle the field into the document table.
 
-. Find the `day of week` field and add it to your document table. Your table should look like this:
+. Find the `customer_first_name` and `customer_last_name` last name fields and add
+them to your document table. Your table should look similar to this:
 +
 [role="screenshot"]
-image:images/document-table.png[Document table with fields for manufacturer, geo.country_iso_code, and day_of_week]
-
+image:images/document-table.png[Document table with fields for manufacturer, customer_first_name, and customer_last_name]
 
 . To rearrange the table columns, hover the mouse over a
-column header, and then use the move and sort controls.
+column header, and then use the move controls.
+
+. To view more of the document table, click *Hide chart*.
 
 [float]
 [[add-field-in-discover]]
-=== Add a field
+=== Add a field to your index pattern
 
 What happens if you forgot to define an important value as a separate field? Or, what if you
-want to combine two fields and treat them as one?
-You can add a field to your index pattern from inside of **Discover**,
+want to combine two fields and treat them as one? This is where {ref}/runtime.html[runtime fields] come into play.
+You can add a runtime field to your index pattern from inside of **Discover**,
 and then use that field for analysis and visualizations,
 the same way you do with other fields.
 
@@ -129,7 +131,7 @@ image:images/add-field-to-pattern.png[Dropdown menu located next to index patter
 
 . Turn on *Set value*.
 
-. Use the Painless scripting language to define the field:
+. Define the script using the Painless scripting language.  Runtime fields require an `emit()`.
 +
 ```ts
 emit("Hello World!");
@@ -137,15 +139,25 @@ emit("Hello World!");
 
 . Click *Save*.
 
-. In the fields list, search for the *hello* field, and then click it.
-+
-You'll see the top values for the field.  The pop-up also includes actions for filtering,
-editing, and deleting the field.
+. In the fields list, search for the *hello* field, and then add it to the table to view it's value.
 +
 [role="screenshot"]
-image:images/hello-field.png[Top values for the hello field, width=50%]
+image:images/hello-field.png[hello field in the document table]
 
-For more information on adding fields and Painless scripting language examples, refer to <<runtime-fields, Explore your data with runtime fields>>.
+. Create a second field named `customer` that combines customer last name and first initial.
++
+```ts
+String str = doc['customer_first_name.keyword'].value;
+char ch1 = str.charAt(0);
+emit(doc['customer_last_name.keyword'].value + ", " + ch1);
+```
+. Simplify the the document table by removing `customer_first_name` and `customer_last_name` and adding `customer` in their place.
++
+[role="screenshot"]
+image:images/customer.png[Customer last name, first initial in the document table]
++
+For more information on adding fields and Painless scripting language examples,
+refer to <<runtime-fields, Explore your data with runtime fields>>.
 
 
 [float]
@@ -202,7 +214,7 @@ click the close icon (x) next to its name in the filter bar.
 Dive into an individual document to view its fields and the documents
 that occurred before and after it.
 
-. In the document table, expand any document. To view more of the document table, click *Hide chart*.
+. In the document table, expand any document.
 +
 [role="screenshot"]
 image:images/document-table-expanded.png[Table view with document expanded]
@@ -238,7 +250,7 @@ image:images/discover-save-saved-search.png[Save saved search in Discover, width
 If a field can be {ref}/search-aggregations.html[aggregated], you can quickly
 visualize it from **Discover**.
 
-. From the **Selected fields** list, click  `day_of_week`, and then click **Visualize**.
+. From the **Available fields** list, click  `day_of_week`, and then click **Visualize**.
 +
 [role="screenshot"]
 image:images/discover-visualize.png[Discover sidebar field popover with visualize button, width=75%]