Added blood sugar to DM progress tab (#5498)

**Story card:** [sc-14227]
(https://app.shortcut.com/simpledotorg/story/14227/patient-treatment-status)

## Because

Added Blood sugar section in the DM Progress Tab

## This addresses

This section should display the blood sugar status on the bar graph with
the months.

 1) **For IN,ET,BD**
 
<img width="1512" alt="IN,ET,BD"
src="https://github.com/user-attachments/assets/9edd5a2f-3846-4e1c-8e66-c624ebbe71b4">


2) **For SL**

<img width="1512" alt="SL"
src="https://github.com/user-attachments/assets/b14021d4-2855-45c7-84b8-cb4e78ef1b72">

## Test instructions
Enable this flipper flag :diabetes_progress_report_tab to check the
functionality.

app/components/progress_tab/diabetes/blood_sugar200_to299_component.html.erb

@@ -0,0 +1,49 @@
+<div class="p-16px bgc-white">
+  <h2 class="mb-32px mr-8px p-0px ta-left fw-medium fs-18px c-black pe-none">
+    <%= @uncontrolled_threshold_title %>
+  </h2>
+  <div class="p-relative d-flex ai-center mb-8px" data-element-type="header">
+    <div class="d-flex ai-center" data-element-type="header-title">
+      <h2 class="m-0px mr-8px p-0px ta-left fw-bold fs-14px c-black pe-none">
+        <%= @uncontrolled_threshold_short %>
+      </h2>
+      <div class="d-flex ai-center w-16px h-16px pe-none" data-element-type="help-circle">
+        <%= inline_file("help-circle.svg") %>
+      </div>
+    </div>
+    <div
+      class="o-0 pe-none p-absolute l-0 zi-100 d-flex fd-column w-100 bs-tooltip ttf-ease-in-out td-0_25s tp-opacity" 
+      data-element-type="tooltip"
+    >
+      <div class="p-8px bgc-black br-4px">
+        <p class="m-0px mb-4px p-0px ta-left fw-regular fs-14px lh-150 c-white">
+          <span class="fw-bold">Numerator:</span> <%= @numerator_text %>
+        </p>
+        <p class="m-0px p-0px ta-left fw-regular fs-14px lh-150 c-white">
+          <span class="fw-bold">Denominator:</span> <%= @denominator_text %>
+        </p>
+      </div>
+      <div
+        class="p-absolute b--8px w-0px h-0px br-8px-transparent bl-8px-transparent bt-8px-black"
+        data-element-type="tip"
+      >
+      </div>
+    </div>
+  </div>
+  <p class="m-0px mb-24px p-0px ta-left fw-normal fs-16px lh-150 c-grey-dark">
+    <%= @subtitle_text %>
+  </p>
+  <%= render partial: "api/v3/analytics/user_analytics/data_bar_graph",
+             locals: {
+               data: {
+                 "numerators" => uncontrolled.values.last(6),
+                 "denominators" => adjusted_patients.values.last(6),
+                 "rates" => uncontrolled_rates.values.last(6),
+                 "period_info" => period_info.values.last(6)
+               },
+               data_type: "percentage",
+               graph_css_color: "bgc-yellow",
+               show_tooltip: true,
+               threshold: @uncontrolled_threshold_bar }
+  %>
+</div>

app/components/progress_tab/diabetes/blood_sugar200_to299_component.rb

