diff --git a/README.md b/README.md index 359758c..10617a3 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,10 @@ -# Agoda.DevExTelemetry +

+ DX Telemetry Manager logo +

-A full-stack developer experience telemetry dashboard that collects, stores, and visualizes build and test metrics from development tools. +# DX Telemetry Manager + +A full-stack **DX telemetry** dashboard that collects, stores, and visualizes build and test metrics from development tools. This is an internal tool designed to be deployed within your organization's infrastructure. It receives telemetry from build plugins and test runners across your engineering teams, providing visibility into compile times, test pass rates, hot reload performance, and other developer productivity signals. It is **not** intended to be exposed to the public internet. diff --git a/docs/assets/dx-telemetry-logo-header.svg b/docs/assets/dx-telemetry-logo-header.svg new file mode 100644 index 0000000..4cd3358 --- /dev/null +++ b/docs/assets/dx-telemetry-logo-header.svg @@ -0,0 +1,28 @@ + + + + + + + + + + + + + + + + + + + + + + + DX Telemetry + Observe, Optimize, Deliver + + + + diff --git a/docs/branding/agoda_devex_telemetry_logo_concepts.html b/docs/branding/agoda_devex_telemetry_logo_concepts.html new file mode 100644 index 0000000..2b2a03d --- /dev/null +++ b/docs/branding/agoda_devex_telemetry_logo_concepts.html @@ -0,0 +1,383 @@ + + + + + + Agoda.DevExTelemetry Logo Concepts + + + +
+
+

Agoda.DevExTelemetry / DX Telemetry Manager

+

+ Minimal engineering-tool identity built around a single compact mark: a telemetry pulse flowing into a structured graph/dashboard frame. + The icon is designed to read clearly at small sizes while still implying measurement, feedback loops, and developer workflow. +

+
+ Deep Navy + Teal Accent + Electric Blue Option + Agoda-style Magenta +
+
+ +
+
+
1) Icon-only mark
+
+ + + + + + + + + + + + + + + + + + + + + + + + +
+
+ Rounded dashboard container plus structured bar geometry gives it a product/tool feel; the pulse path suggests telemetry, developer loops, and measurement rather than generic cloud infra. +
+
+ +
+
2) Horizontal lockup
+
+ + + + + + + + + + + + + + + + + + + + + + Agoda.DevExTelemetry + DX Telemetry Manager + + + + +
+
+ Optimized for GitHub headers, internal portals, docs landing pages, and admin screens. The subtitle can be removed where space is limited. +
+
+ +
+
3) Monochrome version
+
+
+ + + + + + + + + + + + + + + + + + + + + +
+
+
+ Clean one-color treatment for CLI docs, stamps, low-ink print, favicons, and GitHub/social avatars where brand color is unavailable. +
+
+ +
+
4) Dark-mode variant
+
+ + + + + + + + + + + + + + + + + + + + + + Agoda.DevExTelemetry + DX Telemetry Manager + + + + +
+
+ Inverted treatment for dashboards, internal portals, terminal-adjacent product UIs, and dark GitHub-themed contexts. Keeps the icon high-contrast without feeling loud. +
+
+ +
+
5) Light-mode variant
+
+ + + + + + + + + + + + + + + + + + + + + + Agoda.DevExTelemetry + DX Telemetry Manager + + + + +
+
+ Primary presentation for README banners, Confluence, internal design docs, and admin screens with light backgrounds. +
+
+ +
+
6) Small-size / favicon check
+
+ + + Scalability preview + + + + + + + + 32×32 favicon/app icon + + + + + + + + README / nav icon + + +
+
+ The simplified tiny-size version keeps only the container, pulse, and terminal datapoint so it remains readable when reduced aggressively. +
+
+
+
+ + diff --git a/src/Clientside/src/assets/dx-telemetry-logo-header.svg b/src/Clientside/src/assets/dx-telemetry-logo-header.svg new file mode 100644 index 0000000..4cd3358 --- /dev/null +++ b/src/Clientside/src/assets/dx-telemetry-logo-header.svg @@ -0,0 +1,28 @@ + + + + + + + + + + + + + + + + + + + + + + + DX Telemetry + Observe, Optimize, Deliver + + + + diff --git a/src/Clientside/src/components/layout/AppShell.spec.tsx b/src/Clientside/src/components/layout/AppShell.spec.tsx index ecf5ab5..5d90504 100644 --- a/src/Clientside/src/components/layout/AppShell.spec.tsx +++ b/src/Clientside/src/components/layout/AppShell.spec.tsx @@ -1,14 +1,14 @@ import { test, expect } from '@playwright/experimental-ct-react'; import { AppShell } from './AppShell'; -test('renders header title', async ({ mount }) => { +test('renders header logo', async ({ mount }) => { const component = await mount(
Content
, { hooksConfig: { enableRouting: true } }, ); - await expect(component.getByText('DX')).toBeVisible(); + await expect(component.getByRole('img', { name: 'DX Telemetry' })).toBeVisible(); }); test('renders all navigation tabs', async ({ mount }) => { diff --git a/src/Clientside/src/components/layout/AppShell.tsx b/src/Clientside/src/components/layout/AppShell.tsx index 8ded11a..7cc9d53 100644 --- a/src/Clientside/src/components/layout/AppShell.tsx +++ b/src/Clientside/src/components/layout/AppShell.tsx @@ -1,6 +1,6 @@ import type { ReactNode } from 'react'; import { useNavigate, useLocation } from 'react-router-dom'; -import logo from '../../DevExSml.png'; +import logo from '../../assets/dx-telemetry-logo-header.svg'; const TABS = [ { name: 'Test Runs', path: '/test-runs' }, @@ -20,9 +20,8 @@ export function AppShell({ children }: AppShellProps) {
-
- DX - DX +
+ DX Telemetry