Merge Dfg/sum24-involvemint into Develop

.gitignore

@@ -12,6 +12,7 @@ azure-pipelines.yml
 
 # dependencies
 /node_modules
+package-lock.json
 
 # IDEs and editors
 /.idea
@@ -48,4 +49,4 @@ gcp-service-key-prod.json
 gcp-api-key-prod.json
 
 reports/*
-!reports/readme.md
+!reports/readme.md

apps/migrate/src/app/app.service.ts

@@ -211,6 +211,7 @@ export class AppService {
               sendingTransactions: [],
               sendingVouchers: [],
               view: null,
+              tags: ep.tags
             };
           })
           .filter((u) => !!u)

docker-compose.yml

@@ -55,4 +55,3 @@ services:
       - .docker/firebase-emulators/.firebaserc:/.firebaserc
     command: >
       sh -c "firebase emulators:start --import=firebase-local-data --export-on-exit=firebase-local-data"
-

libs/client/ep/shell/src/lib/storefront/storefront.component.html

@@ -48,6 +48,21 @@
                 </im-error>
               </im-item>
 
+              <im-item [touched]="true" label="Add Tags">
+                <ion-item>
+                  <ion-select (ionChange)="onTagSelected($event)" placeholder="Select a tag">
+                    <ion-select-option *ngFor="let tag of availableTags" [value]="tag">{{ tag }}</ion-select-option>
+                  </ion-select>
+                </ion-item>
+              </im-item>
+
+              <div style="margin-bottom: 20px;" class="tags" *ngIf="storeFrontForm.get('tags')?.value.length > 0">
+                <div class="tag" *ngFor="let tag of storeFrontForm.get('tags')?.value; let i = index">
+                  <span >{{ tag }}</span>
+                  <ion-icon name="close-circle" (click)="removeTag(i)"></ion-icon>
+                </div>
+              </div>
+
               <div>
                 <div class="im-primary-text">Storefront Images:</div>
                 <div class="images-cont">

libs/client/ep/shell/src/lib/storefront/storefront.component.scss

@@ -15,3 +15,33 @@
     color: black;
   }
 }
+
+.tags {
+  display:flex ; 
+  gap: 10px ; 
+}
+.tag {
+  background-color: var(--ion-color-primary) ; 
+  padding: 4px 8px ;  
+  border-radius: 8px ;
+  color:white ; 
+  display:flex ; 
+  align-items: center;
+  gap: 2px ; 
+
+}
+
+.tags {
+  display:flex ; 
+  gap: 10px ; 
+}
+.tag {
+  background-color: var(--ion-color-primary) ; 
+  padding: 4px 8px ;  
+  border-radius: 8px ;
+  color:white ; 
+  display:flex ; 
+  align-items: center;
+  gap: 2px ; 
+}
+

libs/client/ep/shell/src/lib/storefront/storefront.component.ts

@@ -1,6 +1,8 @@
 import { ChangeDetectionStrategy, Component, OnInit, ViewChild } from '@angular/core';
 import { Validators } from '@angular/forms';
 import { ActivatedRoute } from '@angular/router';
+
+
 import {
   ImImagesViewerModalService,
   UserFacade,
@@ -17,7 +19,9 @@ import {
 } from '@involvemint/shared/domain';
 import { tapOnce, UnArray } from '@involvemint/shared/util';
 import { FormControl, FormGroup } from '@ngneat/reactive-forms';
-import { filter, skip, switchMap, tap } from 'rxjs/operators';
+import { filter, skip, switchMap, tap, take } from 'rxjs/operators';
+
+import { FormBuilder} from '@angular/forms';
 
 type Profile = NonNullable<UnArray<UserStoreModel['exchangeAdmins']>['exchangePartner']>;
 
@@ -36,12 +40,14 @@ interface State {
 })
 export class StorefrontComponent extends StatefulComponent<State> implements OnInit {
   @ViewChild('tabs') tabs!: ImTabsComponent;
+  availableTags: string[] = ['Essentials', 'Arts & Entertainment', 'Professional Services', 'Trades', 'Rentals', 'Farming/Land', 'Food & Food Services', 'Health & Wellness', 'Transportation', 'Home Services', 'Youth', 'Seniors', 'Education/Training', 'Retail', 'Media & Print', 'Free'];
 
   readonly storeFrontForm = new FormGroup({
     listStoreFront: new FormControl<StorefrontListingStatus>(defaultProjectListingStatus, (e) =>
       Validators.required(e)
     ),
     description: new FormControl('', [Validators.maxLength(ImConfig.maxDescriptionLength)]),
+    tags: new FormControl<string[]>([])
   });
 
   readonly listingOptions: StorefrontListingStatus[] = ['public', 'private', 'unlisted'];
@@ -63,7 +69,7 @@ export class StorefrontComponent extends StatefulComponent<State> implements OnI
       if (!activeTab) {
         return;
       }
-      // re-route to same route to remove queryParams (activeTab)
+
       this.route.to.ep.storefront.ROOT({
         queryParams: {
           activeTab: undefined,
@@ -76,10 +82,10 @@ export class StorefrontComponent extends StatefulComponent<State> implements OnI
       activeTab === 'storefront'
         ? this.tabs.setIndex(0)
         : activeTab === 'offers'
-        ? this.tabs.setIndex(1)
-        : activeTab === 'requests'
-        ? this.tabs.setIndex(2)
-        : this.tabs.setIndex(0);
+          ? this.tabs.setIndex(1)
+          : activeTab === 'requests'
+            ? this.tabs.setIndex(2)
+            : this.tabs.setIndex(0);
     });
 
     this.effect(() =>
@@ -92,6 +98,7 @@ export class StorefrontComponent extends StatefulComponent<State> implements OnI
           this.storeFrontForm.patchValue({
             listStoreFront: exchangePartner.listStoreFront,
             description: exchangePartner.description,
+            tags: exchangePartner.tags
           });
         }),
         tap((exchangePartner) => {
@@ -109,12 +116,37 @@ export class StorefrontComponent extends StatefulComponent<State> implements OnI
           this.user.epProfile.dispatchers.editEpProfile({
             listStoreFront: form.listStoreFront,
             description: form.description,
+            tags: form.tags,
           });
+        }),
+
+        tap((form) => {
+
+          if (form.listStoreFront === 'private' || form.listStoreFront === 'unlisted') {
+            this.user.offers.selectors.offers$.pipe(
+              take(1),
+              tap(({ offers }) => {
+                offers.forEach(offer => {
+                  this.user.offers.dispatchers.update({
+                    offerId: offer.id,
+                    changes: {
+                      listingStatus: form.listStoreFront,
+                      name: offer.name,
+                      description: offer.description,
+                      price: offer.price
+                    },
+                  });
+
+                });
+              })
+            ).subscribe();
+          }
         })
       )
     );
   }
 
+
   tabChangeEvent(event: number) {
     if (typeof event !== 'number') {
       return;
@@ -132,7 +164,7 @@ export class StorefrontComponent extends StatefulComponent<State> implements OnI
     let files: File[] | undefined;
     try {
       files = parseMultipleFiles(event);
-    } catch (error) {
+    } catch (error:any) {
       this.status.presentAlert({ title: 'Error', description: error.message });
     }
 
@@ -145,6 +177,26 @@ export class StorefrontComponent extends StatefulComponent<State> implements OnI
     this.user.epProfile.dispatchers.deleteEpImage(imagesFilePathsIndex);
   }
 
+  addTag(tag: string) {
+    console.log("we are hereeeeee")
+    const currentTags = this.storeFrontForm.get('tags')?.value || [];
+    if (tag && !currentTags.includes(tag)) {
+      this.storeFrontForm.get('tags')?.patchValue([...currentTags, tag]);
+      console.log('Updated Tags:', this.storeFrontForm.get('tags')?.value);
+    }
+  }
+
+  onTagSelected(event: any) {
+    const selectedTag = event.detail.value;
+    this.addTag(selectedTag);
+  }
+
+  removeTag(index: number): void {
+    const currentTags = [...this.storeFrontForm.get('tags')?.value]; // Make a copy of the array
+    currentTags.splice(index, 1);
+    this.storeFrontForm.get('tags')?.patchValue([...currentTags]);
+}
+
   makeCoverPhoto(
     ep: UnArray<UserStoreModel['exchangeAdmins']>['exchangePartner'],
     imagesFilePathsIndex: number

libs/client/login/src/lib/login-page/login-page.component.html

@@ -26,18 +26,20 @@
         </im-item>
         <im-item [touched]="true">
           <ion-icon slot="start" name="lock-closed"></ion-icon>
-          <input formControlName="password" name="password" type="password" placeholder="Password" />
+
+          <input formControlName="password" name="password" type="password" placeholder="Password"
+            [type]="isPasswordVisible ? 'text' : 'password'" />
+          <a class="type-toggle" (click)="togglePasswordVisibility()">
+            <ion-icon class="show-option" [hidden]="isPasswordVisible" name="eye-off-outline"></ion-icon>
+            <ion-icon class="hide-option" [hidden]="!isPasswordVisible" name="eye-outline"></ion-icon>
+          </a>
           <im-error *ngIf="!loginForm.controls.password.valid && loginForm.controls.password.touched">
             Please enter your password.
           </im-error>
         </im-item>
 
         <!-- Implicit button for form when pressing enter button -->
-        <button
-          style="display: none"
-          [disabled]="!loginForm.valid"
-          test-attr="login-submit-implicit-button"
-        ></button>
+        <button style="display: none" [disabled]="!loginForm.valid" test-attr="login-submit-implicit-button"></button>
       </form>
       <ion-button [disabled]="!loginForm.valid" (click)="submit()" test-attr="login-submit-button">
         Log In
@@ -49,4 +51,4 @@
       </span>
     </div>
   </ion-content>
-</ng-container>
+</ng-container>

libs/client/login/src/lib/login-page/login-page.component.ts

@@ -17,6 +17,7 @@ interface State {
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class LoginPageComponent extends StatefulComponent<State> implements OnInit {
+  isPasswordVisible = false;
   readonly loginForm = new FormGroup({
     email: new FormControl('', [(c) => Validators.required(c), Validators.pattern(ImConfig.regex.email)]),
     password: new FormControl('', (c) => Validators.required(c)),
@@ -69,4 +70,8 @@ export class LoginPageComponent extends StatefulComponent<State> implements OnIn
   async forgotPassword() {
     return this.route.to.forgotPassword.ROOT({ animation: 'back' });
   }
+
+  togglePasswordVisibility(): void {
+    this.isPasswordVisible = !this.isPasswordVisible;
+  }
 }

libs/client/login/src/lib/sign-up/sign-up.component.html

@@ -26,19 +26,28 @@
         </im-item>
         <im-item [touched]="true">
           <ion-icon slot="start" name="lock-closed"></ion-icon>
-          <input formControlName="password" placeholder="Password" name="password" type="password" />
+
+          <input formControlName="password" placeholder="Password" name="password"
+            [type]="isPasswordVisible ? 'text' : 'password'" />
+
+          <a class="type-toggle" (click)="togglePasswordVisibility()">
+            <ion-icon class="show-option" [hidden]="isPasswordVisible" name="eye-off-outline"></ion-icon>
+            <ion-icon class="hide-option" [hidden]="!isPasswordVisible" name="eye-outline"></ion-icon>
+          </a>
+
           <im-error *ngIf="!signUpForm.controls.password.valid && signUpForm.controls.password.touched">
             {{ pwdValidationText }}
           </im-error>
         </im-item>
         <im-item [touched]="true">
           <ion-icon slot="start" name="lock-closed"></ion-icon>
-          <input
-            formControlName="confirmPassword"
-            placeholder="Confirm Password"
-            name="password"
-            type="password"
-          />
+
+          <input formControlName="confirmPassword" placeholder="Confirm Password" name="password"
+            [type]="isConfirmPasswordVisible ? 'text' : 'password'" />
+          <a class="type-toggle" (click)="toggleConfirmPasswordVisibility()">
+            <ion-icon class="show-option" [hidden]="isConfirmPasswordVisible" name="eye-off-outline"></ion-icon>
+            <ion-icon class="hide-option" [hidden]="!isConfirmPasswordVisible" name="eye-outline"></ion-icon>
+          </a>
           <im-error *ngIf="signUpForm.controls.password.touched && signUpForm.getError('notSame')">
             Your passwords do not match.
           </im-error>
@@ -51,12 +60,8 @@
         <!-- Implicit button for form when pressing enter button -->
         <button style="display: none" [disabled]="!signUpForm.valid"></button>
       </form>
-      <ion-button
-        [style.margin-top]="'var(--im-padding)'"
-        [disabled]="!signUpForm.valid"
-        test-attr="sign-up-submit-button"
-        (click)="submit()"
-      >
+      <ion-button [style.margin-top]="'var(--im-padding)'" [disabled]="!signUpForm.valid"
+        test-attr="sign-up-submit-button" (click)="submit()">
         Sign Up
       </ion-button>
       <span [style.margin-top]="'var(--im-padding)'">
@@ -65,4 +70,4 @@
       </span>
     </div>
   </ion-content>
-</ng-container>
+</ng-container>

libs/client/login/src/lib/sign-up/sign-up.component.ts

@@ -1,4 +1,4 @@
-import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
+import { ChangeDetectionStrategy, Component, ContentChild, OnInit } from '@angular/core';
 import { ValidationErrors, Validators } from '@angular/forms';
 import { ActivatedRoute } from '@angular/router';
 import { ImLegalModalInputs, ImLegalModalService, UserFacade } from '@involvemint/client/shared/data-access';
@@ -20,8 +20,11 @@ interface State {
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class SignUpComponent extends StatefulComponent<State> implements OnInit {
+  isPasswordVisible = false;
+  isConfirmPasswordVisible = false;
   readonly signUpForm = new FormGroup(
     {
+
       email: new FormControl(
         '',
         Validators.compose([(c) => Validators.required(c), Validators.pattern(ImConfig.regex.email)])
@@ -48,6 +51,7 @@ export class SignUpComponent extends StatefulComponent<State> implements OnInit
     private readonly uf: UserFacade,
     private readonly activatedRoute: ActivatedRoute,
     private readonly legalModal: ImLegalModalService
+
   ) {
     super({ errorStatus: '' });
   }
@@ -98,7 +102,16 @@ export class SignUpComponent extends StatefulComponent<State> implements OnInit
     this.updateState({ errorStatus: '' });
   }
 
+  togglePasswordVisibility(): void {
+    this.isPasswordVisible = !this.isPasswordVisible;
+  }
+
+  toggleConfirmPasswordVisibility(): void {
+    this.isConfirmPasswordVisible = !this.isConfirmPasswordVisible;
+  }
   // doGoogleLogin(): void {
   //   this.uf.session.dispatchers.googleSignIn(environment.authPersistance);
   // }
 }
+
+