feat(apps): Update label model to include font color (#520)

Update the label model to include the font color that is of good contrast for the labels background color.

PR Close #520

apps/prs/src/models/pull-request.ts

@@ -0,0 +1,3 @@
+import {PullRequest as SharedPullRequest} from '../../../shared/models/app-models';
+
+export class PullRequest extends SharedPullRequest {}

apps/shared/models/base.ts

@@ -14,11 +14,9 @@ export abstract class BaseModel<T> {
     this.setData(data);
   }
 
-  protected setData(data: T) {
-    this.data = data;
-  }
+  protected setData(data: T) {}
 
-  static getByReference<T>(ref: FirestoreReference<T>): TypeFromFirestoreRef<typeof ref> {
+  static getByReference<T>(ref: FirestoreReference<T>): Promise<TypeFromFirestoreRef<typeof ref>> {
     return this.prototype.getByReference(ref);
   }
 

apps/shared/models/label.ts

@@ -1,14 +1,22 @@
 import {Label as GithubLabel} from '@octokit/webhooks-types';
 import {GithubBaseModel, GithubHelperFunctions, toFirestoreReference} from './base';
+import contrast from 'font-color-contrast';
 
 export interface FirestoreLabel {
   name: string;
   color: string;
 }
 
 export class Label extends GithubBaseModel<FirestoreLabel> {
-  readonly name = this.data.name;
-  readonly color = this.data.color;
+  name!: string;
+  color!: string;
+  fontColor!: string;
+
+  override setData(data: FirestoreLabel) {
+    this.name = data.name;
+    this.color = data.color;
+    this.fontColor = contrast(data.color, 0.6);
+  }
 
   static override githubHelpers: GithubHelperFunctions<Label, GithubLabel, FirestoreLabel> = {
     buildRefString(model: GithubLabel) {

apps/shared/models/pull-request.ts

@@ -33,25 +33,48 @@ export interface FirestorePullRequest {
 }
 
 export class PullRequest extends GithubBaseModel<FirestorePullRequest> {
-  readonly owner = this.data.owner;
-  readonly repo = this.data.repo;
-  readonly node = this.data.node;
-  readonly state = this.data.state;
-  readonly authorAssociation = this.data.authorAssociation;
-  readonly changeFiles = this.data.changedFiles;
-  readonly closedAt = this.data.closedAt;
-  readonly commits = this.data.commits;
-  readonly createdAt = this.data.createdAt;
-  readonly draft = this.data.draft;
-  readonly labels = this.data.labels;
-  readonly maintainerCanModify = this.data.maintainerCanModify;
-  readonly number = this.data.number;
-  readonly requestedReviewers = this.data.requestedReviewers;
-  readonly title = this.data.title;
-  readonly milestone = this.data.milestone;
-  readonly assignees = this.data.assignees;
-  readonly user = this.data.user;
-  readonly commit = this.data.commit;
+  owner!: string;
+  repo!: string;
+  node!: string;
+  state!: string;
+  authorAssociation!: string;
+  changeFiles!: number;
+  closedAt!: string | null;
+  commits!: number;
+  createdAt!: string;
+  draft!: boolean;
+  labels!: Label[];
+  maintainerCanModify!: boolean;
+  number!: number;
+  requestedReviewers!: User[];
+  title!: string;
+  milestone!: Milestone | null;
+  assignees!: User[];
+  user!: User;
+  commit!: string;
+  target: undefined | string;
+
+  override async setData(data: FirestorePullRequest) {
+    this.owner = data.owner;
+    this.repo = data.repo;
+    this.node = data.node;
+    this.state = data.state;
+    this.authorAssociation = data.authorAssociation;
+    this.changeFiles = data.changedFiles;
+    this.closedAt = data.closedAt;
+    this.commits = data.commits;
+    this.createdAt = data.createdAt;
+    this.draft = data.draft;
+    this.maintainerCanModify = data.maintainerCanModify;
+    this.number = data.number;
+    this.requestedReviewers = data.requestedReviewers as any;
+    this.title = data.title;
+    this.milestone = data.milestone as any;
+    this.assignees = data.assignees as any;
+    this.commit = data.commit;
+    User.getByReference(data.user).then((u) => (this.user = u));
+    Promise.all(data.labels.map((l) => Label.getByReference(l))).then((l) => (this.labels = l));
+  }
 
   static override githubHelpers: GithubHelperFunctions<
     PullRequest,

package.json

@@ -111,6 +111,7 @@
     "firebase-admin": "^10.0.2",
     "firebase-functions": "^3.19.0",
     "firebase-tools": "^10.5.0",
+    "font-color-contrast": "^11.1.0",
     "git-raw-commits": "^2.0.10",
     "glob": "7.2.0",
     "husky": "^7.0.1",

yarn.lock

@@ -465,6 +465,7 @@ __metadata:
     firebase-admin: ^10.0.2
     firebase-functions: ^3.19.0
     firebase-tools: ^10.5.0
+    font-color-contrast: ^11.1.0
     git-raw-commits: ^2.0.10
     glob: 7.2.0
     husky: ^7.0.1
@@ -8235,6 +8236,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"font-color-contrast@npm:^11.1.0":
+  version: 11.1.0
+  resolution: "font-color-contrast@npm:11.1.0"
+  checksum: 7c8af0690adc8ddfd8f3030bbce6d3345851fe78c0076fb5b3ab23568b241559fd2925f8923dc5e907faa4d49d79a03e5c04321b1551d04dbdd662a29857a968
+  languageName: node
+  linkType: hard
+
 "foreground-child@npm:^2.0.0":
   version: 2.0.0
   resolution: "foreground-child@npm:2.0.0"