const DMContainer = styled.div` background-color: #0e0e10; width: 317px; `; return ( <DMContainer> <Widget src={`${props.componentOwnerId}/widget/Calimero.Curb.SideSelector.DirectMessagesDropdown`} props={{ onChange: props.onChange, open: props.open, title: "Direct Messages", }} /> {props.open && ( <Widget src={`${props.componentOwnerId}/widget/Calimero.Curb.SideSelector.UserList`} props={{ componentOwnerId: props.componentOwnerId, users: props.userList, onSelectDM: props.onSelectDM, selectedDM: props.selectedDM, }} /> )} </DMContainer> );