diff --git a/components/webui/client/src/pages/SearchPage/SearchControls/Native/NativeControls.tsx b/components/webui/client/src/pages/SearchPage/SearchControls/Native/NativeControls.tsx
deleted file mode 100644
index d7a1116699..0000000000
--- a/components/webui/client/src/pages/SearchPage/SearchControls/Native/NativeControls.tsx
+++ /dev/null
@@ -1,31 +0,0 @@
-import {CLP_STORAGE_ENGINES} from "@webui/common/config";
-
-import {SETTINGS_STORAGE_ENGINE} from "../../../../config";
-import Dataset from "../Dataset";
-import styles from "../index.module.css";
-import QueryStatus from "../QueryStatus";
-import TimeRangeInput from "../TimeRangeInput";
-import QueryInput from "./QueryInput";
-import SearchButton from "./SearchButton";
-
-
-/**
- * Renders controls and status for clp & clp-s.
- *
- * @return
- */
-const NativeControls = () => (
-    <div className={styles["searchControlsContainer"]}>
-        <div className={styles["inputsAndButtonRow"]}>
-            {CLP_STORAGE_ENGINES.CLP_S === SETTINGS_STORAGE_ENGINE && <Dataset/>}
-            <QueryInput/>
-            <TimeRangeInput/>
-            <SearchButton/>
-        </div>
-        <div className={styles["status"]}>
-            <QueryStatus/>
-        </div>
-    </div>
-);
-
-export default NativeControls;
diff --git a/components/webui/client/src/pages/SearchPage/SearchControls/Native/NativeControls/ClpControls.tsx b/components/webui/client/src/pages/SearchPage/SearchControls/Native/NativeControls/ClpControls.tsx
new file mode 100644
index 0000000000..0afbcc91f4
--- /dev/null
+++ b/components/webui/client/src/pages/SearchPage/SearchControls/Native/NativeControls/ClpControls.tsx
@@ -0,0 +1,20 @@
+import styles from "../../index.module.css";
+import TimeRangeInput from "../../TimeRangeInput";
+import QueryInput from "../QueryInput";
+import SearchButton from "../SearchButton";
+
+
+/**
+ * Renders CLP search controls.
+ *
+ * @return
+ */
+const ClpControls = () => (
+    <div className={styles["inputsAndButtonRow"]}>
+        <QueryInput/>
+        <TimeRangeInput/>
+        <SearchButton/>
+    </div>
+);
+
+export default ClpControls;
diff --git a/components/webui/client/src/pages/SearchPage/SearchControls/Native/NativeControls/ClpSControls.tsx b/components/webui/client/src/pages/SearchPage/SearchControls/Native/NativeControls/ClpSControls.tsx
new file mode 100644
index 0000000000..783eef8761
--- /dev/null
+++ b/components/webui/client/src/pages/SearchPage/SearchControls/Native/NativeControls/ClpSControls.tsx
@@ -0,0 +1,30 @@
+import Dataset from "../../Dataset";
+import TimeRangeInput from "../../TimeRangeInput";
+import QueryInput from "../QueryInput";
+import SearchButton from "../SearchButton";
+import nativeStyles from "./index.module.css";
+
+
+/**
+ * Renders CLP-S controls.
+ *
+ * @return
+ */
+const ClpSControls = () => (
+    <>
+        <div className={nativeStyles["clpSRow"]}>
+            <Dataset/>
+            <div className={nativeStyles["clpSTimeRange"]}>
+                <TimeRangeInput/>
+            </div>
+        </div>
+        <div className={nativeStyles["clpSRow"]}>
+            <div className={nativeStyles["clpSQuery"]}>
+                <QueryInput/>
+            </div>
+            <SearchButton/>
+        </div>
+    </>
+);
+
+export default ClpSControls;
diff --git a/components/webui/client/src/pages/SearchPage/SearchControls/Native/NativeControls/index.module.css b/components/webui/client/src/pages/SearchPage/SearchControls/Native/NativeControls/index.module.css
new file mode 100644
index 0000000000..1a4fdc94c4
--- /dev/null
+++ b/components/webui/client/src/pages/SearchPage/SearchControls/Native/NativeControls/index.module.css
@@ -0,0 +1,13 @@
+.clpSRow {
+    display: flex;
+    gap: 10px;
+}
+
+.clpSTimeRange {
+    margin-left: auto;
+}
+
+.clpSQuery {
+    flex: 1;
+    min-width: 0;
+}
diff --git a/components/webui/client/src/pages/SearchPage/SearchControls/Native/NativeControls/index.tsx b/components/webui/client/src/pages/SearchPage/SearchControls/Native/NativeControls/index.tsx
new file mode 100644
index 0000000000..84765520ff
--- /dev/null
+++ b/components/webui/client/src/pages/SearchPage/SearchControls/Native/NativeControls/index.tsx
@@ -0,0 +1,30 @@
+import {CLP_STORAGE_ENGINES} from "@webui/common/config";
+
+import {SETTINGS_STORAGE_ENGINE} from "../../../../../config";
+import styles from "../../index.module.css";
+import QueryStatus from "../../QueryStatus";
+import ClpControls from "./ClpControls";
+import ClpSControls from "./ClpSControls";
+
+
+/**
+ * Chooses between clp and clp-s native control layouts.
+ *
+ * @return
+ */
+const NativeControls = () => {
+    const isClpS = CLP_STORAGE_ENGINES.CLP_S === SETTINGS_STORAGE_ENGINE;
+
+    return (
+        <div className={styles["searchControlsContainer"]}>
+            {isClpS ?
+                <ClpSControls/> :
+                <ClpControls/>}
+            <div className={styles["status"]}>
+                <QueryStatus/>
+            </div>
+        </div>
+    );
+};
+
+export default NativeControls;
diff --git a/components/webui/client/src/pages/SearchPage/SearchControls/Native/SearchButton/CancelButton.tsx b/components/webui/client/src/pages/SearchPage/SearchControls/Native/SearchButton/CancelButton.tsx
index 2a21c9c7bf..ee4e3da026 100644
--- a/components/webui/client/src/pages/SearchPage/SearchControls/Native/SearchButton/CancelButton.tsx
+++ b/components/webui/client/src/pages/SearchPage/SearchControls/Native/SearchButton/CancelButton.tsx
@@ -47,10 +47,7 @@ const CancelButton = () => {
             icon={<CloseOutlined/>}
             size={"middle"}
             type={"primary"}
-            onClick={handleCancelButtonClick}
-        >
-            Cancel
-        </Button>
+            onClick={handleCancelButtonClick}/>
     );
 };
 
diff --git a/components/webui/client/src/pages/SearchPage/SearchControls/Native/SearchButton/SubmitButton/index.tsx b/components/webui/client/src/pages/SearchPage/SearchControls/Native/SearchButton/SubmitButton/index.tsx
index 005688d949..a3f6534096 100644
--- a/components/webui/client/src/pages/SearchPage/SearchControls/Native/SearchButton/SubmitButton/index.tsx
+++ b/components/webui/client/src/pages/SearchPage/SearchControls/Native/SearchButton/SubmitButton/index.tsx
@@ -136,10 +136,7 @@ const SubmitButton = () => {
                     handleSubmitButtonClick().catch((err: unknown) => {
                         throw err;
                     });
-                }}
-            >
-                Search
-            </Button>
+                }}/>
         </Tooltip>
     );
 };