Files
openobserve/tests
ktx-vaidehiandktx-akshay 0253616aa5 feat: dashboard query editor vertical scroll (#7453)
### **PR Type**
Enhancement


___

### **Description**
- Enable dashboard query bar by default

- Refactor AddPanel layout with scrollable containers

- Simplify overflow styles; remove outdated splitters

- Adjust component height calculations


___



### **Changes walkthrough** 📝
<table><thead><tr><th></th><th align="left">Relevant
files</th></tr></thead><tbody><tr><td><strong>Enhancement</strong></td><td><table>
<tr>
  <td>
    <details>
<summary><strong>DashboardQueryEditor.vue</strong><dd><code>Simplify
query editor bar styling</code>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </dd></summary>
<hr>

web/src/components/dashboards/addPanel/DashboardQueryEditor.vue

<li>Removed query bar toggle icon wrapper<br> <li> Commented out cursor
pointer on <code>.sql-bar</code>


</details>


  </td>
<td><a
href="https://github.com/openobserve/openobserve/pull/7453/files#diff-68bf1b319223d103f1b99e0b681764e4eb76942399397779c81c2cd18f6485ff">+1/-14</a>&nbsp;
&nbsp; </td>

</tr>

<tr>
  <td>
    <details>
<summary><strong>AddPanel.vue</strong><dd><code>Refactor AddPanel layout
and scrolling</code>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; </dd></summary>
<hr>

web/src/views/Dashboards/addPanel/AddPanel.vue

<li>Replaced nested <code>q-splitter</code> with scrollable
<code>div</code> wrappers<br> <li> Moved
<code>DashboardQueryBuilder</code> and
<code>VariablesValueSelector</code><br> <li> Simplified outdated chart
notification styling<br> <li> Updated wrappers heights for renderer and
editor


</details>


  </td>
<td><a
href="https://github.com/openobserve/openobserve/pull/7453/files#diff-c9632db1ad95af95aba10161bcbc7c5608318919f228637bdafae3f3a31267e8">+143/-215</a></td>

</tr>
</table></td></tr><tr><td><strong>Configuration
changes</strong></td><td><table>
<tr>
  <td>
    <details>
<summary><strong>useDashboardPanel.ts</strong><dd><code>Enable query bar
by default</code>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp; </dd></summary>
<hr>

web/src/composables/useDashboardPanel.ts

- Set default `showQueryBar` to `true`


</details>


  </td>
<td><a
href="https://github.com/openobserve/openobserve/pull/7453/files#diff-fbba1700750053b9eaf38ddd30dab84531bc44131c795ebb713811e4930cd7cb">+1/-1</a>&nbsp;
&nbsp; &nbsp; </td>

</tr>
</table></td></tr></tr></tbody></table>

___

> <details> <summary> Need help?</summary><li>Type <code>/help how to
...</code> in the comments thread for any questions about PR-Agent
usage.</li><li>Check out the <a
href="https://qodo-merge-docs.qodo.ai/usage-guide/">documentation</a>
for more information.</li></details>

---------

Co-authored-by: ktx-akshay <akshay.patil@kiara.tech>
2025-07-08 16:53:11 +05:30
..
2024-09-22 17:57:47 +08:00