mirror of
https://github.com/openobserve/openobserve.git
synced 2026-11-05 16:10:43 +00:00
Bhargav
c6574a81fa
## What changed Fixed `addFieldTerm` in `SearchBar.vue` so that include/exclude search terms are inserted at the correct position in SQL aggregation queries. Previously the code checked for `ORDER BY` before `GROUP BY`, causing the injected `WHERE` clause to land after `GROUP BY` (invalid SQL). The fix scans all terminating clauses (`GROUP BY`, `HAVING`, `ORDER BY`, `LIMIT`) and inserts `WHERE` before whichever appears earliest. The remaining diff is Prettier-driven reformatting with no logic changes. ## Why The old sequential `if/else if` checked `ORDER BY` first. On a query containing both `GROUP BY` and `ORDER BY`, it would split at `ORDER BY` and produce `… WHERE <filter> ORDER BY … GROUP BY …` — structurally invalid SQL. The fix enforces correct SQL clause ordering (`FROM → WHERE → GROUP BY → HAVING → ORDER BY → LIMIT`). ## Approach The new algorithm iterates over all four terminating clauses, records the index of each that is present, picks the one with the smallest index (`firstClause`), then uses the existing `queryIndexSplit` utility to splice the `WHERE <filter>` token in before it. If no terminating clause exists the filter is appended. The spec file was extended with 14 new unit tests covering the core bug scenario (GROUP BY + ORDER BY together), each individual clause in isolation, all-clauses-present, AND-append paths, and edge cases (case-insensitive matching, column names containing clause keywords, special characters in filter values). ## Risk The logic change is isolated to the `else` branch of `addFieldTerm` that handles queries with no existing `WHERE` clause. Queries that already have a `WHERE` clause follow a separate code path and are unaffected. Reviewers should confirm the `queryIndexSplit` utility is case-insensitive-safe (the fix lowercases only for the index scan, then splits the original string) and verify the preserved trailing `afterClause` string includes the space/newline that was previously part of the `" order by"` / `" group by"` literals.
web
This template should help get you started developing with Vue 3 in Vite.
Recommended IDE Setup
VSCode + Volar (and disable Vetur) + TypeScript Vue Plugin (Volar).
Type Support for .vue Imports in TS
TypeScript cannot handle type information for .vue imports by default, so we replace the tsc CLI with vue-tsc for type checking. In editors, we need TypeScript Vue Plugin (Volar) to make the TypeScript language service aware of .vue types.
If the standalone TypeScript plugin doesn't feel fast enough to you, Volar has also implemented a Take Over Mode that is more performant. You can enable it by the following steps:
- Disable the built-in TypeScript Extension
- Run
Extensions: Show Built-in Extensionsfrom VSCode's command palette - Find
TypeScript and JavaScript Language Features, right click and selectDisable (Workspace)
- Run
- Reload the VSCode window by running
Developer: Reload Windowfrom the command palette.
Customize configuration
See Vite Configuration Reference.
Project Setup
npm install
Compile and Hot-Reload for Development
For stand-alone UI development environment, create .env file and which contains below environment variable
VITE_OPENOBSERVE_ENDPOINT=http://localhost:5080/
npm run dev
Type-Check, Compile and Minify for Production
npm run build
Run Unit Tests with Vitest
npm run test:unit
Run End-to-End Tests with Cypress
npm run test:e2e:dev
This runs the end-to-end tests against the Vite development server. It is much faster than the production build.
But it's still recommended to test the production build with test:e2e before deploying (e.g. in CI environments):
npm run build
npm run test:e2e
Lint with ESLint
npm run lint