Merge pull request #129 from spreadshirt/bump-backstage

Bump backstage to 1.32.2

.changeset/calm-feet-look.md

@@ -0,0 +1,11 @@
+---
+'@spreadshirt/backstage-plugin-s3-viewer': patch
+'@spreadshirt/backstage-plugin-s3-viewer-backend': patch
+'@spreadshirt/backstage-plugin-s3-viewer-node': patch
+---
+
+Fix local dependencies for our plugins. This has been done by using the
+[following script](https://github.com/backstage/backstage/blob/master/scripts/verify-local-dependencies.js) available
+in the main Backstage repo.
+
+This is also the way the community-plugin workspaces work, so it's good to follow their setup too.

.changeset/eight-forks-draw.md

@@ -0,0 +1,8 @@
+---
+'@spreadshirt/backstage-plugin-s3-viewer': patch
+'@spreadshirt/backstage-plugin-s3-viewer-backend': patch
+'@spreadshirt/backstage-plugin-s3-viewer-common': patch
+'@spreadshirt/backstage-plugin-s3-viewer-node': patch
+---
+
+Bump Backstage dependencies to version 1.32.2

.changeset/serious-students-protect.md

@@ -0,0 +1,6 @@
+---
+'@spreadshirt/backstage-plugin-s3-viewer': patch
+'@spreadshirt/backstage-plugin-s3-viewer-backend': patch
+---
+
+Fix yarn add command in the documentation

.changeset/sixty-paws-grow.md

@@ -0,0 +1,7 @@
+---
+'@spreadshirt/backstage-plugin-s3-viewer-backend': minor
+---
+
+**BREAKING**: Removed old backend system methods and test suite, which was already deprecated and not maintained. A proper solution will be provided later on.
+
+To install the plugin refer to the [updated documentation](https://github.com/spreadshirt/backstage-plugin-s3/tree/main/plugins/s3-viewer#getting-started)

.changeset/three-ants-nail.md

@@ -0,0 +1,8 @@
+---
+'app': minor
+'backend': minor
+---
+
+Created new testing environment setup using packages.
+With this setup we can fully test our plugins using a similar
+approach as a new application.

.github/workflows/release.yml

@@ -24,7 +24,7 @@ jobs:
           node-version: 20.x
 
       - name: Install Dependencies
-        run: yarn install --immutable
+        run: yarn install
 
       - name: Create Release Pull Request or Publish to npm
         id: changesets

README.md

@@ -27,10 +27,10 @@ It's also possible to test the s3-viewer plugin in an isolated mode. For that, y
 
 ```sh
     # From the root of the repository
-    docker-compose -f demo/docker-compose.yaml up
+    docker compose -f demo/docker-compose.yaml up
 
     # Wait until the bucket is created and the files synced, then:
-    yarn start
+    yarn dev
 ```
 
 After executing these two commands, a new window in your browser will be opened and you will be able to use the s3-viewer frontend and backend plugins altogether. You should see a platform with a name `test` and a bucket inside called `foobar`. This bucket will contain the data from [`./demo/examples`](./demo/examples/) inside.

app-config.yaml

@@ -1,15 +1,24 @@
-# Stub app config needed to run with yarn start
 app:
-  title: backstage example app
+  title: S3 Viewer Example App
   baseUrl: http://localhost:3000
 
 backend:
   baseUrl: http://localhost:7007
   listen:
     port: 7007
+  csp:
+    connect-src: ["'self'", 'http:', 'https:']
+  cors:
+    origin: http://localhost:3000
+    methods: [GET, HEAD, PATCH, POST, PUT, DELETE]
+    credentials: true
+  database:
+    client: better-sqlite3
+    connection: ':memory:'
 
-permission:
-  enabled: true
+auth:
+  providers:
+    guest: {}
 
 s3:
   bucketLocatorMethods:
@@ -23,4 +32,14 @@ s3:
   allowedBuckets:
     - platform: test
       buckets:
-        - foobar
+        - foobar
+
+catalog:
+  import:
+    entityFilename: catalog-info.yaml
+    pullRequestBranchName: backstage-integration
+  locations:
+    - type: file
+      target: ../../examples/org.yaml
+      rules:
+        - allow: [User, Group]

backstage.json

@@ -1,3 +1,3 @@
 {
-  "version": "1.31.1"
+  "version": "1.32.2"
 }

examples/org.yaml

@@ -0,0 +1,19 @@
+---
+# https://backstage.io/docs/features/software-catalog/descriptor-format#kind-user
+apiVersion: backstage.io/v1alpha1
+kind: User
+metadata:
+  name: guest
+  namespace: development
+spec:
+  memberOf: [guests]
+---
+# https://backstage.io/docs/features/software-catalog/descriptor-format#kind-group
+apiVersion: backstage.io/v1alpha1
+kind: Group
+metadata:
+  name: guests
+  namespace: development
+spec:
+  type: team
+  children: []

package.json

@@ -13,31 +13,32 @@
   "private": true,
   "workspaces": {
     "packages": [
+      "packages/**",
       "plugins/**"
     ]
   },
   "scripts": {
+    "dev": "yarn workspaces foreach -A --include backend --include app --parallel -v -i run start",
     "tsc": "tsc",
-    "tsc:full": "backstage-cli repo clean && tsc --skipLibCheck false --incremental false",
-    "build:backend": "yarn workspace backend build",
+    "tsc:full": "tsc --skipLibCheck true --incremental false",
     "build:all": "backstage-cli repo build --all",
     "clean": "backstage-cli repo clean",
     "test": "backstage-cli repo test",
     "test:all": "backstage-cli repo test --coverage",
-    "fix": "backstage-cli repo fix --publish",
-    "lint": "backstage-cli repo lint",
-    "ci": "yarn install --immutable && tsc && yarn build:all && backstage-cli test --no-watch && yarn lint",
-    "start:frontend": "yarn workspace @spreadshirt/backstage-plugin-s3-viewer start",
-    "start:backend": "yarn workspace @spreadshirt/backstage-plugin-s3-viewer-backend start",
-    "start": "concurrently \"yarn start:backend\" \"yarn start:frontend\"",
-    "release": "changeset version && yarn prettier --write 'plugins/*/{package.json,CHANGELOG.md}' '.changeset/*.json' && yarn install --no-immutable",
+    "fix": "backstage-cli repo fix",
+    "lint": "backstage-cli repo lint --since origin/main",
+    "lint:all": "backstage-cli repo lint",
+    "ci": "yarn install && tsc && yarn build:all && yarn test && yarn lint",
+    "start": "yarn workspace app start",
+    "start-backend": "yarn workspace backend start",
+    "release": "changeset version && yarn prettier --write 'plugins/*/{package.json,CHANGELOG.md}' '.changeset/*.json' && yarn install",
     "publish-release": "changeset publish",
     "prettier:check": "prettier --check .",
     "prettier:fix": "prettier --write .",
     "npm:release": "yarn install && tsc && yarn build:all && changeset publish"
   },
   "devDependencies": {
-    "@backstage/cli": "^0.27.1",
+    "@backstage/cli": "^0.28.0",
     "@changesets/cli": "^2.24.4",
     "@spotify/prettier-config": "^15.0.0",
     "concurrently": "^8.0.0",

packages/README.md

@@ -0,0 +1,9 @@
+# The Packages Folder
+
+This is where your own applications and centrally managed libraries live, each
+in a separate folder of its own.
+
+From the start there's an `app` folder (for the frontend) and a `backend` folder
+(for the Node backend), but you can also add more modules in here that house
+your core additions and adaptations, such as themes, common React component
+libraries, utilities, and similar.

packages/app/.eslintignore

@@ -0,0 +1 @@
+public

packages/app/.eslintrc.js

@@ -0,0 +1 @@
+module.exports = require('@backstage/cli/config/eslint-factory')(__dirname);

packages/app/e2e-tests/app.test.ts

@@ -0,0 +1,11 @@
+import { test, expect } from '@playwright/test';
+
+test('App should render the welcome page', async ({ page }) => {
+  await page.goto('/');
+
+  const enterButton = page.getByRole('button', { name: 'Enter' });
+  await expect(enterButton).toBeVisible();
+  await enterButton.click();
+
+  await expect(page.getByText('S3 Viewer')).toBeVisible();
+});

packages/app/package.json

@@ -0,0 +1,75 @@
+{
+  "name": "app",
+  "version": "0.0.5",
+  "private": true,
+  "bundled": true,
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/backstage/community-plugins",
+    "directory": "packages/app"
+  },
+  "backstage": {
+    "role": "frontend"
+  },
+  "scripts": {
+    "start": "backstage-cli package start",
+    "build": "backstage-cli package build",
+    "clean": "backstage-cli package clean",
+    "test": "backstage-cli package test",
+    "lint": "backstage-cli package lint"
+  },
+  "dependencies": {
+    "@backstage/app-defaults": "^1.5.12",
+    "@backstage/catalog-model": "^1.7.0",
+    "@backstage/core-app-api": "^1.15.1",
+    "@backstage/core-components": "^0.15.1",
+    "@backstage/core-plugin-api": "^1.10.0",
+    "@backstage/integration-react": "^1.2.0",
+    "@backstage/plugin-api-docs": "^0.11.11",
+    "@backstage/plugin-catalog": "^1.24.0",
+    "@backstage/plugin-catalog-common": "^1.1.0",
+    "@backstage/plugin-catalog-graph": "^0.4.11",
+    "@backstage/plugin-catalog-import": "^0.12.5",
+    "@backstage/plugin-catalog-react": "^1.14.0",
+    "@backstage/plugin-org": "^0.6.31",
+    "@backstage/plugin-permission-react": "^0.4.27",
+    "@backstage/plugin-user-settings": "^0.8.14",
+    "@backstage/theme": "^0.6.0",
+    "@material-ui/core": "^4.12.2",
+    "@material-ui/icons": "^4.9.1",
+    "@spreadshirt/backstage-plugin-s3-viewer": "workspace:^",
+    "react-dom": "^18.0.2",
+    "react-use": "^17.2.4"
+  },
+  "peerDependencies": {
+    "react": "^18.0.2",
+    "react-router": "^6.3.0",
+    "react-router-dom": "^6.3.0"
+  },
+  "devDependencies": {
+    "@backstage/cli": "^0.28.0",
+    "@backstage/test-utils": "^1.7.0",
+    "@playwright/test": "^1.32.3",
+    "@testing-library/dom": "^9.0.0",
+    "@testing-library/jest-dom": "^6.0.0",
+    "@testing-library/react": "^16.0.0",
+    "@testing-library/user-event": "^14.0.0",
+    "@types/react-dom": "*",
+    "cross-env": "^7.0.0"
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  },
+  "files": [
+    "dist"
+  ]
+}

packages/app/public/index.html

@@ -0,0 +1,60 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="theme-color" content="#000000" />
+    <meta
+      name="description"
+      content="Backstage is an open source framework for building developer portals"
+    />
+    <!--
+      manifest.json provides metadata used when your web app is installed on a
+      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
+    -->
+    <link
+      rel="manifest"
+      href="<%= publicPath %>/manifest.json"
+      crossorigin="use-credentials"
+    />
+    <link rel="icon" href="<%= publicPath %>/favicon.ico" />
+    <link rel="shortcut icon" href="<%= publicPath %>/favicon.ico" />
+    <link
+      rel="apple-touch-icon"
+      sizes="180x180"
+      href="<%= publicPath %>/apple-touch-icon.png"
+    />
+    <link
+      rel="icon"
+      type="image/png"
+      sizes="32x32"
+      href="<%= publicPath %>/favicon-32x32.png"
+    />
+    <link
+      rel="icon"
+      type="image/png"
+      sizes="16x16"
+      href="<%= publicPath %>/favicon-16x16.png"
+    />
+    <link
+      rel="mask-icon"
+      href="<%= publicPath %>/safari-pinned-tab.svg"
+      color="#5bbad5"
+    />
+    <title><%= config.getOptionalString('app.title') ?? 'Backstage' %></title>
+  </head>
+  <body>
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <div id="root"></div>
+    <!--
+      This HTML file is a template.
+      If you open it directly in the browser, you will see an empty page.
+
+      You can add webfonts, meta tags, or analytics to this file.
+      The build step will place the bundled scripts into the <body> tag.
+
+      To begin the development, run `yarn start`.
+      To create a production bundle, use `yarn build`.
+    -->
+  </body>
+</html>

packages/app/public/manifest.json

@@ -0,0 +1,15 @@
+{
+  "short_name": "Backstage",
+  "name": "Backstage",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "48x48",
+      "type": "image/png"
+    }
+  ],
+  "start_url": "./index.html",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}

packages/app/public/robots.txt

@@ -0,0 +1,2 @@
+# https://www.robotstxt.org/robotstxt.html
+User-agent: *