@@ -0,0 +1,53 @@
+class ProgressTab::Diabetes::BloodSugar200To299Component < ApplicationComponent
+  include AssetsHelper
+  include FlipperHelper
+
+  attr_reader :uncontrolled_rates, :uncontrolled, :adjusted_patients, :period_info, :region
+
+  def initialize(uncontrolled_rates:, uncontrolled:, adjusted_patients:, period_info:, region:, use_who_standard: nil)
+    @uncontrolled_rates = uncontrolled_rates
+    @uncontrolled = uncontrolled
+    @adjusted_patients = adjusted_patients
+    @period_info = period_info
+    @region = region
+    @use_who_standard = resolve_use_who_standard(use_who_standard)
+
+    set_locale_values
+  end
+
+  private
+
+  def set_locale_values
+    if @use_who_standard
+      @uncontrolled_threshold_title = t("bs_over_200_copy.reports_card_title_dm_fbs")
+      @uncontrolled_threshold_long = t("bs_over_200_copy.bs_200_to_299.numerator_dm_fbs")
+      @uncontrolled_threshold_short = t("bs_over_200_copy.bs_200_to_299.title_dm_fbs")
+      @uncontrolled_threshold_bar = t("bs_over_200_copy.bs_200_to_299.title_dm_fbs")
+      @subtitle_text = t(
+        "bs_over_200_copy.bs_200_to_299.reports_card_subtitle_fbs",
+        region_name: @region.name,
+        diagnosis: "Diabetes",
+        controlled_threshold: @uncontrolled_threshold_long
+      )
+      @numerator_text = t("bs_over_200_copy.bs_200_to_299.numerator_dm_fbs")
+    else
+      @uncontrolled_threshold_title = t("bs_over_200_copy.reports_card_title_dm")
+      @uncontrolled_threshold_long = t("bs_over_200_copy.bs_200_to_299.numerator_dm")
+      @uncontrolled_threshold_short = t("bs_over_200_copy.bs_200_to_299.title")
+      @uncontrolled_threshold_bar = t("bs_over_200_copy.bs_200_to_299.title_dm")
+      @subtitle_text = t(
+        "bs_over_200_copy.bs_200_to_299.reports_card_subtitle",
+        region_name: @region.name,
+        diagnosis: "Diabetes",
+        controlled_threshold: @uncontrolled_threshold_long
+      )
+      @numerator_text = t("bs_over_200_copy.bs_200_to_299.numerator")
+    end
+
+    @denominator_text = t(
+      "progress_tab.diagnosis_report.patient_treatment_outcomes.controlled_card.help_tooltip.denominator",
+      facility_name: @region.name,
+      diagnosis: "Diabetes"
+    )
+  end
+end

app/components/progress_tab/diabetes/blood_sugar300_and_above_component.html.erb

@@ -0,0 +1,46 @@
+<div class="p-16px bgc-white">
+  <div class="p-relative d-flex ai-center mb-8px" data-element-type="header">
+    <div class="d-flex ai-center" data-element-type="header-title">
+      <h2 class="m-0px mr-8px p-0px ta-left fw-bold fs-14px c-black pe-none">
+        <%= @uncontrolled_threshold_short %>
+      </h2>
+      <div class="d-flex ai-center w-16px h-16px pe-none" data-element-type="help-circle">
+        <%= inline_file("help-circle.svg") %>
+      </div>
+    </div>
+    <div
+      class="o-0 pe-none p-absolute l-0 zi-100 d-flex fd-column w-100 bs-tooltip ttf-ease-in-out td-0_25s tp-opacity" 
+      data-element-type="tooltip"
+    >
+      <div class="p-8px bgc-black br-4px">
+        <p class="m-0px mb-4px p-0px ta-left fw-regular fs-14px lh-150 c-white">
+          <span class="fw-bold">Numerator:</span> <%= @numerator_text %>
+        </p>
+        <p class="m-0px p-0px ta-left fw-regular fs-14px lh-150 c-white">
+          <span class="fw-bold">Denominator:</span> <%= @denominator_text %>
+        </p>
+      </div>
+      <div
+        class="p-absolute b--8px w-0px h-0px br-8px-transparent bl-8px-transparent bt-8px-black"
+        data-element-type="tip"
+      >
+      </div>
+    </div>
+  </div>
+  <p class="m-0px mb-24px p-0px ta-left fw-normal fs-16px lh-150 c-grey-dark">
+    <%= @subtitle_text %>
+  </p>
+  <%= render partial: "api/v3/analytics/user_analytics/data_bar_graph",
+             locals: {
+               data: {
+                 "numerators" => uncontrolled.values.last(6),
+                 "denominators" => adjusted_patients.values.last(6),
+                 "rates" => uncontrolled_rates.values.last(6),
+                 "period_info" => period_info.values.last(6)
+               },
+               data_type: "percentage",
+               graph_css_color: "bgc-yellow-dark-new",
+               show_tooltip: true,
+               threshold: @uncontrolled_threshold_bar }
+  %>
+</div>

