Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

🌱 Setup branding to be configurable during the build #1664

Merged
merged 3 commits into from
Mar 5, 2024

Conversation

sjd78
Copy link
Member

@sjd78 sjd78 commented Jan 16, 2024

Summary

Refactor and enhance branding capabilities. Now branding is included from a single directory that contains at least strings.json, manifest.json, and favicon.ico. Any other assets may be placed in the directory and will be copied to the bundled app.

Running the build as normal should show no difference.

Running the build with BRANDING=./some-other-brand npm run start:dev will try to use a branding from the specified directory (that is relative to the project's source root).

See BRANDING.md for more details.

Resolves: #1682

Details

Branding changes:

  • Move Konveyor branding assets to a project top-level branding directory

  • Remove MTA branding assets

  • Remove profile/branding constants from env and client module

  • Embed branding strings and assets in the common module

    • strings.json is templated to allow the build to adjust asset
      URL path roots as necessary
    • brandingAssetPath()
  • server's index.html generation sources the template strings from the common module's branding strings

  • HeaderApp and AppAboutModal components support branding by using the useBranding hook

  • BRANDING as a relative path is computed from the project root

  • webpack build source branding assets directly from the common module

  • Unit tests, snapshots and jest configs updated as necessary

Jest changes:

  • Use react-i18next mock from client/__mocks__ as a more robust mock borrowed from react-i18n repos

  • Move setupTests.ts into client/src/app/test-config to keep jest test config code all in the same directory

Related changes:

  • Upgrade rollup to v4, add new rollup plugins (copy, virtual)

@sjd78 sjd78 requested a review from ibolton336 January 16, 2024 20:17
@sjd78 sjd78 changed the title Setup build time externalizable branding Setup branding to be configurable during the build Jan 17, 2024
@sjd78 sjd78 changed the title Setup branding to be configurable during the build 🌱 Setup branding to be configurable during the build Jan 18, 2024
@ibolton336
Copy link
Member

Tested and working great with downstream mock dir passed to the branding path var.

@sjd78 sjd78 marked this pull request as ready for review January 19, 2024 00:30
@sjd78 sjd78 added the cherry-pick/release-0.3 This PR should be cherry-picked to release-0.3 branch. label Feb 9, 2024
@sjd78 sjd78 removed the cherry-pick/release-0.3 This PR should be cherry-picked to release-0.3 branch. label Feb 14, 2024
Refactor and enhance branding capabilities.  Now branding is included
from a single directory that contains at least `strings.json`,
`manifest.json`, and `favicon.ico`.  Any other assets may be placed
in the directory and will be copied to the bundled app.

Change summary:
  - Move Konveyor branding assets to a project top-level branding
    directory

  - Remove MTA branding assets

  - Remove profile/branding constants from `env` and client module

  - Embed branding strings and assets in the common module
    - `strings.json` is templated to allow the build to adjust asset
      URL path roots as necessary
    - `brandingAssetPath()`

  - server's index.html generation sources the template strings from
    the common module's branding strings

  - HeaderApp support brand definitions

  - client about and masthead to use 'useBranding' hook

  - `BRANDING` as a relative path is computed from the project root

  - webpack build source branding assets directly from the common module

  - Unit tests, snapshots and jest configs updated as necessary

Jest changes:
  - Use `react-i18next` mock from `client/__mocks__` as a more robust
    mock borrowed from react-i18n repos

  - Move `setupTests.ts` into `client/src/app/test-config` to keep jest
    test config code all in the same directory

Related changes:
  - Upgrade rollup to v4, add new rollup plugins (copy, virtual)

Signed-off-by: Scott J Dickerson <sdickers@redhat.com>
Signed-off-by: Scott J Dickerson <sdickers@redhat.com>
@sjd78 sjd78 added the cherry-pick/release-0.3 This PR should be cherry-picked to release-0.3 branch. label Mar 4, 2024
@sjd78 sjd78 merged commit 8870bf6 into konveyor:main Mar 5, 2024
6 checks passed
@sjd78 sjd78 deleted the branding-overrides branch March 5, 2024 02:34
github-actions bot pushed a commit that referenced this pull request Mar 5, 2024
## Summary
Refactor and enhance branding capabilities. Now branding is included
from a single directory that contains at least `strings.json`,
`manifest.json`, and `favicon.ico`. Any other assets may be placed in
the directory and will be copied to the bundled app.

Running the build as normal should show no difference.

Running the build with `BRANDING=./some-other-brand npm run start:dev`
will try to use a branding from the specified directory (that is relative to the
project's source root).

See `BRANDING.md` for more details.

Resolves: #1682

## Details
Branding changes:
  - Move Konveyor branding assets to a project top-level branding directory

  - Remove MTA branding assets

  - Remove profile/branding constants from `env` and client module

  - Embed branding strings and assets in the common module
    - `strings.json` is templated to allow the build to adjust asset
      URL path roots as necessary
    - `brandingAssetPath()`

  - server's index.html generation sources the template strings from the
    common module's branding strings

  - `HeaderApp` and `AppAboutModal` components support branding by using
    the `useBranding` hook

  - `BRANDING` as a relative path is computed from the project root

  - webpack build source branding assets directly from the common module

  - Unit tests, snapshots and jest configs updated as necessary

Jest changes:
  - Use `react-i18next` mock from `client/__mocks__` as a more robust mock
    borrowed from react-i18n repos

  - Move `setupTests.ts` into `client/src/app/test-config` to keep jest
    test config code all in the same directory

Related changes:
  - Upgrade rollup to v4, add new rollup plugins (copy, virtual)

---------

Signed-off-by: Scott J Dickerson <sdickers@redhat.com>
Co-authored-by: Ian Bolton <ibolton@redhat.com>
Signed-off-by: Cherry Picker <noreply@github.com>
sjd78 added a commit that referenced this pull request Mar 5, 2024
On merge to main, #1664 showed that the normal rollup package does not
support the linux-ppc64 platform. This was not caught earlier as
building on github actions always worked with the standard `rollup`
package. The error message displayed on the multiarch build attempt is:

> Error: Your current platform "linux" and architecture "ppc64"
combination is not yet supported by the native Rollup build. Please use
the WASM build "@rollup/wasm-node" instead.

Swapping the package `rollup` to `@rollup/wasm-node` should enable the
ppc64 build.

Signed-off-by: Scott J Dickerson <sdickers@redhat.com>
sjd78 added a commit to sjd78/tackle2-ui that referenced this pull request Mar 5, 2024
Following up on PRs konveyor#1664 and konveyor#1739, downgrade to `rollup@^3.0`.
The v4 of rollup has "native" code that runs the build, and that code
does not currently work with s390 builds [1].  Since konveyor is
built for x86, arm, ppc, and s390, all of those need to work.

When the s390 builds can work with the wasm bits, we can upgrade
to `rollup@^4.0` again.

[1] - rollup/rollup#5354

Signed-off-by: Scott J Dickerson <sdickers@redhat.com>
sjd78 added a commit that referenced this pull request Mar 5, 2024
Following up on PRs #1664 and #1739, downgrade to `rollup@^3.0`. The v4
of rollup has "native" code that runs the build, and that code does not
currently work with s390 builds [1]. Since konveyor is built for x86,
arm, ppc, and s390, all of those need to work.

When the s390 builds can work with the wasm bits, we can upgrade to
`rollup@^4.0` again.

[1] - rollup/rollup#5354

Signed-off-by: Scott J Dickerson <sdickers@redhat.com>
sjd78 added a commit that referenced this pull request Mar 14, 2024
## Summary
Refactor and enhance branding capabilities. Now branding is included
from a single directory that contains at least `strings.json`,
`manifest.json`, and `favicon.ico`. Any other assets may be placed in
the directory and will be copied to the bundled app.

Running the build as normal should show no difference.

Running the build with `BRANDING=./some-other-brand npm run start:dev`
will try to use a branding from the specified directory (that is relative to the
project's source root).

See `BRANDING.md` for more details.

Resolves: #1682

## Details
Branding changes:
  - Move Konveyor branding assets to a project top-level branding directory

  - Remove MTA branding assets

  - Remove profile/branding constants from `env` and client module

  - Embed branding strings and assets in the common module
    - `strings.json` is templated to allow the build to adjust asset
      URL path roots as necessary
    - `brandingAssetPath()`

  - server's index.html generation sources the template strings from the
    common module's branding strings

  - `HeaderApp` and `AppAboutModal` components support branding by using
    the `useBranding` hook

  - `BRANDING` as a relative path is computed from the project root

  - webpack build source branding assets directly from the common module

  - Unit tests, snapshots and jest configs updated as necessary

Jest changes:
  - Use `react-i18next` mock from `client/__mocks__` as a more robust mock
    borrowed from react-i18n repos

  - Move `setupTests.ts` into `client/src/app/test-config` to keep jest
    test config code all in the same directory

Related changes:
  - Upgrade rollup to v4, add new rollup plugins (copy, virtual)

---------

Signed-off-by: Scott J Dickerson <sdickers@redhat.com>
Co-authored-by: Ian Bolton <ibolton@redhat.com>
Signed-off-by: Cherry Picker <noreply@github.com>
sjd78 added a commit that referenced this pull request Mar 14, 2024
Following up on PRs #1664 and #1739, downgrade to `rollup@^3.0`. The v4
of rollup has "native" code that runs the build, and that code does not
currently work with s390 builds [1]. Since konveyor is built for x86,
arm, ppc, and s390, all of those need to work.

When the s390 builds can work with the wasm bits, we can upgrade to
`rollup@^4.0` again.

[1] - rollup/rollup#5354

Signed-off-by: Scott J Dickerson <sdickers@redhat.com>
sjd78 pushed a commit that referenced this pull request Mar 15, 2024
…1738)

## Summary
Refactor and enhance branding capabilities. Now branding is included
from a single directory that contains at least `strings.json`,
`manifest.json`, and `favicon.ico`. Any other assets may be placed in
the directory and will be copied to the bundled app.

Running the build as normal should show no difference.

Running the build with `BRANDING=./some-other-brand npm run start:dev`
will try to use a branding from the specified directory (that is relative to the
project's source root).

See `BRANDING.md` for more details.

Resolves: #1682

## Details
Branding changes:
  - Move Konveyor branding assets to a project top-level branding directory

  - Remove MTA branding assets

  - Remove profile/branding constants from `env` and client module

  - Embed branding strings and assets in the common module
    - `strings.json` is templated to allow the build to adjust asset URL path roots
       as necessary
    - `brandingAssetPath()`

  - server's index.html generation sources the template strings from the
    common module's branding strings

  - `HeaderApp` and `AppAboutModal` components support branding by using
    the `useBranding` hook

  - `BRANDING` as a relative path is computed from the project root

  - webpack build source branding assets directly from the common module

  - Unit tests, snapshots and jest configs updated as necessary

Jest changes:
  - Use `react-i18next` mock from `client/__mocks__` as a more robust mock
    borrowed from react-i18n repos

  - Move `setupTests.ts` into `client/src/app/test-config` to keep jest
    test config code all in the same directory

Related changes:
  - add new rollup plugins (copy, virtual)

## Downgrade to rollup v3 for multiarch builds (#1742)
As a followup on PRs #1664 and #1739, it became necessary to downgrade
back to `rollup@^3.0`. The v4 of rollup has "native" code that runs the
build, and that code does not currently work with s390 builds [1]. 

Since konveyor is built for x86, arm, ppc, and s390, all of those need to work.

When the s390 builds can work with the wasm bits, we can upgrade to
`rollup@^4.0` again.

[1] - rollup/rollup#5354

---------

Signed-off-by: Scott J Dickerson <sdickers@redhat.com>
Signed-off-by: Cherry Picker <noreply@github.com>
Co-authored-by: Ian Bolton <ibolton@redhat.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
cherry-pick/release-0.3 This PR should be cherry-picked to release-0.3 branch.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Enhancement] Allow for externally defined branding
2 participants