feat: change how we calculate what to show new in Unleash (#10931)

## About the changes
This helps to specify how long to show new in Unleash so we don't forget
to remove it when doing a release. This doesn't mean we should keep this
list forever, but this helps us to keep it clean in the UI at least.

### Tests
We did unit test the logic as follows (manually because it's not an easy
piece of code to test in the UI):
```typescript
test('ui-test', () => {
    const showUntil = '7.3.0';
    expect(lt('6.9.3', showUntil)).toBe(true);
    expect(lt('7.2.3', showUntil)).toBe(true);
    expect(lt('7.3.0', showUntil)).toBe(false);
    expect(lt('7.3.1', showUntil)).toBe(false);
    expect(lt('7.4.0', showUntil)).toBe(false);
    expect(lt('8.0.0', showUntil)).toBe(false);
});
```

frontend/src/component/layout/MainLayout/NavigationSidebar/NewInUnleash/NewInUnleash.tsx

@@ -1,4 +1,3 @@
-import { useUiFlag } from 'hooks/useUiFlag.ts';
 import useUiConfig from 'hooks/api/getters/useUiConfig/useUiConfig';
 import { useLocalStorageState } from 'hooks/useLocalStorageState';
 import {
@@ -24,6 +23,7 @@ import { useNavigate } from 'react-router-dom';
 import { formatAssetPath } from 'utils/formatPath';
 import FactCheckOutlinedIcon from '@mui/icons-material/FactCheckOutlined';
 import ReleaseTemplatePreviewImage from 'assets/img/releaseTemplatePreview.png';
+import semverLt from 'semver/functions/lt';
 
 const StyledNewInUnleash = styled('div')(({ theme }) => ({
     margin: theme.spacing(2, 0, 1, 0),
@@ -100,8 +100,27 @@ export const NewInUnleash = ({
         'new-in-unleash-seen:v1',
         new Set(),
     );
-    const { isEnterprise } = useUiConfig();
-    const signalsEnabled = useUiFlag('signals');
+    const {
+        isEnterprise,
+        uiConfig: { version, flags },
+    } = useUiConfig();
+
+    const shouldBeDisplayed = ({
+        enterpriseOnly,
+        flag,
+        versionLowerThan,
+    }: NewInUnleashItemDetails['filter']) => {
+        if (enterpriseOnly && !isEnterprise()) {
+            return false;
+        }
+
+        // flag is enable check stolen from useUiFlag hook
+        if (flag && !(flags?.[flag] || false)) {
+            return false;
+        }
+
+        return semverLt(version, versionLowerThan);
+    };
 
     const items: NewInUnleashItemDetails[] = [
         {
@@ -116,7 +135,9 @@ export const NewInUnleash = ({
             ),
             docsLink:
                 'https://docs.getunleash.io/reference/feature-toggles#feature-flag-lifecycle',
-            show: true,
+            filter: {
+                versionLowerThan: '7.2.0',
+            },
             longDescription: (
                 <p>
                     We have updated the names, icons, and colors for the
@@ -133,7 +154,11 @@ export const NewInUnleash = ({
             preview: <SignalsPreview />,
             onCheckItOut: () => navigate('/integrations/signals'),
             docsLink: 'https://docs.getunleash.io/reference/signals',
-            show: isEnterprise() && signalsEnabled,
+            filter: {
+                flag: 'signals',
+                enterpriseOnly: true,
+                versionLowerThan: '7.3.0',
+            },
             longDescription: (
                 <>
                     <p>
@@ -174,14 +199,17 @@ export const NewInUnleash = ({
             ),
             onCheckItOut: () => navigate('/release-templates'),
             docsLink: 'https://docs.getunleash.io/reference/release-templates',
-            show: isEnterprise(),
+            filter: {
+                enterpriseOnly: true,
+                versionLowerThan: '7.4.0',
+            },
             beta: false,
             popout: true,
         },
     ];
 
     const visibleItems = items.filter(
-        (item) => item.show && !seenItems.has(item.label),
+        (item) => shouldBeDisplayed(item.filter) && !seenItems.has(item.label),
     );
 
     if (!visibleItems.length) return null;

frontend/src/component/layout/MainLayout/NavigationSidebar/NewInUnleash/NewInUnleashItem.tsx

@@ -3,6 +3,7 @@ import { ListItem } from '@mui/material';
 import { NewInUnleashTooltip } from './NewInUnleashTooltip.tsx';
 import { NewInUnleashDialog } from './NewInUnleashDialog.tsx';
 import { NewInUnleashSideBarItem } from './NewInUnleashSideBarItem.tsx';
+import type { UiFlags } from 'interfaces/uiConfig.ts';
 
 export type NewInUnleashItemDetails = {
     label: string;
@@ -10,7 +11,11 @@ export type NewInUnleashItemDetails = {
     icon: ReactNode;
     onCheckItOut?: () => void;
     docsLink?: string;
-    show: boolean;
+    filter: {
+        versionLowerThan: string;
+        enterpriseOnly?: boolean;
+        flag?: keyof UiFlags; // if this is still controlled by a flag
+    };
     longDescription?: ReactNode;
     preview?: ReactNode;
     beta?: boolean;
@@ -18,7 +23,7 @@ export type NewInUnleashItemDetails = {
 };
 
 interface INewInUnleashItemProps
-    extends Omit<NewInUnleashItemDetails, 'show' | 'beta'> {
+    extends Omit<NewInUnleashItemDetails, 'filter' | 'beta'> {
     onClick: () => void;
     onDismiss: () => void;
     beta: boolean;

frontend/src/component/menu/Footer/__snapshots__/Footer.test.tsx.snap

@@ -25,7 +25,7 @@ exports[`should render DrawerMenu 1`] = `
             Unleash
              
              
-            5.x
+            7.3.0
           </h2>
           <br />
           <small>
@@ -551,7 +551,7 @@ exports[`should render DrawerMenu with "features" selected 1`] = `
             Unleash
              
              
-            5.x
+            7.3.0
           </h2>
           <br />
           <small>

frontend/src/hooks/api/getters/useUiConfig/defaultValue.tsx

@@ -2,7 +2,7 @@ import type { IUiConfig } from 'interfaces/uiConfig';
 
 export const defaultValue: IUiConfig = {
     name: 'Unleash',
-    version: '5.x',
+    version: '7.3.0',
     slogan: 'The enterprise ready feature flag service.',
     flags: {
         P: false,