fix: rename useWindowVisibility to useDocumentVisibility

Signed-off-by: Maksim Sukharev <[email protected]>

src/App.vue

@@ -38,10 +38,10 @@ import RightSidebar from './components/RightSidebar/RightSidebar.vue'
 import SettingsDialog from './components/SettingsDialog/SettingsDialog.vue'
 
 import { useActiveSession } from './composables/useActiveSession.js'
+import { useDocumentVisibility } from './composables/useDocumentVisibility.ts'
 import { useHashCheck } from './composables/useHashCheck.js'
 import { useIsInCall } from './composables/useIsInCall.js'
 import { useSessionIssueHandler } from './composables/useSessionIssueHandler.js'
-import { useWindowVisibility } from './composables/useWindowVisibility.ts'
 import { CONVERSATION, PARTICIPANT } from './constants.js'
 import Router from './router/router.js'
 import BrowserStorage from './services/BrowserStorage.js'
@@ -72,7 +72,7 @@ export default {
 			isLeavingAfterSessionIssue: useSessionIssueHandler(),
 			isMobile: useIsMobile(),
 			isNextcloudTalkHashDirty: useHashCheck(),
-			isWindowVisible: useWindowVisibility(),
+			isDocumentVisible: useDocumentVisibility(),
 			supportSessionState: useActiveSession(),
 			federationStore: useFederationStore(),
 		}
