DEV Community

Discussion on: The 10 Component Commandments

View post

Replies for: Thank you @selbekk for the thorough "10 component commandments". What are some of your favorite tips for creating cool components? I am not su...

Collapse
 
ianesparrago profile image
Ean Esparrago •

It's the short-circuit operator. I think it's neat.

background-color: ${p =>
      (p.attendanceStatus === "in" && p.theme.color.primary.main) ||
      (p.attendanceStatus === "out" && p.theme.color.out) ||
      (p.attendanceStatus === "later" && p.theme.color.warning) ||
      (p.attendanceStatus === "late" && p.theme.color.error) ||
      (p.attendanceStatus === "absent" && p.theme.color.absent) ||
      (p.attendanceStatus === "off" && p.theme.color.grey.medium)};