lint/prettier commit

src/app/@api/nft.api.ts

@@ -67,8 +67,9 @@ export class NftApi extends BaseApi<Nft> {
     return this.listen(nftId);
   }
 
-  public transferNft = (req: Build5Request<NftTransferRequest>): Observable<{ [key: string]: number } | undefined> =>
-    this.request(WEN_FUNC.nftTransfer, req);
+  public transferNft = (
+    req: Build5Request<NftTransferRequest>,
+  ): Observable<{ [key: string]: number } | undefined> => this.request(WEN_FUNC.nftTransfer, req);
 
   public successfullOrders(
     nftId: string,

src/app/@core/services/build5-error-lookup/build5-error-lookup.service.ts

@@ -1,16 +1,20 @@
 import { Injectable } from '@angular/core';
 import { WenError } from '@build-5/interfaces';
+import { AuthService } from '@components/auth/services/auth.service';
 
 @Injectable({
-  providedIn: 'root'
+  providedIn: 'root',
 })
 export class Build5ErrorLookupService {
+  constructor(
+    public auth: AuthService,
+  ) {
 
-  constructor() { }
+  }
 
   public getErrorMessage(errorCode: number): string {
     // Convert WenError object to an array and find the entry by error code
-    const errorEntry = Object.values(WenError).find(entry => entry.code === errorCode);
+    const errorEntry = Object.values(WenError).find((entry) => entry.code === errorCode);
     return errorEntry ? errorEntry.key : 'Unknown error';
   }
 }

src/app/@core/services/nft-selection/nft-selection.service.ts

@@ -2,7 +2,7 @@ import { Injectable } from '@angular/core';
 import { BehaviorSubject, Subject } from 'rxjs';
 
 @Injectable({
-  providedIn: 'root'
+  providedIn: 'root',
 })
 export class NftSelectionService {
   private selectedNftIdsSubject = new BehaviorSubject<string[]>([]);
@@ -18,7 +18,9 @@ export class NftSelectionService {
   }
 
   public deselectNft(nftId: string) {
-    const updatedSelectedNftIds = this.selectedNftIdsSubject.getValue().filter(id => id !== nftId);
+    const updatedSelectedNftIds = this.selectedNftIdsSubject
+      .getValue()
+      .filter((id) => id !== nftId);
     this.selectedNftIdsSubject.next(updatedSelectedNftIds);
   }
 

src/app/@shell/ui/footer/footer.component.ts

@@ -1,4 +1,5 @@
 import { ChangeDetectionStrategy, Component } from '@angular/core';
+import { AuthService } from '@components/auth/services/auth.service';
 
 @Component({
   selector: 'wen-footer',
@@ -8,5 +9,9 @@ import { ChangeDetectionStrategy, Component } from '@angular/core';
 })
 export class FooterComponent {
   // No need to inject NftSelectionService or maintain selectedCount$
-  constructor() { }
+  constructor(
+    public auth: AuthService,
+  ) {
+
+  }
 }

src/app/@shell/ui/footer/footer.module.ts

@@ -5,10 +5,7 @@ import { NftSelectionToolbarModule } from '@components/nft/components/nft-select
 
 @NgModule({
   declarations: [FooterComponent],
-  imports: [
-    CommonModule,
-    NftSelectionToolbarModule,
-  ],
+  imports: [CommonModule, NftSelectionToolbarModule],
   exports: [FooterComponent],
 })
 export class FooterModule {}

src/app/components/nft/components/nft-card/nft-card.component.html

@@ -53,19 +53,45 @@
         {{ getBadgeProperties().label }}
       </div>
 
-
       <div class="absolute top-4 right-4 z-10 flex items-center space-x-2">
         <div *ngIf="nftSelectable" class="flex items-center">
-          <label nz-checkbox [nzChecked]="nftSelected" (nzCheckedChange)="toggleNftSelection($event)">
+          <label
+            nz-checkbox
+            [nzChecked]="nftSelected"
+            (nzCheckedChange)="toggleNftSelection($event)"
+          >
           </label>
         </div>
 
         <!-- Badge or warning related to the collection or NFT -->
-        <div *ngIf="collection?.access !== targetAccess.OPEN || collection?.status !== collectionStatuses.MINTED" class="flex items-center">
-          <div *ngIf="collection?.status !== collectionStatuses.MINTED" nz-tooltip nzTooltipPlacement="bottom" i18n-nzTooltipTitle nzTooltipTitle="NFT is not yet migrated to the decentralized network." class="flex items-center justify-center w-8 h-8 rounded-full bg-alerts-warning dark:bg-alerts-warning-dark">
-            <wen-icon-link-broken class="text-foregrounds-primary dark:text-foregrounds-primary"></wen-icon-link-broken>
+        <div
+          *ngIf="
+            collection?.access !== targetAccess.OPEN ||
+            collection?.status !== collectionStatuses.MINTED
+          "
+          class="flex items-center"
+        >
+          <div
+            *ngIf="collection?.status !== collectionStatuses.MINTED"
+            nz-tooltip
+            nzTooltipPlacement="bottom"
+            i18n-nzTooltipTitle
+            nzTooltipTitle="NFT is not yet migrated to the decentralized network."
+            class="flex items-center justify-center w-8 h-8 rounded-full bg-alerts-warning dark:bg-alerts-warning-dark"
+          >
+            <wen-icon-link-broken
+              class="text-foregrounds-primary dark:text-foregrounds-primary"
+            ></wen-icon-link-broken>
           </div>
-          <wen-collection-access-badge *ngIf="!nft?.owner || (nft?.owner && nft?.saleAccess && nft?.saleAccess === targetNftAccess.MEMBERS)" [class.ml-2]="collection?.status !== collectionStatuses.MINTED" [type]="collection?.access || targetAccess.OPEN" [nft]="nft || undefined"></wen-collection-access-badge>
+          <wen-collection-access-badge
+            *ngIf="
+              !nft?.owner ||
+              (nft?.owner && nft?.saleAccess && nft?.saleAccess === targetNftAccess.MEMBERS)
+            "
+            [class.ml-2]="collection?.status !== collectionStatuses.MINTED"
+            [type]="collection?.access || targetAccess.OPEN"
+            [nft]="nft || undefined"
+          ></wen-collection-access-badge>
         </div>
       </div>
 

src/app/components/nft/components/nft-card/nft-card.component.ts

@@ -1,4 +1,14 @@
-import { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, Input, OnDestroy, OnInit, Output, SimpleChanges } from '@angular/core';
+import {
+  ChangeDetectionStrategy,
+  ChangeDetectorRef,
+  Component,
+  EventEmitter,
+  Input,
+  OnDestroy,
+  OnInit,
+  Output,
+  SimpleChanges,
+} from '@angular/core';
 import { Router } from '@angular/router';
 import { FileApi } from '@api/file.api';
 import { MemberApi } from '@api/member.api';
@@ -22,8 +32,7 @@ import {
   NftAccess,
 } from '@build-5/interfaces';
 import { BehaviorSubject, Subscription, combineLatest, map, startWith, take } from 'rxjs';
-import { NftSelectionService } from '@core/services/nft-selection/nft-selection.service'
-
+import { NftSelectionService } from '@core/services/nft-selection/nft-selection.service';
 
 @UntilDestroy()
 @Component({
@@ -70,15 +79,12 @@ export class NftCardComponent implements OnInit, OnDestroy {
 
   @Input() collection?: Collection | null;
 
-  //@Input() nftSelectable: boolean = false;
-  public nftSelectable: boolean = false;
-  //public showCheckbox: boolean = false;
+  public nftSelectable = false;
   @Output() selectionChange = new EventEmitter<any>();
-  public nftSelected: boolean = false;
+  public nftSelected = false;
   private nftSelectionSubscription$: Subscription = new Subscription();
 
   public mediaType: 'video' | 'image' | undefined;
-  //public isCheckoutOpen = false;
   public isBidOpen = false;
   public path = ROUTER_UTILS.config.nft.root;
   public owner$: BehaviorSubject<Member | undefined> = new BehaviorSubject<Member | undefined>(
@@ -103,26 +109,22 @@ export class NftCardComponent implements OnInit, OnDestroy {
 
   ngOnInit(): void {
     this.nftSelectionSubscription$.add(
-      this.nftSelectionService.selectedNftIds$
-        .subscribe(selectedIds => {
-          this.nftSelected = selectedIds.includes(this.nft?.uid || '');
-          this.cd.markForCheck();
-        })
+      this.nftSelectionService.selectedNftIds$.subscribe((selectedIds) => {
+        this.nftSelected = selectedIds.includes(this.nft?.uid || '');
+        this.cd.markForCheck();
+      }),
     );
 
-    const nftSelectableSub = combineLatest([
-      this.owner$,
-      this.auth.member$.pipe(startWith(null))
-    ])
-    .pipe(
-      map(([owner, member]) => {
-        return owner !== null && member !== null && owner?.uid === member?.uid;
-      })
-    )
-    .subscribe(isOwner => {
-      this.nftSelectable = isOwner && this.nft?.locked === false;
-      this.cd.markForCheck(); // Trigger change detection
-    });
+    const nftSelectableSub = combineLatest([this.owner$, this.auth.member$.pipe(startWith(null))])
+      .pipe(
+        map(([owner, member]) => {
+          return owner !== null && member !== null && owner?.uid === member?.uid;
+        }),
+      )
+      .subscribe((isOwner) => {
+        this.nftSelectable = isOwner && this.nft?.locked === false;
+        this.cd.markForCheck(); // Trigger change detection
+      });
 
     this.nftSelectionSubscription$.add(nftSelectableSub);
   }
@@ -221,20 +223,19 @@ export class NftCardComponent implements OnInit, OnDestroy {
 
   public toggleNftSelection(isChecked: boolean, event?: Event): void {
     if (event) {
-        event.stopPropagation();
+      event.stopPropagation();
     }
     this.nftSelected = isChecked;
 
     const action = isChecked ? 'select' : 'deselect';
     if (action === 'select') {
-        this.nftSelectionService.selectNft(this.nft?.uid || '');
+      this.nftSelectionService.selectNft(this.nft?.uid || '');
     } else {
-        this.nftSelectionService.deselectNft(this.nft?.uid || '');
+      this.nftSelectionService.deselectNft(this.nft?.uid || '');
     }
 
     this.cd.markForCheck();
-}
-
+  }
 
   ngOnDestroy() {
     if (this.nftSelectionSubscription$) {

src/app/components/nft/components/nft-selection-toolbar/nft-selection-toolbar.component.html

@@ -1,7 +1,11 @@
-<div *ngIf="selectedCount$ | async as selectedCount" @slideFromBottom class="fixed inset-x-0 bottom-0 bg-gray-100 text-gray-800 py-2 shadow bg-backgrounds-tertiary dark:bg-backgrounds-tertiary-dark pb-7 font-bold text-lg ml-20 mr-20 border-4 rounded-tl-lg rounded-tr-lg text-foregrounds-primary dark:text-foregrounds-primary-dark toolbar-box-shadow">
+<div
+  *ngIf="selectedCount$ | async as selectedCount"
+  @slideFromBottom
+  class="fixed inset-x-0 bottom-0 bg-gray-100 text-gray-800 py-2 shadow bg-backgrounds-tertiary dark:bg-backgrounds-tertiary-dark pb-7 font-bold text-lg ml-20 mr-20 border-4 rounded-tl-lg rounded-tr-lg text-foregrounds-primary dark:text-foregrounds-primary-dark toolbar-box-shadow"
+>
   <div *ngIf="selectedCount > 0">
     <div class="max-w-screen-xl mx-auto px-4 flex justify-between items-center">
-      <span class="text-lg">{{selectedCount}} item(s) selected</span>
+      <span class="text-lg">{{ selectedCount }} item(s) selected</span>
       <div class="flex space-x-2">
         <button nz-button nzType="link" class="text-lg" (click)="clearSelection()">Clear</button>
         <button nz-button nzType="default" (click)="openTransferModal()">Transfer</button>

src/app/components/nft/components/nft-selection-toolbar/nft-selection-toolbar.component.less

@@ -22,7 +22,7 @@
   user-select: none;
 }
 
-.checkbox-custom input[type="checkbox"] {
+.checkbox-custom input[type='checkbox'] {
   visibility: hidden; /* Hide the default checkbox */
   position: absolute;
 }
@@ -36,17 +36,17 @@
   background-color: #eee; /* Checkbox background */
 }
 
-.checkbox-custom input[type="checkbox"]:checked ~ .checkmark {
-  background-color: #2196F3; /* Checked state */
+.checkbox-custom input[type='checkbox']:checked ~ .checkmark {
+  background-color: #2196f3; /* Checked state */
 }
 
 .checkbox-custom .checkmark:after {
-  content: "";
+  content: '';
   position: absolute;
   display: none;
 }
 
-.checkbox-custom input[type="checkbox"]:checked ~ .checkmark:after {
+.checkbox-custom input[type='checkbox']:checked ~ .checkmark:after {
   display: block;
 }
 

src/app/components/nft/components/nft-selection-toolbar/nft-selection-toolbar.component.ts

@@ -4,7 +4,7 @@ import { trigger, state, style, transition, animate } from '@angular/animations'
 import { Observable } from 'rxjs';
 import { map } from 'rxjs/operators';
 import { NzModalRef, NzModalService } from 'ng-zorro-antd/modal';
-import { TransferModalComponent } from '@components/nft/components/nft-transfer/nft-transfer.component'
+import { TransferModalComponent } from '@components/nft/components/nft-transfer/nft-transfer.component';
 
 @Component({
   selector: 'wen-nft-selection-toolbar',
@@ -14,11 +14,9 @@ import { TransferModalComponent } from '@components/nft/components/nft-transfer/
     trigger('slideFromBottom', [
       transition(':enter', [
         style({ transform: 'translateY(100%)' }),
-        animate('300ms ease-out', style({ transform: 'translateY(0)' }))
+        animate('300ms ease-out', style({ transform: 'translateY(0)' })),
       ]),
-      transition(':leave', [
-        animate('300ms ease-in', style({ transform: 'translateY(100%)' }))
-      ])
+      transition(':leave', [animate('300ms ease-in', style({ transform: 'translateY(100%)' }))]),
     ]),
   ],
   changeDetection: ChangeDetectionStrategy.OnPush,
@@ -33,9 +31,7 @@ export class NftSelectionToolbarComponent implements OnInit {
 
   ngOnInit(): void {
     // Observable for the count of selected NFTs remains the same
-    this.selectedCount$ = this.nftSelectionService.selectedNftIds$.pipe(
-      map(ids => ids.length)
-    );
+    this.selectedCount$ = this.nftSelectionService.selectedNftIds$.pipe(map((ids) => ids.length));
   }
 
   public clearSelection() {
@@ -49,19 +45,15 @@ export class NftSelectionToolbarComponent implements OnInit {
       nzClassName: 'nft-transfer-modal',
       nzFooter: null,
       nzWidth: '75%',
-      nzComponentParams: {
-
-      },
-      nzOnOk: () => new Promise(resolve => setTimeout(resolve, 1000)),
+      nzComponentParams: {},
+      nzOnOk: () => new Promise((resolve) => setTimeout(resolve, 1000)),
       nzOnCancel: () => console.log('Cancel transfer'),
     });
 
-    modal.afterClose.subscribe(result => {
+    modal.afterClose.subscribe((result) => {
       const componentInstance = modal.getContentComponent();
       componentInstance.onModalClose();
       this.nftSelectionService.notifyModalClosed();
     });
   }
-
-
 }

src/app/components/nft/components/nft-selection-toolbar/nft-selection-toolbar.module.ts

@@ -3,16 +3,11 @@ import { CommonModule } from '@angular/common';
 import { NftSelectionToolbarComponent } from './nft-selection-toolbar.component';
 import { NzButtonModule } from 'ng-zorro-antd/button';
 import { NzModalModule } from 'ng-zorro-antd/modal';
-import { NftTransferModule } from '@components/nft/components/nft-transfer/nft-transfer.module'
+import { NftTransferModule } from '@components/nft/components/nft-transfer/nft-transfer.module';
 
 @NgModule({
   declarations: [NftSelectionToolbarComponent],
-  imports: [
-    CommonModule,
-    NzButtonModule,
-    NzModalModule,
-    NftTransferModule
-  ],
-  exports: [NftSelectionToolbarComponent]
+  imports: [CommonModule, NzButtonModule, NzModalModule, NftTransferModule],
+  exports: [NftSelectionToolbarComponent],
 })
 export class NftSelectionToolbarModule {}