@@ -188,7 +188,7 @@ export default {
 
 	watch: {
 		atLeastOneLastMessageIdChanged() {
-			if (this.isWindowVisible) {
+			if (this.isDocumentVisible) {
 				return
 			}
 
@@ -221,7 +221,7 @@ export default {
 			}
 		},
 
-		isWindowVisible(value) {
+		isDocumentVisible(value) {
 			if (value) {
 				// Remove the potential "*" marker for unread chat messages
 				let title = this.getConversationName(this.token)

src/components/MessagesList/MessagesList.vue

@@ -76,8 +76,8 @@ import MessagesSystemGroup from './MessagesGroup/MessagesSystemGroup.vue'
 import LoadingPlaceholder from '../UIShared/LoadingPlaceholder.vue'
 import TransitionWrapper from '../UIShared/TransitionWrapper.vue'
 
+import { useDocumentVisibility } from '../../composables/useDocumentVisibility.ts'
 import { useIsInCall } from '../../composables/useIsInCall.js'
-import { useWindowVisibility } from '../../composables/useWindowVisibility.ts'
 import { ATTENDEE, CHAT, CONVERSATION } from '../../constants.js'
 import { EventBus } from '../../services/EventBus.js'
 import { useChatExtrasStore } from '../../stores/chatExtras.js'
@@ -124,8 +124,8 @@ export default {
 	emits: ['update:is-chat-scrolled-to-bottom'],
 
 	setup(props) {
-		const isWindowVisible = useWindowVisibility()
-		const isChatVisible = computed(() => isWindowVisible.value && props.isVisible)
+		const isDocumentVisible = useDocumentVisibility()
+		const isChatVisible = computed(() => isDocumentVisible.value && props.isVisible)
 		return {
 			isInCall: useIsInCall(),
 			chatExtrasStore: useChatExtrasStore(),

src/components/TopBar/CallTime.vue

@@ -67,7 +67,7 @@ import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
 import NcLoadingIcon from '@nextcloud/vue/dist/Components/NcLoadingIcon.js'
 import NcPopover from '@nextcloud/vue/dist/Components/NcPopover.js'
 
-import { useWindowVisibility } from '../../composables/useWindowVisibility.ts'
+import { useDocumentVisibility } from '../../composables/useDocumentVisibility.ts'
 import { CALL } from '../../constants.js'
 import { formattedTime } from '../../utils/formattedTime.ts'
 
@@ -96,7 +96,7 @@ export default {
 
 	setup() {
 		return {
-			isWindowVisible: useWindowVisibility(),
+			isDocumentVisible: useDocumentVisibility(),
 		}
 	},
 
@@ -205,7 +205,7 @@ export default {
 			this.isCallDurationHintShown = true
 
 			// close the popover after 10 seconds
-			if (this.isWindowVisible) {
+			if (this.isDocumentVisible) {
 				setTimeout(() => {
 					this.showPopover = false
 				}, 10000)

src/composables/useActiveSession.js

@@ -5,9 +5,9 @@
 
 import { computed, onBeforeMount, onBeforeUnmount, ref, watch } from 'vue'
 
+import { useDocumentVisibility } from './useDocumentVisibility.ts'
 import { useIsInCall } from './useIsInCall.js'
 import { useStore } from './useStore.js'
-import { useWindowVisibility } from './useWindowVisibility.ts'
 import { SESSION } from '../constants.js'
 import { hasTalkFeature } from '../services/CapabilitiesManager.ts'
 import { setSessionState } from '../services/participantsService.js'
@@ -32,7 +32,7 @@ export function useActiveSession() {
 	}
 
 	const isInCall = useIsInCall()
-	const isWindowVisible = useWindowVisibility()
+	const isDocumentVisible = useDocumentVisibility()
 
 	const inactiveTimer = ref(null)
 	const currentState = ref(SESSION.STATE.ACTIVE)
@@ -42,7 +42,7 @@ export function useActiveSession() {
 		currentState.value = SESSION.STATE.ACTIVE
 	})
 
-	watch(isWindowVisible, (value) => {
+	watch(isDocumentVisible, (value) => {
 		// Change state if tab is hidden or minimized
 		if (value) {
 			setSessionAsActive()

src/composables/useWindowVisibility.ts → src/composables/useDocumentVisibility.ts

@@ -11,26 +11,26 @@ import type { Ref, DeepReadonly } from 'vue'
  * Composable to check whether the page is visible.
  * @return {DeepReadonly<Ref<boolean>>} - computed boolean whether the page is visible
  */
-function useWindowVisibilityComposable() {
-	const isWindowVisible = ref<boolean>(!document.hidden)
+function useDocumentVisibilityComposable() {
+	const isDocumentVisible = ref<boolean>(!document.hidden)
 
-	const changeWindowVisibility = () => {
-		isWindowVisible.value = !document.hidden
+	const changeIsDocumentVisible = () => {
+		isDocumentVisible.value = !document.hidden
 	}
 
 	onBeforeMount(() => {
-		document.addEventListener('visibilitychange', changeWindowVisibility)
+		document.addEventListener('visibilitychange', changeIsDocumentVisible)
 	})
 
 	onBeforeUnmount(() => {
-		document.removeEventListener('visibilitychange', changeWindowVisibility)
+		document.removeEventListener('visibilitychange', changeIsDocumentVisible)
 	})
 
-	return readonly(isWindowVisible)
+	return readonly(isDocumentVisible)
 }
 
 /**
  * Shared composable to check whether the page is visible.
  * @return {DeepReadonly<Ref<boolean>>} - computed boolean whether the page is visible
  */
-export const useWindowVisibility = createSharedComposable(useWindowVisibilityComposable)
+export const useDocumentVisibility = createSharedComposable(useDocumentVisibilityComposable)

src/composables/useGetParticipants.js

@@ -7,9 +7,9 @@ import { ref, nextTick, computed, watch, onBeforeUnmount, onMounted } from 'vue'
 
 import { subscribe, unsubscribe } from '@nextcloud/event-bus'
 
+import { useDocumentVisibility } from './useDocumentVisibility.ts'
 import { useIsInCall } from './useIsInCall.js'
 import { useStore } from './useStore.js'
-import { useWindowVisibility } from './useWindowVisibility.ts'
 import { CONVERSATION } from '../constants.js'
 import { EventBus } from '../services/EventBus.js'
 
@@ -24,7 +24,7 @@ export function useGetParticipants(isActive = ref(true), isTopBar = true) {
 	const token = computed(() => store.getters.getToken())
 	const conversation = computed(() => store.getters.conversation(token.value))
 	const isInCall = useIsInCall()
-	const isWindowVisible = useWindowVisibility()
+	const isDocumentVisible = useDocumentVisibility()
 	const isOneToOneConversation = computed(() => conversation.value?.type === CONVERSATION.TYPE.ONE_TO_ONE
 		|| conversation.value?.type === CONVERSATION.TYPE.ONE_TO_ONE_FORMER)
 	let fetchingParticipants = false
@@ -69,7 +69,7 @@ export function useGetParticipants(isActive = ref(true), isTopBar = true) {
 			return
 		}
 
-		if (isWindowVisible.value && (isInCall.value || !conversation.value?.hasCall)) {
+		if (isDocumentVisible.value && (isInCall.value || !conversation.value?.hasCall)) {
 			debounceFastUpdateParticipants()
 		} else {
 			debounceSlowUpdateParticipants()