[PR] Add support for new variables to the GUI whitelabel runtime system [cloudstack]

Fri, 06 Mar 2026 12:28:55 -0800 


hsato03 opened a new pull request, #12760:
URL: https://github.com/apache/cloudstack/pull/12760

   ### Description
   
   Currently, the GUI whitelabel theme management system supports the following 
variables defined in the `jsonConfiguration` parameter, following the ACS 
`config.json` file standard:
   
   <details><summary>Current Variables</summary>
   
   - `appTitle`
   - `favicon`
   - `footer`
   - `loginFooter`
   - `logo`
   - `minilogo`
   - `banner`
   - `error.403`
   - `error.404`
   - `error.500`
   - `plugins`
   
   </details>
   
   This PR aims to add the following variables, which can be used to facilitate 
the customization of whitelabel themes.
   
   <details><summary>New Variables</summary>
   
   - `apidocs`
   - `docBase`
   - `docHelpMappings`
   - `keyboardOptions`
   - `keyboardOptions.us`
   - `keyboardOptions.uk`
   - `keyboardOptions.fr`
   - `keyboardOptions.jp`
   - `keyboardOptions.sc`
   - `userCard`
   - `userCard.title`
   - `userCard.icon`
   - `userCard.icon.links`
   - `userCard.icon.links[i].title`
   - `userCard.icon.links[i].text`
   - `userCard.icon.links[i].link`
   - `userCard.icon.links[i].icon`
   - `theme`
   - `theme.@layout-mode`
   - `theme.@logo-background-color`
   - `theme.@mini-logo-background-color`
   - `theme.@navigation-background-color`
   - `theme.@project-nav-background-color`
   - `theme.@project-nav-text-color`
   - `theme.@navigation-text-color`
   - `theme.@primary-color`
   - `theme.@link-color`
   - `theme.@link-hover-color`
   - `theme.@loading-color`
   - `theme.@processing-color`
   - `theme.@success-color`
   - `theme.@warning-color`
   - `theme.@error-color`
   - `theme.@font-size-base`
   - `theme.@heading-color`
   - `theme.@text-color`
   - `theme.@text-color-secondary`
   - `theme.@disabled-color`
   - `theme.@border-color-base`
   - `theme.@border-radius-base`
   - `theme.@box-shadow-base`
   - `theme.@logo-width`
   - `theme.@logo-height`
   - `theme.@mini-logo-width`
   - `theme.@mini-logo-height`
   - `theme.@banner-width`
   - `theme.@banner-height`
   - `theme.@error-width`
   - `theme.@error-height`
   
   </details>
   
   <!--- Describe your changes in DETAIL - And how has behaviour functionally 
changed. -->
   
   <!-- For new features, provide link to FS, dev ML discussion etc. -->
   <!-- In case of bug fix, the expected and actual behaviours, steps to 
reproduce. -->
   
   <!-- When "Fixes: #<id>" is specified, the issue/PR will automatically be 
closed when this PR gets merged -->
   <!-- For addressing multiple issues/PRs, use multiple "Fixes: #<id>" -->
   <!-- Fixes: # -->
   
   <!--- 
******************************************************************************* 
-->
   <!--- NOTE: AUTOMATION USES THE DESCRIPTIONS TO SET LABELS AND PRODUCE 
DOCUMENTATION. -->
   <!--- PLEASE PUT AN 'X' in only **ONE** box -->
   <!--- 
******************************************************************************* 
-->
   
   ### Types of changes
   
   - [ ] Breaking change (fix or feature that would cause existing 
functionality to change)
   - [ ] New feature (non-breaking change which adds functionality)
   - [ ] Bug fix (non-breaking change which fixes an issue)
   - [X] Enhancement (improves an existing feature and functionality)
   - [ ] Cleanup (Code refactoring and cleanup, that may add test cases)
   - [ ] Build/CI
   - [ ] Test (unit or integration test code)
   
   ### Feature/Enhancement Scale or Bug Severity
   
   #### Feature/Enhancement Scale
   
   - [ ] Major
   - [X] Minor
   
   #### Bug Severity
   
   - [ ] BLOCKER
   - [ ] Critical
   - [ ] Major
   - [ ] Minor
   - [ ] Trivial
   
   ### Screenshots (if appropriate):
   
   ### How Has This Been Tested?
   
   I created a GUI theme via CloudMonkey using the new variables and specifying 
