#428

frontend/src/pages/tags/TagHistoryPage.tsx

@@ -85,14 +85,39 @@ const renderAliasDiff = (
 ) => {
   const before = new Set (previous?.aliases.map (alias => alias.name) ?? [])
   const after = new Set (current?.aliases.map (alias => alias.name) ?? [])
+
   return [...new Set ([...after, ...before])].map (name => {
-    const content = (
-	<span lang={language} className="inline-block whitespace-nowrap">{name}</span>)
     if (!(before.has (name)))
-      return <ins key={name} className="mr-2 text-green-600 dark:text-green-400">{content}</ins>
+      {
+	return (
+	    <ins
+		key={name}
+		lang={language}
+		className="mr-2 inline-block whitespace-nowrap
+			   underline text-green-600 dark:text-green-400">
+	      {name}
+	    </ins>)
+      }
+
     if (!(after.has (name)))
-      return <del key={name} className="mr-2 text-red-600 dark:text-red-400">{content}</del>
-    return <span key={name} className="mr-2">{content}</span>
+      {
+	return (
+	    <del
+		key={name}
+		lang={language}
+		className="mr-2 inline-block whitespace-nowrap
+			   line-through text-red-600 dark:text-red-400">
+	      {name}
+	    </del>)
+      }
+
+    return (
+	<span
+	    key={name}
+	    lang={language}
+	    className="mr-2 inline-block whitespace-nowrap">
+	  {name}
+	</span>)
   })
 }
 
@@ -162,7 +187,6 @@ const TagVersionRows = ({ change, children }: {
 		  {renderPrimaryName (change.currentNameReference, language, label)}
 		  <span className="ml-2 text-sm">{label ('nameChanges.currentReference')}</span>
 		</div>)}
-	    <div className="text-sm">{label ('nameChanges.noNameRecord')}</div>
 	  </>)
       : renderDiff ({ current, prev: previous },
 	  snapshot => renderPrimaryName (snapshot, language, label), primaryEqual)
@@ -170,7 +194,7 @@ const TagVersionRows = ({ change, children }: {
       <div className="mt-2 text-sm">
 	<button type="button" className="text-left"
 	    aria-expanded={expanded} aria-controls={rowIds.join (' ')}
-	    onClick={() => setExpansion ({ language, expanded: !expanded })}>
+	    onClick={() => setExpansion ({ language, expanded: !(expanded) })}>
 	  {label ('nameChanges.otherLanguages')}
 	  {otherChanges.length > 0 && label ('nameChanges.changed')}
 	  <span aria-hidden="true" className="ml-1">{expanded ? '▲' : '▼'}</span>