fix: Trim whitespace from category and tag names in URL generation (#437)

src/components/widget/Categories.astro

@@ -27,11 +27,11 @@ const style = Astro.props.style;
 >
     {categories.map((c) =>
         <ButtonLink
-            url={getCategoryUrl(c.name)}
+            url={getCategoryUrl(c.name.trim())}
             badge={String(c.count)}
-            label={`View all posts in the ${c.name} category`}
+            label={`View all posts in the ${c.name.trim()} category`}
         >
-            {c.name}
+            {c.name.trim()}
         </ButtonLink>
     )}
 </WidgetLayout>

src/components/widget/Tags.astro

@@ -3,7 +3,7 @@
 import I18nKey from "../../i18n/i18nKey";
 import { i18n } from "../../i18n/translation";
 import { getTagList } from "../../utils/content-utils";
-import { url } from "../../utils/url-utils";
+import { getTagUrl } from "../../utils/url-utils";
 import ButtonTag from "../control/ButtonTag.astro";
 import WidgetLayout from "./WidgetLayout.astro";
 
@@ -23,8 +23,8 @@ const style = Astro.props.style;
 <WidgetLayout name={i18n(I18nKey.tags)} id="tags" isCollapsed={isCollapsed} collapsedHeight={COLLAPSED_HEIGHT} class={className} style={style}>
     <div class="flex gap-2 flex-wrap">
         {tags.map(t => (
-            <ButtonTag href={url(`/archive/tag/${encodeURIComponent(t.name)}/`)} label={`View all posts with the ${t.name} tag`}>
-                {t.name}
+            <ButtonTag href={getTagUrl(t.name.trim())} label={`View all posts with the ${t.name.trim()} tag`}>
+                {t.name.trim()}
             </ButtonTag>
         ))}
     </div>