Skip to content

feat(app-defaults): add app-auth and app-integration#2693

Open
gashcrumb wants to merge 1 commit intoredhat-developer:mainfrom
gashcrumb:RHIDP-12359
Open

feat(app-defaults): add app-auth and app-integration#2693
gashcrumb wants to merge 1 commit intoredhat-developer:mainfrom
gashcrumb:RHIDP-12359

Conversation

@gashcrumb
Copy link
Copy Markdown
Member

@gashcrumb gashcrumb commented Apr 2, 2026

This change adds an 'app-auth' plugin which provides the sign-in page and related authentiction module API factories to an app using the new frontend system. This change also adds a second 'app-integration' plugin which provides a default ScmAuth configuration. In both cases these plugins bring code migrated from the old frontend system setup in the RHDH repository. This change also adds a change to cleanup some noisy non-outcome altering output on the console when running the tests, along with some related updates to the eslint config so that the lint run by the pre-commit hook still works. Based on review feedback, this change also includes an improved error message should the app be misconfigured such that the sign-in page would not render properly

Fixes RHIDP-12359

Assisted-By: Cursor Desktop

Hey, I just made a Pull Request!

✔️ Checklist

  • A changeset describing the change and affected packages. (more info)
  • Added or Updated documentation
  • Tests for new functionality and regression tests for bug fixes
  • Screenshots attached (for UI changes)

Exporting these modules as dynamic plugins and starting RHDH backend's start:next script along with the relevant configuration that enables these modules provides a sign-in page that uses the correct authentication method as well as the ability to sign in using a secondary auth provider to access source control, for example:

image image

When starting the workspace in development mode using yarn start the guest authentication method can be used to sign-in.

@rhdh-gh-app
Copy link
Copy Markdown

rhdh-gh-app bot commented Apr 2, 2026

Missing Changesets

The following package(s) are changed by this PR but do not have a changeset:

  • @red-hat-developer-hub/backstage-plugin-app-auth
  • @red-hat-developer-hub/backstage-plugin-app-integrations
  • @red-hat-developer-hub/backstage-plugin-app-react

See CONTRIBUTING.md for more information about how to add changesets.

Changed Packages

Package Name Package Path Changeset Bump Current Version
app workspaces/app-defaults/packages/app none v0.0.0
@internal/jest-environment-jsdom-suppress-css workspaces/app-defaults/packages/jest-environment-jsdom-suppress-css none v0.0.0
@red-hat-developer-hub/backstage-plugin-app-auth workspaces/app-defaults/plugins/app-auth none v1.0.0
@red-hat-developer-hub/backstage-plugin-app-integrations workspaces/app-defaults/plugins/app-integrations none v1.0.0
@red-hat-developer-hub/backstage-plugin-app-react workspaces/app-defaults/plugins/app-react none v0.0.2

@rhdh-qodo-merge
Copy link
Copy Markdown

Review Summary by Qodo

Add app-auth and app-integrations plugins for new frontend system

✨ Enhancement

Grey Divider

Walkthroughs

Description
• Add app-auth plugin with multi-provider sign-in page and OAuth2 APIs
• Add app-integrations plugin for default SCM integrations and auth wiring
• Suppress noisy CSS parse errors in jsdom test environment
• Update ESLint config to handle .cjs files and add lint-staged configuration
• Integrate new plugins into sample app with updated dependencies
Diagram
flowchart LR
  A["app-auth plugin"] -->|"provides sign-in page"| B["Sample App"]
  C["app-integrations plugin"] -->|"provides SCM auth"| B
  D["Jest environment"] -->|"suppress CSS errors"| E["Test setup"]
  F["ESLint config"] -->|"handle .cjs files"| G["Lint pipeline"]
  B -->|"uses"| H["New Frontend System"]
Loading

Grey Divider

File Changes

1. workspaces/app-defaults/plugins/app-auth/package.json ✨ Enhancement +78/-0

New app-auth plugin package configuration

workspaces/app-defaults/plugins/app-auth/package.json


2. workspaces/app-defaults/plugins/app-auth/src/appAuthModule.tsx ✨ Enhancement +120/-0

