From 5f12db95df9e1ba706ec123f6eda541f9935e68c Mon Sep 17 00:00:00 2001
From: Eugene Lee <eugenesk@amazon.com>
Date: Mon, 28 Feb 2022 09:16:48 -0800
Subject: [PATCH] Make base query immutable (#500)

Signed-off-by: Eugene Lee <eugenesk@amazon.com>
---
 .../__snapshots__/create.test.tsx.snap        | 2066 ++++++++++-------
 .../__snapshots__/log_config.test.tsx.snap    |  734 +++---
 .../__tests__/create.test.tsx                 |   56 +
 .../__tests__/log_config.test.tsx             |   16 +
 .../application_analytics/app_analytics.scss  |   19 +
 .../config_components/log_config.tsx          |   81 +-
 .../components/create.tsx                     |    2 +-
 .../components/common/search/autocomplete.tsx |    3 +
 8 files changed, 1798 insertions(+), 1179 deletions(-)
 create mode 100644 dashboards-observability/public/components/application_analytics/app_analytics.scss

diff --git a/dashboards-observability/public/components/application_analytics/__tests__/__snapshots__/create.test.tsx.snap b/dashboards-observability/public/components/application_analytics/__tests__/__snapshots__/create.test.tsx.snap
index 2380df385..67e7880b5 100644
--- a/dashboards-observability/public/components/application_analytics/__tests__/__snapshots__/create.test.tsx.snap
+++ b/dashboards-observability/public/components/application_analytics/__tests__/__snapshots__/create.test.tsx.snap
@@ -234,75 +234,98 @@ Object {
                         class="euiAccordion__padding--l"
                       >
                         <div
-                          class="euiFormRow"
-                          id="random_html_id-row"
+                          class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionColumn euiFlexGroup--responsive"
                         >
                           <div
-                            class="euiFormRow__labelWrapper"
+                            class="euiFlexItem"
                           >
-                            <label
-                              class="euiFormLabel euiFormRow__label"
-                              for="random_html_id"
+                            <div
+                              class="euiCallOut euiCallOut--primary euiCallOut--small"
+                              style="max-width: 900px;"
                             >
-                              PPL Base Query
-                            </label>
+                              <div
+                                class="euiText euiText--extraSmall"
+                              >
+                                You can't change the base query after the application is created.
+                              </div>
+                            </div>
                           </div>
                           <div
-                            class="euiFormRow__fieldWrapper"
+                            class="euiFlexItem"
                           >
                             <div
-                              aria-describedby="random_html_id-help"
-                              class="euiFlexItem euiFlexItem--flexGrowZero query-area"
-                              id="random_html_id"
+                              class="euiFormRow"
+                              id="random_html_id-row"
                             >
                               <div
-                                aria-expanded="false"
-                                aria-haspopup="listbox"
-                                aria-labelledby="autocomplete-3-label"
-                                class="aa-Autocomplete"
-                                id="autocomplete-root"
-                                role="combobox"
-                              >
-                                <textarea
-                                  aria-autocomplete="both"
-                                  aria-labelledby="autocomplete-3-label"
-                                  autocapitalize="off"
-                                  autocomplete="off"
-                                  autocorrect="off"
-                                  class="euiTextArea euiTextArea--resizeVertical"
-                                  data-test-subj="searchAutocompleteTextArea"
-                                  enterkeyhint="search"
-                                  id="autocomplete-textarea"
-                                  maxlength="512"
-                                  placeholder="Enter PPL query"
-                                  rows="6"
-                                  spellcheck="false"
-                                  type="search"
+                                class="euiFormRow__labelWrapper"
+                              >
+                                <label
+                                  class="euiFormLabel euiFormRow__label"
+                                  for="random_html_id"
                                 >
-                                  source = openserach_dashboard_sample_logs
-                                </textarea>
+                                  Base Query
+                                </label>
                               </div>
-                              <button
-                                aria-label="pplLinkShowFlyout"
-                                class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
-                                title="PPL"
+                              <div
+                                class="euiFormRow__fieldWrapper"
                               >
-                                <span
-                                  class="euiBadge__content"
+                                <div
+                                  aria-describedby="random_html_id-help"
+                                  class="euiFlexItem euiFlexItem--flexGrowZero query-area"
+                                  id="random_html_id"
+                                  style="min-width: 900px;"
                                 >
-                                  <span
-                                    class="euiBadge__text"
+                                  <div
+                                    aria-expanded="false"
+                                    aria-haspopup="listbox"
+                                    aria-labelledby="autocomplete-3-label"
+                                    class="aa-Autocomplete"
+                                    id="autocomplete-root"
+                                    role="combobox"
                                   >
-                                    PPL
-                                  </span>
-                                </span>
-                              </button>
-                            </div>
-                            <div
-                              class="euiFormHelpText euiFormRow__text"
-                              id="random_html_id-help"
-                            >
-                              The default logs view in the application will be filtered by this query.
+                                    <textarea
+                                      aria-autocomplete="both"
+                                      aria-labelledby="autocomplete-3-label"
+                                      autocapitalize="off"
+                                      autocomplete="off"
+                                      autocorrect="off"
+                                      class="euiTextArea euiTextArea--resizeVertical"
+                                      data-test-subj="searchAutocompleteTextArea"
+                                      enterkeyhint="search"
+                                      id="autocomplete-textarea"
+                                      maxlength="512"
+                                      placeholder="Enter PPL query"
+                                      rows="6"
+                                      spellcheck="false"
+                                      type="search"
+                                    >
+                                      source = openserach_dashboard_sample_logs
+                                    </textarea>
+                                  </div>
+                                  <button
+                                    aria-label="pplLinkShowFlyout"
+                                    class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
+                                    title="PPL"
+                                  >
+                                    <span
+                                      class="euiBadge__content"
+                                    >
+                                      <span
+                                        class="euiBadge__text"
+                                      >
+                                        PPL
+                                      </span>
+                                    </span>
+                                  </button>
+                                </div>
+                                <div
+                                  class="euiFormHelpText euiFormRow__text"
+                                  id="random_html_id-help"
+                                >
+                                  The default logs view in the application will be filtered by this query.
+                                </div>
+                              </div>
                             </div>
                           </div>
                         </div>
@@ -1419,75 +1442,98 @@ Object {
                       class="euiAccordion__padding--l"
                     >
                       <div
-                        class="euiFormRow"
-                        id="random_html_id-row"
+                        class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionColumn euiFlexGroup--responsive"
                       >
                         <div
-                          class="euiFormRow__labelWrapper"
+                          class="euiFlexItem"
                         >
-                          <label
-                            class="euiFormLabel euiFormRow__label"
-                            for="random_html_id"
+                          <div
+                            class="euiCallOut euiCallOut--primary euiCallOut--small"
+                            style="max-width: 900px;"
                           >
-                            PPL Base Query
-                          </label>
+                            <div
+                              class="euiText euiText--extraSmall"
+                            >
+                              You can't change the base query after the application is created.
+                            </div>
+                          </div>
                         </div>
                         <div
-                          class="euiFormRow__fieldWrapper"
+                          class="euiFlexItem"
                         >
                           <div
-                            aria-describedby="random_html_id-help"
-                            class="euiFlexItem euiFlexItem--flexGrowZero query-area"
-                            id="random_html_id"
+                            class="euiFormRow"
+                            id="random_html_id-row"
                           >
                             <div
-                              aria-expanded="false"
-                              aria-haspopup="listbox"
-                              aria-labelledby="autocomplete-3-label"
-                              class="aa-Autocomplete"
-                              id="autocomplete-root"
-                              role="combobox"
+                              class="euiFormRow__labelWrapper"
                             >
-                              <textarea
-                                aria-autocomplete="both"
-                                aria-labelledby="autocomplete-3-label"
-                                autocapitalize="off"
-                                autocomplete="off"
-                                autocorrect="off"
-                                class="euiTextArea euiTextArea--resizeVertical"
-                                data-test-subj="searchAutocompleteTextArea"
-                                enterkeyhint="search"
-                                id="autocomplete-textarea"
-                                maxlength="512"
-                                placeholder="Enter PPL query"
-                                rows="6"
-                                spellcheck="false"
-                                type="search"
-                              >
-                                source = openserach_dashboard_sample_logs
-                              </textarea>
+                              <label
+                                class="euiFormLabel euiFormRow__label"
+                                for="random_html_id"
+                              >
+                                Base Query
+                              </label>
                             </div>
-                            <button
-                              aria-label="pplLinkShowFlyout"
-                              class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
-                              title="PPL"
+                            <div
+                              class="euiFormRow__fieldWrapper"
                             >
-                              <span
-                                class="euiBadge__content"
+                              <div
+                                aria-describedby="random_html_id-help"
+                                class="euiFlexItem euiFlexItem--flexGrowZero query-area"
+                                id="random_html_id"
+                                style="min-width: 900px;"
                               >
-                                <span
-                                  class="euiBadge__text"
+                                <div
+                                  aria-expanded="false"
+                                  aria-haspopup="listbox"
+                                  aria-labelledby="autocomplete-3-label"
+                                  class="aa-Autocomplete"
+                                  id="autocomplete-root"
+                                  role="combobox"
                                 >
-                                  PPL
-                                </span>
-                              </span>
-                            </button>
-                          </div>
-                          <div
-                            class="euiFormHelpText euiFormRow__text"
-                            id="random_html_id-help"
-                          >
-                            The default logs view in the application will be filtered by this query.
+                                  <textarea
+                                    aria-autocomplete="both"
+                                    aria-labelledby="autocomplete-3-label"
+                                    autocapitalize="off"
+                                    autocomplete="off"
+                                    autocorrect="off"
+                                    class="euiTextArea euiTextArea--resizeVertical"
+                                    data-test-subj="searchAutocompleteTextArea"
+                                    enterkeyhint="search"
+                                    id="autocomplete-textarea"
+                                    maxlength="512"
+                                    placeholder="Enter PPL query"
+                                    rows="6"
+                                    spellcheck="false"
+                                    type="search"
+                                  >
+                                    source = openserach_dashboard_sample_logs
+                                  </textarea>
+                                </div>
+                                <button
+                                  aria-label="pplLinkShowFlyout"
+                                  class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
+                                  title="PPL"
+                                >
+                                  <span
+                                    class="euiBadge__content"
+                                  >
+                                    <span
+                                      class="euiBadge__text"
+                                    >
+                                      PPL
+                                    </span>
+                                  </span>
+                                </button>
+                              </div>
+                              <div
+                                class="euiFormHelpText euiFormRow__text"
+                                id="random_html_id-help"
+                              >
+                                The default logs view in the application will be filtered by this query.
+                              </div>
+                            </div>
                           </div>
                         </div>
                       </div>
@@ -2543,73 +2589,96 @@ Object {
                         class="euiAccordion__padding--l"
                       >
                         <div
-                          class="euiFormRow"
-                          id="random_html_id-row"
+                          class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionColumn euiFlexGroup--responsive"
                         >
                           <div
-                            class="euiFormRow__labelWrapper"
+                            class="euiFlexItem"
                           >
-                            <label
-                              class="euiFormLabel euiFormRow__label"
-                              for="random_html_id"
+                            <div
+                              class="euiCallOut euiCallOut--primary euiCallOut--small"
+                              style="max-width: 900px;"
                             >
-                              PPL Base Query
-                            </label>
+                              <div
+                                class="euiText euiText--extraSmall"
+                              >
+                                You can't change the base query after the application is created.
+                              </div>
+                            </div>
                           </div>
                           <div
-                            class="euiFormRow__fieldWrapper"
+                            class="euiFlexItem"
                           >
                             <div
-                              aria-describedby="random_html_id-help"
-                              class="euiFlexItem euiFlexItem--flexGrowZero query-area"
-                              id="random_html_id"
+                              class="euiFormRow"
+                              id="random_html_id-row"
                             >
                               <div
-                                aria-expanded="false"
-                                aria-haspopup="listbox"
-                                aria-labelledby="autocomplete-7-label"
-                                class="aa-Autocomplete"
-                                id="autocomplete-root"
-                                role="combobox"
-                              >
-                                <textarea
-                                  aria-autocomplete="both"
-                                  aria-labelledby="autocomplete-7-label"
-                                  autocapitalize="off"
-                                  autocomplete="off"
-                                  autocorrect="off"
-                                  class="euiTextArea euiTextArea--resizeVertical"
-                                  data-test-subj="searchAutocompleteTextArea"
-                                  enterkeyhint="search"
-                                  id="autocomplete-textarea"
-                                  maxlength="512"
-                                  placeholder="Enter PPL query"
-                                  rows="6"
-                                  spellcheck="false"
-                                  type="search"
-                                />
+                                class="euiFormRow__labelWrapper"
+                              >
+                                <label
+                                  class="euiFormLabel euiFormRow__label"
+                                  for="random_html_id"
+                                >
+                                  Base Query
+                                </label>
                               </div>
-                              <button
-                                aria-label="pplLinkShowFlyout"
-                                class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
-                                title="PPL"
+                              <div
+                                class="euiFormRow__fieldWrapper"
                               >
-                                <span
-                                  class="euiBadge__content"
+                                <div
+                                  aria-describedby="random_html_id-help"
+                                  class="euiFlexItem euiFlexItem--flexGrowZero query-area"
+                                  id="random_html_id"
+                                  style="min-width: 900px;"
                                 >
-                                  <span
-                                    class="euiBadge__text"
+                                  <div
+                                    aria-expanded="false"
+                                    aria-haspopup="listbox"
+                                    aria-labelledby="autocomplete-7-label"
+                                    class="aa-Autocomplete"
+                                    id="autocomplete-root"
+                                    role="combobox"
                                   >
-                                    PPL
-                                  </span>
-                                </span>
-                              </button>
-                            </div>
-                            <div
-                              class="euiFormHelpText euiFormRow__text"
-                              id="random_html_id-help"
-                            >
-                              The default logs view in the application will be filtered by this query.
+                                    <textarea
+                                      aria-autocomplete="both"
+                                      aria-labelledby="autocomplete-7-label"
+                                      autocapitalize="off"
+                                      autocomplete="off"
+                                      autocorrect="off"
+                                      class="euiTextArea euiTextArea--resizeVertical"
+                                      data-test-subj="searchAutocompleteTextArea"
+                                      enterkeyhint="search"
+                                      id="autocomplete-textarea"
+                                      maxlength="512"
+                                      placeholder="Enter PPL query"
+                                      rows="6"
+                                      spellcheck="false"
+                                      type="search"
+                                    />
+                                  </div>
+                                  <button
+                                    aria-label="pplLinkShowFlyout"
+                                    class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
+                                    title="PPL"
+                                  >
+                                    <span
+                                      class="euiBadge__content"
+                                    >
+                                      <span
+                                        class="euiBadge__text"
+                                      >
+                                        PPL
+                                      </span>
+                                    </span>
+                                  </button>
+                                </div>
+                                <div
+                                  class="euiFormHelpText euiFormRow__text"
+                                  id="random_html_id-help"
+                                >
+                                  The default logs view in the application will be filtered by this query.
+                                </div>
+                              </div>
                             </div>
                           </div>
                         </div>
@@ -3639,73 +3708,96 @@ Object {
                       class="euiAccordion__padding--l"
                     >
                       <div
-                        class="euiFormRow"
-                        id="random_html_id-row"
+                        class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionColumn euiFlexGroup--responsive"
                       >
                         <div
-                          class="euiFormRow__labelWrapper"
+                          class="euiFlexItem"
                         >
-                          <label
-                            class="euiFormLabel euiFormRow__label"
-                            for="random_html_id"
+                          <div
+                            class="euiCallOut euiCallOut--primary euiCallOut--small"
+                            style="max-width: 900px;"
                           >
-                            PPL Base Query
-                          </label>
+                            <div
+                              class="euiText euiText--extraSmall"
+                            >
+                              You can't change the base query after the application is created.
+                            </div>
+                          </div>
                         </div>
                         <div
-                          class="euiFormRow__fieldWrapper"
+                          class="euiFlexItem"
                         >
                           <div
-                            aria-describedby="random_html_id-help"
-                            class="euiFlexItem euiFlexItem--flexGrowZero query-area"
-                            id="random_html_id"
+                            class="euiFormRow"
+                            id="random_html_id-row"
                           >
                             <div
-                              aria-expanded="false"
-                              aria-haspopup="listbox"
-                              aria-labelledby="autocomplete-7-label"
-                              class="aa-Autocomplete"
-                              id="autocomplete-root"
-                              role="combobox"
+                              class="euiFormRow__labelWrapper"
                             >
-                              <textarea
-                                aria-autocomplete="both"
-                                aria-labelledby="autocomplete-7-label"
-                                autocapitalize="off"
-                                autocomplete="off"
-                                autocorrect="off"
-                                class="euiTextArea euiTextArea--resizeVertical"
-                                data-test-subj="searchAutocompleteTextArea"
-                                enterkeyhint="search"
-                                id="autocomplete-textarea"
-                                maxlength="512"
-                                placeholder="Enter PPL query"
-                                rows="6"
-                                spellcheck="false"
-                                type="search"
-                              />
+                              <label
+                                class="euiFormLabel euiFormRow__label"
+                                for="random_html_id"
+                              >
+                                Base Query
+                              </label>
                             </div>
-                            <button
-                              aria-label="pplLinkShowFlyout"
-                              class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
-                              title="PPL"
+                            <div
+                              class="euiFormRow__fieldWrapper"
                             >
-                              <span
-                                class="euiBadge__content"
+                              <div
+                                aria-describedby="random_html_id-help"
+                                class="euiFlexItem euiFlexItem--flexGrowZero query-area"
+                                id="random_html_id"
+                                style="min-width: 900px;"
                               >
-                                <span
-                                  class="euiBadge__text"
+                                <div
+                                  aria-expanded="false"
+                                  aria-haspopup="listbox"
+                                  aria-labelledby="autocomplete-7-label"
+                                  class="aa-Autocomplete"
+                                  id="autocomplete-root"
+                                  role="combobox"
                                 >
-                                  PPL
-                                </span>
-                              </span>
-                            </button>
-                          </div>
-                          <div
-                            class="euiFormHelpText euiFormRow__text"
-                            id="random_html_id-help"
-                          >
-                            The default logs view in the application will be filtered by this query.
+                                  <textarea
+                                    aria-autocomplete="both"
+                                    aria-labelledby="autocomplete-7-label"
+                                    autocapitalize="off"
+                                    autocomplete="off"
+                                    autocorrect="off"
+                                    class="euiTextArea euiTextArea--resizeVertical"
+                                    data-test-subj="searchAutocompleteTextArea"
+                                    enterkeyhint="search"
+                                    id="autocomplete-textarea"
+                                    maxlength="512"
+                                    placeholder="Enter PPL query"
+                                    rows="6"
+                                    spellcheck="false"
+                                    type="search"
+                                  />
+                                </div>
+                                <button
+                                  aria-label="pplLinkShowFlyout"
+                                  class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
+                                  title="PPL"
+                                >
+                                  <span
+                                    class="euiBadge__content"
+                                  >
+                                    <span
+                                      class="euiBadge__text"
+                                    >
+                                      PPL
+                                    </span>
+                                  </span>
+                                </button>
+                              </div>
+                              <div
+                                class="euiFormHelpText euiFormRow__text"
+                                id="random_html_id-help"
+                              >
+                                The default logs view in the application will be filtered by this query.
+                              </div>
+                            </div>
                           </div>
                         </div>
                       </div>
@@ -4794,73 +4886,96 @@ Object {
                         class="euiAccordion__padding--l"
                       >
                         <div
-                          class="euiFormRow"
-                          id="random_html_id-row"
+                          class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionColumn euiFlexGroup--responsive"
                         >
                           <div
-                            class="euiFormRow__labelWrapper"
+                            class="euiFlexItem"
                           >
-                            <label
-                              class="euiFormLabel euiFormRow__label"
-                              for="random_html_id"
+                            <div
+                              class="euiCallOut euiCallOut--primary euiCallOut--small"
+                              style="max-width: 900px;"
                             >
-                              PPL Base Query
-                            </label>
+                              <div
+                                class="euiText euiText--extraSmall"
+                              >
+                                You can't change the base query after the application is created.
+                              </div>
+                            </div>
                           </div>
                           <div
-                            class="euiFormRow__fieldWrapper"
+                            class="euiFlexItem"
                           >
                             <div
-                              aria-describedby="random_html_id-help"
-                              class="euiFlexItem euiFlexItem--flexGrowZero query-area"
-                              id="random_html_id"
+                              class="euiFormRow"
+                              id="random_html_id-row"
                             >
                               <div
-                                aria-expanded="false"
-                                aria-haspopup="listbox"
-                                aria-labelledby="autocomplete-5-label"
-                                class="aa-Autocomplete"
-                                id="autocomplete-root"
-                                role="combobox"
-                              >
-                                <textarea
-                                  aria-autocomplete="both"
-                                  aria-labelledby="autocomplete-5-label"
-                                  autocapitalize="off"
-                                  autocomplete="off"
-                                  autocorrect="off"
-                                  class="euiTextArea euiTextArea--resizeVertical"
-                                  data-test-subj="searchAutocompleteTextArea"
-                                  enterkeyhint="search"
-                                  id="autocomplete-textarea"
-                                  maxlength="512"
-                                  placeholder="Enter PPL query"
-                                  rows="6"
-                                  spellcheck="false"
-                                  type="search"
-                                />
+                                class="euiFormRow__labelWrapper"
+                              >
+                                <label
+                                  class="euiFormLabel euiFormRow__label"
+                                  for="random_html_id"
+                                >
+                                  Base Query
+                                </label>
                               </div>
-                              <button
-                                aria-label="pplLinkShowFlyout"
-                                class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
-                                title="PPL"
+                              <div
+                                class="euiFormRow__fieldWrapper"
                               >
-                                <span
-                                  class="euiBadge__content"
+                                <div
+                                  aria-describedby="random_html_id-help"
+                                  class="euiFlexItem euiFlexItem--flexGrowZero query-area"
+                                  id="random_html_id"
+                                  style="min-width: 900px;"
                                 >
-                                  <span
-                                    class="euiBadge__text"
+                                  <div
+                                    aria-expanded="false"
+                                    aria-haspopup="listbox"
+                                    aria-labelledby="autocomplete-5-label"
+                                    class="aa-Autocomplete"
+                                    id="autocomplete-root"
+                                    role="combobox"
                                   >
-                                    PPL
-                                  </span>
-                                </span>
-                              </button>
-                            </div>
-                            <div
-                              class="euiFormHelpText euiFormRow__text"
-                              id="random_html_id-help"
-                            >
-                              The default logs view in the application will be filtered by this query.
+                                    <textarea
+                                      aria-autocomplete="both"
+                                      aria-labelledby="autocomplete-5-label"
+                                      autocapitalize="off"
+                                      autocomplete="off"
+                                      autocorrect="off"
+                                      class="euiTextArea euiTextArea--resizeVertical"
+                                      data-test-subj="searchAutocompleteTextArea"
+                                      enterkeyhint="search"
+                                      id="autocomplete-textarea"
+                                      maxlength="512"
+                                      placeholder="Enter PPL query"
+                                      rows="6"
+                                      spellcheck="false"
+                                      type="search"
+                                    />
+                                  </div>
+                                  <button
+                                    aria-label="pplLinkShowFlyout"
+                                    class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
+                                    title="PPL"
+                                  >
+                                    <span
+                                      class="euiBadge__content"
+                                    >
+                                      <span
+                                        class="euiBadge__text"
+                                      >
+                                        PPL
+                                      </span>
+                                    </span>
+                                  </button>
+                                </div>
+                                <div
+                                  class="euiFormHelpText euiFormRow__text"
+                                  id="random_html_id-help"
+                                >
+                                  The default logs view in the application will be filtered by this query.
+                                </div>
+                              </div>
                             </div>
                           </div>
                         </div>
@@ -5890,73 +6005,96 @@ Object {
                       class="euiAccordion__padding--l"
                     >
                       <div
-                        class="euiFormRow"
-                        id="random_html_id-row"
+                        class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionColumn euiFlexGroup--responsive"
                       >
                         <div
-                          class="euiFormRow__labelWrapper"
+                          class="euiFlexItem"
                         >
-                          <label
-                            class="euiFormLabel euiFormRow__label"
-                            for="random_html_id"
+                          <div
+                            class="euiCallOut euiCallOut--primary euiCallOut--small"
+                            style="max-width: 900px;"
                           >
-                            PPL Base Query
-                          </label>
+                            <div
+                              class="euiText euiText--extraSmall"
+                            >
+                              You can't change the base query after the application is created.
+                            </div>
+                          </div>
                         </div>
                         <div
-                          class="euiFormRow__fieldWrapper"
+                          class="euiFlexItem"
                         >
                           <div
-                            aria-describedby="random_html_id-help"
-                            class="euiFlexItem euiFlexItem--flexGrowZero query-area"
-                            id="random_html_id"
+                            class="euiFormRow"
+                            id="random_html_id-row"
                           >
                             <div
-                              aria-expanded="false"
-                              aria-haspopup="listbox"
-                              aria-labelledby="autocomplete-5-label"
-                              class="aa-Autocomplete"
-                              id="autocomplete-root"
-                              role="combobox"
+                              class="euiFormRow__labelWrapper"
                             >
-                              <textarea
-                                aria-autocomplete="both"
-                                aria-labelledby="autocomplete-5-label"
-                                autocapitalize="off"
-                                autocomplete="off"
-                                autocorrect="off"
-                                class="euiTextArea euiTextArea--resizeVertical"
-                                data-test-subj="searchAutocompleteTextArea"
-                                enterkeyhint="search"
-                                id="autocomplete-textarea"
-                                maxlength="512"
-                                placeholder="Enter PPL query"
-                                rows="6"
-                                spellcheck="false"
-                                type="search"
-                              />
+                              <label
+                                class="euiFormLabel euiFormRow__label"
+                                for="random_html_id"
+                              >
+                                Base Query
+                              </label>
                             </div>
-                            <button
-                              aria-label="pplLinkShowFlyout"
-                              class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
-                              title="PPL"
+                            <div
+                              class="euiFormRow__fieldWrapper"
                             >
-                              <span
-                                class="euiBadge__content"
+                              <div
+                                aria-describedby="random_html_id-help"
+                                class="euiFlexItem euiFlexItem--flexGrowZero query-area"
+                                id="random_html_id"
+                                style="min-width: 900px;"
                               >
-                                <span
-                                  class="euiBadge__text"
+                                <div
+                                  aria-expanded="false"
+                                  aria-haspopup="listbox"
+                                  aria-labelledby="autocomplete-5-label"
+                                  class="aa-Autocomplete"
+                                  id="autocomplete-root"
+                                  role="combobox"
                                 >
-                                  PPL
-                                </span>
-                              </span>
-                            </button>
-                          </div>
-                          <div
-                            class="euiFormHelpText euiFormRow__text"
-                            id="random_html_id-help"
-                          >
-                            The default logs view in the application will be filtered by this query.
+                                  <textarea
+                                    aria-autocomplete="both"
+                                    aria-labelledby="autocomplete-5-label"
+                                    autocapitalize="off"
+                                    autocomplete="off"
+                                    autocorrect="off"
+                                    class="euiTextArea euiTextArea--resizeVertical"
+                                    data-test-subj="searchAutocompleteTextArea"
+                                    enterkeyhint="search"
+                                    id="autocomplete-textarea"
+                                    maxlength="512"
+                                    placeholder="Enter PPL query"
+                                    rows="6"
+                                    spellcheck="false"
+                                    type="search"
+                                  />
+                                </div>
+                                <button
+                                  aria-label="pplLinkShowFlyout"
+                                  class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
+                                  title="PPL"
+                                >
+                                  <span
+                                    class="euiBadge__content"
+                                  >
+                                    <span
+                                      class="euiBadge__text"
+                                    >
+                                      PPL
+                                    </span>
+                                  </span>
+                                </button>
+                              </div>
+                              <div
+                                class="euiFormHelpText euiFormRow__text"
+                                id="random_html_id-help"
+                              >
+                                The default logs view in the application will be filtered by this query.
+                              </div>
+                            </div>
                           </div>
                         </div>
                       </div>
@@ -7038,73 +7176,96 @@ Object {
                         class="euiAccordion__padding--l"
                       >
                         <div
-                          class="euiFormRow"
-                          id="random_html_id-row"
+                          class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionColumn euiFlexGroup--responsive"
                         >
                           <div
-                            class="euiFormRow__labelWrapper"
+                            class="euiFlexItem"
                           >
-                            <label
-                              class="euiFormLabel euiFormRow__label"
-                              for="random_html_id"
+                            <div
+                              class="euiCallOut euiCallOut--primary euiCallOut--small"
+                              style="max-width: 900px;"
                             >
-                              PPL Base Query
-                            </label>
+                              <div
+                                class="euiText euiText--extraSmall"
+                              >
+                                You can't change the base query after the application is created.
+                              </div>
+                            </div>
                           </div>
                           <div
-                            class="euiFormRow__fieldWrapper"
+                            class="euiFlexItem"
                           >
                             <div
-                              aria-describedby="random_html_id-help"
-                              class="euiFlexItem euiFlexItem--flexGrowZero query-area"
-                              id="random_html_id"
+                              class="euiFormRow"
+                              id="random_html_id-row"
                             >
                               <div
-                                aria-expanded="false"
-                                aria-haspopup="listbox"
-                                aria-labelledby="autocomplete-0-label"
-                                class="aa-Autocomplete"
-                                id="autocomplete-root"
-                                role="combobox"
-                              >
-                                <textarea
-                                  aria-autocomplete="both"
-                                  aria-labelledby="autocomplete-0-label"
-                                  autocapitalize="off"
-                                  autocomplete="off"
-                                  autocorrect="off"
-                                  class="euiTextArea euiTextArea--resizeVertical"
-                                  data-test-subj="searchAutocompleteTextArea"
-                                  enterkeyhint="search"
-                                  id="autocomplete-textarea"
-                                  maxlength="512"
-                                  placeholder="Enter PPL query"
-                                  rows="6"
-                                  spellcheck="false"
-                                  type="search"
-                                />
+                                class="euiFormRow__labelWrapper"
+                              >
+                                <label
+                                  class="euiFormLabel euiFormRow__label"
+                                  for="random_html_id"
+                                >
+                                  Base Query
+                                </label>
                               </div>
-                              <button
-                                aria-label="pplLinkShowFlyout"
-                                class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
-                                title="PPL"
+                              <div
+                                class="euiFormRow__fieldWrapper"
                               >
-                                <span
-                                  class="euiBadge__content"
+                                <div
+                                  aria-describedby="random_html_id-help"
+                                  class="euiFlexItem euiFlexItem--flexGrowZero query-area"
+                                  id="random_html_id"
+                                  style="min-width: 900px;"
                                 >
-                                  <span
-                                    class="euiBadge__text"
+                                  <div
+                                    aria-expanded="false"
+                                    aria-haspopup="listbox"
+                                    aria-labelledby="autocomplete-0-label"
+                                    class="aa-Autocomplete"
+                                    id="autocomplete-root"
+                                    role="combobox"
                                   >
-                                    PPL
-                                  </span>
-                                </span>
-                              </button>
-                            </div>
-                            <div
-                              class="euiFormHelpText euiFormRow__text"
-                              id="random_html_id-help"
-                            >
-                              The default logs view in the application will be filtered by this query.
+                                    <textarea
+                                      aria-autocomplete="both"
+                                      aria-labelledby="autocomplete-0-label"
+                                      autocapitalize="off"
+                                      autocomplete="off"
+                                      autocorrect="off"
+                                      class="euiTextArea euiTextArea--resizeVertical"
+                                      data-test-subj="searchAutocompleteTextArea"
+                                      enterkeyhint="search"
+                                      id="autocomplete-textarea"
+                                      maxlength="512"
+                                      placeholder="Enter PPL query"
+                                      rows="6"
+                                      spellcheck="false"
+                                      type="search"
+                                    />
+                                  </div>
+                                  <button
+                                    aria-label="pplLinkShowFlyout"
+                                    class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
+                                    title="PPL"
+                                  >
+                                    <span
+                                      class="euiBadge__content"
+                                    >
+                                      <span
+                                        class="euiBadge__text"
+                                      >
+                                        PPL
+                                      </span>
+                                    </span>
+                                  </button>
+                                </div>
+                                <div
+                                  class="euiFormHelpText euiFormRow__text"
+                                  id="random_html_id-help"
+                                >
+                                  The default logs view in the application will be filtered by this query.
+                                </div>
+                              </div>
                             </div>
                           </div>
                         </div>
@@ -8072,73 +8233,96 @@ Object {
                       class="euiAccordion__padding--l"
                     >
                       <div
-                        class="euiFormRow"
-                        id="random_html_id-row"
+                        class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionColumn euiFlexGroup--responsive"
                       >
                         <div
-                          class="euiFormRow__labelWrapper"
+                          class="euiFlexItem"
                         >
-                          <label
-                            class="euiFormLabel euiFormRow__label"
-                            for="random_html_id"
+                          <div
+                            class="euiCallOut euiCallOut--primary euiCallOut--small"
+                            style="max-width: 900px;"
                           >
-                            PPL Base Query
-                          </label>
+                            <div
+                              class="euiText euiText--extraSmall"
+                            >
+                              You can't change the base query after the application is created.
+                            </div>
+                          </div>
                         </div>
                         <div
-                          class="euiFormRow__fieldWrapper"
+                          class="euiFlexItem"
                         >
                           <div
-                            aria-describedby="random_html_id-help"
-                            class="euiFlexItem euiFlexItem--flexGrowZero query-area"
-                            id="random_html_id"
+                            class="euiFormRow"
+                            id="random_html_id-row"
                           >
                             <div
-                              aria-expanded="false"
-                              aria-haspopup="listbox"
-                              aria-labelledby="autocomplete-0-label"
-                              class="aa-Autocomplete"
-                              id="autocomplete-root"
-                              role="combobox"
+                              class="euiFormRow__labelWrapper"
                             >
-                              <textarea
-                                aria-autocomplete="both"
-                                aria-labelledby="autocomplete-0-label"
-                                autocapitalize="off"
-                                autocomplete="off"
-                                autocorrect="off"
-                                class="euiTextArea euiTextArea--resizeVertical"
-                                data-test-subj="searchAutocompleteTextArea"
-                                enterkeyhint="search"
-                                id="autocomplete-textarea"
-                                maxlength="512"
-                                placeholder="Enter PPL query"
-                                rows="6"
-                                spellcheck="false"
-                                type="search"
-                              />
+                              <label
+                                class="euiFormLabel euiFormRow__label"
+                                for="random_html_id"
+                              >
+                                Base Query
+                              </label>
                             </div>
-                            <button
-                              aria-label="pplLinkShowFlyout"
-                              class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
-                              title="PPL"
+                            <div
+                              class="euiFormRow__fieldWrapper"
                             >
-                              <span
-                                class="euiBadge__content"
+                              <div
+                                aria-describedby="random_html_id-help"
+                                class="euiFlexItem euiFlexItem--flexGrowZero query-area"
+                                id="random_html_id"
+                                style="min-width: 900px;"
                               >
-                                <span
-                                  class="euiBadge__text"
+                                <div
+                                  aria-expanded="false"
+                                  aria-haspopup="listbox"
+                                  aria-labelledby="autocomplete-0-label"
+                                  class="aa-Autocomplete"
+                                  id="autocomplete-root"
+                                  role="combobox"
                                 >
-                                  PPL
-                                </span>
-                              </span>
-                            </button>
-                          </div>
-                          <div
-                            class="euiFormHelpText euiFormRow__text"
-                            id="random_html_id-help"
-                          >
-                            The default logs view in the application will be filtered by this query.
+                                  <textarea
+                                    aria-autocomplete="both"
+                                    aria-labelledby="autocomplete-0-label"
+                                    autocapitalize="off"
+                                    autocomplete="off"
+                                    autocorrect="off"
+                                    class="euiTextArea euiTextArea--resizeVertical"
+                                    data-test-subj="searchAutocompleteTextArea"
+                                    enterkeyhint="search"
+                                    id="autocomplete-textarea"
+                                    maxlength="512"
+                                    placeholder="Enter PPL query"
+                                    rows="6"
+                                    spellcheck="false"
+                                    type="search"
+                                  />
+                                </div>
+                                <button
+                                  aria-label="pplLinkShowFlyout"
+                                  class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
+                                  title="PPL"
+                                >
+                                  <span
+                                    class="euiBadge__content"
+                                  >
+                                    <span
+                                      class="euiBadge__text"
+                                    >
+                                      PPL
+                                    </span>
+                                  </span>
+                                </button>
+                              </div>
+                              <div
+                                class="euiFormHelpText euiFormRow__text"
+                                id="random_html_id-help"
+                              >
+                                The default logs view in the application will be filtered by this query.
+                              </div>
+                            </div>
                           </div>
                         </div>
                       </div>
@@ -9168,75 +9352,98 @@ Object {
                         class="euiAccordion__padding--l"
                       >
                         <div
-                          class="euiFormRow"
-                          id="random_html_id-row"
+                          class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionColumn euiFlexGroup--responsive"
                         >
                           <div
-                            class="euiFormRow__labelWrapper"
+                            class="euiFlexItem"
                           >
-                            <label
-                              class="euiFormLabel euiFormRow__label"
-                              for="random_html_id"
+                            <div
+                              class="euiCallOut euiCallOut--primary euiCallOut--small"
+                              style="max-width: 900px;"
                             >
-                              PPL Base Query
-                            </label>
+                              <div
+                                class="euiText euiText--extraSmall"
+                              >
+                                You can't change the base query after the application is created.
+                              </div>
+                            </div>
                           </div>
                           <div
-                            class="euiFormRow__fieldWrapper"
+                            class="euiFlexItem"
                           >
                             <div
-                              aria-describedby="random_html_id-help"
-                              class="euiFlexItem euiFlexItem--flexGrowZero query-area"
-                              id="random_html_id"
+                              class="euiFormRow"
+                              id="random_html_id-row"
                             >
                               <div
-                                aria-expanded="false"
-                                aria-haspopup="listbox"
-                                aria-labelledby="autocomplete-1-label"
-                                class="aa-Autocomplete"
-                                id="autocomplete-root"
-                                role="combobox"
-                              >
-                                <textarea
-                                  aria-autocomplete="both"
-                                  aria-labelledby="autocomplete-1-label"
-                                  autocapitalize="off"
-                                  autocomplete="off"
-                                  autocorrect="off"
-                                  class="euiTextArea euiTextArea--resizeVertical"
-                                  data-test-subj="searchAutocompleteTextArea"
-                                  enterkeyhint="search"
-                                  id="autocomplete-textarea"
-                                  maxlength="512"
-                                  placeholder="Enter PPL query"
-                                  rows="6"
-                                  spellcheck="false"
-                                  type="search"
+                                class="euiFormRow__labelWrapper"
+                              >
+                                <label
+                                  class="euiFormLabel euiFormRow__label"
+                                  for="random_html_id"
                                 >
-                                  source = openserach_dashboard_sample_logs
-                                </textarea>
+                                  Base Query
+                                </label>
                               </div>
-                              <button
-                                aria-label="pplLinkShowFlyout"
-                                class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
-                                title="PPL"
+                              <div
+                                class="euiFormRow__fieldWrapper"
                               >
-                                <span
-                                  class="euiBadge__content"
+                                <div
+                                  aria-describedby="random_html_id-help"
+                                  class="euiFlexItem euiFlexItem--flexGrowZero query-area"
+                                  id="random_html_id"
+                                  style="min-width: 900px;"
                                 >
-                                  <span
-                                    class="euiBadge__text"
+                                  <div
+                                    aria-expanded="false"
+                                    aria-haspopup="listbox"
+                                    aria-labelledby="autocomplete-1-label"
+                                    class="aa-Autocomplete"
+                                    id="autocomplete-root"
+                                    role="combobox"
                                   >
-                                    PPL
-                                  </span>
-                                </span>
-                              </button>
-                            </div>
-                            <div
-                              class="euiFormHelpText euiFormRow__text"
-                              id="random_html_id-help"
-                            >
-                              The default logs view in the application will be filtered by this query.
+                                    <textarea
+                                      aria-autocomplete="both"
+                                      aria-labelledby="autocomplete-1-label"
+                                      autocapitalize="off"
+                                      autocomplete="off"
+                                      autocorrect="off"
+                                      class="euiTextArea euiTextArea--resizeVertical"
+                                      data-test-subj="searchAutocompleteTextArea"
+                                      enterkeyhint="search"
+                                      id="autocomplete-textarea"
+                                      maxlength="512"
+                                      placeholder="Enter PPL query"
+                                      rows="6"
+                                      spellcheck="false"
+                                      type="search"
+                                    >
+                                      source = openserach_dashboard_sample_logs
+                                    </textarea>
+                                  </div>
+                                  <button
+                                    aria-label="pplLinkShowFlyout"
+                                    class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
+                                    title="PPL"
+                                  >
+                                    <span
+                                      class="euiBadge__content"
+                                    >
+                                      <span
+                                        class="euiBadge__text"
+                                      >
+                                        PPL
+                                      </span>
+                                    </span>
+                                  </button>
+                                </div>
+                                <div
+                                  class="euiFormHelpText euiFormRow__text"
+                                  id="random_html_id-help"
+                                >
+                                  The default logs view in the application will be filtered by this query.
+                                </div>
+                              </div>
                             </div>
                           </div>
                         </div>
@@ -10233,75 +10440,98 @@ Object {
                       class="euiAccordion__padding--l"
                     >
                       <div
-                        class="euiFormRow"
-                        id="random_html_id-row"
+                        class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionColumn euiFlexGroup--responsive"
                       >
                         <div
-                          class="euiFormRow__labelWrapper"
+                          class="euiFlexItem"
                         >
-                          <label
-                            class="euiFormLabel euiFormRow__label"
-                            for="random_html_id"
+                          <div
+                            class="euiCallOut euiCallOut--primary euiCallOut--small"
+                            style="max-width: 900px;"
                           >
-                            PPL Base Query
-                          </label>
+                            <div
+                              class="euiText euiText--extraSmall"
+                            >
+                              You can't change the base query after the application is created.
+                            </div>
+                          </div>
                         </div>
                         <div
-                          class="euiFormRow__fieldWrapper"
+                          class="euiFlexItem"
                         >
                           <div
-                            aria-describedby="random_html_id-help"
-                            class="euiFlexItem euiFlexItem--flexGrowZero query-area"
-                            id="random_html_id"
+                            class="euiFormRow"
+                            id="random_html_id-row"
                           >
                             <div
-                              aria-expanded="false"
-                              aria-haspopup="listbox"
-                              aria-labelledby="autocomplete-1-label"
-                              class="aa-Autocomplete"
-                              id="autocomplete-root"
-                              role="combobox"
+                              class="euiFormRow__labelWrapper"
                             >
-                              <textarea
-                                aria-autocomplete="both"
-                                aria-labelledby="autocomplete-1-label"
-                                autocapitalize="off"
-                                autocomplete="off"
-                                autocorrect="off"
-                                class="euiTextArea euiTextArea--resizeVertical"
-                                data-test-subj="searchAutocompleteTextArea"
-                                enterkeyhint="search"
-                                id="autocomplete-textarea"
-                                maxlength="512"
-                                placeholder="Enter PPL query"
-                                rows="6"
-                                spellcheck="false"
-                                type="search"
-                              >
-                                source = openserach_dashboard_sample_logs
-                              </textarea>
+                              <label
+                                class="euiFormLabel euiFormRow__label"
+                                for="random_html_id"
+                              >
+                                Base Query
+                              </label>
                             </div>
-                            <button
-                              aria-label="pplLinkShowFlyout"
-                              class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
-                              title="PPL"
+                            <div
+                              class="euiFormRow__fieldWrapper"
                             >
-                              <span
-                                class="euiBadge__content"
+                              <div
+                                aria-describedby="random_html_id-help"
+                                class="euiFlexItem euiFlexItem--flexGrowZero query-area"
+                                id="random_html_id"
+                                style="min-width: 900px;"
                               >
-                                <span
-                                  class="euiBadge__text"
+                                <div
+                                  aria-expanded="false"
+                                  aria-haspopup="listbox"
+                                  aria-labelledby="autocomplete-1-label"
+                                  class="aa-Autocomplete"
+                                  id="autocomplete-root"
+                                  role="combobox"
                                 >
-                                  PPL
-                                </span>
-                              </span>
-                            </button>
-                          </div>
-                          <div
-                            class="euiFormHelpText euiFormRow__text"
-                            id="random_html_id-help"
-                          >
-                            The default logs view in the application will be filtered by this query.
+                                  <textarea
+                                    aria-autocomplete="both"
+                                    aria-labelledby="autocomplete-1-label"
+                                    autocapitalize="off"
+                                    autocomplete="off"
+                                    autocorrect="off"
+                                    class="euiTextArea euiTextArea--resizeVertical"
+                                    data-test-subj="searchAutocompleteTextArea"
+                                    enterkeyhint="search"
+                                    id="autocomplete-textarea"
+                                    maxlength="512"
+                                    placeholder="Enter PPL query"
+                                    rows="6"
+                                    spellcheck="false"
+                                    type="search"
+                                  >
+                                    source = openserach_dashboard_sample_logs
+                                  </textarea>
+                                </div>
+                                <button
+                                  aria-label="pplLinkShowFlyout"
+                                  class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
+                                  title="PPL"
+                                >
+                                  <span
+                                    class="euiBadge__content"
+                                  >
+                                    <span
+                                      class="euiBadge__text"
+                                    >
+                                      PPL
+                                    </span>
+                                  </span>
+                                </button>
+                              </div>
+                              <div
+                                class="euiFormHelpText euiFormRow__text"
+                                id="random_html_id-help"
+                              >
+                                The default logs view in the application will be filtered by this query.
+                              </div>
+                            </div>
                           </div>
                         </div>
                       </div>
@@ -11357,73 +11587,96 @@ Object {
                         class="euiAccordion__padding--l"
                       >
                         <div
-                          class="euiFormRow"
-                          id="random_html_id-row"
+                          class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionColumn euiFlexGroup--responsive"
                         >
                           <div
-                            class="euiFormRow__labelWrapper"
+                            class="euiFlexItem"
                           >
-                            <label
-                              class="euiFormLabel euiFormRow__label"
-                              for="random_html_id"
+                            <div
+                              class="euiCallOut euiCallOut--primary euiCallOut--small"
+                              style="max-width: 900px;"
                             >
-                              PPL Base Query
-                            </label>
+                              <div
+                                class="euiText euiText--extraSmall"
+                              >
+                                You can't change the base query after the application is created.
+                              </div>
+                            </div>
                           </div>
                           <div
-                            class="euiFormRow__fieldWrapper"
+                            class="euiFlexItem"
                           >
                             <div
-                              aria-describedby="random_html_id-help"
-                              class="euiFlexItem euiFlexItem--flexGrowZero query-area"
-                              id="random_html_id"
+                              class="euiFormRow"
+                              id="random_html_id-row"
                             >
                               <div
-                                aria-expanded="false"
-                                aria-haspopup="listbox"
-                                aria-labelledby="autocomplete-4-label"
-                                class="aa-Autocomplete"
-                                id="autocomplete-root"
-                                role="combobox"
-                              >
-                                <textarea
-                                  aria-autocomplete="both"
-                                  aria-labelledby="autocomplete-4-label"
-                                  autocapitalize="off"
-                                  autocomplete="off"
-                                  autocorrect="off"
-                                  class="euiTextArea euiTextArea--resizeVertical"
-                                  data-test-subj="searchAutocompleteTextArea"
-                                  enterkeyhint="search"
-                                  id="autocomplete-textarea"
-                                  maxlength="512"
-                                  placeholder="Enter PPL query"
-                                  rows="6"
-                                  spellcheck="false"
-                                  type="search"
-                                />
+                                class="euiFormRow__labelWrapper"
+                              >
+                                <label
+                                  class="euiFormLabel euiFormRow__label"
+                                  for="random_html_id"
+                                >
+                                  Base Query
+                                </label>
                               </div>
-                              <button
-                                aria-label="pplLinkShowFlyout"
-                                class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
-                                title="PPL"
+                              <div
+                                class="euiFormRow__fieldWrapper"
                               >
-                                <span
-                                  class="euiBadge__content"
+                                <div
+                                  aria-describedby="random_html_id-help"
+                                  class="euiFlexItem euiFlexItem--flexGrowZero query-area"
+                                  id="random_html_id"
+                                  style="min-width: 900px;"
                                 >
-                                  <span
-                                    class="euiBadge__text"
+                                  <div
+                                    aria-expanded="false"
+                                    aria-haspopup="listbox"
+                                    aria-labelledby="autocomplete-4-label"
+                                    class="aa-Autocomplete"
+                                    id="autocomplete-root"
+                                    role="combobox"
                                   >
-                                    PPL
-                                  </span>
-                                </span>
-                              </button>
-                            </div>
-                            <div
-                              class="euiFormHelpText euiFormRow__text"
-                              id="random_html_id-help"
-                            >
-                              The default logs view in the application will be filtered by this query.
+                                    <textarea
+                                      aria-autocomplete="both"
+                                      aria-labelledby="autocomplete-4-label"
+                                      autocapitalize="off"
+                                      autocomplete="off"
+                                      autocorrect="off"
+                                      class="euiTextArea euiTextArea--resizeVertical"
+                                      data-test-subj="searchAutocompleteTextArea"
+                                      enterkeyhint="search"
+                                      id="autocomplete-textarea"
+                                      maxlength="512"
+                                      placeholder="Enter PPL query"
+                                      rows="6"
+                                      spellcheck="false"
+                                      type="search"
+                                    />
+                                  </div>
+                                  <button
+                                    aria-label="pplLinkShowFlyout"
+                                    class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
+                                    title="PPL"
+                                  >
+                                    <span
+                                      class="euiBadge__content"
+                                    >
+                                      <span
+                                        class="euiBadge__text"
+                                      >
+                                        PPL
+                                      </span>
+                                    </span>
+                                  </button>
+                                </div>
+                                <div
+                                  class="euiFormHelpText euiFormRow__text"
+                                  id="random_html_id-help"
+                                >
+                                  The default logs view in the application will be filtered by this query.
+                                </div>
+                              </div>
                             </div>
                           </div>
                         </div>
@@ -12453,73 +12706,96 @@ Object {
                       class="euiAccordion__padding--l"
                     >
                       <div
-                        class="euiFormRow"
-                        id="random_html_id-row"
+                        class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionColumn euiFlexGroup--responsive"
                       >
                         <div
-                          class="euiFormRow__labelWrapper"
+                          class="euiFlexItem"
                         >
-                          <label
-                            class="euiFormLabel euiFormRow__label"
-                            for="random_html_id"
+                          <div
+                            class="euiCallOut euiCallOut--primary euiCallOut--small"
+                            style="max-width: 900px;"
                           >
-                            PPL Base Query
-                          </label>
+                            <div
+                              class="euiText euiText--extraSmall"
+                            >
+                              You can't change the base query after the application is created.
+                            </div>
+                          </div>
                         </div>
                         <div
-                          class="euiFormRow__fieldWrapper"
+                          class="euiFlexItem"
                         >
                           <div
-                            aria-describedby="random_html_id-help"
-                            class="euiFlexItem euiFlexItem--flexGrowZero query-area"
-                            id="random_html_id"
+                            class="euiFormRow"
+                            id="random_html_id-row"
                           >
                             <div
-                              aria-expanded="false"
-                              aria-haspopup="listbox"
-                              aria-labelledby="autocomplete-4-label"
-                              class="aa-Autocomplete"
-                              id="autocomplete-root"
-                              role="combobox"
+                              class="euiFormRow__labelWrapper"
                             >
-                              <textarea
-                                aria-autocomplete="both"
-                                aria-labelledby="autocomplete-4-label"
-                                autocapitalize="off"
-                                autocomplete="off"
-                                autocorrect="off"
-                                class="euiTextArea euiTextArea--resizeVertical"
-                                data-test-subj="searchAutocompleteTextArea"
-                                enterkeyhint="search"
-                                id="autocomplete-textarea"
-                                maxlength="512"
-                                placeholder="Enter PPL query"
-                                rows="6"
-                                spellcheck="false"
-                                type="search"
-                              />
+                              <label
+                                class="euiFormLabel euiFormRow__label"
+                                for="random_html_id"
+                              >
+                                Base Query
+                              </label>
                             </div>
-                            <button
-                              aria-label="pplLinkShowFlyout"
-                              class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
-                              title="PPL"
+                            <div
+                              class="euiFormRow__fieldWrapper"
                             >
-                              <span
-                                class="euiBadge__content"
+                              <div
+                                aria-describedby="random_html_id-help"
+                                class="euiFlexItem euiFlexItem--flexGrowZero query-area"
+                                id="random_html_id"
+                                style="min-width: 900px;"
                               >
-                                <span
-                                  class="euiBadge__text"
+                                <div
+                                  aria-expanded="false"
+                                  aria-haspopup="listbox"
+                                  aria-labelledby="autocomplete-4-label"
+                                  class="aa-Autocomplete"
+                                  id="autocomplete-root"
+                                  role="combobox"
                                 >
-                                  PPL
-                                </span>
-                              </span>
-                            </button>
-                          </div>
-                          <div
-                            class="euiFormHelpText euiFormRow__text"
-                            id="random_html_id-help"
-                          >
-                            The default logs view in the application will be filtered by this query.
+                                  <textarea
+                                    aria-autocomplete="both"
+                                    aria-labelledby="autocomplete-4-label"
+                                    autocapitalize="off"
+                                    autocomplete="off"
+                                    autocorrect="off"
+                                    class="euiTextArea euiTextArea--resizeVertical"
+                                    data-test-subj="searchAutocompleteTextArea"
+                                    enterkeyhint="search"
+                                    id="autocomplete-textarea"
+                                    maxlength="512"
+                                    placeholder="Enter PPL query"
+                                    rows="6"
+                                    spellcheck="false"
+                                    type="search"
+                                  />
+                                </div>
+                                <button
+                                  aria-label="pplLinkShowFlyout"
+                                  class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
+                                  title="PPL"
+                                >
+                                  <span
+                                    class="euiBadge__content"
+                                  >
+                                    <span
+                                      class="euiBadge__text"
+                                    >
+                                      PPL
+                                    </span>
+                                  </span>
+                                </button>
+                              </div>
+                              <div
+                                class="euiFormHelpText euiFormRow__text"
+                                id="random_html_id-help"
+                              >
+                                The default logs view in the application will be filtered by this query.
+                              </div>
+                            </div>
                           </div>
                         </div>
                       </div>
@@ -13608,73 +13884,96 @@ Object {
                         class="euiAccordion__padding--l"
                       >
                         <div
-                          class="euiFormRow"
-                          id="random_html_id-row"
+                          class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionColumn euiFlexGroup--responsive"
                         >
                           <div
-                            class="euiFormRow__labelWrapper"
+                            class="euiFlexItem"
                           >
-                            <label
-                              class="euiFormLabel euiFormRow__label"
-                              for="random_html_id"
+                            <div
+                              class="euiCallOut euiCallOut--primary euiCallOut--small"
+                              style="max-width: 900px;"
                             >
-                              PPL Base Query
-                            </label>
+                              <div
+                                class="euiText euiText--extraSmall"
+                              >
+                                You can't change the base query after the application is created.
+                              </div>
+                            </div>
                           </div>
                           <div
-                            class="euiFormRow__fieldWrapper"
+                            class="euiFlexItem"
                           >
                             <div
-                              aria-describedby="random_html_id-help"
-                              class="euiFlexItem euiFlexItem--flexGrowZero query-area"
-                              id="random_html_id"
+                              class="euiFormRow"
+                              id="random_html_id-row"
                             >
                               <div
-                                aria-expanded="false"
-                                aria-haspopup="listbox"
-                                aria-labelledby="autocomplete-6-label"
-                                class="aa-Autocomplete"
-                                id="autocomplete-root"
-                                role="combobox"
-                              >
-                                <textarea
-                                  aria-autocomplete="both"
-                                  aria-labelledby="autocomplete-6-label"
-                                  autocapitalize="off"
-                                  autocomplete="off"
-                                  autocorrect="off"
-                                  class="euiTextArea euiTextArea--resizeVertical"
-                                  data-test-subj="searchAutocompleteTextArea"
-                                  enterkeyhint="search"
-                                  id="autocomplete-textarea"
-                                  maxlength="512"
-                                  placeholder="Enter PPL query"
-                                  rows="6"
-                                  spellcheck="false"
-                                  type="search"
-                                />
+                                class="euiFormRow__labelWrapper"
+                              >
+                                <label
+                                  class="euiFormLabel euiFormRow__label"
+                                  for="random_html_id"
+                                >
+                                  Base Query
+                                </label>
                               </div>
-                              <button
-                                aria-label="pplLinkShowFlyout"
-                                class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
-                                title="PPL"
+                              <div
+                                class="euiFormRow__fieldWrapper"
                               >
-                                <span
-                                  class="euiBadge__content"
+                                <div
+                                  aria-describedby="random_html_id-help"
+                                  class="euiFlexItem euiFlexItem--flexGrowZero query-area"
+                                  id="random_html_id"
+                                  style="min-width: 900px;"
                                 >
-                                  <span
-                                    class="euiBadge__text"
+                                  <div
+                                    aria-expanded="false"
+                                    aria-haspopup="listbox"
+                                    aria-labelledby="autocomplete-6-label"
+                                    class="aa-Autocomplete"
+                                    id="autocomplete-root"
+                                    role="combobox"
                                   >
-                                    PPL
-                                  </span>
-                                </span>
-                              </button>
-                            </div>
-                            <div
-                              class="euiFormHelpText euiFormRow__text"
-                              id="random_html_id-help"
-                            >
-                              The default logs view in the application will be filtered by this query.
+                                    <textarea
+                                      aria-autocomplete="both"
+                                      aria-labelledby="autocomplete-6-label"
+                                      autocapitalize="off"
+                                      autocomplete="off"
+                                      autocorrect="off"
+                                      class="euiTextArea euiTextArea--resizeVertical"
+                                      data-test-subj="searchAutocompleteTextArea"
+                                      enterkeyhint="search"
+                                      id="autocomplete-textarea"
+                                      maxlength="512"
+                                      placeholder="Enter PPL query"
+                                      rows="6"
+                                      spellcheck="false"
+                                      type="search"
+                                    />
+                                  </div>
+                                  <button
+                                    aria-label="pplLinkShowFlyout"
+                                    class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
+                                    title="PPL"
+                                  >
+                                    <span
+                                      class="euiBadge__content"
+                                    >
+                                      <span
+                                        class="euiBadge__text"
+                                      >
+                                        PPL
+                                      </span>
+                                    </span>
+                                  </button>
+                                </div>
+                                <div
+                                  class="euiFormHelpText euiFormRow__text"
+                                  id="random_html_id-help"
+                                >
+                                  The default logs view in the application will be filtered by this query.
+                                </div>
+                              </div>
                             </div>
                           </div>
                         </div>
@@ -14704,73 +15003,96 @@ Object {
                       class="euiAccordion__padding--l"
                     >
                       <div
-                        class="euiFormRow"
-                        id="random_html_id-row"
+                        class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionColumn euiFlexGroup--responsive"
                       >
                         <div
-                          class="euiFormRow__labelWrapper"
+                          class="euiFlexItem"
                         >
-                          <label
-                            class="euiFormLabel euiFormRow__label"
-                            for="random_html_id"
+                          <div
+                            class="euiCallOut euiCallOut--primary euiCallOut--small"
+                            style="max-width: 900px;"
                           >
-                            PPL Base Query
-                          </label>
+                            <div
+                              class="euiText euiText--extraSmall"
+                            >
+                              You can't change the base query after the application is created.
+                            </div>
+                          </div>
                         </div>
                         <div
-                          class="euiFormRow__fieldWrapper"
+                          class="euiFlexItem"
                         >
                           <div
-                            aria-describedby="random_html_id-help"
-                            class="euiFlexItem euiFlexItem--flexGrowZero query-area"
-                            id="random_html_id"
+                            class="euiFormRow"
+                            id="random_html_id-row"
                           >
                             <div
-                              aria-expanded="false"
-                              aria-haspopup="listbox"
-                              aria-labelledby="autocomplete-6-label"
-                              class="aa-Autocomplete"
-                              id="autocomplete-root"
-                              role="combobox"
+                              class="euiFormRow__labelWrapper"
                             >
-                              <textarea
-                                aria-autocomplete="both"
-                                aria-labelledby="autocomplete-6-label"
-                                autocapitalize="off"
-                                autocomplete="off"
-                                autocorrect="off"
-                                class="euiTextArea euiTextArea--resizeVertical"
-                                data-test-subj="searchAutocompleteTextArea"
-                                enterkeyhint="search"
-                                id="autocomplete-textarea"
-                                maxlength="512"
-                                placeholder="Enter PPL query"
-                                rows="6"
-                                spellcheck="false"
-                                type="search"
-                              />
+                              <label
+                                class="euiFormLabel euiFormRow__label"
+                                for="random_html_id"
+                              >
+                                Base Query
+                              </label>
                             </div>
-                            <button
-                              aria-label="pplLinkShowFlyout"
-                              class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
-                              title="PPL"
+                            <div
+                              class="euiFormRow__fieldWrapper"
                             >
-                              <span
-                                class="euiBadge__content"
+                              <div
+                                aria-describedby="random_html_id-help"
+                                class="euiFlexItem euiFlexItem--flexGrowZero query-area"
+                                id="random_html_id"
+                                style="min-width: 900px;"
                               >
-                                <span
-                                  class="euiBadge__text"
+                                <div
+                                  aria-expanded="false"
+                                  aria-haspopup="listbox"
+                                  aria-labelledby="autocomplete-6-label"
+                                  class="aa-Autocomplete"
+                                  id="autocomplete-root"
+                                  role="combobox"
                                 >
-                                  PPL
-                                </span>
-                              </span>
-                            </button>
-                          </div>
-                          <div
-                            class="euiFormHelpText euiFormRow__text"
-                            id="random_html_id-help"
-                          >
-                            The default logs view in the application will be filtered by this query.
+                                  <textarea
+                                    aria-autocomplete="both"
+                                    aria-labelledby="autocomplete-6-label"
+                                    autocapitalize="off"
+                                    autocomplete="off"
+                                    autocorrect="off"
+                                    class="euiTextArea euiTextArea--resizeVertical"
+                                    data-test-subj="searchAutocompleteTextArea"
+                                    enterkeyhint="search"
+                                    id="autocomplete-textarea"
+                                    maxlength="512"
+                                    placeholder="Enter PPL query"
+                                    rows="6"
+                                    spellcheck="false"
+                                    type="search"
+                                  />
+                                </div>
+                                <button
+                                  aria-label="pplLinkShowFlyout"
+                                  class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
+                                  title="PPL"
+                                >
+                                  <span
+                                    class="euiBadge__content"
+                                  >
+                                    <span
+                                      class="euiBadge__text"
+                                    >
+                                      PPL
+                                    </span>
+                                  </span>
+                                </button>
+                              </div>
+                              <div
+                                class="euiFormHelpText euiFormRow__text"
+                                id="random_html_id-help"
+                              >
+                                The default logs view in the application will be filtered by this query.
+                              </div>
+                            </div>
                           </div>
                         </div>
                       </div>
@@ -15861,75 +16183,98 @@ Object {
                         class="euiAccordion__padding--l"
                       >
                         <div
-                          class="euiFormRow"
-                          id="random_html_id-row"
+                          class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionColumn euiFlexGroup--responsive"
                         >
                           <div
-                            class="euiFormRow__labelWrapper"
+                            class="euiFlexItem"
                           >
-                            <label
-                              class="euiFormLabel euiFormRow__label"
-                              for="random_html_id"
+                            <div
+                              class="euiCallOut euiCallOut--primary euiCallOut--small"
+                              style="max-width: 900px;"
                             >
-                              PPL Base Query
-                            </label>
+                              <div
+                                class="euiText euiText--extraSmall"
+                              >
+                                You can't change the base query after the application is created.
+                              </div>
+                            </div>
                           </div>
                           <div
-                            class="euiFormRow__fieldWrapper"
+                            class="euiFlexItem"
                           >
                             <div
-                              aria-describedby="random_html_id-help"
-                              class="euiFlexItem euiFlexItem--flexGrowZero query-area"
-                              id="random_html_id"
+                              class="euiFormRow"
+                              id="random_html_id-row"
                             >
                               <div
-                                aria-expanded="false"
-                                aria-haspopup="listbox"
-                                aria-labelledby="autocomplete-2-label"
-                                class="aa-Autocomplete"
-                                id="autocomplete-root"
-                                role="combobox"
-                              >
-                                <textarea
-                                  aria-autocomplete="both"
-                                  aria-labelledby="autocomplete-2-label"
-                                  autocapitalize="off"
-                                  autocomplete="off"
-                                  autocorrect="off"
-                                  class="euiTextArea euiTextArea--resizeVertical"
-                                  data-test-subj="searchAutocompleteTextArea"
-                                  enterkeyhint="search"
-                                  id="autocomplete-textarea"
-                                  maxlength="512"
-                                  placeholder="Enter PPL query"
-                                  rows="6"
-                                  spellcheck="false"
-                                  type="search"
+                                class="euiFormRow__labelWrapper"
+                              >
+                                <label
+                                  class="euiFormLabel euiFormRow__label"
+                                  for="random_html_id"
                                 >
-                                  source = openserach_dashboard_sample_logs
-                                </textarea>
+                                  Base Query
+                                </label>
                               </div>
-                              <button
-                                aria-label="pplLinkShowFlyout"
-                                class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
-                                title="PPL"
+                              <div
+                                class="euiFormRow__fieldWrapper"
                               >
-                                <span
-                                  class="euiBadge__content"
+                                <div
+                                  aria-describedby="random_html_id-help"
+                                  class="euiFlexItem euiFlexItem--flexGrowZero query-area"
+                                  id="random_html_id"
+                                  style="min-width: 900px;"
                                 >
-                                  <span
-                                    class="euiBadge__text"
+                                  <div
+                                    aria-expanded="false"
+                                    aria-haspopup="listbox"
+                                    aria-labelledby="autocomplete-2-label"
+                                    class="aa-Autocomplete"
+                                    id="autocomplete-root"
+                                    role="combobox"
                                   >
-                                    PPL
-                                  </span>
-                                </span>
-                              </button>
-                            </div>
-                            <div
-                              class="euiFormHelpText euiFormRow__text"
-                              id="random_html_id-help"
-                            >
-                              The default logs view in the application will be filtered by this query.
+                                    <textarea
+                                      aria-autocomplete="both"
+                                      aria-labelledby="autocomplete-2-label"
+                                      autocapitalize="off"
+                                      autocomplete="off"
+                                      autocorrect="off"
+                                      class="euiTextArea euiTextArea--resizeVertical"
+                                      data-test-subj="searchAutocompleteTextArea"
+                                      enterkeyhint="search"
+                                      id="autocomplete-textarea"
+                                      maxlength="512"
+                                      placeholder="Enter PPL query"
+                                      rows="6"
+                                      spellcheck="false"
+                                      type="search"
+                                    >
+                                      source = openserach_dashboard_sample_logs
+                                    </textarea>
+                                  </div>
+                                  <button
+                                    aria-label="pplLinkShowFlyout"
+                                    class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
+                                    title="PPL"
+                                  >
+                                    <span
+                                      class="euiBadge__content"
+                                    >
+                                      <span
+                                        class="euiBadge__text"
+                                      >
+                                        PPL
+                                      </span>
+                                    </span>
+                                  </button>
+                                </div>
+                                <div
+                                  class="euiFormHelpText euiFormRow__text"
+                                  id="random_html_id-help"
+                                >
+                                  The default logs view in the application will be filtered by this query.
+                                </div>
+                              </div>
                             </div>
                           </div>
                         </div>
@@ -17042,75 +17387,98 @@ Object {
                       class="euiAccordion__padding--l"
                     >
                       <div
-                        class="euiFormRow"
-                        id="random_html_id-row"
+                        class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionColumn euiFlexGroup--responsive"
                       >
                         <div
-                          class="euiFormRow__labelWrapper"
+                          class="euiFlexItem"
                         >
-                          <label
-                            class="euiFormLabel euiFormRow__label"
-                            for="random_html_id"
+                          <div
+                            class="euiCallOut euiCallOut--primary euiCallOut--small"
+                            style="max-width: 900px;"
                           >
-                            PPL Base Query
-                          </label>
+                            <div
+                              class="euiText euiText--extraSmall"
+                            >
+                              You can't change the base query after the application is created.
+                            </div>
+                          </div>
                         </div>
                         <div
-                          class="euiFormRow__fieldWrapper"
+                          class="euiFlexItem"
                         >
                           <div
-                            aria-describedby="random_html_id-help"
-                            class="euiFlexItem euiFlexItem--flexGrowZero query-area"
-                            id="random_html_id"
+                            class="euiFormRow"
+                            id="random_html_id-row"
                           >
                             <div
-                              aria-expanded="false"
-                              aria-haspopup="listbox"
-                              aria-labelledby="autocomplete-2-label"
-                              class="aa-Autocomplete"
-                              id="autocomplete-root"
-                              role="combobox"
+                              class="euiFormRow__labelWrapper"
                             >
-                              <textarea
-                                aria-autocomplete="both"
-                                aria-labelledby="autocomplete-2-label"
-                                autocapitalize="off"
-                                autocomplete="off"
-                                autocorrect="off"
-                                class="euiTextArea euiTextArea--resizeVertical"
-                                data-test-subj="searchAutocompleteTextArea"
-                                enterkeyhint="search"
-                                id="autocomplete-textarea"
-                                maxlength="512"
-                                placeholder="Enter PPL query"
-                                rows="6"
-                                spellcheck="false"
-                                type="search"
-                              >
-                                source = openserach_dashboard_sample_logs
-                              </textarea>
+                              <label
+                                class="euiFormLabel euiFormRow__label"
+                                for="random_html_id"
+                              >
+                                Base Query
+                              </label>
                             </div>
-                            <button
-                              aria-label="pplLinkShowFlyout"
-                              class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
-                              title="PPL"
+                            <div
+                              class="euiFormRow__fieldWrapper"
                             >
-                              <span
-                                class="euiBadge__content"
+                              <div
+                                aria-describedby="random_html_id-help"
+                                class="euiFlexItem euiFlexItem--flexGrowZero query-area"
+                                id="random_html_id"
+                                style="min-width: 900px;"
                               >
-                                <span
-                                  class="euiBadge__text"
+                                <div
+                                  aria-expanded="false"
+                                  aria-haspopup="listbox"
+                                  aria-labelledby="autocomplete-2-label"
+                                  class="aa-Autocomplete"
+                                  id="autocomplete-root"
+                                  role="combobox"
                                 >
-                                  PPL
-                                </span>
-                              </span>
-                            </button>
-                          </div>
-                          <div
-                            class="euiFormHelpText euiFormRow__text"
-                            id="random_html_id-help"
-                          >
-                            The default logs view in the application will be filtered by this query.
+                                  <textarea
+                                    aria-autocomplete="both"
+                                    aria-labelledby="autocomplete-2-label"
+                                    autocapitalize="off"
+                                    autocomplete="off"
+                                    autocorrect="off"
+                                    class="euiTextArea euiTextArea--resizeVertical"
+                                    data-test-subj="searchAutocompleteTextArea"
+                                    enterkeyhint="search"
+                                    id="autocomplete-textarea"
+                                    maxlength="512"
+                                    placeholder="Enter PPL query"
+                                    rows="6"
+                                    spellcheck="false"
+                                    type="search"
+                                  >
+                                    source = openserach_dashboard_sample_logs
+                                  </textarea>
+                                </div>
+                                <button
+                                  aria-label="pplLinkShowFlyout"
+                                  class="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
+                                  title="PPL"
+                                >
+                                  <span
+                                    class="euiBadge__content"
+                                  >
+                                    <span
+                                      class="euiBadge__text"
+                                    >
+                                      PPL
+                                    </span>
+                                  </span>
+                                </button>
+                              </div>
+                              <div
+                                class="euiFormHelpText euiFormRow__text"
+                                id="random_html_id-help"
+                              >
+                                The default logs view in the application will be filtered by this query.
+                              </div>
+                            </div>
                           </div>
                         </div>
                       </div>
diff --git a/dashboards-observability/public/components/application_analytics/__tests__/__snapshots__/log_config.test.tsx.snap b/dashboards-observability/public/components/application_analytics/__tests__/__snapshots__/log_config.test.tsx.snap
index 717a8ef7c..c127de448 100644
--- a/dashboards-observability/public/components/application_analytics/__tests__/__snapshots__/log_config.test.tsx.snap
+++ b/dashboards-observability/public/components/application_analytics/__tests__/__snapshots__/log_config.test.tsx.snap
@@ -2,6 +2,7 @@
 
 exports[`Log Config component renders empty log config 1`] = `
 <LogConfig
+  appConfigs={Array []}
   chrome={
     Object {
       "getIsNavDrawerLocked$": [MockFunction],
@@ -17,6 +18,7 @@ exports[`Log Config component renders empty log config 1`] = `
       "http": [MockFunction],
     }
   }
+  editMode={false}
   endTime="now"
   filters={Array []}
   http={[MockFunction]}
@@ -29,8 +31,10 @@ exports[`Log Config component renders empty log config 1`] = `
     }
   }
   query=""
+  setAppConfigs={[MockFunction]}
   setDescriptionWithStorage={[MockFunction]}
   setEndTime={[MockFunction]}
+  setEndTimeWithStorage={[MockFunction]}
   setFilters={[MockFunction]}
   setFiltersWithStorage={[MockFunction]}
   setIsFlyoutVisible={[MockFunction]}
@@ -38,6 +42,7 @@ exports[`Log Config component renders empty log config 1`] = `
   setQuery={[MockFunction]}
   setQueryWithStorage={[MockFunction]}
   setStartTime={[MockFunction]}
+  setStartTimeWithStorage={[MockFunction]}
   startTime="now-5m"
 >
   <div>
@@ -222,174 +227,236 @@ exports[`Log Config component renders empty log config 1`] = `
               <div
                 className="euiAccordion__padding--l"
               >
-                <EuiFormRow
-                  describedByIds={Array []}
-                  display="row"
-                  fullWidth={false}
-                  hasChildLabel={true}
-                  hasEmptyLabelSpace={false}
-                  helpText="The default logs view in the application will be filtered by this query."
-                  label="PPL Base Query"
-                  labelType="label"
+                <EuiFlexGroup
+                  direction="column"
+                  gutterSize="s"
                 >
                   <div
-                    className="euiFormRow"
-                    id="random_html_id-row"
+                    className="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionColumn euiFlexGroup--responsive"
                   >
-                    <div
-                      className="euiFormRow__labelWrapper"
-                    >
-                      <EuiFormLabel
-                        className="euiFormRow__label"
-                        htmlFor="random_html_id"
-                        isFocused={false}
-                        type="label"
-                      >
-                        <label
-                          className="euiFormLabel euiFormRow__label"
-                          htmlFor="random_html_id"
-                        >
-                          PPL Base Query
-                        </label>
-                      </EuiFormLabel>
-                    </div>
-                    <div
-                      className="euiFormRow__fieldWrapper"
-                    >
-                      <EuiFlexItem
-                        aria-describedby="random_html_id-help"
-                        className="query-area"
-                        grow={false}
-                        id="random_html_id"
-                        key="query-bar"
-                        onBlur={[Function]}
-                        onFocus={[Function]}
+                    <EuiFlexItem>
+                      <div
+                        className="euiFlexItem"
                       >
-                        <div
-                          aria-describedby="random_html_id-help"
-                          className="euiFlexItem euiFlexItem--flexGrowZero query-area"
-                          id="random_html_id"
-                          onBlur={[Function]}
-                          onFocus={[Function]}
+                        <EuiCallOut
+                          iconType="iInCircle"
+                          size="s"
+                          style={
+                            Object {
+                              "maxWidth": "900px",
+                            }
+                          }
                         >
-                          <Autocomplete
-                            baseQuery=""
-                            dslService={
+                          <div
+                            className="euiCallOut euiCallOut--primary euiCallOut--small"
+                            style={
                               Object {
-                                "fetch": [MockFunction],
-                                "fetchFields": [MockFunction],
-                                "fetchIndices": [MockFunction],
-                                "http": [MockFunction],
+                                "maxWidth": "900px",
                               }
                             }
-                            getSuggestions={[Function]}
-                            handleQueryChange={[Function]}
-                            handleQuerySearch={[Function]}
-                            key="autocomplete-bar"
-                            onItemSelect={[Function]}
-                            query=""
-                            tabId="application-analytics-tab"
-                            tempQuery=""
                           >
+                            <EuiText
+                              size="xs"
+                            >
+                              <div
+                                className="euiText euiText--extraSmall"
+                              >
+                                You can't change the base query after the application is created.
+                              </div>
+                            </EuiText>
+                          </div>
+                        </EuiCallOut>
+                      </div>
+                    </EuiFlexItem>
+                    <EuiFlexItem>
+                      <div
+                        className="euiFlexItem"
+                      >
+                        <EuiFormRow
+                          describedByIds={Array []}
+                          display="row"
+                          fullWidth={false}
+                          hasChildLabel={true}
+                          hasEmptyLabelSpace={false}
+                          helpText="The default logs view in the application will be filtered by this query."
+                          label="Base Query"
+                          labelType="label"
+                        >
+                          <div
+                            className="euiFormRow"
+                            id="random_html_id-row"
+                          >
+                            <div
+                              className="euiFormRow__labelWrapper"
+                            >
+                              <EuiFormLabel
+                                className="euiFormRow__label"
+                                htmlFor="random_html_id"
+                                isFocused={false}
+                                type="label"
+                              >
+                                <label
+                                  className="euiFormLabel euiFormRow__label"
+                                  htmlFor="random_html_id"
+                                >
+                                  Base Query
+                                </label>
+                              </EuiFormLabel>
+                            </div>
                             <div
-                              aria-expanded={false}
-                              aria-haspopup="listbox"
-                              aria-labelledby="autocomplete-0-label"
-                              className="aa-Autocomplete"
-                              id="autocomplete-root"
-                              role="combobox"
+                              className="euiFormRow__fieldWrapper"
                             >
-                              <EuiTextArea
-                                aria-autocomplete="both"
-                                aria-labelledby="autocomplete-0-label"
-                                autoCapitalize="off"
-                                autoComplete="off"
-                                autoCorrect="off"
-                                autoFocus={false}
-                                data-test-subj="searchAutocompleteTextArea"
-                                enterKeyHint="search"
-                                id="autocomplete-textarea"
-                                maxLength={512}
+                              <EuiFlexItem
+                                aria-describedby="random_html_id-help"
+                                className="query-area"
+                                grow={false}
+                                id="random_html_id"
+                                key="query-bar"
                                 onBlur={[Function]}
-                                onChange={[Function]}
-                                onClick={[Function]}
                                 onFocus={[Function]}
-                                onKeyDown={[Function]}
-                                placeholder="Enter PPL query"
-                                spellCheck="false"
-                                type="search"
-                                value=""
+                                style={
+                                  Object {
+                                    "minWidth": "900px",
+                                  }
+                                }
                               >
-                                <EuiValidatableControl>
-                                  <textarea
-                                    aria-autocomplete="both"
-                                    aria-labelledby="autocomplete-0-label"
-                                    autoCapitalize="off"
-                                    autoComplete="off"
-                                    autoCorrect="off"
-                                    autoFocus={false}
-                                    className="euiTextArea euiTextArea--resizeVertical"
-                                    data-test-subj="searchAutocompleteTextArea"
-                                    enterKeyHint="search"
-                                    id="autocomplete-textarea"
-                                    maxLength={512}
-                                    onBlur={[Function]}
-                                    onChange={[Function]}
+                                <div
+                                  aria-describedby="random_html_id-help"
+                                  className="euiFlexItem euiFlexItem--flexGrowZero query-area"
+                                  id="random_html_id"
+                                  onBlur={[Function]}
+                                  onFocus={[Function]}
+                                  style={
+                                    Object {
+                                      "minWidth": "900px",
+                                    }
+                                  }
+                                >
+                                  <Autocomplete
+                                    baseQuery=""
+                                    dslService={
+                                      Object {
+                                        "fetch": [MockFunction],
+                                        "fetchFields": [MockFunction],
+                                        "fetchIndices": [MockFunction],
+                                        "http": [MockFunction],
+                                      }
+                                    }
+                                    getSuggestions={[Function]}
+                                    handleQueryChange={[Function]}
+                                    handleQuerySearch={[Function]}
+                                    isDisabled={false}
+                                    key="autocomplete-bar"
+                                    onItemSelect={[Function]}
+                                    query=""
+                                    tabId="application-analytics-tab"
+                                    tempQuery=""
+                                  >
+                                    <div
+                                      aria-expanded={false}
+                                      aria-haspopup="listbox"
+                                      aria-labelledby="autocomplete-0-label"
+                                      className="aa-Autocomplete"
+                                      id="autocomplete-root"
+                                      role="combobox"
+                                    >
+                                      <EuiTextArea
+                                        aria-autocomplete="both"
+                                        aria-labelledby="autocomplete-0-label"
+                                        autoCapitalize="off"
+                                        autoComplete="off"
+                                        autoCorrect="off"
+                                        autoFocus={false}
+                                        data-test-subj="searchAutocompleteTextArea"
+                                        disabled={false}
+                                        enterKeyHint="search"
+                                        id="autocomplete-textarea"
+                                        maxLength={512}
+                                        onBlur={[Function]}
+                                        onChange={[Function]}
+                                        onClick={[Function]}
+                                        onFocus={[Function]}
+                                        onKeyDown={[Function]}
+                                        placeholder="Enter PPL query"
+                                        spellCheck="false"
+                                        type="search"
+                                        value=""
+                                      >
+                                        <EuiValidatableControl>
+                                          <textarea
+                                            aria-autocomplete="both"
+                                            aria-labelledby="autocomplete-0-label"
+                                            autoCapitalize="off"
+                                            autoComplete="off"
+                                            autoCorrect="off"
+                                            autoFocus={false}
+                                            className="euiTextArea euiTextArea--resizeVertical"
+                                            data-test-subj="searchAutocompleteTextArea"
+                                            disabled={false}
+                                            enterKeyHint="search"
+                                            id="autocomplete-textarea"
+                                            maxLength={512}
+                                            onBlur={[Function]}
+                                            onChange={[Function]}
+                                            onClick={[Function]}
+                                            onFocus={[Function]}
+                                            onKeyDown={[Function]}
+                                            placeholder="Enter PPL query"
+                                            rows={6}
+                                            spellCheck="false"
+                                            type="search"
+                                            value=""
+                                          />
+                                        </EuiValidatableControl>
+                                      </EuiTextArea>
+                                    </div>
+                                  </Autocomplete>
+                                  <EuiBadge
+                                    className="ppl-link ppl-link-light"
+                                    color="hollow"
                                     onClick={[Function]}
-                                    onFocus={[Function]}
-                                    onKeyDown={[Function]}
-                                    placeholder="Enter PPL query"
-                                    rows={6}
-                                    spellCheck="false"
-                                    type="search"
-                                    value=""
-                                  />
-                                </EuiValidatableControl>
-                              </EuiTextArea>
-                            </div>
-                          </Autocomplete>
-                          <EuiBadge
-                            className="ppl-link ppl-link-light"
-                            color="hollow"
-                            onClick={[Function]}
-                            onClickAriaLabel="pplLinkShowFlyout"
-                          >
-                            <EuiInnerText>
-                              <button
-                                aria-label="pplLinkShowFlyout"
-                                className="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
-                                disabled={false}
-                                onClick={[Function]}
-                                title="PPL"
+                                    onClickAriaLabel="pplLinkShowFlyout"
+                                  >
+                                    <EuiInnerText>
+                                      <button
+                                        aria-label="pplLinkShowFlyout"
+                                        className="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
+                                        disabled={false}
+                                        onClick={[Function]}
+                                        title="PPL"
+                                      >
+                                        <span
+                                          className="euiBadge__content"
+                                        >
+                                          <span
+                                            className="euiBadge__text"
+                                          >
+                                            PPL
+                                          </span>
+                                        </span>
+                                      </button>
+                                    </EuiInnerText>
+                                  </EuiBadge>
+                                </div>
+                              </EuiFlexItem>
+                              <EuiFormHelpText
+                                className="euiFormRow__text"
+                                id="random_html_id-help"
                               >
-                                <span
-                                  className="euiBadge__content"
+                                <div
+                                  className="euiFormHelpText euiFormRow__text"
+                                  id="random_html_id-help"
                                 >
-                                  <span
-                                    className="euiBadge__text"
-                                  >
-                                    PPL
-                                  </span>
-                                </span>
-                              </button>
-                            </EuiInnerText>
-                          </EuiBadge>
-                        </div>
-                      </EuiFlexItem>
-                      <EuiFormHelpText
-                        className="euiFormRow__text"
-                        id="random_html_id-help"
-                      >
-                        <div
-                          className="euiFormHelpText euiFormRow__text"
-                          id="random_html_id-help"
-                        >
-                          The default logs view in the application will be filtered by this query.
-                        </div>
-                      </EuiFormHelpText>
-                    </div>
+                                  The default logs view in the application will be filtered by this query.
+                                </div>
+                              </EuiFormHelpText>
+                            </div>
+                          </div>
+                        </EuiFormRow>
+                      </div>
+                    </EuiFlexItem>
                   </div>
-                </EuiFormRow>
+                </EuiFlexGroup>
               </div>
             </div>
           </EuiResizeObserver>
@@ -402,6 +469,7 @@ exports[`Log Config component renders empty log config 1`] = `
 
 exports[`Log Config component renders with query 1`] = `
 <LogConfig
+  appConfigs={Array []}
   chrome={
     Object {
       "getIsNavDrawerLocked$": [MockFunction],
@@ -417,6 +485,7 @@ exports[`Log Config component renders with query 1`] = `
       "http": [MockFunction],
     }
   }
+  editMode={false}
   endTime="now"
   filters={Array []}
   http={[MockFunction]}
@@ -429,8 +498,10 @@ exports[`Log Config component renders with query 1`] = `
     }
   }
   query="source = openserach_dashboard_sample_logs"
+  setAppConfigs={[MockFunction]}
   setDescriptionWithStorage={[MockFunction]}
   setEndTime={[MockFunction]}
+  setEndTimeWithStorage={[MockFunction]}
   setFilters={[MockFunction]}
   setFiltersWithStorage={[MockFunction]}
   setIsFlyoutVisible={[MockFunction]}
@@ -438,6 +509,7 @@ exports[`Log Config component renders with query 1`] = `
   setQuery={[MockFunction]}
   setQueryWithStorage={[MockFunction]}
   setStartTime={[MockFunction]}
+  setStartTimeWithStorage={[MockFunction]}
   startTime="now-5m"
 >
   <div>
@@ -627,174 +699,236 @@ exports[`Log Config component renders with query 1`] = `
               <div
                 className="euiAccordion__padding--l"
               >
-                <EuiFormRow
-                  describedByIds={Array []}
-                  display="row"
-                  fullWidth={false}
-                  hasChildLabel={true}
-                  hasEmptyLabelSpace={false}
-                  helpText="The default logs view in the application will be filtered by this query."
-                  label="PPL Base Query"
-                  labelType="label"
+                <EuiFlexGroup
+                  direction="column"
+                  gutterSize="s"
                 >
                   <div
-                    className="euiFormRow"
-                    id="random_html_id-row"
+                    className="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionColumn euiFlexGroup--responsive"
                   >
-                    <div
-                      className="euiFormRow__labelWrapper"
-                    >
-                      <EuiFormLabel
-                        className="euiFormRow__label"
-                        htmlFor="random_html_id"
-                        isFocused={false}
-                        type="label"
-                      >
-                        <label
-                          className="euiFormLabel euiFormRow__label"
-                          htmlFor="random_html_id"
-                        >
-                          PPL Base Query
-                        </label>
-                      </EuiFormLabel>
-                    </div>
-                    <div
-                      className="euiFormRow__fieldWrapper"
-                    >
-                      <EuiFlexItem
-                        aria-describedby="random_html_id-help"
-                        className="query-area"
-                        grow={false}
-                        id="random_html_id"
-                        key="query-bar"
-                        onBlur={[Function]}
-                        onFocus={[Function]}
+                    <EuiFlexItem>
+                      <div
+                        className="euiFlexItem"
                       >
-                        <div
-                          aria-describedby="random_html_id-help"
-                          className="euiFlexItem euiFlexItem--flexGrowZero query-area"
-                          id="random_html_id"
-                          onBlur={[Function]}
-                          onFocus={[Function]}
+                        <EuiCallOut
+                          iconType="iInCircle"
+                          size="s"
+                          style={
+                            Object {
+                              "maxWidth": "900px",
+                            }
+                          }
                         >
-                          <Autocomplete
-                            baseQuery=""
-                            dslService={
+                          <div
+                            className="euiCallOut euiCallOut--primary euiCallOut--small"
+                            style={
                               Object {
-                                "fetch": [MockFunction],
-                                "fetchFields": [MockFunction],
-                                "fetchIndices": [MockFunction],
-                                "http": [MockFunction],
+                                "maxWidth": "900px",
                               }
                             }
-                            getSuggestions={[Function]}
-                            handleQueryChange={[Function]}
-                            handleQuerySearch={[Function]}
-                            key="autocomplete-bar"
-                            onItemSelect={[Function]}
-                            query="source = openserach_dashboard_sample_logs"
-                            tabId="application-analytics-tab"
-                            tempQuery=""
                           >
+                            <EuiText
+                              size="xs"
+                            >
+                              <div
+                                className="euiText euiText--extraSmall"
+                              >
+                                You can't change the base query after the application is created.
+                              </div>
+                            </EuiText>
+                          </div>
+                        </EuiCallOut>
+                      </div>
+                    </EuiFlexItem>
+                    <EuiFlexItem>
+                      <div
+                        className="euiFlexItem"
+                      >
+                        <EuiFormRow
+                          describedByIds={Array []}
+                          display="row"
+                          fullWidth={false}
+                          hasChildLabel={true}
+                          hasEmptyLabelSpace={false}
+                          helpText="The default logs view in the application will be filtered by this query."
+                          label="Base Query"
+                          labelType="label"
+                        >
+                          <div
+                            className="euiFormRow"
+                            id="random_html_id-row"
+                          >
+                            <div
+                              className="euiFormRow__labelWrapper"
+                            >
+                              <EuiFormLabel
+                                className="euiFormRow__label"
+                                htmlFor="random_html_id"
+                                isFocused={false}
+                                type="label"
+                              >
+                                <label
+                                  className="euiFormLabel euiFormRow__label"
+                                  htmlFor="random_html_id"
+                                >
+                                  Base Query
+                                </label>
+                              </EuiFormLabel>
+                            </div>
                             <div
-                              aria-expanded={false}
-                              aria-haspopup="listbox"
-                              aria-labelledby="autocomplete-1-label"
-                              className="aa-Autocomplete"
-                              id="autocomplete-root"
-                              role="combobox"
+                              className="euiFormRow__fieldWrapper"
                             >
-                              <EuiTextArea
-                                aria-autocomplete="both"
-                                aria-labelledby="autocomplete-1-label"
-                                autoCapitalize="off"
-                                autoComplete="off"
-                                autoCorrect="off"
-                                autoFocus={false}
-                                data-test-subj="searchAutocompleteTextArea"
-                                enterKeyHint="search"
-                                id="autocomplete-textarea"
-                                maxLength={512}
+                              <EuiFlexItem
+                                aria-describedby="random_html_id-help"
+                                className="query-area"
+                                grow={false}
+                                id="random_html_id"
+                                key="query-bar"
                                 onBlur={[Function]}
-                                onChange={[Function]}
-                                onClick={[Function]}
                                 onFocus={[Function]}
-                                onKeyDown={[Function]}
-                                placeholder="Enter PPL query"
-                                spellCheck="false"
-                                type="search"
-                                value="source = openserach_dashboard_sample_logs"
+                                style={
+                                  Object {
+                                    "minWidth": "900px",
+                                  }
+                                }
                               >
-                                <EuiValidatableControl>
-                                  <textarea
-                                    aria-autocomplete="both"
-                                    aria-labelledby="autocomplete-1-label"
-                                    autoCapitalize="off"
-                                    autoComplete="off"
-                                    autoCorrect="off"
-                                    autoFocus={false}
-                                    className="euiTextArea euiTextArea--resizeVertical"
-                                    data-test-subj="searchAutocompleteTextArea"
-                                    enterKeyHint="search"
-                                    id="autocomplete-textarea"
-                                    maxLength={512}
-                                    onBlur={[Function]}
-                                    onChange={[Function]}
+                                <div
+                                  aria-describedby="random_html_id-help"
+                                  className="euiFlexItem euiFlexItem--flexGrowZero query-area"
+                                  id="random_html_id"
+                                  onBlur={[Function]}
+                                  onFocus={[Function]}
+                                  style={
+                                    Object {
+                                      "minWidth": "900px",
+                                    }
+                                  }
+                                >
+                                  <Autocomplete
+                                    baseQuery=""
+                                    dslService={
+                                      Object {
+                                        "fetch": [MockFunction],
+                                        "fetchFields": [MockFunction],
+                                        "fetchIndices": [MockFunction],
+                                        "http": [MockFunction],
+                                      }
+                                    }
+                                    getSuggestions={[Function]}
+                                    handleQueryChange={[Function]}
+                                    handleQuerySearch={[Function]}
+                                    isDisabled={false}
+                                    key="autocomplete-bar"
+                                    onItemSelect={[Function]}
+                                    query="source = openserach_dashboard_sample_logs"
+                                    tabId="application-analytics-tab"
+                                    tempQuery=""
+                                  >
+                                    <div
+                                      aria-expanded={false}
+                                      aria-haspopup="listbox"
+                                      aria-labelledby="autocomplete-1-label"
+                                      className="aa-Autocomplete"
+                                      id="autocomplete-root"
+                                      role="combobox"
+                                    >
+                                      <EuiTextArea
+                                        aria-autocomplete="both"
+                                        aria-labelledby="autocomplete-1-label"
+                                        autoCapitalize="off"
+                                        autoComplete="off"
+                                        autoCorrect="off"
+                                        autoFocus={false}
+                                        data-test-subj="searchAutocompleteTextArea"
+                                        disabled={false}
+                                        enterKeyHint="search"
+                                        id="autocomplete-textarea"
+                                        maxLength={512}
+                                        onBlur={[Function]}
+                                        onChange={[Function]}
+                                        onClick={[Function]}
+                                        onFocus={[Function]}
+                                        onKeyDown={[Function]}
+                                        placeholder="Enter PPL query"
+                                        spellCheck="false"
+                                        type="search"
+                                        value="source = openserach_dashboard_sample_logs"
+                                      >
+                                        <EuiValidatableControl>
+                                          <textarea
+                                            aria-autocomplete="both"
+                                            aria-labelledby="autocomplete-1-label"
+                                            autoCapitalize="off"
+                                            autoComplete="off"
+                                            autoCorrect="off"
+                                            autoFocus={false}
+                                            className="euiTextArea euiTextArea--resizeVertical"
+                                            data-test-subj="searchAutocompleteTextArea"
+                                            disabled={false}
+                                            enterKeyHint="search"
+                                            id="autocomplete-textarea"
+                                            maxLength={512}
+                                            onBlur={[Function]}
+                                            onChange={[Function]}
+                                            onClick={[Function]}
+                                            onFocus={[Function]}
+                                            onKeyDown={[Function]}
+                                            placeholder="Enter PPL query"
+                                            rows={6}
+                                            spellCheck="false"
+                                            type="search"
+                                            value="source = openserach_dashboard_sample_logs"
+                                          />
+                                        </EuiValidatableControl>
+                                      </EuiTextArea>
+                                    </div>
+                                  </Autocomplete>
+                                  <EuiBadge
+                                    className="ppl-link ppl-link-light"
+                                    color="hollow"
                                     onClick={[Function]}
-                                    onFocus={[Function]}
-                                    onKeyDown={[Function]}
-                                    placeholder="Enter PPL query"
-                                    rows={6}
-                                    spellCheck="false"
-                                    type="search"
-                                    value="source = openserach_dashboard_sample_logs"
-                                  />
-                                </EuiValidatableControl>
-                              </EuiTextArea>
-                            </div>
-                          </Autocomplete>
-                          <EuiBadge
-                            className="ppl-link ppl-link-light"
-                            color="hollow"
-                            onClick={[Function]}
-                            onClickAriaLabel="pplLinkShowFlyout"
-                          >
-                            <EuiInnerText>
-                              <button
-                                aria-label="pplLinkShowFlyout"
-                                className="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
-                                disabled={false}
-                                onClick={[Function]}
-                                title="PPL"
+                                    onClickAriaLabel="pplLinkShowFlyout"
+                                  >
+                                    <EuiInnerText>
+                                      <button
+                                        aria-label="pplLinkShowFlyout"
+                                        className="euiBadge euiBadge-isClickable euiBadge--hollow euiBadge--iconLeft ppl-link ppl-link-light"
+                                        disabled={false}
+                                        onClick={[Function]}
+                                        title="PPL"
+                                      >
+                                        <span
+                                          className="euiBadge__content"
+                                        >
+                                          <span
+                                            className="euiBadge__text"
+                                          >
+                                            PPL
+                                          </span>
+                                        </span>
+                                      </button>
+                                    </EuiInnerText>
+                                  </EuiBadge>
+                                </div>
+                              </EuiFlexItem>
+                              <EuiFormHelpText
+                                className="euiFormRow__text"
+                                id="random_html_id-help"
                               >
-                                <span
-                                  className="euiBadge__content"
+                                <div
+                                  className="euiFormHelpText euiFormRow__text"
+                                  id="random_html_id-help"
                                 >
-                                  <span
-                                    className="euiBadge__text"
-                                  >
-                                    PPL
-                                  </span>
-                                </span>
-                              </button>
-                            </EuiInnerText>
-                          </EuiBadge>
-                        </div>
-                      </EuiFlexItem>
-                      <EuiFormHelpText
-                        className="euiFormRow__text"
-                        id="random_html_id-help"
-                      >
-                        <div
-                          className="euiFormHelpText euiFormRow__text"
-                          id="random_html_id-help"
-                        >
-                          The default logs view in the application will be filtered by this query.
-                        </div>
-                      </EuiFormHelpText>
-                    </div>
+                                  The default logs view in the application will be filtered by this query.
+                                </div>
+                              </EuiFormHelpText>
+                            </div>
+                          </div>
+                        </EuiFormRow>
+                      </div>
+                    </EuiFlexItem>
                   </div>
-                </EuiFormRow>
+                </EuiFlexGroup>
               </div>
             </div>
           </EuiResizeObserver>
diff --git a/dashboards-observability/public/components/application_analytics/__tests__/create.test.tsx b/dashboards-observability/public/components/application_analytics/__tests__/create.test.tsx
index 47625b1be..cb5571600 100644
--- a/dashboards-observability/public/components/application_analytics/__tests__/create.test.tsx
+++ b/dashboards-observability/public/components/application_analytics/__tests__/create.test.tsx
@@ -28,6 +28,9 @@ describe('Create Page', () => {
     const setToasts = jest.fn();
     const updateApp = jest.fn();
     const clearStorage = jest.fn();
+    const setAppConfigs = jest.fn();
+    const setStartTimeWithStorage = jest.fn();
+    const setEndTimeWithStorage = jest.fn();
     const dslService = ({
       http: jest.fn(),
       fetch: jest.fn(),
@@ -60,6 +63,10 @@ describe('Create Page', () => {
         setToasts={setToasts}
         updateApp={updateApp}
         existingAppId="undefined"
+        appConfigs={[]}
+        setAppConfigs={setAppConfigs}
+        setStartTimeWithStorage={setStartTimeWithStorage}
+        setEndTimeWithStorage={setEndTimeWithStorage}
       />
     );
 
@@ -80,6 +87,9 @@ describe('Create Page', () => {
     const setToasts = jest.fn();
     const updateApp = jest.fn();
     const clearStorage = jest.fn();
+    const setAppConfigs = jest.fn();
+    const setStartTimeWithStorage = jest.fn();
+    const setEndTimeWithStorage = jest.fn();
     const dslService = ({
       http: jest.fn(),
       fetch: jest.fn(),
@@ -112,6 +122,10 @@ describe('Create Page', () => {
         setToasts={setToasts}
         updateApp={updateApp}
         existingAppId="undefined"
+        appConfigs={[]}
+        setAppConfigs={setAppConfigs}
+        setStartTimeWithStorage={setStartTimeWithStorage}
+        setEndTimeWithStorage={setEndTimeWithStorage}
       />
     );
 
@@ -132,6 +146,9 @@ describe('Create Page', () => {
     const setToasts = jest.fn();
     const updateApp = jest.fn();
     const clearStorage = jest.fn();
+    const setAppConfigs = jest.fn();
+    const setStartTimeWithStorage = jest.fn();
+    const setEndTimeWithStorage = jest.fn();
     const dslService = ({
       http: jest.fn(),
       fetch: jest.fn(),
@@ -164,6 +181,10 @@ describe('Create Page', () => {
         setToasts={setToasts}
         updateApp={updateApp}
         existingAppId="undefined"
+        appConfigs={[]}
+        setAppConfigs={setAppConfigs}
+        setStartTimeWithStorage={setStartTimeWithStorage}
+        setEndTimeWithStorage={setEndTimeWithStorage}
       />
     );
     utils.getByText('Log source').click();
@@ -187,6 +208,9 @@ describe('Create Page', () => {
     const setToasts = jest.fn();
     const updateApp = jest.fn();
     const clearStorage = jest.fn();
+    const setAppConfigs = jest.fn();
+    const setStartTimeWithStorage = jest.fn();
+    const setEndTimeWithStorage = jest.fn();
     const dslService = ({
       http: jest.fn(),
       fetch: jest.fn(),
@@ -219,6 +243,10 @@ describe('Create Page', () => {
         setToasts={setToasts}
         updateApp={updateApp}
         existingAppId="undefined"
+        appConfigs={[]}
+        setAppConfigs={setAppConfigs}
+        setStartTimeWithStorage={setStartTimeWithStorage}
+        setEndTimeWithStorage={setEndTimeWithStorage}
       />
     );
     utils.getByText('Log source').click();
@@ -242,6 +270,9 @@ describe('Create Page', () => {
     const setToasts = jest.fn();
     const updateApp = jest.fn();
     const clearStorage = jest.fn();
+    const setAppConfigs = jest.fn();
+    const setStartTimeWithStorage = jest.fn();
+    const setEndTimeWithStorage = jest.fn();
     const dslService = ({
       http: jest.fn(),
       fetch: jest.fn(),
@@ -283,6 +314,10 @@ describe('Create Page', () => {
         setToasts={setToasts}
         updateApp={updateApp}
         existingAppId="undefined"
+        appConfigs={[]}
+        setAppConfigs={setAppConfigs}
+        setStartTimeWithStorage={setStartTimeWithStorage}
+        setEndTimeWithStorage={setEndTimeWithStorage}
       />
     );
     utils.getByText('Select services & entities to include in this application').click();
@@ -306,6 +341,9 @@ describe('Create Page', () => {
     const setToasts = jest.fn();
     const updateApp = jest.fn();
     const clearStorage = jest.fn();
+    const setAppConfigs = jest.fn();
+    const setStartTimeWithStorage = jest.fn();
+    const setEndTimeWithStorage = jest.fn();
     const dslService = ({
       http: jest.fn(),
       fetch: jest.fn(),
@@ -347,6 +385,10 @@ describe('Create Page', () => {
         setToasts={setToasts}
         updateApp={updateApp}
         existingAppId="undefined"
+        appConfigs={[]}
+        setAppConfigs={setAppConfigs}
+        setStartTimeWithStorage={setStartTimeWithStorage}
+        setEndTimeWithStorage={setEndTimeWithStorage}
       />
     );
     utils.getByText('Select services & entities to include in this application').click();
@@ -370,6 +412,9 @@ describe('Create Page', () => {
     const setToasts = jest.fn();
     const updateApp = jest.fn();
     const clearStorage = jest.fn();
+    const setAppConfigs = jest.fn();
+    const setStartTimeWithStorage = jest.fn();
+    const setEndTimeWithStorage = jest.fn();
     const dslService = ({
       http: jest.fn(),
       fetch: jest.fn(),
@@ -411,6 +456,10 @@ describe('Create Page', () => {
         setToasts={setToasts}
         updateApp={updateApp}
         existingAppId="undefined"
+        appConfigs={[]}
+        setAppConfigs={setAppConfigs}
+        setStartTimeWithStorage={setStartTimeWithStorage}
+        setEndTimeWithStorage={setEndTimeWithStorage}
       />
     );
     utils.getByText('Constrain your application to specific trace groups').click();
@@ -434,6 +483,9 @@ describe('Create Page', () => {
     const setToasts = jest.fn();
     const updateApp = jest.fn();
     const clearStorage = jest.fn();
+    const setAppConfigs = jest.fn();
+    const setStartTimeWithStorage = jest.fn();
+    const setEndTimeWithStorage = jest.fn();
     const dslService = ({
       http: jest.fn(),
       fetch: jest.fn(),
@@ -475,6 +527,10 @@ describe('Create Page', () => {
         setToasts={setToasts}
         updateApp={updateApp}
         existingAppId="undefined"
+        appConfigs={[]}
+        setAppConfigs={setAppConfigs}
+        setStartTimeWithStorage={setStartTimeWithStorage}
+        setEndTimeWithStorage={setEndTimeWithStorage}
       />
     );
     utils.getByText('Constrain your application to specific trace groups').click();
diff --git a/dashboards-observability/public/components/application_analytics/__tests__/log_config.test.tsx b/dashboards-observability/public/components/application_analytics/__tests__/log_config.test.tsx
index ba322def6..f1d0781d8 100644
--- a/dashboards-observability/public/components/application_analytics/__tests__/log_config.test.tsx
+++ b/dashboards-observability/public/components/application_analytics/__tests__/log_config.test.tsx
@@ -24,6 +24,9 @@ describe('Log Config component', () => {
     const setDescriptionWithStorage = jest.fn();
     const setQueryWithStorage = jest.fn();
     const setFiltersWithStorage = jest.fn();
+    const setAppConfigs = jest.fn();
+    const setStartTimeWithStorage = jest.fn();
+    const setEndTimeWithStorage = jest.fn();
     const dslService = ({
       http: jest.fn(),
       fetch: jest.fn(),
@@ -52,6 +55,11 @@ describe('Log Config component', () => {
         setDescriptionWithStorage={setDescriptionWithStorage}
         setQueryWithStorage={setQueryWithStorage}
         setFiltersWithStorage={setFiltersWithStorage}
+        appConfigs={[]}
+        setAppConfigs={setAppConfigs}
+        setStartTimeWithStorage={setStartTimeWithStorage}
+        setEndTimeWithStorage={setEndTimeWithStorage}
+        editMode={false}
       />
     );
 
@@ -69,6 +77,9 @@ describe('Log Config component', () => {
     const setDescriptionWithStorage = jest.fn();
     const setQueryWithStorage = jest.fn();
     const setFiltersWithStorage = jest.fn();
+    const setAppConfigs = jest.fn();
+    const setStartTimeWithStorage = jest.fn();
+    const setEndTimeWithStorage = jest.fn();
     const dslService = ({
       http: jest.fn(),
       fetch: jest.fn(),
@@ -97,6 +108,11 @@ describe('Log Config component', () => {
         setDescriptionWithStorage={setDescriptionWithStorage}
         setQueryWithStorage={setQueryWithStorage}
         setFiltersWithStorage={setFiltersWithStorage}
+        appConfigs={[]}
+        setAppConfigs={setAppConfigs}
+        setStartTimeWithStorage={setStartTimeWithStorage}
+        setEndTimeWithStorage={setEndTimeWithStorage}
+        editMode={false}
       />
     );
 
diff --git a/dashboards-observability/public/components/application_analytics/app_analytics.scss b/dashboards-observability/public/components/application_analytics/app_analytics.scss
new file mode 100644
index 000000000..3d9092b98
--- /dev/null
+++ b/dashboards-observability/public/components/application_analytics/app_analytics.scss
@@ -0,0 +1,19 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+ .ppl-link {
+  border: unset;
+  position: absolute;
+  top: 103px;
+  right: 140px;
+  background-color: transparent;
+}
+.ppl-link-light {
+  color: #006BB4;
+}
+
+.ppl-link-dark {
+  color: #1BA9F5;
+}
diff --git a/dashboards-observability/public/components/application_analytics/components/config_components/log_config.tsx b/dashboards-observability/public/components/application_analytics/components/config_components/log_config.tsx
index ddfd5e1ec..633c692eb 100644
--- a/dashboards-observability/public/components/application_analytics/components/config_components/log_config.tsx
+++ b/dashboards-observability/public/components/application_analytics/components/config_components/log_config.tsx
@@ -12,6 +12,8 @@ import {
   EuiFlexItem,
   EuiBadge,
   EuiOverlayMask,
+  EuiCallOut,
+  EuiFlexGroup,
 } from '@elastic/eui';
 import DSLService from 'public/services/requests/dsl';
 import React, { useState } from 'react';
@@ -23,14 +25,16 @@ import { uiSettingsService } from '../../../../../common/utils';
 import { Autocomplete } from '../../../common/search/autocomplete';
 import { AppAnalyticsComponentDeps } from '../../home';
 import { getClearModal } from '../../helpers/modal_containers';
+import '../../app_analytics.scss';
 
 interface LogConfigProps extends AppAnalyticsComponentDeps {
   dslService: DSLService;
   setIsFlyoutVisible: any;
+  editMode: boolean;
 }
 
 export const LogConfig = (props: LogConfigProps) => {
-  const { dslService, query, setQueryWithStorage, setIsFlyoutVisible } = props;
+  const { dslService, query, setQueryWithStorage, setIsFlyoutVisible, editMode } = props;
   const [logOpen, setLogOpen] = useState(false);
   const [isModalVisible, setIsModalVisible] = useState(false);
   const [modalLayout, setModalLayout] = useState(<EuiOverlayMask />);
@@ -91,7 +95,11 @@ export const LogConfig = (props: LogConfigProps) => {
           </>
         }
         extraAction={
-          <EuiButton size="s" disabled={!logOpen || !query.length} onClick={clearAllModal}>
+          <EuiButton
+            size="s"
+            disabled={!logOpen || !query.length || editMode}
+            onClick={clearAllModal}
+          >
             Clear
           </EuiButton>
         }
@@ -100,35 +108,50 @@ export const LogConfig = (props: LogConfigProps) => {
         }}
         paddingSize="l"
       >
-        <EuiFormRow
-          label="PPL Base Query"
-          helpText="The default logs view in the application will be filtered by this query."
-        >
-          <EuiFlexItem grow={false} key="query-bar" className="query-area">
-            <Autocomplete
-              key={'autocomplete-bar'}
-              query={query}
-              tempQuery={tempQuery}
-              baseQuery=""
-              handleQueryChange={handleQueryChange}
-              handleQuerySearch={() => {}}
-              dslService={dslService}
-              getSuggestions={getFullSuggestions}
-              onItemSelect={onItemSelect}
-              tabId={'application-analytics-tab'}
-            />
-            <EuiBadge
-              className={`ppl-link ${
-                uiSettingsService.get('theme:darkMode') ? 'ppl-link-dark' : 'ppl-link-light'
-              }`}
-              color="hollow"
-              onClick={() => showFlyout()}
-              onClickAriaLabel={'pplLinkShowFlyout'}
+        <EuiFlexGroup direction="column" gutterSize="s">
+          <EuiFlexItem>
+            <EuiCallOut iconType={'iInCircle'} size="s" style={{ maxWidth: '900px' }}>
+              You can&apos;t change the base query after the application is created.
+            </EuiCallOut>
+          </EuiFlexItem>
+          <EuiFlexItem>
+            <EuiFormRow
+              label="Base Query"
+              helpText="The default logs view in the application will be filtered by this query."
             >
-              PPL
-            </EuiBadge>
+              <EuiFlexItem
+                grow={false}
+                key="query-bar"
+                className="query-area"
+                style={{ minWidth: '900px' }}
+              >
+                <Autocomplete
+                  key={'autocomplete-bar'}
+                  query={query}
+                  tempQuery={tempQuery}
+                  baseQuery=""
+                  handleQueryChange={handleQueryChange}
+                  handleQuerySearch={() => {}}
+                  dslService={dslService}
+                  getSuggestions={getFullSuggestions}
+                  onItemSelect={onItemSelect}
+                  isDisabled={editMode}
+                  tabId={'application-analytics-tab'}
+                />
+                <EuiBadge
+                  className={`ppl-link ${
+                    uiSettingsService.get('theme:darkMode') ? 'ppl-link-dark' : 'ppl-link-light'
+                  }`}
+                  color="hollow"
+                  onClick={() => showFlyout()}
+                  onClickAriaLabel={'pplLinkShowFlyout'}
+                >
+                  PPL
+                </EuiBadge>
+              </EuiFlexItem>
+            </EuiFormRow>
           </EuiFlexItem>
-        </EuiFormRow>
+        </EuiFlexGroup>
       </EuiAccordion>
       {isModalVisible && modalLayout}
     </div>
diff --git a/dashboards-observability/public/components/application_analytics/components/create.tsx b/dashboards-observability/public/components/application_analytics/components/create.tsx
index 52a53389d..6f63a856e 100644
--- a/dashboards-observability/public/components/application_analytics/components/create.tsx
+++ b/dashboards-observability/public/components/application_analytics/components/create.tsx
@@ -201,7 +201,7 @@ export const CreateApp = (props: CreateAppProps) => {
               </EuiPageContentHeaderSection>
             </EuiPageContentHeader>
             <EuiHorizontalRule />
-            <LogConfig setIsFlyoutVisible={setIsFlyoutVisible} {...props} />
+            <LogConfig editMode={editMode} setIsFlyoutVisible={setIsFlyoutVisible} {...props} />
             <EuiHorizontalRule />
             <ServiceConfig
               selectedServices={selectedServices}
diff --git a/dashboards-observability/public/components/common/search/autocomplete.tsx b/dashboards-observability/public/components/common/search/autocomplete.tsx
index 97ce8bb00..db04d90c3 100644
--- a/dashboards-observability/public/components/common/search/autocomplete.tsx
+++ b/dashboards-observability/public/components/common/search/autocomplete.tsx
@@ -21,6 +21,7 @@ interface AutocompleteProps extends IQueryBarProps {
     dslService: DSLService
   ) => Promise<AutocompleteItem[]>;
   onItemSelect: any;
+  isDisabled?: boolean;
   baseQuery: string;
   tabId: string;
 }
@@ -34,6 +35,7 @@ export const Autocomplete = (props: AutocompleteProps) => {
     dslService,
     getSuggestions,
     onItemSelect,
+    isDisabled,
     baseQuery,
     tabId,
   } = props;
@@ -120,6 +122,7 @@ export const Autocomplete = (props: AutocompleteProps) => {
           placeholder: 'Enter PPL query',
           inputElement: null,
         })}
+        disabled={isDisabled}
       />
       {autocompleteState.isOpen && (
         <div