Files
openobserve/web
Loakesh Indiran 87a374216a feat(templates): one o2_default, no org default level, status dot
Amendment A to the unified notification templates design.

- D2: remove the org default level. The Default templates card, the
  default_templates setting and its validation, the legacy pointer
  backfill and the incident org override are gone. Resolution is the
  override, then the destination's template if it applies, then the
  compiled default. Stored template_source rows that say org_default
  still read.
- D3: one compiled content template, o2_default, for every kind, with
  the 17-field superset. A field whose variables are all blank hides,
  and another kind's variable reads blank instead of unknown. Each
  module maps its values onto the common keys. Migration 143 folds the
  five o2_default_* rows and the prebuilt_downtime pair into
  o2_default, moves their references and deletes the org pointer
  settings. The seeder repeats it on boot.
- D1: new status_dot, alert_level_label and alert_trigger_time_utc
  variables. Slack blocks sit at the top level with no attachment
  color. Teams, Discord and email lose their accent color and badge.
- D4 to D6: Playground heading and help line. The playground Kind
  drives the variable chips and guide. A template opens on its first
  Applies to kind.
- The downtime Send test renders o2_default on the server.
- The content templates Playwright spec expects the Critical default.
2026-11-04 13:50:49 +05:30
..
2026-05-28 11:00:49 +00:00
…
…
2026-09-03 10:39:27 +00:00

web

This template should help get you started developing with Vue 3 in Vite.

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:

  1. Disable the built-in TypeScript Extension
    1. Run Extensions: Show Built-in Extensions from VSCode's command palette
    2. Find TypeScript and JavaScript Language Features, right click and select Disable (Workspace)
  2. Reload the VSCode window by running Developer: Reload Window from 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