[DOCS] Updates docs for Console (elastic#35505)

* update docs and screenshots

* [DOCS] Updates Console text and images

docs/dev-tools.asciidoc

@@ -6,6 +6,12 @@
 --
 The *Dev Tools* page contains development tools that you can use to interact
 with your data in Kibana.
+
+* <<console-kibana, Console>>
+* <<xpack-profiler, Search Profiler>>
+* <<xpack-grokdebugger, Grok Debugger>>
+
+
 --
 
 include::dev-tools/console/console.asciidoc[]

docs/dev-tools/console/auto-formatting.asciidoc

@@ -1,19 +1,20 @@
 [[auto-formatting]]
-=== Auto Formatting
+=== Auto formatting
 
-Console allows you to auto format messy requests. To do so, position the cursor on the request you would like to format
-and select Auto Indent from the action menu:
+Console can help you format requests. Select one or more requests that you
+want to format, click the action icon (image:dev-tools/console/images/wrench.png[]),
+and select *Auto indent*.
 
-.Auto Indent a request
-image::images/auto_format_before.png["Auto format before",width=500,align="center"]
+For example, you might have a request that is formatted like this:
 
-Console will adjust the JSON body of the request and it will now look like this:
+[role="screenshot"]
+image::dev-tools/console/images/copy-curl.png["Console close-up"]
 
-.A formatted request
-image::images/auto_format_after.png["Auto format after",width=500,align="center"]
+Console adjusts the JSON body of the request to apply the indents. 
 
-If you select Auto Indent on a request that is already perfectly formatted, Console will collapse the
-request body to a single line per document. This is very handy when working with Elasticsearch's bulk APIs:
+[role="screenshot"]
+image::dev-tools/console/images/request.png["Console close-up"]
 
-.One doc per line
-image::images/auto_format_bulk.png["Auto format bulk",width=550,align="center"]
+If you select *Auto indent* on a request that is already well formatted, 
+Console collapses the request body to a single line per document. 
+This is helpful when working with {es}'s {ref}/docs-bulk.html[bulk APIs].

docs/dev-tools/console/configuring-console.asciidoc

@@ -1,6 +1,26 @@
 [[configuring-console]]
 === Configuring Console
 
-You can add the following options in the `config/kibana.yml` file:
+You can configure Console to your preferences.
+
+[float]
+==== Configuring settings
+
+*Settings* allows you to modify the font size and set the fileds for
+autocomplete.
+
+[role="screenshot"]
+image::dev-tools/console/images/console-settings.png["Console settings"]
+
+
+[float]
+[[console-settings]]
+==== Disabling Console
+
+If you don’t want to use Console, you can disable it by setting `console.enabled` 
+to false in your `kibana.yml` configuration file. Changing this setting 
+causes the server to regenerate assets on the next startup, 
+which might cause a delay before pages start being served.
+
+
 
-`console.enabled`:: *Default: true* Set to false to disable Console. Toggling this will cause the server to regenerate assets on the next startup, which may cause a delay before pages start being served.

docs/dev-tools/console/console.asciidoc

@@ -1,15 +1,25 @@
 [[console-kibana]]
 == Console
 
-The Console plugin provides a UI to interact with the REST API of Elasticsearch. Console has two main areas: the *editor*,
-where you compose requests to Elasticsearch, and the *response* pane, which displays the responses to the request.
+Console enables you to interact with the REST API of {es}. *Note:* You cannot 
+interact with {kib} API endpoints via Console.
 
-NOTE: You cannot interact with Kibana API endpoints via the Console.
+Go to *Dev Tools > Console* to get started. 
 
-.The Console UI
-image::dev-tools/console/images/introduction_screen.png[Screenshot]
+Console has two main areas: 
 
-Console understands commands in a cURL-like syntax. For example the following Console command
+* The *editor*, where you compose requests to send to {es}.
+* The *response* pane, which displays the responses to the request.
+
+[role="screenshot"]
+image::dev-tools/console/images/console.png["Console"]
+
+[float]
+[[console-api]]
+=== Writing requests
+
+Console understands commands in a cURL-like syntax. 
+For example, the following is a `GET` request to the {es} `_search` API. 
 
 [source,js]
 ----------------------------------
@@ -21,7 +31,7 @@ GET /_search
 }
 ----------------------------------
 
-is a simple `GET` request to Elasticsearch's `_search API`. Here is the equivalent command in cURL.
+Here is the equivalent command in cURL:
 
 [source,bash]
 ----------------------------------
