feat(farmer-activity): Add Support for photo upload

apps/picsa-apps/extension-app-native/.env.local

@@ -1 +1 @@
-SERVER_URL=http://192.168.50.67:4200
+SERVER_URL=http://192.168.0.106:4200

apps/picsa-tools/farmer-activity/src/app/components/components.module.ts

@@ -9,8 +9,9 @@ import { PicsaTranslateModule } from '@picsa/shared/modules';
 
 // Local components
 import { FarmerActivityMaterialModule } from './material.module';
+import { PhotoInputComponent } from './photo-input/photo-input.component';
 
-const Components = [];
+const Components = [PhotoInputComponent];
 
 @NgModule({
   imports: [
@@ -23,7 +24,7 @@ const Components = [];
     RouterModule,
     FarmerActivityMaterialModule,
   ],
-  exports: [PicsaCommonComponentsModule, FarmerActivityMaterialModule, PicsaVideoPlayerModule, ...Components],
+  exports: [...Components, PicsaCommonComponentsModule, FarmerActivityMaterialModule, PicsaVideoPlayerModule],
   declarations: [Components],
   providers: [],
 })

apps/picsa-tools/farmer-activity/src/app/components/material.module.ts

@@ -1,8 +1,9 @@
 import { NgModule } from '@angular/core';
+import { MatButtonModule } from '@angular/material/button';
 import { MatIconModule } from '@angular/material/icon';
 import { MatTabsModule } from '@angular/material/tabs';
 
-const COMPONENTS = [MatIconModule, MatTabsModule];
+const COMPONENTS = [MatIconModule, MatTabsModule, MatButtonModule];
 // use custom module to make it easier to control what is available through app
 @NgModule({
   imports: COMPONENTS,

apps/picsa-tools/farmer-activity/src/app/components/photo-input/photo-input.component.html

@@ -0,0 +1,14 @@
+<div>
+  <div class="uploads-section">
+    <h2>Uploaded Photos</h2>
+    <!-- For showing uploaded photos -->
+  </div>
+  <div class="sticky-footer">
+    <button mat-button mat-raised-button class="footer-button" color="primary">
+      <mat-icon>add_a_photo</mat-icon>
+      <span>
+        {{ 'Add Photo' | translate }}
+      </span>
+    </button>
+  </div>
+</div>

apps/picsa-tools/farmer-activity/src/app/components/photo-input/photo-input.component.spec.ts

@@ -0,0 +1,22 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PhotoInputComponent } from './photo-input.component';
+
+describe('PhotoInputComponent', () => {
+  let component: PhotoInputComponent;
+  let fixture: ComponentFixture<PhotoInputComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [PhotoInputComponent],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(PhotoInputComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

apps/picsa-tools/farmer-activity/src/app/components/photo-input/photo-input.component.ts

@@ -0,0 +1,8 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'farmer-activity-photo-input',
+  templateUrl: './photo-input.component.html',
+  styleUrl: './photo-input.component.scss',
+})
+export class PhotoInputComponent {}

apps/picsa-tools/farmer-activity/src/app/pages/activity-details/activity-details.component.html

@@ -34,7 +34,9 @@ <h2 *ngIf="videoUri">{{ videoResource.title | translate }}</h2>
         <mat-icon class="tab-icon">edit_square</mat-icon>
         {{ 'Activity' | translate }}
       </ng-template>
-      <div class="tab-content">Coming soon...</div>
+      <div class="tab-content">
+        <farmer-activity-photo-input />
+      </div>
     </mat-tab>
 
     <mat-tab *ngIf="activity.tool">
@@ -49,4 +51,5 @@ <h2 *ngIf="videoUri">{{ videoResource.title | translate }}</h2>
       </div>
     </mat-tab>
   </mat-tab-group>
+  <!--  -->
 </div>

apps/picsa-tools/resources-tool/src/assets/resources/contents.json

@@ -44,8 +44,8 @@
   "covers/facebook.svg": {
     "relativePath": "covers/facebook.svg",
     "size_kb": 1.1,
-    "md5Checksum": "a09b2f44f6b44b5b6e29aedba9f92029",
-    "modifiedTime": "2023-12-11T07:03:50.845Z"
+    "md5Checksum": "8626bc9119bd6b8bc0fa04e8a20b6e74",
+    "modifiedTime": "2022-09-28T20:19:52.986Z"
   },
   "covers/gap.jpg": {
     "relativePath": "covers/gap.jpg",
@@ -61,9 +61,9 @@
   },
   "covers/gender-equality.svg": {
     "relativePath": "covers/gender-equality.svg",
-    "size_kb": 5.4,
-    "md5Checksum": "95af38f37c2179d4ad0c5288cbb236ed",
-    "modifiedTime": "2023-12-11T07:03:50.846Z"
+    "size_kb": 5.5,
+    "md5Checksum": "0b6599c4d8b3a87b787910b18a9d8851",
+    "modifiedTime": "2022-11-01T20:27:18.286Z"
   },
   "covers/gras-nelk.jpg": {
     "relativePath": "covers/gras-nelk.jpg",
@@ -110,8 +110,8 @@
   "covers/spreadsheet.svg": {
     "relativePath": "covers/spreadsheet.svg",
     "size_kb": 2.8,
-    "md5Checksum": "0a1bc91188bbc03fda0a7cb2bc1aa6ce",
-    "modifiedTime": "2023-12-11T07:03:50.848Z"
+    "md5Checksum": "a03a4bfb0a1791fda8e232a8b032715b",
+    "modifiedTime": "2022-09-30T09:35:53.529Z"
   },
   "covers/twitter.png": {
     "relativePath": "covers/twitter.png",
@@ -121,15 +121,15 @@
   },
   "covers/videos.svg": {
     "relativePath": "covers/videos.svg",
-    "size_kb": 3.4,
-    "md5Checksum": "37516a0c19e20344d02960c6368dde62",
-    "modifiedTime": "2023-12-11T07:03:50.849Z"
+    "size_kb": 3.5,
+    "md5Checksum": "9bee23e2f74d07bd0cdd27bdc286e777",
+    "modifiedTime": "2023-09-25T18:01:08.322Z"
   },
   "covers/weather.svg": {
     "relativePath": "covers/weather.svg",
     "size_kb": 3.1,
-    "md5Checksum": "ca87f24916d258b8b8b5dd8343d4305b",
-    "modifiedTime": "2023-12-11T07:03:50.849Z"
+    "md5Checksum": "db07c7d20d9520124c251c810c5817fd",
+    "modifiedTime": "2022-09-28T19:22:58.064Z"
   },
   "covers/whatsapp.svg": {
     "relativePath": "covers/whatsapp.svg",