Skip to content

MWPW-188000: Settings UI#641

Open
yesil wants to merge 54 commits intomainfrom
MWPW-188000
Open

MWPW-188000: Settings UI#641
yesil wants to merge 54 commits intomainfrom
MWPW-188000

Conversation

@yesil
Copy link
Contributor

@yesil yesil commented Mar 2, 2026

Settings UI will appear only if you are either a MAS Admin or MAS Poweruser.

In the test URL, I have mas-io-studio-base so that user groups are also available for access to Setting feature.
However, it does not need any app builder deployment. Once scripts/app/refreshUsers.mjs is merged, user groups will become available on main after next sync.

Resolves https://jira.corp.adobe.com/browse/MWPW-188000
QA Checklist: https://wiki.corp.adobe.com/display/adobedotcom/M@S+Engineering+QA+Use+Cases

Please do the steps below before submitting your PR for a code review or QA

  • C1. Cover code with Unit Tests
  • C2. Add a Nala test (double check with #fishbags if nala test is needed)
  • C3. Verify all Checks are green (unit tests, nala tests)
  • C4. PR description contains working Test Page link where the feature can be tested
  • C5: you are ready to do a demo from Test Page in PR (bonus: write a working demo script that you'll use on Thursday, you can eventually put in your PR)
  • C.6 read your Jira one more time to validate that you've addressed all AC's and nothing is missing

🧪 Nala E2E Tests

Nala tests run automatically when you open this PR.

To run Nala tests again:

  1. Add the run nala label to this PR (in the right sidebar)
  2. Tests will run automatically on the current commit
  3. Any future commits will also trigger tests as long as the label remains

To stop automatic Nala tests:

  • Remove the run nala label

Note: Tests only run on commits if the run nala label is present. Add the label whenever you need tests to run on new changes.

Test URLs:

@aem-code-sync
Copy link

aem-code-sync bot commented Mar 2, 2026

Hello, I'm the AEM Code Sync Bot and I will run some actions to deploy your branch.
In case there are problems, just click the checkbox below to rerun the respective action.

  • Re-sync branch
Commits

@codecov
Copy link

codecov bot commented Mar 2, 2026

Codecov Report

❌ Patch coverage is 95.64356% with 220 lines in your changes missing coverage. Please review.
✅ Project coverage is 85.49%. Comparing base (14b87c8) to head (2e0b6cd).
⚠️ Report is 1 commits behind head on main.

Files with missing lines Patch % Lines
studio/src/common/fields/tree-picker-field.js 93.84% 43 Missing ⚠️
studio/src/settings/settings-store.js 97.09% 29 Missing ⚠️
studio/src/common/fields/quantity-select.js 83.00% 26 Missing ⚠️
studio/src/mas-repository.js 21.87% 25 Missing ⚠️
studio/src/aem/aem.js 40.54% 22 Missing ⚠️
studio/src/router.js 83.05% 20 Missing ⚠️
studio/src/mas-locale-picker.js 96.66% 12 Missing ⚠️
studio/src/settings/mas-settings-table.js 97.89% 12 Missing ⚠️
studio/src/settings/mas-settings.js 99.17% 11 Missing ⚠️
studio/src/editors/merch-card-editor.js 64.28% 10 Missing ⚠️
... and 3 more
Additional details and impacted files

Impacted file tree graph

@@            Coverage Diff             @@
##             main     #641      +/-   ##
==========================================
+ Coverage   84.15%   85.49%   +1.33%     
==========================================
  Files         180      188       +8     
  Lines       49064    53927    +4863     
==========================================
+ Hits        41292    46103    +4811     
- Misses       7772     7824      +52     
Files with missing lines Coverage Δ
studio/src/aem/aem-tag-picker-field.js 94.60% <100.00%> (+0.04%) ⬆️
studio/src/editors/variant-picker.js 98.78% <100.00%> (+0.09%) ⬆️
studio/src/groups.js 100.00% <100.00%> (ø)
studio/src/mas-quick-actions.js 100.00% <100.00%> (ø)
studio/src/settings/mas-settings-table.css.js 100.00% <100.00%> (ø)
studio/src/store.js 91.66% <100.00%> (+0.11%) ⬆️
studio/src/translation/mas-translation-editor.js 96.54% <ø> (-0.08%) ⬇️
studio/src/mas-top-nav.js 99.50% <98.48%> (-0.50%) ⬇️
studio/src/settings/setting-name-map.js 94.11% <94.11%> (ø)
studio/src/mas-side-nav.js 92.30% <87.50%> (-0.42%) ⬇️
... and 10 more

... and 7 files with indirect coverage changes


Continue to review full report in Codecov by Sentry.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 14b87c8...2e0b6cd. Read the comment docs.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

target.dispatchEvent(closeEvent);
};

#handleBackToBreadcrumb = () => {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I moved breadcrumb to top-nav as per Figma.

form = Object.fromEntries([...this.fragment.fields.map((f) => [f.name, f])]);
}
return html`
<div class="promotions-form-breadcrumb">
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I moved breadcrumb to top nav as per Figma

@@ -0,0 +1,143 @@
import { css, html, LitElement } from 'lit';
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I extracted quantity-select as a field so that I could also use it in settings UI as a setting.

@afmicka
Copy link
Collaborator

afmicka commented Mar 6, 2026

@yesil i am not able to select template in Create Settings nor in override. It is greyed out.
https://mwpw-188000--mas--adobecom.aem.live/studio.html?io.studio.env=yesil#page=settings&path=nala

Screenshot 2026-03-06 at 10 01 06 Screenshot 2026-03-06 at 10 02 52

@afmicka afmicka removed the run nala label Mar 6, 2026
@afmicka
Copy link
Collaborator

afmicka commented Mar 6, 2026

@yesil for the quantity selector in the editor you have removed a lot of testable attributes and uniqueness of the fields, causing Nala to fail. Removing aria-label value also might have accessibility consequences. Do we really want to strip all these? It is hard to make selectors now unique for the field without any identifier.

your branch:
Screenshot 2026-03-06 at 10 29 04

prod:
Screenshot 2026-03-06 at 10 29 40

Copy link
Collaborator

@afmicka afmicka left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@yesil when there are no settings (empty), it gives the red toast "failed to load settings"

Image

*/
export const SETTING_NAME_DEFINITIONS = [
{ name: 'addon', valueType: 'optional-text', editor: 'addon' },
{ name: 'secureLabel', valueType: 'boolean' },
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this should ideally be optional-text with editor either text or placeholder

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I renamed placeholder to addon, since it was displaying only addon placeholders.
I'll use text editor, later we can check if needed.

Copy link
Contributor

@npeltier npeltier left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

one important thing @yesil (cc @afmicka) we need to publish index when publishing a setting or override

Copy link
Contributor

@npeltier npeltier left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

thx!

@yesil yesil added the run nala label Mar 9, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants