diff --git a/src/i18n/en-US.json b/src/i18n/en-US.json index bc0c1ef6bbe..5923a2cea30 100644 --- a/src/i18n/en-US.json +++ b/src/i18n/en-US.json @@ -1199,7 +1199,9 @@ "preferencesAboutSupportContact": "Contact Support", "preferencesAboutSupportWebsite": "Support website", "preferencesAboutTermsOfUse": "Terms of use", - "preferencesAboutVersion": "Version {{version}}", + "preferencesAboutVersion": "{{brandName}} for web version {{version}}", + "preferencesAboutDesktopVersion": "Desktop version {{version}}", + "preferencesAboutAVSVersion": "AVS version {{version}}", "preferencesAboutWebsite": "{{brandName}} website", "preferencesAccount": "Account", "preferencesAccountAccentColor": "Set a profile color", diff --git a/src/script/Config.ts b/src/script/Config.ts index 112615722c0..34df51a3107 100644 --- a/src/script/Config.ts +++ b/src/script/Config.ts @@ -20,6 +20,8 @@ import {Runtime} from '@wireapp/commons'; import {createUuid} from 'Util/uuid'; + +import packageJson from '../../package.json'; const env = window.wire.env; export const ACCENT_ID = { @@ -83,6 +85,8 @@ const config = { clientToken: env.DATADOG_CLIENT_TOKEN, applicationId: env.DATADOG_APPLICATION_ID, }, + + AVS_VERSION: packageJson.dependencies['@wireapp/avs'], } as const; export type Configuration = typeof config; @@ -91,6 +95,13 @@ const Config = { getConfig: () => { return config; }, + getDesktopConfig: () => { + if (!Runtime.isDesktopApp) { + return undefined; + } + + return window.desktopAppConfig; + }, }; export {Config}; diff --git a/src/script/conversation/linkPreviews/index.ts b/src/script/conversation/linkPreviews/index.ts index 0ac8cf63e3a..41b531f2521 100644 --- a/src/script/conversation/linkPreviews/index.ts +++ b/src/script/conversation/linkPreviews/index.ts @@ -51,6 +51,7 @@ type LinkPreviewContent = { declare global { interface Window { openGraphAsync?: (url: string) => Promise; + desktopAppConfig?: {version: string}; } } const logger = getLogger('LinkPreviewRepository'); diff --git a/src/script/page/LeftSidebar/panels/Preferences.test.tsx b/src/script/page/LeftSidebar/panels/Preferences.test.tsx index ef8da988796..c43b3f270f6 100644 --- a/src/script/page/LeftSidebar/panels/Preferences.test.tsx +++ b/src/script/page/LeftSidebar/panels/Preferences.test.tsx @@ -44,12 +44,12 @@ describe('Preferences', () => { expect(queryByText('preferencesAV')).toBeNull(); }); - it('renders the about section in a web app', () => { + it('renders the about section in a desktop app', () => { jest.spyOn(Runtime, 'isDesktopApp').mockReturnValue(true); jest.spyOn(Runtime, 'isSupportingLegacyCalling').mockReturnValue(false); const {queryByText} = render(); expect(queryByText('preferencesAV')).toBeNull(); - expect(queryByText('preferencesAbout')).toBeNull(); + expect(queryByText('preferencesAbout')).not.toBeNull(); }); it('renders the a/v section in a desktop app', () => { diff --git a/src/script/page/LeftSidebar/panels/Preferences.tsx b/src/script/page/LeftSidebar/panels/Preferences.tsx index 5013586cd0c..6d125a963df 100644 --- a/src/script/page/LeftSidebar/panels/Preferences.tsx +++ b/src/script/page/LeftSidebar/panels/Preferences.tsx @@ -127,7 +127,6 @@ const Preferences: React.FC = ({ teamRepository.getTeam(); }, [teamRepository]); - const isDesktop = Runtime.isDesktopApp(); const supportsCalling = Runtime.isSupportingLegacyCalling(); const {setCurrentView} = useAppMainState(state => state.responsiveView); @@ -179,7 +178,6 @@ const Preferences: React.FC = ({ }, { IconComponent: Icon.About, - hidden: isDesktop, id: ContentState.PREFERENCES_ABOUT, label: t('preferencesAbout'), uieName: 'go-about', diff --git a/src/script/page/MainContent/panels/preferences/AboutPreferences.tsx b/src/script/page/MainContent/panels/preferences/AboutPreferences.tsx index e84f03cb97a..5c5474093bb 100644 --- a/src/script/page/MainContent/panels/preferences/AboutPreferences.tsx +++ b/src/script/page/MainContent/panels/preferences/AboutPreferences.tsx @@ -41,6 +41,7 @@ interface AboutPreferencesProps { const AboutPreferences: React.FC = ({selfUser, teamState = container.resolve(TeamState)}) => { const inTeam = teamState.isInTeam(selfUser); const config = Config.getConfig(); + const desktopConfig = Config.getDesktopConfig(); const websiteUrl = URL.WEBSITE; const privacyPolicyUrl = getPrivacyPolicyUrl(); @@ -110,7 +111,13 @@ const AboutPreferences: React.FC = ({selfUser, teamState )} -

{t('preferencesAboutVersion', config.VERSION)}

+ {desktopConfig && ( +

{t('preferencesAboutDesktopVersion', desktopConfig.version)}

+ )} +

+ {t('preferencesAboutVersion', {brandName: config.BRAND_NAME, version: config.VERSION})} +

+

{t('preferencesAboutAVSVersion', config.AVS_VERSION)}

{t('preferencesAboutCopyright')}

diff --git a/src/script/util/Environment.ts b/src/script/util/Environment.ts index 2fc419bf6f1..77c55c79ed3 100644 --- a/src/script/util/Environment.ts +++ b/src/script/util/Environment.ts @@ -49,6 +49,7 @@ interface Environment { isProduction: typeof isProduction; }; version: (showWrapperVersion?: boolean) => string; + avsVersion: () => string; } export const Environment: Environment = { @@ -67,4 +68,5 @@ export const Environment: Environment = { const showElectronVersion = electronVersion && showWrapperVersion; return showElectronVersion ? electronVersion : Config.getConfig().VERSION; }, + avsVersion: (): string => Config.getConfig().AVS_VERSION, };