'optimize style condition for better pattern

hi I want to change my CSS condition in JSX from this condition:

   style={{
          background:
            (input.categoryName[0] === "A" ? "#FF6F33" : null) ||
            (input.categoryName[0] === "B" ? "#2C828f" : null) ||
            (input.categoryName[0] === "C" ? "#C048EE" : null) ||
            (input.categoryName[0] === "E" ? "#01D584" : null) ||
            (input.categoryName[0] === "F" ? "#FF47BE" : null) ||
            (input.categoryName[0] === "G" ? "#F96693" : null) ||
            (input.categoryName[0] === "H" ? "#549EF0" : null) ||
            (input.categoryName[0] === "I" ? "#FEA544" : null),
        }}

to something like this :

  (input.categoryName[0] === "A" ? "#FF6F33" :
                         === "B" ? "#2C828f" : 
                         === "C" ? "#C048EE" :
                         === "E" ? "#01D584" :
                         === "F" ? "#FF47BE" :
                         === "G" ? "#F96693" :
                         === "H" ? "#549EF0" :
                         === "I" ? "#FEA544" : null),

any suggestion?

cssjsx


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source

Related Questions