Skip to content

Commit

Permalink
refactor: make browserCheck an util
Browse files Browse the repository at this point in the history
- There is no need to be a mixin, it has nothing Vue-related or reactive
- Move to utils
- Refactor computed and Vue component methods to exported constants and functions

Signed-off-by: Grigorii K. Shartsev <me@shgk.me>
  • Loading branch information
ShGKme authored and SystemKeeper committed Dec 6, 2023
1 parent 5fe750e commit 1b5a579
Show file tree
Hide file tree
Showing 7 changed files with 112 additions and 153 deletions.
6 changes: 2 additions & 4 deletions src/App.vue
Original file line number Diff line number Diff line change
Expand Up @@ -56,14 +56,14 @@ import SettingsDialog from './components/SettingsDialog/SettingsDialog.vue'

import { useIsInCall } from './composables/useIsInCall.js'
import { CONVERSATION, PARTICIPANT } from './constants.js'
import browserCheck from './mixins/browserCheck.js'
import participant from './mixins/participant.js'
import sessionIssueHandler from './mixins/sessionIssueHandler.js'
import talkHashCheck from './mixins/talkHashCheck.js'
import Router from './router/router.js'
import BrowserStorage from './services/BrowserStorage.js'
import { EventBus } from './services/EventBus.js'
import { leaveConversationSync } from './services/participantsService.js'
import { checkBrowser } from './utils/browserCheck.js'
import { signalingKill } from './utils/webrtc/index.js'

// Styles
Expand All @@ -83,7 +83,6 @@ export default {
},

