Merge pull request #186 from e-picsa/feat/monitoring-tool-sync

Feat/monitoring tool sync

.vscode/settings.json

@@ -2,7 +2,15 @@
   "java.configuration.updateBuildConfiguration": "automatic",
   "cSpell.enabled": false,
   "eslint.runtime": "node",
+  // Deno configuration for supabase functions
+  // NOTE - could be refactored to separate code-workspace
+  // https://supabase.com/docs/guides/functions/local-development#setting-up-your-environment
   "deno.enable": true,
-  "deno.enablePaths": ["apps/picsa-server/docker", "apps/picsa-server/scripts"],
-  "deno.unstable": true
+  "deno.enablePaths": [
+    "apps/picsa-server/supabase/functions",
+    "apps/picsa-server/_deprecated/docker",
+    "apps/picsa-server/_deprecated/scripts"
+  ],
+  "deno.unstable": true,
+  "deno.config": "apps/picsa-server/supabase/functions/deno.jsonc"
 }

apps/picsa-apps/extension-app-native/android/app/build.gradle

@@ -7,8 +7,8 @@ android {
         applicationId "io.picsa.extension"
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
-        versionCode 3035001
-        versionName "3.35.1"
+        versionCode 3036000
+        versionName "3.36.0"
         testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
         aaptOptions {
              // Files and dirs to omit from the packaged assets dir, modified to accommodate modern web apps.

apps/picsa-apps/extension-app-native/android/app/capacitor.build.gradle

@@ -13,6 +13,7 @@ dependencies {
     implementation project(':capacitor-browser')
     implementation project(':capacitor-device')
     implementation project(':capacitor-filesystem')
+    implementation project(':capacitor-network')
     implementation project(':capacitor-blob-writer')
     implementation project(':capacitor-video-player')
     implementation project(':capacitor-community-firebase-analytics')

apps/picsa-apps/extension-app-native/android/app/src/main/AndroidManifest.xml

@@ -52,4 +52,5 @@
     <!-- Permissions -->
 
     <uses-permission android:name="android.permission.INTERNET" />
+    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
 </manifest>

apps/picsa-apps/extension-app-native/android/app/src/main/assets/capacitor.config.json

@@ -16,6 +16,7 @@
 		"@capacitor/core",
 		"@capacitor/device",
 		"@capacitor/filesystem",
+		"@capacitor/network",
 		"capacitor-blob-writer",
 		"capacitor-video-player",
 		"@capacitor-community/firebase-analytics",

apps/picsa-apps/extension-app-native/android/app/src/main/assets/capacitor.plugins.json

@@ -15,6 +15,10 @@
 		"pkg": "@capacitor/filesystem",
 		"classpath": "com.capacitorjs.plugins.filesystem.FilesystemPlugin"
 	},
+	{
+		"pkg": "@capacitor/network",
+		"classpath": "com.capacitorjs.plugins.network.NetworkPlugin"
+	},
 	{
 		"pkg": "capacitor-blob-writer",
 		"classpath": "com.equimaps.capacitorblobwriter.BlobWriter"

apps/picsa-apps/extension-app-native/android/capacitor.settings.gradle

@@ -14,6 +14,9 @@ project(':capacitor-device').projectDir = new File('../../../../node_modules/@ca
 include ':capacitor-filesystem'
 project(':capacitor-filesystem').projectDir = new File('../../../../node_modules/@capacitor/filesystem/android')
 
+include ':capacitor-network'
+project(':capacitor-network').projectDir = new File('../../../../node_modules/@capacitor/network/android')
+
 include ':capacitor-blob-writer'
 project(':capacitor-blob-writer').projectDir = new File('../../../../node_modules/capacitor-blob-writer/android')
 

apps/picsa-apps/extension-app-native/capacitor.config.ts

@@ -23,6 +23,7 @@ const config: CapacitorConfig = {
     '@capacitor/core',
     '@capacitor/device',
     '@capacitor/filesystem',
+    '@capacitor/network',
     'capacitor-blob-writer',
     'capacitor-video-player',
     '@capacitor-community/firebase-analytics',

apps/picsa-apps/extension-app/project.json

@@ -162,6 +162,16 @@
           "outputHashing": "all",
           "namedChunks": true,
           "statsJson": true
+        },
+        "sourcemaps": {
+          "fileReplacements": [
+            {
+              "replace": "libs/environments/src/environment.ts",
+              "with": "libs/environments/src/environment.prod.ts"
+            }
+          ],
+          "namedChunks": true,
+          "sourceMap": true
         }
       },
       "defaultConfiguration": "production"

apps/picsa-apps/extension-app/src/app/app.component.ts

@@ -2,6 +2,7 @@
 import { Component } from '@angular/core';
 import { Router } from '@angular/router';
 import { ENVIRONMENT } from '@picsa/environments';
+import { MonitoringToolService } from '@picsa/monitoring/src/app/services/monitoring-tool.service';
 import { ResourcesToolService } from '@picsa/resources/src/app/services/resources-tool.service';
 import { AnalyticsService } from '@picsa/shared/services/core/analytics.service';
 import { CrashlyticsService } from '@picsa/shared/services/core/crashlytics.service';
@@ -20,7 +21,8 @@ export class AppComponent {
     private router: Router,
     private performanceService: PerformanceService,
     private crashlyticsService: CrashlyticsService,
-    private resourcesService: ResourcesToolService
+    private resourcesService: ResourcesToolService,
+    private monitoringService: MonitoringToolService
   ) {
     this.init();
   }
@@ -33,5 +35,7 @@ export class AppComponent {
     }
     // eagerly load resources service to populate hardcoded resources
     this.resourcesService.ready();
+    // eagerly load monitoring service to sync form data
+    this.monitoringService.ready();
   }
 }

apps/picsa-apps/extension-app/src/app/material.module.ts

@@ -7,10 +7,12 @@ import { MatProgressBarModule } from '@angular/material/progress-bar';
 import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
 import { DomSanitizer } from '@angular/platform-browser';
 
+const modules = [MatButtonModule, MatIconModule, MatCardModule, MatProgressBarModule, MatProgressSpinnerModule];
+
 // use custom module to make it easier to control what is available through app
 @NgModule({
-  imports: [MatButtonModule, MatIconModule, MatCardModule, MatProgressBarModule, MatProgressSpinnerModule],
-  exports: [MatButtonModule, MatIconModule, MatCardModule, MatProgressBarModule, MatProgressSpinnerModule],
+  imports: modules,
+  exports: modules,
 })
 export class ExtensionToolkitMaterialModule {
   constructor(private matIconRegistry: MatIconRegistry, private domSanitizer: DomSanitizer) {

apps/picsa-apps/extension-app/src/app/pages/home/home.page.html

@@ -16,6 +16,12 @@
         <mat-icon [svgIcon]="link.icon" class="nav-icon"></mat-icon>
         <div class="nav-text">{{ link.name | translate }}</div>
       </div>
+      <div
+        class="tile-badge mat-elevation-z8"
+        *ngIf="link.tourId==='monitoring' && monitoringService.pendingSyncCount>0"
+      >
+        {{monitoringService.pendingSyncCount}}
+      </div>
     </div>
     <div class="grid-tile" (click)="startTour()" style="position: relative">
       <div style="text-align: center">

apps/picsa-apps/extension-app/src/app/pages/home/home.page.scss

@@ -49,6 +49,7 @@
 }
 
 .grid-tile {
+  position: relative;
   background: rgba(0, 0, 0, 0.65);
   color: white;
   cursor: pointer;
@@ -62,6 +63,25 @@
   transform: scale(1.02);
   transition: all 0.3s ease-out;
 }
+
+.tile-badge {
+  position: absolute;
+  top: -8px;
+  right: -6px;
+  background: var(--color-secondary);
+  border-radius: 50%;
+  height: 24px;
+  width: 24px;
+  line-height: 24px;
+  padding: 4px;
+  font-size: 16px;
+  text-align: center;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  font-weight: bold;
+  letter-spacing: 2px;
+}
+
 footer {
   display: flex;
   justify-content: space-between;

apps/picsa-apps/extension-app/src/app/pages/home/home.page.ts

@@ -4,6 +4,8 @@ import { Router } from '@angular/router';
 import { marker as translateMarker } from '@biesbjerg/ngx-translate-extract-marker';
 import { PicsaCommonComponentsService } from '@picsa/components/src';
 import { APP_VERSION, ENVIRONMENT } from '@picsa/environments';
+// eslint-disable-next-line @nx/enforce-module-boundaries
+import { MonitoringToolService } from '@picsa/monitoring/src/app/services/monitoring-tool.service';
 import { TourService } from '@picsa/shared/services/core/tour.service';
 import { CommunicationService } from '@picsa/shared/services/promptToHomePageService.service';
 import { Subscription } from 'rxjs';
@@ -112,6 +114,7 @@ export class HomePage implements OnDestroy, AfterViewInit {
     private router: Router,
     private componentsService: PicsaCommonComponentsService,
     private communicationService: CommunicationService,
+    public monitoringService: MonitoringToolService,
     private tourService: TourService
   ) {}