{"_id":"@backstagerunway/plugin-sleuth-dora","_rev":"3-53721a650e7371aca2c99c28f7b85167","name":"@backstagerunway/plugin-sleuth-dora","dist-tags":{"latest":"0.3.0"},"versions":{"0.1.0":{"name":"@backstagerunway/plugin-sleuth-dora","version":"0.1.0","keywords":["backstage","plugin","dora","metrics","sleuth","frontend"],"license":"Apache-2.0","_id":"@backstagerunway/plugin-sleuth-dora@0.1.0","maintainers":[{"name":"kashkash","email":"mahichr@gmail.com"},{"name":"nitin15j","email":"nitin15j@gmail.com"}],"homepage":"https://github.com/mahichr/backstage-sleuth#readme","bugs":{"url":"https://github.com/mahichr/backstage-sleuth/issues"},"dist":{"shasum":"e6bf3b6d4bd7c556f3ae6a6f7374bd9e2c82ccee","tarball":"https://registry.npmjs.org/@backstagerunway/plugin-sleuth-dora/-/plugin-sleuth-dora-0.1.0.tgz","fileCount":77,"integrity":"sha512-w8Y0A2CevYtUn9o9xc8HUltxW9Wbd/ZgzZlWTaGqMnCJfwfMb8AY7pYzCsIy+qZAQyaWXzUpB9aDAvkvRmXdHA==","signatures":[{"sig":"MEYCIQCF1WDDo14353jYD8iQrEqPrpp+ScqmI2RkHH7HZgFswwIhAO3Iec3NM0ywFQmgkzoBnJJPDkKO4CEJykKqL+L6uQ2h","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":307146},"main":"src/index.ts","types":"src/index.ts","gitHead":"6073245b6e8615407af6917beb96f598ffdd594f","scripts":{"tsc":"tsc","lint":"backstage-cli package lint","test":"backstage-cli package test","build":"backstage-cli package build","clean":"backstage-cli package clean","prepack":"backstage-cli package prepack","postpack":"backstage-cli package postpack"},"_npmUser":{"name":"nitin15j","email":"nitin15j@gmail.com"},"backstage":{"role":"frontend-plugin","pluginId":"sleuth-dora","pluginPackages":["@backstagerunway/plugin-sleuth-dora"]},"repository":{"url":"git+https://github.com/mahichr/backstage-sleuth.git","type":"git","directory":"plugins/sleuth-dora"},"_npmVersion":"11.3.0","description":"A Backstage frontend plugin that provides DORA (DevOps Research and Assessment) metrics visualization with Sleuth.io integration. This plugin offers three different views for different user roles and use cases.","directories":{},"_nodeVersion":"22.15.0","dependencies":{"recharts":"^3.1.2","react-use":"^17.2.4","@types/recharts":"^2.0.1","@backstage/theme":"^0.6.5","@material-ui/lab":"^4.0.0-alpha.61","@material-ui/core":"^4.9.13","@material-ui/icons":"^4.9.1","@backstage/core-components":"^0.17.1","@backstage/core-plugin-api":"^1.10.6"},"publishConfig":{"main":"dist/index.esm.js","types":"dist/index.d.ts","access":"public"},"_hasShrinkwrap":false,"devDependencies":{"msw":"^1.0.0","react":"^16.13.1 || ^17.0.0 || ^18.0.0","@backstage/cli":"^0.32.0","@backstage/dev-utils":"^1.1.9","@backstage/test-utils":"^1.7.7","@testing-library/react":"^14.0.0","@backstage/core-app-api":"^1.16.1","@testing-library/jest-dom":"^6.0.0","@testing-library/user-event":"^14.0.0"},"peerDependencies":{"react":"^16.13.1 || ^17.0.0 || ^18.0.0"},"_npmOperationalInternal":{"tmp":"tmp/plugin-sleuth-dora_0.1.0_1755775623311_0.14664709777291152","host":"s3://npm-registry-packages-npm-production"}},"0.2.0":{"name":"@backstagerunway/plugin-sleuth-dora","version":"0.2.0","keywords":["backstage","plugin","dora","metrics","sleuth","frontend"],"license":"Apache-2.0","_id":"@backstagerunway/plugin-sleuth-dora@0.2.0","maintainers":[{"name":"kashkash","email":"mahichr@gmail.com"},{"name":"nitin15j","email":"nitin15j@gmail.com"}],"homepage":"https://github.com/mahichr/backstage-sleuth#readme","bugs":{"url":"https://github.com/mahichr/backstage-sleuth/issues"},"dist":{"shasum":"c6399c6dd7aa49571bc23cdeed3241d03a039f56","tarball":"https://registry.npmjs.org/@backstagerunway/plugin-sleuth-dora/-/plugin-sleuth-dora-0.2.0.tgz","fileCount":77,"integrity":"sha512-ku3y0nc3hQsP7HfwA/kmiPk3UhYFxxPqdb0JgeqfxYuahGNA6w7tFTnFgnRvTdJzToIL7W95MONejLHFo+0G3w==","signatures":[{"sig":"MEQCIB4Jm1+5JZHD1jwQkOej6i7VUrpU21zaYX5Zen8ze4M7AiBRboqDavxTzjNXWVBlibVCKbu4a8P3VgAZ6yju/PirhQ==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":310694},"main":"src/index.ts","types":"src/index.ts","gitHead":"06e426f71551e4da2f41ffdcf1c3e914cf79d433","scripts":{"tsc":"tsc","lint":"backstage-cli package lint","test":"backstage-cli package test","build":"backstage-cli package build","clean":"backstage-cli package clean","prepack":"backstage-cli package prepack","postpack":"backstage-cli package postpack"},"_npmUser":{"name":"nitin15j","email":"nitin15j@gmail.com"},"backstage":{"role":"frontend-plugin","pluginId":"sleuth-dora","pluginPackages":["@backstagerunway/plugin-sleuth-dora"]},"repository":{"url":"git+https://github.com/mahichr/backstage-sleuth.git","type":"git","directory":"plugins/sleuth-dora"},"_npmVersion":"11.3.0","description":"A Backstage frontend plugin that provides DORA (DevOps Research and Assessment) metrics visualization with Sleuth.io integration. This plugin offers three different views for different user roles and use cases.","directories":{},"_nodeVersion":"22.15.0","dependencies":{"recharts":"^3.1.2","react-use":"^17.2.4","@types/recharts":"^2.0.1","@backstage/theme":"^0.6.5","@material-ui/lab":"^4.0.0-alpha.61","@material-ui/core":"^4.9.13","@material-ui/icons":"^4.9.1","@backstage/core-components":"^0.17.1","@backstage/core-plugin-api":"^1.10.6"},"publishConfig":{"main":"dist/index.esm.js","types":"dist/index.d.ts","access":"public"},"_hasShrinkwrap":false,"devDependencies":{"msw":"^1.0.0","react":"^16.13.1 || ^17.0.0 || ^18.0.0","@backstage/cli":"^0.32.0","@backstage/dev-utils":"^1.1.9","@backstage/test-utils":"^1.7.7","@testing-library/react":"^14.0.0","@backstage/core-app-api":"^1.16.1","@testing-library/jest-dom":"^6.0.0","@testing-library/user-event":"^14.0.0"},"peerDependencies":{"react":"^16.13.1 || ^17.0.0 || ^18.0.0"},"_npmOperationalInternal":{"tmp":"tmp/plugin-sleuth-dora_0.2.0_1756141823486_0.048196032276126566","host":"s3://npm-registry-packages-npm-production"}},"0.3.0":{"name":"@backstagerunway/plugin-sleuth-dora","version":"0.3.0","license":"Apache-2.0","main":"src/index.ts","types":"src/index.ts","publishConfig":{"access":"public","main":"dist/index.esm.js","types":"dist/index.d.ts"},"backstage":{"role":"frontend-plugin","pluginId":"sleuth-dora","pluginPackages":["@backstagerunway/plugin-sleuth-dora"]},"scripts":{"build":"backstage-cli package build","lint":"backstage-cli package lint","test":"backstage-cli package test","clean":"backstage-cli package clean","prepack":"backstage-cli package prepack","postpack":"backstage-cli package postpack","tsc":"tsc"},"dependencies":{"@backstage/core-components":"^0.17.1","@backstage/core-plugin-api":"^1.10.6","@backstage/theme":"^0.6.5","@material-ui/core":"^4.9.13","@material-ui/icons":"^4.9.1","@material-ui/lab":"^4.0.0-alpha.61","@types/recharts":"^2.0.1","react-use":"^17.2.4","recharts":"^3.1.2"},"peerDependencies":{"react":"^16.13.1 || ^17.0.0 || ^18.0.0"},"devDependencies":{"@backstage/cli":"^0.32.0","@backstage/core-app-api":"^1.16.1","@backstage/dev-utils":"^1.1.9","@backstage/test-utils":"^1.7.7","@testing-library/jest-dom":"^6.0.0","@testing-library/react":"^14.0.0","@testing-library/user-event":"^14.0.0","msw":"^1.0.0","react":"^16.13.1 || ^17.0.0 || ^18.0.0"},"configSchema":"config.d.ts","keywords":["backstage","plugin","dora","metrics","sleuth","frontend"],"repository":{"type":"git","url":"git+https://github.com/mahichr/backstage-sleuth.git","directory":"plugins/sleuth-dora"},"_id":"@backstagerunway/plugin-sleuth-dora@0.3.0","gitHead":"e5d858c4c9d9164880d88f91262531096e264f29","description":"A Backstage frontend plugin that provides DORA (DevOps Research and Assessment) metrics visualization with Sleuth.io integration. This plugin offers three different views for different user roles and use cases.","bugs":{"url":"https://github.com/mahichr/backstage-sleuth/issues"},"homepage":"https://github.com/mahichr/backstage-sleuth#readme","_nodeVersion":"22.15.0","_npmVersion":"11.3.0","dist":{"integrity":"sha512-4DNQvpMDrjtmhWCioj+TPUFcpBoa5zbHSDqWNyJRyPctzg4MeSaGG24uLWzqdSHEa9+32ny4qW08p+5m52/yzg==","shasum":"3a05ac4bf642e01d4e71826aedc99b16ee97042a","tarball":"https://registry.npmjs.org/@backstagerunway/plugin-sleuth-dora/-/plugin-sleuth-dora-0.3.0.tgz","fileCount":78,"unpackedSize":313536,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQCFWfZ6ak9Z9YYg7+mGTlhakbg5vMdXr9Qn6LA+wKgABQIgRZEQJUrLKpalEb6yDdbdn4U18InLYZ5njp8mGqLRMF8="}]},"_npmUser":{"name":"nitin15j","email":"nitin15j@gmail.com"},"directories":{},"maintainers":[{"name":"kashkash","email":"mahichr@gmail.com"},{"name":"nitin15j","email":"nitin15j@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/plugin-sleuth-dora_0.3.0_1756827597557_0.08667270150464002"},"_hasShrinkwrap":false}},"time":{"created":"2025-08-21T11:27:03.234Z","modified":"2025-09-02T15:39:57.934Z","0.1.0":"2025-08-21T11:27:03.492Z","0.2.0":"2025-08-25T17:10:23.685Z","0.3.0":"2025-09-02T15:39:57.721Z"},"bugs":{"url":"https://github.com/mahichr/backstage-sleuth/issues"},"license":"Apache-2.0","homepage":"https://github.com/mahichr/backstage-sleuth#readme","keywords":["backstage","plugin","dora","metrics","sleuth","frontend"],"repository":{"type":"git","url":"git+https://github.com/mahichr/backstage-sleuth.git","directory":"plugins/sleuth-dora"},"description":"A Backstage frontend plugin that provides DORA (DevOps Research and Assessment) metrics visualization with Sleuth.io integration. This plugin offers three different views for different user roles and use cases.","maintainers":[{"name":"kashkash","email":"mahichr@gmail.com"},{"name":"nitin15j","email":"nitin15j@gmail.com"}],"readme":"# @backstagerunway/plugin-sleuth-dora\r\n\r\nA Backstage frontend plugin that provides DORA (DevOps Research and Assessment) metrics visualization with Sleuth.io integration. This plugin offers three different views for different user roles and use cases.\r\n\r\n## Features\r\n\r\n- **Executive Dashboard**: High-level organizational DORA metrics and quarterly health overview\r\n- **Lead Dashboard**: Team-focused DORA metrics with team selection and performance tracking\r\n- **Entity Dashboard**: Project-specific DORA metrics embedded in entity pages\r\n- **Time Range Selection**: Configurable time periods for metrics analysis\r\n- **Real-time Data**: Live metrics from Sleuth.io integration\r\n\r\n## Prerequisites\r\n\r\n- A Backstage application with the [@backstagerunway/plugin-sleuth-dora-backend](../dora-backend) installed and configured\r\n- Sleuth.io account with API access\r\n- Proper configuration in `app-config.yaml`\r\n\r\n## Installation\r\n\r\n1. Install the frontend plugin in your app package:\r\n\r\n```bash\r\ncd packages/app\r\nyarn add @backstagerunway/plugin-sleuth-dora\r\n```\r\n\r\n2. Install the backend plugin (required):\r\n\r\n```bash\r\ncd packages/backend\r\nyarn add @backstagerunway/plugin-sleuth-dora-backend\r\n```\r\n\r\n3. Configure the backend plugin in `packages/backend/src/index.ts`:\r\n\r\n```typescript\r\nimport { createBackend } from '@backstage/backend-defaults';\r\n\r\nconst backend = createBackend();\r\n\r\n// Add the DORA backend plugin\r\nbackend.add(import('@backstagerunway/plugin-sleuth-dora-backend'));\r\n\r\nbackend.start();\r\n```\r\n\r\n4. Add configuration to your `app-config.yaml`:\r\n\r\n```yaml\r\ndora:\r\n sleuth:\r\n organizationId: 'your-sleuth-organization-id'\r\n apiKey: 'your-sleuth-api-key-here'\r\n environment: 'production' # Optional (frontend-visible)\r\n # defaultProjectSlug: 'your-default-project' # Optional; used if entity lacks project-slug annotation\r\n # apiUrl is optional - defaults to 'https://app.sleuth.io' if not specified\r\n # apiUrl: 'https://app.sleuth.io'\r\n```\r\n\r\n## Available Views\r\n\r\n### 1. Entity Dashboard (DoraPerformanceComponent)\r\n\r\n**Purpose**: Embeds DORA metrics directly into entity pages for project-specific analysis.\r\n\r\n**Features**:\r\n- Project-specific DORA metrics\r\n- Entity-based filtering\r\n- Time range selection\r\n- Performance trends and insights\r\n- Embeddable component for any entity type\r\n\r\n\r\n*Entity page with Sleuth tab showing project-specific metrics*\r\n\r\n\r\n**Installation**:\r\n\r\n```typescript\r\n// packages/app/src/components/catalog/EntityPage.tsx\r\nimport { DoraPerformanceComponent } from '@backstagerunway/plugin-sleuth-dora/src/plugin';\r\n\r\n// Add the component content\r\nconst sleuthContent = (\r\n \r\n \r\n \r\n \r\n \r\n);\r\n\r\n// Add the route to your entity layout\r\n\r\n {sleuthContent}\r\n\r\n```\r\n\r\n**Entity Configuration**: To use the Entity Dashboard, your entities can use the following annotations:\r\n\r\n```yaml\r\napiVersion: backstage.io/v1alpha1\r\nkind: Component\r\nmetadata:\r\n name: my-component\r\n annotations:\r\n sleuth.io/project-slug: 'your-sleuth-project-slug' # Required, unless managed globally via dora.sleuth.defaultProjectSlug in app-config\r\n sleuth.io/code-deployment-slug: 'my-service' # Optional - defaults to entity name\r\n sleuth.io/environment: 'production' # Optional - defaults to config\r\nspec:\r\n type: service\r\n lifecycle: production\r\n owner: team-a\r\n```\r\n\r\n**Fallback Behavior**:\r\n- If `sleuth.io/project-slug` is not specified, it uses `defaultProjectSlug` from app-config.yaml\r\n- If `sleuth.io/code-deployment-slug` is not specified, it uses the entity's `metadata.name`\r\n- If `sleuth.io/environment` is not specified, it uses the `environment` from app-config.yaml\r\n\r\n### 2. Executive Dashboard (DoraELTPage)\r\n\r\n**Purpose**: Provides executive-level overview of organizational DORA metrics and quarterly health trends.\r\n\r\n**Features**:\r\n- Executive summary with key DORA metrics\r\n- Quarterly health overview\r\n- Organization-wide trend analysis\r\n- Time range selection for historical data\r\n\r\n\r\n*Executive Dashboard showing organizational DORA metrics overview*\r\n\r\n\r\n**Installation**:\r\n\r\n```typescript\r\n// packages/app/src/App.tsx\r\nimport { DoraELTPage } from '@backstagerunway/plugin-sleuth-dora';\r\n\r\n// Add the route\r\n} />\r\n```\r\n\r\n```typescript\r\n// packages/app/src/components/Root/Root.tsx\r\nimport { CreateComponentIcon } from '@backstage/core-components';\r\n\r\n// Add to sidebar navigation\r\n\r\n```\r\n\r\n### 3. Lead Dashboard (DoraLeadPage)\r\n\r\n**Purpose**: Provides team leaders with detailed team performance metrics and the ability to compare teams.\r\n\r\n**Features**:\r\n- Team performance overview\r\n- Team selector for comparing specific teams\r\n- All teams view for comprehensive analysis\r\n- Time range selection\r\n- User team filtering based on Backstage catalog\r\n\r\n\r\n*Team selector dropdown for comparing specific teams*\r\n\r\n\r\n*Team performance overview with metrics comparison*\r\n\r\n**Installation**:\r\n\r\n```typescript\r\n// packages/app/src/App.tsx\r\nimport { DoraLeadPage } from '@backstagerunway/plugin-sleuth-dora';\r\n\r\n// Add the route\r\n} />\r\n```\r\n\r\n```typescript\r\n// packages/app/src/components/Root/Root.tsx\r\nimport { CreateComponentIcon } from '@backstage/core-components';\r\n\r\n// Add to sidebar navigation\r\n\r\n```\r\n\r\n## Complete Setup Example\r\n\r\nHere's a complete example of setting up all three views:\r\n\r\n\r\n*Sidebar navigation showing DORA menu items*\r\n\r\n\r\n### 1. App.tsx Configuration\r\n\r\n```typescript\r\n// packages/app/src/App.tsx\r\nimport { DoraELTPage, DoraLeadPage } from '@backstagerunway/plugin-sleuth-dora';\r\n\r\n// Inside your Routes component\r\n\r\n {/* ... other routes ... */}\r\n } />\r\n } />\r\n\r\n```\r\n\r\n### 2. Root.tsx Configuration\r\n\r\n```typescript\r\n// packages/app/src/components/Root/Root.tsx\r\nimport { CreateComponentIcon } from '@backstage/core-components';\r\n\r\n// Inside your Sidebar component\r\n\r\n\r\n```\r\n\r\n### 3. EntityPage.tsx Configuration\r\n\r\n```typescript\r\n// packages/app/src/components/catalog/EntityPage.tsx\r\nimport { DoraPerformanceComponent } from '@backstagerunway/plugin-sleuth-dora/src/plugin';\r\n\r\n// Add the component content\r\nconst sleuthContent = (\r\n \r\n \r\n \r\n \r\n \r\n);\r\n\r\n// Add the route to your entity layout\r\n\r\n {sleuthContent}\r\n\r\n```\r\n\r\n## Configuration\r\n\r\n### Configuration Precedence (how values are resolved)\r\n\r\nFor values used by the UI, the plugin resolves configuration in this order:\r\n\r\n1. Entity annotations (if an entity is in context)\r\n2. App config (`app-config.yaml`)\r\n3. Built-in defaults\r\n\r\nKeys and their resolution:\r\n- `projectSlug`: `sleuth.io/project-slug` → `dora.sleuth.defaultProjectSlug` → `sleuth`\r\n- `environment`: `sleuth.io/environment` → `dora.sleuth.environment` → `production`\r\n- `codeDeploymentSlug`: `sleuth.io/code-deployment-slug` → entity `metadata.name` (no app-config fallback)\r\n- `defaultTimeRange`: `dora.sleuth.defaultTimeRange` → `last28days`\r\n\r\n### Required Configuration\r\n\r\nThe plugin requires the following configuration in your `app-config.yaml`:\r\n\r\n```yaml\r\ndora:\r\n sleuth:\r\n organizationId: 'your-sleuth-organization-id'\r\n apiKey: 'your-sleuth-api-key-here'\r\n environment: 'production' # Optional (frontend-visible)\r\n defaultProjectSlug: 'your-default-project' # Optional (frontend-visible)\r\n # apiUrl is optional - defaults to 'https://app.sleuth.io' if not specified\r\n # apiUrl: 'https://app.sleuth.io'\r\n```\r\n\r\n### Entity Annotations\r\n\r\nFor the Entity Dashboard to work, your entities can use these annotations:\r\n\r\n```yaml\r\nmetadata:\r\n annotations:\r\n sleuth.io/project-slug: 'your-sleuth-project-slug' # Required\r\n sleuth.io/code-deployment-slug: 'your-service' # Optional - defaults to entity name\r\n sleuth.io/environment: 'production' # Optional - defaults to config\r\n```\r\n\r\n**Fallback Behavior**:\r\n- `sleuth.io/project-slug`: Falls back to `defaultProjectSlug` from app-config.yaml\r\n- `sleuth.io/code-deployment-slug`: Falls back to entity's `metadata.name`\r\n- `sleuth.io/environment`: Falls back to `environment` from app-config.yaml\r\n\r\n### Required vs Optional\r\n\r\n- Mandatory (backend-only):\r\n - `dora.sleuth.organizationId`\r\n - `dora.sleuth.apiKey`\r\n- Optional (frontend-visible):\r\n - `dora.sleuth.environment` (default: `production`)\r\n - `dora.sleuth.defaultProjectSlug` (default: `sleuth`)\r\n - `dora.sleuth.defaultTimeRange` (default: `last28days`)\r\n - `dora.sleuth.apiUrl` (default: `https://app.sleuth.io`)\r\n\r\n## Development\r\n\r\n### Running the Plugin Locally\r\n\r\n1. Clone the repository\r\n2. Install dependencies: `yarn install`\r\n3. Configure your Sleuth.io credentials\r\n4. Start the development server: `yarn start`\r\n\r\n### Testing\r\n\r\n```bash\r\nyarn test\r\n```\r\n\r\n## Troubleshooting\r\n\r\n### Common Issues\r\n\r\n1. **Backend Plugin Not Installed**: Ensure the backend plugin is properly installed and configured\r\n2. **Missing Configuration**: Verify your `app-config.yaml` has the required Sleuth.io configuration\r\n3. **Entity Annotations**: Check that entities have the required `sleuth.io/project-slug` annotation\r\n4. **API Key Issues**: Ensure your Sleuth.io API key is valid and has proper permissions\r\n\r\n### Error Messages\r\n\r\n- **\"No Sleuth project Slug found\"**: Add the `sleuth.io/project-slug` annotation to your entity\r\n- **\"Failed to load metrics\"**: Check your backend configuration and Sleuth.io API credentials\r\n- **\"No teams found\"**: Verify your user has proper team associations in Backstage\r\n","readmeFilename":"README.md"}