app/components/progress_tab/diabetes/blood_sugar300_and_above_component.rb

@@ -0,0 +1,53 @@
+# frozen_string_literal: true
+
+class ProgressTab::Diabetes::BloodSugar300AndAboveComponent < ApplicationComponent
+  include AssetsHelper
+  include FlipperHelper
+
+  attr_reader :uncontrolled_rates, :uncontrolled, :adjusted_patients, :period_info, :region
+
+  def initialize(uncontrolled_rates:, uncontrolled:, adjusted_patients:, period_info:, region:, use_who_standard: nil)
+    @uncontrolled_rates = uncontrolled_rates
+    @uncontrolled = uncontrolled
+    @adjusted_patients = adjusted_patients
+    @period_info = period_info
+    @region = region
+    @use_who_standard = resolve_use_who_standard(use_who_standard)
+
+    set_locale_values
+  end
+
+  private
+
+  def set_locale_values
+    if @use_who_standard
+      @uncontrolled_threshold_long = t("bs_over_200_copy.bs_over_300.numerator_dm_fbs")
+      @uncontrolled_threshold_short = t("bs_over_200_copy.bs_over_300.title_dm_fbs")
+      @uncontrolled_threshold_bar = t("bs_over_200_copy.bs_over_300.title_dm_fbs")
+      @subtitle_text = t(
+        "bs_over_200_copy.bs_over_300.reports_card_subtitle_fbs",
+        region_name: @region.name,
+        diagnosis: "Diabetes",
+        controlled_threshold: @uncontrolled_threshold_long
+      )
+      @numerator_text = t("bs_over_200_copy.bs_over_300.numerator_dm_fbs")
+    else
+      @uncontrolled_threshold_long = t("bs_over_200_copy.bs_over_300.numerator_dm")
+      @uncontrolled_threshold_short = t("bs_over_200_copy.bs_over_300.title")
+      @uncontrolled_threshold_bar = t("bs_over_200_copy.bs_over_300.report_card_lower_bar")
+      @subtitle_text = t(
+        "bs_over_200_copy.bs_over_300.reports_card_subtitle",
+        region_name: @region.name,
+        diagnosis: "Diabetes",
+        controlled_threshold: @uncontrolled_threshold_long
+      )
+      @numerator_text = t("bs_over_200_copy.bs_over_300.numerator")
+    end
+
+    @denominator_text = t(
+      "progress_tab.diagnosis_report.patient_treatment_outcomes.controlled_card.help_tooltip.denominator",
+      facility_name: @region.name,
+      diagnosis: "Diabetes"
+    )
+  end
+end

app/components/progress_tab/diabetes/control_component.html.erb

