ui: display subscription status based on prime state (#35502)

display subscription status based on PrimeState

selfdrive/ui/layouts/home.py

@@ -4,7 +4,7 @@ from collections.abc import Callable
 from enum import IntEnum
 from openpilot.common.params import Params
 from openpilot.selfdrive.ui.widgets.offroad_alerts import UpdateAlert, OffroadAlert
-from openpilot.selfdrive.ui.widgets.prime import PrimeAdWidget
+from openpilot.selfdrive.ui.widgets.prime import PrimeWidget
 from openpilot.system.ui.lib.text_measure import measure_text_cached
 from openpilot.system.ui.lib.label import gui_label
 from openpilot.system.ui.lib.application import gui_app, FontWeight, DEFAULT_TEXT_COLOR, Widget
@@ -48,7 +48,7 @@ class HomeLayout(Widget):
     self.update_notif_rect = rl.Rectangle(0, 0, 200, HEADER_HEIGHT - 10)
     self.alert_notif_rect = rl.Rectangle(0, 0, 220, HEADER_HEIGHT - 10)
 
-    self._prime_ad_widget = PrimeAdWidget()
+    self._prime_ad_widget = PrimeWidget()
 
     self._setup_callbacks()
 
@@ -173,7 +173,6 @@ class HomeLayout(Widget):
     self.offroad_alert.render(self.content_rect)
 
   def _render_left_column(self):
-    rl.draw_rectangle_rounded(self.left_column_rect, 0.02, 10, PRIME_BG_COLOR)
     self._prime_ad_widget.render(self.left_column_rect)
 
   def _render_right_column(self):

selfdrive/ui/widgets/prime.py

@@ -1,17 +1,31 @@
 import pyray as rl
+
+from openpilot.selfdrive.ui.ui_state import ui_state
 from openpilot.system.ui.lib.application import gui_app, Widget, FontWeight
 from openpilot.system.ui.lib.label import gui_label
 from openpilot.system.ui.lib.wrap_text import wrap_text
 from openpilot.system.ui.lib.text_measure import measure_text_cached
 
 
-class PrimeAdWidget(Widget):
-  """Advertisement widget for non-Prime users."""
+class PrimeWidget(Widget):
+  """Widget for displaying comma prime subscription status"""
+
+  PRIME_BG_COLOR = rl.Color(51, 51, 51, 255)
 
   def __init__(self):
     super().__init__()
 
   def _render(self, rect):
+    if ui_state.prime_state.is_prime():
+      self._render_for_prime_user(rect)
+    else:
+      self._render_for_non_prime_users(rect)
+
+  def _render_for_non_prime_users(self, rect: rl.Rectangle):
+    """Renders the advertisement for non-Prime users."""
+
+    rl.draw_rectangle_rounded(rect, 0.02, 10, self.PRIME_BG_COLOR)
+
     # Layout
     x, y = rect.x + 80, rect.y + 90
     w = rect.width - 160
@@ -22,7 +36,7 @@ class PrimeAdWidget(Widget):
     # Description with wrapping
     desc_y = y + 140
     font = gui_app.font(FontWeight.LIGHT)
-    wrapped_text = "\n".join(wrap_text(font, "Become a comma prime member at connect.comma.ai", 56, w))
+    wrapped_text = "\n".join(wrap_text(font, "Become a comma prime member at connect.comma.ai", 56, int(w)))
     text_size = measure_text_cached(font, wrapped_text, 56)
     rl.draw_text_ex(font, wrapped_text, rl.Vector2(x, desc_y), 56, 0, rl.Color(255, 255, 255, 255))
 
@@ -36,3 +50,15 @@ class PrimeAdWidget(Widget):
       item_y = features_y + 80 + i * 65
       gui_label(rl.Rectangle(x, item_y, 50, 60), "✓", 50, color=rl.Color(70, 91, 234, 255))
       gui_label(rl.Rectangle(x + 60, item_y, w - 60, 60), feature, 50)
+
+  def _render_for_prime_user(self, rect: rl.Rectangle):
+    """Renders the prime user widget with subscription status."""
+
+    rl.draw_rectangle_rounded(rl.Rectangle(rect.x, rect.y, rect.width, 230), 0.02, 10, self.PRIME_BG_COLOR)
+
+    x = rect.x + 56
+    y = rect.y + 40
+
+    font = gui_app.font(FontWeight.BOLD)
+    rl.draw_text_ex(font, "✓ SUBSCRIBED", rl.Vector2(x, y), 41, 0, rl.Color(134, 255, 78, 255))
+    rl.draw_text_ex(font, "comma prime", rl.Vector2(x, y + 61), 75, 0, rl.WHITE)