Merge pull request #401 from mzedel/feat/release-notes-update

feat(gui): aligned version information w/ monorepo setup & common design
mendersoftware · Jan 31, 2025 · 09945fe · 09945fe
2 parents 9fe5257 + 95f4645
commit 09945fe
Show file tree

Hide file tree

Showing 10 changed files with 212 additions and 180 deletions.
diff --git a/frontend/entrypoint.sh b/frontend/entrypoint.sh
@@ -20,7 +20,7 @@ if [ -n "$GATEWAY_PORT" ]; then
 fi
 
 if [ -n "$STRIPE_API_KEY" ]; then
-  wget -O /var/www/mender-gui/dist/tags.json https://api.github.com/repos/mendersoftware/gui/tags?per_page=10
+  wget -O /var/www/mender-gui/dist/tags.json https://api.github.com/repos/mendersoftware/mender-server/tags?per_page=10
 else
   echo "[]" >> /var/www/mender-gui/dist/tags.json
 fi

diff --git a/frontend/src/js/components/LeftNav.tsx b/frontend/src/js/components/LeftNav.tsx
@@ -16,10 +16,11 @@ import { useDispatch, useSelector } from 'react-redux';
 import { NavLink } from 'react-router-dom';
 
 // material ui
-import { List, ListItem, ListItemText, Tooltip } from '@mui/material';
+import { List, ListItem, ListItemText } from '@mui/material';
 import { makeStyles } from 'tss-react/mui';
 
 import DocsLink from '@northern.tech/common-ui/DocsLink';
+import MenderTooltip from '@northern.tech/common-ui/MenderTooltip';
 import storeActions from '@northern.tech/store/actions';
 import { TIMEOUTS } from '@northern.tech/store/constants';
 import { getFeatures, getUserCapabilities, getVersionInformation } from '@northern.tech/store/selectors';
@@ -53,14 +54,14 @@ const useStyles = makeStyles()(theme => ({
   },
   navLink: { padding: '22px 16px 22px 42px' },
   listItem: { padding: '16px 16px 16px 42px' },
-  versions: { display: 'grid', gridTemplateColumns: 'max-content 60px', columnGap: theme.spacing(), '>a': { color: theme.palette.grey[100] } }
+  versions: { display: 'grid', gridTemplateColumns: 'max-content max-content', columnGap: theme.spacing() }
 }));
 
 const linkables = {
   'Integration': 'integration',
   'Mender-Client': 'mender',
   'Mender-Artifact': 'mender-artifact',
-  'GUI': 'gui'
+  'Server': 'mender-server'
 };
 
 const VersionInfo = () => {
@@ -123,18 +124,28 @@ const VersionInfo = () => {
     title = 'Version: latest';
   }
   return (
-    <Tooltip title={versions} placement="top">
+    <MenderTooltip arrow title={versions} placement="top">
       <div className="clickable slightly-smaller" onClick={onClick}>
         {title}
       </div>
-    </Tooltip>
+    </MenderTooltip>
   );
 };
 
+const getDocsLocation = ({ isHosted, isEnterprise }) => {
+  if (isHosted) {
+    return 'hosted-mender';
+  } else if (isEnterprise) {
+    return 'mender-server-enterprise';
+  }
+  return 'mender-server';
+};
+
 export const LeftNav = () => {
   const releasesRef = useRef();
   const { classes } = useStyles();
 
+  const { isEnterprise, isHosted } = useSelector(getFeatures); // here we have to only rely on the enterprise flag, not the tenant setting, to also point hosted enterprise users to the right location
   const userCapabilities = useSelector(getUserCapabilities);
 
   return (
@@ -166,7 +177,18 @@ export const LeftNav = () => {
         <ListItem className={classes.listItem}>
           <ListItemText
             primary={<VersionInfo />}
-            secondary={<DocsLink className={classes.licenseLink} path="release-information/open-source-licenses" title="License information" />}
+            secondary={
+              <>
+                <DocsLink
+                  className={classes.licenseLink}
+                  path={`release-information/release-notes-changelog/${getDocsLocation({ isEnterprise, isHosted })}`}
+                  title="Release information"
+                />
+                <br />
+                <DocsLink className={classes.licenseLink} path="release-information/open-source-licenses" title="License information" />
+              </>
+            }
+            slotProps={{ secondary: { lineHeight: '2em' } }}
           />
         </ListItem>
       </List>