Frontend module with OIDC, Auth0, SAML OAuth2 APIs

workspaces/app-defaults/plugins/app-auth/src/appAuthModule.tsx


3. workspaces/app-defaults/plugins/app-auth/src/components/SignInPage.tsx ✨ Enhancement +208/-0

Multi-provider sign-in page component with translations

workspaces/app-defaults/plugins/app-auth/src/components/SignInPage.tsx


View more (29)
4. workspaces/app-defaults/plugins/app-auth/src/AuthApiRefs.ts ✨ Enhancement +43/-0

API references for OIDC, Auth0, SAML authentication

workspaces/app-defaults/plugins/app-auth/src/AuthApiRefs.ts


5. workspaces/app-defaults/plugins/app-auth/src/alpha.ts ✨ Enhancement +28/-0

Alpha exports for new frontend system APIs

workspaces/app-defaults/plugins/app-auth/src/alpha.ts


6. workspaces/app-defaults/plugins/app-auth/src/index.ts ✨ Enhancement +21/-0

Main entry point with documentation reference

workspaces/app-defaults/plugins/app-auth/src/index.ts


7. workspaces/app-defaults/plugins/app-auth/src/translations/signIn.ts ✨ Enhancement +81/-0

Sign-in page translation messages for all providers

workspaces/app-defaults/plugins/app-auth/src/translations/signIn.ts


8. workspaces/app-defaults/plugins/app-auth/config.d.ts ⚙️ Configuration changes +23/-0

Configuration schema for sign-in page providers

workspaces/app-defaults/plugins/app-auth/config.d.ts


9. workspaces/app-defaults/plugins/app-auth/.eslintrc.js ⚙️ Configuration changes +1/-0

ESLint configuration for app-auth plugin

workspaces/app-defaults/plugins/app-auth/.eslintrc.js


10. workspaces/app-defaults/plugins/app-auth/src/setupTests.ts 🧪 Tests +17/-0

Test setup with cross-fetch polyfill

workspaces/app-defaults/plugins/app-auth/src/setupTests.ts


11. workspaces/app-defaults/plugins/app-auth/README.md 📝 Documentation +12/-0

Documentation for app-auth plugin usage and config

workspaces/app-defaults/plugins/app-auth/README.md


12. workspaces/app-defaults/plugins/app-integrations/package.json ✨ Enhancement +74/-0

New app-integrations plugin package configuration

workspaces/app-defaults/plugins/app-integrations/package.json


13. workspaces/app-defaults/plugins/app-integrations/src/appIntegrationsModule.tsx ✨ Enhancement +76/-0

Frontend module with SCM integrations and auth APIs

workspaces/app-defaults/plugins/app-integrations/src/appIntegrationsModule.tsx


14. workspaces/app-defaults/plugins/app-integrations/src/mergeScmAuthFromDeps.ts ✨ Enhancement +52/-0

SCM auth factory matching classic RHDH behavior

workspaces/app-defaults/plugins/app-integrations/src/mergeScmAuthFromDeps.ts


15. workspaces/app-defaults/plugins/app-integrations/src/mergeScmAuthFromDeps.test.ts 🧪 Tests +81/-0

Tests for SCM auth merge logic with multiple hosts

workspaces/app-defaults/plugins/app-integrations/src/mergeScmAuthFromDeps.test.ts


16. workspaces/app-defaults/plugins/app-integrations/src/alpha.ts ✨ Enhancement +27/-0

Alpha exports for SCM integrations module

workspaces/app-defaults/plugins/app-integrations/src/alpha.ts


17. workspaces/app-defaults/plugins/app-integrations/src/index.ts ✨ Enhancement +21/-0

Main entry point with documentation reference

workspaces/app-defaults/plugins/app-integrations/src/index.ts


18. workspaces/app-defaults/plugins/app-integrations/.eslintrc.js ⚙️ Configuration changes +1/-0

ESLint configuration for app-integrations plugin

workspaces/app-defaults/plugins/app-integrations/.eslintrc.js


19. workspaces/app-defaults/plugins/app-integrations/src/setupTests.ts 🧪 Tests +18/-0

Test setup with cross-fetch polyfill

