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