@@ -0,0 +1,47 @@
+<div class="mb-8px p-16px bgc-white bs-card">
+  <div class="p-relative d-flex ai-center mb-8px" data-element-type="header">
+    <div class="d-flex ai-center" data-element-type="header-title">
+      <h2 class="m-0px mr-8px p-0px ta-left fw-medium fs-18px c-black pe-none">
+        <%= @controlled_threshold_short %>
+      </h2>
+      <div class="d-flex ai-center w-16px h-16px pe-none" data-element-type="help-circle">
+        <%= inline_file("help-circle.svg") %>
+      </div>
+    </div>
+    <div
+      class="o-0 pe-none p-absolute l-0 zi-100 d-flex fd-column w-100 bs-tooltip ttf-ease-in-out td-0_25s tp-opacity"
+      data-element-type="tooltip"
+    >
+      <div class="p-8px bgc-black br-4px">
+        <p class="m-0px mb-4px p-0px ta-left fw-regular fs-14px lh-150 c-white">
+          <span class="fw-bold">Numerator:</span> <%= @numerator_text %>
+        </p>
+        <p class="m-0px p-0px ta-left fw-regular fs-14px lh-150 c-white">
+          <span class="fw-bold">Denominator:</span> <%= @denominator_text %>
+        </p>
+      </div>
+      <div
+        class="p-absolute b--8px w-0px h-0px br-8px-transparent bl-8px-transparent bt-8px-black"
+        data-element-type="tip"
+      >
+      </div>
+    </div>
+  </div>
+  <p class="m-0px mb-24px p-0px ta-left fw-normal fs-16px lh-150 c-grey-dark">
+    <%= @subtitle_text %>
+  </p>
+
+  <%= render partial: "api/v3/analytics/user_analytics/data_bar_graph",
+             locals: {
+               data: {
+                 "numerators" => controlled.values.last(6),
+                 "denominators" => adjusted_patients.values.last(6),
+                 "rates" => control_rates.values.last(6),
+                 "period_info" => period_info.values.last(6)
+               },
+               data_type: "percentage",
+               graph_css_color: "bgc-green-dark-new",
+               show_tooltip: true,
+               threshold: @controlled_threshold_bar }
+  %>
+</div>

app/components/progress_tab/diabetes/control_component.rb

@@ -0,0 +1,51 @@
+class ProgressTab::Diabetes::ControlComponent < ApplicationComponent
+  include AssetsHelper
+  include FlipperHelper
+
+  attr_reader :control_rates, :controlled, :adjusted_patients, :period_info, :region
+
+  def initialize(controlled_rates:, controlled:, adjusted_patients:, period_info:, region:, use_who_standard: nil)
+    @control_rates = controlled_rates
+    @controlled = controlled
+    @adjusted_patients = adjusted_patients
+    @period_info = period_info
+    @region = region
+    @use_who_standard = resolve_use_who_standard(use_who_standard)
+
+    set_locale_values
+  end
+
+  private
+
+  def set_locale_values
+    if @use_who_standard
+      @controlled_threshold_long = t("bs_below_200_copy.numerator_fbs")
+      @controlled_threshold_short = t("bs_below_200_copy.reports_card_title_dm_fbs")
+      @controlled_threshold_bar = t("bs_below_200_copy.report_card_lower_bar_fbs")
+      @subtitle_text = t(
+        "bs_below_200_copy.reports_card_subtitle_dm_fbs",
+        region_name: @region.name,
+        diagnosis: "Diabetes",
+        controlled_threshold: @controlled_threshold_long
+      )
+      @numerator_text = t("bs_below_200_copy.numerator_dm_fbs")
+    else
+      @controlled_threshold_long = t("bs_below_200_copy.numerator")
+      @controlled_threshold_short = t("bs_below_200_copy.reports_card_title_dm")
+      @controlled_threshold_bar = t("bs_below_200_copy.report_card_lower_bar")
+      @subtitle_text = t(
+        "bs_below_200_copy.reports_card_subtitle_dm",
+        region_name: @region.name,
+        diagnosis: "Diabetes",
+        controlled_threshold: @controlled_threshold_long
+      )
+      @numerator_text = t("bs_below_200_copy.numerator_dm")
+    end
+
+    @denominator_text = t(
+      "progress_tab.diagnosis_report.patient_treatment_outcomes.controlled_card.help_tooltip.denominator",
+      facility_name: @region.name,
+      diagnosis: "Diabetes"
+    )
+  end
+end

