score:2

Accepted answer 
const Number = ({ number }) => {
  let segments = [];

  switch (number) {
    case "1":
      segments = ["b", "c"];
      break;
    case "2":
      segments = ["a", "b", "d", "e", "g"];
      break;
    case "3":
      segments = ["a", "b", "c", "d", "g"];
      break;
    case "4":
      segments = ["b", "c", "f", "g"];
      break;
    case "5":
      segments = ["a", "c", "d", "f", "g"];
      break;
    case "6":
      segments = ["a", "c", "d", "f", "e", "g"];
      break;
    case "7":
      segments = ["a", "b", "c"];
      break;
    case "8":
      segments = ["a", "b", "c", "d", "e", "f", "g"];
      break;
    case "9":
      segments = ["a", "b", "c", "d", "f", "g"];
      break;
    case "0":
      segments = ["a", "b", "c", "d", "e", "f"];
      break;
    default:
      segments = ["a", "b", "c", "d", "e", "f"];
  }

  return (
    <div className="container">
      {segments.map((segment) => (
        <div key={segment} className={`segment segment-${segment}`}></div>
      ))}
    </div>
  );
};

export default Number;

score:2 

const Numbers = ({ singleNumber }) => {
  const switchDisabled = (element) => {
    const allSegments = ['a', 'b', 'c', 'd', 'e', 'f', 'g'];
    let disabledSegments = [];

    switch (element) {
      case 2:
        disabledSegments.push("c");
        disabledSegments.push("f");
        break;
      case 6:
        disabledSegments.push("b");
        break;
      default:
        break;
    }
  };

  return (
    <div className="container">
      {allSegments.forEach(segmentLetter => {
        const disabledClass = disabledSegments.includes(segmentLetter) ? 'segment-disabled' : '';

        return (
          <div className={`segment segment-${segmentLetter} ${disabledClass}`} />
        )
      })}
    </div>
  );
};

Related Query

More Query from same tag