Merge branch 'dev' into main

package.json

@@ -11,44 +11,45 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "^16.0.1",
-    "@angular/common": "^16.0.1",
-    "@angular/compiler": "^16.0.1",
-    "@angular/core": "^16.0.1",
-    "@angular/forms": "^16.0.1",
-    "@angular/platform-browser": "^16.0.1",
-    "@angular/platform-browser-dynamic": "^16.0.1",
-    "@angular/router": "^16.0.1",
+    "@angular/animations": "^16.0.3",
+    "@angular/common": "^16.0.3",
+    "@angular/compiler": "^16.0.3",
+    "@angular/core": "^16.0.3",
+    "@angular/forms": "^16.0.3",
+    "@angular/platform-browser": "^16.0.3",
+    "@angular/platform-browser-dynamic": "^16.0.3",
+    "@angular/router": "^16.0.3",
     "@fortawesome/fontawesome-free": "^6.4.0",
     "@ngx-matomo/router": "^4.1.0",
     "@ngx-matomo/tracker": "^4.1.0",
+    "json-to-graphql-query": "^2.2.5",
+    "npm-check-updates": "^16.10.12",
     "primeicons": "^6.0.1",
-    "primeng": "^16.0.0-rc.1",
+    "primeng": "^16.0.0-rc.2",
     "rxjs": "~7.8.1",
-    "tslib": "^2.5.0",
+    "tslib": "^2.5.2",
     "zone.js": "~0.13.0"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^16.0.1",
-    "@angular-eslint/builder": "16.0.1",
-    "@angular-eslint/eslint-plugin": "16.0.1",
-    "@angular-eslint/eslint-plugin-template": "16.0.1",
-    "@angular-eslint/schematics": "16.0.1",
-    "@angular-eslint/template-parser": "16.0.1",
-    "@angular/cli": "~16.0.1",
-    "@angular/compiler-cli": "^16.0.1",
-    "@types/jasmine": "~4.3.1",
-    "@typescript-eslint/eslint-plugin": "5.59.5",
-    "@typescript-eslint/parser": "5.59.5",
-    "eslint": "^8.40.0",
+    "@angular-devkit/build-angular": "^16.0.3",
+    "@angular-eslint/builder": "16.0.2",
+    "@angular-eslint/eslint-plugin": "16.0.2",
+    "@angular-eslint/eslint-plugin-template": "16.0.2",
+    "@angular-eslint/schematics": "16.0.2",
+    "@angular-eslint/template-parser": "16.0.2",
+    "@angular/cli": "~16.0.3",
+    "@angular/compiler-cli": "^16.0.3",
+    "@types/jasmine": "~4.3.2",
+    "@typescript-eslint/eslint-plugin": "5.59.7",
+    "@typescript-eslint/parser": "5.59.7",
+    "eslint": "^8.41.0",
     "eslint-config-airbnb": "^19.0.4",
     "eslint-config-airbnb-typescript": "^17.0.0",
-    "jasmine-core": "~4.6.0",
+    "jasmine-core": "~5.0.0",
     "karma": "~6.4.2",
     "karma-chrome-launcher": "~3.2.0",
     "karma-coverage": "~2.2.0",
     "karma-jasmine": "~5.1.0",
-    "karma-jasmine-html-reporter": "~2.0.0",
     "typescript": "~5.0.4"
   }
 }

src/app/app.component.ts

@@ -1,5 +1,6 @@
 import { Component, OnInit } from '@angular/core';
