particle-os/debian-image-builder-frontend
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions
Image Builder service for console.redhat.com
663 commits 9 branches 22 tags 26 MiB
Find a file
lucasgarfield fa7b0ca553 CreateImageWizard: Package search reset buttons and typeahead filter 
Resolves #604. The available and chosen package search inputs now have a
reset button which resets the search and list elements to their default
states. This fixes a cosmetic issue related to the focus-visible width
being smaller than the search input width. This is accomplished by passing
an onClear prop to the search input.

The functions used to add all and selected packages were split from two
functions into four functions. The functions appear similiar but this is only
superficial; the logic is actually quite different and there is very
little code reuse. Four separate functions will be easier to understand and
maintain.

This commit includes several other modifications:
1. The chosen package search is now a typeahead filter. This brings it
   in line with PatternFly dual list selector examples.
2. The available package search button has changed to be in line with
   the PatternFly <SearchInput /> component examples.
3. Package sorting behavior is now consistent. Previously, packages would be
   sorted if 'add all' was used but not if 'add selected' was used. Now
   the default behavior is to always sort the package list.
2022-04-21 16:05:18 +02:00
.github ci: Extract Coverity Scan tools in /tmp 2021-11-12 12:02:43 +01:00
.travis .travis: Introduce simplified custom release script 2022-04-14 14:22:49 +02:00
config config: Let frontend-components set deployment in prod config 2022-04-14 13:05:02 +02:00
devel devel: typo fix (#561) 2022-02-07 20:36:23 +01:00
distribution Reflect webpack changes in docker compose. 2021-10-12 15:03:04 +02:00
src CreateImageWizard: Package search reset buttons and typeahead filter 2022-04-21 16:05:18 +02:00
.eslintrc.yml package.json: update babel-eslint to @babel/eslint-parser 2022-03-02 09:59:19 +01:00
.gitignore Stop ignoring lock-file. 2021-10-12 15:03:04 +02:00
.stylelintrc.json package-json: remove unnused stylint-scss and bump dependencies 2022-03-24 15:48:34 +01:00
.travis.yml .travis: Enable stage-stable and prod-stable branches 2022-04-21 14:42:55 +02:00
babel.config.js babel: update the babel config 2022-04-11 13:18:30 +02:00
codecov.yml codecov.yml: reset comment to default 2021-10-28 15:02:18 +01:00
LICENSE osbuild-installer-frontend 2020-03-27 10:14:04 +01:00
package-lock.json build(deps): bump @patternfly/patternfly from 4.183.1 to 4.185.1 2022-04-12 12:48:22 +02:00
package.json package.json: Simplify scripts 2022-04-12 20:03:38 +02:00
README.md package.json: add run script for stage env 2022-02-28 15:35:51 +01:00

README.md

image-builder-frontend

Frontend Development

To develop the frontend you can use a proxy to run image-builder-frontend locally against the chrome and backend at console.redhat.com.

Working against the production environment is preferred, as any work can be released without worrying if a feature from stage has been released yet.

Nodejs and npm version

Make sure you have npm@7 and node 15+ installed. If you need multiple versions of nodejs check out nvm.

Webpack proxy

  1. run npm ci

  2. run npm run start:proxy:beta. This command uses a prod-beta env by default. Configure your environment by the env attribute in dev.webpack.config.js.

  3. open browser at https://prod.foo.redhat.com:1337/beta/insights/image-builder

Webpack proxy (staging) -- Runs with image-builder's stage deployment

  1. run npm ci

  2. run npm run stage. This command uses a stage-beta env by default. Configure your environment by the env attribute in dev.webpack.config.js.

  3. open browser at https://stage.foo.redhat.com:1337/beta/insights/image-builder

Insights proxy (deprecated)

  1. Clone the insights proxy: https://github.com/RedHatInsights/insights-proxy

  2. Setting up the proxy

    Choose a runner (podman or docker), and point the SPANDX_CONFIG variable to profile/local-frontend.js included in image-builder-frontend.

        sudo insights-proxy/scripts/patch-etc-hosts.sh
    export RUNNER="podman"
    export SPANDX_CONFIG=$PATH_TO/image-builder-frontend/profiles/local-frontend.js
    sudo -E insights-proxy/scripts/run.sh

  3. Starting up image-builder-frontend

    In the image-builder-frontend checkout directory

        npm install
    npm start

The UI should be running on https://prod.foo.redhat.com:1337/beta/insights/image-builder/landing. Note that this requires you to have access to either production or stage (plus VPN and proxy config) of insights.

Backend Development

To develop both the frontend and the backend you can again use the proxy to run both the frontend and backend locally against the chrome at cloud.redhat.com. For instructions see devel/README.md.

Style Guidelines

This project uses eslint's recommended styling guidelines. These rules can be found here: https://eslint.org/docs/rules/

Test Guidelines

Testing is done using React Testing Library. All UI contributions must also include a new test or update an existing test in order to maintain code coverage.

Tests can be run with

    npm run test

These tests will also be run in our Travis CI when a PR is opened.