* test(web): migrate repository-shorthand-navigation to Playwright Migrate Cypress shorthand URL navigation tests to Playwright with real resources instead of mocked API responses. Consolidates 11 tests into 7. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> * test(web): migrate repository-permissions to Playwright Migrate repository-permissions.cy.ts to Playwright, consolidating 6 Cypress tests into 3 Playwright tests covering: - Inline permission display, change, and delete operations - Bulk permission change and delete operations - Adding permissions for robots and teams Changes: - Add repository permission API utilities to client.ts - Add api.repositoryPermission() helper with auto-cleanup - Add data-testid attributes to PermissionsToolbar and AddPermission - Update MIGRATION.md checklist (11 migrated, 20%) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> * test(web): migrate repository-notifications to Playwright Migrate 18 Cypress tests from repository-notifications.cy.ts to 7 consolidated Playwright tests covering notification CRUD operations, bulk actions, and recipient field functionality. Changes: - Add notification API utilities to client.ts - Add notification() method to TestApi for auto-cleanup - Add IMAGE_EXPIRY_TRIGGER to QuayFeature type - Add data-testid attributes to notification form components - Create notifications.spec.ts with 7 focused tests 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> * test(web): migrate repositories-list to Playwright Migrate repositories-list.cy.ts from Cypress to Playwright, consolidating 11 tests into 6 focused e2e tests: - displays repositories in global and organization views - creates repositories with different visibility and namespaces - deletes multiple repositories via bulk action - changes visibility for multiple repositories - searches by name and supports regex mode - searches by name including organization Skipped pagination tests (test PatternFly, not app code). Added data-testid attributes: - CreateRepoModalTemplate: form inputs, visibility radios, buttons - BulkDeleteModalTemplate: modal, confirmation input - RepositoryToolBar: visibility confirmation buttons 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> * test(web): migrate robot-accounts to Playwright Migrate robot-accounts.cy.ts from Cypress to Playwright, consolidating 12 tests into 4 focused e2e tests: - CRUD lifecycle: create, search, toolbar, and delete robot account - robot credentials and Kubernetes secrets - robot repository permissions: update single permission - robot wizard: org has 5 steps, user namespace has 3 steps Added data-testid attributes: - CreateRobotAccountModal: modal container - RobotTokensModal: regenerate button, token display, docker/podman commands - robotAccountWizard: step navigation, name/description inputs - ExpandCollapseButton, SearchInput, ToolbarButton: pass-through testid - RobotAccountKebab: menu items for permissions, tokens, delete - RobotAccountsList: table container 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> * test(web): remove migrated cypress tests Signed-off-by: Brady Pratt <bpratt@redhat.com> --------- Signed-off-by: Brady Pratt <bpratt@redhat.com> Co-authored-by: Claude <noreply@anthropic.com>
Quay UI
UI for Quay based on React and Patternfly framework
Installation
It is assumed that you have a Quay instance running that you can point the UI to. Run the following commands to get started
git clone https://github.com/quay/quay-ui.git
cd quay-ui
npm install
Development
Start the dev server by running
npm start
Runs the app in the development mode.
Open http://localhost:9000 to view it in the browser.
The page will reload if you make edits.
You will also see any lint errors in the console.
By default the UI connects to the quay backend for API. If you don't have
a backend or want to develop without a backend you can set the environment
variable MOCK_API=true before running npm start.
In order for you to use this with a Quay backend, you need to configure CORS on the Quay side.
Add the following to your config.yaml in Quay
CORS_ORIGIN: "http://localhost:9000"
If you are using docker-compose for local development, you can add this to local-dev/stack/config.yaml
in the Quay repo.
Testing
npm test
Launches the test runner in the interactive watch mode.
See the section about running tests for more information.
Integration Tests
Integration tests are ran via Cypress. The URL under test defaults to http://localhost:9000 and can be overriden with the baseUrl parameter in the cypress.config.ts file.
To run tests locally:
- Start the application with
npm start - When application has started run the tests with
npm run test:integration
Building for Production
npm run build
Builds the app for production to the dist folder.
It correctly bundles React in production mode and optimizes the build for the best performance.
The build is minified and the filenames include the hashes. See the section about deployment for more information.