Make the code easier to read.

src/components/Nav.astro

@@ -1,5 +1,4 @@
 ---
-
 ---
 
 <div class="nav" id="nav">

src/components/article/CollectionSummary.astro

@@ -7,9 +7,10 @@ import * as pinyinpro from "pinyin-pro";
 
 interface Props {
   collectionName: CollectionKey;
-  sortedByTimeline: boolean;
+  sortByTimeline: boolean;
+  sortByArticleTitle: boolean;
 }
-const { collectionName, sortedByTimeline } = Astro.props;
+const { collectionName, sortByTimeline, sortByArticleTitle } = Astro.props;
 
 type CategoriedPosts = {
   [categoryName: string]: Array<CollectionEntry<CollectionKey>>;
@@ -44,7 +45,7 @@ const categoriedPostList: Array<CategoriedPosts> = allCategories.map((key) => {
     return postATitle.localeCompare(postBTitle, "en");
   }
 
-  if (sortedByTimeline) {
+  if (sortByTimeline) {
     // sort article by update date
     object[key].sort((postA, postB) => {
       // if two articles is updated on the same day, sort them by title
@@ -53,7 +54,7 @@ const categoriedPostList: Array<CategoriedPosts> = allCategories.map((key) => {
       }
       return sortPostByTitlePinyin(postA, postB);
     });
-  } else {
+  } else if (sortByArticleTitle) {
     // sort article by title
     // get articles with titles started in Chinese or the alphabet
     let postWithAlphabetStartedTitle: CollectionEntry<keyof ContentEntryMap>[] =

src/pages/article/blog/index.astro

@@ -1,16 +1,21 @@
 ---
-import Footer from '../../../components/Footer.astro';
+import Footer from "../../../components/Footer.astro";
-import Nav from '../../../components/Nav.astro';
+import Nav from "../../../components/Nav.astro";
-import CollectionSummary from '../../../components/article/CollectionSummary.astro';
+import CollectionSummary from "../../../components/article/CollectionSummary.astro";
-import DefaultLayout from '../../../layouts/DefaultLayout.astro';
+import DefaultLayout from "../../../layouts/DefaultLayout.astro";
 ---
 
 <DefaultLayout title="博客 - 李守中">
   <Nav />
   <div class="options">
-    <span>当前: [按日期降序] <a href="/article/blog/sort_by_name">按名字排序</a></span>
+    <span>当前: [按日期降序]</span>
+    <a href="/article/blog/sort_by_name">按名字排序</a>
   </div>
-  <CollectionSummary collectionName="blog" sortedByTimeline={true}/>
+  <CollectionSummary
+    collectionName="blog"
+    sortByTimeline={true}
+    sortByArticleTitle={false}
+  />
   <Footer />
 </DefaultLayout>
 

src/pages/article/blog/sort_by_name.astro

@@ -1,16 +1,21 @@
 ---
-import Footer from '../../../components/Footer.astro';
+import Footer from "../../../components/Footer.astro";
-import Nav from '../../../components/Nav.astro';
+import Nav from "../../../components/Nav.astro";
-import CollectionSummary from '../../../components/article/CollectionSummary.astro';
+import CollectionSummary from "../../../components/article/CollectionSummary.astro";
-import DefaultLayout from '../../../layouts/DefaultLayout.astro';
+import DefaultLayout from "../../../layouts/DefaultLayout.astro";
 ---
 
 <DefaultLayout title="博客 - 李守中">
   <Nav />
   <div class="options">
-    <span>当前: [按名字排序] <a href="/article/blog/">按日期降序</a></span>
+    <span>当前: [按名字排序]</span>
+    <a href="/article/blog/">按日期降序</a>
   </div>
-  <CollectionSummary collectionName="blog" sortedByTimeline={false}/>
+  <CollectionSummary
+    collectionName="blog"
+    sortByTimeline={false}
+    sortByArticleTitle={true}
+  />
   <Footer />
 </DefaultLayout>
 

src/pages/article/note/index.astro

@@ -1,16 +1,21 @@
 ---
-import Footer from '../../../components/Footer.astro';
+import Footer from "../../../components/Footer.astro";
-import Nav from '../../../components/Nav.astro';
+import Nav from "../../../components/Nav.astro";
-import CollectionSummary from '../../../components/article/CollectionSummary.astro';
+import CollectionSummary from "../../../components/article/CollectionSummary.astro";
-import DefaultLayout from '../../../layouts/DefaultLayout.astro';
+import DefaultLayout from "../../../layouts/DefaultLayout.astro";
 ---
 
 <DefaultLayout title="笔记 - 李守中">
   <Nav />
   <div class="options">
-    <span>当前: [按名字排序] <a href="/article/note/sort_by_timeline">按日期降序</a></span>
+    <span>当前: [按名字排序]</span>
+    <a href="/article/note/sort_by_timeline">按日期降序</a>
   </div>
-  <CollectionSummary collectionName="note" sortedByTimeline={false}/>
+  <CollectionSummary
+    collectionName="note"
+    sortByTimeline={false}
+    sortByArticleTitle={true}
+  />
   <Footer />
 </DefaultLayout>
 

src/pages/article/note/sort_by_timeline.astro

@@ -1,16 +1,21 @@
 ---
-import Footer from '../../../components/Footer.astro';
+import Footer from "../../../components/Footer.astro";
-import Nav from '../../../components/Nav.astro';
+import Nav from "../../../components/Nav.astro";
-import CollectionSummary from '../../../components/article/CollectionSummary.astro';
+import CollectionSummary from "../../../components/article/CollectionSummary.astro";
-import DefaultLayout from '../../../layouts/DefaultLayout.astro';
+import DefaultLayout from "../../../layouts/DefaultLayout.astro";
 ---
 
 <DefaultLayout title="笔记 - 李守中">
   <Nav />
   <div class="options">
-    <span>当前: [按日期降序] <a href="/article/note/">按名字排序</a></span>
+    <span>当前: [按日期降序]</span>
+    <a href="/article/note/">按名字排序</a>
   </div>
-  <CollectionSummary collectionName="note" sortedByTimeline={true}/>
+  <CollectionSummary
+    collectionName="note"
+    sortByTimeline={true}
+    sortByArticleTitle={false}
+  />
   <Footer />
 </DefaultLayout>
 

src/pages/article/translation/index.astro

@@ -1,16 +1,21 @@
 ---
-import Footer from '../../../components/Footer.astro';
+import Footer from "../../../components/Footer.astro";
-import Nav from '../../../components/Nav.astro';
+import Nav from "../../../components/Nav.astro";
-import CollectionSummary from '../../../components/article/CollectionSummary.astro';
+import CollectionSummary from "../../../components/article/CollectionSummary.astro";
-import DefaultLayout from '../../../layouts/DefaultLayout.astro';
+import DefaultLayout from "../../../layouts/DefaultLayout.astro";
 ---
 
 <DefaultLayout title="翻译 - 李守中">
   <Nav />
   <div class="options">
-    <span>当前: [按名字排序] <a href="/article/translation/sort_by_timeline">按日期降序</a></span>
+    <span>当前: [按名字排序]</span>
+    <a href="/article/translation/sort_by_timeline">按日期降序</a>
   </div>
-  <CollectionSummary collectionName="translation" sortedByTimeline={false}/>
+  <CollectionSummary
+    collectionName="translation"
+    sortByTimeline={false}
+    sortByArticleTitle={true}
+  />
   <Footer />
 </DefaultLayout>
 

src/pages/article/translation/sort_by_timeline.astro

@@ -1,16 +1,21 @@
 ---
-import Footer from '../../../components/Footer.astro';
+import Footer from "../../../components/Footer.astro";
-import Nav from '../../../components/Nav.astro';
+import Nav from "../../../components/Nav.astro";
-import CollectionSummary from '../../../components/article/CollectionSummary.astro';
+import CollectionSummary from "../../../components/article/CollectionSummary.astro";
-import DefaultLayout from '../../../layouts/DefaultLayout.astro';
+import DefaultLayout from "../../../layouts/DefaultLayout.astro";
 ---
 
 <DefaultLayout title="翻译 - 李守中">
   <Nav />
   <div class="options">
-    <span>当前: [按日期降序] <a href="/article/translation/">按名字排序</a></span>
+    <span>当前: [按日期降序]</span>
+    <a href="/article/translation/">按名字排序</a>
   </div>
-  <CollectionSummary collectionName="translation" sortedByTimeline={true}/>
+  <CollectionSummary
+    collectionName="translation"
+    sortByTimeline={true}
+    sortByArticleTitle={false}
+  />
   <Footer />
 </DefaultLayout>