workspaces/app-defaults/plugins/app-integrations/src/setupTests.ts


20. workspaces/app-defaults/plugins/app-integrations/README.md 📝 Documentation +14/-0

Documentation for app-integrations plugin usage

workspaces/app-defaults/plugins/app-integrations/README.md


21. workspaces/app-defaults/jest-environment-jsdom-suppress-css.cjs Error handling +205/-0

Custom Jest environment suppressing CSS parse errors

workspaces/app-defaults/jest-environment-jsdom-suppress-css.cjs


22. workspaces/app-defaults/.lintstagedrc.cjs ⚙️ Configuration changes +43/-0

Lint-staged configuration for pre-commit hook

workspaces/app-defaults/.lintstagedrc.cjs


23. .eslintrc.cjs ⚙️ Configuration changes +9/-0

ESLint override for .cjs file parsing with ES6+

.eslintrc.cjs


24. workspaces/app-defaults/packages/app/src/App.tsx ✨ Enhancement +10/-1

Integrate app-auth and app-integrations modules

workspaces/app-defaults/packages/app/src/App.tsx


25. workspaces/app-defaults/packages/app/src/App.test.tsx 🧪 Tests +1/-0

Add auth.environment config to test setup

workspaces/app-defaults/packages/app/src/App.test.tsx


26. workspaces/app-defaults/packages/app/package.json Dependencies +10/-4

Add new plugin dependencies and update testing libraries

workspaces/app-defaults/packages/app/package.json


27. workspaces/app-defaults/packages/app/src/setupTests.ts 🧪 Tests +3/-0

Add cross-fetch polyfill for test environment

workspaces/app-defaults/packages/app/src/setupTests.ts


28. workspaces/app-defaults/plugins/app-react/src/setupTests.ts 🧪 Tests +1/-0

Add cross-fetch polyfill for test environment

workspaces/app-defaults/plugins/app-react/src/setupTests.ts


29. workspaces/app-defaults/plugins/app-react/package.json Dependencies +5/-1

Update testing libraries and add Jest configuration

workspaces/app-defaults/plugins/app-react/package.json


30. workspaces/app-defaults/package.json ⚙️ Configuration changes +2/-10

Remove lint-staged config, add prettier:fix script

workspaces/app-defaults/package.json


31. workspaces/app-defaults/README.md 📝 Documentation +26/-3

Document app-auth and app-integrations wiring and config

workspaces/app-defaults/README.md


32. workspaces/app-defaults/app-config.yaml ⚙️ Configuration changes +2/-0

Add auth.environment development setting

workspaces/app-defaults/app-config.yaml


Grey Divider

Qodo Logo

@rhdh-qodo-merge
Copy link
Copy Markdown

rhdh-qodo-merge bot commented Apr 2, 2026

Code Review by Qodo

🐞 Bugs (2) 📘 Rule violations (0) 📎 Requirement gaps (0) 🎨 UX Issues (0)

Grey Divider


Action required

1. Jest env path invalid 🐞 Bug ≡ Correctness
Description
Several app-defaults packages set jest.testEnvironment to
../../../jest-environment-jsdom-suppress-css.cjs, which resolves outside workspaces/app-defaults
and does not match the actual file location. Jest will fail to resolve the environment module and
the affected packages’ unit tests won’t run.
Code

workspaces/app-defaults/packages/app/package.json[R14-16]

