From c653737d86ba87b1cb02f563faef763b334b78ee Mon Sep 17 00:00:00 2001
From: Mboya Michael <42235564+mboyamike@users.noreply.github.com>
Date: Sun, 1 Mar 2026 19:47:20 +0300
Subject: [PATCH 1/2] Refactor recording option to use PartialCallStateBuilder

This makes the call recording option button be more consistent with the other buttons.
It also has the benefit of making it reactive to changes in state of recording
---
 .../controls/toggle_recording_option.dart     | 36 ++++++++++---------
 1 file changed, 19 insertions(+), 17 deletions(-)

diff --git a/packages/stream_video_flutter/lib/src/call_controls/controls/toggle_recording_option.dart b/packages/stream_video_flutter/lib/src/call_controls/controls/toggle_recording_option.dart
index 63aa5b7d1..58cf69f2a 100644
--- a/packages/stream_video_flutter/lib/src/call_controls/controls/toggle_recording_option.dart
+++ b/packages/stream_video_flutter/lib/src/call_controls/controls/toggle_recording_option.dart
@@ -40,23 +40,25 @@ class ToggleRecordingOption extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    final enabled = call.state.value.isRecording;
-
-    return CallControlOption(
-      icon: enabled ? Icon(enabledRecordingIcon) : Icon(disabledRecordingIcon),
-      iconColor: enabled
-          ? enabledRecordingIconColor
-          : disabledRecordingIconColor,
-      backgroundColor: enabled
-          ? enabledRecordingBackgroundColor
-          : disabledRecordingBackgroundColor,
-      onPressed: () {
-        if (!enabled) {
-          call.startRecording();
-        } else {
-          call.stopRecording();
-        }
-      },
+    return PartialCallStateBuilder<bool>(
+      call: call,
+      selector: (state) => state.isRecording,
+      builder: (_, enabled) => CallControlOption(
+        icon: enabled ? Icon(enabledRecordingIcon) : Icon(disabledRecordingIcon),
+        iconColor: enabled
+            ? enabledRecordingIconColor
+            : disabledRecordingIconColor,
+        backgroundColor: enabled
+            ? enabledRecordingBackgroundColor
+            : disabledRecordingBackgroundColor,
+        onPressed: () {
+          if (!enabled) {
+            call.startRecording();
+          } else {
+            call.stopRecording();
+          }
+        },
+      ),
     );
   }
 }

From 4b92cd21f73fd1af21eae1c4ba3c227c30115c33 Mon Sep 17 00:00:00 2001
From: Mboya Michael <42235564+mboyamike@users.noreply.github.com>
Date: Sun, 1 Mar 2026 19:49:20 +0300
Subject: [PATCH 2/2] Refactor closed captions option to use
 PartialCallStateBuilder

This makes the closed captions option button consisted with the other control options, as well as making it more reactive to the call state
---
 .../toggle_closed_captions_option.dart        | 40 ++++++++++---------
 1 file changed, 21 insertions(+), 19 deletions(-)

diff --git a/packages/stream_video_flutter/lib/src/call_controls/controls/toggle_closed_captions_option.dart b/packages/stream_video_flutter/lib/src/call_controls/controls/toggle_closed_captions_option.dart
index 19e8539ee..2dd21d1e6 100644
--- a/packages/stream_video_flutter/lib/src/call_controls/controls/toggle_closed_captions_option.dart
+++ b/packages/stream_video_flutter/lib/src/call_controls/controls/toggle_closed_captions_option.dart
@@ -40,25 +40,27 @@ class ToggleClosedCaptionsOption extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    final enabled = call.state.value.isCaptioning;
-
-    return CallControlOption(
-      icon: enabled
-          ? Icon(enabledClosedCaptionIcon)
-          : Icon(disabledClosedCaptionIcon),
-      iconColor: enabled
-          ? enabledClosedCaptionIconColor
-          : disabledClosedCaptionIconColor,
-      backgroundColor: enabled
-          ? enabledClosedCaptionBackgroundColor
-          : disabledClosedCaptionBackgroundColor,
-      onPressed: () {
-        if (!enabled) {
-          call.startClosedCaptions();
-        } else {
-          call.stopClosedCaptions();
-        }
-      },
+    return PartialCallStateBuilder<bool>(
+      call: call,
+      selector: (state) => state.isCaptioning,
+      builder: (_, enabled) => CallControlOption(
+        icon: enabled
+            ? Icon(enabledClosedCaptionIcon)
+            : Icon(disabledClosedCaptionIcon),
+        iconColor: enabled
+            ? enabledClosedCaptionIconColor
+            : disabledClosedCaptionIconColor,
+        backgroundColor: enabled
+            ? enabledClosedCaptionBackgroundColor
+            : disabledClosedCaptionBackgroundColor,
+        onPressed: () {
+          if (!enabled) {
+            call.startClosedCaptions();
+          } else {
+            call.stopClosedCaptions();
+          }
+        },
+      ),
     );
   }
 }