fix: Encode URI components for tag links to handle reserved characters (#430)

* fix: Encode URI components for tag links to handle reserved characters

* delete: Remove reserved character test markdown file

src/components/PostMeta.astro

@@ -70,7 +70,7 @@ const className = Astro.props.class;
         <div class="flex flex-row flex-nowrap items-center">
             {(tags && tags.length > 0) && tags.map((tag, i) => (
                 <div class:list={[{"hidden": i == 0}, "mx-1.5 text-[var(--meta-divider)] text-sm"]}>/</div>
-                <a href={url(`/archive/tag/${tag}/`)} aria-label=`View all posts with the ${tag} tag`
+                <a href={url(`/archive/tag/${encodeURIComponent(tag)}/`)} aria-label=`View all posts with the ${tag} tag`
                    class="link-lg transition text-50 text-sm font-medium
                                 hover:text-[var(--primary)] dark:hover:text-[var(--primary)] whitespace-nowrap">
                     {tag}

src/components/widget/Tags.astro

@@ -23,7 +23,7 @@ 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/${t.name}/`)} label={`View all posts with the ${t.name} tag`}>
+            <ButtonTag href={url(`/archive/tag/${encodeURIComponent(t.name)}/`)} label={`View all posts with the ${t.name} tag`}>
                 {t.name}
             </ButtonTag>
         ))}

src/pages/archive/tag/[tag].astro

@@ -19,12 +19,12 @@ export async function getStaticPaths() {
 
 	return allTagsArray.map((tag) => ({
 		params: {
-			tag: tag,
+			tag: encodeURIComponent(tag),
 		},
 	}));
 }
 
-const tag = Astro.params.tag as string;
+const tag = decodeURIComponent(Astro.params.tag as string);
 ---
 
 <MainGridLayout title={i18n(I18nKey.archive)} description={i18n(I18nKey.archive)}>