@juice-js/observability 1.0.0-alpha.5 → 1.0.0-alpha.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/fesm2022/{juice-js-observability-traces.page-BZxnac4Y.mjs → juice-js-observability-traces.page-B1vYmz_K.mjs} +5 -5
  2. package/fesm2022/{juice-js-observability-traces.page-BZxnac4Y.mjs.map → juice-js-observability-traces.page-B1vYmz_K.mjs.map} +1 -1
  3. package/fesm2022/juice-js-observability.mjs +1 -1
  4. package/package.json +1 -1
  5. package/styles/_observability.scss +4 -0
package/fesm2022/{juice-js-observability-traces.page-BZxnac4Y.mjs → juice-js-observability-traces.page-B1vYmz_K.mjs} RENAMED
@@ -174,8 +174,8 @@ var TracesPage = class TracesPage {
174
174
  <mat-option value="">Any</mat-option><mat-option value="error">Error</mat-option><mat-option value="ok">No error</mat-option>
175
175
  </mat-select>
176
176
  </mat-form-field>
177
- <mat-form-field subscriptSizing="dynamic" class="jc-field-sm"><mat-label>Min duration (ms)</mat-label><input matInput type="number" min="0" name="min" [ngModel]="min() ?? ''"></mat-form-field>
178
- <mat-form-field subscriptSizing="dynamic" class="jc-field-sm"><mat-label>Max duration (ms)</mat-label><input matInput type="number" min="0" name="max" [ngModel]="max() ?? ''"></mat-form-field>
177
+ <mat-form-field subscriptSizing="dynamic" class="jc-field-md"><mat-label>Min duration (ms)</mat-label><input matInput type="number" min="0" name="min" [ngModel]="min() ?? ''"></mat-form-field>
178
+ <mat-form-field subscriptSizing="dynamic" class="jc-field-md"><mat-label>Max duration (ms)</mat-label><input matInput type="number" min="0" name="max" [ngModel]="max() ?? ''"></mat-form-field>
179
179
  <mat-form-field subscriptSizing="dynamic"><mat-label>Trace ID</mat-label><input matInput name="trace" [ngModel]="trace() ?? ''"></mat-form-field>
180
180
  <mat-form-field subscriptSizing="dynamic"><mat-label>Span ID</mat-label><input matInput name="spanId" [ngModel]="spanId() ?? ''"></mat-form-field>
181
181
  <mat-form-field subscriptSizing="dynamic" class="jc-field-wide">
@@ -406,8 +406,8 @@ i0.ɵɵngDeclareClassMetadata({
406
406
  <mat-option value="">Any</mat-option><mat-option value="error">Error</mat-option><mat-option value="ok">No error</mat-option>
407
407
  </mat-select>
408
408
  </mat-form-field>
409
- <mat-form-field subscriptSizing="dynamic" class="jc-field-sm"><mat-label>Min duration (ms)</mat-label><input matInput type="number" min="0" name="min" [ngModel]="min() ?? ''"></mat-form-field>
410
- <mat-form-field subscriptSizing="dynamic" class="jc-field-sm"><mat-label>Max duration (ms)</mat-label><input matInput type="number" min="0" name="max" [ngModel]="max() ?? ''"></mat-form-field>
409
+ <mat-form-field subscriptSizing="dynamic" class="jc-field-md"><mat-label>Min duration (ms)</mat-label><input matInput type="number" min="0" name="min" [ngModel]="min() ?? ''"></mat-form-field>
410
+ <mat-form-field subscriptSizing="dynamic" class="jc-field-md"><mat-label>Max duration (ms)</mat-label><input matInput type="number" min="0" name="max" [ngModel]="max() ?? ''"></mat-form-field>
411
411
  <mat-form-field subscriptSizing="dynamic"><mat-label>Trace ID</mat-label><input matInput name="trace" [ngModel]="trace() ?? ''"></mat-form-field>
412
412
  <mat-form-field subscriptSizing="dynamic"><mat-label>Span ID</mat-label><input matInput name="spanId" [ngModel]="spanId() ?? ''"></mat-form-field>
413
413
  <mat-form-field subscriptSizing="dynamic" class="jc-field-wide">
@@ -517,4 +517,4 @@ i0.ɵɵngDeclareClassMetadata({
517
517
  });
518
518
  export { TracesPage };
519
519
 
520
- //# sourceMappingURL=juice-js-observability-traces.page-BZxnac4Y.mjs.map
520
+ //# sourceMappingURL=juice-js-observability-traces.page-B1vYmz_K.mjs.map
package/fesm2022/{juice-js-observability-traces.page-BZxnac4Y.mjs.map → juice-js-observability-traces.page-B1vYmz_K.mjs.map} RENAMED
@@ -1 +1 @@
1
- {"version":3,"file":"juice-js-observability-traces.page-BZxnac4Y.mjs","names":[],"sources":["../../../../projects/juice-js/observability/src/lib/pages/traces.page.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, inject, input } from '@angular/core';\nimport { apiResource } from '../shared/resource';\nimport { FormsModule } from '@angular/forms';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatFormFieldModule } from '@angular/material/form-field';\nimport { MatInputModule } from '@angular/material/input';\nimport { MatSelectModule } from '@angular/material/select';\nimport { Router } from '@angular/router';\nimport { map } from 'rxjs';\nimport { ApiService } from '../core/api.service';\nimport { ContextService } from '../core/context.service';\nimport { ContextBar } from '../shared/ui';\nimport { TraceTable } from '../shared/telemetry';\n\n/**\n * Trace search (Console requirements §5): narrow from a service and time window to one trace by operation, status,\n * duration, instance, resource, dependency, trace or span id, and span attributes such as `http.route=/orders` or\n * `messaging.destination.name=orders`. Every filter is a URL parameter, so a search is a shareable link.\n */\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [FormsModule, MatButtonModule, MatFormFieldModule, MatInputModule, MatSelectModule, ContextBar, TraceTable],\n template: `\n <jc-context-bar><h1>Traces</h1></jc-context-bar>\n <form class=\"jc-filter-form\" (ngSubmit)=\"apply(f.value)\" #f=\"ngForm\">\n <mat-form-field subscriptSizing=\"dynamic\">\n <mat-label>Service</mat-label>\n <mat-select name=\"service\" [ngModel]=\"service() ?? ''\">\n <mat-option value=\"\">Any</mat-option>\n @for (s of services.value() ?? []; track s.id) { <mat-option [value]=\"s.id\">{{ s.key }}</mat-option> }\n </mat-select>\n </mat-form-field>\n <mat-form-field subscriptSizing=\"dynamic\"><mat-label>Operation</mat-label><input matInput name=\"op\" [ngModel]=\"op() ?? ''\"></mat-form-field>\n <mat-form-field subscriptSizing=\"dynamic\" class=\"jc-field-sm\">\n <mat-label>Status</mat-label>\n <mat-select name=\"status\" [ngModel]=\"status() ?? ''\">\n <mat-option value=\"\">Any</mat-option><mat-option value=\"error\">Error</mat-option><mat-option value=\"ok\">No error</mat-option>\n </mat-select>\n </mat-form-field>\n <mat-form-field subscriptSizing=\"dynamic\" class=\"jc-field-sm\"><mat-label>Min duration (ms)</mat-label><input matInput type=\"number\" min=\"0\" name=\"min\" [ngModel]=\"min() ?? ''\"></mat-form-field>\n <mat-form-field subscriptSizing=\"dynamic\" class=\"jc-field-sm\"><mat-label>Max duration (ms)</mat-label><input matInput type=\"number\" min=\"0\" name=\"max\" [ngModel]=\"max() ?? ''\"></mat-form-field>\n <mat-form-field subscriptSizing=\"dynamic\"><mat-label>Trace ID</mat-label><input matInput name=\"trace\" [ngModel]=\"trace() ?? ''\"></mat-form-field>\n <mat-form-field subscriptSizing=\"dynamic\"><mat-label>Span ID</mat-label><input matInput name=\"spanId\" [ngModel]=\"spanId() ?? ''\"></mat-form-field>\n <mat-form-field subscriptSizing=\"dynamic\" class=\"jc-field-wide\">\n <mat-label>Attributes</mat-label>\n <input matInput name=\"attr\" [ngModel]=\"attributes().join(', ')\" placeholder=\"http.route=/orders, messaging.destination.name=orders\">\n </mat-form-field>\n <button mat-flat-button type=\"submit\">Search</button>\n <button mat-button type=\"button\" (click)=\"clear()\">Clear</button>\n </form>\n @if (instance() || resource() || dependency()) {\n <p class=\"jc-muted\">Also filtered by {{ scopeText() }}.\n <a href=\"\" (click)=\"$event.preventDefault(); apply({ instance: null, resource: null, dependency: null })\">Remove</a></p>\n }\n <jc-trace-table [query]=\"query()\" [limit]=\"100\" />`,\n})\nexport class TracesPage {\n protected readonly ctx = inject(ContextService);\n private readonly api = inject(ApiService);\n private readonly router = inject(Router);\n\n readonly service = input<string>();\n readonly op = input<string>();\n readonly status = input<string>();\n readonly min = input<string>();\n readonly max = input<string>();\n readonly trace = input<string>();\n readonly spanId = input<string>();\n readonly attr = input<string | string[]>();\n readonly instance = input<string>();\n readonly resource = input<string>();\n readonly dependency = input<string>();\n\n protected readonly services = apiResource({ stream: () => this.api.resources('service').pipe(map(p => p.items)) });\n protected readonly scopeText = computed(() =>\n [this.instance() && 'an instance', this.resource() && 'a resource', this.dependency() && 'a dependency'].filter(x => !!x).join(', '));\n protected readonly attributes = computed(() => {\n const a = this.attr();\n return a === undefined ? [] : Array.isArray(a) ? a : [a];\n });\n protected readonly query = computed(() => ({\n serviceId: this.service(), operation: this.op(), status: this.status(), minDurationMs: this.min(), maxDurationMs: this.max(),\n traceId: this.trace(), spanId: this.spanId(), attribute: this.attributes(), instanceId: this.instance(),\n resourceId: this.resource(), dependencyId: this.dependency(),\n }));\n\n apply(value: Record<string, unknown>) {\n const queryParams: Record<string, unknown> = {};\n for (const [key, v] of Object.entries(value)) queryParams[key] = v === '' || v === undefined ? null : v;\n if (typeof value['attr'] === 'string') {\n queryParams['attr'] = (value['attr'] as string).split(',').map(a => a.trim()).filter(Boolean);\n }\n void this.router.navigate([], { queryParams, queryParamsHandling: 'merge' });\n }\n\n clear() {\n void this.router.navigate([], { queryParams: this.ctx.keep() });\n }\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"juice-js-observability-traces.page-B1vYmz_K.mjs","names":[],"sources":["../../../../projects/juice-js/observability/src/lib/pages/traces.page.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, inject, input } from '@angular/core';\nimport { apiResource } from '../shared/resource';\nimport { FormsModule } from '@angular/forms';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatFormFieldModule } from '@angular/material/form-field';\nimport { MatInputModule } from '@angular/material/input';\nimport { MatSelectModule } from '@angular/material/select';\nimport { Router } from '@angular/router';\nimport { map } from 'rxjs';\nimport { ApiService } from '../core/api.service';\nimport { ContextService } from '../core/context.service';\nimport { ContextBar } from '../shared/ui';\nimport { TraceTable } from '../shared/telemetry';\n\n/**\n * Trace search (Console requirements §5): narrow from a service and time window to one trace by operation, status,\n * duration, instance, resource, dependency, trace or span id, and span attributes such as `http.route=/orders` or\n * `messaging.destination.name=orders`. Every filter is a URL parameter, so a search is a shareable link.\n */\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [FormsModule, MatButtonModule, MatFormFieldModule, MatInputModule, MatSelectModule, ContextBar, TraceTable],\n template: `\n <jc-context-bar><h1>Traces</h1></jc-context-bar>\n <form class=\"jc-filter-form\" (ngSubmit)=\"apply(f.value)\" #f=\"ngForm\">\n <mat-form-field subscriptSizing=\"dynamic\">\n <mat-label>Service</mat-label>\n <mat-select name=\"service\" [ngModel]=\"service() ?? ''\">\n <mat-option value=\"\">Any</mat-option>\n @for (s of services.value() ?? []; track s.id) { <mat-option [value]=\"s.id\">{{ s.key }}</mat-option> }\n </mat-select>\n </mat-form-field>\n <mat-form-field subscriptSizing=\"dynamic\"><mat-label>Operation</mat-label><input matInput name=\"op\" [ngModel]=\"op() ?? ''\"></mat-form-field>\n <mat-form-field subscriptSizing=\"dynamic\" class=\"jc-field-sm\">\n <mat-label>Status</mat-label>\n <mat-select name=\"status\" [ngModel]=\"status() ?? ''\">\n <mat-option value=\"\">Any</mat-option><mat-option value=\"error\">Error</mat-option><mat-option value=\"ok\">No error</mat-option>\n </mat-select>\n </mat-form-field>\n <mat-form-field subscriptSizing=\"dynamic\" class=\"jc-field-md\"><mat-label>Min duration (ms)</mat-label><input matInput type=\"number\" min=\"0\" name=\"min\" [ngModel]=\"min() ?? ''\"></mat-form-field>\n <mat-form-field subscriptSizing=\"dynamic\" class=\"jc-field-md\"><mat-label>Max duration (ms)</mat-label><input matInput type=\"number\" min=\"0\" name=\"max\" [ngModel]=\"max() ?? ''\"></mat-form-field>\n <mat-form-field subscriptSizing=\"dynamic\"><mat-label>Trace ID</mat-label><input matInput name=\"trace\" [ngModel]=\"trace() ?? ''\"></mat-form-field>\n <mat-form-field subscriptSizing=\"dynamic\"><mat-label>Span ID</mat-label><input matInput name=\"spanId\" [ngModel]=\"spanId() ?? ''\"></mat-form-field>\n <mat-form-field subscriptSizing=\"dynamic\" class=\"jc-field-wide\">\n <mat-label>Attributes</mat-label>\n <input matInput name=\"attr\" [ngModel]=\"attributes().join(', ')\" placeholder=\"http.route=/orders, messaging.destination.name=orders\">\n </mat-form-field>\n <button mat-flat-button type=\"submit\">Search</button>\n <button mat-button type=\"button\" (click)=\"clear()\">Clear</button>\n </form>\n @if (instance() || resource() || dependency()) {\n <p class=\"jc-muted\">Also filtered by {{ scopeText() }}.\n <a href=\"\" (click)=\"$event.preventDefault(); apply({ instance: null, resource: null, dependency: null })\">Remove</a></p>\n }\n <jc-trace-table [query]=\"query()\" [limit]=\"100\" />`,\n})\nexport class TracesPage {\n protected readonly ctx = inject(ContextService);\n private readonly api = inject(ApiService);\n private readonly router = inject(Router);\n\n readonly service = input<string>();\n readonly op = input<string>();\n readonly status = input<string>();\n readonly min = input<string>();\n readonly max = input<string>();\n readonly trace = input<string>();\n readonly spanId = input<string>();\n readonly attr = input<string | string[]>();\n readonly instance = input<string>();\n readonly resource = input<string>();\n readonly dependency = input<string>();\n\n protected readonly services = apiResource({ stream: () => this.api.resources('service').pipe(map(p => p.items)) });\n protected readonly scopeText = computed(() =>\n [this.instance() && 'an instance', this.resource() && 'a resource', this.dependency() && 'a dependency'].filter(x => !!x).join(', '));\n protected readonly attributes = computed(() => {\n const a = this.attr();\n return a === undefined ? [] : Array.isArray(a) ? a : [a];\n });\n protected readonly query = computed(() => ({\n serviceId: this.service(), operation: this.op(), status: this.status(), minDurationMs: this.min(), maxDurationMs: this.max(),\n traceId: this.trace(), spanId: this.spanId(), attribute: this.attributes(), instanceId: this.instance(),\n resourceId: this.resource(), dependencyId: this.dependency(),\n }));\n\n apply(value: Record<string, unknown>) {\n const queryParams: Record<string, unknown> = {};\n for (const [key, v] of Object.entries(value)) queryParams[key] = v === '' || v === undefined ? null : v;\n if (typeof value['attr'] === 'string') {\n queryParams['attr'] = (value['attr'] as string).split(',').map(a => a.trim()).filter(Boolean);\n }\n void this.router.navigate([], { queryParams, queryParamsHandling: 'merge' });\n }\n\n clear() {\n void this.router.navigate([], { queryParams: this.ctx.keep() });\n }\n}\n"],"mappings":"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"}
package/fesm2022/juice-js-observability.mjs CHANGED
@@ -317,7 +317,7 @@ const OBSERVABILITY_ROUTES = [
317
317
  page("", "Overview", () => import("./juice-js-observability-overview.page-DU0GxSXQ.mjs").then((m) => m.OverviewPage)),
318
318
  page("services", "Services", () => import("./juice-js-observability-services.page-CX6S7sUu.mjs").then((m) => m.ServicesPage)),
319
319
  page("services/:id", "Service", () => import("./juice-js-observability-service.page-Qc6FYChB.mjs").then((m) => m.ServicePage)),
320
- page("traces", "Traces", () => import("./juice-js-observability-traces.page-BZxnac4Y.mjs").then((m) => m.TracesPage)),
320
+ page("traces", "Traces", () => import("./juice-js-observability-traces.page-B1vYmz_K.mjs").then((m) => m.TracesPage)),
321
321
  page("traces/:traceId", "Trace", () => import("./juice-js-observability-trace.page-DccvH1SV.mjs").then((m) => m.TracePage)),
322
322
  page("topology", "Dependencies", () => import("./juice-js-observability-topology.page-CLz7J5pq.mjs").then((m) => m.TopologyPage)),
323
323
  page("logs", "Logs", () => import("./juice-js-observability-logs.page--j6W1Ej-.mjs").then((m) => m.LogsPage)),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@juice-js/observability",
3
- "version": "1.0.0-alpha.5",
3
+ "version": "1.0.0-alpha.6",
4
4
  "description": "Juice Observability pages (services, traces, topology, logs, metrics, resources, alerts, rules) for an Angular app on juice-layout",
5
5
  "author": "jack@creatorflow.io",
6
6
  "license": "MIT",
package/styles/_observability.scss CHANGED
@@ -101,6 +101,7 @@
101
101
  .jc-crumb { color: var(--jc-muted); }
102
102
  .jc-crumb-sep { color: var(--jc-muted); }
103
103
  .jc-field-sm { width: 150px; }
104
+ .jc-field-md { width: 180px; }
104
105
  .jc-field-wide { min-width: 320px; flex: 1; }
105
106
  .jc-lookup { display: flex; align-items: center; gap: 4px; border: 1px solid var(--jc-border); border-radius: 6px; padding: 2px 8px; background: var(--jc-surface);
106
107
  input { border: 0; outline: 0; background: transparent; color: inherit; width: 240px; font: inherit; padding: 6px 0; }
@@ -117,6 +118,9 @@
117
118
  .jc-list-row:last-child { border-bottom: 0; }
118
119
  .jc-summary { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; margin-bottom: 8px; }
119
120
  .jc-actions { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; }
121
+ // The filters, the context bar and every other field the pages size label each field. An app theme denser than -1 hides a fill field's label (and
122
+ // these fields have no placeholder to fall back on), so keep them at -1 whatever the app's density.
123
+ .jc-context, .jc-filter-form, mat-form-field[class*='jc-field-'] { @include mat.form-field-density(-1); }
120
124
  .jc-filter-form { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 12px; }
121
125
  .jc-filters { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
122
126
  .jc-chip { display: inline-flex; gap: 6px; align-items: center; border: 1px solid var(--jc-border); border-radius: 14px; padding: 2px 10px; font-size: 13px; color: var(--jc-text); }