paulononato/backstage
1
0
Fork 0
Code Issues Pull Requests Actions 30 Packages Projects Releases Wiki Activity

Merge branch 'backstage:master' into master

Browse Source
This commit is contained in:
Gaurav Pandey
2023-07-11 20:12:56 +02:00
committed by GitHub
parent 35c7cadf15 ba3b7d1782
commit 4b127dc45f
348 changed files with 4397 additions and 341 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.changeset/afraid-windows-rule.md
+5
View File
@@ -0,0 +1,5 @@
---
'@backstage/plugin-search': patch
---
Fixed bug in "View Full Results" link of Search Modal that did not navigate to the full results page.
.changeset/fluffy-readers-own.md
+5
View File
@@ -0,0 +1,5 @@
---
'@backstage/plugin-airbrake-backend': patch
---
Added support for the [new backend system](https://backstage.io/docs/backend-system/)
.changeset/forty-kids-do.md
+5
View File
@@ -0,0 +1,5 @@
---
'@backstage/plugin-airbrake': patch
---
Added documentation for the [new backend system](https://backstage.io/docs/backend-system/)
.changeset/heavy-jeans-refuse.md
+8
View File
@@ -0,0 +1,8 @@
---
'@backstage/cli': patch
'@backstage/cli-node': patch
'@backstage/plugin-devtools-backend': patch
'@backstage/plugin-tech-insights-backend': patch
---
semver upgrade to 7.5.3
.changeset/neat-spiders-glow.md
+5
View File
@@ -0,0 +1,5 @@
---
'@backstage/plugin-scaffolder-backend': patch
---
Indicate the name of the option that is being deprecated in task deprecation warning.
.changeset/popular-icons-doubt.md
+6
View File
@@ -0,0 +1,6 @@
---
'@backstage/plugin-catalog-react': minor
'@backstage/plugin-catalog': minor
---
Tables which use `EntityTableProps` now have an additional `tableOptions` prop which can be used to provide additional table options to these components.
.changeset/pre.json
+21
View File
@@ -231,11 +231,13 @@
"@backstage/plugin-xcmetrics": "0.2.39"
},
"changesets": [
"afraid-windows-rule",
"angry-phones-wash",
"beige-actors-melt",
"chatty-buttons-deny",
"cli-always-yarn-pack-freal",
"cold-hounds-cheat",
"cool-beans-tap",
"cool-starfishes-love",
"create-app-1687867724",
"cuddly-guests-hide",
@@ -243,8 +245,11 @@
"dirty-wasps-draw",
"dull-onions-remember",
"fluffy-frogs-change",
"fluffy-readers-own",
"forty-kids-do",
"fresh-bears-yawn",
"green-otters-wait",
"heavy-jeans-refuse",
"khaki-rocks-do",
"lazy-frogs-destroy",
"lemon-cycles-enjoy",
@@ -252,23 +257,39 @@
"mean-bobcats-taste",
"mighty-pandas-deny",
"mighty-shoes-refuse",
"neat-spiders-glow",
"old-rules-give",
"polite-shrimps-confess",
"popular-crabs-deny",
"popular-icons-doubt",
"popular-kangaroos-accept",
"pretty-apes-know",
"pretty-falcons-drive",
"purple-feet-approve",
"purple-starfishes-design",
"red-cherries-draw",
"renovate-46eac46",
"renovate-739552f",
"renovate-f316d5e",
"rotten-colts-decide",
"seven-pillows-hear",
"shiny-meals-chew",
"short-rabbits-roll",
"silent-oranges-explode",
"silly-chairs-protect",
"silver-balloons-sniff",
"sixty-humans-rescue",
"sour-humans-begin",
"strange-baboons-look",
"sweet-cameras-kick",
"sweet-pots-rescue",
"tame-carpets-smell",
"tender-clouds-promise",
"tender-oranges-change",
"thin-countries-battle",
"tough-flowers-suffer",
"twenty-seas-float",
"wicked-ears-scream",
"yellow-schools-relax",
"young-frogs-burn"
]
.changeset/pretty-falcons-drive.md
+5
View File
@@ -0,0 +1,5 @@
---
'@backstage/plugin-adr-backend': patch
---
Added support for the [new backend system](https://backstage.io/docs/backend-system/)
.changeset/rotten-colts-decide.md
+38
View File
@@ -0,0 +1,38 @@
---
'@backstage/plugin-catalog-backend-module-incremental-ingestion': minor
---
**BREAKING** Allow incremental event handlers to be async; Force event handler
to indicate if it made a change. Instead of returning `null` or `undefined` from an event
handler to indicate no-oop, instead return the value { type: "ignored" }.
**before**
```javascript
import { createDelta, shouldIgnore } from "./my-delta-creater";
eventHandler: {
onEvent(params) {
if (shouldIgnore(params)) {
return;
}
return createDelta(params);
}
}
```
**after**
```javascript
import { createDelta, shouldIgnore } from "./my-delta-creater";
eventHandler: {
async onEvent(params) {
if (shouldIgnore(params) {
return { type: "ignored" };
}
// code to create delta can now be async if needed
return await createDelta(params);
}
}
```
.changeset/silent-oranges-explode.md
+8
View File
@@ -0,0 +1,8 @@
---
'@backstage/plugin-home-react': patch
'@backstage/plugin-home': patch
---
Add possibility to customize the settings widget for different
properties by using the `uiSchema` provided by the json-schema.
More information here: https://rjsf-team.github.io/react-jsonschema-form/docs/api-reference/uiSchema
.changeset/silly-chairs-protect.md
+12
View File
@@ -0,0 +1,12 @@
---
'@backstage/plugin-cost-insights': patch
'@backstage/plugin-user-settings': patch
'@backstage/theme': patch
'@backstage/test-utils': patch
'@backstage/core-plugin-api': patch
'@backstage/core-components': patch
'@backstage/core-app-api': patch
'@backstage/cli': patch
---
Fixing MUI / Material UI references
.changeset/sweet-cameras-kick.md
+5
View File
@@ -0,0 +1,5 @@
---
'@backstage/create-app': patch
---
Updated included Dockerfile to include `g++`. Also updated the comments to note that some of the dependencies are also needed by isolated-vm
.changeset/sweet-pots-rescue.md
+5
View File
@@ -0,0 +1,5 @@
---
'@backstage/core-components': patch
---
Remove zooming in restrictions in the catalog graph
.changeset/tender-oranges-change.md
+6
View File
@@ -0,0 +1,6 @@
---
'@backstage/plugin-adr-common': patch
'@backstage/plugin-adr': patch
---
fixed error with date parsing.
.eslintrc.js
+6 -3
View File
@@ -246,11 +246,14 @@ module.exports = {
1,
{
forbid: [
{ element: 'button', message: 'use MUI <Button> instead' },
{ element: 'p', message: 'use MUI <Typography> instead' },
{
element: 'button',
message: 'use Material UI <Button> instead',
},
{ element: 'p', message: 'use Material UI <Typography> instead' },
{
element: 'span',
message: 'use a MUI <Typography> variant instead',
message: 'use a Material UI <Typography> variant instead',
},
],
},
docs/FAQ.md
+5 -5
View File
@@ -64,8 +64,8 @@ valuable as you grow.
### Our company has a strong design language system/brand that we want to incorporate. Does Backstage support this?
Yes! The Backstage UI is built using Material-UI. With the theming capabilities
of Material-UI, you are able to adapt the interface to your brand guidelines.
Yes! The Backstage UI is built using Material UI. With the theming capabilities
of Material UI, you are able to adapt the interface to your brand guidelines.
## Technical FAQ
@@ -73,11 +73,11 @@ of Material-UI, you are able to adapt the interface to your brand guidelines.
Backstage is a large scale [TypeScript](https://www.typescriptlang.org/)
application whose frontend parts use [React](https://react.dev/) and
[Material-UI](https://mui.com/), while the backend parts use
[Material UI](https://material-ui.com/), while the backend parts use
[Node.js](https://nodejs.org/) and the [Express](https://expressjs.com/)
framework.
### Why Material-UI?
### Why Material UI?
The short answer is that's what we've been using in Backstage internally.
@@ -88,7 +88,7 @@ knew that we would like to use.
It strikes a good balance between power, customizability, and ease of use. A
core focus of Backstage is to make plugin developers productive with as few
hurdles as possible. Material-UI lets plugin makers get going easily with both
hurdles as possible. Material UI lets plugin makers get going easily with both
well-known tech and a large flora of components.
### What is the end-to-end user flow? The happy path story.
docs/api/deprecations.md
+2 -2
View File
@@ -20,12 +20,12 @@ In order to provide more flexibility in what types of themes can be used and how
they are applied, the `theme` property on the `AppTheme` type is being
deprecated and replaced by a `Provider` property instead. The `Provider`
property is a React component that will be mounted at the root of the app
whenever that theme is active. This also removes the tight connection to MUI and
whenever that theme is active. This also removes the tight connection to Material UI and
opens up for other type of themes, and removes the hardcoded usage of
`<CssBaseline>`.
To migrate an existing theme, remove the `theme` property and move it over to a
new `Provider` component, using `ThemeProvider` from MUI to provide the new
new `Provider` component, using `ThemeProvider` from Material UI to provide the new
theme, along with `<CssBaseline>`. For example a theme that currently looks like
this:
docs/auth/microsoft/azure-easyauth.md
+1 -1
View File
@@ -81,7 +81,7 @@ const app = createApp({
components: {
SignInPage: props => {
const configApi = useApi(configApiRef);
if (configApi.getString('auth.environment') !== 'development')
if (configApi.getString('auth.environment') !== 'development') {
return <ProxiedSignInPage {...props} provider="azure-easyauth" />;
}
return (
docs/deployment/docker.md
+26 -10
View File
@@ -37,7 +37,7 @@ The required steps in the host build are to install dependencies with
`yarn install`, generate type definitions using `yarn tsc`, and build the backend
package with `yarn build:backend`.
In a CI workflow it might look something like this:
In a CI workflow it might look something like this, from the root:
```bash
yarn install --frozen-lockfile
@@ -47,7 +47,7 @@ yarn tsc
# Build the backend, which bundles it all up into the packages/backend/dist folder.
# The configuration files here should match the one you use inside the Dockerfile below.
yarn build:backend --config app-config.yaml
yarn build:backend --config ../../app-config.yaml
```
Once the host build is complete, we are ready to build our image. The following
@@ -56,13 +56,18 @@ Once the host build is complete, we are ready to build our image. The following
```Dockerfile
FROM node:16-bullseye-slim
# Install isolate-vm dependencies, these are needed by the @backstage/plugin-scaffolder-backend.
RUN --mount=type=cache,target=/var/cache/apt,sharing=locked \
--mount=type=cache,target=/var/lib/apt,sharing=locked \
apt-get update && \
apt-get install -y --no-install-recommends python3 g++ build-essential && \
yarn config set python /usr/bin/python3
# Install sqlite3 dependencies. You can skip this if you don't use sqlite3 in the image,
# in which case you should also move better-sqlite3 to "devDependencies" in package.json.
RUN --mount=type=cache,target=/var/cache/apt,sharing=locked \
--mount=type=cache,target=/var/lib/apt,sharing=locked \
apt-get update && \
apt-get install -y --no-install-recommends libsqlite3-dev python3 build-essential && \
yarn config set python /usr/bin/python3
apt-get install -y --no-install-recommends libsqlite3-dev
# From here on we use the least-privileged `node` user to run the backend.
USER node
@@ -169,13 +174,19 @@ RUN find packages \! -name "package.json" -mindepth 2 -maxdepth 2 -exec rm -rf {
# Stage 2 - Install dependencies and build packages
FROM node:16-bullseye-slim AS build
# install sqlite3 dependencies
# Install isolate-vm dependencies, these are needed by the @backstage/plugin-scaffolder-backend.
RUN --mount=type=cache,target=/var/cache/apt,sharing=locked \
--mount=type=cache,target=/var/lib/apt,sharing=locked \
apt-get update && \
apt-get install -y --no-install-recommends libsqlite3-dev python3 build-essential && \
apt-get install -y --no-install-recommends python3 g++ build-essential && \
yarn config set python /usr/bin/python3
# Install sqlite3 dependencies. You can skip this if you don't use sqlite3 in the image,
# in which case you should also move better-sqlite3 to "devDependencies" in package.json.
RUN --mount=type=cache,target=/var/cache/apt,sharing=locked \
--mount=type=cache,target=/var/lib/apt,sharing=locked \
apt-get install -y --no-install-recommends libsqlite3-dev
USER node
WORKDIR /app
@@ -200,13 +211,18 @@ RUN mkdir packages/backend/dist/skeleton packages/backend/dist/bundle \
# Stage 3 - Build the actual backend image and install production dependencies
FROM node:16-bullseye-slim
# Install isolate-vm dependencies, these are needed by the @backstage/plugin-scaffolder-backend.
RUN --mount=type=cache,target=/var/cache/apt,sharing=locked \
--mount=type=cache,target=/var/lib/apt,sharing=locked \
apt-get update && \
apt-get install -y --no-install-recommends python3 g++ build-essential && \
yarn config set python /usr/bin/python3
# Install sqlite3 dependencies. You can skip this if you don't use sqlite3 in the image,
# in which case you should also move better-sqlite3 to "devDependencies" in package.json.
RUN --mount=type=cache,target=/var/cache/apt,sharing=locked \
--mount=type=cache,target=/var/lib/apt,sharing=locked \
apt-get update && \
apt-get install -y --no-install-recommends libsqlite3-dev python3 build-essential && \
yarn config set python /usr/bin/python3
apt-get install -y --no-install-recommends libsqlite3-dev
# From here on we use the least-privileged `node` user to run the backend.
USER node
docs/dls/component-design-guidelines.md
+6 -6
View File
@@ -7,7 +7,7 @@ description: Documentation on Design
Be it a new component contribution, or plugin specific components, you'll want
to follow these guidelines. We'll cover the three main subjects that define the
general look and feel of your components, all of which build on top of the
Material-UI theme features:
Material UI theme features:
- Layout
- Color palette
@@ -17,10 +17,10 @@ Material-UI theme features:
Layout refers to how you organize or stack content. Whenever possible, we want
to use Backstage's components (check the [Storybook][1] for a list and demo)
first, and otherwise fall back to Material-UI components (check the [MUI docs][2]).
first, and otherwise fall back to Material UI components (check the [Material UI docs][2]).
If none of these fit your layout needs, then you can build your own components.
However, using HTML+CSS directly is not recommended; it's better to use MUI
However, using HTML+CSS directly is not recommended; it's better to use Material UI
layout components to make your layout theme aware, meaning if someone changes
the theme, your layout would react to those changes without requiring updates
to your code.
@@ -43,13 +43,13 @@ specific styles for that component, that includes paddings, margins and colors.
However when making a component from scratch you'll need to reference the theme
as much as possible, make sure to use the theme's color palette. Most Backstage
components and all MUI components should use the theme's color palette by default,
components and all Material UI components should use the theme's color palette by default,
so unless you need explicit control on the color of a component (say when the
component was designed to use the primary color but you want to use the
secondary color instead), then the easiest way to access the color palette is
to [Override the Component Styles][11] as suggested by Backstage.
It's not a very common use case to override a theme color in a MUI component
It's not a very common use case to override a theme color in a Material UI component
but let's say you have a custom Sidebar component with a Paper component that
highlights its content with a different color for a side menu or something
(usually you use the elevation, but maybe the designer wanted a colorful app).
@@ -78,7 +78,7 @@ which tokens you can use as reference from the compiled theme.
## Typography
Most of the time the components from MUI will use the `<Typography />` component
Most of the time the components from Material UI will use the `<Typography />` component
which will use the theme's typography properties like font family, size, weight
and appropriate color from the palette for the context of that component. This applies for example to
buttons that use white font color for contained buttons, or the respective color
docs/dls/contributing-to-storybook.md
+4 -4
View File
@@ -14,8 +14,8 @@ You'll find our storybook at
[http://backstage.io/storybook](http://backstage.io/storybook).
As noted in the [design introduction](design.md), Backstage's design is based
off of [Material-UI](https://material-ui.com/). Much of the UI elements use
direct Material-UI, while we've also extended and written custom ones to provide
off of [Material UI](https://material-ui.com/). Much of the UI elements use
direct Material UI, while we've also extended and written custom ones to provide
specific functionality.
![Storybook Page](../assets/dls/storybook-page.png)
@@ -27,13 +27,13 @@ copied.
When custom Backstage components are created, they are placed in the
`@backstage/core-components` package and added to the Storybook.
There may be times where an existing Material-UI component (in
There may be times where an existing Material UI component (in
`@material-ui/core`) is sufficient and doesn't need to be wrapped or duplicated.
However, we may want to identify an _opinionated_ way to use that component
inside of Backstage. In these cases, stories showing how to use those existing
components will also be put into our storybook.
When a story example using Material-UI becomes more complex, requiring a
When a story example using Material UI becomes more complex, requiring a
specific set of colors, variants, parameters, etc., it may become a candidate to
be refactored to become a full Backstage core component.
docs/features/software-catalog/index.md
+1 -1
View File
@@ -130,7 +130,7 @@ infrastructure UIs (and incurring additional cognitive overhead each time they
make a context switch), most of these tools can be organized around the entities
in the catalog.
![tools](https://backstage.io/blog/assets/20-05-20/tabs.png)
![tools](https://backstage.io/assets/images/tabs-abfdf72185d3ceb1d92c4237f7f78809.png)
The Backstage platform can be customized by incorporating
[existing open source plugins](https://github.com/backstage/backstage/tree/master/plugins),
docs/getting-started/app-custom-theme.md
+2 -2
View File
@@ -42,7 +42,7 @@ the "Overriding Backstage and Material UI css rules" section below.
You can also create a theme from scratch that matches the `BackstageTheme` type
exported by [`@backstage/theme`](https://www.npmjs.com/package/@backstage/theme).
See the
[Material-UI docs on theming](https://material-ui.com/customization/theming/)
[Material UI docs on theming](https://material-ui.com/customization/theming/)
for more information about how that can be done.
## Using your Custom Theme
@@ -162,7 +162,7 @@ const myTheme = createTheme({
```
For a more complete example of a custom theme including Backstage and
Material-UI component overrides, see the [Aperture
Material UI component overrides, see the [Aperture
theme](https://github.com/backstage/demo/blob/master/packages/app/src/theme/aperture.ts)
from the [Backstage demo site](https://demo.backstage.io).
docs/getting-started/configure-app-with-plugins.md
+1 -1
View File
@@ -84,7 +84,7 @@ For example, if you install the `api-docs` plugin, a matching `SidebarItem`
could be something like this:
```tsx title="packages/app/src/components/Root/Root.tsx"
// Import icon from MUI
// Import icon from Material UI
import ExtensionIcon from '@material-ui/icons/Extension';
// ... inside the AppSidebar component
docs/local-dev/cli-build-system.md
+24 -24
View File
@@ -484,30 +484,30 @@ of the build system, including the bundling, tests, builds, and type checking.
Loaders are always selected based on the file extension. The following is a list
of all supported file extensions:
| Extension | Exports | Purpose |
| ----------- | --------------- | ----------------------------------------------------------------------------- |
| `.ts` | Script Module | TypeScript |
| `.tsx` | Script Module | TypeScript and XML |
| `.js` | Script Module | JavaScript |
| `.jsx` | Script Module | JavaScript and XML |
| `.mjs` | Script Module | ECMAScript Module |
| `.cjs` | Script Module | CommonJS Module |
| `.json` | JSON Data | JSON Data |
| `.yml` | JSON Data | YAML Data |
| `.yaml` | JSON Data | YAML Data |
| `.css` | classes | Style sheet |
| `.eot` | URL Path | Font |
| `.ttf` | URL Path | Font |
| `.woff2` | URL Path | Font |
| `.woff` | URL Path | Font |
| `.bmp` | URL Path | Image |
| `.gif` | URL Path | Image |
| `.jpeg` | URL Path | Image |
| `.jpg` | URL Path | Image |
| `.png` | URL Path | Image |
| `.svg` | URL Path | Image |
| `.md` | URL Path | Markdown File |
| `.icon.svg` | React Component | SVG converted into a [MUI SvgIcon](https://mui.com/components/icons/#svgicon) |
| Extension | Exports | Purpose |
| ----------- | --------------- | -------------------------------------------------------------------------------------- |
| `.ts` | Script Module | TypeScript |
| `.tsx` | Script Module | TypeScript and XML |
| `.js` | Script Module | JavaScript |
| `.jsx` | Script Module | JavaScript and XML |
| `.mjs` | Script Module | ECMAScript Module |
| `.cjs` | Script Module | CommonJS Module |
| `.json` | JSON Data | JSON Data |
| `.yml` | JSON Data | YAML Data |
| `.yaml` | JSON Data | YAML Data |
| `.css` | classes | Style sheet |
| `.eot` | URL Path | Font |
| `.ttf` | URL Path | Font |
| `.woff2` | URL Path | Font |
| `.woff` | URL Path | Font |
| `.bmp` | URL Path | Image |
| `.gif` | URL Path | Image |
| `.jpeg` | URL Path | Image |
| `.jpg` | URL Path | Image |
| `.png` | URL Path | Image |
| `.svg` | URL Path | Image |
| `.md` | URL Path | Markdown File |
| `.icon.svg` | React Component | SVG converted into a [Material UI SvgIcon](https://mui.com/material-ui/icons/#svgicon) |
## Jest Configuration
docs/plugins/plugin-development.md
+1 -1
View File
@@ -16,7 +16,7 @@ browser APIs or by depending on external modules to do the work.
- Consider writing plugins in `TypeScript`.
- Plan the directory structure of your plugin so that it becomes easy to manage.
- Prefer using the [Backstage components](https://backstage.io/storybook),
otherwise go with [Material-UI](https://material-ui.com/).
otherwise go with [Material UI](https://material-ui.com/).
- Check out the shared Backstage APIs before building a new one.
## Plugin concepts / API
docs/plugins/structure-of-a-plugin.md
+1 -1
View File
@@ -93,7 +93,7 @@ next to them you can split up the UI in as many components as you feel like.
We have the `ExampleComponent` to show an example Backstage page component. The
`ExampleFetchComponent` showcases the common task of making an async request to
a public API and plot the response data in a table using Material-UI components.
a public API and plot the response data in a table using Material UI components.
You may tweak these components, rename them and/or replace them completely.
docs/releases/v1.13.0.md
+1 -1
View File
@@ -14,7 +14,7 @@ This release has an important security fix, along with a lot of squashed bugs an
### BREAKING: Removed the `Tabs` core component
The `Tabs` component was removed from `@backstage/core-components`. It was a thin shim that provided very little value and was considered confusing, when the [native Material-UI tabs](https://v4.mui.com/components/tabs/) were already fully usable out of the box. Check out the pull request below for more details.
The `Tabs` component was removed from `@backstage/core-components`. It was a thin shim that provided very little value and was considered confusing, when the [native Material UI tabs](https://v4.mui.com/components/tabs/) were already fully usable out of the box. Check out the pull request below for more details.
Contributed by [@tudi2d](https://github.com/tudi2d) in [#16587](https://github.com/backstage/backstage/pull/16587)
docs/releases/v1.14.0-changelog.md
+2 -2
View File
@@ -599,7 +599,7 @@
- 750e45539ad: Add close button & improve search input.
MUI's Paper wrapping the SearchBar in the SearchPage was removed, we recommend users update their apps accordingly.
Material UI's Paper wrapping the SearchBar in the SearchPage was removed, we recommend users update their apps accordingly.
SearchBarBase's TextField's label support added & aria-label uses label string if present, tests relying on the default placeholder value should still work unless custom placeholder was given.
@@ -641,7 +641,7 @@
- 750e45539ad: Add close button & improve search input.
MUI's Paper wrapping the SearchBar in the SearchPage was removed, we recommend users update their apps accordingly.
Material UI's Paper wrapping the SearchBar in the SearchPage was removed, we recommend users update their apps accordingly.
SearchBarBase's TextField's label support added & aria-label uses label string if present, tests relying on the default placeholder value should still work unless custom placeholder was given.
docs/releases/v1.14.0-next.0-changelog.md
+2 -2
View File
@@ -175,7 +175,7 @@
- 750e45539ad: Add close button & improve search input.
MUI's Paper wrapping the SearchBar in the SearchPage was removed, we recommend users update their apps accordingly.
Material UI's Paper wrapping the SearchBar in the SearchPage was removed, we recommend users update their apps accordingly.
SearchBarBase's TextField's label support added & aria-label uses label string if present, tests relying on the default placeholder value should still work unless custom placeholder was given.
@@ -200,7 +200,7 @@
- 750e45539ad: Add close button & improve search input.
MUI's Paper wrapping the SearchBar in the SearchPage was removed, we recommend users update their apps accordingly.
Material UI's Paper wrapping the SearchBar in the SearchPage was removed, we recommend users update their apps accordingly.
SearchBarBase's TextField's label support added & aria-label uses label string if present, tests relying on the default placeholder value should still work unless custom placeholder was given.
docs/releases/v1.15.0-changelog.md
+9 -9
View File
@@ -4,9 +4,9 @@
### Minor Changes
- 1fd38bc4141a: **MUI v5 Support:** Adding platform-wide support for MUI v5 allowing a transition phase for migrating central plugins & components over. We still support v4 instances & plugins by adding a
- 1fd38bc4141a: **Material UI v5 Support:** Adding platform-wide support for Material UI v5 allowing a transition phase for migrating central plugins & components over. We still support v4 instances & plugins by adding a
To allow the future support of plugins & components using MUI v5 you want to upgrade your `AppTheme`'s to using the `UnifiedThemeProvider`
To allow the future support of plugins & components using Material UI v5 you want to upgrade your `AppTheme`'s to using the `UnifiedThemeProvider`
```diff
Provider: ({ children }) => (
@@ -119,7 +119,7 @@
### Minor Changes
- 1fd38bc4141a: Test App Wrapper is now using `UnifiedThemeProvider` for supporting MUI v5 next to MUI v4 in tests.
- 1fd38bc4141a: Test App Wrapper is now using `UnifiedThemeProvider` for supporting Material UI v5 next to Material UI v4 in tests.
### Patch Changes
@@ -137,9 +137,9 @@
### Minor Changes
- 1fd38bc4141a: **MUI v5 Support:** Adding platform-wide support for MUI v5 allowing a transition phase for migrating central plugins & components over. We still support v4 instances & plugins by adding a
- 1fd38bc4141a: **Material UI v5 Support:** Adding platform-wide support for Material UI v5 allowing a transition phase for migrating central plugins & components over. We still support v4 instances & plugins by adding a
To allow the future support of plugins & components using MUI v5 you want to upgrade your `AppTheme`'s to using the `UnifiedThemeProvider`
To allow the future support of plugins & components using Material UI v5 you want to upgrade your `AppTheme`'s to using the `UnifiedThemeProvider`
```diff
Provider: ({ children }) => (
@@ -445,7 +445,7 @@
- 6b571405f806: `scaffolder/next`: Provide some default template components to `rjsf` to allow for standardization and markdown descriptions
- 4505dc3b4598: `scaffolder/next`: Don't render `TemplateGroups` when there's no results in with search query
- a452bda74d7a: Fixed typescript casting bug for useTemplateParameterSchema hook
- 6b571405f806: `scaffolder/next`: provide a `ScaffolderField` component which is meant to replace some of the `FormControl` components from MUI, making it easier to write `FieldExtensions`.
- 6b571405f806: `scaffolder/next`: provide a `ScaffolderField` component which is meant to replace some of the `FormControl` components from Material UI, making it easier to write `FieldExtensions`.
### Patch Changes
@@ -579,7 +579,7 @@
- 75540599124a: Updated example component for a newly scaffolded app.
- 5d692f72ebfb: Make sure to include a `fetch` environment for `jsdom` in `jest` tests
- 6816352500a7: Add discovery feature to the onboard cli command.
- 20b7da6f1311: Enforcing MUI v5 specific linting to minimize bundle size.
- 20b7da6f1311: Enforcing Material UI v5 specific linting to minimize bundle size.
- Updated dependencies
- @backstage/types@1.1.0
- @backstage/config-loader@1.3.1
@@ -640,7 +640,7 @@
- 4e697e88f0e2: Add resource utilization to Pod Drawer
- 78cbb8ef8aea: Enhance the sidebar item accessibility by using appropriate header semantics.
- 66ae4d8ca380: Added `exact` prop to `SidebarSubmenuItem` which causes it to only highlight if the current location is an exact match.
- 83bdc3a555c1: Replaced usages of `theme.palette.theme.hint` with `theme.palette.text.secondary` as it has been removed in MUI v5
- 83bdc3a555c1: Replaced usages of `theme.palette.theme.hint` with `theme.palette.text.secondary` as it has been removed in Material UI v5
- b4cc4b1415e9: SupportButton auto focus first item when opened.
- e33beb1f2a8e: Make the documentation pages printable (also handy for exporting to PDF)
- Updated dependencies
@@ -854,7 +854,7 @@
### Patch Changes
- 865267a6b934: Updated dependency `@asyncapi/react-component` to `1.0.0-next.48`.
- 83bdc3a555c1: Replaced usages of `theme.palette.theme.hint` with `theme.palette.text.secondary` as it has been removed in MUI v5
- 83bdc3a555c1: Replaced usages of `theme.palette.theme.hint` with `theme.palette.text.secondary` as it has been removed in Material UI v5
- af748a148d52: Add support for OpenAPI Specification (OAS) v3.1.0 using swagger-ui v5.0.0.
- Updated dependencies
- @backstage/core-plugin-api@1.5.2
docs/releases/v1.15.0-next.0-changelog.md
+6 -6
View File
@@ -4,9 +4,9 @@
### Minor Changes
- 1fd38bc4141a: **MUI v5 Support:** Adding platform-wide support for MUI v5 allowing a transition phase for migrating central plugins & components over. We still support v4 instances & plugins by adding a
- 1fd38bc4141a: **Material UI v5 Support:** Adding platform-wide support for Material UI v5 allowing a transition phase for migrating central plugins & components over. We still support v4 instances & plugins by adding a
To allow the future support of plugins & components using MUI v5 you want to upgrade your `AppTheme`'s to using the `UnifiedThemeProvider`
To allow the future support of plugins & components using Material UI v5 you want to upgrade your `AppTheme`'s to using the `UnifiedThemeProvider`
```diff
Provider: ({ children }) => (
@@ -30,7 +30,7 @@
### Minor Changes
- 1fd38bc4141a: Test App Wrapper is now using `UnifiedThemeProvider` for supporting MUI v5 next to MUI v4 in tests.
- 1fd38bc4141a: Test App Wrapper is now using `UnifiedThemeProvider` for supporting Material UI v5 next to Material UI v4 in tests.
### Patch Changes
@@ -47,9 +47,9 @@
### Minor Changes
- 1fd38bc4141a: **MUI v5 Support:** Adding platform-wide support for MUI v5 allowing a transition phase for migrating central plugins & components over. We still support v4 instances & plugins by adding a
- 1fd38bc4141a: **Material UI v5 Support:** Adding platform-wide support for Material UI v5 allowing a transition phase for migrating central plugins & components over. We still support v4 instances & plugins by adding a
To allow the future support of plugins & components using MUI v5 you want to upgrade your `AppTheme`'s to using the `UnifiedThemeProvider`
To allow the future support of plugins & components using Material UI v5 you want to upgrade your `AppTheme`'s to using the `UnifiedThemeProvider`
```diff
Provider: ({ children }) => (
@@ -234,7 +234,7 @@
### Patch Changes
- 20b7da6f1311: Enforcing MUI v5 specific linting to minimize bundle size.
- 20b7da6f1311: Enforcing Material UI v5 specific linting to minimize bundle size.
- Updated dependencies
- @backstage/config-loader@1.3.1-next.0
- @backstage/config@1.0.7
docs/releases/v1.15.0-next.1-changelog.md
+3 -3
View File
@@ -130,7 +130,7 @@
- 6b571405f806: `scaffolder/next`: Provide some default template components to `rjsf` to allow for standardization and markdown descriptions
- 4505dc3b4598: `scaffolder/next`: Don't render `TemplateGroups` when there's no results in with search query
- 6b571405f806: `scaffolder/next`: provide a `ScaffolderField` component which is meant to replace some of the `FormControl` components from MUI, making it easier to write `FieldExtensions`.
- 6b571405f806: `scaffolder/next`: provide a `ScaffolderField` component which is meant to replace some of the `FormControl` components from Material UI, making it easier to write `FieldExtensions`.
### Patch Changes
@@ -279,7 +279,7 @@
### Patch Changes
- 83bdc3a555c1: Replaced usages of `theme.palette.theme.hint` with `theme.palette.text.secondary` as it has been removed in MUI v5
- 83bdc3a555c1: Replaced usages of `theme.palette.theme.hint` with `theme.palette.text.secondary` as it has been removed in Material UI v5
- Updated dependencies
- @backstage/errors@1.2.0-next.0
- @backstage/core-plugin-api@1.5.2-next.0
@@ -479,7 +479,7 @@
### Patch Changes
- 83bdc3a555c1: Replaced usages of `theme.palette.theme.hint` with `theme.palette.text.secondary` as it has been removed in MUI v5
- 83bdc3a555c1: Replaced usages of `theme.palette.theme.hint` with `theme.palette.text.secondary` as it has been removed in Material UI v5
- Updated dependencies
- @backstage/plugin-catalog@1.11.1-next.1
- @backstage/core-components@0.13.2-next.1
docs/releases/v1.15.0.md
+2 -2
View File
@@ -72,10 +72,10 @@ for details and installation instructions.
Contributed by [@alde](https://github.com/alde) in
[#17828](https://github.com/backstage/backstage/pull/17828)
### More movement toward Material-UI v5 and React v18 compatibility
### More movement toward Material UI v5 and React v18 compatibility
There have been some tweaks here or there to types and the theme system to
ensure a smooth future migration toward Material-UI version 5. This should be
ensure a smooth future migration toward Material UI version 5. This should be
mostly transparent to adopters, but please let us know if you encounter any
oddities around the theme system after upgrading to this release.
docs/releases/v1.16.0-next.2-changelog.md
+1728
View File
File diff suppressed because it is too large Load Diff
docs/releases/v1.9.0-changelog.md
+2 -2
View File
@@ -995,7 +995,7 @@
- 64a579a998: Add items prop to SupportButton. This prop can be used to override the items that would otherwise be grabbed from the config.
- 5d3058355d: Add `react/forbid-elements` linter rule for button, suggest MUI `Button`
- 5d3058355d: Add `react/forbid-elements` linter rule for button, suggest Material UI `Button`
- 3280711113: Updated dependency `msw` to `^0.49.0`.
@@ -2804,7 +2804,7 @@
- d3fea4ae0a: Internal fixes to avoid implicit usage of globals
- 2e701b3796: Internal refactor to use `react-router-dom` rather than `react-router`.
- a19cffbeed: Update search links to only have header as linkable text
- 5d3058355d: Add `react/forbid-elements` linter rule for button, suggest MUI `Button`
- 5d3058355d: Add `react/forbid-elements` linter rule for button, suggest Material UI `Button`
- 3280711113: Updated dependency `msw` to `^0.49.0`.
- 786f1b1419: Support older versions of react-router
- Updated dependencies
docs/tutorials/migrating-away-from-core.md
+2 -2
View File
@@ -128,11 +128,11 @@ old usages by the `string` type.
### Constrained `IconComponent` type
The `IconComponent` type used to allow all of the props from the MUI `SvgIcon`.
The `IconComponent` type used to allow all of the props from the Material UI `SvgIcon`.
This encouraged some bad patterns in open source plugins such as applying colors
to the icons, which in turn hurt the ability to replace the icons with custom
ones. The `IconComponent` type, which is now exported from
`@backstage/core-plugin-api`, now only accepts a `fontSize` prop used to set the
size of the icon. The type is compatible with the MUI `SvgIcon`, but there may
size of the icon. The type is compatible with the Material UI `SvgIcon`, but there may
be situations where an icon needs an explicit cast to `IconComponent` in order
to narrow the type.
microsite/blog/2021-06-22-spotify-backstage-is-growing.mdx
+1 -1
View File
@@ -55,7 +55,7 @@ We will continue to post important product announcements, technical documentatio
[![Backstage Community Sessions, hosted by Spotify](assets/21-06-22/backstage-community-sessions.png)](https://github.com/backstage/community/#backstage-community)
Earlier this year, we began hosting [Backstage Community Sessions](https://github.com/backstage/community/#backstage-community) — official meetups for anyone who wanted to join them. Since [the very first one](https://youtu.be/4-VX9tDdJYY), the Backstage team has been inspired and humbled by the community’s participation in these sessions — from hearing the [Expedia Group team share their journey adopting Backstage](https://youtu.be/rRphwXeq33Q?t=1509) to discussions about TypeScript and Material-UI. It’s great collaborating through code — but it’s also a lot of fun when you can see each other’s faces and have a conversation.
Earlier this year, we began hosting [Backstage Community Sessions](https://github.com/backstage/community/#backstage-community) — official meetups for anyone who wanted to join them. Since [the very first one](https://youtu.be/4-VX9tDdJYY), the Backstage team has been inspired and humbled by the community’s participation in these sessions — from hearing the [Expedia Group team share their journey adopting Backstage](https://youtu.be/rRphwXeq33Q?t=1509) to discussions about TypeScript and Material UI. It’s great collaborating through code — but it’s also a lot of fun when you can see each other’s faces and have a conversation.
And while these sessions have been a success, the feedback we’ve gotten from the community has been very clear: more frequent and more focused conversations. So, later this summer, we’ll be launching standalone Backstage Adopter Sessions and Backstage Contributor Sessions. We hope this will lead to more useful sessions for everyone — and, of course, you are welcome to attend either or both:
microsite/blog/2023-07-08-stash-adopter-post.mdx
+189
View File
@@ -0,0 +1,189 @@
---
# prettier-ignore
title: "Adopter Spotlight: How Stash simplified monitoring, ownership and true app health with microservices"
author: Taylor Webber, Staff Engineer, Stash
---
![backstage header](assets/2023-07-08/banner.png)
**TL;DR**: Monitoring the health of a software application goes beyond surfacing API errors and customer-facing issues. It requires a comprehensive understanding of every facet of a service, including process metrics like DORA, as well as clear ownership of services and processes. By implementing Elevate as an internal developer portal, development teams now have better visibility of ownership in the distributed systems they work in. They also have the benefit of consolidated application health data and other metrics gained from the SaaS products they utilize everyday. This approach ensures a “single pane of glass” for application ownership and health so our teams can focus on building products and features that help our customers invest for a prosperous future.
{/* truncate */}
At [Stash](stash.com), our mission is to give people the confidence to invest for a better life. Our app simplifies investing for the middle class who may be less experienced with traditional investing and retirement planning. Our customers trust us with their money, and with that, rely on us to provide a responsive and quality experience that works every time.
It isn't revolutionary to say that monitoring the health of a software application is critical for ensuring its reliability and performance in service of customers' needs. However, in a distributed architecture like microservices, tracking ownership and monitoring application health across the system quickly becomes complex. The difficulties are further compounded when leveraging multiple SaaS products, which is common in modern development but specifically so for fintechs like Stash that integrate best-of-breed software in novel ways, as we do across our platform.
What we found is that there are ways to make sense of these complex systems by tracking DevOps Research and Assessment (DORA) metrics for applications and leveraging SaaS products to create a central hub to understand the _true_ health of an application.
In this post, I'll walk you through Stash's journey to create Elevate, our Internal Developer Portal (IDP) based on the open source [Backstage](https://backstage.io/) framework. Our portal increased visibility of application health metrics, prioritized cloud cost insights, and reduced the context switching required for teams to understand service ownership and the components that make up the entirety of Stash's world-class application systems.
Elevate enables effective monitoring, streamlined incident response, improved overall application health, and most importantly, team health.
# Setting the monitoring/DORA scene
It seems counterintuitive, but trying to solve the problem of monitoring and tracking ownership with a traditional centralized approach and more SaaS monitoring tools will likely not solve the problem.
Traditional centralized monitoring approaches may not suffice in a distributed architecture due to services that may act as pass-throughs or services that call many other services to aggregate data or tasks. In traditional monitoring, you will only see the error rates and request logging for individual services. That will only ever show you part of the puzzle as you'll still be unable to trace a request from a frontend application, through your many service layers to your data stores and back out.
Utilizing multiple SaaS products for service monitoring and observability during development introduces additional complexity; each product may have its own dashboard and reporting tools. These implementation differences can make it difficult to consolidate and gain a holistic view of the application's health.
Picking the right tool for the job can make developing quality products at speed and scale easier, but what we've learned is that utilizing each tool's context for application health as a piece of the puzzle has exponentially impacted our team's effectiveness.
The team at Stash took an approach of enhanced monitoring which required introducing request tracing for services that a team owns (and the entire org) to get the full picture. We worked to distribute monitoring **_across_** services, capturing both customer-facing issues and internal process metrics that focus on service quality.
We also took a hard look at our health metrics. Some attributes of healthy applications are high availability, HTTP 500 errors are minimal, CPU and memory usage are sustainable, and the “/health” endpoint returns the health of the application. However, to gain insights into the true health of an application and the teams supporting it, tracking DORA metrics is essential.
We took four key DORA metrics — deployment frequency, lead time for changes, mean time to restore, and change failure rate — to process aspects of services and provide a comprehensive understanding of an application's overall health as well as the health of our team and organization.
# Understanding complex systems at Stash with Backstage
At Stash, we use a multitude of SaaS tools during the software development process, some of which provide varying degrees of built-in service catalogs. With many sources of truth and a lack of ability to combine data from multiple sources (eg. FireHydrant incident response with DataDog or DataDog Real User Monitoring data in PagerDuty, etc.) it was challenging to get a holistic view of the whole system..
Additionally, as we created more and more microservices, it became challenging to determine ownership for each service. Microservice owners were finding it increasingly difficult to keep track of their various consumers to assure that contracts were being maintained as new changes were introduced. Ownership clarity was **_crucial_** to our goals for effective monitoring, issue resolution, and maintaining accountability.
To consolidate application health data, simplify support and clarify ownership for those on development teams as well as for those in non-engineering roles, we implemented an instance of Backstage as an internal service catalog we call Elevate.
Utilizing Backstage as a framework, Elevate aims to improve quality and domain expertise for all things code and process at Stash. The key to accomplishing this goal is to leverage the processes and integrations we already use at Stash, but centralize and surface the data in a way that is digestible for engineers and non-engineers alike.
For the benefit of a self-managed internal service catalog to outweigh the change in processes and the cost of the catalog's infrastructure, it had to be easy to adopt and have an enlightening effect on teams.
## Ownership visibility
Elevate acts as a centralized hub for registering services, documenting ownership information, and establishing clear accountability. It provides a holistic view of distributed systems and the shared modules and libraries they use by making it easier to track ownership and ensure effective communication and collaboration.
The Backstage [Software Catalog](https://backstage.io/docs/features/software-catalog/) model allows service-level tracking, as well as dashboards for Groups (teams or squads), Systems (business units or focus areas), Domains (organization units) or even company wide.
### Easy adoption and catalog usage
The Backstage open source plugins provide the nuts and bolts for our internal service catalog functionality. Backstage's community plugins assist with the basics of catalog management. They also allow for dynamically changing the type content based on which entry is being viewed in the catalog (library, service, API, team, etc.). Each view can be custom-tailored with the information for that type of entry, which allows for shared libraries to have an overview page focused on getting engineers to documentation; while the overview page for a deployed service can focus on the current incident status and on-call information as the most important thing. The plugin for searching allows for easy discovery of items or documentation throughout the catalog.
###### Example catalog-info.yaml file to add service to Elevate
```yaml
apiVersion: backstage.io/v1alpha1
kind: Component
metadata:
name: your-service
description: Awesome service for awesome things
annotations:
backstage.io/kubernetes-namespace: your-service
datadoghq.com/site: datadoghq.com
datadoghq.com/dashboard-url: https://p.datadoghq.com/some-dashbaord
firehydrant.com/service-name: your-service
jira/project-key: your-jira-project
github.com/project-slug: 'your-org/your-service'
pagerduty.com/service-id: your-pagerduty-service-id
links:
- title: Team Slack Channel
url: https://your-company.slack.com/archives/your-slack-channel-id
type: Slack
icon: chat
- title: Getting started
url: https://github.com/your-org/your-service/blob/main/README.md
type: Readme
icon: github
- title: Confluence
url: https://your-company.atlassian.net/your-docs-page-url
type: Confluence
icon: docs
spec:
type: service
lifecycle: production
owner: your-team
system: your-business-unit
```
### Connecting to subject matter experts
Elevate leverages the CODEOWNERS integration to establish expertise of specific codebases within services and ensure accountability and clarity within the development teams. Codespace ownership is typically defined with required reviewers by code owners and admins that provide additional support, but the CODEOWNERS plugin allows for clarity into who the subject matter expert of the codebase is, not just the administrative owner. The plugin also displays recent changes that have been merged into the codebase, including the authors and approvers of the changes and other valuable metadata.
This improved clarity into contributors and recent contributions can prevent developers and managers from playing telephone when effective communication is crucial to fixing a bug or resolving an incident.
![service code owners](assets/2023-07-08/image5.png)
![recent changes](assets/2023-07-08/image3.png)
_CODEOWNER cards for service ownership and recent changes that appear on a service's overview page._
## Integration with SaaS products
Backstage offers a catalog of integrations with many popular SaaS products. With Elevate, we've integrated plugins for monitoring infrastructure and user experience, visualizing process backlog and bottlenecks, as well as giving insights into data that teams have not yet been able to see for services they support. These integrations allow for seamless data collection and aggregation, transforming Elevate into the centralized hub for application and team health data.
The key to making your service catalog scalable is to ensure you aren't requiring the duplication of data away from its source; Elevate utilizes dashboards and charts to view the data stored in the remote sources. When aggregating DORA metrics we are able to leverage our SaaS tools API within Elevate's service layer to pull data and transform it for our custom dashboards.
### Visible cohesive monitoring
At Stash, we collect performance metrics, resource utilization, and proactive alerts with DataDog and Sentry; these tools can also monitor and track API errors and customer-facing issues that would normally go undetected. To deliver the best possible experience for Stash's customers, engineers need to be able to easily monitor errors on customer devices to solve issues before they are reported.
Sentry's plugin easily surfaces uncaught errors within services. DataDog's plugin allows for plug-and-play visualizations of charts or graphs to help support services, teams and beyond. Elevate integrates these insights to monitor the overall health of the application.
### Centralized incident management
PagerDuty has been Stash's standard for on-call activities and paging while FireHydrant has more recently been adopted as a part of a more comprehensive incident management process. Together, we use these incident management platforms to establish incident response workflows and communication channels dedicated to each service.
PagerDuty's plugin allows for quick reference to the individual who is actively on-call for a service while FireHydrant's plugin lets you track open incidents that may be impacting a service and even trigger new incidents directly from within the service overview page in Elevate. Integrating these plugins allows Elevate to serve as a centralized location for the incident management process, helping our engineers quickly gather the necessary context of an issue and drive faster resolution.
![active incidents](assets/2023-07-08/image1.png)
![pager duty](assets/2023-07-08/image8.png)
_FireHydrant and PagerDuty cards that appear on a service's overview page._
## Infrastructure cost insights across all systems
It's difficult for teams to be more efficient with their infrastructure costs if they are unable to see the problem areas for the services they support, as well as references for effective resource management to model after. The AWS Cost Insights plugin allows Elevate to monitor cost-related metrics and ensure efficient resource allocation and budgeting.
Due to the dynamic nature of how different companies may want to aggregate their cost data, the plugin is mostly frontend visualizations for displaying costs over time with drop-downs for filtering and grouping. In Elevate, we created a custom backend plugin to pull our costs data from AWS and group it properly for presentation to the visualizations.
When we surface this data with the backend layer in Elevate, the frontend is able to surface our AWS cost data to people who previously didn't have access or who found it too difficult to use the more complex AWS Cost Explorer.
In addition to these people now having access to AWS cost data, those with access now get to visualize our spend by AWS product and Stash service. These visualizations are available when looking at a single service, a team or business unit, and organization-wide.
![aws breakdown](assets/2023-07-08/image6.png)
_Breakdown of costs per AWS product for a service._
![aws breakdown by project](assets/2023-07-08/image9.png)
_Breakdown of total costs per service owned by a Team or Business Unit._
![aws breakdown for org](assets/2023-07-08/image4.png)
_Breakdown of total costs per service across the organization._
For those that aren't regularly in AWS Cost Explorer, a benefit of implementing these visualizations is being able to easily see where we have some room for improvement when it comes to tagging our AWS resources. The company-wide breakdown shows all resources, whereas the sub-views rely on resource tagging for service name and team name, so discrepancies may arise which will help you close any gaps in tagging you may have. If resources are not properly tagged, reducing and managing your infrastructure costs will be more time consuming than necessary and much less effective.
## Service, team and organizational health
As mentioned above, gathering DORA metrics provides important insight into the health of applications and teams, but until we built Elevate, we didn't have a hub at Stash to aggregate and present that data in an easily digestible manner.
Elevate's initial DORA metrics implementation reaches out to the source(s) of truth for each metric and groups and surfaces that in a manner similar to the AWS Cost Insights implementation.
**Deployment Frequency** from DataDog “deployment” indicator for each service
**Lead Time for Changes** from GitHub for each repo using commit sha's and releases
**Mean Time to Restore** from FireHydrant using their MTTR API for each service
**Change Failure Rate** from DataDog and FireHydrant for each service
Elevate implemented the above data sources for our DORA metrics MVP as those have been determined as our best practices for where that information should be tracked, for now.
![dora metrics](assets/2023-07-08/image10.png)
_DORA metrics that display on the overview page for each service._
Software development has an ever-changing SaaS landscape, so what serves as a best practice today, may not be in a week, a month or a year from now. The tools we use to facilitate a task or automate processes may change, but the metrics we want to track (DORA and others) are much more stable. Surfacing data in easily consumable views within Elevate has decoupled the tool we use to accomplish a task from where we monitor the health of our system and how that tool assists.
![dora metrics typescript interface](assets/2023-07-08/image7.png)
_An abstracted service layer that is agnostic of data source(s) allows for a stable integration for our frontend dashboards._
![backend interface](assets/2023-07-08/image2.png)
_Separate backend services by metric allow for easy updating for additional or new data sources in the future._
# tl;dr
Monitoring the health of a software application goes beyond surfacing API errors and customer-facing issues. It requires a comprehensive understanding of every facet of a service, including process metrics like DORA, as well as clear ownership of services and processes. By implementing Elevate as an internal developer portal, development teams now have better visibility of ownership in the distributed systems they work in. They also have the benefit of consolidated application health data and other metrics gained from the SaaS products they utilize everyday. This approach ensures a “single pane of glass” for application ownership and health so our teams can focus on building products and features that help our customers invest for a prosperous future.
microsite/blog/assets/2023-07-08/banner.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 39 KiB

microsite/blog/assets/2023-07-08/image1.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 120 KiB

microsite/blog/assets/2023-07-08/image10.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 36 KiB

microsite/blog/assets/2023-07-08/image2.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 67 KiB

microsite/blog/assets/2023-07-08/image3.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 275 KiB

microsite/blog/assets/2023-07-08/image4.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 239 KiB

microsite/blog/assets/2023-07-08/image5.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 143 KiB

microsite/blog/assets/2023-07-08/image6.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 198 KiB

microsite/blog/assets/2023-07-08/image7.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 56 KiB

microsite/blog/assets/2023-07-08/image8.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 142 KiB

microsite/blog/assets/2023-07-08/image9.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 204 KiB

package.json
+2 -2
View File
@@ -47,7 +47,7 @@
"@types/react": "^17",
"@types/react-dom": "^17"
},
"version": "1.16.0-next.1",
"version": "1.16.0-next.2",
"dependencies": {
"@backstage/errors": "workspace:^",
"@manypkg/get-packages": "^1.1.3"
@@ -78,7 +78,7 @@
"minimist": "^1.2.5",
"node-gyp": "^9.4.0",
"prettier": "^2.2.1",
"semver": "^7.3.2",
"semver": "^7.5.3",
"shx": "^0.3.2",
"ts-node": "^10.4.0",
"typescript": "~5.0.0"
packages/app-defaults/CHANGELOG.md
+15 -4
View File
@@ -1,5 +1,16 @@
# @backstage/app-defaults
## 1.4.1-next.2
### Patch Changes
- Updated dependencies
- @backstage/theme@0.4.1-next.1
- @backstage/core-plugin-api@1.5.3-next.1
- @backstage/core-components@0.13.3-next.2
- @backstage/core-app-api@1.8.2-next.1
- @backstage/plugin-permission-react@0.4.14-next.2
## 1.4.1-next.1
### Patch Changes
@@ -26,9 +37,9 @@
### Minor Changes
- 1fd38bc4141a: **MUI v5 Support:** Adding platform-wide support for MUI v5 allowing a transition phase for migrating central plugins & components over. We still support v4 instances & plugins by adding a
- 1fd38bc4141a: **Material UI v5 Support:** Adding platform-wide support for Material UI v5 allowing a transition phase for migrating central plugins & components over. We still support v4 instances & plugins by adding a
To allow the future support of plugins & components using MUI v5 you want to upgrade your `AppTheme`'s to using the `UnifiedThemeProvider`
To allow the future support of plugins & components using Material UI v5 you want to upgrade your `AppTheme`'s to using the `UnifiedThemeProvider`
```diff
Provider: ({ children }) => (
@@ -85,9 +96,9 @@
### Minor Changes
- 1fd38bc4141a: **MUI v5 Support:** Adding platform-wide support for MUI v5 allowing a transition phase for migrating central plugins & components over. We still support v4 instances & plugins by adding a
- 1fd38bc4141a: **Material UI v5 Support:** Adding platform-wide support for Material UI v5 allowing a transition phase for migrating central plugins & components over. We still support v4 instances & plugins by adding a
To allow the future support of plugins & components using MUI v5 you want to upgrade your `AppTheme`'s to using the `UnifiedThemeProvider`
To allow the future support of plugins & components using Material UI v5 you want to upgrade your `AppTheme`'s to using the `UnifiedThemeProvider`
```diff
Provider: ({ children }) => (
packages/app-defaults/package.json
+1 -1
View File
@@ -1,7 +1,7 @@
{
"name": "@backstage/app-defaults",
"description": "Provides the default wiring of a Backstage App",
"version": "1.4.1-next.1",
"version": "1.4.1-next.2",
"publishConfig": {
"access": "public",
"main": "dist/index.esm.js",
packages/app/CHANGELOG.md
+75
View File
@@ -1,5 +1,80 @@
# example-app
## 0.2.85-next.2
### Patch Changes
- Updated dependencies
- @backstage/plugin-search@1.3.3-next.2
- @backstage/plugin-airbrake@0.3.20-next.2
- @backstage/cli@0.22.9-next.1
- @backstage/plugin-catalog-react@1.8.0-next.2
- @backstage/plugin-home@0.5.4-next.2
- @backstage/plugin-cost-insights@0.12.9-next.2
- @backstage/plugin-user-settings@0.7.5-next.2
- @backstage/theme@0.4.1-next.1
- @backstage/core-plugin-api@1.5.3-next.1
- @backstage/core-components@0.13.3-next.2
- @backstage/core-app-api@1.8.2-next.1
- @backstage/plugin-kubernetes@0.9.3-next.2
- @backstage/plugin-adr@0.6.3-next.2
- @backstage/app-defaults@1.4.1-next.2
- @backstage/catalog-model@1.4.1-next.0
- @backstage/config@1.0.8
- @backstage/integration-react@1.1.15-next.2
- @backstage/plugin-apache-airflow@0.2.13-next.2
- @backstage/plugin-api-docs@0.9.6-next.2
- @backstage/plugin-azure-devops@0.3.2-next.2
- @backstage/plugin-azure-sites@0.1.9-next.2
- @backstage/plugin-badges@0.2.44-next.2
- @backstage/plugin-catalog-common@1.0.15-next.0
- @backstage/plugin-catalog-graph@0.2.32-next.2
- @backstage/plugin-catalog-import@0.9.10-next.2
- @backstage/plugin-catalog-unprocessed-entities@0.1.1-next.2
- @backstage/plugin-circleci@0.3.20-next.2
- @backstage/plugin-cloudbuild@0.3.20-next.2
- @backstage/plugin-code-coverage@0.2.13-next.2
- @backstage/plugin-devtools@0.1.2-next.2
- @backstage/plugin-dynatrace@7.0.0-next.2
- @backstage/plugin-entity-feedback@0.2.3-next.2
- @backstage/plugin-explore@0.4.6-next.2
- @backstage/plugin-gcalendar@0.3.16-next.2
- @backstage/plugin-gcp-projects@0.3.39-next.2
- @backstage/plugin-github-actions@0.6.1-next.2
- @backstage/plugin-gocd@0.1.26-next.2
- @backstage/plugin-graphiql@0.2.52-next.2
- @backstage/plugin-jenkins@0.8.2-next.2
- @backstage/plugin-kafka@0.3.20-next.2
- @backstage/plugin-lighthouse@0.4.5-next.2
- @backstage/plugin-linguist@0.1.5-next.2
- @backstage/plugin-linguist-common@0.1.0
- @backstage/plugin-microsoft-calendar@0.1.5-next.2
- @backstage/plugin-newrelic@0.3.38-next.2
- @backstage/plugin-newrelic-dashboard@0.2.13-next.2
- @backstage/plugin-nomad@0.1.1-next.2
- @backstage/plugin-octopus-deploy@0.2.2-next.2
- @backstage/plugin-org@0.6.10-next.2
- @backstage/plugin-pagerduty@0.6.1-next.2
- @backstage/plugin-permission-react@0.4.14-next.2
- @backstage/plugin-playlist@0.1.12-next.2
- @backstage/plugin-puppetdb@0.1.3-next.2
- @backstage/plugin-rollbar@0.4.20-next.2
- @backstage/plugin-scaffolder@1.14.1-next.2
- @backstage/plugin-scaffolder-react@1.5.1-next.2
- @backstage/plugin-search-common@1.2.5-next.0
- @backstage/plugin-search-react@1.6.3-next.2
- @backstage/plugin-sentry@0.5.5-next.2
- @backstage/plugin-shortcuts@0.3.12-next.2
- @backstage/plugin-stack-overflow@0.1.18-next.2
- @backstage/plugin-stackstorm@0.1.4-next.2
- @backstage/plugin-tech-insights@0.3.12-next.2
- @backstage/plugin-tech-radar@0.6.6-next.2
- @backstage/plugin-techdocs@1.6.5-next.2
- @backstage/plugin-techdocs-module-addons-contrib@1.0.15-next.2
- @backstage/plugin-techdocs-react@1.1.8-next.2
- @backstage/plugin-todo@0.2.22-next.2
- @internal/plugin-catalog-customized@0.0.12-next.2
## 0.2.85-next.1
### Patch Changes
packages/app/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "example-app",
"version": "0.2.85-next.1",
"version": "0.2.85-next.2",
"private": true,
"backstage": {
"role": "frontend"
packages/backend-next/CHANGELOG.md
+30
View File
@@ -1,5 +1,35 @@
# example-backend-next
## 0.0.13-next.2
### Patch Changes
- Updated dependencies
- @backstage/plugin-devtools-backend@0.1.2-next.2
- @backstage/plugin-scaffolder-backend@1.15.1-next.1
- @backstage/plugin-kubernetes-backend@0.11.2-next.2
- @backstage/plugin-adr-backend@0.3.5-next.1
- @backstage/backend-defaults@0.1.12-next.0
- @backstage/backend-tasks@0.5.4-next.0
- @backstage/plugin-app-backend@0.3.47-next.0
- @backstage/plugin-auth-node@0.2.16-next.0
- @backstage/plugin-azure-devops-backend@0.3.26-next.1
- @backstage/plugin-badges-backend@0.2.2-next.1
- @backstage/plugin-catalog-backend@1.11.0-next.0
- @backstage/plugin-catalog-backend-module-unprocessed@0.1.1-next.0
- @backstage/plugin-entity-feedback-backend@0.1.5-next.0
- @backstage/plugin-linguist-backend@0.3.1-next.1
- @backstage/plugin-permission-backend@0.5.22-next.0
- @backstage/plugin-permission-common@0.7.7-next.0
- @backstage/plugin-permission-node@0.7.10-next.0
- @backstage/plugin-search-backend@1.3.3-next.0
- @backstage/plugin-search-backend-module-catalog@0.1.3-next.0
- @backstage/plugin-search-backend-module-explore@0.1.3-next.0
- @backstage/plugin-search-backend-module-techdocs@0.1.3-next.0
- @backstage/plugin-search-backend-node@1.2.3-next.0
- @backstage/plugin-techdocs-backend@1.6.4-next.0
- @backstage/plugin-todo-backend@0.1.44-next.0
## 0.0.13-next.1
### Patch Changes
packages/backend-next/package.json
+2 -1
View File
@@ -1,6 +1,6 @@
{
"name": "example-backend-next",
"version": "0.0.13-next.1",
"version": "0.0.13-next.2",
"main": "dist/index.cjs.js",
"types": "src/index.ts",
"license": "Apache-2.0",
@@ -27,6 +27,7 @@
"dependencies": {
"@backstage/backend-defaults": "workspace:^",
"@backstage/backend-tasks": "workspace:^",
"@backstage/plugin-adr-backend": "workspace:^",
"@backstage/plugin-app-backend": "workspace:^",
"@backstage/plugin-auth-node": "workspace:^",
"@backstage/plugin-azure-devops-backend": "workspace:^",
packages/backend-next/src/index.ts
+3
View File
@@ -37,6 +37,7 @@ import { azureDevOpsPlugin } from '@backstage/plugin-azure-devops-backend';
import { linguistPlugin } from '@backstage/plugin-linguist-backend';
import { devtoolsPlugin } from '@backstage/plugin-devtools-backend';
import { TaskScheduleDefinition } from '@backstage/backend-tasks';
import { adrPlugin } from '@backstage/plugin-adr-backend';
const backend = createBackend();
@@ -73,6 +74,8 @@ backend.add(
// Todo
backend.add(todoPlugin());
backend.add(adrPlugin());
// Techdocs
backend.add(techdocsPlugin());
packages/backend/CHANGELOG.md
+55
View File
@@ -1,5 +1,60 @@
# example-backend
## 0.2.85-next.2
### Patch Changes
- Updated dependencies
- @backstage/plugin-scaffolder-backend-module-confluence-to-markdown@0.2.0-next.1
- @backstage/plugin-devtools-backend@0.1.2-next.2
- @backstage/plugin-tech-insights-backend@0.5.13-next.1
- @backstage/plugin-scaffolder-backend@1.15.1-next.1
- @backstage/plugin-kubernetes-backend@0.11.2-next.2
- @backstage/plugin-adr-backend@0.3.5-next.1
- example-app@0.2.85-next.2
- @backstage/backend-common@0.19.1-next.0
- @backstage/backend-tasks@0.5.4-next.0
- @backstage/catalog-client@1.4.3-next.0
- @backstage/catalog-model@1.4.1-next.0
- @backstage/config@1.0.8
- @backstage/integration@1.5.1-next.0
- @backstage/plugin-app-backend@0.3.47-next.0
- @backstage/plugin-auth-backend@0.18.5-next.1
- @backstage/plugin-auth-node@0.2.16-next.0
- @backstage/plugin-azure-devops-backend@0.3.26-next.1
- @backstage/plugin-azure-sites-backend@0.1.9-next.0
- @backstage/plugin-badges-backend@0.2.2-next.1
- @backstage/plugin-catalog-backend@1.11.0-next.0
- @backstage/plugin-catalog-backend-module-unprocessed@0.1.1-next.0
- @backstage/plugin-catalog-node@1.4.0-next.0
- @backstage/plugin-code-coverage-backend@0.2.13-next.0
- @backstage/plugin-entity-feedback-backend@0.1.5-next.0
- @backstage/plugin-events-backend@0.2.8-next.0
- @backstage/plugin-events-node@0.2.8-next.0
- @backstage/plugin-explore-backend@0.0.9-next.0
- @backstage/plugin-graphql-backend@0.1.37-next.0
- @backstage/plugin-jenkins-backend@0.2.2-next.0
- @backstage/plugin-kafka-backend@0.2.40-next.0
- @backstage/plugin-lighthouse-backend@0.2.3-next.0
- @backstage/plugin-linguist-backend@0.3.1-next.1
- @backstage/plugin-nomad-backend@0.1.1-next.0
- @backstage/plugin-permission-backend@0.5.22-next.0
- @backstage/plugin-permission-common@0.7.7-next.0
- @backstage/plugin-permission-node@0.7.10-next.0
- @backstage/plugin-playlist-backend@0.3.3-next.0
- @backstage/plugin-proxy-backend@0.2.41-next.0
- @backstage/plugin-rollbar-backend@0.1.44-next.0
- @backstage/plugin-scaffolder-backend-module-rails@0.4.16-next.1
- @backstage/plugin-search-backend@1.3.3-next.0
- @backstage/plugin-search-backend-module-elasticsearch@1.3.2-next.0
- @backstage/plugin-search-backend-module-pg@0.5.8-next.0
- @backstage/plugin-search-backend-node@1.2.3-next.0
- @backstage/plugin-search-common@1.2.5-next.0
- @backstage/plugin-tech-insights-backend-module-jsonfc@0.1.31-next.0
- @backstage/plugin-tech-insights-node@0.4.5-next.0
- @backstage/plugin-techdocs-backend@1.6.4-next.0
- @backstage/plugin-todo-backend@0.1.44-next.0
## 0.2.85-next.1
### Patch Changes
packages/backend/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "example-backend",
"version": "0.2.85-next.1",
"version": "0.2.85-next.2",
"main": "dist/index.cjs.js",
"types": "src/index.ts",
"license": "Apache-2.0",
packages/cli-node/CHANGELOG.md
+10
View File
@@ -1,5 +1,15 @@
# @backstage/cli-node
## 0.1.2-next.1
### Patch Changes
- 4edd1ef71453: semver upgrade to 7.5.3
- Updated dependencies
- @backstage/cli-common@0.1.12
- @backstage/errors@1.2.1-next.0
- @backstage/types@1.1.0
## 0.1.2-next.0
### Patch Changes
packages/cli-node/package.json
+2 -2
View File
@@ -1,7 +1,7 @@
{
"name": "@backstage/cli-node",
"description": "Node.js library for Backstage CLIs",
"version": "0.1.2-next.0",
"version": "0.1.2-next.1",
"main": "src/index.ts",
"types": "src/index.ts",
"license": "Apache-2.0",
@@ -28,7 +28,7 @@
"@manypkg/get-packages": "^1.1.3",
"@yarnpkg/parsers": "^3.0.0-rc.4",
"fs-extra": "10.1.0",
"semver": "^7.3.2",
"semver": "^7.5.3",
"zod": "^3.21.4"
},
"devDependencies": {
packages/cli/CHANGELOG.md
+21 -2
View File
@@ -1,5 +1,24 @@
# @backstage/cli
## 0.22.9-next.1
### Patch Changes
- 4edd1ef71453: semver upgrade to 7.5.3
- ff45cb559e49: Updated dependency `esbuild` to `^0.18.0`.
- 8174cf4c0edf: Fixing MUI / Material UI references
- Updated dependencies
- @backstage/cli-node@0.1.2-next.1
- @backstage/catalog-model@1.4.1-next.0
- @backstage/cli-common@0.1.12
- @backstage/config@1.0.8
- @backstage/config-loader@1.3.2-next.0
- @backstage/errors@1.2.1-next.0
- @backstage/eslint-plugin@0.1.3
- @backstage/integration@1.5.1-next.0
- @backstage/release-manifests@0.0.9
- @backstage/types@1.1.0
## 0.22.9-next.0
### Patch Changes
@@ -26,7 +45,7 @@
- 75540599124a: Updated example component for a newly scaffolded app.
- 5d692f72ebfb: Make sure to include a `fetch` environment for `jsdom` in `jest` tests
- 6816352500a7: Add discovery feature to the onboard cli command.
- 20b7da6f1311: Enforcing MUI v5 specific linting to minimize bundle size.
- 20b7da6f1311: Enforcing Material UI v5 specific linting to minimize bundle size.
- Updated dependencies
- @backstage/types@1.1.0
- @backstage/config-loader@1.3.1
@@ -77,7 +96,7 @@
### Patch Changes
- 20b7da6f1311: Enforcing MUI v5 specific linting to minimize bundle size.
- 20b7da6f1311: Enforcing Material UI v5 specific linting to minimize bundle size.
- Updated dependencies
- @backstage/config-loader@1.3.1-next.0
- @backstage/config@1.0.7
packages/cli/config/eslint-factory.js
+1 -1
View File
@@ -203,7 +203,7 @@ function createConfigForRole(dir, role, extraConfig = {}) {
},
restrictedImports: [
{
// Importing the entire MUI icons packages impedes build performance as the list of icons is huge.
// Importing the entire Material UI icons packages impedes build performance as the list of icons is huge.
name: '@material-ui/icons',
message: "Please import '@material-ui/icons/<Icon>' instead.",
},
packages/cli/package.json
+2 -2
View File
@@ -1,7 +1,7 @@
{
"name": "@backstage/cli",
"description": "CLI for developing Backstage plugins and apps",
"version": "0.22.9-next.0",
"version": "0.22.9-next.1",
"publishConfig": {
"access": "public"
},
@@ -123,7 +123,7 @@
"rollup-plugin-postcss": "^4.0.0",
"rollup-pluginutils": "^2.8.2",
"run-script-webpack-plugin": "^0.1.0",
"semver": "^7.3.2",
"semver": "^7.5.3",
"style-loader": "^3.3.1",
"sucrase": "^3.20.2",
"swc-loader": "^0.2.3",
packages/cli/src/lib/builder/buildTypeDefinitionsWorker.ts
+1 -1
View File
@@ -40,7 +40,7 @@ export async function buildTypeDefinitionsWorker(
const { Extractor, ExtractorConfig, CompilerState } = apiExtractor;
/**
* All of this monkey patching below is because MUI has these bare package.json file as a method
* All of this monkey patching below is because Material UI has these bare package.json file as a method
* for making TypeScript accept imports like `@material-ui/core/Button`, and improve tree-shaking
* by declaring them side effect free.
*
packages/cli/src/lib/svgrTemplate.ts
+1 -1
View File
@@ -16,7 +16,7 @@
/**
* This template, together with loaders in the bundler and packages, allows
* for SVG to be imported directly as MUI SvgIcon components by suffixing
* for SVG to be imported directly as Material UI SvgIcon components by suffixing
* them with .icon.svg
*/
export function svgrTemplate(
packages/codemods/CHANGELOG.md
+8
View File
@@ -1,5 +1,13 @@
# @backstage/codemods
## 0.1.45-next.0
### Patch Changes
- 325a32e9476e: Updated dependency `jscodeshift` to `^0.15.0`.
- Updated dependencies
- @backstage/cli-common@0.1.12
## 0.1.44
### Patch Changes
packages/codemods/package.json
+1 -1
View File
@@ -1,7 +1,7 @@
{
"name": "@backstage/codemods",
"description": "A collection of codemods for Backstage projects",
"version": "0.1.44",
"version": "0.1.45-next.0",
"publishConfig": {
"access": "public",
"main": "dist/index.cjs.js"
packages/core-app-api/CHANGELOG.md
+13 -2
View File
@@ -1,5 +1,16 @@
# @backstage/core-app-api
## 1.8.2-next.1
### Patch Changes
- 8174cf4c0edf: Fixing MUI / Material UI references
- Updated dependencies
- @backstage/core-plugin-api@1.5.3-next.1
- @backstage/config@1.0.8
- @backstage/types@1.1.0
- @backstage/version-bridge@1.0.4
## 1.8.2-next.0
### Patch Changes
@@ -873,7 +884,7 @@
Deprecated the `SamlSession` and `GithubSession` types.
- 784d8078ab: Removed direct and transitive MUI dependencies.
- 784d8078ab: Removed direct and transitive Material UI dependencies.
- Updated dependencies
- @backstage/config@0.1.12
- @backstage/core-plugin-api@0.5.0
@@ -1072,7 +1083,7 @@
The first and most commonly used one is `createApp` from the new `@backstage/app-defaults` package, which behaves just like the existing `createApp`. In the future this method is likely to be expanded to add more APIs and other pieces into the default setup, for example the Utility APIs from `@backstage/integration-react`.
The other option that we now provide is to use `createSpecializedApp` from `@backstage/core-app-api`. This is a more low-level API where you need to provide a full set of options, including your own `components`, `icons`, `defaultApis`, and `themes`. The `createSpecializedApp` way of creating an app is particularly useful if you are not using `@backstage/core-components` or MUI, as it allows you to avoid those dependencies completely.
The other option that we now provide is to use `createSpecializedApp` from `@backstage/core-app-api`. This is a more low-level API where you need to provide a full set of options, including your own `components`, `icons`, `defaultApis`, and `themes`. The `createSpecializedApp` way of creating an app is particularly useful if you are not using `@backstage/core-components` or Material UI, as it allows you to avoid those dependencies completely.
- 475edb5bc5: move the BehaviorSubject init into the constructor
- Updated dependencies
packages/core-app-api/package.json
+1 -1
View File
@@ -1,7 +1,7 @@
{
"name": "@backstage/core-app-api",
"description": "Core app API used by Backstage apps",
"version": "1.8.2-next.0",
"version": "1.8.2-next.1",
"publishConfig": {
"access": "public",
"main": "dist/index.esm.js",
packages/core-app-api/src/app/createSpecializedApp.tsx
+1 -1
View File
@@ -29,7 +29,7 @@ import { AppOptions, BackstageApp } from './types';
* however, this low-level API allows you to provide a full set of options,
* including your own `components`, `icons`, `defaultApis`, and `themes`. This
* is particularly useful if you are not using `@backstage/core-components` or
* MUI, as it allows you to avoid those dependencies completely.
* Material UI, as it allows you to avoid those dependencies completely.
*/
export function createSpecializedApp(options: AppOptions): BackstageApp {
return new AppManager(options);
packages/core-components/CHANGELOG.md
+16 -3
View File
@@ -1,5 +1,18 @@
# @backstage/core-components
## 0.13.3-next.2
### Patch Changes
- 8174cf4c0edf: Fixing MUI / Material UI references
- 4317b1c2f430: Remove zooming in restrictions in the catalog graph
- Updated dependencies
- @backstage/theme@0.4.1-next.1
- @backstage/core-plugin-api@1.5.3-next.1
- @backstage/config@1.0.8
- @backstage/errors@1.2.1-next.0
- @backstage/version-bridge@1.0.4
## 0.13.3-next.1
### Patch Changes
@@ -31,7 +44,7 @@
- 4e697e88f0e2: Add resource utilization to Pod Drawer
- 78cbb8ef8aea: Enhance the sidebar item accessibility by using appropriate header semantics.
- 66ae4d8ca380: Added `exact` prop to `SidebarSubmenuItem` which causes it to only highlight if the current location is an exact match.
- 83bdc3a555c1: Replaced usages of `theme.palette.theme.hint` with `theme.palette.text.secondary` as it has been removed in MUI v5
- 83bdc3a555c1: Replaced usages of `theme.palette.theme.hint` with `theme.palette.text.secondary` as it has been removed in Material UI v5
- b4cc4b1415e9: SupportButton auto focus first item when opened.
- e33beb1f2a8e: Make the documentation pages printable (also handy for exporting to PDF)
- Updated dependencies
@@ -68,7 +81,7 @@
### Patch Changes
- 83bdc3a555c1: Replaced usages of `theme.palette.theme.hint` with `theme.palette.text.secondary` as it has been removed in MUI v5
- 83bdc3a555c1: Replaced usages of `theme.palette.theme.hint` with `theme.palette.text.secondary` as it has been removed in Material UI v5
- Updated dependencies
- @backstage/errors@1.2.0-next.0
- @backstage/core-plugin-api@1.5.2-next.0
@@ -405,7 +418,7 @@
- 2e701b3796: Internal refactor to use `react-router-dom` rather than `react-router`.
- d2e3bf6737: Made AlertDisplay not crash on undefined messages
- 64a579a998: Add items prop to SupportButton. This prop can be used to override the items that would otherwise be grabbed from the config.
- 5d3058355d: Add `react/forbid-elements` linter rule for button, suggest MUI `Button`
- 5d3058355d: Add `react/forbid-elements` linter rule for button, suggest Material UI `Button`
- 3280711113: Updated dependency `msw` to `^0.49.0`.
- 19356df560: Updated dependency `zen-observable` to `^0.9.0`.
- c3fa90e184: Updated dependency `zen-observable` to `^0.10.0`.
packages/core-components/package.json
+1 -1
View File
@@ -1,7 +1,7 @@
{
"name": "@backstage/core-components",
"description": "Core components used by Backstage plugins and apps",
"version": "0.13.3-next.1",
"version": "0.13.3-next.2",
"publishConfig": {
"access": "public",
"main": "dist/index.esm.js",
packages/core-components/src/components/DependencyGraph/DependencyGraph.tsx
+1 -1
View File
@@ -241,7 +241,7 @@ export function DependencyGraph<NodeData, EdgeData>(
container.call(
d3Zoom
.zoom<SVGSVGElement, null>()
.scaleExtent([1, 10])
.scaleExtent([1, Infinity])
.on('zoom', event => {
event.transform.x = Math.min(
0,
packages/core-components/src/components/LinkButton/LinkButton.stories.tsx
+4 -4
View File
@@ -46,7 +46,7 @@ export default {
A collection of buttons that should be used in the Backstage
interface. These leverage the properties inherited from{' '}
<Link to="https://material-ui.com/components/buttons/">
Material-UI Button
Material UI Button
</Link>
, but include an opinionated set that align to the Backstage design.
</Typography>
@@ -131,7 +131,7 @@ export const ButtonLinks = () => {
<LinkButton to={link()} color="default" variant="outlined">
Route Ref
</LinkButton>
&nbsp; has props for both Material-UI's component as well as for
&nbsp; has props for both Material UI's component as well as for
react-router-dom's Route object.
</ListItem>
@@ -151,7 +151,7 @@ export const ButtonLinks = () => {
>
View URL
</MaterialButton>
&nbsp; links to a defined URL using Material-UI's Button.
&nbsp; links to a defined URL using Material UI's Button.
</ListItem>
<ListItem>
@@ -162,7 +162,7 @@ export const ButtonLinks = () => {
>
Trigger Event
</MaterialButton>
&nbsp; triggers an onClick event using Material-UI's Button.
&nbsp; triggers an onClick event using Material UI's Button.
</ListItem>
</List>
</>
packages/core-components/src/components/LinkButton/LinkButton.tsx
+1 -1
View File
@@ -26,7 +26,7 @@ import { Link, LinkProps } from '../Link';
* @public
* @remarks
*
* See {@link https://v4.mui.com/api/button/#props | Material-UI Button Props} for all properties
* See {@link https://v4.mui.com/api/button/#props | Material UI Button Props} for all properties
*/
export type LinkButtonProps = MaterialButtonProps &
Omit<LinkProps, 'variant' | 'color'>;
packages/core-components/src/layout/ItemCard/ItemCard.tsx
+3 -3
View File
@@ -37,7 +37,7 @@ type ItemCardProps = {
};
/**
* This card type has been deprecated. Instead use plain MUI Card and helpers
* This card type has been deprecated. Instead use plain Material UI Card and helpers
* where appropriate.
*
* @example
@@ -57,8 +57,8 @@ type ItemCardProps = {
* </Card>
* ```
*
* @deprecated Use plain MUI `<Card>` and composable helpers instead.
* @see https://material-ui.com/components/cards/
* @deprecated Use plain Material UI `<Card>` and composable helpers instead.
* @see https://v4.mui.com/components/cards/
*/
export function ItemCard(props: ItemCardProps) {
const { description, tags, title, type, subtitle, label, onClick, href } =
packages/core-components/src/layout/ItemCard/ItemCardGrid.tsx
+1 -1
View File
@@ -50,7 +50,7 @@ export type ItemCardGridProps = Partial<WithStyles<typeof styles>> & {
* select among several options.
*
* @remarks
* The immediate children are expected to be MUI Card components.
* The immediate children are expected to be Material UI Card components.
*
* Styles for the grid can be overridden using the `classes` prop, e.g.:
*
packages/core-components/src/layout/ItemCard/ItemCardHeader.tsx
+1 -1
View File
@@ -65,7 +65,7 @@ export type ItemCardHeaderProps = Partial<WithStyles<typeof styles>> & {
* are arranged in a grid for users to select among several options.
*
* @remarks
* This component expects to be placed within a MUI `<CardMedia>`.
* This component expects to be placed within a Material UI `<CardMedia>`.
*
* Styles for the header can be overridden using the `classes` prop, e.g.:
*
packages/core-components/src/layout/Sidebar/SidebarGroup.tsx
+1 -1
View File
@@ -69,7 +69,7 @@ const useStyles = makeStyles<BackstageTheme, { sidebarConfig: SidebarConfig }>(
);
/**
* Returns a MUI `BottomNavigationAction`, which is aware of the current location & the selected item in the `BottomNavigation`,
* Returns a Material UI `BottomNavigationAction`, which is aware of the current location & the selected item in the `BottomNavigation`,
* such that it will highlight a `MobileSidebarGroup` either on location change or if the selected item changes.
*
* @param props `to`: pathname of link; `value`: index of the selected item
packages/core-plugin-api/CHANGELOG.md
+11 -1
View File
@@ -1,5 +1,15 @@
# @backstage/core-plugin-api
## 1.5.3-next.1
### Patch Changes
- 8174cf4c0edf: Fixing MUI / Material UI references
- Updated dependencies
- @backstage/config@1.0.8
- @backstage/types@1.1.0
- @backstage/version-bridge@1.0.4
## 1.5.3-next.0
### Patch Changes
@@ -556,7 +566,7 @@
### Patch Changes
- 784d8078ab: Removed direct and transitive MUI dependencies.
- 784d8078ab: Removed direct and transitive Material UI dependencies.
- Updated dependencies
- @backstage/config@0.1.12
packages/core-plugin-api/package.json
+1 -1
View File
@@ -1,7 +1,7 @@
{
"name": "@backstage/core-plugin-api",
"description": "Core API used by Backstage plugins",
"version": "1.5.3-next.0",
"version": "1.5.3-next.1",
"publishConfig": {
"access": "public"
},
packages/core-plugin-api/src/icons/types.ts
+4 -4
View File
@@ -22,8 +22,8 @@ import { ComponentType } from 'react';
*
* @remarks
*
* The type is based on SvgIcon from MUI, but both do not what the plugin-api
* package to have a dependency on MUI, nor do we want the props to be as broad
* The type is based on SvgIcon from Material UI, but both do not what the plugin-api
* package to have a dependency on Material UI, nor do we want the props to be as broad
* as the SvgIconProps interface.
*
* If you have the need to forward additional props from SvgIconProps, you can
@@ -34,11 +34,11 @@ import { ComponentType } from 'react';
*/
export type IconComponent = ComponentType<
/* MUI v4 */
/* Material UI v4 */
| {
fontSize?: 'large' | 'small' | 'default';
}
/* MUI v5: https://mui.com/material-ui/migration/v5-component-changes/#icon */
/* Material UI v5: https://mui.com/material-ui/migration/v5-component-changes/#icon */
| {
fontSize?: 'medium' | 'large' | 'small';
}
packages/create-app/CHANGELOG.md
+8
View File
@@ -1,5 +1,13 @@
# @backstage/create-app
## 0.5.3-next.2
### Patch Changes
- 4f7292c74dff: Updated included Dockerfile to include `g++`. Also updated the comments to note that some of the dependencies are also needed by isolated-vm
- Updated dependencies
- @backstage/cli-common@0.1.12
## 0.5.3-next.1
### Patch Changes
packages/create-app/package.json
+1 -1
View File
@@ -1,7 +1,7 @@
{
"name": "@backstage/create-app",
"description": "A CLI that helps you create your own Backstage app",
"version": "0.5.3-next.1",
"version": "0.5.3-next.2",
"publishConfig": {
"access": "public"
},
packages/create-app/templates/default-app/packages/backend/Dockerfile
+8 -3
View File
@@ -11,13 +11,18 @@
FROM node:16-bullseye-slim
# Install isolate-vm dependencies, these are needed by the @backstage/plugin-scaffolder-backend.
RUN --mount=type=cache,target=/var/cache/apt,sharing=locked \
--mount=type=cache,target=/var/lib/apt,sharing=locked \
apt-get update && \
apt-get install -y --no-install-recommends python3 g++ build-essential && \
yarn config set python /usr/bin/python3
# Install sqlite3 dependencies. You can skip this if you don't use sqlite3 in the image,
# in which case you should also move better-sqlite3 to "devDependencies" in package.json.
RUN --mount=type=cache,target=/var/cache/apt,sharing=locked \
--mount=type=cache,target=/var/lib/apt,sharing=locked \
apt-get update && \
apt-get install -y --no-install-recommends libsqlite3-dev python3 build-essential && \
yarn config set python /usr/bin/python3
apt-get install -y --no-install-recommends libsqlite3-dev
# From here on we use the least-privileged `node` user to run the backend.
USER node
packages/dev-utils/CHANGELOG.md
+15
View File
@@ -1,5 +1,20 @@
# @backstage/dev-utils
## 1.0.17-next.2
### Patch Changes
- Updated dependencies
- @backstage/plugin-catalog-react@1.8.0-next.2
- @backstage/theme@0.4.1-next.1
- @backstage/test-utils@1.4.1-next.2
- @backstage/core-plugin-api@1.5.3-next.1
- @backstage/core-components@0.13.3-next.2
- @backstage/core-app-api@1.8.2-next.1
- @backstage/app-defaults@1.4.1-next.2
- @backstage/catalog-model@1.4.1-next.0
- @backstage/integration-react@1.1.15-next.2
## 1.0.17-next.1
### Patch Changes
packages/dev-utils/package.json
+1 -1
View File
@@ -1,7 +1,7 @@
{
"name": "@backstage/dev-utils",
"description": "Utilities for developing Backstage plugins.",
"version": "1.0.17-next.1",
"version": "1.0.17-next.2",
"publishConfig": {
"access": "public",
"main": "dist/index.esm.js",
packages/e2e-test/CHANGELOG.md
+9
View File
@@ -1,5 +1,14 @@
# e2e-test
## 0.2.5-next.2
### Patch Changes
- Updated dependencies
- @backstage/create-app@0.5.3-next.2
- @backstage/cli-common@0.1.12
- @backstage/errors@1.2.1-next.0
## 0.2.5-next.1
### Patch Changes
packages/e2e-test/package.json
+1 -1
View File
@@ -1,7 +1,7 @@
{
"name": "e2e-test",
"description": "E2E test for verifying Backstage packages",
"version": "0.2.5-next.1",
"version": "0.2.5-next.2",
"private": true,
"backstage": {
"role": "cli"
packages/integration-react/CHANGELOG.md
+11
View File
@@ -1,5 +1,16 @@
# @backstage/integration-react
## 1.1.15-next.2
### Patch Changes
- Updated dependencies
- @backstage/theme@0.4.1-next.1
- @backstage/core-plugin-api@1.5.3-next.1
- @backstage/core-components@0.13.3-next.2
- @backstage/config@1.0.8
- @backstage/integration@1.5.1-next.0
## 1.1.15-next.1
### Patch Changes
packages/integration-react/package.json
+1 -1
View File
@@ -1,7 +1,7 @@
{
"name": "@backstage/integration-react",
"description": "Frontend package for managing integrations towards external systems",
"version": "1.1.15-next.1",
"version": "1.1.15-next.2",
"main": "src/index.ts",
"types": "src/index.ts",
"license": "Apache-2.0",
packages/repo-tools/CHANGELOG.md
+9
View File
@@ -1,5 +1,14 @@
# @backstage/repo-tools
## 0.3.2-next.1
### Patch Changes
- Updated dependencies
- @backstage/cli-node@0.1.2-next.1
- @backstage/cli-common@0.1.12
- @backstage/errors@1.2.1-next.0
## 0.3.2-next.0
### Patch Changes
packages/repo-tools/package.json
+1 -1
View File
@@ -1,7 +1,7 @@
{
"name": "@backstage/repo-tools",
"description": "CLI for Backstage repo tooling ",
"version": "0.3.2-next.0",
"version": "0.3.2-next.1",
"publishConfig": {
"access": "public"
},
packages/techdocs-cli-embedded-app/CHANGELOG.md
+19
View File
@@ -1,5 +1,24 @@
# techdocs-cli-embedded-app
## 0.2.84-next.2
### Patch Changes
- Updated dependencies
- @backstage/cli@0.22.9-next.1
- @backstage/plugin-catalog@1.12.0-next.2
- @backstage/theme@0.4.1-next.1
- @backstage/test-utils@1.4.1-next.2
- @backstage/core-plugin-api@1.5.3-next.1
- @backstage/core-components@0.13.3-next.2
- @backstage/core-app-api@1.8.2-next.1
- @backstage/app-defaults@1.4.1-next.2
- @backstage/catalog-model@1.4.1-next.0
- @backstage/config@1.0.8
- @backstage/integration-react@1.1.15-next.2
- @backstage/plugin-techdocs@1.6.5-next.2
- @backstage/plugin-techdocs-react@1.1.8-next.2
## 0.2.84-next.1
### Patch Changes
packages/techdocs-cli-embedded-app/package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "techdocs-cli-embedded-app",
"version": "0.2.84-next.1",
"version": "0.2.84-next.2",
"private": true,
"backstage": {
"role": "frontend"
packages/test-utils/CHANGELOG.md
+16 -2
View File
@@ -1,5 +1,19 @@
# @backstage/test-utils
## 1.4.1-next.2
### Patch Changes
- 8174cf4c0edf: Fixing MUI / Material UI references
- Updated dependencies
- @backstage/theme@0.4.1-next.1
- @backstage/core-plugin-api@1.5.3-next.1
- @backstage/core-app-api@1.8.2-next.1
- @backstage/config@1.0.8
- @backstage/types@1.1.0
- @backstage/plugin-permission-common@0.7.7-next.0
- @backstage/plugin-permission-react@0.4.14-next.2
## 1.4.1-next.1
### Patch Changes
@@ -28,7 +42,7 @@
### Minor Changes
- 1fd38bc4141a: Test App Wrapper is now using `UnifiedThemeProvider` for supporting MUI v5 next to MUI v4 in tests.
- 1fd38bc4141a: Test App Wrapper is now using `UnifiedThemeProvider` for supporting Material UI v5 next to Material UI v4 in tests.
### Patch Changes
@@ -70,7 +84,7 @@
### Minor Changes
- 1fd38bc4141a: Test App Wrapper is now using `UnifiedThemeProvider` for supporting MUI v5 next to MUI v4 in tests.
- 1fd38bc4141a: Test App Wrapper is now using `UnifiedThemeProvider` for supporting Material UI v5 next to Material UI v4 in tests.
### Patch Changes
packages/test-utils/package.json
+1 -1
View File
@@ -1,7 +1,7 @@
{
"name": "@backstage/test-utils",
"description": "Utilities to test Backstage plugins and apps.",
"version": "1.4.1-next.1",
"version": "1.4.1-next.2",
"publishConfig": {
"access": "public"
},
packages/test-utils/src/testUtils/mockBreakpoint.ts
+3 -3
View File
@@ -16,13 +16,13 @@
/**
* This is a mocking method suggested in the Jest docs, as it is not implemented in JSDOM yet.
* It can be used to mock values for the MUI `useMediaQuery` hook if it is used in a tested component.
* It can be used to mock values for the Material UI `useMediaQuery` hook if it is used in a tested component.
*
* For issues checkout the documentation:
* https://jestjs.io/docs/manual-mocks#mocking-methods-which-are-not-implemented-in-jsdom
*
* If there are any updates from MUI React on testing `useMediaQuery` this mock should be replaced
* https://material-ui.com/components/use-media-query/#testing
* If there are any updates from Material UI React on testing `useMediaQuery` this mock should be replaced
* https://mui.com/material-ui/react-use-media-query/#testing
*
* @public
*/

Some files were not shown because too many files have changed in this diff Show More