refactor: replace moment.js with date-fns across entire project

README.md

@@ -109,7 +109,7 @@ This project is the UI layer of HIH, built with modern web technologies:
 - [Ant Design for Angular (NG-ZORRO)](https://ng.ant.design/) — UI component library
 - [ECharts](https://echarts.apache.org/) — Data visualization
 - [ngx-echarts](https://github.com/xieziyu/ngx-echarts/) — ECharts integration for Angular
-- [Moment.js](https://momentjs.com/) — Date handling
+- [date-fns](https://date-fns.org/) — Date handling
 
 ## Development
 

angular.json

@@ -27,9 +27,6 @@
             ],
             "tsConfig": "tsconfig.app.json",
             "inlineStyleLanguage": "less",
-            "allowedCommonJsDependencies": [
-              "moment"
-            ],
             "assets": [
               "src/assets",
               {

package.json

@@ -35,10 +35,10 @@
     "@jsverse/transloco": "^8.3.0",
     "actslib": "^0.5.66",
     "angular-auth-oidc-client": "^21.0.2",
+    "date-fns": "^4.4.0",
     "echarts": "^6.0.0",
     "katex": "^0.16.21",
     "marked": "^18.0.0",
-    "moment": "^2.30.1",
     "monaco-editor": "^0.52.2",
     "ng-zorro-antd": "^21.2.2",
     "ngx-echarts": "^21.0.0",

src/app/model/blogmodel.ts

@@ -1,6 +1,6 @@
-import moment from 'moment';
+import { format, parse } from 'date-fns';
 import { SafeAny } from '@common/any';
-import { momentDateFormat } from './common';
+import { dateFormat } from './common';
 
 /* eslint-disable @typescript-eslint/naming-convention, no-underscore-dangle, id-blacklist, id-match */
 export const BlogPostStatus_Draft = 1;
@@ -142,8 +142,8 @@ export class BlogPost {
   public brief?: string;
   public content?: string;
   public status?: number;
-  public createdAt?: moment.Moment;
-  public updatedAt?: moment.Moment;
+  public createdAt?: Date;
+  public updatedAt?: Date;
   public BlogPostCollections: BlogPostCollection[];
   public BlogPostTags: BlogPostTag[];
 
@@ -154,7 +154,7 @@ export class BlogPost {
 
   get createdAtString(): string {
     if (this.createdAt) {
-      return this.createdAt.format(momentDateFormat);
+      return format(this.createdAt, dateFormat);
     }
     return '';
   }
@@ -172,10 +172,10 @@ export class BlogPost {
       this.BlogPostTags = data.BlogPostTags;
 
       if (data.CreatedAt) {
-        this.createdAt = moment(data.CreatedAt);
+        this.createdAt = parse(data.CreatedAt as string, dateFormat, new Date());
       }
       if (data.UpdatedAt) {
-        this.updatedAt = moment(data.UpdatedAt);
+        this.updatedAt = parse(data.UpdatedAt as string, dateFormat, new Date());
       }
     }
   }
@@ -192,10 +192,10 @@ export class BlogPost {
       BlogPostTags: this.BlogPostTags,
     };
     if (this.createdAt) {
-      rtnjson.CreatedAt = this.createdAt ? this.createdAt.format(momentDateFormat) : '';
+      rtnjson.CreatedAt = this.createdAt ? format(this.createdAt, dateFormat) : '';
     }
     if (this.updatedAt) {
-      rtnjson.UpdatedAt = this.updatedAt ? this.updatedAt.format(momentDateFormat) : '';
+      rtnjson.UpdatedAt = this.updatedAt ? format(this.updatedAt, dateFormat) : '';
     }
 
     return rtnjson;

src/app/model/common.spec.ts

@@ -13,12 +13,12 @@ import {
   TagTypeEnum,
   TagCount,
 } from './common';
-import moment from 'moment';
+import { getDate, getMonth } from 'date-fns';
 
 describe('isOverviewDateInScope', () => {
-  let dt: moment.Moment;
+  let dt: Date;
   beforeEach(() => {
-    dt = moment(); // Now
+    dt = new Date(); // Now
   });
 
   it('shall work', () => {
@@ -150,20 +150,20 @@ describe('getOverviewScopeRange', () => {
 
   it('CurrentMonth', () => {
     const rst = getOverviewScopeRange(OverviewScopeEnum.CurrentMonth);
-    expect(rst.BeginDate.date()).toEqual(1);
-    expect(rst.BeginDate.month()).toEqual(rst.EndDate.month());
+    expect(getDate(rst.BeginDate)).toEqual(1);
+    expect(getMonth(rst.BeginDate)).toEqual(getMonth(rst.EndDate));
   });
   it('CurrentYear', () => {
     const rst = getOverviewScopeRange(OverviewScopeEnum.CurrentYear);
-    expect(rst.BeginDate.date()).toEqual(1);
+    expect(getDate(rst.BeginDate)).toEqual(1);
   });
   it('PreviousMonth', () => {
     const rst = getOverviewScopeRange(OverviewScopeEnum.PreviousMonth);
-    expect(rst.BeginDate.date()).toEqual(1);
+    expect(getDate(rst.BeginDate)).toEqual(1);
   });
   it('PreviousYear', () => {
     const rst = getOverviewScopeRange(OverviewScopeEnum.PreviousYear);
-    expect(rst.BeginDate.date()).toEqual(1);
+    expect(getDate(rst.BeginDate)).toEqual(1);
   });
   it('CurrentWeek', () => {
     const rst = getOverviewScopeRange(OverviewScopeEnum.CurrentWeek);