compose_box: Add start video call button in compose #1916

MritunjayTiwari14 · 2025-10-11T13:48:20Z

Chat thread:

Design (Outdated)

Before	After	After(Clicking Button)
	R

Light Theme

XRecorder_20251015_04.mp4

Dark Theme

XRecorder_20251015_05.mp4

gnprice · 2025-10-15T04:06:46Z

Thanks. It looks like you still have a TODO item before this is ready to be reviewed, so marking it as draft for now.

MritunjayTiwari14 · 2025-10-16T10:03:02Z

All the TODO are done @gnprice!

gnprice · 2025-10-17T00:40:32Z

Thanks. Before this can be reviewed, you'll need to revise it to have clear and coherent commits. See the instructions we discussed on a previous PR thread: #1830 (review)

MritunjayTiwari14 · 2025-10-18T06:20:26Z

Thanks @gnprice for suggesting the refinement in commit history to make sure it becomes minimal and coherent. The same has been implemented.

gnprice · 2025-10-20T23:06:53Z

Thanks. Some of these commits aren't coherent. For example this commit f314a74:

    deps: Update pigeon to `26.0.2` from `26.0.1`
    
    This commit is the result of the following commands:
        flutter pub upgrade --major-version pigeon
        tools/check --all-files --fix pigeon
    
    Changelog:
    
    https://pub.dev/packages/pigeon/changelog#2602
---
 .../kotlin/com/zulip/flutter/AndroidIntents.g.kt    | Bin 6118 -> 6118 bytes
 .../com/zulip/flutter/AndroidNotifications.g.kt     | Bin 30643 -> 30643 bytes
 ios/Runner/Notifications.g.swift                    |   2 +-
 3 files changed, 1 insertion(+), 1 deletion(-)

can't be right, because it says it involved flutter pub upgrade but there's no change to pubspec.lock.

One useful step for spotting this kind of issue is to run our tests at every commit. If they fail, the commit needs fixing.

It's straightforward to do that by hand. But a command which can be a useful shortcut for it is this:
git rebase --exec 'tools/check --diff @~'

MritunjayTiwari14 · 2025-11-08T05:44:04Z

Thank you @gnprice, the issue has been resolved in the latest commits. Ready for maintainer's review, PTAL @chrisbobbe.

chrisbobbe · 2025-11-10T19:06:48Z

the issue has been resolved

Could you update the screenshots to show this please?

MritunjayTiwari14 · 2025-11-11T06:29:54Z

Thank you @chrisbobbe for noticing, forgot to upload them. Here are the updated screenshots of the latest commit.

Screenshot Comparison

Before	After

Before	After

chrisbobbe

Thanks! Here's a review of the first three commits:

d90df43 icons: Add 'video', from the Figma
5898952 api: Add realmVideoChatProvider and jitsiServerUrl to InitialSnapshot
d5bbd96 realm: Add getters for jitsiServerUrl and realmVideoChatProvider

And a partial review of the fourth:

2ea8602 compose: Add video chat button to compose box

chrisbobbe · 2025-11-21T01:43:06Z

lib/api/model/initial_snapshot.dart

  /// Search for "realm_wildcard_mention_policy" in https://zulip.com/api/register-queue.
  final RealmWildcardMentionPolicy realmWildcardMentionPolicy;

+  final int realmVideoChatProvider;


Let's make an enum for this; see maybe CustomProfileFieldType for an example to follow.

Also please follow the comment at the top of InitialSnapshot:

// Keep these fields in the order they appear in the API docs. // (For many API types we choose a more logical order than the docs. // But this one is so long that that'd make it become impossible to // compare the lists by hand.)

chrisbobbe · 2025-11-21T01:49:58Z

lib/api/model/initial_snapshot.dart


  final Map<String, RealmDefaultExternalAccount> realmDefaultExternalAccounts;

+  final String? jitsiServerUrl;


From reading the doc, there are actually three related fields to handle:

jitsi_server_url

realm_jitsi_server_url

server_jitsi_server_url

Let's add realmVideoChatProvider in its own separate commit, but we can add these three related fields together.

