diff --git a/app/main.ts b/app/main.ts index 9c6982de6f3c..fd0feb768d2a 100644 --- a/app/main.ts +++ b/app/main.ts @@ -324,6 +324,7 @@ function prepareUrl( appStartInitialSpellcheckSetting, userDataPath: app.getPath('userData'), downloadsPath: app.getPath('downloads'), + isLegacyOS: OS.isLegacy(), homePath: app.getPath('home'), ...moreKeys, }).href; diff --git a/preload.js b/preload.js index 92c333aa8cda..0520a11f242d 100644 --- a/preload.js +++ b/preload.js @@ -70,6 +70,7 @@ try { window.getServerPublicParams = () => config.serverPublicParams; window.getSfuUrl = () => config.sfuUrl; window.isBehindProxy = () => Boolean(config.proxyUrl); + window.isLegacyOS = () => config.isLegacyOS === 'true'; window.getAutoLaunch = () => { return ipc.invoke('get-auto-launch'); }; diff --git a/ts/OS.ts b/ts/OS.ts index 73598af018b7..7714dc7187a8 100644 --- a/ts/OS.ts +++ b/ts/OS.ts @@ -16,3 +16,16 @@ export const isWindows = (minVersion?: string): boolean => { return is.undefined(minVersion) ? true : semver.gte(osRelease, minVersion); }; + +export const isLegacy = (): boolean => { + if (process.platform === 'darwin') { + // 17.0.0 - is macOS 10.13 + return semver.lt(os.release(), '17.0.0'); + } + + if (process.platform === 'win32') { + return semver.lt(os.release(), '9.0.0'); + } + + return false; +}; diff --git a/ts/components/Lightbox.tsx b/ts/components/Lightbox.tsx index 4b4ef1406492..ca564a8c59fc 100644 --- a/ts/components/Lightbox.tsx +++ b/ts/components/Lightbox.tsx @@ -18,8 +18,10 @@ import { IMAGE_PNG, isImage, isVideo } from '../types/MIME'; import type { LocalizerType } from '../types/Util'; import type { MediaItemType, MessageAttributesType } from '../types/MediaItem'; import { formatDuration } from '../util/formatDuration'; +import { showToast } from '../util/showToast'; import { useRestoreFocus } from '../hooks/useRestoreFocus'; import * as log from '../logging/log'; +import { ToastUnableToLoadAttachment } from './ToastUnableToLoadAttachment'; export type PropsType = { children?: ReactNode; @@ -453,6 +455,25 @@ export function Lightbox({ /> ); } + } else if (isVideoTypeSupported && window.isLegacyOS()) { + const onLegacyClick = (event: React.MouseEvent) => { + event.preventDefault(); + event.stopPropagation(); + + showToast(ToastUnableToLoadAttachment); + }; + + content = ( + + ); } else if (isVideoTypeSupported) { const shouldLoop = loop || isAttachmentGIF || isViewOnce; diff --git a/ts/components/conversation/GIF.tsx b/ts/components/conversation/GIF.tsx index cab70bffb576..ceac789f7a0c 100644 --- a/ts/components/conversation/GIF.tsx +++ b/ts/components/conversation/GIF.tsx @@ -178,7 +178,7 @@ export const GIF: React.FC = props => { } let gif: JSX.Element | undefined; - if (isNotDownloaded || isPending) { + if (isNotDownloaded || isPending || window.isLegacyOS()) { gif = ( = (props: Props) => { }, [id, audio, isActive, isPlaying, currentTime]); const toggleIsPlaying = () => { + if (window.isLegacyOS()) { + showToast(ToastUnableToLoadAttachment); + return; + } + setIsPlaying(!isPlaying); if (!isActive && !isPlaying) { diff --git a/ts/window.d.ts b/ts/window.d.ts index 78ff3321fc14..ffb585fd1f1c 100644 --- a/ts/window.d.ts +++ b/ts/window.d.ts @@ -170,6 +170,7 @@ declare global { imageToBlurHash: typeof imageToBlurHash; loadImage: any; isBehindProxy: () => boolean; + isLegacyOS: () => boolean; getAutoLaunch: () => Promise; setAutoLaunch: (value: boolean) => Promise;