Merge branch 'remove-see-full-changelog-button-from-changelog-view-de…

…s-1651'
mullvad · Jan 22, 2025 · 658e7e7 · 658e7e7
2 parents e515f67 + 22c0b47
commit 658e7e7
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 61 deletions.
diff --git a/desktop/packages/mullvad-vpn/locales/messages.pot b/desktop/packages/mullvad-vpn/locales/messages.pot
@@ -612,10 +612,6 @@ msgctxt "auth-failure"
 msgid "You are logged in with an invalid account number. Please log out and try another one."
 msgstr ""
 
-msgctxt "changelog"
-msgid "See full changelog"
-msgstr ""
-
 msgctxt "changelog-view"
 msgid "No updates or changes were made in this release for this platform."
 msgstr ""
@@ -2629,6 +2625,9 @@ msgstr ""
 msgid "Search"
 msgstr ""
 
+msgid "See full changelog"
+msgstr ""
+
 msgid "Set WireGuard MTU value. Valid range: %d - %d."
 msgstr ""
 

diff --git a/desktop/packages/mullvad-vpn/src/config.json b/desktop/packages/mullvad-vpn/src/config.json
@@ -4,8 +4,7 @@
     "purchase": "https://mullvad.net/account/",
     "faq": "https://mullvad.net/help/tag/mullvad-app/",
     "privacyGuide": "https://mullvad.net/help/first-steps-towards-online-privacy/",
-    "download": "https://mullvad.net/download/vpn/",
-    "changelog": "https://github.com/mullvad/mullvadvpn-app/blob/main/CHANGELOG.md"
+    "download": "https://mullvad.net/download/vpn/"
   },
   "colors": {
     "darkerBlue": "rgba(25, 38, 56, 0.95)",

diff --git a/desktop/packages/mullvad-vpn/src/renderer/components/views/changelog/ChangelogView.tsx b/desktop/packages/mullvad-vpn/src/renderer/components/views/changelog/ChangelogView.tsx
@@ -1,20 +1,15 @@
-import { useCallback } from 'react';
 import styled from 'styled-components';
 
-import { links } from '../../../../config.json';
 import { messages } from '../../../../shared/gettext';
-import { useAppContext } from '../../../context';
-import { BodySmall, Button, Container, Flex, TitleBig, TitleLarge } from '../../../lib/components';
+import { BodySmall, Container, Flex, TitleBig, TitleLarge } from '../../../lib/components';
 import { Colors, Spacings } from '../../../lib/foundations';
 import { useHistory } from '../../../lib/history';
 import { useSelector } from '../../../redux/store';
 import { AppNavigationHeader } from '../../';
-import ImageView from '../../ImageView';
 import { BackAction } from '../../KeyboardNavigation';
 import { Layout, SettingsContainer } from '../../Layout';
 import { NavigationContainer } from '../../NavigationContainer';
 import { NavigationScrollbars } from '../../NavigationScrollbars';
-import SettingsHeader from '../../SettingsHeader';
 
 const StyledList = styled(Flex)({
   listStyleType: 'disc',
@@ -24,21 +19,11 @@ const StyledList = styled(Flex)({
   },
 });
 
-const StyledFooter = styled(Flex)({
-  position: 'sticky',
-  minHeight: '64px',
-  bottom: 0,
-  background: Colors.darkBlue,
-});
-
 export const ChangelogView = () => {
   const { pop } = useHistory();
-  const { openUrl } = useAppContext();
   const changelog = useSelector((state) => state.userInterface.changelog);
   const version = useSelector((state) => state.version.current);
 
-  const url = links.changelog;
-  const openDownloadLink = useCallback(() => openUrl(url), [openUrl, url]);
   return (
     <BackAction action={pop}>
       <Layout>
@@ -47,51 +32,37 @@ export const ChangelogView = () => {
             <AppNavigationHeader title={messages.pgettext('changelog-view', 'What’s new')} />
 
             <NavigationScrollbars>
-              <SettingsHeader>
-                <TitleBig as={'h1'}>{messages.pgettext('changelog-view', 'What’s new')}</TitleBig>
-              </SettingsHeader>
-              <Flex $flexDirection="column" $gap={Spacings.spacing3}>
+              <Flex $flexDirection="column" $gap={Spacings.spacing6}>
                 <Container size="4">
-                  <TitleLarge as="h2">{version}</TitleLarge>
-                </Container>
-                <Container size="3" $flexDirection="column">
-                  {changelog.length ? (
-                    <StyledList as="ul" $flexDirection="column" $gap={Spacings.spacing5}>
-                      {changelog.map((item, i) => (
-                        <BodySmall as="li" key={i} color={Colors.white60}>
-                          {item}
-                        </BodySmall>
-                      ))}
-                    </StyledList>
-                  ) : (
-                    <BodySmall color={Colors.white60}>
-                      {messages.pgettext(
-                        'changelog-view',
-                        'No updates or changes were made in this release for this platform.',
-                      )}
-                    </BodySmall>
-                  )}
+                  <TitleBig as={'h1'}>{messages.pgettext('changelog-view', 'What’s new')}</TitleBig>
                 </Container>
+                <Flex $flexDirection="column" $gap={Spacings.spacing3}>
+                  <Container size="4">
+                    <TitleLarge as="h2">{version}</TitleLarge>
+                  </Container>
+                  <Container size="3" $flexDirection="column">
+                    {changelog.length ? (
+                      <StyledList as="ul" $flexDirection="column" $gap={Spacings.spacing5}>
+                        {changelog.map((item, i) => (
+                          <BodySmall as="li" key={i} color={Colors.white60}>
+                            {item}
+                          </BodySmall>
+                        ))}
+                      </StyledList>
+                    ) : (
+                      <BodySmall color={Colors.white60}>
+                        {messages.pgettext(
+                          'changelog-view',
+                          'No updates or changes were made in this release for this platform.',
+                        )}
+                      </BodySmall>
+                    )}
+                  </Container>
+                </Flex>
               </Flex>
             </NavigationScrollbars>
           </NavigationContainer>
         </SettingsContainer>
-        <StyledFooter
-          $padding={{ horizontal: Spacings.spacing6 }}
-          $alignItems="center"
-          $justifyContent="center">
-          <Button
-            onClick={openDownloadLink}
-            trailing={
-              <ImageView
-                source="icon-extLink"
-                aria-label={messages.pgettext('accessibility', 'Opens externally')}
-                tintColor={Colors.white}
-              />
-            }>
-            {messages.pgettext('changelog', 'See full changelog')}
-          </Button>
-        </StyledFooter>
       </Layout>
     </BackAction>
   );