#76

frontend/src/components/DraggableDroppableTagRow.tsx

@@ -98,4 +98,4 @@ const DraggableDroppableTagRow: FC<Props> = ({ tag, nestLevel, pathKey, parentTa
       </div>)
 }
 
-export default DraggableDroppableTagRow
+export default DraggableDroppableTagRow

frontend/src/components/TagLink.tsx

@@ -34,6 +34,7 @@ const TagLink: FC<Props> = ({ tag,
 			      withCount = true,
 			      className,
 			      ...props }) => {
+  const textWrapClass = '[overflow-wrap:anywhere]'
   const spanClass = cn (
       `text-${ TAG_COLOUR[tag.category] }-${ LIGHT_COLOUR_SHADE }`,
       `dark:text-${ TAG_COLOUR[tag.category] }-${ DARK_COLOUR_SHADE }`)
@@ -106,7 +107,9 @@ const TagLink: FC<Props> = ({ tag,
 	    </span>)}
 	{tag.matchedAlias != null && (
 	    <>
-	      <span className={cn (spanClass, className)} {...props}>
+	      <span
+		  className={cn (spanClass, textWrapClass, className)}
+		  {...props}>
 		{tag.matchedAlias}
 	      </span>
 	      <> → </>
@@ -115,12 +118,13 @@ const TagLink: FC<Props> = ({ tag,
 	 ? (
 	    <PrefetchLink
 		to={`/posts?${ (new URLSearchParams ({ tags: tag.name })).toString () }`}
-		className={cn (linkClass, className)}
+		className={cn (linkClass, textWrapClass, className)}
 		{...props}>
 	      {tag.name}
 	    </PrefetchLink>)
 	 : (
-	    <span className={cn (spanClass, className)}
+	    <span
+		  className={cn (spanClass, textWrapClass, className)}
 		  {...props}>
 	      {tag.name}
 	    </span>)}

frontend/src/components/TagSearchBox.tsx

@@ -28,4 +28,4 @@ const TagSearchBox: FC<Props> = ({ suggestions, activeIndex, onSelect }) => {
       </ul>)
 }
 
-export default TagSearchBox
+export default TagSearchBox

frontend/src/components/TagSidebar.tsx

@@ -128,4 +128,4 @@ const TagSidebar: FC<Props> = ({ posts, onClick }) => {
       </SidebarComponent>)
 }
 
-export default TagSidebar
+export default TagSidebar