Configure an avatar component for Work scheduler

Use the Container component to add an avatar and the user name of the work item assignee.

Before you begin

Role required: admin, workspace_admin, or ui_builder_admin​

Procedure

1. In the Content section, navigate to Body(Flex) > Card Base Container (Flex) > Card Base Header.

2. Right-click Card Base Header and select Add component after.

3. In the pop-up screen, select the Label value stacked component.

4. In the left pane, right-click Label value stacked and select Add component after.

5. Configure the component.

   1. In the Components pop-up screen, select Container.

   2. In the Config tab, do the following:

      1. Select the Edit component visibility icon (

    2.  Hover over the **Hide component** field and select the Dynamic data binding icon

    3.  In the **Hide component** field, enter `!@state.cardProps.assignedTo`
    4.  In the **Direction** menu, select **Row**.
    5.  In the **Styles** tab, in the **Align items** field, select the center icon.
    6.  Select **Save**.

1. To add the Avatar component, select Container(Flex) > +Add component.

2. Select +Add component

   The Components pop-up screen appears.

Here's a demo on how to configure an avatar component for Work scheduler

Parent Topic:Create a Work scheduler card using the Next Experience UI Builder