Fluent Commerce Logo
Docs

Profile Modal Component

UI Component

Changed on:

1 Oct 2025

Overview

The Profile Modal is a custom UI component that confirms profile actions to make sure changes are applied intentionally.
No alt text provided
Plugin NameCore
The standard library of mystique components. 
0000-00-00

v1.0.0

Initial changelog entry.

Alias

fc.sourcing.profile.modal.button

Detailed technical description

The Profile Modal is a confirmation component designed to ensure that profile-related actions are carried out deliberately and transparently. It is used to confirm the activation of a profile version, where the selected version becomes active and the previously active version is inactivated.The component is implemented as an action button on the profile details page.

Properties

NameTypeRequiredDefaultDescription
action`activate`Yes NoneDetermines the operation to confirm. 
label`string`Yes NoneText that is displayed on the button that opens the modal.
title`string`Yes NoneThe modal's header text. It should clearly state the purpose of the confirmation.
description`string`No NoneOptional text shown in the modal under the title. The action or its consequences can be explained here. If omitted, no body text is displayed.
style`Primary | Secondary`No`Primary`Defines the visual type of the drawer button.

Configuration example

1{
2  "actions": {
3    "primary": [
4      {
5        "type": "component",
6        "component": "fc.page.section",
7        "descendants": [
8          {
9            "component": "fc.conditional",
10            "props": {
11              "value": "{{sourcingProfile.status}}",
12              "matches": [
13                "DRAFT",
14                "INACTIVE"
15              ]
16            },
17            "descendants": [
18              {
19                "component": "fc.sourcing.profile.modal.button",
20                "props": {
21                  "action": "activate",
22                  "label": "i18n:fc.sourcingProfileModalButton.activate.label",
23                  "title": "i18n:fc.sourcingProfileModalButton.activate.title",
24                  "description": "i18n:fc.sourcingProfileModalButton.activate.description"
25                }
26              }
27            ]
28          }
29        ]
30      }
31    ]
32  }
33}

Version History

2025-10-06

v25.10.6

Initial release

Recommended Placement

This component is implemented specifically to be used during Sourcing Profile activation.