Fluent Commerce Logo
Docs
Sign In

Mutation Action in the Page Component

Essential knowledge

Authors:

Matt Salmon, Christopher Tse

Changed on:

8 Feb 2024

Overview

Further explanation of how the mutation action renders on a UI within a Fluent web app when configured in the Page Component

Key points

  • How the mutation action will be render in the UI
  • How custom attributes are handled and can be edited alongside their limitations
No alt provided
  • Dynamic Dropdown for Attribute 'Type':
    • The UI offers a dropdown menu for selecting the attribute "type".
    • Predefined types available: NUMBER, STRING, BOOLEAN, JSON, and CUSTOM.
    • Only one type can be selected at a time.
  • Dynamic UI Component for 'Value':
    • The input component for 'value' dynamically changes based on the chosen attribute 'type'.
    • Non-compatible entries will be rejected. For instance, non-number values for the NUMBER type will not be accepted.
  • Enhanced Editing Mode:
    • When editing, the attribute's "name" becomes non-editable, but "type" and "value" can be modified.
    • Existing attributes with types not matching the predefined ENUM will be listed under the CUSTOM type.
  • Custom Type Flexibility:
    • If "CUSTOM" is chosen, an additional input field (sub-type) appears, allowing users to specify their attribute type.
    • Values under the CUSTOM type are stored as text by default.
  • Backward Compatibility with Graphql API:
    • Attributes created via API that don't match predefined types will be recognized in the UI under the CUSTOM type, with their respective value ready to be overridden

Matt Salmon

Matt Salmon

Contributors:
Christopher Tse

Copyright © 2024 Fluent Retail Pty Ltd (trading as Fluent Commerce). All rights reserved. No materials on this docs.fluentcommerce.com site may be used in any way and/or for any purpose without prior written authorisation from Fluent Commerce. Current customers and partners shall use these materials strictly in accordance with the terms and conditions of their written agreements with Fluent Commerce or its affiliates.

Fluent Logo