diff --git a/.changeset/sour-maps-live.md b/.changeset/sour-maps-live.md
new file mode 100644
index 000000000..aa65985a6
--- /dev/null
+++ b/.changeset/sour-maps-live.md
@@ -0,0 +1,5 @@
+---
+'@verdaccio/ui-theme': patch
+---
+
+Add links to "Current Tags" and sort them in descending order
diff --git a/packages/plugins/ui-theme/src/i18n/crowdin/ui.json b/packages/plugins/ui-theme/src/i18n/crowdin/ui.json
index 739359de5..91950f381 100644
--- a/packages/plugins/ui-theme/src/i18n/crowdin/ui.json
+++ b/packages/plugins/ui-theme/src/i18n/crowdin/ui.json
@@ -52,7 +52,7 @@
},
"versions": {
"current-tags": "Current Tags",
- "version-history": "Version history",
+ "version-history": "Version History",
"not-available": "Not available"
},
"package": {
diff --git a/packages/plugins/ui-theme/src/pages/Version/DetailContainer/Versions/Versions.tsx b/packages/plugins/ui-theme/src/pages/Version/DetailContainer/Versions/Versions.tsx
index 839c136ab..0431c729a 100644
--- a/packages/plugins/ui-theme/src/pages/Version/DetailContainer/Versions/Versions.tsx
+++ b/packages/plugins/ui-theme/src/pages/Version/DetailContainer/Versions/Versions.tsx
@@ -21,10 +21,10 @@ const Versions: React.FC = () => {
return (
<>
- {distTags && Object.keys(distTags).length > 0 && (
+ {distTags && Object.keys(distTags).length > 0 && packageName && (
<>
{t('versions.current-tags')}
-
+
>
)}
{versions && Object.keys(versions).length > 0 && packageName && (
diff --git a/packages/plugins/ui-theme/src/pages/Version/DetailContainer/Versions/VersionsTagList.tsx b/packages/plugins/ui-theme/src/pages/Version/DetailContainer/Versions/VersionsTagList.tsx
index f31119655..6577e3c5b 100644
--- a/packages/plugins/ui-theme/src/pages/Version/DetailContainer/Versions/VersionsTagList.tsx
+++ b/packages/plugins/ui-theme/src/pages/Version/DetailContainer/Versions/VersionsTagList.tsx
@@ -3,19 +3,26 @@ import ListItem from '@mui/material/ListItem';
import React from 'react';
import { DistTags } from '../../../../../types/packageMeta';
-import { ListItemText, Spacer } from './styles';
+import { Time } from '../../../../../types/packageMeta';
+import { ListItemText, Spacer, StyledLink } from './styles';
interface Props {
tags: DistTags;
+ packageName: string;
+ time: Time;
}
-const VersionsTagList: React.FC = ({ tags }) => (
+const VersionsTagList: React.FC = ({ tags, packageName, time }) => (
{Object.keys(tags)
- .reverse()
+ .sort((a, b) => {
+ return time[tags[a]] < time[tags[b]] ? 1 : time[tags[a]] > time[tags[b]] ? -1 : 0;
+ })
.map((tag) => (
- {tag}
+
+ {tag}
+
{tags[tag]}