Cohort Line Charts

<CohortLineChart height={400} data={cohortData} />

    /**
     * Determines the color based on the minimum value of each cohort line.
     * @param {number} minValue - The minimum value of each cohort line.
     * @returns {string} - The theme color corresponding to the range in which minValue falls.
     */
    const valueToColor = (minValue: number) => {
      if (minValue > 0.6) {
        return getThemeColor('gray', { variant: 700 });
      }
      if (minValue > 0.5) {
        return getThemeColor('gray', { variant: 500 });
      }
      if (minValue > 0.4) {
        return getThemeColor('gray', { variant: 400 });
      }
      if (minValue > 0.35) {
        return getThemeColor('gray', { variant: 300 });
      }
      return getThemeColor('gray', { variant: 200 });
    };