-import { ThemeService } from 'src/app/services/theme.service';
+import { InitializerService } from './services/initializer.service';
+import { ToastService } from './services/toast.service';
 
 @Component({
   selector: 'jm-root',
@@ -9,18 +10,26 @@ import { ThemeService } from 'src/app/services/theme.service';
 export class AppComponent implements OnInit {
   public loading = true;
 
-  private _fakeLoadingDelay = 500;
-
-  ngOnInit(): void {
-    this.fakeLoading();
+  private async initializeApp() {
+    try {
+      await this._init.initialize();
+    } catch (err) {
+      console.error(err);
+      this._tsts.error({
+        summary: 'App initialization failed',
+        detail: 'Something went wrong while initializing the portfolio.',
+      });
+    } finally {
+      this.loading = false;
+    }
   }
 
-  private fakeLoading() : void {
-    this.loading = true;
-    setTimeout(() => {
-      this.loading = false;
-    }, this._fakeLoadingDelay);
+  ngOnInit(): void {
+    this.initializeApp();
   }
 
-  constructor(public ths: ThemeService) { }
+  constructor(
+    private _init: InitializerService,
+    private _tsts: ToastService,
+  ) { }
 }

src/app/classes/Duration.ts

@@ -0,0 +1,54 @@
+import { SECONDS_IN_DAY, SECONDS_IN_MONTH, SECONDS_IN_YEAR } from '../constants/time';
+import { TimeThreshold } from './TimeThreshold';
+
+const THRESHOLDS: TimeThreshold[] = [
+  new TimeThreshold('year', SECONDS_IN_YEAR),
+  new TimeThreshold('month', SECONDS_IN_MONTH),
+  new TimeThreshold('day', SECONDS_IN_DAY),
+].sort(TimeThreshold.sort);
+
+export class Duration {
+  public lastTimeStr!: string;
+
+  public get start(): Date { return this._start; }
+
+  public set start(start: Date) {
+    this._start = start;
+    this.updateTimeStr();
+  }
+
+  public get end(): Date { return this._end; }
+
+  public set end(end: Date) {
+    this._end = end;
+    this.updateTimeStr();
+  }
+
+  private updateTimeStr(): void {
+    this.lastTimeStr = this.asString();
+  }
+
+  /** @returns Time between end and start, in milliseconds */
+  public msPassed() : number {
+    return this._end.getTime() - this._start.getTime();
+  }
+
+  /** @returns approximate time passed during the duration */
+  public asString(): string {
+    const msPassed = this.msPassed();
+    const secondsPassed = msPassed / 1000;
+
+    const matchedThreshold = THRESHOLDS.find((threshold: TimeThreshold) => threshold.durationIsAtLeastThreshold(secondsPassed)) || THRESHOLDS[THRESHOLDS.length - 1];
+
+    const result: string = matchedThreshold.asString(secondsPassed, 'less than a day');
+
+    return result;
+  }
+
+  constructor(
+    private _start: Date,
+    private _end: Date,
+  ) {
+    this.updateTimeStr();
+  }
+}

src/app/classes/Employer.ts

@@ -0,0 +1,17 @@
+export interface IEmployerOpts {
+  name: string;
+  website?: string;
+  photoUrl?: string;
+}
+
+export class Employer implements IEmployerOpts {
+  public name!: string;
+
+  public website?: string | undefined;
+
+  public photoUrl?: string | undefined;
+
+  constructor(opts: IEmployerOpts) {
+    Object.assign(this, opts);
+  }
+}

src/app/classes/Job.ts

@@ -0,0 +1,18 @@
+import { Duration } from './Duration';
+import { Employer } from './Employer';
+
+export interface IJobOpts {
+  title: string;
+  timespan: Duration;
+  employer: Employer;
+}
+
+export class Job implements IJobOpts {
+  public title!: string;
+
+  public timespan!: Duration;
+
+  public employer!: Employer;
+
+  constructor(opts: IJobOpts) { Object.assign(this, opts);}
+}

src/app/classes/nav-item.class.ts → src/app/classes/NavItem.ts

@@ -1,13 +1,13 @@
 import { MenuItem } from 'primeng/api';
-import { ConditionalClassList } from './conditional-class-list.class';
+import { ConditionalClassList } from './ConditionalClassList';
 import {
   CommandNavigationItemOpts,
   ExternalLinkNavigationItemOpts,
   NavigationItemOpts,
   RouterNavigationItemOpts,
 } from '../types/nav-item.type';
 import { ViewControllerService } from '../services/view-controller.service';
-import { assignEntriesToObject } from '../util/ctor.util';
+import { assignEntriesToObject } from '../util/ctor';
 
 export class NavigationItem {
   public key!: string;

src/app/classes/Resume.ts

@@ -0,0 +1,5 @@
+/*
+
+export class ResumeItem {
+  public job
+} */

src/app/classes/Skill.ts

@@ -0,0 +1,45 @@
+import { IPicture } from '../interfaces/Picture';
+import { Duration } from './Duration';
+
+export interface ISkillOpts {
+  label: string;
+  description?: string;
+  picture?: IPicture;
+  acquired_at: Date;
+}
+
+export interface ISkillClassificationOpts {
+  label: string;
+  picture?: IPicture;
+  skills: ISkillOpts[];
+}
+
+export class SkillClassification implements ISkillClassificationOpts {
+  public label!: string;
+
+  public picture?: IPicture;
+
+  public skills: Skill[] = [];
+
+  constructor(opts: ISkillClassificationOpts) {
+    Object.assign(this, opts);
+  }
+}
+
+export class Skill implements ISkillOpts {
+  public label!: string;
+
+  public picture?: IPicture;
+
+  public description?: string;
+
+  public acquired_at!: Date;
+
+  public duration!: Duration;
+
+  constructor(opts: ISkillOpts) {
+    Object.assign(this, opts);
+    this.acquired_at = new Date(this.acquired_at);
+    this.duration = new Duration(this.acquired_at, new Date());
+  }
+}

src/app/classes/TimeThreshold.ts

@@ -0,0 +1,26 @@
+import { pluralString } from '../util/string';
+
+export class TimeThreshold {
+  public static sort(a: TimeThreshold, b: TimeThreshold) : -1 | 0 | 1 {
+    if (a.minimumSeconds === b.minimumSeconds) return 0;
+
+    if (a.minimumSeconds <= b.minimumSeconds) return 1;
+
+    return -1;
+  }
+
+  public durationIsAtLeastThreshold(seconds: number): boolean {
+    return this.minimumSeconds <= seconds;
+  }
+
+  public asString(seconds: number, fallback: string) {
+    if (!this.durationIsAtLeastThreshold(seconds)) return fallback;
+
+    const numOfDuration = Math.ceil(seconds / this.minimumSeconds);
+
+    return `${numOfDuration} ${pluralString(this.singularBase, numOfDuration, this.pluralSuffix)}`;
+  }
+
+
+  constructor(public singularBase: string, public minimumSeconds: number, public pluralSuffix = 's') {}
+}

src/app/constants/time.ts

@@ -0,0 +1,3 @@
+export const SECONDS_IN_YEAR = 31536000;
+export const SECONDS_IN_MONTH = SECONDS_IN_YEAR / 12;
+export const SECONDS_IN_DAY = SECONDS_IN_YEAR / 365.24;

src/app/interfaces/attributed-resource.interface.ts → src/app/interfaces/AttributedResource.ts

@@ -1,4 +1,4 @@
-import { ITextLinkOptional } from './text-link-optional.interface';
+import { ITextLinkOptional } from './TextLinkOptional';
 
 export interface IAttributedResource {
   label: ITextLinkOptional

src/app/interfaces/File.ts

@@ -0,0 +1,3 @@
+export interface IFile {
+  address: string;
+}

src/app/interfaces/icon.interface.ts → src/app/interfaces/Icon.ts

@@ -1,4 +1,4 @@
 export interface IICon {
-  iconCode: string;
+  class: string;
   style?: any;
 }

src/app/interfaces/Image.ts

@@ -0,0 +1,6 @@
+import { IFile } from './File';
+
+export interface IImage {
+  alt_text: string;
+  file: IFile
+}

src/app/interfaces/Picture.ts

@@ -0,0 +1,7 @@
+import { IICon } from './Icon';
+import { IImage } from './Image';
+
+export interface IPicture {
+  icon?: IICon;
+  image?: IImage;
+}

src/app/modules/shared/components/attribution/attribution.component.ts

@@ -1,5 +1,5 @@
 import { Component } from '@angular/core';
-import { IAttributedResource } from 'src/app/interfaces/attributed-resource.interface';
+import { IAttributedResource } from 'src/app/interfaces/AttributedResource';
 
 
 @Component({

src/app/modules/shared/page-not-found/page-not-found.component.ts

@@ -1,6 +1,5 @@
 import { Location } from '@angular/common';
 import { Component } from '@angular/core';
-import { Router } from '@angular/router';
 import { ExternalSitesService } from 'src/app/services/external-sites.service';
 
 @Component({