How to add gallery view in video sdk ui toolkit in zoom call

Hii @tommy, @chunsiong.zoom

how to add gallery view zoom call. new version added but not showing gallery view please check my code and suggest me changes.

const connectAndPost = async (rmNumber) => {
const dataConference = {
sessionName: “Room123”,
role: 1,
};
try {
const res = await axios.post(
http://192..00.00:4000,
JSON.stringify(dataConference),
{
headers: {
“Content-Type”: “application/json”,
},
}
);
console.log(res.data);
setVideoSDKJWT(res.data.signature);
} catch (error) {
console.log(“Error connecting and posting:”, error);
}
};

useEffect(() => {
connectAndPost();
const meetingConfig = {
sessionName: “Room123”,
userName: “TestUser”,
sessionPasscode: “”,
features: [“video”, “audio”, “share”, “chat”, “users”, “settings”],
videoSDKJWT: videoSDKJWT,
advancedTelemetry: true,
};

const sessionContainer = document.getElementById("session");

if (
  sessionContainer &&
  uitoolkit &&
  meetingConfig &&
  meetingConfig?.videoSDKJWT
) {
  uitoolkit.joinSession(sessionContainer, meetingConfig);
  uitoolkit.onSessionClosed(hanldeClose);
  uitoolkit.onSessionJoined(hanldeJoin);

  return () => {
    uitoolkit.offSessionClosed(hanldeClose);
    uitoolkit.offSessionJoined(hanldeJoin);
    uitoolkit.closeSession(sessionContainer);
  };
}

}, [roomNumber, videoSDKJWT]);

const hanldeClose = () => {
console.log(“close session”);
navigate(“/”);
};

const hanldeJoin = () => {
console.log(“join Session”);
};

Hi @mukund if you update to the latest version of the UI ToolKit, you’ll see the four square button in the bottom toolbar you can click on it to select gallery view. No code change is required.

Here’s a screenshot using v1.10.8-1:

1 Like

Hii,

@ekaansh.zoom thanks.

Make sure to enable SharedArrayBuffer:

A non SharedArrayBuffer option will come in the next release.

Best,
Tommy

@tommy Thanks, for this information I add this and solve all my issue in zoom call.

1 Like

Great to hear @mukund !