some invalid ones (like `invalidKeyboardOption` and `invalidError`).
   
   ```sh
   (local) šŸ‘» > create guitheme 
jsonconfiguration='{"keyboardOptions":{"us":"americano","uk":"ucraniano","jp":"japones","invalidKeyboardOption":"portugues"},"theme":{"@logo-background-color":"#000000","@mini-logo-background-color":"#000000","@navigation-background-color":"#000000","@navigation-text-color":"#FFFFFF","@link-color":"#9400ff","@link-hover-color":"#10ff00","@loading-color":"#ff0000","@primary-color":"#ff00d0","@processing-color":"#ff0000","@success-color":"#00f2ff","@warning-color":"#003fff","@error-color":"#752929","@font-size-base":"8px","@box-shadow-base":"0
 12px 48px rgba(255, 0, 0, 
0.8)","@logo-width":"100px","@logo-height":"40px","@mini-logo-width":"40px","@mini-logo-height":"30px","@banner-width":"200px","@banner-height":"40px","@error-width":"400px","@error-height":"300px","@border-color-base":"#a500ff","@text-color":"#ff0000","@text-color-secondary":"#ff0000","@border-radius-base":"16px","@disabled-color":"#ff0000","@project-nav-background-color":"#0000ff","@pr
 
oject-nav-text-color":"#00ff1d","@invalid-theme":"#00ff1d"},"apidocs":false,"docBase":"https://custom.doc/","error":{"404":"https://imgs.search.brave.com/O6r9WBn-9SyyEPclCdqnyMA70azESDiFTWb4yfiZVM4/rs:fit:500:0:0:0/g:ce/aHR0cHM6Ly93d3cu/cGV0ei5jb20uYnIv/YmxvZy93cC1jb250/ZW50L3VwbG9hZHMv/MjAyNS8wMS9jYXBp/dmFyYTItMS1zY2Fs/ZWQuanBn","500":"https://www.petz.com.br/blog/wp-content/uploads/2025/02/capivara-morde-interna1.jpg","invalidError":"https://www.petz.com.br/blog/wp-content/uploads/2025/02/capivara-morde-interna1.jpg"},"docHelpMappings":{"plugins/quota.html#quota-tariff":"tarifas","invalidDoc":"invalido"},"userCard":{"title":"Ayuda","icon":"exclamation-circle-outlined","links":[{"title":"Documentation","text":"Texto
 customizavel para 
documentacao","link":"https://custom.doc/","icon":"form-outlined","invalidUserCardLink":"Ayuda"},{"title":"API","text":"DocumentaĆ§Ć£o
 
API","link":"https://cloudstack.apache.org/api.html","icon":"api-outlined"},{"title":"Report
 Issue","text":"Submit a 
 bug or improvement 
request","link":"https://github.com/apache/cloudstack/issues/new","icon":"bug-outlined"},{"title":"Nova
 seĆ§Ć£o","text":"DescriĆ§Ć£o da nova 
seĆ§Ć£o","link":"https://www.petz.com.br/blog/wp-content/uploads/2025/02/capivara-morde-interna1.jpg","icon":"warning-outlined"}],"invalidUserCard":"Ayuda"},"invalida":"invalida"}'
 name=variables
   ```
   
   Next, upon accessing the ACS GUI, I verified that the new variables were 
rendered correctly.
   
   Furthermore, I verified that the invalid variables were shown in the 
management server logs and were not considered.
   
   ```
   2026-03-06 19:51:17,010 WARN  [o.a.c.g.t.j.c.v.a.ThemeAttribute] 
(qtp2049051802-20:[ctx-6e73e5e1, ctx-7bac603b]) (logid:7d304f36) The JSON 
attribute [@invalid-theme] is not a valid option, therefore, it will be ignored.
   2026-03-06 19:51:17,017 WARN  [o.a.c.g.t.j.c.v.a.ErrorAttribute] 
(qtp2049051802-20:[ctx-6e73e5e1, ctx-7bac603b]) (logid:7d304f36) The JSON 
attribute [invalidError] is not a valid option, therefore, it will be ignored.
   2026-03-06 19:51:17,017 WARN  [o.a.c.g.t.j.c.v.a.UserCardAttribute] 
(qtp2049051802-20:[ctx-6e73e5e1, ctx-7bac603b]) (logid:7d304f36) The JSON 
attribute [invalidUserCardLink] is not a valid option, therefore, it will be 
ignored.
   2026-03-06 19:51:17,017 WARN  [o.a.c.g.t.j.c.v.a.UserCardAttribute] 
(qtp2049051802-20:[ctx-6e73e5e1, ctx-7bac603b]) (logid:7d304f36) The JSON 
attribute [invalidUserCard] is not a valid option, therefore, it will be 
ignored.
   2026-03-06 19:51:17,017 WARN  [o.a.c.g.t.j.c.v.JsonConfigValidator] 
(qtp2049051802-20:[ctx-6e73e5e1, ctx-7bac603b]) (logid:7d304f36) The JSON 
attribute [invalida] is not a valid option, therefore, it will be ignored.
   ```
   
   #### How did you try to break this feature and the system with this change?
   
   <!-- see how your change affects other areas of the code, etc. -->
   
   <!-- Please read the 
[CONTRIBUTING](https://github.com/apache/cloudstack/blob/main/CONTRIBUTING.md) 
document -->
   


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: [email protected]

For queries about this service, please contact Infrastructure at:
[email protected]

Reply via email to