chrisbobbe · 2025-11-21T01:52:31Z

assets/l10n/app_en.arb

+  "composeBoxAttachFromVideoCallTooltip": "Attach a video call",
+    "@composeBoxAttachFromVideoCallTooltip": {
+      "description": "Tooltip for compose box icon to attach a video call url to the message."
+    },


Looks like web says "Add video call". Let's follow that, for consistency.

Also this is misnamed; we're not "attaching from a video call". Let's call it composeBoxAddVideoCallTooltip.

Also please fix the indentation so it's consistent with other entries here.

chrisbobbe · 2025-11-21T01:57:32Z

assets/l10n/app_en.arb

+  "composeBoxUploadedVideoCallUrl": "Join video call.",
+      "@composeBoxUploadedVideoCallUrl": {
+        "description": "Placeholder in compose box showing the video call url is generated."
+      },


How about composeBoxVideoCallLinkText for the name, and for the description, "Text for a Markdown link to a video-call URL."

Also please fix the indentation.

chrisbobbe · 2025-12-02T20:48:26Z

CI is failing; please investigate, fix, and comment when this is ready for another review.

MritunjayTiwari14 · 2025-12-03T11:13:04Z

Thank you @chrisbobbe, i saw that and i am working on implementing the routes and function in such a way that it becomes easier to also handle Add Call button in the compose box. Will try to wrap it up soon.

MritunjayTiwari14 · 2025-12-12T15:10:45Z

Thank you @chrisbobbe for your patience, I have pushed a lot of new changes, PTAL!

Copilot

Pull request overview

This PR adds a video call button to the compose box that allows users to insert video call links into their messages. The implementation supports multiple video chat providers (Jitsi, Zoom, and BigBlueButton) based on realm configuration.

Key changes:

Adds a new video icon button to the compose box attachment toolbar
Implements video call URL generation for Jitsi (default), Zoom (with OAuth), and BigBlueButton providers
Adds event handling for Zoom token authentication flow

Reviewed changes

Copilot reviewed 14 out of 34 changed files in this pull request and generated 12 comments.

Show a summary per file