mixins: [
browserCheck,
talkHashCheck,
sessionIssueHandler,
participant,
Expand Down Expand Up @@ -462,8 +461,7 @@ export default {

async mounted() {
if (!IS_DESKTOP) {
// see browserCheck mixin
this.checkBrowser()
checkBrowser()
}
// Check sidebar status in previous sessions
if (BrowserStorage.getItem('sidebarOpen') === 'false') {
Expand Down
6 changes: 2 additions & 4 deletions src/FilesSidebarTabApp.vue
Original file line number Diff line number Diff line change
Expand Up @@ -52,13 +52,13 @@ import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'

import LoadingComponent from './components/LoadingComponent.vue'

import browserCheck from './mixins/browserCheck.js'
import sessionIssueHandler from './mixins/sessionIssueHandler.js'
import { EventBus } from './services/EventBus.js'
import { getFileConversation } from './services/filesIntegrationServices.js'
import {
leaveConversationSync,
} from './services/participantsService.js'
import { checkBrowser } from './utils/browserCheck.js'
import CancelableRequest from './utils/cancelableRequest.js'
import { signalingKill } from './utils/webrtc/index.js'

Expand All @@ -80,7 +80,6 @@ export default {
},

mixins: [
browserCheck,
sessionIssueHandler,
],

Expand Down Expand Up @@ -174,8 +173,7 @@ export default {

methods: {
async joinConversation() {
// see browserCheck mixin
this.checkBrowser()
checkBrowser()

try {
await this.getFileConversation()
Expand Down
9 changes: 2 additions & 7 deletions src/PublicShareAuthRequestPasswordButton.vue
Original file line number Diff line number Diff line change
Expand Up @@ -41,8 +41,8 @@
<script>
import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'

import browserCheck from './mixins/browserCheck.js'
import { getPublicShareAuthConversationToken } from './services/publicShareAuthService.js'
import { checkBrowser } from './utils/browserCheck.js'

// Styles
import '@nextcloud/dialogs/dist/index.css'
Expand All @@ -55,10 +55,6 @@ export default {
NcButton,
},

mixins: [
browserCheck,
],

props: {
shareToken: {
type: String,
Expand Down Expand Up @@ -92,8 +88,7 @@ export default {

methods: {
async requestPassword() {
// see browserCheck mixin
this.checkBrowser()
checkBrowser()

this.hasRequestFailed = false
this.isRequestLoading = true
Expand Down
6 changes: 2 additions & 4 deletions src/PublicShareSidebar.vue
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,6 @@ import TopBar from './components/TopBar/TopBar.vue'
import TransitionWrapper from './components/TransitionWrapper.vue'

import { useIsInCall } from './composables/useIsInCall.js'
import browserCheck from './mixins/browserCheck.js'
import participant from './mixins/participant.js'
import sessionIssueHandler from './mixins/sessionIssueHandler.js'
import talkHashCheck from './mixins/talkHashCheck.js'
Expand All @@ -77,6 +76,7 @@ import { getPublicShareConversationData } from './services/filesIntegrationServi
import {
leaveConversationSync,
} from './services/participantsService.js'
import { checkBrowser } from './utils/browserCheck.js'
import { signalingKill } from './utils/webrtc/index.js'

// Styles
Expand All @@ -98,7 +98,6 @@ export default {
},

mixins: [
browserCheck,
sessionIssueHandler,
participant,
talkHashCheck,
Expand Down Expand Up @@ -162,8 +161,7 @@ export default {
methods: {

async joinConversation() {
// see browserCheck mixin
this.checkBrowser()
checkBrowser()

this.joiningConversation = true

Expand Down
13 changes: 11 additions & 2 deletions src/components/TopBar/CallButton.vue
Original file line number Diff line number Diff line change
Expand Up @@ -96,11 +96,11 @@ import Tooltip from '@nextcloud/vue/dist/Directives/Tooltip.js'

import { useIsInCall } from '../../composables/useIsInCall.js'
import { CALL, CONVERSATION, PARTICIPANT } from '../../constants.js'
import browserCheck from '../../mixins/browserCheck.js'
import isInLobby from '../../mixins/isInLobby.js'
import participant from '../../mixins/participant.js'
import BrowserStorage from '../../services/BrowserStorage.js'
import { EventBus } from '../../services/EventBus.js'
import { blockCalls, unsupportedWarning } from '../../utils/browserCheck.js'

export default {
name: 'CallButton',
Expand All @@ -120,7 +120,6 @@ export default {
},

mixins: [
browserCheck,
isInLobby,
participant,
],
Expand Down Expand Up @@ -270,6 +269,16 @@ export default {
isBreakoutRoom() {
return this.conversation.objectType === 'room'
},

callButtonTooltipText() {
if (blockCalls) {
return unsupportedWarning
} else {
// Passing a falsy value into the content of the tooltip
// is the only way to disable it conditionally.
return false
}
},
},

mounted() {
Expand Down
132 changes: 0 additions & 132 deletions src/mixins/browserCheck.js

This file was deleted.

93 changes: 93 additions & 0 deletions src/utils/browserCheck.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,93 @@
/**
* @copyright Copyright (c) 2019 Marco Ambrosini <marcoambrosini@icloud.com>
*
* @author Marco Ambrosini <marcoambrosini@icloud.com>
* @author Grigorii K. Shartsev <me@shgk.me>
*
* @license AGPL-3.0-or-later
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as
* published by the Free Software Foundation, either version 3 of the
* License, or (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*
*/

import UAParser from 'ua-parser-js'

import { showError, TOAST_PERMANENT_TIMEOUT } from '@nextcloud/dialogs'
import { translate as t } from '@nextcloud/l10n'

const parser = new UAParser()
const browser = parser.getBrowser()

const getBrowserVersion = () => {
if (browser.version) {
return browser.version
}

if (browser.name === 'Safari') {
// Workaround for https://github.com/faisalman/ua-parser-js/issues/599
const match = parser.getUA().match(' Version/([0-9.,]+) ')
if (match) {
return match[1]
}
}

return undefined
}

export const isFirefox = browser.name === 'Firefox'
export const isChrome = browser.name === 'Chrome' || browser.name === 'Chromium'
export const isOpera = browser.name === 'Opera'
export const isSafari = browser.name === 'Safari' || browser.name === 'Mobile Safari'
export const isEdge = browser.name === 'Edge'
export const isBrave = browser.name === 'Brave'
export const isIE = browser.name === 'IE' || browser.name === 'IEMobile'
export const isYandex = browser.name === 'Yandex'

export const browserVersion = getBrowserVersion()
export const majorVersion = browserVersion ? parseInt(browserVersion.split('.')[0], 10) : 0

/**
* Is the browser fully supported by Talk
*/
export const isFullySupported = (isFirefox && majorVersion >= 52)
|| (isChrome && majorVersion >= 49)
|| (isOpera && majorVersion >= 72)
|| (isSafari && majorVersion >= 12)
|| isEdge
|| isBrave
|| isYandex

/**
* Are calls should be blocked due to browser incompatibility
*/
export const blockCalls = (isFirefox && majorVersion < 52)
|| (isChrome && majorVersion < 49)
|| (isOpera && majorVersion < 72)
|| (isSafari && majorVersion < 12)
|| isIE

/**
* Reusable error message for unsupported browsers
*/
export const unsupportedWarning = t('spreed', "The browser you're using is not fully supported by Nextcloud Talk. Please use the latest version of Mozilla Firefox, Microsoft Edge, Google Chrome, Opera or Apple Safari.")

/**
* Show an error toast if the browser is not fully supported
*/
export function checkBrowser() {
console.info('Detected browser ' + browser.name + ' ' + majorVersion + ' (' + browserVersion + ')')
if (!isFullySupported) {
showError(unsupportedWarning, { timeout: TOAST_PERMANENT_TIMEOUT })
}
}

0 comments on commit 1b5a579

Please sign in to comment.