@@ -33,38 +43,55 @@ curl -XGET "http://localhost:9200/_search" -d'
 }'
 ----------------------------------
 
-In fact, you can paste the above command into Console and it will automatically be converted into the Console syntax.
+If you paste the above command into Console, {kib} automatically converts it
+to Console syntax.  Alternatively, if you want to want to see Console syntax in cURL, 
+click the action icon (image:dev-tools/console/images/wrench.png[]) and select *Copy as cURL*. 
 
-When typing a command, Console will make context sensitive <<suggestions,suggestions>>. These suggestions can help
-you explore parameters for each API, or to just speed up typing. Console will suggest APIs, indexes and field
-names.
+For help with formatting requests, you can use Console's <<auto-formatting, auto formatting>> 
+feature.
 
-[[suggestions]]
-.API suggestions
-image::dev-tools/console/images/introduction_suggestion.png["Suggestions",width=400,align="center"]
 
-Once you have typed a command in to the left pane, you can submit it to Elasticsearch by clicking the little green
-triangle that appears next to the URL line of the request. Notice that as you move the cursor around, the little
- triangle and wrench icons follow you around. We call this the <<action_menu,Action Menu>>. You can also select
- multiple requests and submit them all at once.
+[float]
+[[console-request]]
+=== Submitting requests 
 
-[[action_menu]]
-.The Action Menu
-image::dev-tools/console/images/introduction_action_menu.png["The Action Menu",width=400,align="center"]
+Once you enter a command in the editor, click the 
+green triangle to submit the request to {es}.
 
-When the response come back, you should see it in the right hand panel:
+You can select multiple requests and submit them together.
+Console sends the requests to {es} one by one and shows the output 
+in the response pane. Submitting multiple request is helpful when you're debugging an issue or trying query 
+combinations in multiple scenarios.
 
-.The Output Pane
-image::dev-tools/console/images/introduction_output.png[Screenshot]
+[float]
+[[console-autocomplete]]
+=== Using autocomplete
 
-include::multi-requests.asciidoc[]
+When typing a command, Console makes context-sensitive suggestions.
+These suggestions can help you explore parameters for each API and speed up typing. 
+To configure your preferences for autocomplete, go to 
+<<configuring-console, Settings>>. 
 
-include::auto-formatting.asciidoc[]
+[float]
+[[console-view-api]]
+=== Viewing API docs
 
-include::keyboard-shortcuts.asciidoc[]
+You can view the documentation for an API endpoint by clicking
+the action icon (image:dev-tools/console/images/wrench.png[]) and selecting
+*Open documentation*.
+
+[float]
+[[console-history]]
+=== Getting your request history
 
-include::history.asciidoc[]
+Console maintains a list of the last 500 requests that {es} successfully executed. 
+To view your most recent requests, click *History*. If you select a request
+and click *Apply*, {kib} adds it to the editor at the current cursor position.
 
-include::settings.asciidoc[]
+
+
+include::auto-formatting.asciidoc[]
+
+include::keyboard-shortcuts.asciidoc[]
 
 include::configuring-console.asciidoc[]

docs/dev-tools/console/keyboard-shortcuts.asciidoc

@@ -1,21 +1,22 @@
 [[keyboard-shortcuts]]
 === Keyboard shortcuts
 
-Console comes with a set of nifty keyboard shortcuts making working with it even more efficient. Here is an overview:
+The keyboard shortcuts below can help you move quickly through Console.  You can
+also view these shortcuts by clicking *Help* in Console.
 
 [float]
 ==== General editing
 
 Ctrl/Cmd + I:: Auto indent current request.
-Ctrl + Space:: Open Auto complete (even if not typing).
+Ctrl + Space:: Open Autocomplete (even if not typing).
 Ctrl/Cmd + Enter:: Submit request.
 Ctrl/Cmd + Up/Down:: Jump to the previous/next request start or end.
 Ctrl/Cmd + Alt + L:: Collapse/expand current scope.
 Ctrl/Cmd + Option + 0:: Collapse all scopes but the current one. Expand by adding a shift.
 
 [float]
-==== When auto-complete is visible
+==== When autocomplete is visible
 
-Down arrow:: Switch focus to auto-complete menu. Use arrows to further select a term.
-Enter/Tab::  Select the currently selected or the top most term in auto-complete menu.
-Esc:: Close auto-complete menu.
+Down arrow:: Switch focus to autocomplete menu. Use arrows to further select a term.
+Enter/Tab::  Select the currently selected or the top most term in autocomplete menu.
+Esc:: Close autocomplete menu.