@tencentcloud/roomkit-web-vue3/es/core/store/room.mjs

<h1 align="center"> TUIRoomKit</h1> Conference (TUIRoomKit) is a product suitable for multi-person audio and video conversation scenarios such as business meetings, webinars, and online education. By integrating this product, you can add room management,

import { ref, computed, reactive } from "vue";
import { TUIVideoStreamType } from "@tencentcloud/tuiroom-engine-js";
import { RoomState } from "../type/Room.mjs";
import { del, set } from "../../utils/vue.mjs";
import { getNewStreamInfo } from "./utils/stream.mjs";
import { getUserListSortComparator, getNewUserInfo } from "./utils/user.mjs";
const roomState = ref(RoomState.Idle);
const roomId = ref("");
const roomInfo = ref();
const userInfoObj = ref({});
const streamInfoObj = ref({});
const localUserId = ref("");
const userSearchText = ref("");
const seatApplicationRequestList = ref([]);
const seatInvitationRequest = ref(null);
const localUser = computed(
  () => userInfoObj.value[localUserId.value]
);
const localStream = computed(
  () => streamInfoObj.value[`${localUserId.value}_${TUIVideoStreamType.kCameraStream}`]
);
const userList = computed(() => {
  return [...Object.values(userInfoObj.value)].sort(
    getUserListSortComparator({ localUserId: localUserId.value })
  );
});
const onSeatUserList = computed(() => {
  return userList.value.filter((item) => item.isOnSeat);
});
const remoteUserList = computed(() => {
  return [...Object.values(userInfoObj.value)].filter(
    (item) => item.userId !== localUserId.value
  );
});
const applyToOnSeatUserList = computed(() => {
  const applyToOnSeatUserIdList = seatApplicationRequestList.value.map(
    (item) => item.userId
  );
  return applyToOnSeatUserIdList.map((userId) => userInfoObj.value[userId]).sort((item1, item2) => item1.timestamp - item2.timestamp);
});
function setRoomInfo(data) {
  var _a;
  const newRoomInfo = { ...roomInfo.value, ...data };
  roomInfo.value = newRoomInfo;
  if ((_a = roomInfo.value) == null ? void 0 : _a.roomId) {
    roomId.value = roomInfo.value.roomId;
  }
}
function setLocalUser(options) {
  localUserId.value = options.userId;
}
function addUserInfo(userInfo) {
  const { userId } = userInfo;
  if (!userId) {
    return;
  }
  let newUserInfo;
  if (userInfoObj.value[userId]) {
    newUserInfo = Object.assign(userInfoObj.value[userId], userInfo);
  } else {
    newUserInfo = Object.assign(getNewUserInfo(userId), userInfo);
  }
  newUserInfo.displayName = getDisplayName(newUserInfo);
  userInfoObj.value[userId] = newUserInfo;
}
function updateUserInfo(userInfo) {
  if (!userInfo.userId) {
    return;
  }
  const newUserInfo = Object.assign(
    userInfoObj.value[userInfo.userId],
    userInfo
  );
  newUserInfo.displayName = getDisplayName(newUserInfo);
  userInfoObj.value[userInfo.userId] = newUserInfo;
}
function removeUserInfo(userId) {
  if (!userId || userId === localUserId.value) {
    return;
  }
  if (userInfoObj.value[userId]) {
    delete userInfoObj.value[userId];
  }
}
function getUserInfo(options) {
  return userInfoObj.value[options.userId];
}
function getRecordStreamType(streamType) {
  if (streamType === TUIVideoStreamType.kCameraStreamLow) {
    return TUIVideoStreamType.kCameraStream;
  }
  return streamType;
}
function addStreamInfo(userId, streamType) {
  const recordStreamType = getRecordStreamType(streamType);
  if (streamInfoObj.value[`${userId}_${recordStreamType}`]) {
    return;
  }
  const newStreamInfo = getNewStreamInfo(userId, recordStreamType);
  set(streamInfoObj.value, `${userId}_${recordStreamType}`, newStreamInfo);
}
function updateStreamInfo(streamInfo) {
  const { userId, streamType } = streamInfo;
  const recordStreamType = getRecordStreamType(streamType);
  if (!streamInfoObj.value[`${userId}_${recordStreamType}`]) {
    return;
  }
  if (streamType !== recordStreamType) {
    Object.assign(streamInfo, { streamType: recordStreamType });
  }
  set(
    streamInfoObj.value,
    `${userId}_${recordStreamType}`,
    Object.assign(
      streamInfoObj.value[`${userId}_${recordStreamType}`],
      streamInfo
    )
  );
}
function removeStreamInfo(userId, streamType) {
  const recordStreamType = getRecordStreamType(streamType);
  if (streamInfoObj.value[`${userId}_${recordStreamType}`]) {
    del(streamInfoObj.value, `${userId}_${recordStreamType}`);
  }
}
function addSeatApplicationRequest(request) {
  seatApplicationRequestList.value.push(request);
}
function removeSeatApplicationRequest(request) {
  seatApplicationRequestList.value = seatApplicationRequestList.value.filter(
    (item) => item.requestAction !== request.requestAction
  );
}
function setSeatInvitationRequest(request) {
  seatInvitationRequest.value = request;
}
function getDisplayName(options) {
  const { nameCard, userName, userId } = options;
  return nameCard || userName || userId;
}
function reset() {
  roomId.value = "";
  roomState.value = RoomState.Idle;
  roomInfo.value = void 0;
  userInfoObj.value = {};
  streamInfoObj.value = {};
}
const store = reactive({
  roomId,
  roomState,
  roomInfo,
  setRoomInfo,
  userInfoObj,
  userList,
  localUser,
  remoteUserList,
  streamInfoObj,
  localStream,
  onSeatUserList,
  applyToOnSeatUserList,
  userSearchText,
  seatApplicationRequestList,
  seatInvitationRequest,
  setLocalUser,
  addUserInfo,
  updateUserInfo,
  getUserInfo,
  removeUserInfo,
  addStreamInfo,
  updateStreamInfo,
  removeStreamInfo,
  reset,
  addSeatApplicationRequest,
  removeSeatApplicationRequest,
  setSeatInvitationRequest
});
function useStore(options) {
  return {
    store,
    roomId,
    roomState,
    roomInfo,
    userInfoObj,
    userList,
    localUser,
    remoteUserList,
    streamInfoObj,
    localStream,
    onSeatUserList,
    applyToOnSeatUserList,
    userSearchText,
    seatApplicationRequestList,
    seatInvitationRequest
  };
}
export {
  addUserInfo,
  useStore as default,
  setLocalUser,
  setRoomInfo,
  updateUserInfo
};