diff --git a/.changeset/forty-singers-look.md b/.changeset/forty-singers-look.md deleted file mode 100644 index 1b3919e214..0000000000 --- a/.changeset/forty-singers-look.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@backstage/core-app-api': patch ---- - -Fix a bug in `FlatRoutes` that prevented outlets from working with the root route, as well as matching root routes too broadly. diff --git a/.changeset/funny-pants-unite.md b/.changeset/funny-pants-unite.md new file mode 100644 index 0000000000..349cf54b8f --- /dev/null +++ b/.changeset/funny-pants-unite.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-catalog-import': patch +--- + +Fix importing yaml files from URLs with trailing query parameters. diff --git a/.changeset/honest-ghosts-listen.md b/.changeset/honest-ghosts-listen.md deleted file mode 100644 index 411a7e8908..0000000000 --- a/.changeset/honest-ghosts-listen.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@backstage/cli': patch ---- - -chore: bump `eslint` to `7.30.0` diff --git a/.changeset/new-ligers-drum.md b/.changeset/new-ligers-drum.md new file mode 100644 index 0000000000..0edee17b4d --- /dev/null +++ b/.changeset/new-ligers-drum.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-xcmetrics': patch +--- + +Enable browsing detailed build information such as host configuration, errors, warnings, metadata and a timeline for all targets diff --git a/.changeset/ninety-ducks-relate.md b/.changeset/ninety-ducks-relate.md new file mode 100644 index 0000000000..2901efaea5 --- /dev/null +++ b/.changeset/ninety-ducks-relate.md @@ -0,0 +1,5 @@ +--- +'@backstage/cli': patch +--- + +Add Buffer to `ProvidePlugin` since this is no longer provided in `webpack@5` diff --git a/.changeset/quick-trains-flow.md b/.changeset/quick-trains-flow.md new file mode 100644 index 0000000000..447dc0aacc --- /dev/null +++ b/.changeset/quick-trains-flow.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-jenkins': patch +--- + +Make `isJenkinsAvailable` recognise both the old and the new Jenkins annotation. diff --git a/.changeset/short-ants-notice.md b/.changeset/short-ants-notice.md new file mode 100644 index 0000000000..779839387e --- /dev/null +++ b/.changeset/short-ants-notice.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-xcmetrics': patch +--- + +Internal refactoring diff --git a/.changeset/spotty-pandas-deny.md b/.changeset/spotty-pandas-deny.md deleted file mode 100644 index c3da6afe2b..0000000000 --- a/.changeset/spotty-pandas-deny.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@backstage/plugin-scaffolder-backend': patch ---- - -- Move out the `cookiecutter` templating to its own module that is depended on by the `scaffolder-backend` plugin. No breaking change yet, but we will drop first class support for `cookiecutter` in the future and it will become an opt-in feature. diff --git a/.changeset/techdocs-young-gorillas-share.md b/.changeset/techdocs-young-gorillas-share.md deleted file mode 100644 index 6b1d3f03da..0000000000 --- a/.changeset/techdocs-young-gorillas-share.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@backstage/plugin-techdocs': patch ---- - -Handle error responses in `getTechDocsMetadata` and `getEntityMetadata` such that `` doesn't throw errors. diff --git a/.changeset/wicked-emus-deny.md b/.changeset/wicked-emus-deny.md deleted file mode 100644 index ff6788dbb2..0000000000 --- a/.changeset/wicked-emus-deny.md +++ /dev/null @@ -1,8 +0,0 @@ ---- -'@backstage/create-app': patch -'@backstage/plugin-scaffolder-backend': patch ---- - -Moved sample software templates to the [backstage/software-templates](https://github.com/backstage/software-templates) repository. If you previously referenced the sample templates straight from `scaffolder-backend` plugin in the main [backstage/backstage](https://github.com/backstage/backstage) repository in your `app-config.yaml`, these references will need to be updated. - -See https://github.com/backstage/software-templates diff --git a/.changeset/wicked-spoons-perform.md b/.changeset/wicked-spoons-perform.md new file mode 100644 index 0000000000..61c489df13 --- /dev/null +++ b/.changeset/wicked-spoons-perform.md @@ -0,0 +1,6 @@ +--- +'@backstage/backend-common': patch +'@backstage/integration': patch +--- + +Add AWS S3 URL Reader diff --git a/.github/styles/vocab.txt b/.github/styles/vocab.txt index e6af881f1e..57510f2c3f 100644 --- a/.github/styles/vocab.txt +++ b/.github/styles/vocab.txt @@ -1,5 +1,6 @@ abc accessors +Anddddd Apdex api Api @@ -14,6 +15,7 @@ Avro backrub Bigtable Billett +Bitbucket Bitrise Blackbox bool @@ -74,6 +76,7 @@ dockerode Docusaurus env Env +elasticsearch esbuild eslint etag @@ -82,6 +85,8 @@ facto failover Fargate Figma +firehydrant +FireHydrant Firekube Fiverr gitbeaker @@ -212,6 +217,7 @@ repos rerender Reusability reusability +roadmaps rollbar Rollbar Rollup @@ -220,6 +226,7 @@ Routable rst rsync ruleset +runbook sam sanitization scaffolded diff --git a/.github/workflows/chromatic-storybook-test.yml b/.github/workflows/chromatic-storybook-test.yml index d189236987..043777601f 100644 --- a/.github/workflows/chromatic-storybook-test.yml +++ b/.github/workflows/chromatic-storybook-test.yml @@ -50,4 +50,5 @@ jobs: # projetToken intentionally shared to allow collaborators to run Chromatic on forks # https://www.chromatic.com/docs/custom-ci-provider#run-chromatic-on-external-forks-of-open-source-projects projectToken: 9tzak77m9nj - storybookBuildDir: 'packages/storybook/dist' + workingDir: 'packages/storybook' + storybookBuildDir: 'dist' diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index 7f013d10f8..8361654038 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -109,7 +109,7 @@ jobs: run: node scripts/verify-links.js - name: prettier - run: yarn prettier:check + run: yarn prettier:check '!ADOPTERS.md' - name: lock run: yarn lock:check diff --git a/.github/workflows/e2e-win.yml b/.github/workflows/e2e-win.yml index 1844700cea..3e2fbe0863 100644 --- a/.github/workflows/e2e-win.yml +++ b/.github/workflows/e2e-win.yml @@ -25,6 +25,13 @@ jobs: name: Node ${{ matrix.node-version }} on ${{ matrix.os }} steps: + # In order to have the create-app template function as if it was downloaded from NPM + # we need to make sure we checkout files with LF line endings only + - name: Set git to use LF + run: | + git config --global core.autocrlf false + git config --global core.eol lf + - uses: actions/checkout@v2 - name: use node.js ${{ matrix.node-version }} diff --git a/.github/workflows/prettify.yml b/.github/workflows/prettify.yml new file mode 100644 index 0000000000..4a34ff0c88 --- /dev/null +++ b/.github/workflows/prettify.yml @@ -0,0 +1,54 @@ +name: Prettier + +on: + push: + branches: + - master + +jobs: + autofix-markdown: + name: Autofix Markdown files using Prettier + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v2 + with: + # Fetch changes to previous commit - required for 'only_changed' in Prettier action + fetch-depth: 0 + + # Beginning of yarn setup, keep in sync between all workflows, see ci.yml + - name: use node.js ${{ matrix.node-version }} + uses: actions/setup-node@v1 + with: + node-version: ${{ matrix.node-version }} + registry-url: https://registry.npmjs.org/ # Needed for auth + - name: cache all node_modules + id: cache-modules + uses: actions/cache@v2 + with: + path: '**/node_modules' + key: ${{ runner.os }}-v${{ matrix.node-version }}-node_modules-${{ hashFiles('yarn.lock', '**/package.json') }} + - name: find location of global yarn cache + id: yarn-cache + if: steps.cache-modules.outputs.cache-hit != 'true' + run: echo "::set-output name=dir::$(yarn cache dir)" + - name: cache global yarn cache + uses: actions/cache@v2 + if: steps.cache-modules.outputs.cache-hit != 'true' + with: + path: ${{ steps.yarn-cache.outputs.dir }} + key: ${{ runner.os }}-yarn-${{ hashFiles('yarn.lock') }} + restore-keys: | + ${{ runner.os }}-yarn- + - name: yarn install + run: yarn install --frozen-lockfile + # End of yarn setup + + - name: Run Prettier on ADOPTERS.md + uses: creyD/prettier_action@v3.1 + with: + # Modifies commit only if prettier autofixed the ADOPTERS.md + prettier_options: --config docs/prettier.config.js --write ADOPTERS.md + only_changed: true + commit_message: 'Autofix ADOPTERS.md using Prettier' + env: + GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} diff --git a/.imgbotconfig b/.imgbotconfig index f337e087dc..2f4af2ed5e 100644 --- a/.imgbotconfig +++ b/.imgbotconfig @@ -1,5 +1,3 @@ { - "ignoredFiles": [ - "docs/assets/**/*.svg" - ] + "ignoredFiles": ["docs/assets/**/*.svg"] } diff --git a/ADOPTERS.md b/ADOPTERS.md index 9845f1a929..72b6cce072 100644 --- a/ADOPTERS.md +++ b/ADOPTERS.md @@ -1,40 +1,44 @@ -| Organization | Contact | Description of Use | -| ------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| [Spotify](https://www.spotify.com) | [@leemills83](https://github.com/leemills83) | Main interface towards all of Spotify's infrastructure and technical documentation. | -| [bol.com](https://www.bol.com) | [@sagacity](https://github.com/sagacity) | Initial work being done to unify platform tooling. | -| [DFDS](https://www.dfds.com) | [@carlsendk](https://github.com/carlsendk) | V2 self-service platform. | -| [Roadie](https://roadie.io) | [@dtuite](https://github.com/dtuite) | Hosted, managed Backstage with easy set-up | -| [Roku](https://www.roku.com) | [@timurista](https://github.com/timurista) | Initial work on Cloud engineering service platform. | -| [SDA SE](https://sda.se) | [@Fox32](https://github.com/Fox32) | Central place for developing and sharing services in our insurance ecosystem. | -| [H-E-B](https://www.heb.com) | [@german-j-rodriguez](https://github.com/german-j-rodriguez) | Initial work on Engineering Portal service platform. | -| [American Airlines](https://www.aa.com) | [@paulpach](https://github.com/paulpach) | Central place for developers to develop and maintain applications | -| [Kiwi.com](https://kiwi.com) | [@aexvir](https://github.com/aexvir) | Replacing the frontend of [The Zoo](https://github.com/kiwicom/the-zoo), their service registry. | -| [Voi](https://www.voiscooters.com/) | [@K-Phoen](https://github.com/K-Phoen) | Developer portal, main gateway to our infrastructure, documentation and internal tooling. | -| [Talkdesk](https://www.talkdesk.com) | [@jaime-talkdesk](https://github.com/jaime-talkdesk) | Initial work for Engineering Portal and Self Provisioning to R&D | -| [Wealthsimple](https://www.wealthsimple.com) | [@andrewthauer](https://github.com/andrewthauer) | Developer portal, service catalog, documentation and tooling | -| [Grab](https://www.grab.com) | [@althafh](https://github.com/althafh) | Initial work as a unified interface for all of Grab's internal tooling | -| [Telenor Sweden](https://www.telenor.se) | [@O5ten](https://github.com/O5ten) | Building a developer portal for scaffolding projects towards our unified build environment and microservice stacks | -| [Fiverr](https://www.fiverr.com) | [@nirga](https://github.com/nirga) | Unifying separate tools that developers are using today (i.e. monitoring, dead letter queues management, etc.) into a single platform. | -| [Zalando SE](https://www.zalando.de) | [@leviferreira](https://github.com/leviferreira) | Building V2 of the Internal Development Portal. | -| [LegalZoom](https://legalzoom.com) | [@backjo](https://github.com/backjo) | Developer portal - hub for all engineering projects and metadata. | -| [Expedia Group](https://www.expediagroup.com) | [Mike Turner](mailto:miturner@expediagroup.com), [Sneha Kumar](mailto:snkumar@expediagroup.com), [@guillermomanzo](https://github.com/guillermomanzo), [Erik Lindgren](https://github.com/lindgren) | EG Common Developer Toolkit | -| [Paddle.com](https://paddle.com) | [Ioannis Georgoulas](https://github.com/geototti21) | Developer portal (Tech Docs, Service Catalog, Internal Tooling), we use vanilla Backstage FE and custom BE implementation in Go | -| [Acast.com](https://acast.com) | [Olle Lundberg](https://github.com/lndbrg) | Developer portal with tech docs, service catalog and a bunch of other internal tooling | -| [Lunar](https://lunar.app) | [Jacob Valdemar](https://github.com/JacobValdemar) | Internal developer portal for service overview and insights, API documentation, technical guides, onboarding guides and RFC's. | -| [Trendyol](https://trendyol.com) | [Erdogan Oksuz](https://github.com/erdoganoksuz) | The Developer Portal has been called `Pandora`. Provides an overview of Trendyol tech ecosystem. TechDocs, Catalog, Custom Plugins and Theme. | -| [Peloton](https://www.onepeloton.com/) | [Jim Haughwout](https://github.com/JimHaughwout) | Creating our first developer portal and tech-docs. Exploring Service Catalog, Tech Insights and Cost Insights as well. | -| [TELUS](https://telus.com) | [Seb Barre](https://github.com/sbarre) | The Go-to place to find answers about development and delivery at TELUS. | -| [Brex](https://www.brex.com/) | [Vamsi Chitters](https://github.com/vamsikc) | A centralized UI to understand how a service fits in the whole Brex architecture and manage a team’s engineering dependencies. | -| [Oriflame](https://www.oriflame.com/) | [Oriflame](https://github.com/oriflame) | Internal developer portal for services, single page apps and packages overview, API documentation, technical guides, tech-radar and more. | -| [Booz Allen Hamilton](https://www.boozallen.com/) | [Jason Miller](https://github.com/JasonMiller-BAH) | Developer portal for a full-stack software development ecosystem that accelerates consistent and repeatable Modern Software Development practices for internal innovation and investments. | -| [Netflix](https://www.netflix.com/) | [bleathem](https://github.com/bleathem) | Our Backstage implementation will be the front door to a unified experience connecting our internal platform products across important workflows with integrated knowledge and support. | -| [b.well](https://www.icanbwell.com/) | [Jacob Rosales](https://github.com/jrosales) | Foundation for our engineering portal and cloud insights. | -| [PagerDuty](https://www.pagerduty.com/) | [Mark Shaw](https://github.com/markshawtoronto) | Developer portal, initially focused on software templates and tech-docs. | -| [MoonShiner](https://moonshiner.at) | [Fabian Hippmann](https://github.com/FabianHippmann) | Developer portal - helps us keep track of our customer projects, onboard new developers & improve our development process 🌕🚀🧑‍🚀 | -| [FundApps](https://www.fundapps.co/) | [Elliot Greenwood](https://github.com/egnwd) | Developer Portal - A place for us to keep track of our projects and documentation for all services and processes | -| [DAZN](https://dazn.com/) | [Lou Bichard](https://twitter.com/loujaybee), [Marco Crivellaro](https://github.com/crivetechie), [Alex Hollerith](mailto:alex.hollerith@dazn.com) | Ingesting all of DAZN's repos for the catalog, migrating our internal platform apps (pull request boards, release information, inner source marketplace etc) to Backstage plugins (where applicable). | -| [HelloFresh](https://www.hellofresh.de/) | [@iammuho](https://github.com/iammuho), [@ElenaForester](https://github.com/ElenaForester), [@diegomarangoni](https://github.com/diegomarangoni) | Our developer portal at HelloFresh - Spread across an organisation of 500+ engineers globally. | -| [FactSet](https://www.factset.com/) | [@kuangp](https://github.com/kuangp) | Developer portal to provide discoverability to all internal components, APIs, documentation, and scaffold templates with integrations to our internal infrastructure tools. | -| [Workrise](https://www.workrise.com/) | [Michael Rode](https://github.com/michaelrode) | Developer portal, main gateway to our infrastructure, documentation and internal tooling. | -| [RedVentures](https://www.redventures.com/) | [Chris Diaz](https://github.com/codingdiaz) | Developer portal that brings everything an engineer needs to provide value into a single pane of glass. | -| [MavTek](https://www.mavtek.com/) | [@fgascon](https://github.com/fgascon) | Developer portal focused on standardizing practices, centralizing documentation and streamlining developer practices. | +| Organization | Contact | Description of Use | +| ------------------------------------------------------------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| [Spotify](https://www.spotify.com) | [@leemills83](https://github.com/leemills83) | Main interface towards all of Spotify's infrastructure and technical documentation. | +| [bol.com](https://www.bol.com) | [@sagacity](https://github.com/sagacity) | Initial work being done to unify platform tooling. | +| [DFDS](https://www.dfds.com) | [@carlsendk](https://github.com/carlsendk) | V2 self-service platform. | +| [Roadie](https://roadie.io) | [@dtuite](https://github.com/dtuite) | Hosted, managed Backstage with easy set-up | +| [Roku](https://www.roku.com) | [@timurista](https://github.com/timurista) | Initial work on Cloud engineering service platform. | +| [SDA SE](https://sda.se) | [@Fox32](https://github.com/Fox32) | Central place for developing and sharing services in our insurance ecosystem. | +| [H-E-B](https://www.heb.com) | [@german-j-rodriguez](https://github.com/german-j-rodriguez) | Initial work on Engineering Portal service platform. | +| [American Airlines](https://www.aa.com) | [@paulpach](https://github.com/paulpach) | Central place for developers to develop and maintain applications | +| [Kiwi.com](https://kiwi.com) | [@aexvir](https://github.com/aexvir) | Replacing the frontend of [The Zoo](https://github.com/kiwicom/the-zoo), their service registry. | +| [Voi](https://www.voiscooters.com/) | [@K-Phoen](https://github.com/K-Phoen) | Developer portal, main gateway to our infrastructure, documentation and internal tooling. | +| [Talkdesk](https://www.talkdesk.com) | [@jaime-talkdesk](https://github.com/jaime-talkdesk) | Initial work for Engineering Portal and Self Provisioning to R&D | +| [Wealthsimple](https://www.wealthsimple.com) | [@andrewthauer](https://github.com/andrewthauer) | Developer portal, service catalog, documentation and tooling | +| [Grab](https://www.grab.com) | [@althafh](https://github.com/althafh) | Initial work as a unified interface for all of Grab's internal tooling | +| [Telenor Sweden](https://www.telenor.se) | [@O5ten](https://github.com/O5ten) | Building a developer portal for scaffolding projects towards our unified build environment and microservice stacks | +| [Fiverr](https://www.fiverr.com) | [@nirga](https://github.com/nirga) | Unifying separate tools that developers are using today (i.e. monitoring, dead letter queues management, etc.) into a single platform. | +| [Zalando SE](https://www.zalando.de) | [@leviferreira](https://github.com/leviferreira) | Building V2 of the Internal Development Portal. | +| [LegalZoom](https://legalzoom.com) | [@backjo](https://github.com/backjo) | Developer portal - hub for all engineering projects and metadata. | +| [Expedia Group](https://www.expediagroup.com) | [Mike Turner](mailto:miturner@expediagroup.com), [Sneha Kumar](mailto:snkumar@expediagroup.com), [@guillermomanzo](https://github.com/guillermomanzo), [Erik Lindgren](https://github.com/lindgren) | EG Common Developer Toolkit | +| [Paddle.com](https://paddle.com) | [Ioannis Georgoulas](https://github.com/geototti21) | Developer portal (Tech Docs, Service Catalog, Internal Tooling), we use vanilla Backstage FE and custom BE implementation in Go | +| [Acast.com](https://acast.com) | [Olle Lundberg](https://github.com/lndbrg) | Developer portal with tech docs, service catalog and a bunch of other internal tooling | +| [Lunar](https://lunar.app) | [Jacob Valdemar](https://github.com/JacobValdemar) | Internal developer portal for service overview and insights, API documentation, technical guides, onboarding guides and RFC's. | +| [Trendyol](https://trendyol.com) | [Erdogan Oksuz](https://github.com/erdoganoksuz) | The Developer Portal has been called `Pandora`. Provides an overview of Trendyol tech ecosystem. TechDocs, Catalog, Custom Plugins and Theme. | +| [Peloton](https://www.onepeloton.com/) | [Jim Haughwout](https://github.com/JimHaughwout) | Creating our first developer portal and tech-docs. Exploring Service Catalog, Tech Insights and Cost Insights as well. | +| [TELUS](https://telus.com) | [Seb Barre](https://github.com/sbarre) | The Go-to place to find answers about development and delivery at TELUS. | +| [Brex](https://www.brex.com/) | [Vamsi Chitters](https://github.com/vamsikc) | A centralized UI to understand how a service fits in the whole Brex architecture and manage a team’s engineering dependencies. | +| [Oriflame](https://www.oriflame.com/) | [Oriflame](https://github.com/oriflame) | Internal developer portal for services, single page apps and packages overview, API documentation, technical guides, tech-radar and more. | +| [Booz Allen Hamilton](https://www.boozallen.com/) | [Jason Miller](https://github.com/JasonMiller-BAH) | Developer portal for a full-stack software development ecosystem that accelerates consistent and repeatable Modern Software Development practices for internal innovation and investments. | +| [Netflix](https://www.netflix.com/) | [bleathem](https://github.com/bleathem) | Our Backstage implementation will be the front door to a unified experience connecting our internal platform products across important workflows with integrated knowledge and support. | +| [b.well](https://www.icanbwell.com/) | [Jacob Rosales](https://github.com/jrosales) | Foundation for our engineering portal and cloud insights. | +| [PagerDuty](https://www.pagerduty.com/) | [Mark Shaw](https://github.com/markshawtoronto) | Developer portal, initially focused on software templates and tech-docs. | +| [MoonShiner](https://moonshiner.at) | [Fabian Hippmann](https://github.com/FabianHippmann) | Developer portal - helps us keep track of our customer projects, onboard new developers & improve our development process 🌕🚀🧑‍🚀 | +| [FundApps](https://www.fundapps.co/) | [Elliot Greenwood](https://github.com/egnwd) | Developer Portal - A place for us to keep track of our projects and documentation for all services and processes | +| [DAZN](https://dazn.com/) | [Lou Bichard](https://twitter.com/loujaybee), [Marco Crivellaro](https://github.com/crivetechie), [Alex Hollerith](mailto:alex.hollerith@dazn.com) | Ingesting all of DAZN's repos for the catalog, migrating our internal platform apps (pull request boards, release information, inner source marketplace etc) to Backstage plugins (where applicable). | +| [HelloFresh](https://www.hellofresh.de/) | [@iammuho](https://github.com/iammuho), [@ElenaForester](https://github.com/ElenaForester), [@diegomarangoni](https://github.com/diegomarangoni) | Our developer portal at HelloFresh - Spread across an organisation of 500+ engineers globally. | +| [FactSet](https://www.factset.com/) | [@kuangp](https://github.com/kuangp) | Developer portal to provide discoverability to all internal components, APIs, documentation, and scaffold templates with integrations to our internal infrastructure tools. | +| [Workrise](https://www.workrise.com/) | [Michael Rode](https://github.com/michaelrode) | Developer portal, main gateway to our infrastructure, documentation and internal tooling. | +| [RedVentures](https://www.redventures.com/) | [Chris Diaz](https://github.com/codingdiaz) | Developer portal that brings everything an engineer needs to provide value into a single pane of glass. | +| [MavTek](https://www.mavtek.com/) | [@fgascon](https://github.com/fgascon) | Developer portal focused on standardizing practices, centralizing documentation and streamlining developer practices. | +| [QuintoAndar](https://www.quintoandar.com.br/) | [@quintoandar](https://github.com/quintoandar) | Developer portal, services catalog and centralization of service metrics. | +| [empathy.co](https://empathy.co/) | [@guillermotti](https://github.com/guillermotti) | Developer portal for tech docs, service catalog, plugin discovery and much more. | +| [creditas.com](https://creditas.com/) | [@aureliosaraiva](https://github.com/aureliosaraiva) [@Creditas](https://github.com/creditas) | Centralization of all services, standards, documentation, etc. We started the deployment process. | +| [Prisjakt](https://www.prisjakt.nu) / [PriceSpy](https://pricespy.co.uk) | [@kennylindahl](https://github.com/kennylindahl) | Internal developer portal - Documentation, scaffolding, software catalog, TechRadar, Gitlab org data integration | diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 2caa8c9c9c..466c77c575 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -116,7 +116,7 @@ In general, changesets are not needed for the documentation, build utilities, co 1. Run `yarn changeset` 2. Select which packages you want to include a changeset for -3. Select impact of change that you're introducing (patch, minor, or major) +3. Select impact of change that you're introducing, using `minor` for breaking changes and `patch` otherwise. We do not use `major` changes while packages are at version `0.x`. 4. Add generated changeset to Git 5. Push the commit with your changeset to the branch associated with your PR 6. Accept our gratitude for making the release process easier on the maintainers diff --git a/README.md b/README.md index 98da194c1b..1078631926 100644 --- a/README.md +++ b/README.md @@ -2,8 +2,6 @@ # [Backstage](https://backstage.io) -_During the month of July the majority of the maintainers will be on summer vacation 🏖️ Development will continue as usual, but expect a slower pace for discussions and PR reviews. Why not take this opportunity to [build a plugin](https://backstage.io/docs/plugins/)?_ - [![License](https://img.shields.io/badge/License-Apache%202.0-blue.svg)](https://opensource.org/licenses/Apache-2.0) [![CNCF Status](https://img.shields.io/badge/cncf%20status-sandbox-blue.svg)](https://www.cncf.io/projects) [![Main CI Build](https://github.com/backstage/backstage/workflows/Main%20Master%20Build/badge.svg)](https://github.com/backstage/backstage/actions?query=workflow%3A%22Main+Master+Build%22) @@ -63,3 +61,9 @@ Check out [the documentation](https://backstage.io/docs/getting-started) on how Copyright 2020-2021 © The Backstage Authors. All rights reserved. The Linux Foundation has registered trademarks and uses trademarks. For a list of trademarks of The Linux Foundation, please see our Trademark Usage page: https://www.linuxfoundation.org/trademark-usage Licensed under the Apache License, Version 2.0: http://www.apache.org/licenses/LICENSE-2.0 + +## Security + +Please report sensitive security issues via Spotify's [bug-bounty program](https://hackerone.com/spotify) rather than GitHub. + +For further details please see our complete [security release process](SECURITY.md). diff --git a/SECURITY.md b/SECURITY.md index 3ec51b4210..b410404bcf 100644 --- a/SECURITY.md +++ b/SECURITY.md @@ -9,3 +9,20 @@ ## Reporting a Vulnerability Please report sensitive security issues via Spotify's [bug-bounty program](https://hackerone.com/spotify) rather than GitHub. + +If you have questions about a potential vulnerability, please reach out on Discord by asking for a maintainer in the `#support` channel, or via direct message to a maintainer. + +## Remediation and Notification Process + +Vulnerabilities are handled and published through [GitHub Security Advisories](https://docs.github.com/en/code-security/security-advisories/about-github-security-advisories). + +In the event of a vulnerability the runbook for the maintainers is as follows: + +1. Create a [new draft security advisory](https://github.com/backstage/backstage/security/advisories/new). The values and descriptions don't need to be perfect to begin with as they can be edited later. For severity, use the "Assess severity using CVSS" and refer to [the guide](https://www.first.org/cvss/v3.1/user-guide) for help. +2. Request a CVE identification number. It can take up to 72h for one to be assigned so be sure to do this early on. +3. If there is not already a patch for the vulnerability, collaborate on one in a private fork: + 1. Head to the security advisory on GitHub and [create a private fork](https://docs.github.com/en/code-security/security-advisories/collaborating-in-a-temporary-private-fork-to-resolve-a-security-vulnerability) + 1. [Invite any collaborators](https://docs.github.com/en/code-security/security-advisories/adding-a-collaborator-to-a-security-advisory) from outside the maintainer team that should be part of creating a fix. + 1. Create one or multiple Pull Requests with fixes towards the fork. Note that these PRs will not have CI checks run on them, so more care should be taken to run local validation. The PRs are also not merged like normal PRs, but are instead merged straight into the main repo all at once when the merge button is hit on the security advisory. +4. Once the fix is ready in a PR or private fork and it is time to release it, there are a couple of options. Either merge into the main branch with a changeset and wait for a regular release, or do a quick release by manually bumping the version in `package.json` of the affected package, along with a manual `CHANGELOG.md` entry. Note that a quick release will only work if the package does not have any other pending changes that depend on pending changes in other packages, so be sure to manually check that first, and fall back to an early regular release if needed. In general it's best to stick with the regular release flow, with the quick release being used only for time sensitive fixes. +5. Finalize and publish the security advisory. Note that once you hit the publish button it's no longer possible to edit the advisory. Just like the CVE number this can take up to 72h, and expect it to be slower than the CVE number request. diff --git a/app-config.yaml b/app-config.yaml index 074e28c086..9f365becef 100644 --- a/app-config.yaml +++ b/app-config.yaml @@ -152,12 +152,21 @@ integrations: - host: bitbucket.org username: ${BITBUCKET_USERNAME} appPassword: ${BITBUCKET_APP_PASSWORD} + ### Example for how to add your bitbucket server instance using the API: + # - host: server.bitbucket.com + # apiBaseUrl: server.bitbucket.com + # username: ${BITBUCKET_SERVER_USERNAME} + # appPassword: ${BITBUCKET_SERVER_APP_PASSWORD} azure: - host: dev.azure.com token: ${AZURE_TOKEN} -# googleGcs: -# clientEmail: 'example@example.com' -# privateKey: ${GCS_PRIVATE_KEY} + # googleGcs: + # clientEmail: 'example@example.com' + # privateKey: ${GCS_PRIVATE_KEY} + awsS3: + - host: amazonaws.com + accessKeyId: ${AWS_ACCESS_KEY_ID} + secretAccessKey: ${AWS_SECRET_ACCESS_KEY} catalog: rules: @@ -256,6 +265,8 @@ scaffolder: # defaultAuthor: # name: Scaffolder # email: scaffolder@backstage.io + # Use to customize the default commit message when new components are created + # defaultCommitMessage: 'Initial commit' github: token: ${GITHUB_TOKEN} visibility: public # or 'internal' or 'private' diff --git a/catalog-info.yaml b/catalog-info.yaml index 0cab0c558a..6de6fd3426 100644 --- a/catalog-info.yaml +++ b/catalog-info.yaml @@ -15,7 +15,7 @@ metadata: url: https://discord.com/invite/EBHEGzX annotations: github.com/project-slug: backstage/backstage - backstage.io/techdocs-ref: url:https://github.com/backstage/backstage + backstage.io/techdocs-ref: dir:. lighthouse.com/website-url: https://backstage.io spec: type: library diff --git a/contrib/docker/frontend-with-nginx/Dockerfile.hostbuild b/contrib/docker/frontend-with-nginx/Dockerfile.hostbuild index 1e0134017f..f0fa4a034b 100644 --- a/contrib/docker/frontend-with-nginx/Dockerfile.hostbuild +++ b/contrib/docker/frontend-with-nginx/Dockerfile.hostbuild @@ -8,7 +8,6 @@ # simply copies in the build output into the image. If you want to also perform # the build itself inside docker, use Dockerfile.build in this folder instead. - # USAGE: # # - Copy this file and the "docker" folder from this directory to your project @@ -23,7 +22,7 @@ # # yarn install # yarn tsc -# yarn build --config --config ... +# yarn workspace app build --config --config ... # docker build -t backstage-frontend -f Dockerfile.hostbuild . @@ -38,4 +37,3 @@ COPY docker/default.conf.template /etc/nginx/templates/default.conf.template COPY docker/inject-config.sh /docker-entrypoint.d/40-inject-config.sh ENV PORT 80 - diff --git a/contrib/docs/tutorials/aws-deployment.md b/contrib/docs/tutorials/aws-deployment.md index 47170658a3..3a76da2ed3 100644 --- a/contrib/docs/tutorials/aws-deployment.md +++ b/contrib/docs/tutorials/aws-deployment.md @@ -5,7 +5,7 @@ image](https://backstage.io/docs/getting-started/deployment-docker); this tutorial shows how to deploy that Docker image to AWS using Elastic Container Registry (ECR) and Elastic Kubernetes Service (EKS). Amazon also supports deployments with Helm, covered in the [Helm -Kubernetes](../kubernetes/basic_kubernetes_example_with_helm) example. +Kubernetes](../../kubernetes/basic_kubernetes_example_with_helm) example. The basic workflow for this method is to build a Backstage Docker image, upload the new version to a container registry, and update a Kubernetes deployment with diff --git a/docs/auth/add-auth-provider.md b/docs/auth/add-auth-provider.md index 56586cbfc6..472a6a0abc 100644 --- a/docs/auth/add-auth-provider.md +++ b/docs/auth/add-auth-provider.md @@ -244,9 +244,7 @@ export interface OAuthProviderHandlers { req: express.Request, options: Record, ): Promise; - handler( - req: express.Request, - ): Promise<{ + handler(req: express.Request): Promise<{ response: AuthResponse; refreshToken?: string; }>; diff --git a/docs/auth/identity-resolver.md b/docs/auth/identity-resolver.md index 814ff63729..7ec6ec7117 100644 --- a/docs/auth/identity-resolver.md +++ b/docs/auth/identity-resolver.md @@ -111,6 +111,48 @@ export default async function createPlugin({ ... ``` +## Resolving membership through the catalog + +If you want to provide additional claims through Sign-In resolvers but still +have the software catalog handle group (and transitive group) membership, you +can do this using the `CatalogIdentityClient` provided as context to Sign-In +resolvers: + +```ts +export default async function createPlugin({ + ... +}: PluginEnvironment): Promise { + return await createRouter({ + ... + providerFactories: { + google: createGoogleProvider({ + signIn: { + resolver: async ({ profile: { email } }, ctx) => { + const [sub] = email?.split('@') ?? ''; + // Fetch from an external system that returns entity claims like: + // ['user:default/breanna.davison', ...] + const ent = await externalSystemClient.getUsernames(email); + + // Resolve group membership from the Backstage catalog + const fullEnt = await ctx.catalogIdentityClient.resolveCatalogMembership({ + entityRefs: [sub].concat(ent), + logger: ctx.logger, + }); + const token = await ctx.tokenIssuer.issueToken({ + claims: { sub, ent: fullEnt }, + }); + return { sub, token }; + }, + }, + }), + ... +``` + +The `resolveCatalogMembership` method will retrieve the referenced entities from +the catalog, if possible, and check for +[memberOf](../features/software-catalog/well-known-relations.md#memberof-and-hasmember) +relations to add additional entity claims. + ## AuthHandler Similar to a custom sign-in resolver, you can also write a custom auth handler diff --git a/docs/features/search/architecture.md b/docs/features/search/architecture.md index 0a1ebea4b0..4fac0e7cff 100644 --- a/docs/features/search/architecture.md +++ b/docs/features/search/architecture.md @@ -4,8 +4,6 @@ title: Search Architecture description: Documentation on Search Architecture --- -# Search Architecture - > _This architecture has not been fully implemented yet. Find our milestones to > follow our progress and help contribute on the > [Search Roadmap](./README.md#project-roadmap)._ diff --git a/docs/features/search/concepts.md b/docs/features/search/concepts.md index 5da7c9c58f..8cb17b12e6 100644 --- a/docs/features/search/concepts.md +++ b/docs/features/search/concepts.md @@ -4,8 +4,6 @@ title: Search Concepts description: Documentation on Backstage Search Concepts --- -# Search Concepts - Backstage Search lets you find the right information you are looking for in the Backstage ecosystem. diff --git a/docs/features/search/getting-started.md b/docs/features/search/getting-started.md index 2bd26faf8b..aa40c1e539 100644 --- a/docs/features/search/getting-started.md +++ b/docs/features/search/getting-started.md @@ -4,8 +4,6 @@ title: Getting Started with Search description: How to set up and install Backstage Search --- -# Getting Started - Search functions as a plugin to Backstage, so you will need to use Backstage to use Search. @@ -252,13 +250,9 @@ an example: Backstage Search isn't a search engine itself, rather, it provides an interface between your Backstage instance and a [Search Engine](./concepts.md#search-engines) of your choice. Currently, we only -support one, an in-memory search Engine called Lunr. It can be instantiated like -this: - -```typescript -const searchEngine = new LunrSearchEngine({ logger }); -const indexBuilder = new IndexBuilder({ logger, searchEngine }); -``` +support two engines, an in-memory search Engine called Lunr and ElasticSearch. +See [Search Engines](./search-engines.md) documentation for more information how +to configure these in your Backstage instance. Backstage Search can be used to power search of anything! Plugins like the Catalog offer default [collators](./concepts.md#collators) (e.g. diff --git a/docs/features/search/search-engines.md b/docs/features/search/search-engines.md new file mode 100644 index 0000000000..69a223b29e --- /dev/null +++ b/docs/features/search/search-engines.md @@ -0,0 +1,158 @@ +--- +id: search-engines +title: Search Engines +description: Choosing and configuring your search engine for Backstage +--- + +Backstage supports 2 search engines by default, an in-memory engine called Lunr +and ElasticSearch. You can configure your own search engines by implementing the +provided interface as mentioned in the +[search backend documentation.](./getting-started.md#Backend) + +Provided search engine implementations have their own way of constructing +queries, which may be something you want to modify. Alterations to the querying +logic of a search engine can be made by providing your own implementation of a +QueryTranslator interface. This modification can be done without touching +provided search engines by using the exposed setter to set the modified query +translator into the instance. + +```typescript +const searchEngine = new LunrSearchEngine({ logger }); +searchEngine.setTranslator(new MyNewAndBetterQueryTranslator()); +``` + +## Lunr + +Lunr search engine is enabled by default for your backstage instance if you have +not done additional changes to the scaffolded app. + +Lunr can be instantiated like this: + +```typescript +// app/backend/src/plugins/search.ts +const searchEngine = new LunrSearchEngine({ logger }); +const indexBuilder = new IndexBuilder({ logger, searchEngine }); +``` + +## Postgres + +The Postgres based search engine only requires that postgres being configured as +the database engine for Backstage. Therefore it targets setups that want to +avoid maintaining another external service like elastic search. The search +provides decent results and performs well with ten thousands of indexed +documents. The connection to postgres is established via the database manager +also used by other plugins. + +> **Important**: The search plugin requires at least Postgres 11! + +To use the `PgSearchEngine`, make sure that you have a Postgres database +configured and make the following changes to your backend: + +1. Add a dependency on `@backstage/plugin-search-backend-module-pg` to your + backend's `package.json`. +2. Initialize the search engine. It is recommended to initialize it with a + fallback to the lunr search engine if you are running Backstage for + development locally with SQLite: + +```typescript +// In packages/backend/src/plugins/search.ts + +// Initialize a connection to a search engine. +const searchEngine = (await PgSearchEngine.supported(database)) + ? await PgSearchEngine.from({ database }) + : new LunrSearchEngine({ logger }); +``` + +## ElasticSearch + +Backstage supports ElasticSearch search engine connections, indexing and +querying out of the box. Available configuration options enable usage of either +AWS or Elastic.co hosted solutions, or a custom self-hosted solution. + +Similarly to Lunr above, ElasticSearch can be set up like this: + +```typescript +// app/backend/src/plugins/search.ts +const searchEngine = await ElasticSearchSearchEngine.initialize({ + logger, + config, +}); +const indexBuilder = new IndexBuilder({ logger, searchEngine }); +``` + +For the engine to be available, your backend package needs a dependency into +package `@backstage/plugin-search-backend-module-elasticsearch`. + +ElasticSearch needs some additional configuration before it is ready to use +within your instance. The configuration options are documented in the +[configuration schema definition file.](https://github.com/backstage/backstage/blob/master/plugins/search-backend-module-elasticsearch/config.d.ts) + +The underlying functionality is using official ElasticSearch client version 7.x, +meaning that ElasticSearch version 7 is the only one confirmed to be supported. + +## Example configurations + +### AWS + +Using AWS hosted ElasticSearch the only configuration option needed is the URL +to the ElasticSearch service. The implementation assumes that environment +variables for AWS access key id and secret access key are defined in accordance +to the +[default AWS credential chain.](https://docs.aws.amazon.com/sdk-for-javascript/v2/developer-guide/setting-credentials-node.html). + +```yaml +search: + elasticsearch: + provider: aws + node: https://my-backstage-search-asdfqwerty.eu-west-1.es.amazonaws.com +``` + +### Elastic.co + +Elastic Cloud hosted ElasticSearch uses a Cloud ID to determine the instance of +hosted ElasticSearch to connect to. Additionally, username and password needs to +be provided either directly or using environment variables like defined in +[Backstage documentation.](https://backstage.io/docs/conf/writing#includes-and-dynamic-data) + +```yaml +search: + elasticsearch: + provider: elastic + cloudId: backstage-elastic:asdfqwertyasdfqwertyasdfqwertyasdfqwerty== + auth: + username: elastic + password: changeme +``` + +### Others + +Other ElasticSearch instances can be connected to by using standard +ElasticSearch authentication methods and exposed URL, provided that the cluster +supports that. The configuration options needed are the URL to the node and +authentication information. Authentication can be handled by either providing +username/password or an API key. For more information how to create an API key, +see +[Elastic documentation on API keys](https://www.elastic.co/guide/en/elasticsearch/reference/current/security-api-create-api-key.html). + +#### Configuration examples + +##### With username and password + +```yaml +search: + elasticsearch: + node: http://localhost:9200 + auth: + username: elastic + password: changeme +``` + +##### With API key + +```yaml +search: + elasticsearch: + node: http://localhost:9200 + auth: + apiKey: base64EncodedKey +``` diff --git a/docs/features/software-catalog/catalog-customization.md b/docs/features/software-catalog/catalog-customization.md index e0228bf7d0..07258a55cb 100644 --- a/docs/features/software-catalog/catalog-customization.md +++ b/docs/features/software-catalog/catalog-customization.md @@ -27,27 +27,33 @@ default catalog page and create a component in a ```tsx // imports, etc omitted for brevity. for full source see: // https://github.com/backstage/backstage/blob/master/plugins/catalog/src/components/CatalogPage/CatalogPage.tsx -export const CustomCatalogPage = () => { +export const CustomCatalogPage = ({ + columns, + actions, + initiallySelectedFilter = 'owned', +}: CatalogPageProps) => { return ( - + - + All your software catalog entities -
- -
+ + +
- - -
+ + + + + + - + ); }; ``` @@ -137,19 +143,27 @@ export const EntitySecurityTierPicker = () => { Now we can add the component to `CustomCatalogPage`: ```diff -export const CustomCatalogPage = () => { +export const CustomCatalogPage = ({ + columns, + actions, + initiallySelectedFilter = 'owned', +}: CatalogPageProps) => { return ( ... - -
+ + +
- - + + + + + + ... }; ``` @@ -173,7 +187,7 @@ new `CustomCatalogIndexPage`. # packages/app/src/App.tsx const routes = ( - + - } /> + } /> ``` diff --git a/docs/features/software-catalog/well-known-annotations.md b/docs/features/software-catalog/well-known-annotations.md index 5f474624f9..c3af6caf2d 100644 --- a/docs/features/software-catalog/well-known-annotations.md +++ b/docs/features/software-catalog/well-known-annotations.md @@ -57,18 +57,48 @@ if the original location delegates to another location. A common case is, that a location is registered as `bootstrap:bootstrap` which means that it is part of the `app-config.yaml` of a Backstage installation. +### backstage.io/orphan + +This annotation is either absent, or present with the exact _string_ value +`"true"`. It should never be added manually. Instead, the catalog itself injects +the annotation as part of its processing loops, on entities that are found to +have no registered locations or config locations that keep them "active" / +"alive". + +For example, suppose that the user first registers a location URL pointing to a +`Location` kind entity, which in turn refers to two `Component` kind entities in +two other files nearby. The end result is that the catalog contains those three +entities. Now suppose that the user edits the original `Location` entity to only +refer to the first of the `Component` kind entities. This will intentionally +_not_ lead to the other `Component` entity to be removed from the catalog (for +safety reasons). Instead, it gains this orphan marker annotation, to make it +clear that user action is required to completely remove it, if desired. + +```yaml +# Example: +metadata: + annotations: + backstage.io/orphan: 'true' +``` + ### backstage.io/techdocs-ref ```yaml # Example: metadata: annotations: - backstage.io/techdocs-ref: url:https://github.com/backstage/backstage/tree/master + backstage.io/techdocs-ref: dir:. ``` -The value of this annotation is a location reference string (see above). If this -annotation is specified, it is expected to point to a repository that the -TechDocs system can read and generate docs from. +The value of this annotation informs _where_ TechDocs source content is stored +so that it can be read and docs can be generated from it. Most commonly, it's +written as a path, relative to the location of the `catalog-info.yaml` itself, +where the associated `mkdocs.yml` file can be found. + +In unusual situations where the documentation for a catalog entity does not live +alongside the entity's source code, the value of this annotation can point to an +absolute URL, matching the location reference string format outlined above, for +example: `url:https://github.com/backstage/backstage/tree/master` ### backstage.io/view-url, backstage.io/edit-url diff --git a/docs/features/software-templates/configuration.md b/docs/features/software-templates/configuration.md index cdd8166889..737f77f67b 100644 --- a/docs/features/software-templates/configuration.md +++ b/docs/features/software-templates/configuration.md @@ -33,9 +33,12 @@ scaffolder: ### Disabling Docker in Docker situation (Optional) -Software Templates use -[Cookiecutter](https://github.com/cookiecutter/cookiecutter) as a templating -library. By default it will use the +Software templates use the `fetch:template` action by default, which requires no +external dependencies and offers a +[Cookiecutter-compatible mode](https://backstage.io/docs/features/software-templates/builtin-actions#using-cookiecuttercompat-mode). +There is also a `fetch:cookiecutter` action, which uses +[Cookiecutter](https://github.com/cookiecutter/cookiecutter) directly for +templating. By default, the `fetch:cookiecutter` action will use the [scaffolder-backend/Cookiecutter](https://github.com/backstage/backstage/blob/master/plugins/scaffolder-backend/scripts/Cookiecutter.dockerfile) docker image. diff --git a/docs/features/techdocs/configuration.md b/docs/features/techdocs/configuration.md index ef6a80d44c..4bb6857106 100644 --- a/docs/features/techdocs/configuration.md +++ b/docs/features/techdocs/configuration.md @@ -24,13 +24,13 @@ techdocs: runIn: 'docker' - # techdocs.generator.dockerImage can be used to control the docker image used during documentation generation. This can be useful + # (Optional) techdocs.generator.dockerImage can be used to control the docker image used during documentation generation. This can be useful # if you want to use MkDocs plugins or other packages that are not included in the default techdocs-container (spotify/techdocs). # NOTE: This setting is only used when techdocs.generator.runIn is set to 'docker'. dockerImage: 'spotify/techdocs' - # techdocs.generator.pullImage can be used to disable pulling the latest docker image by default. This can be useful when you are + # (Optional) techdocs.generator.pullImage can be used to disable pulling the latest docker image by default. This can be useful when you are # using a custom techdocs.generator.dockerImage and you have a custom docker login requirement. For example, you need to login to # AWS ECR to pull the docker image. # NOTE: Disabling this requires the docker image was pulled by other means before running the techdocs generator. diff --git a/docs/features/techdocs/creating-and-publishing.md b/docs/features/techdocs/creating-and-publishing.md index 3fdc942ac4..93ce3ad4d9 100644 --- a/docs/features/techdocs/creating-and-publishing.md +++ b/docs/features/techdocs/creating-and-publishing.md @@ -66,9 +66,7 @@ Update your component's entity description by adding the following lines to its ```yaml metadata: annotations: - backstage.io/techdocs-ref: url:https://github.com/org/repo - # Or - # backstage.io/techdocs-ref: url:https://github.com/org/repo/tree/branchName/subFolder + backstage.io/techdocs-ref: dir:. ``` The diff --git a/docs/features/techdocs/getting-started.md b/docs/features/techdocs/getting-started.md index cf0bbb0de1..cf4bb9d005 100644 --- a/docs/features/techdocs/getting-started.md +++ b/docs/features/techdocs/getting-started.md @@ -204,7 +204,7 @@ techdocs: builder: 'local' publisher: type: 'local' - generators: + generator: techdocs: local ``` diff --git a/docs/features/techdocs/how-to-guides.md b/docs/features/techdocs/how-to-guides.md index 3f3c92d0de..e1533498d7 100644 --- a/docs/features/techdocs/how-to-guides.md +++ b/docs/features/techdocs/how-to-guides.md @@ -35,38 +35,64 @@ In your Backstage instance's `app-config.yaml`, set `techdocs.builder` from `'local'` to `'external'`. By doing this, TechDocs will not try to generate docs. Look at [TechDocs configuration](configuration.md) for reference. -## How to use URL Reader in TechDocs Prepare step? +## How to understand techdocs-ref annotation values -If TechDocs is configured to generate docs, it will first download the -repository associated with the `backstage.io/techdocs-ref` annotation defined in -the Entity's `catalog-info.yaml` file. This is also called the +If TechDocs is configured to generate docs, it will first download source files +based on the value of the `backstage.io/techdocs-ref` annotation defined in the +Entity's `catalog-info.yaml` file. This is also called the [Prepare](./concepts.md#techdocs-preparer) step. -There are two kinds of preparers or two ways of downloading these source files +We strongly recommend that the `backstage.io/techdocs-ref` annotation in each +documented catalog entity's `catalog-info.yaml` be set to `dir:.` in almost all +situations. This is because TechDocs is aligned with the "docs like code" +philosophy, whereby documentation should be authored and managed alongside the +source code of the underlying software itself. -- Preparer 1: Doing a `git clone` of the repository (also known as Common Git - Preparer) -- Preparer 2: Downloading an archive.zip or equivalent of the repository (also - known as URL Reader) +When you see `dir:.`, you can translate it to mean: -If `backstage.io/techdocs-ref` is equal to any of these - +- That the documentation source code lives in the same location as the + `catalog-info.yaml` file. +- That, in particular, the `mkdocs.yml` file is a sibling of `catalog-info.yaml` + (meaning, it is in the same directory) +- And that all of the source content of the documentation would be available if + one were to download the directory containing those two files (as well as all + sub-directories). -1. `github:https://githubhost.com/org/repo` -2. `gitlab:https://gitlabhost.com/org/repo` -3. `bitbucket:https://bitbuckethost.com/project/repo` -4. `azure/api:https://azurehost.com/org/project` +The directory tree of the entity would look something like this: -Then Common Git Preparer will be used i.e. a `git clone`. But the URL Reader is -a much faster way to do this step. Convert the `backstage.io/techdocs-ref` -values to the following - +``` +├── catalog-info.yaml +├── mkdocs.yml +└── docs + └── index.md +``` -1. `url:https://githubhost.com/org/repo/tree/` -2. `url:https://gitlabhost.com/org/repo/tree/` -3. `url:https://bitbuckethost.com/project/repo/src/` -4. `url:https://azurehost.com/organization/project/_git/repository` +If, for example, you wanted to keep a lean root directory, you could place your +`mkdocs.yml` file in a subdirectory and update the `backstage.io/techdocs-ref` +annotation value accordingly, e.g. to `dir:./sub-folder`: -Note that you can also provide a path to a non-root directory inside the -repository which contains the `docs/` directory. +``` +├── catalog-info.yaml +└── sub-folder + ├── mkdocs.yml + └── docs + └── index.md +``` + +In rare situations where your TechDocs source content is managed and stored in a +location completely separate from your `catalog-info.yaml`, you can instead +specify a URL location reference, the exact value of which will vary based on +the source code hosting provider. Notice that instead of the `dir:` prefix, the +`url:` prefix is used instead. For example: + +- **GitHub**: `url:https://githubhost.com/org/repo/tree/` +- **GitLab**: `url:https://gitlabhost.com/org/repo/tree/` +- **Bitbucket**: `url:https://bitbuckethost.com/project/repo/src/` +- **Azure**: `url:https://azurehost.com/organization/project/_git/repository` + +Note, just as it's possible to specify a subdirectory with the `dir:` prefix, +you can also provide a path to a non-root directory inside the repository which +contains the `mkdocs.yml` file and `docs/` directory. e.g. `url:https://github.com/backstage/backstage/tree/master/plugins/techdocs-backend/examples/documented-component` diff --git a/docs/features/techdocs/using-cloud-storage.md b/docs/features/techdocs/using-cloud-storage.md index 159137c879..6d221bd9ad 100644 --- a/docs/features/techdocs/using-cloud-storage.md +++ b/docs/features/techdocs/using-cloud-storage.md @@ -61,7 +61,7 @@ If you do not prefer (3a) and optionally like to use a service account, you can follow these steps. Create a new Service Account and a key associated with it. In roles of the -service account, use "Storage Admin". +service account, use "Storage Object Admin". If you want to create a custom role, make sure to include both `get` and `create` permissions for both "Objects" and "Buckets". See @@ -143,6 +143,8 @@ permissions to: - `s3:ListBucket` to retrieve bucket metadata - `s3:PutObject` to upload files to the bucket +- `s3:DeleteObject` and `s3:DeleteObjectVersion` to delete stale content during + re-publishing To _read_ TechDocs from the S3 bucket the IAM policy needs to have at a minimum permissions to: @@ -345,6 +347,10 @@ techdocs: accountKey: ${TECHDOCS_AZURE_BLOB_STORAGE_ACCOUNT_KEY} ``` +In either case, the account or credentials used to access your container and all +TechDocs objects underneath it should have the `Storage Blog Data Owner` role +applied, in order to read, write, and delete objects as needed. + **4. That's it!** Your Backstage app is now ready to use Azure Blob Storage for TechDocs, to store diff --git a/docs/getting-started/app-custom-theme.md b/docs/getting-started/app-custom-theme.md index aa3851463f..7973a54ab6 100644 --- a/docs/getting-started/app-custom-theme.md +++ b/docs/getting-started/app-custom-theme.md @@ -35,7 +35,7 @@ If you want more control over the theme, and for example customize font sizes and margins, you can use the lower-level `createThemeOverrides` function exported by [@backstage/theme](https://www.npmjs.com/package/@backstage/theme) in combination with -[createMuiTheme](https://material-ui.com/customization/theming/#createmuitheme-options-args-theme) +[createTheme](https://material-ui.com/customization/theming/#createmuitheme-options-args-theme) from [@material-ui/core](https://www.npmjs.com/package/@material-ui/core). See the [@backstage/theme source](https://github.com/backstage/backstage/tree/master/packages/theme/src) diff --git a/docs/getting-started/index.md b/docs/getting-started/index.md index 13b52181df..b01afac5c3 100644 --- a/docs/getting-started/index.md +++ b/docs/getting-started/index.md @@ -24,11 +24,9 @@ an easier path to make Pull Requests. Backstage provides the `@backstage/create-app` package to scaffold standalone instances of Backstage. You will need to have [Node.js](https://nodejs.org/en/download/) Active LTS Release installed -(currently v14), [Yarn](https://classic.yarnpkg.com/en/docs/install) and -[Python](https://www.python.org/downloads/) (although you likely have it -already). You will also need to have -[Docker](https://docs.docker.com/engine/install/) installed to use some features -like Software Templates and TechDocs. +(currently v14) and [Yarn](https://classic.yarnpkg.com/en/docs/install). You +will also need to have [Docker](https://docs.docker.com/engine/install/) +installed to use some features like Software Templates and TechDocs. Using `npx` you can then run the following to create an app in a chosen subdirectory of your current working directory: diff --git a/docs/integrations/aws-s3/locations.md b/docs/integrations/aws-s3/locations.md new file mode 100644 index 0000000000..fe1c6050c2 --- /dev/null +++ b/docs/integrations/aws-s3/locations.md @@ -0,0 +1,42 @@ +--- +id: locations +sidebar_label: Locations +title: Amazon Web Services S3 Locations +# prettier-ignore +description: Setting up an integration with Amazon Web Services S3 +--- + +The AWS S3 integration supports loading catalog entities from an S3 Bucket. +Entities can be added to +[static catalog configuration](../../features/software-catalog/configuration.md), +or registered with the +[catalog-import](https://github.com/backstage/backstage/tree/master/plugins/catalog-import) +plugin. + +## Configuration + +To use this integration, add configuration to your `app-config.yaml`: + +```yaml +integrations: + awsS3: + - host: amazonaws.com + accessKeyId: ${AWS_ACCESS_KEY_ID} + secretAccessKey: ${AWS_SECRET_ACCESS_KEY} +``` + +Then make sure the environment variables `AWS_ACCESS_KEY_ID` and +`AWS_SECRET_ACCESS_KEY` are set when you run Backstage. + +Users with multiple AWS accounts may want to use a role for S3 storage that is +in a different AWS account. Using the `roleArn` parameter as seen below, you can +instruct the AWS S3 reader to assume a role before accessing S3: + +```yaml +integrations: + awsS3: + - host: amazonaws.com + accessKeyId: ${AWS_ACCESS_KEY_ID} + secretAccessKey: ${AWS_SECRET_ACCESS_KEY} + roleArn: 'arn:aws:iam::xxxxxxxxxxxx:role/example-role' +``` diff --git a/docs/integrations/bitbucket/discovery.md b/docs/integrations/bitbucket/discovery.md index 1538806e39..708acd8db2 100644 --- a/docs/integrations/bitbucket/discovery.md +++ b/docs/integrations/bitbucket/discovery.md @@ -56,13 +56,11 @@ matching repository is processed. repository. ```typescript -const customRepositoryParser: BitbucketRepositoryParser = async function* customRepositoryParser({ - client, - repository, -}) { - // Custom logic for interpret the matching repository. - // See defaultRepositoryParser for an example -}; +const customRepositoryParser: BitbucketRepositoryParser = + async function* customRepositoryParser({ client, repository }) { + // Custom logic for interpret the matching repository. + // See defaultRepositoryParser for an example + }; const processor = BitbucketDiscoveryProcessor.fromConfig(env.config, { parser: customRepositoryParser, diff --git a/docs/overview/roadmap.md b/docs/overview/roadmap.md index 0013c99c6b..fa34ca3d9a 100644 --- a/docs/overview/roadmap.md +++ b/docs/overview/roadmap.md @@ -1,116 +1,185 @@ --- id: roadmap -title: Project roadmap -description: Roadmap of Backstage Project +title: Roadmap +description: Roadmap of Backstage --- -## Current status +## The Backstage Roadmap -> Backstage is currently under rapid development. This means that you can expect -> APIs and features to evolve. It is also recommended that teams who adopt -> Backstage today [upgrade their installation](../cli/commands.md#versionsbump) -> as new [releases](https://github.com/backstage/backstage/releases) become -> available, as Backwards compatibility is not yet guaranteed. +Backstage is currently under rapid development. This page details the project’s +public roadmap, the result of ongoing collaboration between the core maintainers +and the broader Backstage community. Treat the roadmap as an ever-evolving guide +to keep us aligned as a community on: -## Phases +- Upcoming enhancements and benefits, +- Planning contributions and support, +- Planning the project’s adoption, +- Understanding what things are coming soon, +- Avoiding duplication of work -We have divided the project into three high-level _phases_: +### How to influence the roadmap -- 🐣 **Phase 1:** Extensible frontend platform (Done ✅) - You will be able to - easily create a single consistent UI layer for your internal infrastructure - and tools. A set of reusable - [UX patterns and components](https://backstage.io/storybook) help ensure a - consistent experience between tools. +As we evolve Backstage, we want you to contribute actively in the journey to +define the most effective developer experience in the world. -- 🐢 **Phase 2:** Software Catalog - ([alpha released](https://backstage.io/blog/2020/06/22/backstage-service-catalog-alpha)) - - With a single catalog, Backstage makes it easy for a team to manage ten - services — and makes it possible for your company to manage thousands of them. +A roadmap is only useful if it captures real needs. If you have success stories, +feedback, or ideas, we want to hear from you! If you plan to work (or are +already working) on a new or existing feature, please let us know, so that we +can update the roadmap accordingly. We are also happy to share knowledge and +context that will help your feature land successfully. -- 🐇 **Phase 3:** Ecosystem (ongoing, see - [Plugin Marketplace](https://backstage.io/plugins)) - Everyone's - infrastructure stack is different. By fostering a vibrant community of - contributors we hope to provide an ecosystem of Open Source - plugins/integrations that allows you to pick the tools that match your stack. - -## Detailed roadmap - -If you have questions about the roadmap or want to provide feedback, we would -love to hear from you! Please create an -[Issue](https://github.com/backstage/backstage/issues/new/choose), ping us on -[Discord](https://discord.gg/EBHEGzX) or reach out directly at -[backstage-interest@spotify.com](mailto:backstage-interest@spotify.com). - -Want to help out? Awesome ❤️ Head over to +You can also head over to the [CONTRIBUTING](https://github.com/backstage/backstage/blob/master/CONTRIBUTING.md) guidelines to get started. -### Ongoing work 🚧 +If you have specific questions about the roadmap, please create an +[issue](https://github.com/backstage/backstage/issues/new/choose), ping us on +[Discord](https://discord.gg/awD6SxgQ), or +[book time](http://calendly.com/spotify-backstage) with the Spotify team. -- **[Platform stabilization](https://github.com/backstage/backstage/milestone/19)** - - Stabilize the core of Backstage, including its core features, so that the - platform can be depended on for production use. After this, plugins will - require little-to-no maintenance. +### How to read the roadmap -- **[Kubernetes plugin for service owners](https://github.com/backstage/backstage/issues/2857)** - - Improve native support for Kubernetes, making it easier for service owners to - see and manage their services running in K8s, regardless if that's locally, in - AWS, GCS, Azure, or elsewhere. +The Backstage roadmap lays out both [“what’s next”](#whats-next) and +[“future work”](#future-work). With "next" we mean features planned for release +within the ongoing quarter starting in July until September 2021 included. With +"future" we mean features in the radar, but not yet scheduled. -- **[Search platform](../features/search/README.md)** - Evolve the basic search - functionality currently available into a platform that **a)** enables search - across the software catalog, TechDocs, and any other information exposed by - plugins, and **b)** supports a variety of search engine technologies. +The long-term roadmap (12 - 36 months) is not detailed in the public roadmap. +Third-party contributions are also not currently included in the roadmap. Let us +know about any ongoing developments and we’re happy to include it here as well. -- **[Software Templates V2](https://github.com/backstage/backstage/issues/2771)** - - Expand the templates to make the steps more composable by adding the ability - to add more steps for custom logic, including webhooks and using authorization - from integrations. +### Roadmap evolution -### Future work 🔮 +Will this roadmap change? Obviously! -- **Golden Path for Plugin Development** - Create an easy, standardized way for - developers to build plugins that will encourage contributions and lead to a - richer ecosystem for everyone. +Roadmap are always evolving and ours is no different; you can expect to see this +updated roughly every month. -- **[GraphQL API](https://github.com/backstage/backstage/milestone/13)** - A - GraphQL API will open up the rich metadata provided by Backstage in a single - query. Plugins can easily query this API as well as extend the model where - needed. +## What’s next -- **Inter-Plugin Communication** - **[Under consideration]** Establish more - clearly defined patterns for plugins to communicate. +The feature set below is planned for the ongoing quarter, and grouped by theme. +The list order doesn’t necessarily reflect priority, and the development/release +cycle will vary based on maintainer schedules. -- **Improved Access Control** - **[Under consideration]** Provide finer grained - access controls and management for better control of the platform user - experience. +### Backstage Core -### Plugins +The following features are planned for release: -Building and maintaining [plugins](https://backstage.io/plugins) is the work of -the entire Backstage community. +- **Composable homepage:** We’re seeing lots of interest from the community in + reusable components to build a homepage experience where users can easily + surface what they might find useful to start their tasks. Check out the + [milestone](https://github.com/backstage/backstage/milestone/34) for further + details. +- **Improved responsiveness:** Check out the + [RFC here](https://github.com/backstage/backstage/issues/6318) for further + details on how to improve the responsiveness for Backstage's UI. -A list of plugins that are in development is -[available here](https://github.com/backstage/backstage/issues?q=is%3Aissue+is%3Aopen+label%3Aplugin+sort%3Areactions-%2B1-desc). -We strongly recommend to upvote 👍 plugins you are interested in. This helps us -and the community prioritize what plugins to build. +### Software Templates -Are you missing a plugin for your favorite tool? Please -[suggest a new one](https://github.com/backstage/backstage/issues/new?labels=plugin&template=plugin_template.md&title=%5BPlugin%5D+THE+PLUGIN+NAME). -Chances are that someone will jump in and help build it. +The following features are planned for release:: -### Community Initiatives 🧑‍🤝‍🧑 +- **Re-creation/resubmission in case of failure:** Speed up productivity by + allowing developers to relaunch a project after a failure or any unexpected + problem. In the current version, this task requires retyping and a full + re-creation from scratch. +- **Performance and usability improvements for contributors:** Reach a relevant + improvement in templating's performance through the replacement of + [handlebars](https://handlebarsjs.com/). Other replacements will be considered + as part of this task (possibly + [cookiecutter](https://cookiecutter.readthedocs.io/)) for easier software + template creation, allowing more contributors to reach their goals without + having to learn new tooling. +- **Improved extensibility through inclusion:** Make software templates more + maintainable and extensible by adding `$include` support for parameters. +- **Authenticated job creation:** Created jobs will be able to run with an + authenticated user with all actions tracked for future consumption and + evidence. Track users creating jobs and make “jobs created by me” reporting + available. -- [**Backstage Community Sessions**](https://github.com/backstage/community#meetups) - - A monthly meetup for the community to come together to share and learn about - the latest happenings in Backstage. +### Software Catalog -- **Backstage Hackathons** - (Coming soon) Open to everyone in our Backstage - community, a celebration of you, the project and building awesome things - together +The following features are planned for release: -### Completed milestones ✅ +- **Request For Comments (RFC) for composability improvements (routing):** + Enable plugins to be auto-added and make plugin installation and upgrades + easier for all Backstage users. This includes information card layouts, entity + pages containing content and hooking the external header, considering the + support of a separate deployment, and configuration for plugins. +- **Removing duplicated entities in catalog:** As any adopter knows, a software + catalog can contain thousands or more entities and it is very important to + avoid duplications in naming to prevent failures. With this development task, + two entities with the same name won't be allowed as described + [here](https://github.com/backstage/backstage/issues/4760). +- **Connecting identity to ownership to prepare for role-based access control + ([RBAC](https://en.wikipedia.org/wiki/Role-based_access_control)):** This is a + first step to supporting RBAC for the software catalog (see the + [future work section](#future-work) for further details). Provide each entity + within the software catalog with a recognized owner. +- **Catalog performance improvements through improved caching:** Fix the + performance gaps in the catalog processor, which currently doesn’t have a + strong caching mechanism. The current version often requires fetching a + relevant amount of data, especially at scale. +### Search + +The following features are planned for release: + +- ElasticSearch integration: Add ElasticSearch to the Search Platform as the + underlying search engine. Check out the + [milestone here](https://github.com/backstage/backstage/milestone/27) for + further details. + +### TechDocs + +The following features are planned for release: + +- **TechDocs beta release:** Fix remaining bugs to get TechDocs to Beta. Check + out the [milestone here](https://github.com/backstage/backstage/milestone/29) + for further details. + +## Future work + +The following feature list doesn’t represent a commitment to develop and the +list order doesn’t reflect any priority or importance. But these features are on +the maintainers’ radar, with clear interest expressed by the community. + +- **Improved UX design:** Provide a better Backstage user experience through + visual guidelines and templates, especially navigation across plug-ins and + portal functionalities. +- **Catalog composability (routing):** Follow up development after the RFC + planned for the ongoing quarter (see [what’s next](#whats-next) for further + details). +- **Catalog-import improvements:** Provide a faster (scalability) and better + (more features like move/rename) way to import entities into the Software + Catalog. Importing items in the Software Catalog is crucial for creating a + Backstage proof-of-concept or testing/planning for broader organizational + adoption. This enhancement better supports getting developers to use Backstage + with less effort and customization. +- **Catalog improvements:** Add pagination and sourcing to Software Catalog. +- **[GraphQL](https://graphql.org/) support:** Introduce the ability to query + Backstage backend services with a standard query language for APIs. +- **Software templates performance improvements through decoupling a separate + worker:** Improve performance through decoupling resource-consuming services + and making them asynchronous. In the current version, project auto-creation + through the Software Templating system can consume a lot of resources and + bottleneck many concurrent projects created simultaneously. +- **API discovery and documentation:** Add better support for the + [gRPC](https://grpc.io/). +- **Adding TechDocs search to the Search Platform:** Having this capability in + place will provide a better and new major version of the Search Platform + (v3.0). You can refer to the + [milestone here](https://github.com/backstage/backstage/milestone/28) for + further details. +- **TechDocs GA release:** Work toward enhancements necessary to get TechDocs to + general availability. Check out the + [milestone here](https://github.com/backstage/backstage/milestone/30) for + further details. + +## Completed milestones + +Read more about the completed (and released) features for reference. + +- [[Search] Out-of-the-Box Implementation (Alpha)](https://github.com/backstage/backstage/milestone/26) - [Deploy a product demo at `demo.backstage.io`](https://demo.backstage.io) - [Kubernetes plugin - v1](https://github.com/backstage/backstage/tree/master/plugins/kubernetes) - [Helm charts](https://github.com/backstage/backstage/tree/master/contrib/chart/backstage) diff --git a/docs/overview/stability-index.md b/docs/overview/stability-index.md index 2b730024fd..ee2628a893 100644 --- a/docs/overview/stability-index.md +++ b/docs/overview/stability-index.md @@ -312,14 +312,6 @@ configuration. Stability: `1` -### `register-component` [GitHub](https://github.com/backstage/backstage/tree/master/plugins/register-component/) - -A frontend plugin that allows the user to register entity locations in the -catalog. - -Stability: `0`. This plugin is likely to be replaced by a generic entity import -plugin instead. - ### `scaffolder` [GitHub](https://github.com/backstage/backstage/tree/master/plugins/scaffolder/) The frontend scaffolder plugin where one can browse templates and initiate diff --git a/docs/plugins/github-apps.md b/docs/plugins/github-apps.md index 805e321093..f9f7590e09 100644 --- a/docs/plugins/github-apps.md +++ b/docs/plugins/github-apps.md @@ -89,6 +89,26 @@ integrations: - $include: example-backstage-app-credentials.yaml ``` +### Limiting the GitHub App installations + +If you want to limit the GitHub app installations visible to backstage you may +optionally include the `allowedInstallationOwners` option. + +```yaml +appId: 1 +allowedInstallationOwners: ['GlobexCorp'] +clientId: client id +clientSecret: client secret +webhookSecret: webhook secret +privateKey: | + -----BEGIN RSA PRIVATE KEY----- + ...Key content... + -----END RSA PRIVATE KEY----- +``` + +This will result in backstage preventing the use of any installation that is not +within the allow list. + ### Permissions for pull requests These are the minimum permissions required for creating a pull request with diff --git a/docs/plugins/structure-of-a-plugin.md b/docs/plugins/structure-of-a-plugin.md index beffcdb313..99a55745c5 100644 --- a/docs/plugins/structure-of-a-plugin.md +++ b/docs/plugins/structure-of-a-plugin.md @@ -99,15 +99,14 @@ You may tweak these components, rename them and/or replace them completely. ## Connecting the plugin to the Backstage app -There are three things needed for a Backstage app to start making use of a -plugin. +There are two things needed for a Backstage app to start making use of a plugin. 1. Add plugin as dependency in `app/package.json` 2. Import and use one or more plugin extensions, for example in `app/src/App.tsx`. -Luckily these three steps happen automatically when you create a plugin with the -Backstage CLI. +Luckily both of these steps happen automatically when you create a plugin with +the Backstage CLI. ## Talking to the outside world diff --git a/lerna.json b/lerna.json index dd2dd884eb..322929db1d 100644 --- a/lerna.json +++ b/lerna.json @@ -2,5 +2,5 @@ "packages": ["packages/*", "plugins/*"], "npmClient": "yarn", "useWorkspaces": true, - "version": "0.1.1" + "version": "0.1.0" } diff --git a/microsite/blog/2021-07-26-software-templates-are-now-in-beta.md b/microsite/blog/2021-07-26-software-templates-are-now-in-beta.md new file mode 100644 index 0000000000..b646fbdb22 --- /dev/null +++ b/microsite/blog/2021-07-26-software-templates-are-now-in-beta.md @@ -0,0 +1,68 @@ +--- +title: Software Templates is now in Beta +author: Ben Lambert, Spotify +authorURL: https://github.com/benjdlambert +authorImageURL: https://avatars.githubusercontent.com/u/3645856?v=4 +--- + +![Software Templates in Beta](assets/21-07-26/backstage-software-templates-beta.gif) + +**TLDR**; At a high level, Backstage performs three main jobs: [Create, Manage, and Explore](https://backstage.io/blog/2021/05/20/adopting-backstage#three-jobs-create-manage-explore). Throughout the year, we’ve been focussed on improving the stability and scalability of these areas while enhancing the feature sets based upon requests from the community. Software Templates — which enable push-button deployments with all your standards and best practices built-in — is our first feature-complete release candidate to graduate to beta. Read on to learn how this release improves template customization and flexibility, as well as performance. + + + +Let’s rewind a little bit, around a year in fact. Backstage had been open sourced, and we released our first version of Software Templates and our Scaffolder plugin. + +In case you missed it, [Software Templates](https://backstage.io/blog/2020/08/05/announcing-backstage-software-templates) are part of the Create feature set, where you can set up Backstage to give your engineers the ability to spin up a new microservice, website, or any other software component with your organization’s best practices built-in, right from the start. + +Back when we released the first version of these templates, with the `apiVersion` `backstage.io/v1alpha1`, they were a little restrictive in what they could do. The generated repository could only have one template source and it was restricted to only being [cookiecutter](https://github.com/cookiecutter/cookiecutter) templates. And it had to fit into the three stages of templating which was `Prepare`, `Template`, and `Publish`. + +We [opened up for feedback](https://github.com/backstage/backstage/issues/2771) from the community knowing that this wasn’t going to be the final version, but something of a stepping stone to where we want to be in the future. + +And now we come to today… + +## Anddddd… Action(s)! 🎬 + +Following the removal of the previously deprecated `backstage.io/v1alpha1` templates, today we’re officially announcing the beta version of Software Templates, or `backstage.io/v1beta2`. + +With it comes an entirely new architecture to the Software Templates functionality, and a load of new exciting features, which I’ll dig into a little deeper. + +### Template actions + +We’ve totally opened up the ability to compose your own workflows for each Template that you have registered in Software Templates. This means no restrictions on where your template skeleton is kept, and no restrictions on what your workflow should look like. + +Template Actions are customizable JavaScript functions that allow you to extend the capabilities of the Software Templates by adding your own business logic or reusing some of our Built-In actions. + +![New template syntax with actions](assets/21-07-26/example-template-code.png) + +_An example of the new template syntax with steps and parameters_ + +The workflow for Software Templates are now step-based, and each Software Template can have a customizable amount of steps which will in turn call these new actions. + +![New steps being rendered in the frontend](assets/21-07-26/steps-running.gif) + +_An example of a Template with customizable steps_ + +These actions are very heavily inspired by GitHub Actions and GitHub Workflows, and we’ve given back a lot of control to the template authors so they can build the boilerplate and push the code however they want. + +### Custom UI extensions + +A large part of the Software Templates feature is the form that we use to collect user input which is then passed on to these new actions. Sometimes, it makes sense that Template Authors want to provide their own React components which can be rendered in the frontend to maybe do some more complex things like calling internal APIs to provide autocomplete. + +This is now possible with the new `ScaffolderFieldExtensions`. + +![Custom UI extensions](assets/21-07-26/custom-components.gif) + +_An example of `ScaffolderFieldExtension` is the `OwnerPicker` component which can automatically add options and suggest typeahead with data from an async API request_ + +Template Authors can create their own components to provide data to the custom actions in any way you see fit, and even override our own built in ones too like the `RepoUrlPicker`. + +### Horizontal scalability + +The Scaffolder Service and Software Templates are now horizontally scalable, coordinating work between your deployed backend machines. This means now that the number of instances of the `@backstage/plugin-scaffolder-backend` plugin you have, is the same amount of jobs that you can have in parallel. This ensures that your tasks are handled quickly and reliably, while providing great feedback in the process. + +## Try out the new templates + +We’re still on the journey to making the Software Templates a great user experience for both authors and developers — but we’re not done yet, so watch this space for new exciting features to come! + +In the meantime, make sure to visit the documentation for [building templates](https://backstage.io/docs/features/software-templates/adding-templates) or creating your own [custom actions](https://backstage.io/docs/features/software-templates/writing-custom-actions). diff --git a/microsite/blog/assets/21-07-26/backstage-software-templates-beta.gif b/microsite/blog/assets/21-07-26/backstage-software-templates-beta.gif new file mode 100644 index 0000000000..f67113f44c Binary files /dev/null and b/microsite/blog/assets/21-07-26/backstage-software-templates-beta.gif differ diff --git a/microsite/blog/assets/21-07-26/custom-components.gif b/microsite/blog/assets/21-07-26/custom-components.gif new file mode 100644 index 0000000000..d9c78db33f Binary files /dev/null and b/microsite/blog/assets/21-07-26/custom-components.gif differ diff --git a/microsite/blog/assets/21-07-26/example-template-code.png b/microsite/blog/assets/21-07-26/example-template-code.png new file mode 100644 index 0000000000..1205adf657 Binary files /dev/null and b/microsite/blog/assets/21-07-26/example-template-code.png differ diff --git a/microsite/blog/assets/21-07-26/steps-running.gif b/microsite/blog/assets/21-07-26/steps-running.gif new file mode 100644 index 0000000000..d824464bac Binary files /dev/null and b/microsite/blog/assets/21-07-26/steps-running.gif differ diff --git a/microsite/data/plugins/xcmetrics.yaml b/microsite/data/plugins/xcmetrics.yaml new file mode 100644 index 0000000000..f2f4f7c013 --- /dev/null +++ b/microsite/data/plugins/xcmetrics.yaml @@ -0,0 +1,9 @@ +--- +title: XCMetrics +author: Spotify +authorUrl: https://github.com/spotify +category: Monitoring +description: Discover valuable insights hiding inside Xcode’s build logs. +documentation: https://xcmetrics.io/ +iconUrl: img/xcmetrics-icon.png +npmPackageName: '@backstage/plugin-xcmetrics' diff --git a/microsite/package.json b/microsite/package.json index eee549fb70..532bb62d15 100644 --- a/microsite/package.json +++ b/microsite/package.json @@ -16,7 +16,7 @@ "lock:check": "yarn-lock-check" }, "devDependencies": { - "@spotify/prettier-config": "^10.0.0", + "@spotify/prettier-config": "^11.0.0", "docusaurus": "^2.0.0-alpha.70", "js-yaml": "^4.1.0", "prettier": "^2.3.2", diff --git a/microsite/pages/en/index.js b/microsite/pages/en/index.js index d7325bb234..ec80bbc01f 100644 --- a/microsite/pages/en/index.js +++ b/microsite/pages/en/index.js @@ -212,9 +212,9 @@ class Index extends React.Component { Backstage Software Templates{' '} - (alpha) + (beta) Standards can set you free @@ -292,7 +292,7 @@ class Index extends React.Component { Build your own software templates Contribute diff --git a/microsite/sidebars.json b/microsite/sidebars.json index 5999524073..d787fb28aa 100644 --- a/microsite/sidebars.json +++ b/microsite/sidebars.json @@ -80,7 +80,8 @@ "features/search/search-overview", "features/search/getting-started", "features/search/concepts", - "features/search/architecture" + "features/search/architecture", + "features/search/search-engines" ] }, { @@ -103,6 +104,11 @@ ], "Integrations": [ "integrations/index", + { + "type": "subcategory", + "label": "AWS S3", + "ids": ["integrations/aws-s3/locations"] + }, { "type": "subcategory", "label": "Azure", diff --git a/microsite/static/css/custom.css b/microsite/static/css/custom.css index 2c8b46ff00..393a5af118 100644 --- a/microsite/static/css/custom.css +++ b/microsite/static/css/custom.css @@ -288,6 +288,16 @@ td { .tocToggler { display: none; } + + .docsSliderActive .toc section .navGroups { + padding-top: 0; + padding-bottom: 0; + } + + .docsSliderActive.docsNavContainer { + background-color: #121212; + padding-bottom: 0; + } } /* content */ diff --git a/microsite/static/img/xcmetrics-icon.png b/microsite/static/img/xcmetrics-icon.png new file mode 100644 index 0000000000..09f3ea1e68 Binary files /dev/null and b/microsite/static/img/xcmetrics-icon.png differ diff --git a/microsite/yarn.lock b/microsite/yarn.lock index 1da9288808..0f7ddb9c60 100644 --- a/microsite/yarn.lock +++ b/microsite/yarn.lock @@ -909,10 +909,10 @@ resolved "https://registry.npmjs.org/@sindresorhus/is/-/is-0.7.0.tgz#9a06f4f137ee84d7df0460c1fdb1135ffa6c50fd" integrity sha512-ONhaKPIufzzrlNbqtWFFd+jlnemX6lJAgq9ZeiZtS7I1PIf/la7CW4m83rTXRnVnsMbW2k56pGYu7AUFJD9Pow== -"@spotify/prettier-config@^10.0.0": - version "10.0.0" - resolved "https://registry.npmjs.org/@spotify/prettier-config/-/prettier-config-10.0.0.tgz#fa076d98d2e7e6c53dd3d86a696307a7010bd056" - integrity sha512-VYOdo8P7lIScAkl02nB9KpUAuOYMManryBIBuKJkAw5D3aVtLobfmdIKvdV6MqEmGMEQPbn7w/UpnjJYhUH+IA== +"@spotify/prettier-config@^11.0.0": + version "11.0.0" + resolved "https://registry.npmjs.org/@spotify/prettier-config/-/prettier-config-11.0.0.tgz#d91e0546a8c1c0f7299e2edc7e44306e9be210f6" + integrity sha512-dOI13j1uHMZkRxhZuge/ugOE7Aqcg7Nxki932lDZuXyY4G8CGxkc/66PeQ8pR4PCzThHORXo7Ptvau6bh101lQ== "@types/cheerio@^0.22.8": version "0.22.23" diff --git a/mkdocs.yml b/mkdocs.yml index 4d984e63e3..73ad52341e 100644 --- a/mkdocs.yml +++ b/mkdocs.yml @@ -64,6 +64,7 @@ nav: - Getting Started: 'features/search/getting-started.md' - Concepts: 'features/search/concepts.md' - Search Architecture: 'features/search/architecture.md' + - Search Engines: 'features/search/search-engines.md' - TechDocs: - Overview: 'features/techdocs/README.md' - Getting Started: 'features/techdocs/getting-started.md' @@ -78,6 +79,8 @@ nav: - FAQ: 'features/techdocs/FAQ.md' - Integrations: - Overview: 'integrations/index.md' + - AWS S3: + - Locations: 'integrations/aws-s3/locations.md' - Azure: - Locations: 'integrations/azure/locations.md' - Org Data: 'integrations/azure/org.md' diff --git a/package.json b/package.json index 93517d3374..c9a33f78e6 100644 --- a/package.json +++ b/package.json @@ -38,9 +38,14 @@ "packages": [ "packages/*", "plugins/*" + ], + "nohoist": [ + "**/@storybook/**", + "**/@storybook" ] }, "resolutions": { + "**/@graphql-codegen/cli/**/ws": "^7.4.6", "**/@roadiehq/**/@backstage/core": "*", "**/@roadiehq/**/@backstage/plugin-catalog": "*", "**/@roadiehq/**/@backstage/catalog-model": "*", @@ -54,6 +59,7 @@ "@microsoft/api-extractor-model": "^7.13.3" }, "devDependencies": { + "@types/webpack": "^5.28.0", "@changesets/cli": "^2.14.0", "@octokit/openapi-types": "^2.2.0", "@spotify/prettier-config": "^10.0.0", diff --git a/packages/app/CHANGELOG.md b/packages/app/CHANGELOG.md index 494e7dbad2..5ce4f341e1 100644 --- a/packages/app/CHANGELOG.md +++ b/packages/app/CHANGELOG.md @@ -1,5 +1,115 @@ # example-app +## 0.2.41 + +### Patch Changes + +- Updated dependencies + - @backstage/plugin-cost-insights@0.11.4 + - @backstage/plugin-github-actions@0.4.16 + - @backstage/plugin-jenkins@0.5.3 + - @backstage/plugin-kubernetes@0.4.11 + - @backstage/plugin-pagerduty@0.3.11 + - @backstage/plugin-scaffolder@0.11.0 + - @backstage/plugin-sentry@0.3.18 + - @backstage/plugin-techdocs@0.10.4 + - @backstage/core-app-api@0.1.8 + - @backstage/core-components@0.3.1 + - @backstage/core-plugin-api@0.1.6 + - @backstage/plugin-api-docs@0.6.6 + - @backstage/plugin-catalog@0.6.11 + - @backstage/plugin-catalog-import@0.5.17 + - @backstage/plugin-catalog-react@0.4.2 + - @backstage/plugin-explore@0.3.13 + - @backstage/plugin-lighthouse@0.2.23 + - @backstage/plugin-rollbar@0.3.12 + - @backstage/plugin-search@0.4.7 + - @backstage/plugin-tech-radar@0.4.5 + - @backstage/cli@0.7.8 + - @backstage/integration-react@0.1.7 + +## 0.2.40 + +### Patch Changes + +- Updated dependencies + - @backstage/cli@0.7.7 + - @backstage/plugin-catalog@0.6.10 + - @backstage/core-components@0.3.0 + - @backstage/core-plugin-api@0.1.5 + - @backstage/plugin-api-docs@0.6.5 + - @backstage/plugin-scaffolder@0.10.3 + - @backstage/plugin-search@0.4.6 + - @backstage/plugin-cost-insights@0.11.3 + - @backstage/plugin-kubernetes@0.4.10 + - @backstage/plugin-lighthouse@0.2.22 + - @backstage/plugin-pagerduty@0.3.10 + - @backstage/plugin-techdocs@0.10.3 + - @backstage/search-common@0.1.3 + - @backstage/core-app-api@0.1.7 + - @backstage/integration-react@0.1.6 + - @backstage/plugin-badges@0.2.7 + - @backstage/plugin-catalog-import@0.5.16 + - @backstage/plugin-catalog-react@0.4.1 + - @backstage/plugin-circleci@0.2.21 + - @backstage/plugin-cloudbuild@0.2.21 + - @backstage/plugin-code-coverage@0.1.9 + - @backstage/plugin-explore@0.3.12 + - @backstage/plugin-gcp-projects@0.3.2 + - @backstage/plugin-github-actions@0.4.15 + - @backstage/plugin-graphiql@0.2.14 + - @backstage/plugin-jenkins@0.5.2 + - @backstage/plugin-kafka@0.2.13 + - @backstage/plugin-newrelic@0.3.2 + - @backstage/plugin-org@0.3.19 + - @backstage/plugin-rollbar@0.3.11 + - @backstage/plugin-sentry@0.3.17 + - @backstage/plugin-shortcuts@0.1.6 + - @backstage/plugin-tech-radar@0.4.4 + - @backstage/plugin-todo@0.1.7 + - @backstage/plugin-user-settings@0.3.3 + +## 0.2.39 + +### Patch Changes + +- Updated dependencies + - @backstage/plugin-scaffolder@0.10.2 + - @backstage/core-components@0.2.0 + - @backstage/plugin-catalog@0.6.9 + - @backstage/plugin-catalog-react@0.4.0 + - @backstage/cli@0.7.6 + - @backstage/core-app-api@0.1.6 + - @backstage/core-plugin-api@0.1.4 + - @backstage/integration-react@0.1.5 + - @backstage/theme@0.2.9 + - @backstage/plugin-api-docs@0.6.4 + - @backstage/plugin-badges@0.2.6 + - @backstage/plugin-catalog-import@0.5.15 + - @backstage/plugin-circleci@0.2.20 + - @backstage/plugin-cloudbuild@0.2.20 + - @backstage/plugin-code-coverage@0.1.8 + - @backstage/plugin-cost-insights@0.11.2 + - @backstage/plugin-explore@0.3.11 + - @backstage/plugin-gcp-projects@0.3.1 + - @backstage/plugin-github-actions@0.4.14 + - @backstage/plugin-graphiql@0.2.13 + - @backstage/plugin-jenkins@0.5.1 + - @backstage/plugin-kafka@0.2.12 + - @backstage/plugin-kubernetes@0.4.9 + - @backstage/plugin-lighthouse@0.2.21 + - @backstage/plugin-newrelic@0.3.1 + - @backstage/plugin-org@0.3.18 + - @backstage/plugin-pagerduty@0.3.9 + - @backstage/plugin-rollbar@0.3.10 + - @backstage/plugin-search@0.4.5 + - @backstage/plugin-sentry@0.3.16 + - @backstage/plugin-shortcuts@0.1.5 + - @backstage/plugin-tech-radar@0.4.3 + - @backstage/plugin-techdocs@0.10.2 + - @backstage/plugin-todo@0.1.6 + - @backstage/plugin-user-settings@0.3.2 + ## 0.2.37 ### Patch Changes diff --git a/packages/app/package.json b/packages/app/package.json index 9d18064717..dcf14c88c1 100644 --- a/packages/app/package.json +++ b/packages/app/package.json @@ -1,47 +1,49 @@ { "name": "example-app", - "version": "0.2.37", + "version": "0.2.41", "private": true, "bundled": true, "dependencies": { "@backstage/catalog-model": "^0.9.0", - "@backstage/cli": "^0.7.4", - "@backstage/core-app-api": "^0.1.3", - "@backstage/core-components": "^0.1.5", - "@backstage/core-plugin-api": "^0.1.3", - "@backstage/integration-react": "^0.1.4", - "@backstage/plugin-api-docs": "^0.6.2", - "@backstage/plugin-badges": "^0.2.5", - "@backstage/plugin-catalog": "^0.6.7", - "@backstage/plugin-catalog-import": "^0.5.13", - "@backstage/plugin-catalog-react": "^0.3.0", - "@backstage/plugin-circleci": "^0.2.19", - "@backstage/plugin-cloudbuild": "^0.2.19", - "@backstage/plugin-code-coverage": "^0.1.7", - "@backstage/plugin-cost-insights": "^0.11.0", - "@backstage/plugin-explore": "^0.3.10", - "@backstage/plugin-gcp-projects": "^0.3.0", - "@backstage/plugin-github-actions": "^0.4.13", - "@backstage/plugin-graphiql": "^0.2.12", - "@backstage/plugin-jenkins": "^0.5.0", - "@backstage/plugin-kafka": "^0.2.11", - "@backstage/plugin-kubernetes": "^0.4.8", - "@backstage/plugin-lighthouse": "^0.2.20", - "@backstage/plugin-newrelic": "^0.3.0", - "@backstage/plugin-org": "^0.3.17", - "@backstage/plugin-pagerduty": "0.3.8", - "@backstage/plugin-rollbar": "^0.3.9", - "@backstage/plugin-scaffolder": "^0.10.1", - "@backstage/plugin-search": "^0.4.3", - "@backstage/plugin-sentry": "^0.3.15", - "@backstage/plugin-shortcuts": "^0.1.4", - "@backstage/plugin-tech-radar": "^0.4.1", - "@backstage/plugin-techdocs": "^0.10.0", - "@backstage/plugin-todo": "^0.1.5", - "@backstage/plugin-user-settings": "^0.3.0", - "@backstage/theme": "^0.2.8", - "@material-ui/core": "^4.11.0", + "@backstage/cli": "^0.7.8", + "@backstage/core-app-api": "^0.1.8", + "@backstage/core-components": "^0.3.1", + "@backstage/core-plugin-api": "^0.1.6", + "@backstage/integration-react": "^0.1.7", + "@backstage/plugin-api-docs": "^0.6.6", + "@backstage/plugin-badges": "^0.2.7", + "@backstage/plugin-catalog": "^0.6.11", + "@backstage/plugin-catalog-import": "^0.5.17", + "@backstage/plugin-catalog-react": "^0.4.2", + "@backstage/plugin-circleci": "^0.2.21", + "@backstage/plugin-cloudbuild": "^0.2.21", + "@backstage/plugin-code-coverage": "^0.1.9", + "@backstage/plugin-cost-insights": "^0.11.4", + "@backstage/plugin-explore": "^0.3.13", + "@backstage/plugin-gcp-projects": "^0.3.2", + "@backstage/plugin-github-actions": "^0.4.16", + "@backstage/plugin-graphiql": "^0.2.14", + "@backstage/plugin-jenkins": "^0.5.3", + "@backstage/plugin-kafka": "^0.2.13", + "@backstage/plugin-kubernetes": "^0.4.11", + "@backstage/plugin-lighthouse": "^0.2.23", + "@backstage/plugin-newrelic": "^0.3.2", + "@backstage/plugin-org": "^0.3.19", + "@backstage/plugin-pagerduty": "0.3.11", + "@backstage/plugin-rollbar": "^0.3.12", + "@backstage/plugin-scaffolder": "^0.11.0", + "@backstage/plugin-search": "^0.4.7", + "@backstage/plugin-sentry": "^0.3.18", + "@backstage/plugin-shortcuts": "^0.1.6", + "@backstage/plugin-tech-radar": "^0.4.5", + "@backstage/plugin-techdocs": "^0.10.4", + "@backstage/plugin-todo": "^0.1.7", + "@backstage/plugin-user-settings": "^0.3.3", + "@backstage/search-common": "^0.1.3", + "@backstage/theme": "^0.2.9", + "@material-ui/core": "^4.12.2", "@material-ui/icons": "^4.9.1", + "@material-ui/lab": "4.0.0-alpha.45", "@octokit/rest": "^18.5.3", "@roadiehq/backstage-plugin-buildkite": "^1.0.6", "@roadiehq/backstage-plugin-github-insights": "^1.1.20", @@ -58,7 +60,8 @@ "zen-observable": "^0.8.15" }, "devDependencies": { - "@backstage/test-utils": "^0.1.14", + "@backstage/test-utils": "^0.1.17", + "@rjsf/core": "^3.0.0", "@testing-library/cypress": "^7.0.1", "@testing-library/jest-dom": "^5.10.1", "@testing-library/react": "^11.2.5", @@ -66,7 +69,7 @@ "@types/jest": "^26.0.7", "@types/jquery": "^3.3.34", "@types/node": "^14.14.32", - "@types/react-dom": "^16.9.8", + "@types/react-dom": "*", "@types/zen-observable": "^0.8.0", "cross-env": "^7.0.0", "cypress": "^7.3.0", diff --git a/packages/app/src/App.tsx b/packages/app/src/App.tsx index de62971f96..1132368a91 100644 --- a/packages/app/src/App.tsx +++ b/packages/app/src/App.tsx @@ -41,10 +41,22 @@ import { GcpProjectsPage } from '@backstage/plugin-gcp-projects'; import { GraphiQLPage } from '@backstage/plugin-graphiql'; import { LighthousePage } from '@backstage/plugin-lighthouse'; import { NewRelicPage } from '@backstage/plugin-newrelic'; -import { ScaffolderPage, scaffolderPlugin } from '@backstage/plugin-scaffolder'; +import { + ScaffolderPage, + scaffolderPlugin, + ScaffolderFieldExtensions, + RepoUrlPickerFieldExtension, + OwnerPickerFieldExtension, + EntityPickerFieldExtension, + EntityNamePickerFieldExtension, +} from '@backstage/plugin-scaffolder'; import { SearchPage } from '@backstage/plugin-search'; import { TechRadarPage } from '@backstage/plugin-tech-radar'; -import { TechdocsPage } from '@backstage/plugin-techdocs'; +import { + DefaultTechDocsHome, + TechDocsIndexPage, + TechDocsReaderPage, +} from '@backstage/plugin-techdocs'; import { UserSettingsPage } from '@backstage/plugin-user-settings'; import AlarmIcon from '@material-ui/icons/Alarm'; import React from 'react'; @@ -54,6 +66,7 @@ import { apis } from './apis'; import { Root } from './components/Root'; import { entityPage } from './components/catalog/EntityPage'; import { searchPage } from './components/search/SearchPage'; +import { LowerCaseValuePickerFieldExtension } from './components/scaffolder/customScaffolderExtensions'; import { providers } from './identityProviders'; import * as plugins from './plugins'; @@ -98,7 +111,7 @@ const AppRouter = app.getRouter(); const routes = ( - + } /> } /> - } /> - } /> + }> + + + } + /> + }> + + + + + + + + } /> } /> } /> - } /> } /> } /> diff --git a/packages/app/src/components/Root/Root.tsx b/packages/app/src/components/Root/Root.tsx index 48141e4f53..7a666a020a 100644 --- a/packages/app/src/components/Root/Root.tsx +++ b/packages/app/src/components/Root/Root.tsx @@ -82,7 +82,7 @@ export const Root = ({ children }: PropsWithChildren<{}>) => ( {/* Global nav, not org-specific */} - + diff --git a/packages/app/src/components/catalog/EntityPage.tsx b/packages/app/src/components/catalog/EntityPage.tsx index 16107a6cc0..d84a7341bc 100644 --- a/packages/app/src/components/catalog/EntityPage.tsx +++ b/packages/app/src/components/catalog/EntityPage.tsx @@ -40,6 +40,8 @@ import { isKind, EntityHasResourcesCard, EntityOrphanWarning, + EntityProcessingErrorsPanel, + hasCatalogProcessingErrors, isOrphan, } from '@backstage/plugin-catalog'; import { @@ -135,6 +137,13 @@ const EntityLayoutWrapper = (props: { children?: ReactNode }) => { ); }; +/** + * NOTE: This page is designed to work on small screens such as mobile devices. + * This is based on Material UI Grid. If breakpoints are used, each grid item must set the `xs` prop to a column size or to `true`, + * since this does not default. If no breakpoints are used, the items will equitably share the asvailable space. + * https://material-ui.com/components/grid/#basic-grid. + */ + export const cicdContent = ( @@ -224,6 +233,14 @@ const overviewContent = ( + + + + + + + + @@ -292,10 +309,10 @@ const serviceEntityPage = ( - + - + @@ -303,10 +320,10 @@ const serviceEntityPage = ( - + - + @@ -431,15 +448,17 @@ const apiPage = ( - + - - - - - - + + + + + + + + diff --git a/packages/app/src/components/scaffolder/customScaffolderExtensions.tsx b/packages/app/src/components/scaffolder/customScaffolderExtensions.tsx new file mode 100644 index 0000000000..5ef4f617a7 --- /dev/null +++ b/packages/app/src/components/scaffolder/customScaffolderExtensions.tsx @@ -0,0 +1,34 @@ +/* + * Copyright 2021 The Backstage Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import type { FieldValidation } from '@rjsf/core'; +import { + createScaffolderFieldExtension, + TextValuePicker, + scaffolderPlugin, +} from '@backstage/plugin-scaffolder'; + +export const LowerCaseValuePickerFieldExtension = scaffolderPlugin.provide( + createScaffolderFieldExtension({ + name: 'LowerCaseValuePicker', + component: TextValuePicker, + validation: (value: string, validation: FieldValidation) => { + if (value.toLowerCase() !== value) { + validation.addError('Only lowercase values are allowed.'); + } + }, + }), +); diff --git a/packages/app/src/components/search/SearchPage.tsx b/packages/app/src/components/search/SearchPage.tsx index 35c4a4ac1c..cf4e610b80 100644 --- a/packages/app/src/components/search/SearchPage.tsx +++ b/packages/app/src/components/search/SearchPage.tsx @@ -14,35 +14,88 @@ * limitations under the License. */ -import React from 'react'; +import React, { useState } from 'react'; import { makeStyles, Theme, Grid, List, Paper } from '@material-ui/core'; - +import Pagination from '@material-ui/lab/Pagination'; import { CatalogResultListItem } from '@backstage/plugin-catalog'; import { SearchBar, SearchFilter, SearchResult, + SearchType, DefaultResultListItem, } from '@backstage/plugin-search'; import { Content, Header, Lifecycle, Page } from '@backstage/core-components'; +import { DocsResultListItem } from '@backstage/plugin-techdocs'; +import { SearchResultSet } from '@backstage/search-common'; const useStyles = makeStyles((theme: Theme) => ({ bar: { padding: theme.spacing(1, 0), }, - filters: { - padding: theme.spacing(2), - }, filter: { '& + &': { marginTop: theme.spacing(2.5), }, }, + filters: { + padding: theme.spacing(2), + }, })); +// TODO: Move this into the search plugin once pagination is natively supported. +// See: https://github.com/backstage/backstage/issues/6062 +const SearchResultList = ({ results }: SearchResultSet) => { + const pageSize = 10; + const [page, setPage] = useState(1); + const changePage = (_: any, pageIndex: number) => { + setPage(pageIndex); + }; + const pageAmount = Math.ceil((results.length || 0) / pageSize); + return ( + <> + + {results + .slice(pageSize * (page - 1), pageSize * page) + .map(({ type, document }) => { + switch (type) { + case 'software-catalog': + return ( + + ); + case 'techdocs': + return ( + + ); + default: + return ( + + ); + } + })} + + + + ); +}; + const SearchPage = () => { const classes = useStyles(); - return (
} /> @@ -55,6 +108,11 @@ const SearchPage = () => { + { - {({ results }) => ( - - {results.map(({ type, document }) => { - switch (type) { - case 'software-catalog': - return ( - - ); - default: - return ( - - ); - } - })} - - )} + {({ results }) => } diff --git a/packages/backend-common/CHANGELOG.md b/packages/backend-common/CHANGELOG.md index 13601fb8b3..297f07b0b4 100644 --- a/packages/backend-common/CHANGELOG.md +++ b/packages/backend-common/CHANGELOG.md @@ -1,5 +1,41 @@ # @backstage/backend-common +## 0.8.9 + +### Patch Changes + +- f7ce7c565: Use a more informative error message when URL reading isn't allowed due to no reader matching the target URL. +- ce1958021: Pass on credentials to the integrations package, so that it can properly pick the API route when using GitHub apps based auth +- Updated dependencies + - @backstage/integration@0.6.0 + +## 0.8.8 + +### Patch Changes + +- 6aa7c3db7: bump node-tar version to the latest +- Updated dependencies + - @backstage/config@0.1.6 + - @backstage/integration@0.5.9 + - @backstage/config-loader@0.6.6 + +## 0.8.7 + +### Patch Changes + +- f25357273: Implement the etag functionality in the `readUrl` method of `FetchUrlReader`. +- bdd6ab5f1: It's possible to customize the request logging handler when building the service. For example in your `backend` + + ``` + const service = createServiceBuilder(module) + .loadConfig(config) + .setRequestLoggingHandler((logger?: Logger): RequestHandler => { + const actualLogger = (logger || getRootLogger()).child({ + type: 'incomingRequest', + }); + return expressWinston.logger({ ... + ``` + ## 0.8.6 ### Patch Changes diff --git a/packages/backend-common/api-report.md b/packages/backend-common/api-report.md index 571a26e5dc..2652dad122 100644 --- a/packages/backend-common/api-report.md +++ b/packages/backend-common/api-report.md @@ -439,6 +439,13 @@ export type ReadTreeResponseFile = { // @public export function requestLoggingHandler(logger?: Logger_2): RequestHandler; +// Warning: (ae-missing-release-tag) "RequestLoggingHandlerFactory" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) +// +// @public (undocumented) +export type RequestLoggingHandlerFactory = ( + logger?: Logger_2, +) => RequestHandler; + // Warning: (ae-missing-release-tag) "resolvePackagePath" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) // // @public @@ -492,6 +499,9 @@ export type ServiceBuilder = { enableCors(options: cors.CorsOptions): ServiceBuilder; setHttpsSettings(settings: HttpsSettings): ServiceBuilder; addRouter(root: string, router: Router | RequestHandler): ServiceBuilder; + setRequestLoggingHandler( + requestLoggingHandler: RequestLoggingHandlerFactory, + ): ServiceBuilder; start(): Promise; }; @@ -593,6 +603,7 @@ export function useHotMemoize(_module: NodeModule, valueFactory: () => T): T; // src/service/types.d.ts:57:5 - (ae-forgotten-export) The symbol "HttpsSettings" needs to be exported by the entry point index.d.ts // src/service/types.d.ts:61:8 - (tsdoc-param-tag-missing-hyphen) The @param block should be followed by a parameter name and then a hyphen // src/service/types.d.ts:62:8 - (tsdoc-param-tag-missing-hyphen) The @param block should be followed by a parameter name and then a hyphen +// src/service/types.d.ts:70:8 - (tsdoc-param-tag-missing-hyphen) The @param block should be followed by a parameter name and then a hyphen // (No @packageDocumentation comment for this package) ``` diff --git a/packages/backend-common/package.json b/packages/backend-common/package.json index 739e372857..6d25ece793 100644 --- a/packages/backend-common/package.json +++ b/packages/backend-common/package.json @@ -1,7 +1,7 @@ { "name": "@backstage/backend-common", "description": "Common functionality library for Backstage backends", - "version": "0.8.6", + "version": "0.8.9", "main": "src/index.ts", "types": "src/index.ts", "private": false, @@ -30,16 +30,17 @@ }, "dependencies": { "@backstage/cli-common": "^0.1.2", - "@backstage/config": "^0.1.5", - "@backstage/config-loader": "^0.6.5", + "@backstage/config": "^0.1.6", + "@backstage/config-loader": "^0.6.6", "@backstage/errors": "^0.1.1", - "@backstage/integration": "^0.5.8", + "@backstage/integration": "^0.6.0", "@google-cloud/storage": "^5.8.0", "@octokit/rest": "^18.5.3", "@types/cors": "^2.8.6", "@types/dockerode": "^3.2.1", "@types/express": "^4.17.6", "archiver": "^5.0.2", + "aws-sdk": "^2.840.0", "compression": "^1.7.4", "concat-stream": "^2.0.0", "cors": "^2.8.5", @@ -62,7 +63,7 @@ "raw-body": "^2.4.1", "selfsigned": "^1.10.7", "stoppable": "^1.1.0", - "tar": "^6.0.5", + "tar": "^6.1.2", "unzipper": "^0.10.11", "winston": "^3.2.1", "yn": "^4.0.0" @@ -76,8 +77,8 @@ } }, "devDependencies": { - "@backstage/cli": "^0.7.4", - "@backstage/test-utils": "^0.1.12", + "@backstage/cli": "^0.7.8", + "@backstage/test-utils": "^0.1.17", "@types/archiver": "^5.1.0", "@types/compression": "^1.7.0", "@types/concat-stream": "^1.6.0", @@ -92,6 +93,7 @@ "@types/tar": "^4.0.3", "@types/unzipper": "^0.10.3", "@types/webpack-env": "^1.15.2", + "aws-sdk-mock": "^5.2.1", "get-port": "^5.1.1", "http-errors": "^1.7.3", "jest": "^26.0.1", diff --git a/packages/backend-common/src/cache/CacheManager.test.ts b/packages/backend-common/src/cache/CacheManager.test.ts index b55b63f469..fb73687f54 100644 --- a/packages/backend-common/src/cache/CacheManager.test.ts +++ b/packages/backend-common/src/cache/CacheManager.test.ts @@ -104,7 +104,7 @@ describe('CacheManager', () => { manager.forPlugin(plugin2Id).getClient({ defaultTtl: expectedTtl }); const client = DefaultCacheClient as jest.Mock; - const cache = (Keyv as unknown) as jest.Mock; + const cache = Keyv as unknown as jest.Mock; expect(cache).toHaveBeenCalledTimes(2); expect(client).toHaveBeenCalledTimes(2); @@ -124,7 +124,7 @@ describe('CacheManager', () => { const expectedNamespace = 'test-plugin'; manager.forPlugin(expectedNamespace).getClient(); - const cache = (Keyv as unknown) as jest.Mock; + const cache = Keyv as unknown as jest.Mock; const mockCalls = cache.mock.calls.splice(-1); const callArgs = mockCalls[0]; expect(callArgs[0].store).toBeInstanceOf(NoStore); @@ -138,7 +138,7 @@ describe('CacheManager', () => { .forPlugin(expectedNamespace) .getClient({ defaultTtl: expectedTtl }); - const cache = (Keyv as unknown) as jest.Mock; + const cache = Keyv as unknown as jest.Mock; const mockCalls = cache.mock.calls.splice(-1); const callArgs = mockCalls[0]; expect(callArgs[0]).toMatchObject({ @@ -162,7 +162,7 @@ describe('CacheManager', () => { const expectedTtl = 3600; manager.forPlugin('test').getClient({ defaultTtl: expectedTtl }); - const cache = (Keyv as unknown) as jest.Mock; + const cache = Keyv as unknown as jest.Mock; const mockCacheCalls = cache.mock.calls.splice(-1); expect(mockCacheCalls[0][0]).toMatchObject({ ttl: expectedTtl, diff --git a/packages/backend-common/src/database/DatabaseManager.ts b/packages/backend-common/src/database/DatabaseManager.ts index f3a3f218b0..2d60104bcb 100644 --- a/packages/backend-common/src/database/DatabaseManager.ts +++ b/packages/backend-common/src/database/DatabaseManager.ts @@ -110,9 +110,7 @@ export class DatabaseManager { * @returns Object with client type returned as `client` and boolean representing whether * or not the client was overridden as `overridden` */ - private getClientType( - pluginId: string, - ): { + private getClientType(pluginId: string): { client: string; overridden: boolean; } { diff --git a/packages/backend-common/src/database/connectors/mysql.ts b/packages/backend-common/src/database/connectors/mysql.ts index f2f2298559..94dce508c7 100644 --- a/packages/backend-common/src/database/connectors/mysql.ts +++ b/packages/backend-common/src/database/connectors/mysql.ts @@ -149,7 +149,7 @@ export async function ensureMysqlDatabaseExists( ) { const admin = createMysqlDatabaseClient(dbConfig, { connection: { - database: (null as unknown) as string, + database: null as unknown as string, }, }); diff --git a/packages/backend-common/src/reading/AwsS3UrlReader.test.ts b/packages/backend-common/src/reading/AwsS3UrlReader.test.ts new file mode 100644 index 0000000000..fe45931d53 --- /dev/null +++ b/packages/backend-common/src/reading/AwsS3UrlReader.test.ts @@ -0,0 +1,232 @@ +/* + * Copyright 2021 The Backstage Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { ConfigReader, JsonObject } from '@backstage/config'; +import { getVoidLogger } from '../logging'; +import { DefaultReadTreeResponseFactory } from './tree'; +import { AwsS3UrlReader } from './AwsS3UrlReader'; +import { + AwsS3Integration, + readAwsS3IntegrationConfig, +} from '@backstage/integration'; +import { UrlReaderPredicateTuple } from './types'; +import AWSMock from 'aws-sdk-mock'; +import aws from 'aws-sdk'; +import path from 'path'; + +describe('AwsS3UrlReader', () => { + const createReader = (config: JsonObject): UrlReaderPredicateTuple[] => { + return AwsS3UrlReader.factory({ + config: new ConfigReader(config), + logger: getVoidLogger(), + treeResponseFactory: DefaultReadTreeResponseFactory.create({ + config: new ConfigReader({}), + }), + }); + }; + + afterEach(() => { + AWSMock.restore(); + }); + + it('creates a dummy reader without the awsS3 field', () => { + const entries = createReader({ + integrations: {}, + }); + + expect(entries).toHaveLength(1); + }); + + it('creates a reader with credentials correctly configured', () => { + const awsS3Integrations = []; + awsS3Integrations.push({ + host: 'amazonaws.com', + accessKeyId: 'fakekey', + secretAccessKey: 'fakekey', + }); + + const entries = createReader({ + integrations: { + awsS3: awsS3Integrations, + }, + }); + + expect(entries).toHaveLength(1); + }); + + it('creates a reader with default credentials provider', () => { + const awsS3Integrations = []; + awsS3Integrations.push({ + host: 'amazonaws.com', + }); + + const entries = createReader({ + integrations: { + awsS3: awsS3Integrations, + }, + }); + + expect(entries).toHaveLength(1); + }); + + describe('predicates', () => { + const readers = createReader({ + integrations: { + awsS3: [{}], + }, + }); + const predicate = readers[0].predicate; + + it('returns true for the correct aws s3 storage host', () => { + expect( + predicate(new URL('https://test-bucket.s3.us-east-2.amazonaws.com')), + ).toBe(true); + }); + + it('returns true for a url with the full path and the correct host', () => { + expect( + predicate( + new URL( + 'https://test-bucket.s3.us-east-2.amazonaws.com/team/service/catalog-info.yaml', + ), + ), + ).toBe(true); + }); + + it('returns false for an incorrect host', () => { + expect(predicate(new URL('https://amazon.com'))).toBe(false); + }); + + it('returns false for a completely different host', () => { + expect(predicate(new URL('https://storage.cloud.google.com'))).toBe( + false, + ); + }); + + it("returns true for a url with a bucket with '.'", () => { + expect( + predicate( + new URL( + 'https://test.bucket.s3.us-east-2.amazonaws.com/team/service/catalog-info.yaml', + ), + ), + ).toBe(true); + }); + }); + + describe('read', () => { + AWSMock.setSDKInstance(aws); + AWSMock.mock( + 'S3', + 'getObject', + Buffer.from( + require('fs').readFileSync( + path.resolve( + 'src', + 'reading', + '__fixtures__', + 'awsS3-mock-object.yaml', + ), + ), + ), + ); + const s3 = new aws.S3(); + const awsS3UrlReader = new AwsS3UrlReader( + new AwsS3Integration( + readAwsS3IntegrationConfig( + new ConfigReader({ + host: 'amazonaws.com', + accessKeyId: 'fake-access-key', + secretAccessKey: 'fake-secret-key', + }), + ), + ), + s3, + ); + + it('returns contents of an object in a bucket', async () => { + const response = await awsS3UrlReader.read( + 'https://test-bucket.s3.us-east-2.amazonaws.com/awsS3-mock-object.yaml', + ); + expect(response.toString()).toBe('site_name: Test\n'); + }); + + it('rejects unknown targets', async () => { + await expect( + awsS3UrlReader.read( + 'https://test-bucket.s3.us-east-2.NOTamazonaws.com/file.yaml', + ), + ).rejects.toThrow( + Error( + `Could not retrieve file from S3: not a valid AWS S3 URL: https://test-bucket.s3.us-east-2.NOTamazonaws.com/file.yaml`, + ), + ); + }); + }); + + describe('readUrl', () => { + AWSMock.setSDKInstance(aws); + + AWSMock.mock( + 'S3', + 'getObject', + Buffer.from( + require('fs').readFileSync( + path.resolve( + 'src', + 'reading', + '__fixtures__', + 'awsS3-mock-object.yaml', + ), + ), + ), + ); + + const s3 = new aws.S3(); + + const awsS3UrlReader = new AwsS3UrlReader( + new AwsS3Integration( + readAwsS3IntegrationConfig( + new ConfigReader({ + host: 'amazonaws.com', + accessKeyId: 'fake-access-key', + secretAccessKey: 'fake-secret-key', + }), + ), + ), + s3, + ); + + it('returns contents of an object in a bucket', async () => { + const response = await awsS3UrlReader.readUrl( + 'https://test-bucket.s3.us-east-2.amazonaws.com/awsS3-mock-object.yaml', + ); + const buffer = await response.buffer(); + expect(buffer.toString()).toBe('site_name: Test\n'); + }); + + it('rejects unknown targets', async () => { + await expect( + awsS3UrlReader.readUrl( + 'https://test-bucket.s3.us-east-2.NOTamazonaws.com/file.yaml', + ), + ).rejects.toThrow( + Error( + `Could not retrieve file from S3: not a valid AWS S3 URL: https://test-bucket.s3.us-east-2.NOTamazonaws.com/file.yaml`, + ), + ); + }); + }); +}); diff --git a/packages/backend-common/src/reading/AwsS3UrlReader.ts b/packages/backend-common/src/reading/AwsS3UrlReader.ts new file mode 100644 index 0000000000..d119115930 --- /dev/null +++ b/packages/backend-common/src/reading/AwsS3UrlReader.ts @@ -0,0 +1,175 @@ +/* + * Copyright 2021 The Backstage Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import aws, { Credentials, S3 } from 'aws-sdk'; +import { CredentialsOptions } from 'aws-sdk/lib/credentials'; +import { + ReaderFactory, + ReadTreeResponse, + ReadUrlOptions, + ReadUrlResponse, + SearchResponse, + UrlReader, +} from './types'; +import getRawBody from 'raw-body'; +import { AwsS3Integration, ScmIntegrations } from '@backstage/integration'; + +const parseURL = ( + url: string, +): { path: string; bucket: string; region: string } => { + let { host, pathname } = new URL(url); + + /** + * Removes the leading '/' from the pathname to be processed + * as a parameter by AWS S3 SDK getObject method. + */ + pathname = pathname.substr(1); + + /** + * Checks that the given URL is a valid S3 object url. + * Format of a Valid S3 URL: https://bucket-name.s3.Region.amazonaws.com/keyname + */ + const validHost = new RegExp( + /^[a-z\d][a-z\d\.-]{1,61}[a-z\d]\.s3\.[a-z\d-]+\.amazonaws.com$/, + ); + if (!validHost.test(host)) { + throw new Error(`not a valid AWS S3 URL: ${url}`); + } + + const [bucket] = host.split(/\.s3\.[a-z\d-]+\.amazonaws.com/); + host = host.substring(bucket.length); + const [, , region, ,] = host.split('.'); + + return { + path: pathname, + bucket: bucket, + region: region, + }; +}; + +export class AwsS3UrlReader implements UrlReader { + static factory: ReaderFactory = ({ config }) => { + const integrations = ScmIntegrations.fromConfig(config); + + return integrations.awsS3.list().map(integration => { + const creds = AwsS3UrlReader.buildCredentials(integration); + const s3 = new S3({ + apiVersion: '2006-03-01', + credentials: creds, + }); + const reader = new AwsS3UrlReader(integration, s3); + const predicate = (url: URL) => + url.host.endsWith(integration.config.host); + return { reader, predicate }; + }); + }; + + constructor( + private readonly integration: AwsS3Integration, + private readonly s3: S3, + ) {} + + /** + * If accesKeyId and secretAccessKey are missing, the standard credentials provider chain will be used: + * https://docs.aws.amazon.com/AWSJavaSDK/latest/javadoc/com/amazonaws/auth/DefaultAWSCredentialsProviderChain.html + */ + private static buildCredentials( + integration?: AwsS3Integration, + ): Credentials | CredentialsOptions | undefined { + if (!integration) { + return undefined; + } + + const accessKeyId = integration.config.accessKeyId; + const secretAccessKey = integration.config.secretAccessKey; + let explicitCredentials: Credentials | undefined; + + if (accessKeyId && secretAccessKey) { + explicitCredentials = new Credentials({ + accessKeyId, + secretAccessKey, + }); + } + + const roleArn = integration.config.roleArn; + if (roleArn) { + return new aws.ChainableTemporaryCredentials({ + masterCredentials: explicitCredentials, + params: { + RoleSessionName: 'backstage-aws-s3-url-reader', + RoleArn: roleArn, + }, + }); + } + + return explicitCredentials; + } + + async read(url: string): Promise { + const response = await this.readUrl(url); + return response.buffer(); + } + + async readUrl( + url: string, + options?: ReadUrlOptions, + ): Promise { + try { + const { path, bucket, region } = parseURL(url); + aws.config.update({ region: region }); + + let params; + if (options?.etag) { + params = { + Bucket: bucket, + Key: path, + IfNoneMatch: options.etag, + }; + } else { + params = { + Bucket: bucket, + Key: path, + }; + } + + const response = this.s3.getObject(params); + const buffer = await getRawBody(response.createReadStream()); + const etag = (await response.promise()).ETag; + + return { + buffer: async () => buffer, + etag: etag, + }; + } catch (e) { + throw new Error(`Could not retrieve file from S3: ${e.message}`); + } + } + + async readTree(): Promise { + throw new Error('AwsS3Reader does not implement readTree'); + } + + async search(): Promise { + throw new Error('AwsS3Reader does not implement search'); + } + + toString() { + const secretAccessKey = this.integration.config.secretAccessKey; + return `awsS3{host=${this.integration.config.host},authed=${Boolean( + secretAccessKey, + )}}`; + } +} diff --git a/packages/backend-common/src/reading/AzureUrlReader.test.ts b/packages/backend-common/src/reading/AzureUrlReader.test.ts index 2b7c21d4ab..c7c8853929 100644 --- a/packages/backend-common/src/reading/AzureUrlReader.test.ts +++ b/packages/backend-common/src/reading/AzureUrlReader.test.ts @@ -78,21 +78,17 @@ describe('AzureUrlReader', () => { it.each([ { - url: - 'https://dev.azure.com/org-name/project-name/_git/repo-name?path=my-template.yaml&version=GBmaster', + url: 'https://dev.azure.com/org-name/project-name/_git/repo-name?path=my-template.yaml&version=GBmaster', config: createConfig(), response: expect.objectContaining({ - url: - 'https://dev.azure.com/org-name/project-name/_apis/git/repositories/repo-name/items?path=my-template.yaml&version=master', + url: 'https://dev.azure.com/org-name/project-name/_apis/git/repositories/repo-name/items?path=my-template.yaml&version=master', }), }, { - url: - 'https://dev.azure.com/org-name/project-name/_git/repo-name?path=my-template.yaml', + url: 'https://dev.azure.com/org-name/project-name/_git/repo-name?path=my-template.yaml', config: createConfig(), response: expect.objectContaining({ - url: - 'https://dev.azure.com/org-name/project-name/_apis/git/repositories/repo-name/items?path=my-template.yaml', + url: 'https://dev.azure.com/org-name/project-name/_apis/git/repositories/repo-name/items?path=my-template.yaml', }), }, { diff --git a/packages/backend-common/src/reading/AzureUrlReader.ts b/packages/backend-common/src/reading/AzureUrlReader.ts index bc22854d4e..d2c056508d 100644 --- a/packages/backend-common/src/reading/AzureUrlReader.ts +++ b/packages/backend-common/src/reading/AzureUrlReader.ts @@ -129,7 +129,7 @@ export class AzureUrlReader implements UrlReader { } return await this.deps.treeResponseFactory.fromZipArchive({ - stream: (archiveAzureResponse.body as unknown) as Readable, + stream: archiveAzureResponse.body as unknown as Readable, etag: commitSha, filter: options?.filter, }); diff --git a/packages/backend-common/src/reading/BitbucketUrlReader.ts b/packages/backend-common/src/reading/BitbucketUrlReader.ts index 2849bc3cd9..2a979a464f 100644 --- a/packages/backend-common/src/reading/BitbucketUrlReader.ts +++ b/packages/backend-common/src/reading/BitbucketUrlReader.ts @@ -60,13 +60,8 @@ export class BitbucketUrlReader implements UrlReader { private readonly integration: BitbucketIntegration, private readonly deps: { treeResponseFactory: ReadTreeResponseFactory }, ) { - const { - host, - apiBaseUrl, - token, - username, - appPassword, - } = integration.config; + const { host, apiBaseUrl, token, username, appPassword } = + integration.config; if (!apiBaseUrl) { throw new Error( @@ -138,7 +133,7 @@ export class BitbucketUrlReader implements UrlReader { } return await this.deps.treeResponseFactory.fromTarArchive({ - stream: (archiveBitbucketResponse.body as unknown) as Readable, + stream: archiveBitbucketResponse.body as unknown as Readable, subpath: filepath, etag: lastCommitShortHash, filter: options?.filter, diff --git a/packages/backend-common/src/reading/FetchUrlReader.test.ts b/packages/backend-common/src/reading/FetchUrlReader.test.ts index 169cbfbf66..e8c16c5f0a 100644 --- a/packages/backend-common/src/reading/FetchUrlReader.test.ts +++ b/packages/backend-common/src/reading/FetchUrlReader.test.ts @@ -15,12 +15,16 @@ */ import { ConfigReader } from '@backstage/config'; +import { NotFoundError, NotModifiedError } from '@backstage/errors'; import { msw } from '@backstage/test-utils'; +import { rest } from 'msw'; import { setupServer } from 'msw/node'; import { getVoidLogger } from '../logging'; import { FetchUrlReader } from './FetchUrlReader'; import { DefaultReadTreeResponseFactory } from './tree'; +const fetchUrlReader = new FetchUrlReader(); + describe('FetchUrlReader', () => { const worker = setupServer(); @@ -30,6 +34,39 @@ describe('FetchUrlReader', () => { jest.clearAllMocks(); }); + beforeEach(() => { + worker.use( + rest.get('https://backstage.io/some-resource', (req, res, ctx) => { + if (req.headers.get('if-none-match') === 'foo') { + return res( + ctx.status(304), + ctx.set('Content-Type', 'text/plain'), + ctx.set('etag', 'foo'), + ); + } + + return res( + ctx.status(200), + ctx.set('Content-Type', 'text/plain'), + ctx.set('etag', 'foo'), + ctx.body('content foo'), + ); + }), + ); + + worker.use( + rest.get('https://backstage.io/not-exists', (_req, res, ctx) => { + return res(ctx.status(404)); + }), + ); + + worker.use( + rest.get('https://backstage.io/error', (_req, res, ctx) => { + return res(ctx.status(500), ctx.body('An internal error occured')); + }), + ); + }); + it('factory should create a single entry with a predicate that matches config', async () => { const entries = FetchUrlReader.factory({ config: new ConfigReader({ @@ -70,4 +107,55 @@ describe('FetchUrlReader', () => { expect(predicate(new URL('https://a.examples.org:700/test'))).toBe(true); expect(predicate(new URL('https://a.b.examples.org:700/test'))).toBe(true); }); + + describe('read', () => { + it('should return etag from the response', async () => { + const buffer = await fetchUrlReader.read( + 'https://backstage.io/some-resource', + ); + expect(buffer.toString()).toBe('content foo'); + }); + + it('should throw NotFound if server responds with 404', async () => { + await expect( + fetchUrlReader.read('https://backstage.io/not-exists'), + ).rejects.toThrow(NotFoundError); + }); + + it('should throw Error if server responds with 500', async () => { + await expect( + fetchUrlReader.read('https://backstage.io/error'), + ).rejects.toThrow(Error); + }); + }); + + describe('readUrl', () => { + it('should throw NotModified if server responds with 304', async () => { + await expect( + fetchUrlReader.readUrl('https://backstage.io/some-resource', { + etag: 'foo', + }), + ).rejects.toThrow(NotModifiedError); + }); + + it('should return etag from the response', async () => { + const response = await fetchUrlReader.readUrl( + 'https://backstage.io/some-resource', + ); + expect(response.etag).toBe('foo'); + expect((await response.buffer()).toString()).toEqual('content foo'); + }); + + it('should throw NotFound if server responds with 404', async () => { + await expect( + fetchUrlReader.readUrl('https://backstage.io/not-exists'), + ).rejects.toThrow(NotFoundError); + }); + + it('should throw Error if server responds with 500', async () => { + await expect( + fetchUrlReader.readUrl('https://backstage.io/error'), + ).rejects.toThrow(Error); + }); + }); }); diff --git a/packages/backend-common/src/reading/FetchUrlReader.ts b/packages/backend-common/src/reading/FetchUrlReader.ts index 30468158aa..3177ee1f8e 100644 --- a/packages/backend-common/src/reading/FetchUrlReader.ts +++ b/packages/backend-common/src/reading/FetchUrlReader.ts @@ -14,8 +14,8 @@ * limitations under the License. */ +import { NotFoundError, NotModifiedError } from '@backstage/errors'; import fetch from 'cross-fetch'; -import { NotFoundError } from '@backstage/errors'; import { ReaderFactory, ReadTreeResponse, @@ -57,15 +57,34 @@ export class FetchUrlReader implements UrlReader { }; async read(url: string): Promise { + const response = await this.readUrl(url); + return response.buffer(); + } + + async readUrl( + url: string, + options?: ReadUrlOptions, + ): Promise { let response: Response; try { - response = await fetch(url); + response = await fetch(url, { + headers: { + ...(options?.etag && { 'If-None-Match': options.etag }), + }, + }); } catch (e) { throw new Error(`Unable to read ${url}, ${e}`); } + if (response.status === 304) { + throw new NotModifiedError(); + } + if (response.ok) { - return Buffer.from(await response.text()); + return { + buffer: async () => Buffer.from(await response.text()), + etag: response.headers.get('ETag') ?? undefined, + }; } const message = `could not read ${url}, ${response.status} ${response.statusText}`; @@ -75,15 +94,6 @@ export class FetchUrlReader implements UrlReader { throw new Error(message); } - async readUrl( - url: string, - _options?: ReadUrlOptions, - ): Promise { - // TODO etag is not implemented yet. - const buffer = await this.read(url); - return { buffer: async () => buffer }; - } - async readTree(): Promise { throw new Error('FetchUrlReader does not implement readTree'); } diff --git a/packages/backend-common/src/reading/GithubUrlReader.test.ts b/packages/backend-common/src/reading/GithubUrlReader.test.ts index c8002cd3ce..f9717a862a 100644 --- a/packages/backend-common/src/reading/GithubUrlReader.test.ts +++ b/packages/backend-common/src/reading/GithubUrlReader.test.ts @@ -41,9 +41,9 @@ const treeResponseFactory = DefaultReadTreeResponseFactory.create({ config: new ConfigReader({}), }); -const mockCredentialsProvider = ({ +const mockCredentialsProvider = { getCredentials: jest.fn().mockResolvedValue({ headers: {} }), -} as unknown) as GithubCredentialsProvider; +} as unknown as GithubCredentialsProvider; const githubProcessor = new GithubUrlReader( new GitHubIntegration( diff --git a/packages/backend-common/src/reading/GithubUrlReader.ts b/packages/backend-common/src/reading/GithubUrlReader.ts index bccddc6838..40d36fb2a0 100644 --- a/packages/backend-common/src/reading/GithubUrlReader.ts +++ b/packages/backend-common/src/reading/GithubUrlReader.ts @@ -39,10 +39,14 @@ import { ReadUrlResponse, } from './types'; -export type GhRepoResponse = RestEndpointMethodTypes['repos']['get']['response']['data']; -export type GhBranchResponse = RestEndpointMethodTypes['repos']['getBranch']['response']['data']; -export type GhTreeResponse = RestEndpointMethodTypes['git']['getTree']['response']['data']; -export type GhBlobResponse = RestEndpointMethodTypes['git']['getBlob']['response']['data']; +export type GhRepoResponse = + RestEndpointMethodTypes['repos']['get']['response']['data']; +export type GhBranchResponse = + RestEndpointMethodTypes['repos']['getBranch']['response']['data']; +export type GhTreeResponse = + RestEndpointMethodTypes['git']['getTree']['response']['data']; +export type GhBlobResponse = + RestEndpointMethodTypes['git']['getBlob']['response']['data']; /** * A processor that adds the ability to read files from GitHub v3 APIs, such as @@ -87,15 +91,20 @@ export class GithubUrlReader implements UrlReader { url: string, options?: ReadUrlOptions, ): Promise { - const ghUrl = getGitHubFileFetchUrl(url, this.integration.config); - const { headers } = await this.deps.credentialsProvider.getCredentials({ + const credentials = await this.deps.credentialsProvider.getCredentials({ url, }); + const ghUrl = getGitHubFileFetchUrl( + url, + this.integration.config, + credentials, + ); + let response: Response; try { - response = await fetch(ghUrl.toString(), { + response = await fetch(ghUrl, { headers: { - ...headers, + ...credentials?.headers, ...(options?.etag && { 'If-None-Match': options.etag }), Accept: 'application/vnd.github.v3.raw', }, @@ -195,7 +204,7 @@ export class GithubUrlReader implements UrlReader { return await this.deps.treeResponseFactory.fromTarArchive({ // TODO(Rugvip): Underlying implementation of fetch will be node-fetch, we probably want // to stick to using that in exclusively backend code. - stream: (archive.body as unknown) as Readable, + stream: archive.body as unknown as Readable, subpath, etag: sha, filter: options?.filter, @@ -258,9 +267,7 @@ export class GithubUrlReader implements UrlReader { })); } - private async getRepoDetails( - url: string, - ): Promise<{ + private async getRepoDetails(url: string): Promise<{ repo: GhRepoResponse; branch: GhBranchResponse; }> { diff --git a/packages/backend-common/src/reading/GitlabUrlReader.test.ts b/packages/backend-common/src/reading/GitlabUrlReader.test.ts index 945444d8ed..51b211e698 100644 --- a/packages/backend-common/src/reading/GitlabUrlReader.test.ts +++ b/packages/backend-common/src/reading/GitlabUrlReader.test.ts @@ -108,36 +108,30 @@ describe('GitlabUrlReader', () => { it.each([ // Project URLs { - url: - 'https://gitlab.com/groupA/teams/teamA/subgroupA/repoA/-/blob/branch/my/path/to/file.yaml', + url: 'https://gitlab.com/groupA/teams/teamA/subgroupA/repoA/-/blob/branch/my/path/to/file.yaml', config: createConfig(), response: expect.objectContaining({ - url: - 'https://gitlab.com/api/v4/projects/12345/repository/files/my%2Fpath%2Fto%2Ffile.yaml/raw?ref=branch', + url: 'https://gitlab.com/api/v4/projects/12345/repository/files/my%2Fpath%2Fto%2Ffile.yaml/raw?ref=branch', headers: expect.objectContaining({ 'private-token': '', }), }), }, { - url: - 'https://gitlab.example.com/groupA/teams/teamA/subgroupA/repoA/-/blob/branch/my/path/to/file.yaml', + url: 'https://gitlab.example.com/groupA/teams/teamA/subgroupA/repoA/-/blob/branch/my/path/to/file.yaml', config: createConfig('0123456789'), response: expect.objectContaining({ - url: - 'https://gitlab.example.com/api/v4/projects/12345/repository/files/my%2Fpath%2Fto%2Ffile.yaml/raw?ref=branch', + url: 'https://gitlab.example.com/api/v4/projects/12345/repository/files/my%2Fpath%2Fto%2Ffile.yaml/raw?ref=branch', headers: expect.objectContaining({ 'private-token': '0123456789', }), }), }, { - url: - 'https://gitlab.com/groupA/teams/teamA/repoA/-/blob/branch/my/path/to/file.yaml', // Repo not in subgroup + url: 'https://gitlab.com/groupA/teams/teamA/repoA/-/blob/branch/my/path/to/file.yaml', // Repo not in subgroup config: createConfig(), response: expect.objectContaining({ - url: - 'https://gitlab.com/api/v4/projects/12345/repository/files/my%2Fpath%2Fto%2Ffile.yaml/raw?ref=branch', + url: 'https://gitlab.com/api/v4/projects/12345/repository/files/my%2Fpath%2Fto%2Ffile.yaml/raw?ref=branch', }), }, diff --git a/packages/backend-common/src/reading/GitlabUrlReader.ts b/packages/backend-common/src/reading/GitlabUrlReader.ts index 6c272471e2..27c31c7673 100644 --- a/packages/backend-common/src/reading/GitlabUrlReader.ts +++ b/packages/backend-common/src/reading/GitlabUrlReader.ts @@ -170,7 +170,7 @@ export class GitlabUrlReader implements UrlReader { } return await this.deps.treeResponseFactory.fromTarArchive({ - stream: (archiveGitLabResponse.body as unknown) as Readable, + stream: archiveGitLabResponse.body as unknown as Readable, subpath: filepath, etag: commitSha, filter: options?.filter, diff --git a/packages/backend-common/src/reading/UrlReaderPredicateMux.ts b/packages/backend-common/src/reading/UrlReaderPredicateMux.ts index 4a166cb517..bbe94a0fb4 100644 --- a/packages/backend-common/src/reading/UrlReaderPredicateMux.ts +++ b/packages/backend-common/src/reading/UrlReaderPredicateMux.ts @@ -52,7 +52,11 @@ export class UrlReaderPredicateMux implements UrlReader { } } - throw new NotAllowedError(`Reading from '${url}' is not allowed`); + throw new NotAllowedError( + `Reading from '${url}' is not allowed. ` + + `You may need to configure an integration for the target host, or add it ` + + `to the configured list of allowed hosts at 'backend.reading.allow'`, + ); } async readUrl( diff --git a/packages/backend-common/src/reading/UrlReaders.ts b/packages/backend-common/src/reading/UrlReaders.ts index 2b3a2f166c..f9a4865717 100644 --- a/packages/backend-common/src/reading/UrlReaders.ts +++ b/packages/backend-common/src/reading/UrlReaders.ts @@ -25,6 +25,7 @@ import { GitlabUrlReader } from './GitlabUrlReader'; import { DefaultReadTreeResponseFactory } from './tree'; import { FetchUrlReader } from './FetchUrlReader'; import { GoogleGcsUrlReader } from './GoogleGcsUrlReader'; +import { AwsS3UrlReader } from './AwsS3UrlReader'; type CreateOptions = { /** Root config object */ @@ -74,6 +75,7 @@ export class UrlReaders { GithubUrlReader.factory, GitlabUrlReader.factory, GoogleGcsUrlReader.factory, + AwsS3UrlReader.factory, FetchUrlReader.factory, ]), }); diff --git a/packages/backend-common/src/reading/__fixtures__/awsS3-mock-object.yaml b/packages/backend-common/src/reading/__fixtures__/awsS3-mock-object.yaml new file mode 100644 index 0000000000..7470c0e8a3 --- /dev/null +++ b/packages/backend-common/src/reading/__fixtures__/awsS3-mock-object.yaml @@ -0,0 +1 @@ +site_name: Test diff --git a/packages/backend-common/src/reading/tree/TarArchiveResponse.ts b/packages/backend-common/src/reading/tree/TarArchiveResponse.ts index a81add58f7..173f6a886a 100644 --- a/packages/backend-common/src/reading/tree/TarArchiveResponse.ts +++ b/packages/backend-common/src/reading/tree/TarArchiveResponse.ts @@ -28,7 +28,7 @@ import { import { stripFirstDirectoryFromPath } from './util'; // Tar types for `Parse` is not a proper constructor, but it should be -const TarParseStream = (Parse as unknown) as { new (): ParseStream }; +const TarParseStream = Parse as unknown as { new (): ParseStream }; const pipeline = promisify(pipelineCb); diff --git a/packages/backend-common/src/scm/git.test.ts b/packages/backend-common/src/scm/git.test.ts index 0b70edc45d..abbafc375d 100644 --- a/packages/backend-common/src/scm/git.test.ts +++ b/packages/backend-common/src/scm/git.test.ts @@ -123,9 +123,9 @@ describe('Git', () => { await git.clone({ url, dir }); - const { onAuth } = ((isomorphic.clone as unknown) as jest.Mock< - typeof isomorphic['clone'] - >).mock.calls[0][0]!; + const { onAuth } = ( + isomorphic.clone as unknown as jest.Mock + ).mock.calls[0][0]!; expect(onAuth()).toEqual(auth); }); @@ -190,9 +190,9 @@ describe('Git', () => { await git.fetch({ remote, dir }); - const { onAuth } = ((isomorphic.fetch as unknown) as jest.Mock< - typeof isomorphic['fetch'] - >).mock.calls[0][0]!; + const { onAuth } = ( + isomorphic.fetch as unknown as jest.Mock + ).mock.calls[0][0]!; expect(onAuth()).toEqual(auth); }); @@ -279,9 +279,9 @@ describe('Git', () => { await git.push({ remote, dir }); - const { onAuth } = ((isomorphic.push as unknown) as jest.Mock< - typeof isomorphic['push'] - >).mock.calls[0][0]!; + const { onAuth } = ( + isomorphic.push as unknown as jest.Mock + ).mock.calls[0][0]!; expect(onAuth()).toEqual(auth); }); diff --git a/packages/backend-common/src/service/index.ts b/packages/backend-common/src/service/index.ts index 4eb0bf4a5a..d01f25fad3 100644 --- a/packages/backend-common/src/service/index.ts +++ b/packages/backend-common/src/service/index.ts @@ -16,4 +16,4 @@ export { createServiceBuilder } from './createServiceBuilder'; export { createStatusCheckRouter } from './createStatusCheckRouter'; -export type { ServiceBuilder } from './types'; +export type { ServiceBuilder, RequestLoggingHandlerFactory } from './types'; diff --git a/packages/backend-common/src/service/lib/ServiceBuilderImpl.ts b/packages/backend-common/src/service/lib/ServiceBuilderImpl.ts index 380d61abc8..ed16c9c9a7 100644 --- a/packages/backend-common/src/service/lib/ServiceBuilderImpl.ts +++ b/packages/backend-common/src/service/lib/ServiceBuilderImpl.ts @@ -27,9 +27,9 @@ import { getRootLogger } from '../../logging'; import { errorHandler, notFoundHandler, - requestLoggingHandler, + requestLoggingHandler as defaultRequestLoggingHandler, } from '../../middleware'; -import { ServiceBuilder } from '../types'; +import { RequestLoggingHandlerFactory, ServiceBuilder } from '../types'; import { CspOptions, HttpsSettings, @@ -65,6 +65,7 @@ export class ServiceBuilderImpl implements ServiceBuilder { private cspOptions: Record | undefined; private httpsSettings: HttpsSettings | undefined; private routers: [string, Router][]; + private requestLoggingHandler: RequestLoggingHandlerFactory | undefined; // Reference to the module where builder is created - needed for hot module // reloading private module: NodeModule; @@ -144,23 +145,26 @@ export class ServiceBuilderImpl implements ServiceBuilder { return this; } + setRequestLoggingHandler( + requestLoggingHandler: RequestLoggingHandlerFactory, + ) { + this.requestLoggingHandler = requestLoggingHandler; + return this; + } + async start(): Promise { const app = express(); - const { - port, - host, - logger, - corsOptions, - httpsSettings, - helmetOptions, - } = this.getOptions(); + const { port, host, logger, corsOptions, httpsSettings, helmetOptions } = + this.getOptions(); app.use(helmet(helmetOptions)); if (corsOptions) { app.use(cors(corsOptions)); } app.use(compression()); - app.use(requestLoggingHandler(logger)); + app.use( + (this.requestLoggingHandler ?? defaultRequestLoggingHandler)(logger), + ); for (const [root, route] of this.routers) { app.use(root, route); } diff --git a/packages/backend-common/src/service/types.ts b/packages/backend-common/src/service/types.ts index 70f62acfca..f845397ca2 100644 --- a/packages/backend-common/src/service/types.ts +++ b/packages/backend-common/src/service/types.ts @@ -85,8 +85,21 @@ export type ServiceBuilder = { */ addRouter(root: string, router: Router | RequestHandler): ServiceBuilder; + /** + * Set the request logging handler + * + * If no handler is given the default one is used + * + * @param requestLoggingHandler a factory function that given a logger returns an handler + */ + setRequestLoggingHandler( + requestLoggingHandler: RequestLoggingHandlerFactory, + ): ServiceBuilder; + /** * Starts the server using the given settings. */ start(): Promise; }; + +export type RequestLoggingHandlerFactory = (logger?: Logger) => RequestHandler; diff --git a/packages/backend-common/src/util/DockerContainerRunner.ts b/packages/backend-common/src/util/DockerContainerRunner.ts index 8dbc5335c9..33a4874151 100644 --- a/packages/backend-common/src/util/DockerContainerRunner.ts +++ b/packages/backend-common/src/util/DockerContainerRunner.ts @@ -92,18 +92,17 @@ export class DockerContainerRunner implements ContainerRunner { Env.push(`${key}=${value}`); } - const [ - { Error: error, StatusCode: statusCode }, - ] = await this.dockerClient.run(imageName, args, logStream, { - Volumes, - HostConfig: { - Binds, - }, - ...(workingDir ? { WorkingDir: workingDir } : {}), - Entrypoint: command, - Env, - ...userOptions, - } as Docker.ContainerCreateOptions); + const [{ Error: error, StatusCode: statusCode }] = + await this.dockerClient.run(imageName, args, logStream, { + Volumes, + HostConfig: { + Binds, + }, + ...(workingDir ? { WorkingDir: workingDir } : {}), + Entrypoint: command, + Env, + ...userOptions, + } as Docker.ContainerCreateOptions); if (error) { throw new Error( diff --git a/packages/backend-test-utils/CHANGELOG.md b/packages/backend-test-utils/CHANGELOG.md index 2faa5afbc3..5671b41fb3 100644 --- a/packages/backend-test-utils/CHANGELOG.md +++ b/packages/backend-test-utils/CHANGELOG.md @@ -1,5 +1,15 @@ # @backstage/backend-test-utils +## 0.1.5 + +### Patch Changes + +- 524045758: Make sure that the unique databases names generated by `TestDatabases.create()` + don't collide. +- Updated dependencies + - @backstage/backend-common@0.8.9 + - @backstage/cli@0.7.8 + ## 0.1.4 ### Patch Changes diff --git a/packages/backend-test-utils/package.json b/packages/backend-test-utils/package.json index 9ec11a58b7..f1cfffeb37 100644 --- a/packages/backend-test-utils/package.json +++ b/packages/backend-test-utils/package.json @@ -1,7 +1,7 @@ { "name": "@backstage/backend-test-utils", "description": "Test helpers library for Backstage backends", - "version": "0.1.4", + "version": "0.1.5", "main": "src/index.ts", "types": "src/index.ts", "private": false, @@ -30,8 +30,8 @@ "clean": "backstage-cli clean" }, "dependencies": { - "@backstage/backend-common": "^0.8.5", - "@backstage/cli": "^0.7.1", + "@backstage/backend-common": "^0.8.9", + "@backstage/cli": "^0.7.8", "@backstage/config": "^0.1.5", "knex": "^0.95.1", "mysql2": "^2.2.5", @@ -41,7 +41,7 @@ "uuid": "^8.0.0" }, "devDependencies": { - "@backstage/cli": "^0.7.1", + "@backstage/cli": "^0.7.8", "jest": "^26.0.1" }, "files": [ diff --git a/packages/backend-test-utils/src/database/TestDatabases.test.ts b/packages/backend-test-utils/src/database/TestDatabases.test.ts index 62612f3fcc..000e047c4d 100644 --- a/packages/backend-test-utils/src/database/TestDatabases.test.ts +++ b/packages/backend-test-utils/src/database/TestDatabases.test.ts @@ -71,7 +71,7 @@ describe('TestDatabases', () => { await input.insert({ x: 'y' }).into('a'); // Look for the mark - const database = 'backstage_plugin_db0'; + const database = input.client.config.connection.database; const output = knexFactory({ client: 'pg', connection: { host, port, user, password, database }, @@ -105,7 +105,7 @@ describe('TestDatabases', () => { await input.insert({ x: 'y' }).into('a'); // Look for the mark - const database = 'backstage_plugin_db0'; + const database = input.client.config.connection.database; const output = knexFactory({ client: 'pg', connection: { host, port, user, password, database }, @@ -139,7 +139,7 @@ describe('TestDatabases', () => { await input.insert({ x: 'y' }).into('a'); // Look for the mark - const database = 'backstage_plugin_db0'; + const database = input.client.config.connection.database; const output = knexFactory({ client: 'mysql2', connection: { host, port, user, password, database }, diff --git a/packages/backend-test-utils/src/database/TestDatabases.ts b/packages/backend-test-utils/src/database/TestDatabases.ts index c35202354d..329aec5e8a 100644 --- a/packages/backend-test-utils/src/database/TestDatabases.ts +++ b/packages/backend-test-utils/src/database/TestDatabases.ts @@ -16,6 +16,7 @@ import { DatabaseManager } from '@backstage/backend-common'; import { ConfigReader } from '@backstage/config'; +import { randomBytes } from 'crypto'; import { Knex } from 'knex'; import { isDockerDisabledForTests } from '../util/isDockerDisabledForTests'; import { startMysqlContainer } from './startMysqlContainer'; @@ -34,7 +35,6 @@ import { export class TestDatabases { private readonly instanceById: Map; private readonly supportedIds: TestDatabaseId[]; - private lastDatabaseIndex: number; /** * Creates an empty `TestDatabases` instance, and sets up Jest to clean up @@ -99,7 +99,6 @@ export class TestDatabases { private constructor(supportedIds: TestDatabaseId[]) { this.instanceById = new Map(); this.supportedIds = supportedIds; - this.lastDatabaseIndex = 0; } supports(id: TestDatabaseId): boolean { @@ -142,7 +141,7 @@ export class TestDatabases { // Ensure that a unique logical database is created in the instance const connection = await instance.databaseManager - .forPlugin(String(`db${this.lastDatabaseIndex++}`)) + .forPlugin(`db${randomBytes(16).toString('hex')}`) .getClient(); instance.connections.push(connection); diff --git a/packages/backend-test-utils/src/database/types.ts b/packages/backend-test-utils/src/database/types.ts index b5516a19c0..514a3a85e8 100644 --- a/packages/backend-test-utils/src/database/types.ts +++ b/packages/backend-test-utils/src/database/types.ts @@ -38,33 +38,31 @@ export type Instance = { databaseManager: DatabaseManager; connections: Array; }; -export const allDatabases: Record< - TestDatabaseId, - TestDatabaseProperties -> = Object.freeze({ - POSTGRES_13: { - name: 'Postgres 13.x', - driver: 'pg', - dockerImageName: 'postgres:13', - connectionStringEnvironmentVariableName: - 'BACKSTAGE_TEST_DATABASE_POSTGRES13_CONNECTION_STRING', - }, - POSTGRES_9: { - name: 'Postgres 9.x', - driver: 'pg', - dockerImageName: 'postgres:9', - connectionStringEnvironmentVariableName: - 'BACKSTAGE_TEST_DATABASE_POSTGRES9_CONNECTION_STRING', - }, - MYSQL_8: { - name: 'MySQL 8.x', - driver: 'mysql2', - dockerImageName: 'mysql:8', - connectionStringEnvironmentVariableName: - 'BACKSTAGE_TEST_DATABASE_MYSQL8_CONNECTION_STRING', - }, - SQLITE_3: { - name: 'SQLite 3.x', - driver: 'sqlite3', - }, -}); +export const allDatabases: Record = + Object.freeze({ + POSTGRES_13: { + name: 'Postgres 13.x', + driver: 'pg', + dockerImageName: 'postgres:13', + connectionStringEnvironmentVariableName: + 'BACKSTAGE_TEST_DATABASE_POSTGRES13_CONNECTION_STRING', + }, + POSTGRES_9: { + name: 'Postgres 9.x', + driver: 'pg', + dockerImageName: 'postgres:9', + connectionStringEnvironmentVariableName: + 'BACKSTAGE_TEST_DATABASE_POSTGRES9_CONNECTION_STRING', + }, + MYSQL_8: { + name: 'MySQL 8.x', + driver: 'mysql2', + dockerImageName: 'mysql:8', + connectionStringEnvironmentVariableName: + 'BACKSTAGE_TEST_DATABASE_MYSQL8_CONNECTION_STRING', + }, + SQLITE_3: { + name: 'SQLite 3.x', + driver: 'sqlite3', + }, + }); diff --git a/packages/backend/CHANGELOG.md b/packages/backend/CHANGELOG.md index 56f6f2da72..39eabe46b0 100644 --- a/packages/backend/CHANGELOG.md +++ b/packages/backend/CHANGELOG.md @@ -1,5 +1,37 @@ # example-backend +## 0.2.41 + +### Patch Changes + +- Updated dependencies + - @backstage/plugin-auth-backend@0.3.20 + - @backstage/integration@0.6.0 + - @backstage/plugin-scaffolder-backend@0.15.0 + - @backstage/backend-common@0.8.9 + - @backstage/plugin-kubernetes-backend@0.3.14 + - @backstage/plugin-search-backend-module-elasticsearch@0.0.2 + - @backstage/plugin-search-backend-module-pg@0.1.1 + - @backstage/plugin-catalog-backend@0.13.2 + - @backstage/plugin-code-coverage-backend@0.1.9 + - @backstage/plugin-scaffolder-backend-module-rails@0.1.4 + - @backstage/plugin-techdocs-backend@0.9.2 + - @backstage/plugin-todo-backend@0.1.9 + - example-app@0.2.41 + +## 0.2.38 + +### Patch Changes + +- Updated dependencies + - @backstage/plugin-kubernetes-backend@0.3.11 + - @backstage/catalog-client@0.3.17 + - @backstage/plugin-auth-backend@0.3.18 + - @backstage/plugin-jenkins-backend@0.1.2 + - @backstage/backend-common@0.8.7 + - @backstage/plugin-techdocs-backend@0.9.0 + - @backstage/plugin-scaffolder-backend@0.14.1 + ## 0.2.37 ### Patch Changes diff --git a/packages/backend/package.json b/packages/backend/package.json index 315c966a07..b2877dedf5 100644 --- a/packages/backend/package.json +++ b/packages/backend/package.json @@ -1,6 +1,6 @@ { "name": "example-backend", - "version": "0.2.37", + "version": "0.2.41", "main": "dist/index.cjs.js", "types": "src/index.ts", "license": "Apache-2.0", @@ -27,33 +27,35 @@ "migrate:create": "knex migrate:make -x ts" }, "dependencies": { - "@backstage/backend-common": "^0.8.6", - "@backstage/catalog-client": "^0.3.16", + "@backstage/backend-common": "^0.8.9", + "@backstage/catalog-client": "^0.3.17", "@backstage/catalog-model": "^0.9.0", "@backstage/config": "^0.1.5", - "@backstage/integration": "^0.5.8", + "@backstage/integration": "^0.6.0", "@backstage/plugin-app-backend": "^0.3.15", - "@backstage/plugin-auth-backend": "^0.3.17", + "@backstage/plugin-auth-backend": "^0.3.20", "@backstage/plugin-badges-backend": "^0.1.8", - "@backstage/plugin-catalog-backend": "^0.13.0", - "@backstage/plugin-code-coverage-backend": "^0.1.8", + "@backstage/plugin-catalog-backend": "^0.13.2", + "@backstage/plugin-code-coverage-backend": "^0.1.9", "@backstage/plugin-graphql-backend": "^0.1.8", - "@backstage/plugin-jenkins-backend": "^0.1.1", - "@backstage/plugin-kubernetes-backend": "^0.3.10", + "@backstage/plugin-jenkins-backend": "^0.1.2", + "@backstage/plugin-kubernetes-backend": "^0.3.14", "@backstage/plugin-kafka-backend": "^0.2.8", "@backstage/plugin-proxy-backend": "^0.2.9", "@backstage/plugin-rollbar-backend": "^0.1.13", - "@backstage/plugin-scaffolder-backend": "^0.14.0", - "@backstage/plugin-scaffolder-backend-module-rails": "^0.1.3", + "@backstage/plugin-scaffolder-backend": "^0.15.0", + "@backstage/plugin-scaffolder-backend-module-rails": "^0.1.4", "@backstage/plugin-search-backend": "^0.2.3", "@backstage/plugin-search-backend-node": "^0.4.0", - "@backstage/plugin-techdocs-backend": "^0.8.7", - "@backstage/plugin-todo-backend": "^0.1.8", + "@backstage/plugin-search-backend-module-elasticsearch": "^0.0.2", + "@backstage/plugin-search-backend-module-pg": "^0.1.1", + "@backstage/plugin-techdocs-backend": "^0.9.2", + "@backstage/plugin-todo-backend": "^0.1.9", "@gitbeaker/node": "^30.2.0", "@octokit/rest": "^18.5.3", "azure-devops-node-api": "^10.2.2", "dockerode": "^3.2.1", - "example-app": "^0.2.37", + "example-app": "^0.2.41", "express": "^4.17.1", "express-promise-router": "^4.1.0", "knex": "^0.95.1", @@ -63,7 +65,7 @@ "winston": "^3.2.1" }, "devDependencies": { - "@backstage/cli": "^0.7.4", + "@backstage/cli": "^0.7.8", "@types/dockerode": "^3.2.1", "@types/express": "^4.17.6", "@types/express-serve-static-core": "^4.17.5" diff --git a/packages/backend/src/plugins/search.ts b/packages/backend/src/plugins/search.ts index 4a1e415c74..3470110408 100644 --- a/packages/backend/src/plugins/search.ts +++ b/packages/backend/src/plugins/search.ts @@ -13,21 +13,55 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import { useHotCleanup } from '@backstage/backend-common'; +import { + PluginDatabaseManager, + useHotCleanup, +} from '@backstage/backend-common'; +import { Config } from '@backstage/config'; +import { DefaultCatalogCollator } from '@backstage/plugin-catalog-backend'; import { createRouter } from '@backstage/plugin-search-backend'; +import { ElasticSearchSearchEngine } from '@backstage/plugin-search-backend-module-elasticsearch'; +import { PgSearchEngine } from '@backstage/plugin-search-backend-module-pg'; import { IndexBuilder, LunrSearchEngine, + SearchEngine, } from '@backstage/plugin-search-backend-node'; +import { DefaultTechDocsCollator } from '@backstage/plugin-techdocs-backend'; +import { Logger } from 'winston'; import { PluginEnvironment } from '../types'; -import { DefaultCatalogCollator } from '@backstage/plugin-catalog-backend'; + +async function createSearchEngine({ + logger, + database, + config, +}: { + logger: Logger; + database: PluginDatabaseManager; + config: Config; +}): Promise { + if (config.has('search.elasticsearch')) { + return await ElasticSearchSearchEngine.fromConfig({ + logger, + config, + }); + } + + if (await PgSearchEngine.supported(database)) { + return await PgSearchEngine.from({ database }); + } + + return new LunrSearchEngine({ logger }); +} export default async function createPlugin({ logger, discovery, + config, + database, }: PluginEnvironment) { // Initialize a connection to a search engine. - const searchEngine = new LunrSearchEngine({ logger }); + const searchEngine = await createSearchEngine({ config, logger, database }); const indexBuilder = new IndexBuilder({ logger, searchEngine }); // Collators are responsible for gathering documents known to plugins. This @@ -37,6 +71,11 @@ export default async function createPlugin({ collator: new DefaultCatalogCollator({ discovery }), }); + indexBuilder.addCollator({ + defaultRefreshIntervalSeconds: 600, + collator: new DefaultTechDocsCollator({ discovery, logger }), + }); + // The scheduler controls when documents are gathered from collators and sent // to the search engine for indexing. const { scheduler } = await indexBuilder.build(); diff --git a/packages/catalog-client/CHANGELOG.md b/packages/catalog-client/CHANGELOG.md index 70b79b961f..d04d1dc936 100644 --- a/packages/catalog-client/CHANGELOG.md +++ b/packages/catalog-client/CHANGELOG.md @@ -1,5 +1,17 @@ # @backstage/catalog-client +## 0.3.18 + +### Patch Changes + +- 11c370af2: Support filtering entities via property existence + +## 0.3.17 + +### Patch Changes + +- 71c936eb6: Export `CatalogRequestOptions` type + ## 0.3.16 ### Patch Changes diff --git a/packages/catalog-client/api-report.md b/packages/catalog-client/api-report.md index 52757614a7..173af9aef3 100644 --- a/packages/catalog-client/api-report.md +++ b/packages/catalog-client/api-report.md @@ -25,6 +25,11 @@ export type AddLocationResponse = { entities: Entity[]; }; +// Warning: (ae-missing-release-tag) "CATALOG_FILTER_EXISTS" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) +// +// @public (undocumented) +export const CATALOG_FILTER_EXISTS: unique symbol; + // Warning: (ae-missing-release-tag) "CatalogApi" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) // // @public (undocumented) @@ -34,8 +39,6 @@ export interface CatalogApi { location: AddLocationRequest, options?: CatalogRequestOptions, ): Promise; - // Warning: (ae-forgotten-export) The symbol "CatalogRequestOptions" needs to be exported by the entry point index.d.ts - // // (undocumented) getEntities( request?: CatalogEntitiesRequest, @@ -125,8 +128,8 @@ export class CatalogClient implements CatalogApi { // @public (undocumented) export type CatalogEntitiesRequest = { filter?: - | Record[] - | Record + | Record[] + | Record | undefined; fields?: string[] | undefined; }; @@ -138,6 +141,13 @@ export type CatalogListResponse = { items: T[]; }; +// Warning: (ae-missing-release-tag) "CatalogRequestOptions" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) +// +// @public (undocumented) +export type CatalogRequestOptions = { + token?: string; +}; + // Warning: (ae-missing-release-tag) "ENTITY_STATUS_CATALOG_PROCESSING_TYPE" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) // // @public diff --git a/packages/catalog-client/package.json b/packages/catalog-client/package.json index fbb37d2449..cdbee32305 100644 --- a/packages/catalog-client/package.json +++ b/packages/catalog-client/package.json @@ -1,6 +1,6 @@ { "name": "@backstage/catalog-client", - "version": "0.3.16", + "version": "0.3.18", "main": "src/index.ts", "types": "src/index.ts", "license": "Apache-2.0", @@ -35,7 +35,7 @@ "cross-fetch": "^3.0.6" }, "devDependencies": { - "@backstage/cli": "^0.7.3", + "@backstage/cli": "^0.7.6", "@types/jest": "^26.0.7", "msw": "^0.29.0" }, diff --git a/packages/catalog-client/src/CatalogClient.test.ts b/packages/catalog-client/src/CatalogClient.test.ts index 4e3d95f99f..d2db98bb25 100644 --- a/packages/catalog-client/src/CatalogClient.test.ts +++ b/packages/catalog-client/src/CatalogClient.test.ts @@ -18,7 +18,7 @@ import { Entity } from '@backstage/catalog-model'; import { rest } from 'msw'; import { setupServer } from 'msw/node'; import { CatalogClient } from './CatalogClient'; -import { CatalogListResponse } from './types/api'; +import { CATALOG_FILTER_EXISTS, CatalogListResponse } from './types/api'; import { DiscoveryApi } from './types/discovery'; const server = setupServer(); @@ -83,7 +83,7 @@ describe('CatalogClient', () => { server.use( rest.get(`${mockBaseUrl}/entities`, (req, res, ctx) => { expect(req.url.search).toBe( - '?filter=a=1,b=2,b=3,%C3%B6=%3D&filter=a=2', + '?filter=a=1,b=2,b=3,%C3%B6=%3D&filter=a=2&filter=c', ); return res(ctx.json([])); }), @@ -100,6 +100,9 @@ describe('CatalogClient', () => { { a: '2', }, + { + c: CATALOG_FILTER_EXISTS, + }, ], }, { token }, @@ -113,7 +116,7 @@ describe('CatalogClient', () => { server.use( rest.get(`${mockBaseUrl}/entities`, (req, res, ctx) => { - expect(req.url.search).toBe('?filter=a=1,b=2,b=3,%C3%B6=%3D'); + expect(req.url.search).toBe('?filter=a=1,b=2,b=3,%C3%B6=%3D,c'); return res(ctx.json([])); }), ); @@ -124,6 +127,7 @@ describe('CatalogClient', () => { a: '1', b: ['2', '3'], ö: '=', + c: CATALOG_FILTER_EXISTS, }, }, { token }, diff --git a/packages/catalog-client/src/CatalogClient.ts b/packages/catalog-client/src/CatalogClient.ts index 5dfcddde0c..ef90287c37 100644 --- a/packages/catalog-client/src/CatalogClient.ts +++ b/packages/catalog-client/src/CatalogClient.ts @@ -26,6 +26,7 @@ import { import { ResponseError } from '@backstage/errors'; import fetch from 'cross-fetch'; import { + CATALOG_FILTER_EXISTS, AddLocationRequest, AddLocationResponse, CatalogApi, @@ -69,9 +70,13 @@ export class CatalogClient implements CatalogApi { const filterParts: string[] = []; for (const [key, value] of Object.entries(filterItem)) { for (const v of [value].flat()) { - filterParts.push( - `${encodeURIComponent(key)}=${encodeURIComponent(v)}`, - ); + if (v === CATALOG_FILTER_EXISTS) { + filterParts.push(encodeURIComponent(key)); + } else if (typeof v === 'string') { + filterParts.push( + `${encodeURIComponent(key)}=${encodeURIComponent(v)}`, + ); + } } } diff --git a/packages/catalog-client/src/types/api.ts b/packages/catalog-client/src/types/api.ts index ae3fd7b514..d30caa50d6 100644 --- a/packages/catalog-client/src/types/api.ts +++ b/packages/catalog-client/src/types/api.ts @@ -16,10 +16,12 @@ import { Entity, EntityName, Location } from '@backstage/catalog-model'; +export const CATALOG_FILTER_EXISTS = Symbol('CATALOG_FILTER_EXISTS'); + export type CatalogEntitiesRequest = { filter?: - | Record[] - | Record + | Record[] + | Record | undefined; fields?: string[] | undefined; }; diff --git a/packages/catalog-client/src/types/index.ts b/packages/catalog-client/src/types/index.ts index 842d0393a4..3bfcdd7fba 100644 --- a/packages/catalog-client/src/types/index.ts +++ b/packages/catalog-client/src/types/index.ts @@ -20,5 +20,7 @@ export type { CatalogApi, CatalogEntitiesRequest, CatalogListResponse, + CatalogRequestOptions, } from './api'; +export { CATALOG_FILTER_EXISTS } from './api'; export { ENTITY_STATUS_CATALOG_PROCESSING_TYPE } from './status'; diff --git a/packages/catalog-model/api-report.md b/packages/catalog-model/api-report.md index 437a0be02b..13041d9e32 100644 --- a/packages/catalog-model/api-report.md +++ b/packages/catalog-model/api-report.md @@ -190,7 +190,7 @@ export type EntityEnvelope = { // // @public export function entityEnvelopeSchemaValidator< - T extends EntityEnvelope = EntityEnvelope + T extends EntityEnvelope = EntityEnvelope, >(schema?: unknown): (data: unknown) => T; // Warning: (tsdoc-param-tag-missing-hyphen) The @param block should be followed by a parameter name and then a hyphen @@ -333,9 +333,7 @@ export function getEntityName(entity: Entity): EntityName; // Warning: (ae-missing-release-tag) "getEntitySourceLocation" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) // // @public -export function getEntitySourceLocation( - entity: Entity, -): { +export function getEntitySourceLocation(entity: Entity): { type: string; target: string; }; @@ -542,9 +540,7 @@ export function parseEntityRef( // Warning: (ae-missing-release-tag) "parseLocationReference" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) // // @public -export function parseLocationReference( - ref: string, -): { +export function parseLocationReference(ref: string): { type: string; target: string; }; diff --git a/packages/catalog-model/src/entity/policies/SchemaValidEntityPolicy.test.ts b/packages/catalog-model/src/entity/policies/SchemaValidEntityPolicy.test.ts index 21539aaba4..c263689446 100644 --- a/packages/catalog-model/src/entity/policies/SchemaValidEntityPolicy.test.ts +++ b/packages/catalog-model/src/entity/policies/SchemaValidEntityPolicy.test.ts @@ -58,7 +58,7 @@ describe('SchemaValidEntityPolicy', () => { // it('rejects wrong root type', async () => { - await expect(policy.enforce((7 as unknown) as Entity)).rejects.toThrow( + await expect(policy.enforce(7 as unknown as Entity)).rejects.toThrow( /object/, ); }); diff --git a/packages/catalog-model/src/entity/ref.ts b/packages/catalog-model/src/entity/ref.ts index 91d8547c6b..e2d9c5b203 100644 --- a/packages/catalog-model/src/entity/ref.ts +++ b/packages/catalog-model/src/entity/ref.ts @@ -18,9 +18,7 @@ import { EntityName, EntityRef } from '../types'; import { ENTITY_DEFAULT_NAMESPACE } from './constants'; import { Entity } from './Entity'; -function parseRefString( - ref: string, -): { +function parseRefString(ref: string): { kind?: string; namespace?: string; name: string; diff --git a/packages/catalog-model/src/kinds/ApiEntityV1alpha1.ts b/packages/catalog-model/src/kinds/ApiEntityV1alpha1.ts index 737037e6b2..2bcd9c7040 100644 --- a/packages/catalog-model/src/kinds/ApiEntityV1alpha1.ts +++ b/packages/catalog-model/src/kinds/ApiEntityV1alpha1.ts @@ -30,6 +30,5 @@ export interface ApiEntityV1alpha1 extends Entity { }; } -export const apiEntityV1alpha1Validator = ajvCompiledJsonSchemaValidator( - schema, -); +export const apiEntityV1alpha1Validator = + ajvCompiledJsonSchemaValidator(schema); diff --git a/packages/catalog-model/src/kinds/ComponentEntityV1alpha1.ts b/packages/catalog-model/src/kinds/ComponentEntityV1alpha1.ts index 4e08d4cce9..5312d87a35 100644 --- a/packages/catalog-model/src/kinds/ComponentEntityV1alpha1.ts +++ b/packages/catalog-model/src/kinds/ComponentEntityV1alpha1.ts @@ -33,6 +33,5 @@ export interface ComponentEntityV1alpha1 extends Entity { }; } -export const componentEntityV1alpha1Validator = ajvCompiledJsonSchemaValidator( - schema, -); +export const componentEntityV1alpha1Validator = + ajvCompiledJsonSchemaValidator(schema); diff --git a/packages/catalog-model/src/kinds/DomainEntityV1alpha1.ts b/packages/catalog-model/src/kinds/DomainEntityV1alpha1.ts index c2f39de321..c832f35ee0 100644 --- a/packages/catalog-model/src/kinds/DomainEntityV1alpha1.ts +++ b/packages/catalog-model/src/kinds/DomainEntityV1alpha1.ts @@ -26,6 +26,5 @@ export interface DomainEntityV1alpha1 extends Entity { }; } -export const domainEntityV1alpha1Validator = ajvCompiledJsonSchemaValidator( - schema, -); +export const domainEntityV1alpha1Validator = + ajvCompiledJsonSchemaValidator(schema); diff --git a/packages/catalog-model/src/kinds/GroupEntityV1alpha1.ts b/packages/catalog-model/src/kinds/GroupEntityV1alpha1.ts index 28f1503223..263ba311ad 100644 --- a/packages/catalog-model/src/kinds/GroupEntityV1alpha1.ts +++ b/packages/catalog-model/src/kinds/GroupEntityV1alpha1.ts @@ -34,6 +34,5 @@ export interface GroupEntityV1alpha1 extends Entity { }; } -export const groupEntityV1alpha1Validator = ajvCompiledJsonSchemaValidator( - schema, -); +export const groupEntityV1alpha1Validator = + ajvCompiledJsonSchemaValidator(schema); diff --git a/packages/catalog-model/src/kinds/LocationEntityV1alpha1.ts b/packages/catalog-model/src/kinds/LocationEntityV1alpha1.ts index 4a37340bee..44f04b2c39 100644 --- a/packages/catalog-model/src/kinds/LocationEntityV1alpha1.ts +++ b/packages/catalog-model/src/kinds/LocationEntityV1alpha1.ts @@ -28,6 +28,5 @@ export interface LocationEntityV1alpha1 extends Entity { }; } -export const locationEntityV1alpha1Validator = ajvCompiledJsonSchemaValidator( - schema, -); +export const locationEntityV1alpha1Validator = + ajvCompiledJsonSchemaValidator(schema); diff --git a/packages/catalog-model/src/kinds/ResourceEntityV1alpha1.ts b/packages/catalog-model/src/kinds/ResourceEntityV1alpha1.ts index c8f96b87e3..211164f4c1 100644 --- a/packages/catalog-model/src/kinds/ResourceEntityV1alpha1.ts +++ b/packages/catalog-model/src/kinds/ResourceEntityV1alpha1.ts @@ -29,6 +29,5 @@ export interface ResourceEntityV1alpha1 extends Entity { }; } -export const resourceEntityV1alpha1Validator = ajvCompiledJsonSchemaValidator( - schema, -); +export const resourceEntityV1alpha1Validator = + ajvCompiledJsonSchemaValidator(schema); diff --git a/packages/catalog-model/src/kinds/SystemEntityV1alpha1.ts b/packages/catalog-model/src/kinds/SystemEntityV1alpha1.ts index 7c719566ad..129e3fea50 100644 --- a/packages/catalog-model/src/kinds/SystemEntityV1alpha1.ts +++ b/packages/catalog-model/src/kinds/SystemEntityV1alpha1.ts @@ -27,6 +27,5 @@ export interface SystemEntityV1alpha1 extends Entity { }; } -export const systemEntityV1alpha1Validator = ajvCompiledJsonSchemaValidator( - schema, -); +export const systemEntityV1alpha1Validator = + ajvCompiledJsonSchemaValidator(schema); diff --git a/packages/catalog-model/src/kinds/TemplateEntityV1beta2.ts b/packages/catalog-model/src/kinds/TemplateEntityV1beta2.ts index 2710fe1275..577e5ec9e2 100644 --- a/packages/catalog-model/src/kinds/TemplateEntityV1beta2.ts +++ b/packages/catalog-model/src/kinds/TemplateEntityV1beta2.ts @@ -40,6 +40,5 @@ export interface TemplateEntityV1beta2 extends Entity { }; } -export const templateEntityV1beta2Validator = ajvCompiledJsonSchemaValidator( - schema, -); +export const templateEntityV1beta2Validator = + ajvCompiledJsonSchemaValidator(schema); diff --git a/packages/catalog-model/src/kinds/UserEntityV1alpha1.ts b/packages/catalog-model/src/kinds/UserEntityV1alpha1.ts index 267a9f07fd..65ebdb3262 100644 --- a/packages/catalog-model/src/kinds/UserEntityV1alpha1.ts +++ b/packages/catalog-model/src/kinds/UserEntityV1alpha1.ts @@ -31,6 +31,5 @@ export interface UserEntityV1alpha1 extends Entity { }; } -export const userEntityV1alpha1Validator = ajvCompiledJsonSchemaValidator( - schema, -); +export const userEntityV1alpha1Validator = + ajvCompiledJsonSchemaValidator(schema); diff --git a/packages/catalog-model/src/location/helpers.ts b/packages/catalog-model/src/location/helpers.ts index 431ee71218..91209e7a2a 100644 --- a/packages/catalog-model/src/location/helpers.ts +++ b/packages/catalog-model/src/location/helpers.ts @@ -26,9 +26,10 @@ import { LOCATION_ANNOTATION, SOURCE_LOCATION_ANNOTATION } from './annotation'; * @param ref A string-form location reference, e.g. 'url:https://host' * @returns A location reference, e.g. { type: 'url', target: 'https://host' } */ -export function parseLocationReference( - ref: string, -): { type: string; target: string } { +export function parseLocationReference(ref: string): { + type: string; + target: string; +} { if (typeof ref !== 'string') { throw new TypeError( `Unable to parse location reference '${ref}', unexpected argument ${typeof ref}`, @@ -91,9 +92,10 @@ export function stringifyLocationReference(ref: { * using the UrlReader from @backstage/backend-common. If it is not of type 'url', the caller * needs to have explicit handling of each location type or signal that it is not supported. */ -export function getEntitySourceLocation( - entity: Entity, -): { type: string; target: string } { +export function getEntitySourceLocation(entity: Entity): { + type: string; + target: string; +} { const locationRef = entity.metadata?.annotations?.[SOURCE_LOCATION_ANNOTATION] ?? entity.metadata?.annotations?.[LOCATION_ANNOTATION]; diff --git a/packages/catalog-model/src/validation/entityEnvelopeSchemaValidator.ts b/packages/catalog-model/src/validation/entityEnvelopeSchemaValidator.ts index 2fe74ea2a4..aa865bcf1c 100644 --- a/packages/catalog-model/src/validation/entityEnvelopeSchemaValidator.ts +++ b/packages/catalog-model/src/validation/entityEnvelopeSchemaValidator.ts @@ -41,7 +41,7 @@ import { compileAjvSchema, throwAjvError } from './ajv'; * @see https://github.com/backstage/backstage/tree/master/packages/catalog-model/src/schema */ export function entityEnvelopeSchemaValidator< - T extends EntityEnvelope = EntityEnvelope + T extends EntityEnvelope = EntityEnvelope, >(schema?: unknown): (data: unknown) => T { const validate = compileAjvSchema( schema ? (schema as Schema) : entityEnvelopeSchema, diff --git a/packages/cli/CHANGELOG.md b/packages/cli/CHANGELOG.md index 3dba2e4ec7..848a106db0 100644 --- a/packages/cli/CHANGELOG.md +++ b/packages/cli/CHANGELOG.md @@ -1,5 +1,38 @@ # @backstage/cli +## 0.7.8 + +### Patch Changes + +- c4ef9181a: Migrate to using `webpack@5` 🎉 + +## 0.7.7 + +### Patch Changes + +- 6aa7c3db7: bump node-tar version to the latest +- e9d3983ee: Keep track of filtered configuration values when running frontend in development mode. +- Updated dependencies + - @backstage/config@0.1.6 + - @backstage/config-loader@0.6.6 + +## 0.7.6 + +### Patch Changes + +- 9d40fcb1e: - Bumping `material-ui/core` version to at least `4.12.2` as they made some breaking changes in later versions which broke `Pagination` of the `Table`. + - Switching out `material-table` to `@material-table/core` for support for the later versions of `material-ui/core` + - This causes a minor API change to `@backstage/core-components` as the interface for `Table` re-exports the `prop` from the underlying `Table` components. + - `onChangeRowsPerPage` has been renamed to `onRowsPerPageChange` + - `onChangePage` has been renamed to `onPageChange` + - Migration guide is here: https://material-table-core.com/docs/breaking-changes + +## 0.7.5 + +### Patch Changes + +- 9a96b5da7: chore: bump `eslint` to `7.30.0` + ## 0.7.4 ### Patch Changes diff --git a/packages/cli/package.json b/packages/cli/package.json index c539b1a382..890fc8ed01 100644 --- a/packages/cli/package.json +++ b/packages/cli/package.json @@ -1,7 +1,7 @@ { "name": "@backstage/cli", "description": "CLI for developing Backstage plugins and apps", - "version": "0.7.4", + "version": "0.7.8", "private": false, "publishConfig": { "access": "public" @@ -31,8 +31,8 @@ "@babel/core": "^7.4.4", "@babel/plugin-transform-modules-commonjs": "^7.4.4", "@backstage/cli-common": "^0.1.2", - "@backstage/config": "^0.1.5", - "@backstage/config-loader": "^0.6.5", + "@backstage/config": "^0.1.6", + "@backstage/config-loader": "^0.6.6", "@hot-loader/react-dom": "^16.13.0", "@lerna/package-graph": "^4.0.0", "@lerna/project": "^4.0.0", @@ -50,14 +50,13 @@ "@svgr/plugin-svgo": "5.4.x", "@svgr/rollup": "5.5.x", "@svgr/webpack": "5.5.x", - "@types/start-server-webpack-plugin": "^2.2.0", "@types/webpack-env": "^1.15.2", - "@types/webpack-node-externals": "^2.5.0", "@typescript-eslint/eslint-plugin": "^v4.28.3", "@typescript-eslint/parser": "^v4.28.3", "@yarnpkg/lockfile": "^1.1.0", "babel-plugin-dynamic-import-node": "^2.3.3", "bfj": "^7.0.2", + "buffer": "^6.0.3", "chalk": "^4.0.0", "chokidar": "^3.3.1", "commander": "^6.1.0", @@ -76,18 +75,19 @@ "eslint-plugin-react-hooks": "^4.0.0", "express": "^4.17.1", "file-loader": "^6.2.0", - "fork-ts-checker-webpack-plugin": "^6.2.9", + "fork-ts-checker-webpack-plugin": "^4.0.5", "fs-extra": "9.1.0", "handlebars": "^4.7.3", - "html-webpack-plugin": "^4.3.0", + "html-webpack-plugin": "^5.3.1", "inquirer": "^7.0.4", "jest": "^26.0.1", "jest-css-modules": "^2.1.0", "json-schema": "^0.3.0", "lodash": "^4.17.19", - "mini-css-extract-plugin": "^0.9.0", + "mini-css-extract-plugin": "^1.4.1", "ora": "^5.3.0", "postcss": "^8.1.0", + "process": "^0.11.10", "raw-loader": "^4.0.1", "react": "^16.0.0", "react-dev-utils": "^11.0.4", @@ -100,17 +100,18 @@ "rollup-plugin-peer-deps-external": "^2.2.2", "rollup-plugin-postcss": "^4.0.0", "rollup-pluginutils": "^2.8.2", + "run-script-webpack-plugin": "^0.0.11", "semver": "^7.3.2", - "start-server-webpack-plugin": "^2.2.5", "style-loader": "^1.2.1", "sucrase": "^3.18.2", - "tar": "^6.0.1", - "terser-webpack-plugin": "^1.4.3", + "tar": "^6.1.2", + "terser-webpack-plugin": "^5.1.3", "ts-loader": "^8.0.17", "typescript": "^4.0.3", "url-loader": "^4.1.0", - "webpack": "^4.41.6", - "webpack-dev-server": "3.11.0", + "util": "^0.12.3", + "webpack": "^5.48.0", + "webpack-dev-server": "4.0.0-rc.0", "webpack-node-externals": "^3.0.0", "yaml": "^1.10.0", "yaml-jest": "^1.0.5", @@ -118,36 +119,37 @@ "yn": "^4.0.0" }, "devDependencies": { - "@backstage/backend-common": "^0.8.6", - "@backstage/config": "^0.1.5", - "@backstage/core-components": "^0.1.4", - "@backstage/core-plugin-api": "^0.1.3", - "@backstage/core-app-api": "^0.1.4", - "@backstage/dev-utils": "^0.2.2", - "@backstage/test-utils": "^0.1.14", - "@backstage/theme": "^0.2.8", + "@backstage/backend-common": "^0.8.9", + "@backstage/config": "^0.1.6", + "@backstage/core-components": "^0.3.1", + "@backstage/core-plugin-api": "^0.1.6", + "@backstage/core-app-api": "^0.1.8", + "@backstage/dev-utils": "^0.2.6", + "@backstage/test-utils": "^0.1.17", + "@backstage/theme": "^0.2.9", "@types/diff": "^5.0.0", "@types/express": "^4.17.6", "@types/fs-extra": "^9.0.1", - "@types/html-webpack-plugin": "^3.2.2", "@types/http-proxy": "^1.17.4", "@types/inquirer": "^7.3.1", - "@types/mini-css-extract-plugin": "^1.2.2", "@types/mock-fs": "^4.13.0", "@types/node": "^14.14.32", - "@types/react-dev-utils": "^9.0.4", "@types/recursive-readdir": "^2.2.0", "@types/rollup-plugin-peer-deps-external": "^2.2.0", "@types/rollup-plugin-postcss": "^2.0.0", "@types/tar": "^4.0.3", - "@types/webpack": "^4.41.7", - "@types/webpack-dev-server": "^3.11.0", + "@types/terser-webpack-plugin": "^5.0.4", + "@types/webpack": "^5.28.0", + "@types/webpack-dev-server": "^3.11.5", "@types/yarnpkg__lockfile": "^1.1.4", "del": "^6.0.0", "mock-fs": "^4.13.0", "nodemon": "^2.0.2", "ts-node": "^10.0.0" }, + "resolutions": { + "@types/webpack-dev-server/@types/webpack": "^5.28.0" + }, "files": [ "asset-types", "templates", diff --git a/packages/cli/src/commands/app/serve.ts b/packages/cli/src/commands/app/serve.ts index 85fbdd97a0..208042c719 100644 --- a/packages/cli/src/commands/app/serve.ts +++ b/packages/cli/src/commands/app/serve.ts @@ -59,6 +59,7 @@ export default async (cmd: Command) => { ...(await loadCliConfig({ args: cmd.config, fromPackage: name, + withFilteredKeys: true, })), }); diff --git a/packages/cli/src/commands/plugin/serve.ts b/packages/cli/src/commands/plugin/serve.ts index b9ba93bc62..a0200b7ce8 100644 --- a/packages/cli/src/commands/plugin/serve.ts +++ b/packages/cli/src/commands/plugin/serve.ts @@ -28,6 +28,7 @@ export default async (cmd: Command) => { ...(await loadCliConfig({ args: cmd.config, fromPackage: name, + withFilteredKeys: true, })), }); diff --git a/packages/cli/src/commands/versions/lint.ts b/packages/cli/src/commands/versions/lint.ts index 68d0766217..c542da6dfb 100644 --- a/packages/cli/src/commands/versions/lint.ts +++ b/packages/cli/src/commands/versions/lint.ts @@ -55,11 +55,9 @@ export default async (cmd: Command) => { lockfile.replaceVersions(result.newVersions); await lockfile.save(); } else { - const [ - newVersionsForbidden, - newVersionsAllowed, - ] = partition(result.newVersions, ({ name }) => - forbiddenDuplicatesFilter(name), + const [newVersionsForbidden, newVersionsAllowed] = partition( + result.newVersions, + ({ name }) => forbiddenDuplicatesFilter(name), ); if (newVersionsForbidden.length && !fix) { success = false; diff --git a/packages/cli/src/lib/bundler/LinkedPackageResolvePlugin.ts b/packages/cli/src/lib/bundler/LinkedPackageResolvePlugin.ts index aa6a6b4e2e..91615eddee 100644 --- a/packages/cli/src/lib/bundler/LinkedPackageResolvePlugin.ts +++ b/packages/cli/src/lib/bundler/LinkedPackageResolvePlugin.ts @@ -15,14 +15,14 @@ */ import { resolve as resolvePath } from 'path'; -import { ResolvePlugin } from 'webpack'; +import { WebpackPluginInstance } from 'webpack'; import { isChildPath } from '@backstage/cli-common'; import { LernaPackage } from './types'; // Enables proper resolution of packages when linking in external packages. // Without this the packages would depend on dependencies in the node_modules // of the external packages themselves, leading to module duplication -export class LinkedPackageResolvePlugin implements ResolvePlugin { +export class LinkedPackageResolvePlugin implements WebpackPluginInstance { constructor( private readonly targetModules: string, private readonly packages: LernaPackage[], diff --git a/packages/cli/src/lib/bundler/backend.ts b/packages/cli/src/lib/bundler/backend.ts index bddeac0de3..567fc3476a 100644 --- a/packages/cli/src/lib/bundler/backend.ts +++ b/packages/cli/src/lib/bundler/backend.ts @@ -26,23 +26,17 @@ export async function serveBackend(options: BackendServeOptions) { isDev: true, }); - const compiler = webpack(config); - - const watcher = compiler.watch( - { - poll: true, - }, - (err: Error) => { - if (err) { - console.error(err); - } else console.log('Build succeeded'); - }, - ); + const compiler = webpack(config, (err: Error | undefined) => { + if (err) { + console.log('here'); + console.error(err); + } else console.log('Build succeeded'); + }); const waitForExit = async () => { for (const signal of ['SIGINT', 'SIGTERM'] as const) { process.on(signal, () => { - watcher.close(() => console.log('Stopped watcher')); + compiler.close(() => console.log('Stopped watcher')); // exit instead of resolve. The process is shutting down and resolving a promise here logs an error process.exit(); }); diff --git a/packages/cli/src/lib/bundler/bundle.ts b/packages/cli/src/lib/bundler/bundle.ts index 17a7398b2a..082b1247ab 100644 --- a/packages/cli/src/lib/bundler/bundle.ts +++ b/packages/cli/src/lib/bundler/bundle.ts @@ -69,6 +69,10 @@ export async function buildBundle(options: BuildOptions) { throw new Error(`Failed to compile.\n${error.message || error}`); }); + if (!stats) { + throw new Error('No stats returned'); + } + if (statsJsonEnabled) { // No @types/bfj await require('bfj').write( @@ -87,25 +91,32 @@ export async function buildBundle(options: BuildOptions) { } async function build(compiler: webpack.Compiler, isCi: boolean) { - const stats = await new Promise((resolve, reject) => { - compiler.run((err, buildStats) => { - if (err) { - if (err.message) { - const { errors } = formatWebpackMessages({ - errors: [err.message], - warnings: new Array(), - } as webpack.Stats.ToJsonOutput); + const stats = await new Promise( + (resolve, reject) => { + compiler.run((err, buildStats) => { + if (err) { + if (err.message) { + const { errors } = formatWebpackMessages({ + errors: [err.message], + warnings: new Array(), + _showErrors: true, + _showWarnings: true, + }); - throw new Error(errors[0]); + throw new Error(errors[0]); + } else { + reject(err); + } } else { - reject(err); + resolve(buildStats); } - } else { - resolve(buildStats); - } - }); - }); + }); + }, + ); + if (!stats) { + throw new Error('No stats provided'); + } const { errors, warnings } = formatWebpackMessages( stats.toJson({ all: false, warnings: true, errors: true }), ); diff --git a/packages/cli/src/lib/bundler/config.ts b/packages/cli/src/lib/bundler/config.ts index 75e94af716..c9e858a31c 100644 --- a/packages/cli/src/lib/bundler/config.ts +++ b/packages/cli/src/lib/bundler/config.ts @@ -19,8 +19,8 @@ import { resolve as resolvePath } from 'path'; import ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin'; import HtmlWebpackPlugin from 'html-webpack-plugin'; import ModuleScopePlugin from 'react-dev-utils/ModuleScopePlugin'; -import StartServerPlugin from 'start-server-webpack-plugin'; -import webpack from 'webpack'; +import { RunScriptWebpackPlugin } from 'run-script-webpack-plugin'; +import webpack, { ProvidePlugin } from 'webpack'; import nodeExternals from 'webpack-node-externals'; import { isChildPath } from '@backstage/cli-common'; import { optimization } from './optimization'; @@ -98,10 +98,9 @@ export async function createConfig( if (checksEnabled) { plugins.push( new ForkTsCheckerWebpackPlugin({ - typescript: { - configFile: paths.targetTsConfig, - }, - eslint: { + typescript: paths.targetTsConfig, + eslint: true, + eslintOptions: { files: ['**', '!**/__tests__/**', '!**/?(*.)(spec|test).*'], options: { parserOptions: { @@ -114,6 +113,16 @@ export async function createConfig( ); } + // TODO(blam): process is no longer auto polyfilled by webpack in v5. + // we use the provide plugin to provide this polyfill, but lets look + // to remove this eventually! + plugins.push( + new ProvidePlugin({ + process: 'process/browser', + Buffer: ['buffer', 'Buffer'], + }), + ); + plugins.push( new webpack.EnvironmentPlugin({ APP_CONFIG: options.frontendAppConfigs, @@ -156,27 +165,33 @@ export async function createConfig( return { mode: isDev ? 'development' : 'production', profile: false, - node: { - module: 'empty', - dgram: 'empty', - dns: 'mock', - fs: 'empty', - http2: 'empty', - net: 'empty', - tls: 'empty', - child_process: 'empty', - }, optimization: optimization(options), bail: false, performance: { hints: false, // we check the gzip size instead }, - devtool: isDev ? 'cheap-module-eval-source-map' : 'source-map', + devtool: isDev ? 'eval-cheap-module-source-map' : 'source-map', context: paths.targetPath, entry: [require.resolve('react-hot-loader/patch'), paths.targetEntry], resolve: { extensions: ['.ts', '.tsx', '.mjs', '.js', '.jsx'], mainFields: ['browser', 'module', 'main'], + fallback: { + module: false, + dgram: false, + dns: false, + fs: false, + http2: false, + net: false, + tls: false, + child_process: false, + + /* new ignores */ + path: false, + https: false, + http: false, + util: require.resolve('util/'), + }, plugins: [ new LinkedPackageResolvePlugin(paths.rootNodeModules, externalPkgs), new ModuleScopePlugin( @@ -200,7 +215,7 @@ export async function createConfig( : 'static/[name].[chunkhash:8].chunk.js', ...(isDev ? { - devtoolModuleFilenameTemplate: info => + devtoolModuleFilenameTemplate: (info: any) => `file:///${resolvePath(info.absoluteResourcePath).replace( /\\/g, '/', @@ -237,7 +252,7 @@ export async function createBackendConfig( ? { watch: true, watchOptions: { - ignored: [/node_modules\/(?!\@backstage)/], + ignored: /node_modules\/(?!\@backstage)/, }, } : {}), @@ -259,7 +274,7 @@ export async function createBackendConfig( performance: { hints: false, // we check the gzip size instead }, - devtool: isDev ? 'cheap-module-eval-source-map' : 'source-map', + devtool: isDev ? 'eval-cheap-module-source-map' : 'source-map', context: paths.targetPath, entry: [ 'webpack/hot/poll?100', @@ -291,7 +306,7 @@ export async function createBackendConfig( : '[name].[chunkhash:8].chunk.js', ...(isDev ? { - devtoolModuleFilenameTemplate: info => + devtoolModuleFilenameTemplate: (info: any) => `file:///${resolvePath(info.absoluteResourcePath).replace( /\\/g, '/', @@ -300,7 +315,7 @@ export async function createBackendConfig( : {}), }, plugins: [ - new StartServerPlugin({ + new RunScriptWebpackPlugin({ name: 'main.js', nodeArgs: options.inspectEnabled ? ['--inspect'] : undefined, }), @@ -308,10 +323,9 @@ export async function createBackendConfig( ...(checksEnabled ? [ new ForkTsCheckerWebpackPlugin({ - typescript: { - configFile: paths.targetTsConfig, - }, - eslint: { + typescript: paths.targetTsConfig, + eslint: true, + eslintOptions: { files: ['**', '!**/__tests__/**', '!**/?(*.)(spec|test).*'], options: { parserOptions: { @@ -347,11 +361,10 @@ function nodeExternalsWithResolve( }); return ( - context: string, - request: string, - callback: webpack.ExternalsFunctionCallback, + { context, request }: { context?: string; request?: string }, + callback: any, ) => { - currentContext = context; + currentContext = context!; return externals(context, request, callback); }; } diff --git a/packages/cli/src/lib/bundler/optimization.ts b/packages/cli/src/lib/bundler/optimization.ts index e97b2ae868..b8164d263d 100644 --- a/packages/cli/src/lib/bundler/optimization.ts +++ b/packages/cli/src/lib/bundler/optimization.ts @@ -14,14 +14,14 @@ * limitations under the License. */ -import { Options } from 'webpack'; +import { WebpackOptionsNormalized, WebpackPluginInstance } from 'webpack'; import TerserPlugin from 'terser-webpack-plugin'; import { BundlingOptions } from './types'; import { isParallelDefault } from '../parallel'; export const optimization = ( options: BundlingOptions, -): Options.Optimization => { +): WebpackOptionsNormalized['optimization'] => { const { isDev } = options; return { @@ -32,7 +32,7 @@ export const optimization = ( minimizer: [ new TerserPlugin({ parallel: options.parallel, - }), + }) as unknown as WebpackPluginInstance, ], } : {}), diff --git a/packages/cli/src/lib/bundler/server.ts b/packages/cli/src/lib/bundler/server.ts index 088128c805..2f8e3125c1 100644 --- a/packages/cli/src/lib/bundler/server.ts +++ b/packages/cli/src/lib/bundler/server.ts @@ -42,25 +42,31 @@ export async function serveBundle(options: ServeOptions) { }); const compiler = webpack(config); - const server = new WebpackDevServer(compiler, { - hot: !process.env.CI, - contentBase: paths.targetPublic, - contentBasePublicPath: config.output?.publicPath, - publicPath: config.output?.publicPath, - historyApiFallback: { - // Paths with dots should still use the history fallback. - // See https://github.com/facebookincubator/create-react-app/issues/387. - disableDotRule: true, - }, - clientLogLevel: 'warning', - stats: 'errors-warnings', - https: url.protocol === 'https:', - host, - port, - proxy: pkg.proxy, - // When the dev server is behind a proxy, the host and public hostname differ - allowedHosts: [url.hostname], - }); + const server = new WebpackDevServer( + compiler as any, + { + hot: !process.env.CI, + devMiddleware: { + publicPath: config.output?.publicPath as string, + stats: 'errors-warnings', + }, + static: { + publicPath: config.output?.publicPath as string, + directory: paths.targetPublic ?? '/', + }, + historyApiFallback: { + // Paths with dots should still use the history fallback. + // See https://github.com/facebookincubator/create-react-app/issues/387. + disableDotRule: true, + }, + https: url.protocol === 'https:', + host, + port, + proxy: pkg.proxy, + // When the dev server is behind a proxy, the host and public hostname differ + allowedHosts: [url.hostname], + } as any, + ); await new Promise((resolve, reject) => { server.listen(port, host, (err?: Error) => { diff --git a/packages/cli/src/lib/bundler/transforms.ts b/packages/cli/src/lib/bundler/transforms.ts index 6eb4920326..34a441139c 100644 --- a/packages/cli/src/lib/bundler/transforms.ts +++ b/packages/cli/src/lib/bundler/transforms.ts @@ -14,13 +14,13 @@ * limitations under the License. */ -import webpack, { Module, Plugin } from 'webpack'; +import webpack, { ModuleOptions, WebpackPluginInstance } from 'webpack'; import MiniCssExtractPlugin from 'mini-css-extract-plugin'; import { svgrTemplate } from '../svgrTemplate'; type Transforms = { - loaders: Module['rules']; - plugins: Plugin[]; + loaders: ModuleOptions['rules']; + plugins: WebpackPluginInstance[]; }; type TransformOptions = { @@ -51,6 +51,12 @@ export const transforms = (options: TransformOptions): Transforms => { production: !isDev, }, }, + { + test: /\.m?js/, + resolve: { + fullySpecified: false, + }, + }, { test: [/\.icon\.svg$/], use: [ @@ -105,7 +111,7 @@ export const transforms = (options: TransformOptions): Transforms => { }, ]; - const plugins = new Array(); + const plugins = new Array(); if (isDev) { plugins.push(new webpack.HotModuleReplacementPlugin()); diff --git a/packages/cli/src/lib/config.ts b/packages/cli/src/lib/config.ts index db96ca7686..a93f040122 100644 --- a/packages/cli/src/lib/config.ts +++ b/packages/cli/src/lib/config.ts @@ -22,6 +22,7 @@ type Options = { args: string[]; fromPackage?: string; mockEnv?: boolean; + withFilteredKeys?: boolean; }; export async function loadCliConfig(options: Options) { @@ -57,6 +58,7 @@ export async function loadCliConfig(options: Options) { try { const frontendAppConfigs = schema.process(appConfigs, { visibility: ['frontend'], + withFilteredKeys: options.withFilteredKeys, }); const frontendConfig = ConfigReader.fromConfigs(frontendAppConfigs); diff --git a/packages/cli/src/lib/versioning/Lockfile.ts b/packages/cli/src/lib/versioning/Lockfile.ts index 7b23652c33..d3517e3c83 100644 --- a/packages/cli/src/lib/versioning/Lockfile.ts +++ b/packages/cli/src/lib/versioning/Lockfile.ts @@ -137,9 +137,9 @@ export class Lockfile { } // Find all versions currently in use - const versions = Array.from( - new Set(entries.map(e => e.version)), - ).sort((v1, v2) => semver.rcompare(v1, v2)); + const versions = Array.from(new Set(entries.map(e => e.version))).sort( + (v1, v2) => semver.rcompare(v1, v2), + ); // If we're not using at least 2 different versions we're done if (versions.length < 2) { diff --git a/packages/cli/src/types.d.ts b/packages/cli/src/types.d.ts index 9088a86369..db5e508ec2 100644 --- a/packages/cli/src/types.d.ts +++ b/packages/cli/src/types.d.ts @@ -29,5 +29,230 @@ declare module '@svgr/rollup' { } declare module '@rollup/plugin-yaml'; +declare module 'react-dev-utils/formatWebpackMessages' { + export default function (stats: any): { + errors: string[]; + warnings: string[]; + }; +} -declare module 'terser-webpack-plugin'; +declare module 'react-dev-utils/openBrowser' { + export default function (url: string): boolean; +} + +declare module 'react-dev-utils/ModuleScopePlugin' { + import webpack = require('webpack'); + + export default class ModuleScopePlugin + implements webpack.WebpackPluginInstance + { + constructor( + appSrc: string | ReadonlyArray, + allowedFiles?: ReadonlyArray, + ); + apply: (resolver: any) => void; + } +} + +declare module 'react-dev-utils/FileSizeReporter' { + import webpack = require('webpack'); + + export interface OpaqueFileSizes { + root: string; + sizes: Record; + } + + /** + * Captures JS and CSS asset sizes inside the passed `buildFolder`. Save the + * result value to compare it after the build. + */ + export function measureFileSizesBeforeBuild( + buildFolder: string, + ): Promise; + + /** + * Prints the JS and CSS asset sizes after the build, and includes a size + * comparison with `previousFileSizes` that were captured earlier using + * `measureFileSizesBeforeBuild()`. `maxBundleGzipSize` and + * `maxChunkGzipSizemay` may optionally be specified to display a warning when + * the main bundle or a chunk exceeds the specified size (in bytes). + */ + export function printFileSizesAfterBuild( + webpackStats: webpack.Stats, + previousFileSizes: OpaqueFileSizes, + buildFolder: string, + maxBundleGzipSize?: number, + maxChunkGzipSize?: number, + ): void; +} + +declare module 'mini-css-extract-plugin' { + import webpack = require('webpack'); + + /** + * Lightweight CSS extraction webpack plugin. + * + * This plugin extracts CSS into separate files. It creates a CSS file per JS file which + * contains CSS. It supports On-Demand-Loading of CSS and SourceMaps. + * + * Configuration Detail: https://github.com/webpack-contrib/mini-css-extract-plugin#configuration + */ + export default class MiniCssExtractPlugin { + /** + * Webpack loader always used at the end of loaders list (ie. array index zero). + */ + static loader: string; + + constructor(options?: MiniCssExtractPlugin.PluginOptions); + + /** + * Apply the plugin + */ + apply(compiler: webpack.Compiler): void; + } + + namespace MiniCssExtractPlugin { + interface PluginOptions { + /** + * Works like [`output.filename`](https://webpack.js.org/configuration/output/#outputfilename). + */ + filename?: Required['output']['filename']; + /** + * Works like [`output.chunkFilename`](https://webpack.js.org/configuration/output/#outputchunkfilename). + */ + chunkFilename?: string; + /** + * For projects where CSS ordering has been mitigated through consistent + * use of scoping or naming conventions, the CSS order warnings can be + * disabled by setting this flag to true for the plugin. + */ + ignoreOrder?: boolean; + /** + * Specify where to insert the link tag. + * + * A string value specifies a DOM query for a parent element to attach to. + * + * A function allows to override default behavior for non-entry CSS chunks. + * This code will run in the browser alongside your application. It is recommend + * to only use ECMA 5 features and syntax. The function won't have access to the + * scope of the webpack configuration module. + * + * @default function() { document.head.appendChild(linkTag); } + */ + insert?: string | ((linkTag: any) => void); + /** + * Specify additional html attributes to add to the link tag. + * + * Note: These are only applied to dynamically loaded css chunks. To modify link + * attributes for entry CSS chunks, please use html-webpack-plugin. + */ + attributes?: Record; + /** + * This option allows loading asynchronous chunks with a custom link type, such as + * ``. + * + * `false` disables the link `type` attribute. + * + * @default 'text/css' + */ + linkType?: string | false | 'text/css'; + } + interface LoaderOptions { + /** + * Overrides [`output.publicPath`](https://webpack.js.org/configuration/output/#outputpublicpath). + * @default output.publicPath + */ + publicPath?: string | ((resourcePath: string, context: string) => string); + /** + * If false, the plugin will extract the CSS but **will not** emit the file + * @default true + */ + emit?: boolean; + /** + * By default, `mini-css-extract-plugin` generates JS modules that use the ES modules syntax. + * There are some cases in which using ES modules is beneficial, + * like in the case of module concatenation and tree shaking. + * @default true + */ + esModule?: boolean; + modules?: { + /** + * Enables/disables ES modules named export for locals. + * + * Names of locals are converted to camelCase. It is not allowed to use + * JavaScript reserved words in CSS class names. Options `esModule` and + * `modules.namedExport` in css-loader and MiniCssExtractPlugin.loader + * must be enabled. + * + * @default false + */ + namedExport?: boolean; + }; + } + } +} + +declare module 'fork-ts-checker-webpack-plugin/lib/ForkTsCheckerWebpackPlugin' {} +declare module 'webpack-node-externals' { + export default function webpackNodeExternals( + options?: webpackNodeExternals.Options, + ): any; + + namespace webpackNodeExternals { + type AllowlistOption = string | RegExp | AllowlistFunctionType; + type ImportTypeCallback = (moduleName: string) => string; + /** a function that accepts the module name and returns whether it should be included */ + type AllowlistFunctionType = (moduleName: string) => boolean; + interface ModulesFromFileType { + exclude?: string | string[]; + include?: string | string[]; + } + + interface Options { + /** + * An array for the externals to allow, so they will be included in the bundle. + * Can accept exact strings ('module_name'), regex patterns (/^module_name/), or a + * function that accepts the module name and returns whether it should be included. + * Important - if you have set aliases in your webpack config with the exact + * same names as modules in node_modules, you need to allowlist them so Webpack will know + * they should be bundled. + * @default [] + */ + allowlist?: AllowlistOption[] | AllowlistOption; + /** + * @default ['.bin'] + */ + binaryDirs?: string[]; + /** + * The method in which unbundled modules will be required in the code. Best to leave as + * 'commonjs' for node modules. + * @default 'commonjs' + */ + importType?: + | 'var' + | 'this' + | 'commonjs' + | 'amd' + | 'umd' + | ImportTypeCallback; + /** + * The folder in which to search for the node modules. + * @default 'node_modules' + */ + modulesDir?: string; + /** + * Additional folders to look for node modules. + */ + additionalModuleDirs?: string[]; + /** + * Read the modules from the package.json file instead of the node_modules folder. + * @default false + */ + modulesFromFile?: boolean | ModulesFromFileType; + /** + * @default false + */ + includeAbsolutePaths?: boolean; + } + } +} diff --git a/packages/cli/templates/default-plugin/package.json.hbs b/packages/cli/templates/default-plugin/package.json.hbs index dbba628055..fdac5a0c67 100644 --- a/packages/cli/templates/default-plugin/package.json.hbs +++ b/packages/cli/templates/default-plugin/package.json.hbs @@ -27,7 +27,7 @@ "@backstage/core-components": "^{{version '@backstage/core-components'}}", "@backstage/core-plugin-api": "^{{version '@backstage/core-plugin-api'}}", "@backstage/theme": "^{{version '@backstage/theme'}}", - "@material-ui/core": "^4.11.0", + "@material-ui/core": "^4.12.2", "@material-ui/icons": "^4.9.1", "@material-ui/lab": "4.0.0-alpha.45", "react": "^16.13.1", diff --git a/packages/codemods/CHANGELOG.md b/packages/codemods/CHANGELOG.md index dc1f694dca..192e6810bc 100644 --- a/packages/codemods/CHANGELOG.md +++ b/packages/codemods/CHANGELOG.md @@ -1,5 +1,40 @@ # @backstage/codemods +## 0.1.9 + +### Patch Changes + +- Updated dependencies + - @backstage/core-app-api@0.1.8 + - @backstage/core-components@0.3.1 + - @backstage/core-plugin-api@0.1.6 + +## 0.1.8 + +### Patch Changes + +- Updated dependencies + - @backstage/core-components@0.3.0 + - @backstage/core-plugin-api@0.1.5 + - @backstage/core-app-api@0.1.7 + +## 0.1.7 + +### Patch Changes + +- Updated dependencies + - @backstage/core-components@0.2.0 + - @backstage/core-app-api@0.1.6 + - @backstage/core-plugin-api@0.1.4 + +## 0.1.6 + +### Patch Changes + +- Updated dependencies + - @backstage/core-components@0.1.6 + - @backstage/core-app-api@0.1.5 + ## 0.1.5 ### Patch Changes diff --git a/packages/codemods/package.json b/packages/codemods/package.json index 9cf5730126..8f87631897 100644 --- a/packages/codemods/package.json +++ b/packages/codemods/package.json @@ -1,7 +1,7 @@ { "name": "@backstage/codemods", "description": "A collection of codemods for Backstage projects", - "version": "0.1.5", + "version": "0.1.9", "private": false, "publishConfig": { "access": "public", diff --git a/packages/config-loader/CHANGELOG.md b/packages/config-loader/CHANGELOG.md index d06568bf47..44819b6903 100644 --- a/packages/config-loader/CHANGELOG.md +++ b/packages/config-loader/CHANGELOG.md @@ -1,5 +1,13 @@ # @backstage/config-loader +## 0.6.6 + +### Patch Changes + +- e9d3983ee: Add option to populate the `filteredKeys` property when processing configuration with a schema. +- Updated dependencies + - @backstage/config@0.1.6 + ## 0.6.5 ### Patch Changes diff --git a/packages/config-loader/api-report.md b/packages/config-loader/api-report.md index 37b9880448..47bc22c60f 100644 --- a/packages/config-loader/api-report.md +++ b/packages/config-loader/api-report.md @@ -59,7 +59,7 @@ export function readEnvConfig(env: { // Warnings were encountered during analysis: // -// src/lib/schema/types.d.ts:77:5 - (ae-forgotten-export) The symbol "ConfigProcessingOptions" needs to be exported by the entry point index.d.ts +// src/lib/schema/types.d.ts:83:5 - (ae-forgotten-export) The symbol "ConfigProcessingOptions" needs to be exported by the entry point index.d.ts // src/loader.d.ts:13:5 - (ae-forgotten-export) The symbol "EnvFunc" needs to be exported by the entry point index.d.ts // (No @packageDocumentation comment for this package) diff --git a/packages/config-loader/package.json b/packages/config-loader/package.json index 7eb0a78f3f..33b8acc3b9 100644 --- a/packages/config-loader/package.json +++ b/packages/config-loader/package.json @@ -1,7 +1,7 @@ { "name": "@backstage/config-loader", "description": "Config loading functionality used by Backstage backend, and CLI", - "version": "0.6.5", + "version": "0.6.6", "private": false, "publishConfig": { "access": "public", @@ -31,7 +31,7 @@ }, "dependencies": { "@backstage/cli-common": "^0.1.1", - "@backstage/config": "^0.1.5", + "@backstage/config": "^0.1.6", "@types/json-schema": "^7.0.6", "ajv": "^7.0.3", "fs-extra": "9.1.0", diff --git a/packages/config-loader/src/lib/schema/filtering.test.ts b/packages/config-loader/src/lib/schema/filtering.test.ts index 5079afa876..d4b3cd55b6 100644 --- a/packages/config-loader/src/lib/schema/filtering.test.ts +++ b/packages/config-loader/src/lib/schema/filtering.test.ts @@ -63,43 +63,115 @@ const visibility = new Map( describe('filterByVisibility', () => { test.each<[ConfigVisibility[], JsonObject]>([ - [[], {}], + [ + [], + { + data: {}, + filteredKeys: [ + 'arr[0]', + 'arr[1]', + 'arr[2]', + 'objArr[0].f', + 'objArr[0].b', + 'objArr[0].s', + 'objArr[1].f', + 'objArr[1].b', + 'objArr[1].s', + 'obj.f', + 'obj.b.s', + 'arrF[0].never', + 'arrB[0].never', + 'arrS[0].never', + 'objF.never', + 'objB.never', + 'objS.never', + ], + }, + ], [ ['frontend'], { - arr: ['f'], - objArr: [{ f: 1 }, { f: 4 }], - obj: { f: 'a' }, - arrF: [], - objF: {}, + data: { + arr: ['f'], + objArr: [{ f: 1 }, { f: 4 }], + obj: { f: 'a' }, + arrF: [], + objF: {}, + }, + filteredKeys: [ + 'arr[1]', + 'arr[2]', + 'objArr[0].b', + 'objArr[0].s', + 'objArr[1].b', + 'objArr[1].s', + 'obj.b.s', + 'arrF[0].never', + 'arrB[0].never', + 'arrS[0].never', + 'objF.never', + 'objB.never', + 'objS.never', + ], }, ], [ ['backend'], { - arr: ['b'], - objArr: [{ b: 2 }, { b: 5 }], - obj: { b: {} }, - arrF: [{ never: 'here' }], - arrB: [{ never: 'here' }], - arrS: [{ never: 'here' }], - objF: { never: 'here' }, - objB: { never: 'here' }, - objS: { never: 'here' }, + data: { + arr: ['b'], + objArr: [{ b: 2 }, { b: 5 }], + obj: { b: {} }, + arrF: [{ never: 'here' }], + arrB: [{ never: 'here' }], + arrS: [{ never: 'here' }], + objF: { never: 'here' }, + objB: { never: 'here' }, + objS: { never: 'here' }, + }, + filteredKeys: [ + 'arr[0]', + 'arr[2]', + 'objArr[0].f', + 'objArr[0].s', + 'objArr[1].f', + 'objArr[1].s', + 'obj.f', + 'obj.b.s', + ], }, ], [ ['secret'], { - arr: ['s'], - objArr: [{ s: 3 }, { s: 6 }], - obj: { b: { s: true } }, - arrS: [], - objS: {}, + data: { + arr: ['s'], + objArr: [{ s: 3 }, { s: 6 }], + obj: { b: { s: true } }, + arrS: [], + objS: {}, + }, + filteredKeys: [ + 'arr[0]', + 'arr[1]', + 'objArr[0].f', + 'objArr[0].b', + 'objArr[1].f', + 'objArr[1].b', + 'obj.f', + 'arrF[0].never', + 'arrB[0].never', + 'arrS[0].never', + 'objF.never', + 'objB.never', + 'objS.never', + ], }, ], - [['frontend', 'backend', 'secret'], data], + [['frontend', 'backend', 'secret'], { data, filteredKeys: [] }], ])('should filter correctly with %p', (filter, expected) => { - expect(filterByVisibility(data, filter, visibility)).toEqual(expected); + expect( + filterByVisibility(data, filter, visibility, undefined, true), + ).toEqual(expected); }); }); diff --git a/packages/config-loader/src/lib/schema/filtering.ts b/packages/config-loader/src/lib/schema/filtering.ts index 74d367a30a..3533be01b7 100644 --- a/packages/config-loader/src/lib/schema/filtering.ts +++ b/packages/config-loader/src/lib/schema/filtering.ts @@ -30,9 +30,17 @@ export function filterByVisibility( includeVisibilities: ConfigVisibility[], visibilityByPath: Map, transformFunc?: TransformFunc, -): JsonObject { - function transform(jsonVal: JsonValue, path: string): JsonValue | undefined { - const visibility = visibilityByPath.get(path) ?? DEFAULT_CONFIG_VISIBILITY; + withFilteredKeys?: boolean, +): { data: JsonObject; filteredKeys?: string[] } { + const filteredKeys = new Array(); + + function transform( + jsonVal: JsonValue, + visibilityPath: string, // Matches the format we get from ajv + filterPath: string, // Matches the format of the ConfigReader + ): JsonValue | undefined { + const visibility = + visibilityByPath.get(visibilityPath) ?? DEFAULT_CONFIG_VISIBILITY; const isVisible = includeVisibilities.includes(visibility); if (typeof jsonVal !== 'object') { @@ -42,6 +50,9 @@ export function filterByVisibility( } return jsonVal; } + if (withFilteredKeys) { + filteredKeys.push(filterPath); + } return undefined; } else if (jsonVal === null) { return undefined; @@ -49,7 +60,11 @@ export function filterByVisibility( const arr = new Array(); for (const [index, value] of jsonVal.entries()) { - const out = transform(value, `${path}/${index}`); + const out = transform( + value, + `${visibilityPath}/${index}`, + `${filterPath}[${index}]`, + ); if (out !== undefined) { arr.push(out); } @@ -68,7 +83,11 @@ export function filterByVisibility( if (value === undefined) { continue; } - const out = transform(value, `${path}/${key}`); + const out = transform( + value, + `${visibilityPath}/${key}`, + filterPath ? `${filterPath}.${key}` : key, + ); if (out !== undefined) { outObj[key] = out; hasOutput = true; @@ -81,5 +100,8 @@ export function filterByVisibility( return undefined; } - return (transform(data, '') as JsonObject) ?? {}; + return { + filteredKeys: withFilteredKeys ? filteredKeys : undefined, + data: (transform(data, '', '') as JsonObject) ?? {}, + }; } diff --git a/packages/config-loader/src/lib/schema/load.test.ts b/packages/config-loader/src/lib/schema/load.test.ts index 4a2b719590..73fa55b90c 100644 --- a/packages/config-loader/src/lib/schema/load.test.ts +++ b/packages/config-loader/src/lib/schema/load.test.ts @@ -68,13 +68,19 @@ describe('loadConfigSchema', () => { schema.process(configs, { visibility: ['frontend'], valueTransform: () => 'X', + withFilteredKeys: true, }), - ).toEqual([{ data: { key1: 'X' }, context: 'test' }]); + ).toEqual([ + { data: { key1: 'X' }, context: 'test', filteredKeys: ['key2'] }, + ]); expect( schema.process(configs, { valueTransform: () => 'X', + withFilteredKeys: true, }), - ).toEqual([{ data: { key1: 'X', key2: 'X' }, context: 'test' }]); + ).toEqual([ + { data: { key1: 'X', key2: 'X' }, context: 'test', filteredKeys: [] }, + ]); const serialized = schema.serialize(); diff --git a/packages/config-loader/src/lib/schema/load.ts b/packages/config-loader/src/lib/schema/load.ts index ae5823c8cc..b67bd0002f 100644 --- a/packages/config-loader/src/lib/schema/load.ts +++ b/packages/config-loader/src/lib/schema/load.ts @@ -57,7 +57,7 @@ export async function loadConfigSchema( return { process( configs: AppConfig[], - { visibility, valueTransform } = {}, + { visibility, valueTransform, withFilteredKeys } = {}, ): AppConfig[] { const result = validate(configs); if (result.errors) { @@ -73,21 +73,23 @@ export async function loadConfigSchema( if (visibility) { processedConfigs = processedConfigs.map(({ data, context }) => ({ context, - data: filterByVisibility( + ...filterByVisibility( data, visibility, result.visibilityByPath, valueTransform, + withFilteredKeys, ), })); } else if (valueTransform) { processedConfigs = processedConfigs.map(({ data, context }) => ({ context, - data: filterByVisibility( + ...filterByVisibility( data, Array.from(CONFIG_VISIBILITIES), result.visibilityByPath, valueTransform, + withFilteredKeys, ), })); } diff --git a/packages/config-loader/src/lib/schema/types.ts b/packages/config-loader/src/lib/schema/types.ts index 30e47917bc..17090ad53c 100644 --- a/packages/config-loader/src/lib/schema/types.ts +++ b/packages/config-loader/src/lib/schema/types.ts @@ -96,6 +96,13 @@ type ConfigProcessingOptions = { * will be omitted. */ valueTransform?: TransformFunc; + + /** + * Whether or not to include the `filteredKeys` property in the output `AppConfig`s. + * + * Default: `false`. + */ + withFilteredKeys?: boolean; }; /** diff --git a/packages/config-loader/src/lib/transform/include.test.ts b/packages/config-loader/src/lib/transform/include.test.ts index 44bf07ab4d..91df723621 100644 --- a/packages/config-loader/src/lib/transform/include.test.ts +++ b/packages/config-loader/src/lib/transform/include.test.ts @@ -24,9 +24,11 @@ const substituteMe = '${MY_SUBSTITUTION}'; const mySubstitution = 'fooSubstitution'; const env = jest.fn(async (name: string) => { - return ({ - SECRET: 'my-secret', - } as { [name: string]: string })[name]; + return ( + { + SECRET: 'my-secret', + } as { [name: string]: string } + )[name]; }); const substitute: TransformFunc = async value => { @@ -44,14 +46,16 @@ const substitute: TransformFunc = async value => { }; const readFile = jest.fn(async (path: string) => { - const content = ({ - [resolvePath(root, 'my-secret')]: 'secret', - [resolvePath(root, 'my-data.json')]: '{"a":{"b":{"c":42}}}', - [resolvePath(root, 'my-data.yaml')]: 'some:\n yaml:\n key: 7', - [resolvePath(root, 'my-data.yml')]: 'different: { key: hello }', - [resolvePath(root, 'invalid.yaml')]: 'foo: [}', - [resolvePath(root, `${mySubstitution}/my-data.json`)]: '{"foo":"bar"}', - } as { [key: string]: string })[path]; + const content = ( + { + [resolvePath(root, 'my-secret')]: 'secret', + [resolvePath(root, 'my-data.json')]: '{"a":{"b":{"c":42}}}', + [resolvePath(root, 'my-data.yaml')]: 'some:\n yaml:\n key: 7', + [resolvePath(root, 'my-data.yml')]: 'different: { key: hello }', + [resolvePath(root, 'invalid.yaml')]: 'foo: [}', + [resolvePath(root, `${mySubstitution}/my-data.json`)]: '{"foo":"bar"}', + } as { [key: string]: string } + )[path]; if (!content) { throw new Error('File not found!'); diff --git a/packages/config-loader/src/lib/transform/substitution.test.ts b/packages/config-loader/src/lib/transform/substitution.test.ts index dc6ed47597..b03c39c174 100644 --- a/packages/config-loader/src/lib/transform/substitution.test.ts +++ b/packages/config-loader/src/lib/transform/substitution.test.ts @@ -17,10 +17,12 @@ import { createSubstitutionTransform } from './substitution'; const env = jest.fn(async (name: string) => { - return ({ - SECRET: 'my-secret', - TOKEN: 'my-token', - } as { [name: string]: string })[name]; + return ( + { + SECRET: 'my-secret', + TOKEN: 'my-token', + } as { [name: string]: string } + )[name]; }); const substituteTransform = createSubstitutionTransform(env); diff --git a/packages/config/CHANGELOG.md b/packages/config/CHANGELOG.md index 5cababf94e..63aa34b034 100644 --- a/packages/config/CHANGELOG.md +++ b/packages/config/CHANGELOG.md @@ -1,5 +1,11 @@ # @backstage/config +## 0.1.6 + +### Patch Changes + +- e9d3983ee: Add warning when trying to access configuration values that have been filtered out by visibility. + ## 0.1.5 ### Patch Changes diff --git a/packages/config/api-report.md b/packages/config/api-report.md index 50d2af0f1f..eff4236026 100644 --- a/packages/config/api-report.md +++ b/packages/config/api-report.md @@ -9,6 +9,7 @@ export type AppConfig = { context: string; data: JsonObject; + filteredKeys?: string[]; }; // Warning: (ae-missing-release-tag) "Config" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) diff --git a/packages/config/package.json b/packages/config/package.json index 400e4548cd..5d9bf94446 100644 --- a/packages/config/package.json +++ b/packages/config/package.json @@ -1,7 +1,7 @@ { "name": "@backstage/config", "description": "Config API used by Backstage core, backend, and CLI", - "version": "0.1.5", + "version": "0.1.6", "private": false, "publishConfig": { "access": "public", diff --git a/packages/config/src/reader.test.ts b/packages/config/src/reader.test.ts index b1ba536797..2f846fe159 100644 --- a/packages/config/src/reader.test.ts +++ b/packages/config/src/reader.test.ts @@ -14,6 +14,7 @@ * limitations under the License. */ +import { withLogCollector } from '../../test-utils-core/src'; import { ConfigReader } from './reader'; const DATA = { @@ -63,9 +64,9 @@ function expectValidValues(config: ConfigReader) { strings: ['string1', 'string2'], }); expect(config.getConfig('nested').getString('string')).toBe('string'); - expect( - config.getOptionalConfig('nested')!.getStringArray('strings'), - ).toEqual(['string1', 'string2']); + expect(config.getOptionalConfig('nested')!.getStringArray('strings')).toEqual( + ['string1', 'string2'], + ); expect(config.getOptional('missing')).toBe(undefined); expect(config.getOptionalConfig('missing')).toBe(undefined); expect(config.getOptionalConfigArray('missing')).toBe(undefined); @@ -185,6 +186,61 @@ describe('ConfigReader', () => { const config = new ConfigReader(DATA, CTX); expectInvalidValues(config); }); + + it('should warn when accessing filtered keys in development mode', () => { + const oldEnv = process.env.NODE_ENV; + (process.env as any).NODE_ENV = 'development'; + + const config = ConfigReader.fromConfigs([ + { + data: DATA, + context: CTX, + filteredKeys: ['a', 'b[0]'], + }, + ]); + + expect(withLogCollector(() => config.getOptional('a'))).toMatchObject({ + warn: [ + "Failed to read configuration value at 'a' as it is not visible. See https://backstage.io/docs/conf/defining#visibility for instructions on how to make it visible.", + ], + }); + expect(withLogCollector(() => config.getOptionalString('a'))).toMatchObject( + { + warn: [ + "Failed to read configuration value at 'a' as it is not visible. See https://backstage.io/docs/conf/defining#visibility for instructions on how to make it visible.", + ], + }, + ); + expect( + withLogCollector(() => config.getOptionalConfigArray('b')), + ).toMatchObject({ + warn: [ + "Failed to read configuration array at 'b' as it does not have any visible elements. See https://backstage.io/docs/conf/defining#visibility for instructions on how to make it visible.", + ], + }); + + (process.env as any).NODE_ENV = oldEnv; + }); + + it('should not warn when accessing filtered keys outside of development mode', () => { + const config = ConfigReader.fromConfigs([ + { + data: DATA, + context: CTX, + filteredKeys: ['a', 'b[0]'], + }, + ]); + + expect(withLogCollector(() => config.getOptional('a'))).toMatchObject({ + warn: [], + }); + expect(withLogCollector(() => config.getOptionalString('a'))).toMatchObject( + { warn: [] }, + ); + expect( + withLogCollector(() => config.getOptionalConfigArray('b')), + ).toMatchObject({ warn: [] }); + }); }); describe('ConfigReader with fallback', () => { diff --git a/packages/config/src/reader.ts b/packages/config/src/reader.ts index 11346d4a50..d93706c12e 100644 --- a/packages/config/src/reader.ts +++ b/packages/config/src/reader.ts @@ -55,6 +55,15 @@ const errors = { }; export class ConfigReader implements Config { + /** + * A set of key paths that where removed from the config due to not being visible. + * + * This was added as a mutable private member to avoid changes to the public API. + * Its only purpose of this is to warn users of missing visibility when running + * the frontend in development mode. + */ + private filteredKeys?: string[]; + static fromConfigs(configs: AppConfig[]): ConfigReader { if (configs.length === 0) { return new ConfigReader(undefined); @@ -62,9 +71,14 @@ export class ConfigReader implements Config { // Merge together all configs into a single config with recursive fallback // readers, giving the first config object in the array the lowest priority. - return configs.reduce((previousReader, { data, context }) => { - return new ConfigReader(data, context, previousReader); - }, undefined!); + return configs.reduce( + (previousReader, { data, context, filteredKeys }) => { + const reader = new ConfigReader(data, context, previousReader); + reader.filteredKeys = filteredKeys; + return reader; + }, + undefined!, + ); } constructor( @@ -101,6 +115,18 @@ export class ConfigReader implements Config { const fallbackValue = this.fallback?.getOptional(key); if (value === undefined) { + if (process.env.NODE_ENV === 'development') { + if (fallbackValue === undefined && key) { + const fullKey = this.fullKey(key); + if (this.filteredKeys?.includes(fullKey)) { + // eslint-disable-next-line no-console + console.warn( + `Failed to read configuration value at '${fullKey}' as it is not visible. ` + + 'See https://backstage.io/docs/conf/defining#visibility for instructions on how to make it visible.', + ); + } + } + } return fallbackValue; } else if (fallbackValue === undefined) { return value as T; @@ -127,10 +153,9 @@ export class ConfigReader implements Config { getOptionalConfig(key: string): ConfigReader | undefined { const value = this.readValue(key); const fallbackConfig = this.fallback?.getOptionalConfig(key); - const prefix = this.fullKey(key); if (isObject(value)) { - return new ConfigReader(value, this.context, fallbackConfig, prefix); + return this.copy(value, key, fallbackConfig); } if (value !== undefined) { throw new TypeError( @@ -163,18 +188,20 @@ export class ConfigReader implements Config { }); if (!configs) { + if (process.env.NODE_ENV === 'development') { + const fullKey = this.fullKey(key); + if (this.filteredKeys?.some(k => k.startsWith(fullKey))) { + // eslint-disable-next-line no-console + console.warn( + `Failed to read configuration array at '${key}' as it does not have any visible elements. ` + + 'See https://backstage.io/docs/conf/defining#visibility for instructions on how to make it visible.', + ); + } + } return undefined; } - return configs.map( - (obj, index) => - new ConfigReader( - obj, - this.context, - undefined, - this.fullKey(`${key}[${index}]`), - ), - ); + return configs.map((obj, index) => this.copy(obj, `${key}[${index}]`)); } getNumber(key: string): number { @@ -261,6 +288,17 @@ export class ConfigReader implements Config { return `${this.prefix}${this.prefix ? '.' : ''}${key}`; } + private copy(data: JsonObject, key: string, fallback?: ConfigReader) { + const reader = new ConfigReader( + data, + this.context, + fallback, + this.fullKey(key), + ); + reader.filteredKeys = this.filteredKeys; + return reader; + } + private readConfigValue( key: string, validate: ( @@ -270,6 +308,17 @@ export class ConfigReader implements Config { const value = this.readValue(key); if (value === undefined) { + if (process.env.NODE_ENV === 'development') { + const fullKey = this.fullKey(key); + if (this.filteredKeys?.includes(fullKey)) { + // eslint-disable-next-line no-console + console.warn( + `Failed to read configuration value at '${fullKey}' as it is not visible. ` + + 'See https://backstage.io/docs/conf/defining#visibility for instructions on how to make it visible.', + ); + } + } + return this.fallback?.readConfigValue(key, validate); } const result = validate(value); diff --git a/packages/config/src/types.ts b/packages/config/src/types.ts index d8f12f4f6e..1135e7d554 100644 --- a/packages/config/src/types.ts +++ b/packages/config/src/types.ts @@ -22,6 +22,7 @@ export type JsonValue = JsonObject | JsonArray | JsonPrimitive; export type AppConfig = { context: string; data: JsonObject; + filteredKeys?: string[]; }; export type Config = { diff --git a/packages/core-app-api/CHANGELOG.md b/packages/core-app-api/CHANGELOG.md index 4f09f231c3..1ec944ac4a 100644 --- a/packages/core-app-api/CHANGELOG.md +++ b/packages/core-app-api/CHANGELOG.md @@ -1,5 +1,47 @@ # @backstage/core-app-api +## 0.1.8 + +### Patch Changes + +- 362657623: Add support for serving the app with a base path other than `/`, which is enabled by including the path in `app.baseUrl`. +- 56c773909: Switched `@types/react` dependency to request `*` rather than a specific version. +- Updated dependencies + - @backstage/core-components@0.3.1 + - @backstage/core-plugin-api@0.1.6 + +## 0.1.7 + +### Patch Changes + +- Updated dependencies + - @backstage/core-components@0.3.0 + - @backstage/config@0.1.6 + - @backstage/core-plugin-api@0.1.5 + +## 0.1.6 + +### Patch Changes + +- 9d40fcb1e: - Bumping `material-ui/core` version to at least `4.12.2` as they made some breaking changes in later versions which broke `Pagination` of the `Table`. + - Switching out `material-table` to `@material-table/core` for support for the later versions of `material-ui/core` + - This causes a minor API change to `@backstage/core-components` as the interface for `Table` re-exports the `prop` from the underlying `Table` components. + - `onChangeRowsPerPage` has been renamed to `onRowsPerPageChange` + - `onChangePage` has been renamed to `onPageChange` + - Migration guide is here: https://material-table-core.com/docs/breaking-changes +- Updated dependencies + - @backstage/core-components@0.2.0 + - @backstage/core-plugin-api@0.1.4 + - @backstage/theme@0.2.9 + +## 0.1.5 + +### Patch Changes + +- ea249c6e6: Fix a bug in `FlatRoutes` that prevented outlets from working with the root route, as well as matching root routes too broadly. +- Updated dependencies + - @backstage/core-components@0.1.6 + ## 0.1.4 ### Patch Changes diff --git a/packages/core-app-api/api-report.md b/packages/core-app-api/api-report.md index a7a3845dd7..e2c6b3a939 100644 --- a/packages/core-app-api/api-report.md +++ b/packages/core-app-api/api-report.md @@ -68,9 +68,7 @@ export class AlertApiForwarder implements AlertApi { // // @public (undocumented) export type ApiFactoryHolder = { - get( - api: ApiRef, - ): + get(api: ApiRef): | ApiFactory< T, T, @@ -86,9 +84,7 @@ export type ApiFactoryHolder = { // @public export class ApiFactoryRegistry implements ApiFactoryHolder { // (undocumented) - get( - api: ApiRef, - ): + get(api: ApiRef): | ApiFactory< T, T, @@ -105,7 +101,7 @@ export class ApiFactoryRegistry implements ApiFactoryHolder { Impl extends Api, Deps extends { [name in string]: unknown; - } + }, >(scope: ApiFactoryScope, factory: ApiFactory): boolean; } @@ -211,7 +207,7 @@ export type AppOptions = { export type AppRouteBinder = < ExternalRoutes extends { [name: string]: ExternalRouteRef; - } + }, >( externalRoutes: ExternalRoutes, targetRoutes: PartialKeys< @@ -469,7 +465,8 @@ export class OAuth2 OpenIdConnectApi, ProfileInfoApi, BackstageIdentityApi, - SessionApi { + SessionApi +{ // Warning: (ae-forgotten-export) The symbol "Options" needs to be exported by the entry point index.d.ts constructor(options: Options); // Warning: (ae-forgotten-export) The symbol "CreateOptions" needs to be exported by the entry point index.d.ts @@ -561,7 +558,8 @@ export class OneLoginAuth { // // @public (undocumented) export class SamlAuth - implements ProfileInfoApi, BackstageIdentityApi, SessionApi { + implements ProfileInfoApi, BackstageIdentityApi, SessionApi +{ // Warning: (ae-forgotten-export) The symbol "SamlSession" needs to be exported by the entry point index.d.ts constructor(sessionManager: SessionManager); // Warning: (ae-forgotten-export) The symbol "AuthApiCreateOptions" needs to be exported by the entry point index.d.ts diff --git a/packages/core-app-api/package.json b/packages/core-app-api/package.json index 0f6773497b..2b66a991f1 100644 --- a/packages/core-app-api/package.json +++ b/packages/core-app-api/package.json @@ -1,7 +1,7 @@ { "name": "@backstage/core-app-api", "description": "Core app API used by Backstage apps", - "version": "0.1.4", + "version": "0.1.8", "private": false, "publishConfig": { "access": "public", @@ -29,13 +29,13 @@ "clean": "backstage-cli clean" }, "dependencies": { - "@backstage/core-components": "^0.1.4", - "@backstage/config": "^0.1.3", - "@backstage/core-plugin-api": "^0.1.3", - "@backstage/theme": "^0.2.8", - "@material-ui/core": "^4.11.0", + "@backstage/core-components": "^0.3.1", + "@backstage/config": "^0.1.6", + "@backstage/core-plugin-api": "^0.1.6", + "@backstage/theme": "^0.2.9", + "@material-ui/core": "^4.12.2", "@material-ui/icons": "^4.9.1", - "@types/react": "^16.9", + "@types/react": "*", "@types/prop-types": "^15.7.3", "prop-types": "^15.7.2", "react": "^16.12.0", @@ -44,9 +44,9 @@ "zen-observable": "^0.8.15" }, "devDependencies": { - "@backstage/cli": "^0.7.3", - "@backstage/test-utils": "^0.1.14", - "@backstage/test-utils-core": "^0.1.1", + "@backstage/cli": "^0.7.8", + "@backstage/test-utils": "^0.1.17", + "@backstage/test-utils-core": "^0.1.2", "@testing-library/jest-dom": "^5.10.1", "@testing-library/react": "^11.2.5", "@testing-library/react-hooks": "^3.4.2", diff --git a/packages/core-app-api/src/apis/implementations/FeatureFlagsApi/LocalStorageFeatureFlags.test.tsx b/packages/core-app-api/src/apis/implementations/FeatureFlagsApi/LocalStorageFeatureFlags.test.tsx index afc25b2e8c..1193592e96 100644 --- a/packages/core-app-api/src/apis/implementations/FeatureFlagsApi/LocalStorageFeatureFlags.test.tsx +++ b/packages/core-app-api/src/apis/implementations/FeatureFlagsApi/LocalStorageFeatureFlags.test.tsx @@ -194,8 +194,7 @@ describe('FeatureFlags', () => { it('throws an error if length is greater than 150 characters', () => { expect(() => featureFlags.registerFlag({ - name: - 'loremipsumdolorsitametconsecteturadipiscingelitnuncvitaeportaexaullamcorperturpismaurisutmattisnequemorbisediaculisauguevivamuspulvinarcursuseratblandithendreritquisqueuttinciduntmagnavestibulumblanditaugueat', + name: 'loremipsumdolorsitametconsecteturadipiscingelitnuncvitaeportaexaullamcorperturpismaurisutmattisnequemorbisediaculisauguevivamuspulvinarcursuseratblandithendreritquisqueuttinciduntmagnavestibulumblanditaugueat', pluginId: 'plugin-three', }), ).toThrow(/not exceed 150 characters/i); diff --git a/packages/core-app-api/src/apis/implementations/auth/oauth2/OAuth2.ts b/packages/core-app-api/src/apis/implementations/auth/oauth2/OAuth2.ts index 8c27e0aa63..24db8d2560 100644 --- a/packages/core-app-api/src/apis/implementations/auth/oauth2/OAuth2.ts +++ b/packages/core-app-api/src/apis/implementations/auth/oauth2/OAuth2.ts @@ -65,7 +65,8 @@ class OAuth2 OpenIdConnectApi, ProfileInfoApi, BackstageIdentityApi, - SessionApi { + SessionApi +{ static create({ discoveryApi, environment = 'development', diff --git a/packages/core-app-api/src/apis/system/ApiProvider.test.tsx b/packages/core-app-api/src/apis/system/ApiProvider.test.tsx index 5afb39a2ec..b94aea6b67 100644 --- a/packages/core-app-api/src/apis/system/ApiProvider.test.tsx +++ b/packages/core-app-api/src/apis/system/ApiProvider.test.tsx @@ -185,9 +185,10 @@ describe('ApiProvider', () => { }); describe('v1 consumer', () => { - const ApiContext = getGlobalSingleton< - Context> - >('api-context'); + const ApiContext = + getGlobalSingleton>>( + 'api-context', + ); function useMockApiV1(apiRef: ApiRef): T { const impl = useContext(ApiContext)?.atVersion(1)?.get(apiRef); diff --git a/packages/core-app-api/src/app/App.tsx b/packages/core-app-api/src/app/App.tsx index a95554709a..c8bd8fec8f 100644 --- a/packages/core-app-api/src/app/App.tsx +++ b/packages/core-app-api/src/app/App.tsx @@ -107,6 +107,20 @@ export function generateBoundRoutes(bindRoutes: AppOptions['bindRoutes']) { return result; } +/** + * Get the app base path from the configured app baseUrl. + * + * The returned path does not have a trailing slash. + */ +function getBasePath(configApi: Config) { + let { pathname } = new URL( + configApi.getOptionalString('app.baseUrl') ?? '/', + 'http://dummy.dev', // baseUrl can be specified as just a path + ); + pathname = pathname.replace(/\/*$/, ''); + return pathname; +} + type FullAppOptions = { apis: Iterable; icons: NonNullable; @@ -216,37 +230,33 @@ export class PrivateAppImpl implements BackstageApp { [], ); - const { - routePaths, - routeParents, - routeObjects, - featureFlags, - } = useMemo(() => { - const result = traverseElementTree({ - root: children, - discoverers: [childDiscoverer, routeElementDiscoverer], - collectors: { - routePaths: routePathCollector, - routeParents: routeParentCollector, - routeObjects: routeObjectCollector, - collectedPlugins: pluginCollector, - featureFlags: featureFlagCollector, - }, - }); + const { routePaths, routeParents, routeObjects, featureFlags } = + useMemo(() => { + const result = traverseElementTree({ + root: children, + discoverers: [childDiscoverer, routeElementDiscoverer], + collectors: { + routePaths: routePathCollector, + routeParents: routeParentCollector, + routeObjects: routeObjectCollector, + collectedPlugins: pluginCollector, + featureFlags: featureFlagCollector, + }, + }); - validateRoutes(result.routePaths, result.routeParents); + validateRoutes(result.routePaths, result.routeParents); - // TODO(Rugvip): Restructure the public API so that we can get an immediate view of - // the app, rather than having to wait for the provider to render. - // For now we need to push the additional plugins we find during - // collection and then make sure we initialize things afterwards. - result.collectedPlugins.forEach(plugin => this.plugins.add(plugin)); - this.verifyPlugins(this.plugins); + // TODO(Rugvip): Restructure the public API so that we can get an immediate view of + // the app, rather than having to wait for the provider to render. + // For now we need to push the additional plugins we find during + // collection and then make sure we initialize things afterwards. + result.collectedPlugins.forEach(plugin => this.plugins.add(plugin)); + this.verifyPlugins(this.plugins); - // Initialize APIs once all plugins are available - this.getApiHolder(); - return result; - }, [children]); + // Initialize APIs once all plugins are available + this.getApiHolder(); + return result; + }, [children]); const loadedConfig = useConfigLoader( this.configLoader, @@ -302,6 +312,7 @@ export class PrivateAppImpl implements BackstageApp { routeParents={routeParents} routeObjects={routeObjects} routeBindings={generateBoundRoutes(this.bindRoutes)} + basePath={getBasePath(loadedConfig.api)} > {children} @@ -314,10 +325,8 @@ export class PrivateAppImpl implements BackstageApp { } getRouter(): ComponentType<{}> { - const { - Router: RouterComponent, - SignInPage: SignInPageComponent, - } = this.components; + const { Router: RouterComponent, SignInPage: SignInPageComponent } = + this.components; // This wraps the sign-in page and waits for sign-in to be completed before rendering the app const SignInPageWrapper = ({ @@ -339,14 +348,7 @@ export class PrivateAppImpl implements BackstageApp { const AppRouter = ({ children }: PropsWithChildren<{}>) => { const configApi = useApi(configApiRef); - - let { pathname } = new URL( - configApi.getOptionalString('app.baseUrl') ?? '/', - 'http://dummy.dev', // baseUrl can be specified as just a path - ); - if (pathname.endsWith('/')) { - pathname = pathname.replace(/\/$/, ''); - } + const mountPath = `${getBasePath(configApi)}/*`; // If the app hasn't configured a sign-in page, we just continue as guest. if (!SignInPageComponent) { @@ -361,7 +363,7 @@ export class PrivateAppImpl implements BackstageApp { return ( - {children}} /> + {children}} /> ); @@ -371,7 +373,7 @@ export class PrivateAppImpl implements BackstageApp { - {children}} /> + {children}} /> diff --git a/packages/core-app-api/src/app/AppContext.test.tsx b/packages/core-app-api/src/app/AppContext.test.tsx index d87bf7d228..6ce164b9f0 100644 --- a/packages/core-app-api/src/app/AppContext.test.tsx +++ b/packages/core-app-api/src/app/AppContext.test.tsx @@ -22,9 +22,10 @@ import { AppContext as AppContextV1 } from './types'; import { AppContextProvider } from './AppContext'; describe('v1 consumer', () => { - const AppContext = getGlobalSingleton< - Context> - >('app-context'); + const AppContext = + getGlobalSingleton>>( + 'app-context', + ); function useMockAppV1(): AppContextV1 { const impl = useContext(AppContext)?.atVersion(1); diff --git a/packages/core-app-api/src/app/createApp.tsx b/packages/core-app-api/src/app/createApp.tsx index b7c49939e2..1d74f93add 100644 --- a/packages/core-app-api/src/app/createApp.tsx +++ b/packages/core-app-api/src/app/createApp.tsx @@ -60,7 +60,7 @@ export const defaultConfigLoader: AppConfigLoader = async ( if (!Array.isArray(appConfig)) { throw new Error('Static configuration has invalid format'); } - const configs = (appConfig.slice() as unknown) as AppConfig[]; + const configs = appConfig.slice() as unknown as AppConfig[]; // Avoiding this string also being replaced at runtime if ( diff --git a/packages/core-app-api/src/app/types.ts b/packages/core-app-api/src/app/types.ts index 836f1b7fb0..30ce45abe9 100644 --- a/packages/core-app-api/src/app/types.ts +++ b/packages/core-app-api/src/app/types.ts @@ -105,14 +105,14 @@ type KeysWithType = { */ type PartialKeys< Map extends { [name in string]: any }, - Keys extends keyof Map + Keys extends keyof Map, > = Partial> & Required>; /** * Creates a map of target routes with matching parameters based on a map of external routes. */ type TargetRouteMap< - ExternalRoutes extends { [name: string]: ExternalRouteRef } + ExternalRoutes extends { [name: string]: ExternalRouteRef }, > = { [name in keyof ExternalRoutes]: ExternalRoutes[name] extends ExternalRouteRef< infer Params, @@ -123,7 +123,7 @@ type TargetRouteMap< }; export type AppRouteBinder = < - ExternalRoutes extends { [name: string]: ExternalRouteRef } + ExternalRoutes extends { [name: string]: ExternalRouteRef }, >( externalRoutes: ExternalRoutes, targetRoutes: PartialKeys< diff --git a/packages/core-app-api/src/extensions/extensions.tsx b/packages/core-app-api/src/extensions/extensions.tsx index 063f34c659..199430c619 100644 --- a/packages/core-app-api/src/extensions/extensions.tsx +++ b/packages/core-app-api/src/extensions/extensions.tsx @@ -28,7 +28,7 @@ const ERROR_MESSAGE = 'Import this from @backstage/core-plugin-api'; /** @deprecated Import from @backstage/core-plugin-api instead */ export function createRoutableExtension< - T extends (props: any) => JSX.Element | null + T extends (props: any) => JSX.Element | null, >(_options: { component: () => Promise; mountPoint: RouteRef; @@ -38,14 +38,14 @@ export function createRoutableExtension< /** @deprecated Import from @backstage/core-plugin-api instead */ export function createComponentExtension< - T extends (props: any) => JSX.Element | null + T extends (props: any) => JSX.Element | null, >(_options: { component: ComponentLoader }): Extension { throw new Error(ERROR_MESSAGE); } /** @deprecated Import from @backstage/core-plugin-api instead */ export function createReactExtension< - T extends (props: any) => JSX.Element | null + T extends (props: any) => JSX.Element | null, >(_options: { component: ComponentLoader; data?: Record; diff --git a/packages/core-app-api/src/lib/AuthConnector/DefaultAuthConnector.test.ts b/packages/core-app-api/src/lib/AuthConnector/DefaultAuthConnector.test.ts index 524a0c5709..ce5df9fc91 100644 --- a/packages/core-app-api/src/lib/AuthConnector/DefaultAuthConnector.test.ts +++ b/packages/core-app-api/src/lib/AuthConnector/DefaultAuthConnector.test.ts @@ -126,8 +126,7 @@ describe('DefaultAuthConnector', () => { expect(popupSpy).toBeCalledTimes(1); expect(popupSpy.mock.calls[0][0]).toMatchObject({ - url: - 'http://my-host/api/auth/my-provider/start?scope=a%20b&env=production', + url: 'http://my-host/api/auth/my-provider/start?scope=a%20b&env=production', }); await expect(sessionPromise).resolves.toEqual({ @@ -175,8 +174,7 @@ describe('DefaultAuthConnector', () => { expect(popupSpy).toBeCalledTimes(1); expect(popupSpy.mock.calls[0][0]).toMatchObject({ - url: - 'http://my-host/api/auth/my-provider/start?scope=-ab-&env=production', + url: 'http://my-host/api/auth/my-provider/start?scope=-ab-&env=production', }); }); }); diff --git a/packages/core-app-api/src/lib/AuthConnector/DefaultAuthConnector.ts b/packages/core-app-api/src/lib/AuthConnector/DefaultAuthConnector.ts index 81da04010c..d707acdc9b 100644 --- a/packages/core-app-api/src/lib/AuthConnector/DefaultAuthConnector.ts +++ b/packages/core-app-api/src/lib/AuthConnector/DefaultAuthConnector.ts @@ -61,7 +61,8 @@ function defaultJoinScopes(scopes: Set) { * via the OAuthRequestApi. */ export class DefaultAuthConnector - implements AuthConnector { + implements AuthConnector +{ private readonly discoveryApi: DiscoveryApi; private readonly environment: string; private readonly provider: AuthProvider & { id: string }; diff --git a/packages/core-app-api/src/lib/loginPopup.test.ts b/packages/core-app-api/src/lib/loginPopup.test.ts index 1eb7c3f8b9..db4d9eb8eb 100644 --- a/packages/core-app-api/src/lib/loginPopup.test.ts +++ b/packages/core-app-api/src/lib/loginPopup.test.ts @@ -30,8 +30,7 @@ describe('showLoginPopup', () => { const removeEventListenerSpy = jest.spyOn(window, 'removeEventListener'); const payloadPromise = showLoginPopup({ - url: - 'my-origin/api/backend/auth/start?scope=https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fa%20https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fb', + url: 'my-origin/api/backend/auth/start?scope=https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fa%20https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fb', name: 'test-popup', origin: 'my-origin', }); diff --git a/packages/core-app-api/src/lib/subjects.ts b/packages/core-app-api/src/lib/subjects.ts index 0391050bda..e122da819b 100644 --- a/packages/core-app-api/src/lib/subjects.ts +++ b/packages/core-app-api/src/lib/subjects.ts @@ -29,7 +29,8 @@ import ObservableImpl from 'zen-observable'; * See http://reactivex.io/documentation/subject.html */ export class PublishSubject - implements Observable, ZenObservable.SubscriptionObserver { + implements Observable, ZenObservable.SubscriptionObserver +{ private isClosed = false; private terminatingError?: Error; @@ -121,7 +122,8 @@ export class PublishSubject * See http://reactivex.io/documentation/subject.html */ export class BehaviorSubject - implements Observable, ZenObservable.SubscriptionObserver { + implements Observable, ZenObservable.SubscriptionObserver +{ private isClosed = false; private currentValue: T; private terminatingError?: Error; diff --git a/packages/core-app-api/src/lib/versionedValues.ts b/packages/core-app-api/src/lib/versionedValues.ts index 3d0a4a41ae..3b3064fc7e 100644 --- a/packages/core-app-api/src/lib/versionedValues.ts +++ b/packages/core-app-api/src/lib/versionedValues.ts @@ -29,7 +29,7 @@ export type VersionedValue = { * Creates a container for a map of versioned values that implements VersionedValue. */ export function createVersionedValueMap< - Versions extends { [version: number]: any } + Versions extends { [version: number]: any }, >(versions: Versions): VersionedValue { Object.freeze(versions); return { diff --git a/packages/core-app-api/src/routing/FlatRoutes.test.tsx b/packages/core-app-api/src/routing/FlatRoutes.test.tsx index d5201a6f57..0df296cc59 100644 --- a/packages/core-app-api/src/routing/FlatRoutes.test.tsx +++ b/packages/core-app-api/src/routing/FlatRoutes.test.tsx @@ -37,11 +37,11 @@ function makeRouteRenderer(node: ReactNode) { ({ NotFoundErrorPage: () => <>Not Found, }), - } as unknown) as AppContext + } as unknown as AppContext } > diff --git a/packages/core-app-api/src/routing/RouteResolver.test.ts b/packages/core-app-api/src/routing/RouteResolver.test.ts index b47a18ecce..1b7eb10003 100644 --- a/packages/core-app-api/src/routing/RouteResolver.test.ts +++ b/packages/core-app-api/src/routing/RouteResolver.test.ts @@ -65,7 +65,7 @@ const externalRef4 = createExternalRouteRef({ describe('RouteResolver', () => { it('should not resolve anything with an empty resolver', () => { - const r = new RouteResolver(new Map(), new Map(), [], new Map()); + const r = new RouteResolver(new Map(), new Map(), [], new Map(), ''); expect(r.resolve(ref1, '/')?.()).toBe(undefined); expect(r.resolve(ref2, '/')?.({ x: '1x' })).toBe(undefined); @@ -85,6 +85,7 @@ describe('RouteResolver', () => { new Map(), [{ routeRefs: new Set([ref1]), path: '/my-route', ...rest }], new Map(), + '', ); expect(r.resolve(ref1, '/')?.()).toBe('/my-route'); @@ -99,6 +100,29 @@ describe('RouteResolver', () => { expect(r.resolve(externalRef4, '/')?.({ x: '6x' })).toBe(undefined); }); + it('should resolve an absolute route and an app base path', () => { + const r = new RouteResolver( + new Map([[ref1, '/my-route']]), + new Map(), + [{ routeRefs: new Set([ref1]), path: '/my-route', ...rest }], + new Map(), + '/base', + ); + + expect(r.resolve(ref1, '/')?.()).toBe('/base/my-route'); + expect(r.resolve(ref2, '/')?.({ x: '1x' })).toBe(undefined); + expect(r.resolve(subRef1, '/')?.()).toBe('/base/my-route/foo'); + expect(r.resolve(subRef2, '/')?.({ a: '2a' })).toBe( + '/base/my-route/foo/2a', + ); + expect(r.resolve(subRef3, '/')?.({ x: '3x' })).toBe(undefined); + expect(r.resolve(subRef4, '/')?.({ x: '4x', a: '4a' })).toBe(undefined); + expect(r.resolve(externalRef1, '/')?.()).toBe(undefined); + expect(r.resolve(externalRef2, '/')?.()).toBe(undefined); + expect(r.resolve(externalRef3, '/')?.({ x: '5x' })).toBe(undefined); + expect(r.resolve(externalRef4, '/')?.({ x: '6x' })).toBe(undefined); + }); + it('should resolve an absolute route with a param and with a parent', () => { const r = new RouteResolver( new Map([ @@ -122,6 +146,7 @@ describe('RouteResolver', () => { [externalRef3, ref2], [externalRef4, subRef3], ]), + '', ); expect(r.resolve(ref1, '/')?.()).toBe('/my-route'); @@ -179,6 +204,7 @@ describe('RouteResolver', () => { }, ], new Map(), + '', ); expect(r.resolve(ref2, '/')?.({ x: 'x' })).toBe('/root/x'); @@ -232,6 +258,7 @@ describe('RouteResolver', () => { [externalRef3, ref2], [externalRef4, subRef3], ]), + '', ); const l = '/my-grandparent/my-y/my-parent/my-x'; diff --git a/packages/core-app-api/src/routing/RouteResolver.ts b/packages/core-app-api/src/routing/RouteResolver.ts index e09da28df8..b5be5f893e 100644 --- a/packages/core-app-api/src/routing/RouteResolver.ts +++ b/packages/core-app-api/src/routing/RouteResolver.ts @@ -187,6 +187,7 @@ export class RouteResolver { ExternalRouteRef, RouteRef | SubRouteRef >, + private readonly appBasePath: string, // base path without a trailing slash ) {} resolve( @@ -209,13 +210,15 @@ export class RouteResolver { // Next we figure out the base path, which is the combination of the common parent path // between our current location and our target location, as well as the additional path // that is the difference between the parent path and the base of our target location. - const basePath = resolveBasePath( - targetRef, - sourceLocation, - this.routePaths, - this.routeParents, - this.routeObjects, - ); + const basePath = + this.appBasePath + + resolveBasePath( + targetRef, + sourceLocation, + this.routePaths, + this.routeParents, + this.routeObjects, + ); const routeFunc: RouteFunc = (...[params]) => { return basePath + generatePath(targetPath, params); diff --git a/packages/core-app-api/src/routing/RoutingProvider.test.tsx b/packages/core-app-api/src/routing/RoutingProvider.test.tsx index 499b81a743..47f9c87c96 100644 --- a/packages/core-app-api/src/routing/RoutingProvider.test.tsx +++ b/packages/core-app-api/src/routing/RoutingProvider.test.tsx @@ -152,6 +152,7 @@ function withRoutingProvider( routeParents={routeParents} routeObjects={routeObjects} routeBindings={new Map(routeBindings)} + basePath="" > {root} @@ -330,9 +331,10 @@ describe('discovery', () => { }); describe('v1 consumer', () => { - const RoutingContext = getGlobalSingleton< - Context> - >('routing-context'); + const RoutingContext = + getGlobalSingleton>>( + 'routing-context', + ); function useMockRouteRefV1( routeRef: AnyRouteRef, @@ -367,6 +369,7 @@ describe('v1 consumer', () => { routeParents={new Map()} routeObjects={[]} routeBindings={new Map()} + basePath="/base" children={children} /> ), @@ -375,8 +378,8 @@ describe('v1 consumer', () => { expect(renderedHook.result.current).toBe(undefined); renderedHook.rerender({ routeRef: routeRef2 }); - expect(renderedHook.result.current?.()).toBe('/foo'); + expect(renderedHook.result.current?.()).toBe('/base/foo'); renderedHook.rerender({ routeRef: routeRef3 }); - expect(renderedHook.result.current?.({ x: 'my-x' })).toBe('/bar/my-x'); + expect(renderedHook.result.current?.({ x: 'my-x' })).toBe('/base/bar/my-x'); }); }); diff --git a/packages/core-app-api/src/routing/RoutingProvider.tsx b/packages/core-app-api/src/routing/RoutingProvider.tsx index ea8e8f76f8..2192f5df26 100644 --- a/packages/core-app-api/src/routing/RoutingProvider.tsx +++ b/packages/core-app-api/src/routing/RoutingProvider.tsx @@ -38,6 +38,7 @@ type ProviderProps = { routeParents: Map; routeObjects: BackstageRouteObject[]; routeBindings: Map; + basePath?: string; children: ReactNode; }; @@ -46,6 +47,7 @@ export const RoutingProvider = ({ routeParents, routeObjects, routeBindings, + basePath = '', children, }: ProviderProps) => { const resolver = new RouteResolver( @@ -53,6 +55,7 @@ export const RoutingProvider = ({ routeParents, routeObjects, routeBindings, + basePath, ); const versionedValue = createVersionedValueMap({ 1: resolver }); diff --git a/packages/core-app-api/src/routing/types.ts b/packages/core-app-api/src/routing/types.ts index 6561a0da70..a12e914aba 100644 --- a/packages/core-app-api/src/routing/types.ts +++ b/packages/core-app-api/src/routing/types.ts @@ -75,7 +75,7 @@ export function isSubRouteRef( export function isExternalRouteRef< Params extends AnyParams, - Optional extends boolean + Optional extends boolean, >( routeRef: | RouteRef diff --git a/packages/core-components/CHANGELOG.md b/packages/core-components/CHANGELOG.md index 1536cf3fb2..0241234574 100644 --- a/packages/core-components/CHANGELOG.md +++ b/packages/core-components/CHANGELOG.md @@ -1,5 +1,87 @@ # @backstage/core-components +## 0.3.1 + +### Patch Changes + +- 56c773909: Switched `@types/react` dependency to request `*` rather than a specific version. +- 55a5dbd54: Fix for `SidebarItem` matching the active route too broadly. +- Updated dependencies + - @backstage/core-plugin-api@0.1.6 + +## 0.3.0 + +### Minor Changes + +- 7bf006210: Remove unused props from InfoCard prop type + +### Patch Changes + +- c4d8ff963: Switched frontend identity code to use `token` instead of the deprecated `idToken` field +- 7b8aa8d0d: Move the `CreateComponentButton` from the catalog plugin to the `core-components` & rename it to `CreateButton` to be reused inside the api-docs plugin & scaffolder plugin, but also future plugins. Additionally, improve responsiveness of `CreateButton` & `SupportButton` by shrinking them to `IconButtons` on smaller screens. +- 260c053b9: Fix All Material UI Warnings +- Updated dependencies + - @backstage/config@0.1.6 + - @backstage/core-plugin-api@0.1.5 + +## 0.2.0 + +### Minor Changes + +- 9d40fcb1e: - Bumping `material-ui/core` version to at least `4.12.2` as they made some breaking changes in later versions which broke `Pagination` of the `Table`. + - Switching out `material-table` to `@material-table/core` for support for the later versions of `material-ui/core` + - This causes a minor API change to `@backstage/core-components` as the interface for `Table` re-exports the `prop` from the underlying `Table` components. + - `onChangeRowsPerPage` has been renamed to `onRowsPerPageChange` + - `onChangePage` has been renamed to `onPageChange` + - Migration guide is here: https://material-table-core.com/docs/breaking-changes + +### Patch Changes + +- 19d9995b6: Improve accessibility of core & catalog components by adjusting them with non-breaking changes. +- 224e54484: Added an `EntityProcessingErrorsPanel` component to show any errors that occurred when refreshing an entity from its source location. + + If upgrading, this should be added to your `EntityPage` in your Backstage application: + + ```diff + // packages/app/src/components/catalog/EntityPage.tsx + + const overviewContent = ( + ... + + + + + + + + + + + + + + + + + + + + ``` + + Additionally, `WarningPanel` now changes color based on the provided severity. + +- Updated dependencies + - @backstage/core-plugin-api@0.1.4 + - @backstage/theme@0.2.9 + +## 0.1.6 + +### Patch Changes + +- 9a751bb28: Increase the vertical padding of the sidebar search input field to match the height of the parent anchor tag. This prevents users from accidentally navigating to the search page when they actually wanted to use the search input directly. +- 45b5fc3a8: Updated the layout of catalog and API index pages to handle smaller screen sizes. This adds responsive wrappers to the entity tables, and switches filters to a drawer when width-constrained. If you have created a custom catalog or API index page, you will need to update the page structure to match the updated [catalog customization](https://backstage.io/docs/features/software-catalog/catalog-customization) documentation. +- 03bf17e9b: Improve the responsiveness of the EntityPage UI. With this the Header component should scale with the screen size & wrapping should not cause overflowing/blocking of links. Additionally enforce the Pages using the Grid Layout to use it across all screen sizes & to wrap as intended. + + To benefit from the improved responsive layout, the `EntityPage` in existing Backstage applications should be updated to set the `xs` column size on each grid item in the page, as this does not default. For example: + + ```diff + - + + + ``` + ## 0.1.5 ### Patch Changes diff --git a/packages/core-components/api-report.md b/packages/core-components/api-report.md index e915e004ee..42404fb0c0 100644 --- a/packages/core-components/api-report.md +++ b/packages/core-components/api-report.md @@ -11,7 +11,7 @@ import { Breadcrumbs as Breadcrumbs_2 } from '@material-ui/core'; import { ButtonProps } from '@material-ui/core'; import { ButtonTypeMap } from '@material-ui/core'; import { CardHeaderProps } from '@material-ui/core'; -import { Column } from 'material-table'; +import { Column } from '@material-table/core'; import { CommonProps } from '@material-ui/core/OverridableComponent'; import { ComponentClass } from 'react'; import { ComponentProps } from 'react'; @@ -26,7 +26,7 @@ import { IconComponent } from '@backstage/core-plugin-api'; import { LinearProgressProps } from '@material-ui/core'; import { LinkProps as LinkProps_2 } from '@material-ui/core'; import { LinkProps as LinkProps_3 } from 'react-router-dom'; -import { MaterialTableProps } from 'material-table'; +import { MaterialTableProps } from '@material-table/core'; import { NavLinkProps } from 'react-router-dom'; import { ProfileInfoApi } from '@backstage/core-plugin-api'; import { PropsWithChildren } from 'react'; @@ -80,7 +80,7 @@ export const Avatar: ({ // Warning: (ae-missing-release-tag) "Breadcrumbs" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) // // @public (undocumented) -export const Breadcrumbs: ({ children, ...props }: Props_25) => JSX.Element; +export const Breadcrumbs: ({ children, ...props }: Props_24) => JSX.Element; // Warning: (ae-missing-release-tag) "BrokenImageIcon" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) // @@ -441,7 +441,7 @@ export const Content: ({ noPadding, children, ...props -}: PropsWithChildren) => JSX.Element; +}: PropsWithChildren) => JSX.Element; // Warning: (ae-forgotten-export) The symbol "ContentHeaderProps" needs to be exported by the entry point index.d.ts // Warning: (ae-missing-release-tag) "ContentHeader" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) @@ -467,6 +467,15 @@ export const CopyTextButton: { }; }; +// Warning: (ae-forgotten-export) The symbol "CreateButtonProps" needs to be exported by the entry point index.d.ts +// Warning: (ae-missing-release-tag) "CreateButton" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) +// +// @public (undocumented) +export const CreateButton: ({ + title, + to, +}: CreateButtonProps) => JSX.Element | null; + // Warning: (ae-missing-release-tag) "DashboardIcon" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) // // @public (undocumented) @@ -695,7 +704,7 @@ export const Header: ({ tooltip, type, typeLink, -}: PropsWithChildren) => JSX.Element; +}: PropsWithChildren) => JSX.Element; // Warning: (ae-forgotten-export) The symbol "Props" needs to be exported by the entry point index.d.ts // Warning: (ae-missing-release-tag) "HeaderIconLinkRow" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) @@ -777,7 +786,7 @@ export const InfoCard: ({ className, noPadding, titleTypographyProps, -}: Props_20) => JSX.Element; +}: Props_19) => JSX.Element; // Warning: (ae-missing-release-tag) "InfoCardVariants" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) // @@ -1200,7 +1209,17 @@ export const OverflowTooltip: (props: Props_12) => JSX.Element; export const Page: ({ themeId, children, -}: PropsWithChildren) => JSX.Element; +}: PropsWithChildren) => JSX.Element; + +// Warning: (ae-forgotten-export) The symbol "PageWithHeaderProps" needs to be exported by the entry point index.d.ts +// Warning: (ae-missing-release-tag) "PageWithHeader" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) +// +// @public (undocumented) +export const PageWithHeader: ({ + themeId, + children, + ...props +}: PropsWithChildren) => JSX.Element; // Warning: (ae-missing-release-tag) "Progress" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) // @@ -1281,7 +1300,7 @@ export const Sidebar: ({ openDelayMs, closeDelayMs, children, -}: PropsWithChildren) => JSX.Element; +}: PropsWithChildren) => JSX.Element; // Warning: (ae-missing-release-tag) "SIDEBAR_INTRO_LOCAL_STORAGE" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) // @@ -2438,7 +2457,7 @@ export const SidebarSpacer: React_2.ComponentType< // Warning: (ae-missing-release-tag) "SignInPage" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) // // @public (undocumented) -export const SignInPage: (props: Props_23) => JSX.Element; +export const SignInPage: (props: Props_22) => JSX.Element; // Warning: (ae-missing-release-tag) "SignInProviderConfig" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) // @@ -2582,7 +2601,7 @@ export const TabbedCard: ({ deepLink, value, onChange, -}: PropsWithChildren) => JSX.Element; +}: PropsWithChildren) => JSX.Element; // Warning: (ae-missing-release-tag) "TabbedLayout" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) // @@ -2705,11 +2724,17 @@ export const WarningIcon: IconComponent; // Warning: (tsdoc-param-tag-missing-hyphen) The @param block should be followed by a parameter name and then a hyphen // Warning: (tsdoc-param-tag-with-invalid-optional-name) The @param should not include a JSDoc-style optional name; it must not be enclosed in '[ ]' brackets. // Warning: (tsdoc-param-tag-with-invalid-type) The @param block should not include a JSDoc-style '{type}' -// Warning: (ae-forgotten-export) The symbol "Props" needs to be exported by the entry point index.d.ts +// Warning: (ae-forgotten-export) The symbol "WarningProps" needs to be exported by the entry point index.d.ts // Warning: (ae-missing-release-tag) "WarningPanel" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) // // @public -export const WarningPanel: (props: Props_17) => JSX.Element; +export const WarningPanel: ({ + severity, + title, + message, + children, + defaultExpanded, +}: WarningProps) => JSX.Element; // Warnings were encountered during analysis: // diff --git a/packages/core-components/package.json b/packages/core-components/package.json index 0bd4b95134..69f2019943 100644 --- a/packages/core-components/package.json +++ b/packages/core-components/package.json @@ -1,7 +1,7 @@ { "name": "@backstage/core-components", "description": "Core components used by Backstage plugins and apps", - "version": "0.1.5", + "version": "0.3.1", "private": false, "publishConfig": { "access": "public", @@ -29,17 +29,18 @@ "clean": "backstage-cli clean" }, "dependencies": { - "@backstage/config": "^0.1.5", - "@backstage/core-plugin-api": "^0.1.2", + "@backstage/config": "^0.1.6", + "@backstage/core-plugin-api": "^0.1.6", "@backstage/errors": "^0.1.1", - "@backstage/theme": "^0.2.8", - "@material-ui/core": "^4.11.0", + "@backstage/theme": "^0.2.9", + "@material-table/core": "^3.1.0", + "@material-ui/core": "^4.12.2", "@material-ui/icons": "^4.9.1", "@material-ui/lab": "4.0.0-alpha.45", "@testing-library/react-hooks": "^3.4.2", "@types/dagre": "^0.7.44", "@types/prop-types": "^15.7.3", - "@types/react": "^16.9", + "@types/react": "*", "@types/react-sparklines": "^1.7.0", "@types/react-text-truncate": "^0.14.0", "classnames": "^2.2.6", @@ -50,7 +51,6 @@ "dagre": "^0.8.5", "immer": "^9.0.1", "lodash": "^4.17.15", - "material-table": "^1.69.1", "pluralize": "^8.0.0", "prop-types": "^15.7.2", "qs": "^6.9.4", @@ -70,9 +70,9 @@ "zen-observable": "^0.8.15" }, "devDependencies": { - "@backstage/core-app-api": "^0.1.4", - "@backstage/cli": "^0.7.3", - "@backstage/test-utils": "^0.1.13", + "@backstage/core-app-api": "^0.1.8", + "@backstage/cli": "^0.7.8", + "@backstage/test-utils": "^0.1.17", "@testing-library/jest-dom": "^5.10.1", "@testing-library/react": "^11.2.5", "@testing-library/user-event": "^13.1.8", @@ -84,6 +84,7 @@ "@types/jest": "^26.0.7", "@types/node": "^14.14.32", "@types/react-helmet": "^6.1.0", + "@types/react-syntax-highlighter": "^13.5.2", "@types/zen-observable": "^0.8.0" }, "files": [ diff --git a/packages/core-components/src/components/CreateButton/CreateButton.tsx b/packages/core-components/src/components/CreateButton/CreateButton.tsx new file mode 100644 index 0000000000..021e1b002d --- /dev/null +++ b/packages/core-components/src/components/CreateButton/CreateButton.tsx @@ -0,0 +1,51 @@ +/* + * Copyright 2021 The Backstage Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { BackstageTheme } from '@backstage/theme'; +import { Button, IconButton, useMediaQuery } from '@material-ui/core'; +import React from 'react'; +import { Link as RouterLink, LinkProps } from 'react-router-dom'; +import AddCircleOutline from '@material-ui/icons/AddCircleOutline'; + +type CreateButtonProps = { + title: string; +} & Partial>; + +export const CreateButton = ({ title, to }: CreateButtonProps) => { + const isXSScreen = useMediaQuery(theme => + theme.breakpoints.down('xs'), + ); + + if (!to) { + return null; + } + + return isXSScreen ? ( + + + + ) : ( + + ); +}; diff --git a/plugins/catalog/src/components/CreateComponentButton/index.ts b/packages/core-components/src/components/CreateButton/index.ts similarity index 90% rename from plugins/catalog/src/components/CreateComponentButton/index.ts rename to packages/core-components/src/components/CreateButton/index.ts index e525bef782..f0e4cbe646 100644 --- a/plugins/catalog/src/components/CreateComponentButton/index.ts +++ b/packages/core-components/src/components/CreateButton/index.ts @@ -13,4 +13,5 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -export { CreateComponentButton } from './CreateComponentButton'; + +export { CreateButton } from './CreateButton'; diff --git a/packages/core-components/src/components/DependencyGraph/DefaultNode.tsx b/packages/core-components/src/components/DependencyGraph/DefaultNode.tsx index c93651e3e0..69269d687d 100644 --- a/packages/core-components/src/components/DependencyGraph/DefaultNode.tsx +++ b/packages/core-components/src/components/DependencyGraph/DefaultNode.tsx @@ -38,10 +38,8 @@ export function DefaultNode({ node: { id } }: RenderNodeProps) { React.useLayoutEffect(() => { // set the width to the length of the ID if (idRef.current) { - let { - height: renderedHeight, - width: renderedWidth, - } = idRef.current.getBBox(); + let { height: renderedHeight, width: renderedWidth } = + idRef.current.getBBox(); renderedHeight = Math.round(renderedHeight); renderedWidth = Math.round(renderedWidth); diff --git a/packages/core-components/src/components/DependencyGraph/DependencyGraph.tsx b/packages/core-components/src/components/DependencyGraph/DependencyGraph.tsx index 89f7421d2a..bf018b13c8 100644 --- a/packages/core-components/src/components/DependencyGraph/DependencyGraph.tsx +++ b/packages/core-components/src/components/DependencyGraph/DependencyGraph.tsx @@ -132,10 +132,8 @@ export function DependencyGraph({ container.call(zoom); - const { - width: newContainerWidth, - height: newContainerHeight, - } = node.getBoundingClientRect(); + const { width: newContainerWidth, height: newContainerHeight } = + node.getBoundingClientRect(); if (containerWidth !== newContainerWidth) { setContainerWidth(newContainerWidth); } diff --git a/packages/core-components/src/components/DependencyGraph/Edge.tsx b/packages/core-components/src/components/DependencyGraph/Edge.tsx index 4e4c5ca5f7..e0f19d3536 100644 --- a/packages/core-components/src/components/DependencyGraph/Edge.tsx +++ b/packages/core-components/src/components/DependencyGraph/Edge.tsx @@ -71,10 +71,8 @@ export function Edge({ React.useLayoutEffect(() => { // set the label width to the actual rendered width to properly layout graph if (labelRef.current) { - let { - height: renderedHeight, - width: renderedWidth, - } = labelRef.current.getBBox(); + let { height: renderedHeight, width: renderedWidth } = + labelRef.current.getBBox(); renderedHeight = Math.round(renderedHeight); renderedWidth = Math.round(renderedWidth); diff --git a/packages/core-components/src/components/DependencyGraph/Node.tsx b/packages/core-components/src/components/DependencyGraph/Node.tsx index d9e8cbfb78..a5e1a62f09 100644 --- a/packages/core-components/src/components/DependencyGraph/Node.tsx +++ b/packages/core-components/src/components/DependencyGraph/Node.tsx @@ -46,10 +46,8 @@ export function Node({ React.useLayoutEffect(() => { // set the node width to the actual rendered width to properly layout graph if (nodeRef.current) { - let { - height: renderedHeight, - width: renderedWidth, - } = nodeRef.current.getBBox(); + let { height: renderedHeight, width: renderedWidth } = + nodeRef.current.getBBox(); renderedHeight = Math.round(renderedHeight); renderedWidth = Math.round(renderedWidth); diff --git a/packages/core-components/src/components/EmptyState/EmptyState.tsx b/packages/core-components/src/components/EmptyState/EmptyState.tsx index 1d8d5a798f..d916ad9a61 100644 --- a/packages/core-components/src/components/EmptyState/EmptyState.tsx +++ b/packages/core-components/src/components/EmptyState/EmptyState.tsx @@ -44,20 +44,22 @@ export const EmptyState = ({ title, description, missing, action }: Props) => { - - - {title} - - - {description} - - - {action} + + + + {title} + + + {description} + + + {action} + diff --git a/packages/core-components/src/components/EmptyState/EmptyStateImage.tsx b/packages/core-components/src/components/EmptyState/EmptyStateImage.tsx index a76f0863f7..660e7fc947 100644 --- a/packages/core-components/src/components/EmptyState/EmptyStateImage.tsx +++ b/packages/core-components/src/components/EmptyState/EmptyStateImage.tsx @@ -29,7 +29,7 @@ const useStyles = makeStyles({ generalImg: { width: '95%', zIndex: 2, - position: 'absolute', + position: 'relative', left: '50%', top: '50%', transform: 'translate(-50%, 15%)', diff --git a/packages/core-components/src/components/ErrorPanel/ErrorPanel.tsx b/packages/core-components/src/components/ErrorPanel/ErrorPanel.tsx index 14b5d50325..f9996b9b1f 100644 --- a/packages/core-components/src/components/ErrorPanel/ErrorPanel.tsx +++ b/packages/core-components/src/components/ErrorPanel/ErrorPanel.tsx @@ -100,6 +100,7 @@ export const ErrorPanel = ({ }: PropsWithChildren) => { return ( diff --git a/packages/core-components/src/components/FeatureDiscovery/lib/useShowCallout.ts b/packages/core-components/src/components/FeatureDiscovery/lib/useShowCallout.ts index 617f1324ed..a507d210a7 100644 --- a/packages/core-components/src/components/FeatureDiscovery/lib/useShowCallout.ts +++ b/packages/core-components/src/components/FeatureDiscovery/lib/useShowCallout.ts @@ -38,9 +38,10 @@ function useCalloutStates(): { return { states, setState }; } -function useCalloutHasBeenSeen( - featureId: string, -): { seen: boolean | undefined; markSeen: () => void } { +function useCalloutHasBeenSeen(featureId: string): { + seen: boolean | undefined; + markSeen: () => void; +} { const { states, setState } = useCalloutStates(); const markSeen = useCallback(() => { @@ -50,9 +51,10 @@ function useCalloutHasBeenSeen( return { seen: states[featureId] === true, markSeen }; } -export function useShowCallout( - featureId: string, -): { show: boolean; hide: () => void } { +export function useShowCallout(featureId: string): { + show: boolean; + hide: () => void; +} { const { seen, markSeen } = useCalloutHasBeenSeen(featureId); return { show: seen === false, hide: markSeen }; } diff --git a/packages/core-components/src/components/Status/Status.tsx b/packages/core-components/src/components/Status/Status.tsx index 3d79c38581..0b370a1397 100644 --- a/packages/core-components/src/components/Status/Status.tsx +++ b/packages/core-components/src/components/Status/Status.tsx @@ -69,6 +69,7 @@ export const StatusOK = (props: PropsWithChildren<{}>) => {