+  "jest": {
+    "testEnvironment": "../../../jest-environment-jsdom-suppress-css.cjs"
+  },
Evidence
The packages configure testEnvironment as ../../../jest-environment-jsdom-suppress-css.cjs (3
directories up from each package), but the custom environment file lives in
workspaces/app-defaults/, which is only 2 directories up from packages/* and plugins/* within
that workspace.

workspaces/app-defaults/packages/app/package.json[11-16]
workspaces/app-defaults/plugins/app-auth/package.json[30-41]
workspaces/app-defaults/plugins/app-integrations/package.json[30-40]
workspaces/app-defaults/plugins/app-react/package.json[30-40]
workspaces/app-defaults/jest-environment-jsdom-suppress-css.cjs[59-90]

Agent prompt
The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

### Issue description
`jest.testEnvironment` points to `../../../jest-environment-jsdom-suppress-css.cjs`, but the file is located at `workspaces/app-defaults/jest-environment-jsdom-suppress-css.cjs`. With typical Jest `rootDir` values (package root / workspace root), the current path resolves to a non-existent location, breaking tests.

### Issue Context
The environment file is in the app-defaults workspace root, while the Jest configs are in `workspaces/app-defaults/packages/*` and `workspaces/app-defaults/plugins/*`.

### Fix
Update all affected `package.json` files to use the correct relative path (likely `../../jest-environment-jsdom-suppress-css.cjs`).

### Fix Focus Areas
- workspaces/app-defaults/packages/app/package.json[14-16]
- workspaces/app-defaults/plugins/app-auth/package.json[38-40]
- workspaces/app-defaults/plugins/app-integrations/package.json[38-40]
- workspaces/app-defaults/plugins/app-react/package.json[38-40]

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools


2. Missing auth.environment crashes 🐞 Bug ☼ Reliability
Description
SignInPage calls configApi.getString('auth.environment'), which throws if auth.environment is
not configured, crashing the sign-in page render. The same feature set otherwise treats
auth.environment as optional, so deployments without this key will break unexpectedly.
Code

workspaces/app-defaults/plugins/app-auth/src/components/SignInPage.tsx[R163-167]

+export function SignInPage(props: SignInPageProps): React.JSX.Element {
+  const configApi = useApi(configApiRef);
+  const { t } = useTranslationRef(signInTranslationRef);
+  const isDevEnv = configApi.getString('auth.environment') === 'development';
+
Evidence
SignInPage uses getString (throws on missing key), while the OAuth2 API factories in the same
plugin use getOptionalString for the same config key, indicating it’s expected to be optional in
some environments. The sample app-config sets auth.environment: development, which masks the
problem for the sample workspace but doesn’t protect other adopters.

workspaces/app-defaults/plugins/app-auth/src/components/SignInPage.tsx[163-170]
workspaces/app-defaults/plugins/app-auth/src/appAuthModule.tsx[35-53]
workspaces/app-defaults/app-config.yaml[74-81]

Agent prompt
The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

### Issue description
`SignInPage` currently does `configApi.getString('auth.environment') === 'development'`, which throws when `auth.environment` is unset. This can break production deployments or consuming apps that don’t define `auth.environment`.

### Issue Context
Elsewhere in the same plugin, OAuth2 factories read `auth.environment` via `getOptionalString`, so the code already assumes the key may be missing.

### Fix
Change the `SignInPage` check to use `getOptionalString('auth.environment')` (treat missing as non-development), e.g.
```ts
const isDevEnv = configApi.getOptionalString('auth.environment') === 'development';
```

### Fix Focus Areas
- workspaces/app-defaults/plugins/app-auth/src/components/SignInPage.tsx[163-167]

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools


Grey Divider

ⓘ The new review experience is currently in Beta. Learn more

Grey Divider

Qodo Logo

@gashcrumb gashcrumb force-pushed the RHIDP-12359 branch 2 times, most recently from 00f04dd to 6b21b19 Compare April 2, 2026 14:08
This change adds an 'app-auth' plugin which provides the sign-in page
and related authentiction module API factories to an app using the new
frontend system.  This change also adds a second 'app-integration'
plugin which provides a default ScmAuth configuration.  In both cases
these plugins bring code migrated from the old frontend system setup in
the RHDH repository.  This change also adds a change to cleanup some
noisy non-outcome altering output on the console when running the tests,
along with some related updates to the eslint config so that the lint
run by the pre-commit hook still works.  This change also contains some
updates to the app-defaults workspace README.  Based on review feedback,
this change also includes an improved error message should the app be
misconfigured such that the sign-in page would not render properly

Assisted-By: Cursor Desktop
@sonarqubecloud
Copy link
Copy Markdown

sonarqubecloud bot commented Apr 2, 2026

@gashcrumb
Copy link
Copy Markdown
Member Author

not sure the best version to use in the package.json files for these, maybe I should have just kept them at 0.0.1.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant