Add persistence of metrics and sort by popular on home (#134)

- Closes #101

Author: sondreb

src/app/home/home.ts

@@ -17,6 +17,7 @@ import { DataService } from '../services/data';
 import { StorageService } from '../services/storage';
 import { UntypedFormBuilder, UntypedFormGroup, Validators } from '@angular/forms';
 import { UIService } from '../services/ui';
+import { MetricService } from '../services/metric-service';
 
 interface DefaultProfile {
   pubkey: string;
@@ -118,7 +119,8 @@ export class HomeComponent {
     private router: Router,
     private breakpointObserver: BreakpointObserver,
     private ngZone: NgZone,
-    private formBuilder: UntypedFormBuilder
+    private formBuilder: UntypedFormBuilder,
+    private metricService: MetricService
   ) {
     console.log('HOME constructor!!'); // Hm.. called twice, why?
   }
@@ -257,7 +259,11 @@ export class HomeComponent {
       this.profileService.following$.subscribe((profiles) => {
         // this.profileCount = Math.floor(window.innerWidth / this.profileThumbnailWidth);
         this.profileCount = 75;
-        this.profiles = profiles.slice(0, this.profileCount);
+        let slized = profiles.slice(0, this.profileCount);
+        let sorted = slized.sort((a, b) => {
+          return this.metricService.get(a.pubkey) < this.metricService.get(b.pubkey) ? 1 : -1;
+        });
+        this.profiles = sorted;
       })
     );
 

src/app/services/interfaces.ts

@@ -90,6 +90,7 @@ export interface StateDocument {
   since: number;
   modified?: number;
   mediaQueue: MediaItem [];
+  metrics: { users: any }
 }
 
 export interface NostrRelayDocument {

src/app/services/metric-service.ts

@@ -1,12 +1,19 @@
 import { Injectable } from '@angular/core';
+import { StorageService } from './storage';
 
 @Injectable({
   providedIn: 'root',
 })
 export class MetricService {
-  users: {
-    [pubKey: string]: number;
-  } = {};
+  constructor(private storage: StorageService) {}
+
+  get users(): { [pubKey: string]: number } {
+    if (!this.storage.state?.metrics?.users) {
+      this.storage.state.metrics = { users: {} };
+    }
+
+    return this.storage.state.metrics.users;
+  }
 
   increase(value: number, pubKey: string) {
     let existingMetric = this.users[pubKey];

src/app/services/storage.ts

@@ -27,7 +27,8 @@ export class StorageService {
       state = {
         id: 1,
         since: timeAgo,
-        mediaQueue: []
+        mediaQueue: [],
+        metrics: { users: {} },
       };
     }