app/components/progress_tab/diabetes/diagnosis_report_component.html.erb

@@ -37,6 +37,32 @@
     region: diabetes_reports_data[:region],
     diagnosis: "Diabetes"
   )) %>
+  <div class="mt-48px mb-16px pr-16px pl-16px">
+    <h3 class="m-0px p-0px ta-left fw-bold fs-20px c-grey-dark">
+      <%= t("progress_tab.diagnosis_report.patient_treatment_outcomes.section_title") %>
+    </h3>
+  </div>
+  <%= render(ProgressTab::Diabetes::ControlComponent.new(
+    controlled_rates: diabetes_reports_data[:controlled_rates],
+    controlled: diabetes_reports_data[:controlled],
+    adjusted_patients: diabetes_reports_data[:adjusted_patients],
+    period_info: diabetes_reports_data[:period_info],
+    region: diabetes_reports_data[:region]
+  )) %>
+  <%= render(ProgressTab::Diabetes::BloodSugar200To299Component.new(
+    uncontrolled_rates: diabetes_reports_data[:uncontrolled_rates_bs_200_to_300],
+    uncontrolled: diabetes_reports_data[:uncontrolled_bs_200_to_300],
+    adjusted_patients: diabetes_reports_data[:adjusted_patients],
+    period_info: diabetes_reports_data[:period_info],
+    region: diabetes_reports_data[:region]
+  )) %>
+  <%= render(ProgressTab::Diabetes::BloodSugar300AndAboveComponent.new(
+    uncontrolled_rates: diabetes_reports_data[:uncontrolled_rates_bs_300_and_above],
+    uncontrolled: diabetes_reports_data[:uncontrolled_bs_300_and_above],
+    adjusted_patients: diabetes_reports_data[:adjusted_patients],
+    period_info: diabetes_reports_data[:period_info],
+    region: diabetes_reports_data[:region]
+  )) %>
   <%= render(ProgressTab::Diabetes::MissedVisitsComponent.new(
     missed_visits_rates: diabetes_reports_data[:missed_visits_rates],
     missed_visits: diabetes_reports_data[:missed_visits],

app/helpers/flipper_helper.rb

@@ -0,0 +1,5 @@
+module FlipperHelper
+  def resolve_use_who_standard(use_who_standard)
+    use_who_standard.nil? ? Flipper.enabled?(:diabetes_who_standard_indicator) : use_who_standard
+  end
+end

app/services/reports/facility_progress_service.rb

@@ -70,6 +70,12 @@ def total_counts
       Reports::Repository.new(facility, periods: @range)
     end
 
+    memoize def repository_presenter
+      @use_who_standard = Flipper.enabled?(:diabetes_who_standard_indicator)
+      presenter = Reports::RepositoryPresenter.create(facility, period: @period, use_who_standard: @use_who_standard)
+      presenter.call(facility.region)
+    end
+
     def hypertension_reports_data
       {
         monthly_follow_ups: repository.hypertension_follow_ups[@region.slug],
@@ -97,7 +103,14 @@ def diabetes_reports_data
         missed_visits_rates: repository.diabetes_missed_visits_rates[@region.slug],
         missed_visits: repository.diabetes_missed_visits[@region.slug],
         adjusted_patients: repository.adjusted_diabetes_patients[@region.slug],
-        region: @region
+        controlled: repository_presenter[:bs_below_200_patients],
+        controlled_rates: repository_presenter[:bs_below_200_rates],
+        uncontrolled_bs_200_to_300: repository_presenter[:bs_200_to_300_patients],
+        uncontrolled_rates_bs_200_to_300: repository_presenter[:bs_200_to_300_rates],
+        uncontrolled_bs_300_and_above: repository_presenter[:bs_over_300_patients],
+        uncontrolled_rates_bs_300_and_above: repository_presenter[:bs_over_300_rates],
+        region: @region,
+        current_user: @current_user
       }
     end