init

react/features/old-client-notification/components/OldElectronAPPNotificationDescription.tsx

@@ -0,0 +1,37 @@
+import React, { Component } from 'react';
+import { WithTranslation } from 'react-i18next';
+
+import { translate } from '../../base/i18n/functions';
+
+/**
+ * A component that renders the description of the notification for old Jitsi Meet Electron clients.
+ *
+ * @augments AbstractApp
+ */
+export class OldElectronAPPNotificationDescription extends Component<WithTranslation> {
+    /**
+     * Implements React's {@link Component#render()}.
+     *
+     * @inheritdoc
+     * @returns {ReactElement}
+     */
+    override render() {
+        const { t } = this.props;
+
+        return (
+            <div>
+                { t('notify.oldElectronClientDescription1') }
+                <a
+                    href = 'https://github.com/jitsi/jitsi-meet-electron/releases/latest'
+                    rel = 'noopener noreferrer'
+                    target = '_blank'>
+                    { t('notify.oldElectronClientDescription2') }
+                </a>
+                { t('notify.oldElectronClientDescription3') }
+            </div>
+        );
+    }
+
+}
+
+export default translate(OldElectronAPPNotificationDescription);

react/features/old-client-notification/functions.ts

@@ -0,0 +1,27 @@
+import { browser } from '../base/lib-jitsi-meet';
+
+/**
+ * Returns true if Jitsi Meet is running in too old jitsi-meet-electron app and false otherwise.
+ *
+ * @returns {boolean} - True if Jitsi Meet is running in too old jitsi-meet-electron app and false otherwise.
+ */
+export function isOldJitsiMeetElectronApp() {
+    if (!browser.isElectron()) {
+        return false;
+    }
+
+    // @ts-ignore
+    const match = navigator.userAgent.match(/(JitsiMeet)\s*\/\s*((\d+)\.[^\s]*)/);
+
+    if (!Array.isArray(match) || match.length < 3) {
+        return false;
+    }
+
+    const majorVersion = Number(match[3]);
+
+    if (isNaN(majorVersion) || majorVersion >= 2022) {
+        return false;
+    }
+
+    return true;
+}

react/features/old-client-notification/middleware.tsx

@@ -0,0 +1,41 @@
+import React from 'react';
+import { AnyAction } from 'redux';
+
+import { IStore } from '../app/types';
+import { APP_WILL_MOUNT } from '../base/app/actionTypes';
+import MiddlewareRegistry from '../base/redux/MiddlewareRegistry';
+import { showErrorNotification } from '../notifications/actions';
+
+import OldElectronAPPNotificationDescription from './components/OldElectronAPPNotificationDescription';
+import { isOldJitsiMeetElectronApp } from './functions';
+
+MiddlewareRegistry.register(store => next => action => {
+    switch (action.type) {
+    case APP_WILL_MOUNT:
+        return _appWillMount(store, next, action);
+    }
+
+    return next(action);
+});
+
+/**
+ * Notifies the feature that the action {@link APP_WILL_MOUNT} has being dispatched.
+ *
+ * @param {Store} store - The redux store in which the specified {@code action} is being dispatched.
+ * @param {Dispatch} next - The redux {@code dispatch} function to dispatch the specified {@code action}.
+ * @param {Action} action - The redux action {@code APP_WILL_MOUNT} which is being dispatched.
+ * @private
+ * @returns {Object} The new state that is the result of the reduction of the specified {@code action}.
+ */
+function _appWillMount(store: IStore, next: Function, action: AnyAction) {
+    if (isOldJitsiMeetElectronApp()) {
+        const { dispatch } = store;
+
+        dispatch(showErrorNotification({
+            titleKey: 'notify.OldElectronAPPTitle',
+            description: <OldElectronAPPNotificationDescription />
+        }));
+    }
+
+    return next(action);
+}