File	Description
lib/widgets/compose_box.dart	Core implementation including ComposeCall class and _AddComposeCallUrlButton widget with provider-specific logic
lib/widgets/icons.dart	Adds video icon constant
lib/model/store.dart	Adds hasZoomToken state management and HasZoomTokenEvent handling
lib/model/realm.dart	Adds video chat provider configuration fields
lib/api/route/video_call.dart	New API routes for creating Zoom and BigBlueButton calls
lib/api/model/model.dart	Adds RealmAvailableVideoChatProviders, VideoCallResponse, and RealmVideoChatProvider models
lib/api/model/events.dart	Adds HasZoomTokenEvent for OAuth flow
lib/api/model/initial_snapshot.dart	Adds video chat provider configuration fields to initial snapshot
lib/generated/l10n/*.dart	Adds localized strings for video/voice call tooltips and error messages
assets/l10n/app_en.arb	Source English localization strings
assets/icons/video.svg	Video icon SVG asset
assets/icons/ZulipIcons.ttf	Updated icon font with video icon
test/widgets/compose_box_test.dart	Basic test for Jitsi video call functionality
test/example_data.dart	Test fixtures for video chat provider configuration

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

lib/model/store.dart

lib/widgets/compose_box.dart

Copilot · 2025-12-12T15:16:02Z

lib/widgets/compose_box.dart

+    try {
+      final connection = store.connection;
+      final result = await createBigBlueButtonCall(
+        connection, meetingName: "Null", //TODO: Fetch message stream title


The meeting name is hardcoded to "Null" which is likely not the intended value. The TODO comment indicates this should be the stream title, but implementing this is important for BigBlueButton calls to have meaningful meeting names.

lib/widgets/compose_box.dart

Copilot · 2025-12-12T15:16:04Z

assets/l10n/app_en.arb

  "@errorCouldNotEditMessageTitle": {
    "description": "Error title when an exception prevented us from opening the compose box for editing a message."
  },
+  "errorCouldNotAppendCallUrl": "Fail to get call URL",


The error message has incorrect grammar. It should read "Failed to get call URL" instead of "Fail to get call URL".

Suggested change

"errorCouldNotAppendCallUrl": "Fail to get call URL",

"errorCouldNotAppendCallUrl": "Failed to get call URL",

lib/widgets/compose_box.dart

chrisbobbe

Thanks! Here's a review of the API/model changes:

1c07e3f icons: Add 'video', from the Figma
585d056 api: Add realmVideoChatProvider to InitialSnapshot
ac3c1c0 api: Add realmAvailableVideoChatProviders to InitialSnapshot
2bd7232 api: Add hasZoomToken to InitialSnapshot
3e8e1de api: Add jitsi server url configurations to InitialSnapshot
340df70 realm: Add getters for realmAvailableVideoChatProviders
9c46324 realm: Add getters for jitsiServerUrl and realmVideoChatProvider
37a9d94 store: Add getter for hasZoomToken
0671977 api: Add routes to fetch zoom and bigBlueButton call url
f35502a api: Add event hasZoomToken

leaving the last commit for a later round of review:

3827b62 compose_box: Add Add video call button

chrisbobbe · 2025-12-16T00:25:14Z

lib/api/model/model.dart

+/// For docs, search for "realm_video_chat_provider:"
+/// in <https://zulip.com/api/register-queue>.
+@JsonEnum(fieldRename: FieldRename.snake, valueField: "apiValue")
+enum RealmVideoChatProvider {


nit: It seems like this definition should go after both RealmEmojiItem and UserStatus. Can we define these "helper" definitions in the same order as their corresponding fields in InitialSnapshot?

Put RealmVideoChatProvider just after UserSettings since that was the only correlation that i was able to make from register-queue api docs since InitialSnapshot follow that api docs order.

chrisbobbe · 2025-12-16T00:32:06Z

lib/api/model/initial_snapshot.dart


  final String realmName;

+  final int realmVideoChatProvider;


api: Add realmVideoChatProvider to InitialSnapshot

Suggested change

final int realmVideoChatProvider;

final RealmVideoChatProvider realmVideoChatProvider;

(And rerun dart run build_runner build and edit test/example_data.dart)

chrisbobbe · 2025-12-16T00:38:25Z

lib/api/model/model.dart

+  jitsi(apiValue: 1),
+  zoomUser(apiValue: 3),
+  bigBlueButton(apiValue: 4),
+  zoomServer(apiValue: 5),


In some of these names, let's match the API documentation a bit more: jitsiMeet, zoomUserOAuth, zoomServerToServerOAuth.

chrisbobbe · 2025-12-16T00:40:38Z

lib/api/model/model.dart

+  factory RealmAvailableVideoChatProviders.fromJson(Map<String, dynamic> json) =>
+      _$RealmAvailableVideoChatProvidersFromJson(json);


nit: two-space indent

chrisbobbe · 2025-12-16T00:42:44Z

lib/api/model/initial_snapshot.dart


  final int realmVideoChatProvider;

+  final String? realmJitsiServerUrl;


nit:

Suggested change

final String? realmJitsiServerUrl;

final String? realmJitsiServerUrl; // TODO(server-8)

chrisbobbe · 2025-12-16T01:35:10Z

lib/api/route/video_call.dart

+  return connection.get('createBigBlueButtonCall', VideoCallResponse.fromJson,
+  '/calls/bigbluebutton/create', {'meeting_name': meetingName, 'voice_only': voiceOnly});


Suggested change

return connection.get('createBigBlueButtonCall', VideoCallResponse.fromJson,

'/calls/bigbluebutton/create', {'meeting_name': meetingName, 'voice_only': voiceOnly});

return connection.get(

'createBigBlueButtonCall', VideoCallResponse.fromJson, '/calls/bigbluebutton/create', {

'meeting_name': RawParameter(meetingName),

if (voiceOnly != null) 'voice_only': voiceOnly,

});

chrisbobbe · 2025-12-16T01:37:15Z

lib/api/route/video_call.dart

+/// GET /api/v1/calls/bigbluebutton/create
+Future<VideoCallResponse> createBigBlueButtonCall(ApiConnection connection, {
+  required String meetingName,
+  required bool voiceOnly,


The API doc says this isn't required; let's make it optional:

Suggested change

required bool voiceOnly,

bool? voiceOnly

chrisbobbe · 2025-12-16T01:42:25Z

lib/api/model/events.dart

      case 'presence': return PresenceEvent.fromJson(json);
      case 'reaction': return ReactionEvent.fromJson(json);
      case 'heartbeat': return HeartbeatEvent.fromJson(json);
+      case 'has_zoom_token': return HasZoomTokenEvent.fromJson(json);


Let's put this just after case 'user_settings':, I think; similarly to the ordering choices in RealmStore. (And reorder the HasZoomTokenEvent class definition correspondingly.)

chrisbobbe · 2025-12-16T01:43:14Z

lib/model/store.dart

+      case HasZoomTokenEvent():
+        assert(debugLog("server event: has_zoom_token"));


Let's put this just after the case UserSettingsUpdateEvent():.

chrisbobbe · 2025-12-16T01:44:31Z

lib/api/model/events.dart


+/// A Zulip event of type `hasZoomToken`: https://zulip.com/api/get-events#has_zoom_token
+@JsonSerializable(fieldRename: FieldRename.snake)
+class HasZoomTokenEvent extends Event {


Commit-message nit:

api: Add event `hasZoomToken`

The event is named HasZoomTokenEvent in our code; hasZoomToken isn't a name we use for the event.

Figma: https://www.figma.com/design/1JTNtYo9memgW7vV6d0ygq/Zulip-Mobile?node-id=3704-41538&t=udaDEYxIvoxfLwqQ-4

# Conflicts: # lib/api/model/initial_snapshot.g.dart # test/example_data.dart

…vider Rearranged `realmEnableReadReceipts` in proper order under class `RealmStoreImpl` which was out of order previously.

Fixes zulip#1824. Generation and Insertion of url is based on similar logic as used in web.

MritunjayTiwari14 · 2025-12-21T02:45:52Z

Thank you @chrisbobbe for the Review, have pushed some new changes as well as a reply to your comment in review #1824(comment). PTAL.

Edit: Some Changes were not pushed, i will push them as soon as possible.

MritunjayTiwari14 force-pushed the issue-1824 branch from 9f3ca6c to e6c9afb Compare October 12, 2025 10:51

MritunjayTiwari14 changed the title ~~compose: Add start video call button in compose~~ compose_box: Add start video call button in compose Oct 12, 2025

MritunjayTiwari14 marked this pull request as ready for review October 12, 2025 10:56

MritunjayTiwari14 force-pushed the issue-1824 branch 3 times, most recently from 5ab42a9 to b2bb501 Compare October 14, 2025 11:22

gnprice marked this pull request as draft October 15, 2025 04:06

MritunjayTiwari14 force-pushed the issue-1824 branch 10 times, most recently from 4cd6e12 to 576234b Compare October 16, 2025 09:42

MritunjayTiwari14 marked this pull request as ready for review October 16, 2025 10:02

MritunjayTiwari14 force-pushed the issue-1824 branch 7 times, most recently from e6835e8 to 8a417e9 Compare October 18, 2025 06:11

chrisbobbe reviewed Nov 21, 2025

View reviewed changes

MritunjayTiwari14 force-pushed the issue-1824 branch from 2ea8602 to 7d20119 Compare November 23, 2025 06:33

MritunjayTiwari14 force-pushed the issue-1824 branch from 7d20119 to c3d1581 Compare December 12, 2025 15:09

Copilot AI review requested due to automatic review settings December 12, 2025 15:09

MritunjayTiwari14 force-pushed the issue-1824 branch from c3d1581 to 82d2840 Compare December 12, 2025 15:09

Copilot started reviewing on behalf of MritunjayTiwari14 December 12, 2025 15:09 View session

MritunjayTiwari14 requested a review from chrisbobbe December 12, 2025 15:10

Copilot AI reviewed Dec 12, 2025

View reviewed changes

MritunjayTiwari14 force-pushed the issue-1824 branch from 82d2840 to 3827b62 Compare December 12, 2025 16:16

chrisbobbe reviewed Dec 16, 2025

View reviewed changes

MritunjayTiwari14 added 11 commits December 19, 2025 19:09

icons: Add 'video', from the Figma

0832ed4

Figma: https://www.figma.com/design/1JTNtYo9memgW7vV6d0ygq/Zulip-Mobile?node-id=3704-41538&t=udaDEYxIvoxfLwqQ-4

api: Add realmVideoChatProvider to InitialSnapshot

6a478c4

api: Add realmAvailableVideoChatProviders to InitialSnapshot

bcb152d

api: Add hasZoomToken to InitialSnapshot

6bafa8c

api: Add jitsi server url configurations to InitialSnapshot

b34d6fb

# Conflicts: # lib/api/model/initial_snapshot.g.dart # test/example_data.dart

realm: Add RealmStore.realmAvailableVideoChatProviders

db667ed

realm: Add realmStore.jitsiServerUrl and realmStore.realmVideoChatPro…

205a2d1

…vider Rearranged `realmEnableReadReceipts` in proper order under class `RealmStoreImpl` which was out of order previously.

store: Add getter for hasZoomToken

358f94f

api: Add routes to fetch zoom and bigBlueButton call url

6c43141

api: Add event HasZoomTokenEvent

ebc180a

compose_box: Add Add video call button

cf770f7

Fixes zulip#1824. Generation and Insertion of url is based on similar logic as used in web.

MritunjayTiwari14 force-pushed the issue-1824 branch from 3827b62 to cf770f7 Compare December 19, 2025 14:09

MritunjayTiwari14 requested a review from chrisbobbe December 21, 2025 02:46


		final Map<String, RealmDefaultExternalAccount> realmDefaultExternalAccounts;

		final String? jitsiServerUrl;

	"errorCouldNotAppendCallUrl": "Fail to get call URL",
	"errorCouldNotAppendCallUrl": "Failed to get call URL",

	final int realmVideoChatProvider;
	final RealmVideoChatProvider realmVideoChatProvider;

		factory RealmAvailableVideoChatProviders.fromJson(Map<String, dynamic> json) =>
		_$RealmAvailableVideoChatProvidersFromJson(json);


		final int realmVideoChatProvider;

		final String? realmJitsiServerUrl;

	final String? realmJitsiServerUrl;
	final String? realmJitsiServerUrl; // TODO(server-8)

		return connection.get('createBigBlueButtonCall', VideoCallResponse.fromJson,
		'/calls/bigbluebutton/create', {'meeting_name': meetingName, 'voice_only': voiceOnly});

		case HasZoomTokenEvent():
		assert(debugLog("server event: has_zoom_token"));

compose_box: Add start video call button in compose #1916

Are you sure you want to change the base?

compose_box: Add start video call button in compose #1916

Conversation

MritunjayTiwari14 commented Oct 11, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Design (Outdated)

Light Theme

Dark Theme

Uh oh!

gnprice commented Oct 15, 2025

Uh oh!

MritunjayTiwari14 commented Oct 16, 2025

Uh oh!

gnprice commented Oct 17, 2025

Uh oh!

MritunjayTiwari14 commented Oct 18, 2025

Uh oh!

gnprice commented Oct 20, 2025

Uh oh!

MritunjayTiwari14 commented Nov 8, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

chrisbobbe commented Nov 10, 2025

Uh oh!

MritunjayTiwari14 commented Nov 11, 2025

Uh oh!

chrisbobbe left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

chrisbobbe commented Dec 2, 2025

Uh oh!

MritunjayTiwari14 commented Dec 3, 2025

Uh oh!

MritunjayTiwari14 commented Dec 12, 2025

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Uh oh!

Copilot AI Dec 12, 2025

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI Dec 12, 2025

Choose a reason for hiding this comment

Uh oh!

Uh oh!

chrisbobbe left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

MritunjayTiwari14 commented Oct 11, 2025 •

edited

Loading

MritunjayTiwari14 commented Nov 8, 2025 •

edited

Loading

MritunjayTiwari14 commented Dec 21, 2025 •

edited

Loading