diff --git a/src/app/@api/order.api.ts b/src/app/@api/order.api.ts index 414048a..71784d7 100644 --- a/src/app/@api/order.api.ts +++ b/src/app/@api/order.api.ts @@ -28,8 +28,9 @@ export class OrderApi extends BaseApi { public orderNft = (req: Build5Request): Observable => this.request(WEN_FUNC.orderNft, req); - public orderNfts = (req: Build5Request): Observable => - this.request(WEN_FUNC.orderNftBulk, req); + public orderNfts = ( + req: Build5Request, + ): Observable => this.request(WEN_FUNC.orderNftBulk, req); public orderToken = ( req: Build5Request, diff --git a/src/app/@shell/ui/header/header.component.html b/src/app/@shell/ui/header/header.component.html index 736b958..d6222f3 100644 --- a/src/app/@shell/ui/header/header.component.html +++ b/src/app/@shell/ui/header/header.component.html @@ -51,9 +51,14 @@ (click)="openShoppingCart()" > - + - + - diff --git a/src/app/components/cart/components/cart-modal/cart-modal.component.ts b/src/app/components/cart/components/cart-modal/cart-modal.component.ts index c79caa0..cb354c4 100644 --- a/src/app/components/cart/components/cart-modal/cart-modal.component.ts +++ b/src/app/components/cart/components/cart-modal/cart-modal.component.ts @@ -8,11 +8,7 @@ import { EventEmitter, Output, } from '@angular/core'; -import { - Nft, - Collection, - MIN_AMOUNT_TO_TRANSFER, - } from '@build-5/interfaces'; +import { Nft, Collection, MIN_AMOUNT_TO_TRANSFER } from '@build-5/interfaces'; import { Subscription, forkJoin, map, take, catchError, of } from 'rxjs'; import { CartService, CartItem } from './../../services/cart.service'; import { AuthService } from '@components/auth/services/auth.service'; @@ -23,12 +19,11 @@ import { CheckoutOverlayComponent } from '../checkout/checkout-overlay.component import { NftApi } from '@api/nft.api'; import { NzNotificationService } from 'ng-zorro-antd/notification'; - @Component({ selector: 'wen-app-cart-modal', templateUrl: './cart-modal.component.html', styleUrls: ['./cart-modal.component.less'], - changeDetection: ChangeDetectionStrategy.OnPush + changeDetection: ChangeDetectionStrategy.OnPush, }) export class CartModalComponent implements OnInit, OnDestroy { private subscriptions = new Subscription(); @@ -49,22 +44,26 @@ export class CartModalComponent implements OnInit, OnDestroy { ) {} ngOnInit() { - this.subscriptions.add(this.cartService.getCartItems().subscribe(items => { - // console.log('[CartModalComponent-ngOnInit] Cart items updated:', items); - this.cartItemsStatus = items.map(item => this.cartItemStatus(item)); - this.cartItemsQuantities = items.map(item => this.cartItemSaleAvailableQty(item)); - items.forEach(item => { - const originalPrice = this.calcPrice(item, 1); - const discountedPrice = this.calcPrice(item, this.discount(item.collection, item.nft)); - this.cartItemPrices[item.nft.uid] = { originalPrice, discountedPrice }; - }); - })); - - this.subscriptions.add(this.cartService.showCart$.subscribe(show => { - if (show) { - this.refreshCartData(); - } - })); + this.subscriptions.add( + this.cartService.getCartItems().subscribe((items) => { + // console.log('[CartModalComponent-ngOnInit] Cart items updated:', items); + this.cartItemsStatus = items.map((item) => this.cartItemStatus(item)); + this.cartItemsQuantities = items.map((item) => this.cartItemSaleAvailableQty(item)); + items.forEach((item) => { + const originalPrice = this.calcPrice(item, 1); + const discountedPrice = this.calcPrice(item, this.discount(item.collection, item.nft)); + this.cartItemPrices[item.nft.uid] = { originalPrice, discountedPrice }; + }); + }), + ); + + this.subscriptions.add( + this.cartService.showCart$.subscribe((show) => { + if (show) { + this.refreshCartData(); + } + }), + ); } cartItemsStatus: string[] = []; @@ -82,29 +81,31 @@ export class CartModalComponent implements OnInit, OnDestroy { const cartItems = this.cartService.getCartItems().getValue(); // console.log('Current cart items:', cartItems); - const freshDataObservables = cartItems.map(item => + const freshDataObservables = cartItems.map((item) => this.nftApi.getNftById(item.nft.uid).pipe( take(1), - map(freshNft => { + map((freshNft) => { // console.log(`Fetched fresh data for NFT ${item.nft.uid}:`, freshNft); return freshNft ? { ...item, nft: freshNft } : item; }), - catchError(error => { + catchError((error) => { // console.error(`Error fetching fresh data for NFT ${item.nft.uid}:`, error); return of(item); - }) - ) + }), + ), ); forkJoin(freshDataObservables).subscribe( - freshCartItems => { + (freshCartItems) => { // console.log('Fresh cart items:', freshCartItems); this.cartService.updateCartItems(freshCartItems); - this.cartItemsStatus = freshCartItems.map(item => this.cartItemStatus(item)); - this.cartItemsQuantities = freshCartItems.map(item => this.cartItemSaleAvailableQty(item)); - freshCartItems.forEach(item => { + this.cartItemsStatus = freshCartItems.map((item) => this.cartItemStatus(item)); + this.cartItemsQuantities = freshCartItems.map((item) => + this.cartItemSaleAvailableQty(item), + ); + freshCartItems.forEach((item) => { const originalPrice = this.calcPrice(item, 1); const discountedPrice = this.calcPrice(item, this.discount(item.collection, item.nft)); this.cartItemPrices[item.nft.uid] = { originalPrice, discountedPrice }; @@ -114,10 +115,10 @@ export class CartModalComponent implements OnInit, OnDestroy { this.cd.markForCheck(); }, - error => { + (error) => { console.error('Error while refreshing cart items: ', error); this.notification.error($localize`Error while refreshing cart items: ` + error, ''); - } + }, ); } @@ -129,7 +130,7 @@ export class CartModalComponent implements OnInit, OnDestroy { this.cartService.removeFromCart(itemId); } else { const cartItems = this.cartService.getCartItems().getValue(); - const itemIndex = cartItems.findIndex(cartItem => cartItem.nft.uid === itemId); + const itemIndex = cartItems.findIndex((cartItem) => cartItem.nft.uid === itemId); if (itemIndex !== -1) { cartItems[itemIndex].quantity = newQuantity; this.cartService.saveCartItems(); @@ -171,13 +172,13 @@ export class CartModalComponent implements OnInit, OnDestroy { public cartItemStatus(item: CartItem): any { // console.log("[cart-modal.component-cartItemStatus] function called"); const itemAvailable = this.cartService.isCartItemAvailableForSale(item); - if(itemAvailable) { + if (itemAvailable) { // console.log("[cart-modal.component-cartItemStatus] returning Available, itemAvailable: " + itemAvailable); return 'Available'; - }; + } // console.log("[cart-modal.component-cartItemStatus] returning Not Available, itemAvailable: " + itemAvailable); return 'Not Available'; - }; + } private cartItemSaleAvailableQty(item: CartItem): number { // console.log("[cart-modal.component-cartItemSaleAvailableQty] function called"); diff --git a/src/app/components/cart/components/checkout/checkout-overlay.component.html b/src/app/components/cart/components/checkout/checkout-overlay.component.html index 96e4947..a1be5fd 100644 --- a/src/app/components/cart/components/checkout/checkout-overlay.component.html +++ b/src/app/components/cart/components/checkout/checkout-overlay.component.html @@ -1,12 +1,18 @@
- Notice {{ unavailableItemCount }} items were not included in the checkout due to not being available for sale. + Notice {{ unavailableItemCount }} items were not included in + the checkout due to not being available for sale.

Network/Token: {{ group.tokenSymbol }}

Network/Token: {{ group.tokenSy nzSize="small" [ngClass]="{ 'table-dark': (themeService.theme$ | async) === themes.Dark, - 'table-light': (themeService.theme$ | async) === themes.Light}" + 'table-light': (themeService.theme$ | async) === themes.Light + }" > @@ -31,32 +38,58 @@

Network/Token: {{ group.tokenSy - - {{item.nft.name}} + + {{ item.nft.name }} - - {{item.collection.name}} + + {{ item.collection.name }} {{ item.quantity }} - {{ (item.salePrice | formatToken:(item.nft?.placeholderNft ? item.collection?.mintingData?.network : item.nft?.mintingData?.network):true:true) | async }} + {{ + item.salePrice + | formatToken + : (item.nft?.placeholderNft + ? item.collection?.mintingData?.network + : item.nft?.mintingData?.network) + : true + : true + | async + }} - {{ ((item.quantity * item.salePrice) | formatToken:(item.nft?.placeholderNft ? item.collection?.mintingData?.network : item.nft?.mintingData?.network):true:true) | async }} + {{ + item.quantity * item.salePrice + | formatToken + : (item.nft?.placeholderNft + ? item.collection?.mintingData?.network + : item.nft?.mintingData?.network) + : true + : true + | async + }} Total - {{ group.totalQuantity }} + + {{ group.totalQuantity }} + - {{ (group.totalPrice | formatToken : group.network : true : true) | async }} + {{ group.totalPrice | formatToken : group.network : true : true | async }} @@ -161,9 +194,7 @@

Network/Token: {{ group.tokenSy class="block w-full" *ngIf="!helper.isExpired(transaction$ | async)" [targetAddress]="targetAddress" - [formattedAmount]=" - targetAmount | formatToken : mintingDataNetwork : true | async - " + [formattedAmount]="targetAmount | formatToken : mintingDataNetwork : true | async" > diff --git a/src/app/components/cart/components/checkout/checkout-overlay.component.ts b/src/app/components/cart/components/checkout/checkout-overlay.component.ts index aaa32bf..a1ded8b 100644 --- a/src/app/components/cart/components/checkout/checkout-overlay.component.ts +++ b/src/app/components/cart/components/checkout/checkout-overlay.component.ts @@ -1,4 +1,12 @@ -import { Component, Input, OnInit, ChangeDetectorRef, ChangeDetectionStrategy, Output, EventEmitter, } from '@angular/core'; +import { + Component, + Input, + OnInit, + ChangeDetectorRef, + ChangeDetectionStrategy, + Output, + EventEmitter, +} from '@angular/core'; import { CartItem, CartService } from './../../services/cart.service'; import { CollectionType, @@ -25,6 +33,7 @@ import { ROUTER_UTILS } from '@core/utils/router.utils'; import { Router } from '@angular/router'; import { NzNotificationService } from 'ng-zorro-antd/notification'; import { NzModalRef } from 'ng-zorro-antd/modal'; +import { ThemeList, ThemeService } from '@core/services/theme'; export enum StepType { CONFIRM = 'Confirm', @@ -70,9 +79,12 @@ export class CheckoutOverlayComponent implements OnInit { unavailableItemCount = 0; cartItemPrices: { [key: string]: { originalPrice: number; discountedPrice: number } } = {}; public agreeTermsConditions = false; - public transaction$: BehaviorSubject = new BehaviorSubject(undefined); + public transaction$: BehaviorSubject = new BehaviorSubject< + Transaction | undefined + >(undefined); public history: HistoryItem[] = []; - public expiryTicker$: BehaviorSubject = new BehaviorSubject(null); + public expiryTicker$: BehaviorSubject = + new BehaviorSubject(null); public invalidPayment = false; public receivedTransactions = false; public targetAddress?: string; @@ -89,6 +101,7 @@ export class CheckoutOverlayComponent implements OnInit { public nftPath = ROUTER_UTILS.config.nft.root; public collectionPath: string = ROUTER_UTILS.config.collection.root; + public theme = ThemeList; constructor( private cartService: CartService, private auth: AuthService, @@ -101,8 +114,13 @@ export class CheckoutOverlayComponent implements OnInit { private router: Router, private nzNotification: NzNotificationService, private modalRef: NzModalRef, + public themeService: ThemeService, ) {} + public get themes(): typeof ThemeList { + return ThemeList; + } + ngOnInit() { // console.log('checkout-overlay ngOnInit called, running groupItems code.'); this.groupItems(); @@ -184,7 +202,7 @@ export class CheckoutOverlayComponent implements OnInit { // Load purchased NFTs. if (val.payload.nftOrders && val.payload.nftOrders.length > 0) { this.purchasedNfts = this.purchasedNfts || []; - val.payload.nftOrders.forEach(nftOrder => { + val.payload.nftOrders.forEach((nftOrder) => { firstValueFrom(this.nftApi.listen(nftOrder.nft)).then((obj) => { if (obj !== null && obj !== undefined) { const purchasedNft = obj as Nft; @@ -288,15 +306,21 @@ export class CheckoutOverlayComponent implements OnInit { groupItems() { // console.log('groupItems function called.') const groups: { [tokenSymbol: string]: GroupedCartItem } = {}; - this.items.forEach(item => { - const tokenSymbol = (item.nft?.placeholderNft ? item.collection?.mintingData?.network : item.nft?.mintingData?.network) || 'Unknown'; + this.items.forEach((item) => { + const tokenSymbol = + (item.nft?.placeholderNft + ? item.collection?.mintingData?.network + : item.nft?.mintingData?.network) || 'Unknown'; const discount = this.discount(item); const originalPrice = this.calcPrice(item, 1); const discountedPrice = this.calcPrice(item, discount); - const price = (this.discount(item) < 1) ? discountedPrice : originalPrice; + const price = this.discount(item) < 1 ? discountedPrice : originalPrice; item.salePrice = price; - const network = (item.nft?.placeholderNft ? item.collection?.mintingData?.network : item.nft?.mintingData?.network) || undefined; + const network = + (item.nft?.placeholderNft + ? item.collection?.mintingData?.network + : item.nft?.mintingData?.network) || undefined; if (this.cartService.isCartItemAvailableForSale(item)) { if (!groups[tokenSymbol]) { @@ -305,7 +329,7 @@ export class CheckoutOverlayComponent implements OnInit { items: [], totalQuantity: 0, totalPrice: 0, - network + network, }; } groups[tokenSymbol].items.push(item); @@ -412,17 +436,24 @@ export class CheckoutOverlayComponent implements OnInit { } public async initiateBulkOrder(): Promise { - const selectedGroup = this.groupedCartItems.find(group => group.tokenSymbol === this.selectedNetwork); + const selectedGroup = this.groupedCartItems.find( + (group) => group.tokenSymbol === this.selectedNetwork, + ); if (selectedGroup && selectedGroup.items.length > 0) { this.purchasedTokenSymbol = selectedGroup.tokenSymbol; const firstItem = selectedGroup.items[0]; - this.mintingDataNetwork = firstItem.nft?.placeholderNft ? firstItem.collection?.mintingData?.network : firstItem.nft?.mintingData?.network; + this.mintingDataNetwork = firstItem.nft?.placeholderNft + ? firstItem.collection?.mintingData?.network + : firstItem.nft?.mintingData?.network; } if (!selectedGroup || selectedGroup.items.length === 0) { console.warn('No network selected or no items in the selected network.'); - this.nzNotification.error($localize`No network selected or no items in the selected network.`, ''); + this.nzNotification.error( + $localize`No network selected or no items in the selected network.`, + '', + ); return; } @@ -440,7 +471,7 @@ export class CheckoutOverlayComponent implements OnInit { public convertGroupedCartItemsToNfts(selectedGroup: GroupedCartItem): NftPurchaseRequest[] { const nfts: NftPurchaseRequest[] = []; - selectedGroup.items.forEach(item => { + selectedGroup.items.forEach((item) => { if (item.nft && item.collection) { // console.log('[checkout-overlay.component-convertGroupedCartItemsToNfts] looped nft (item): ', item); @@ -465,37 +496,59 @@ export class CheckoutOverlayComponent implements OnInit { public async proceedWithBulkOrder(nfts: NftPurchaseRequest[]): Promise { // console.log('[checkout-overlay.component-proceddWithBulkOrder] nfts passed in: ', nfts) - const selectedGroup = this.groupedCartItems.find(group => group.tokenSymbol === this.selectedNetwork); + const selectedGroup = this.groupedCartItems.find( + (group) => group.tokenSymbol === this.selectedNetwork, + ); if (!selectedGroup) { console.warn('No network selected or no items in the selected network.'); - this.nzNotification.error($localize`No network selected or no items in the selected network.`, ''); + this.nzNotification.error( + $localize`No network selected or no items in the selected network.`, + '', + ); return; } if (nfts.length === 0 || !this.agreeTermsConditions) { console.warn('No NFTs to purchase or terms and conditions are not agreed.'); - this.nzNotification.error($localize`No NFTs to purchase or terms and conditions are not agreed.`, ''); + this.nzNotification.error( + $localize`No NFTs to purchase or terms and conditions are not agreed.`, + '', + ); return; } const bulkPurchaseRequest = { - orders: nfts + orders: nfts, }; // console.log('[checkout-overlay.component-proceddWithBulkOrder] params being passed for signing: ', bulkPurchaseRequest); await this.auth.sign(bulkPurchaseRequest, async (signedRequest, finish) => { this.notification - .processRequest(this.orderApi.orderNfts(signedRequest), $localize`Bulk order created.`, finish) + .processRequest( + this.orderApi.orderNfts(signedRequest), + $localize`Bulk order created.`, + finish, + ) .subscribe((transaction: Transaction | undefined) => { if (transaction) { this.transSubscription?.unsubscribe(); setItem(StorageItem.CheckoutTransaction, transaction.uid); - this.transSubscription = this.orderApi.listen(transaction.uid).subscribe(this.transaction$); - this.pushToHistory(transaction, transaction.uid, dayjs(), $localize`Waiting for transaction...`); + this.transSubscription = this.orderApi + .listen(transaction.uid) + .subscribe(this.transaction$); + this.pushToHistory( + transaction, + transaction.uid, + dayjs(), + $localize`Waiting for transaction...`, + ); } else { console.error('Transaction failed or did not return a valid transaction.'); - this.nzNotification.error($localize`Transaction failed or did not return a valid transaction.`, ''); + this.nzNotification.error( + $localize`Transaction failed or did not return a valid transaction.`, + '', + ); } }); }); diff --git a/src/app/components/cart/services/cart.service.ts b/src/app/components/cart/services/cart.service.ts index ff52cf1..01abd0a 100644 --- a/src/app/components/cart/services/cart.service.ts +++ b/src/app/components/cart/services/cart.service.ts @@ -1,10 +1,6 @@ import { Injectable } from '@angular/core'; import { BehaviorSubject } from 'rxjs'; -import { - Nft, - Collection, - MIN_AMOUNT_TO_TRANSFER, -} from '@build-5/interfaces'; +import { Nft, Collection, MIN_AMOUNT_TO_TRANSFER } from '@build-5/interfaces'; import { getItem, setItem, StorageItem } from './../../../@core/utils/local-storage.utils'; import { NzNotificationService } from 'ng-zorro-antd/notification'; import { HelperService } from '@pages/nft/services/helper.service'; @@ -18,10 +14,9 @@ export interface CartItem { } @Injectable({ - providedIn: 'root' + providedIn: 'root', }) export class CartService { - private showCartSubject = new BehaviorSubject(false); public showCart$ = this.showCartSubject.asObservable(); private cartItemsSubject = new BehaviorSubject(this.loadCartItems()); @@ -50,13 +45,20 @@ export class CartService { console.log('[CartService] addToCart function called. Adding cart item: ', cartItem); const currentItems = this.cartItemsSubject.value; - const isItemAlreadyInCart = currentItems.some(item => item.nft.uid === cartItem.nft.uid); + const isItemAlreadyInCart = currentItems.some((item) => item.nft.uid === cartItem.nft.uid); if (!isItemAlreadyInCart) { const updatedCartItems = [...currentItems, cartItem]; this.cartItemsSubject.next(updatedCartItems); this.saveCartItems(); - this.notification.success($localize`NFT ` + cartItem.nft.name + ` from collection ` + cartItem.collection.name + ` has been added to your cart.`, ''); + this.notification.success( + $localize`NFT ` + + cartItem.nft.name + + ` from collection ` + + cartItem.collection.name + + ` has been added to your cart.`, + '', + ); // console.log('[CartService] NFT added to cart:', cartItem); } else { // console.log('[CartService] NFT is already in the cart:', cartItem); @@ -66,21 +68,26 @@ export class CartService { public removeFromCart(itemId: string): void { // console.log('[CartService] removeFromCart function called.'); - const updatedCartItems = this.cartItemsSubject.value.filter(item => item.nft.uid !== itemId); + const updatedCartItems = this.cartItemsSubject.value.filter((item) => item.nft.uid !== itemId); this.cartItemsSubject.next(updatedCartItems); this.saveCartItems(); // console.log('[CartService-removeFromCart] Cart updated:', updatedCartItems); } public removeItemsFromCart(itemIds: string[]): void { - const updatedCartItems = this.cartItemsSubject.value.filter(item => !itemIds.includes(item.nft.uid)); + const updatedCartItems = this.cartItemsSubject.value.filter( + (item) => !itemIds.includes(item.nft.uid), + ); this.cartItemsSubject.next(updatedCartItems); this.saveCartItems(); } public removeGroupItemsFromCart(tokenSymbol: string): void { - const updatedCartItems = this.cartItemsSubject.value.filter(item => { - const itemTokenSymbol = (item.nft?.placeholderNft ? item.collection?.mintingData?.network : item.nft?.mintingData?.network) || 'Unknown'; + const updatedCartItems = this.cartItemsSubject.value.filter((item) => { + const itemTokenSymbol = + (item.nft?.placeholderNft + ? item.collection?.mintingData?.network + : item.nft?.mintingData?.network) || 'Unknown'; return itemTokenSymbol !== tokenSymbol; }); this.cartItemsSubject.next(updatedCartItems); @@ -124,7 +131,10 @@ export class CartService { } public getAvailableNftQuantity(cartItem: CartItem): number { - const isAvailableForSale = this.helperService.isAvailableForSale(cartItem.nft, cartItem.collection); + const isAvailableForSale = this.helperService.isAvailableForSale( + cartItem.nft, + cartItem.collection, + ); // console.log("[cart.service-getAvailableNftQuantity] function called for cartItem.nft.name: " + cartItem.nft.name + ", isAvailableForSale: " + isAvailableForSale); if (cartItem.nft.placeholderNft && isAvailableForSale) { diff --git a/src/app/components/nft/components/nft-card/nft-card.component.html b/src/app/components/nft/components/nft-card/nft-card.component.html index 2e61b60..1120b0f 100644 --- a/src/app/components/nft/components/nft-card/nft-card.component.html +++ b/src/app/components/nft/components/nft-card/nft-card.component.html @@ -238,11 +238,11 @@ > - - { this.notification .processRequest(this.orderApi.orderNft(sc), $localize`Order created.`, finish) .subscribe((val: any) => { - console.log('[nft-this.checkoutService.component-proceedWithOrder] val after processing: ', val); + console.log( + '[nft-this.checkoutService.component-proceedWithOrder] val after processing: ', + val, + ); this.transSubscription?.unsubscribe(); setItem(StorageItem.CheckoutTransaction, val.uid); this.transSubscription = this.orderApi.listen(val.uid).subscribe(this.transaction$); diff --git a/src/app/pages/award/pages/new/new.page.ts b/src/app/pages/award/pages/new/new.page.ts index f0ef978..700132b 100644 --- a/src/app/pages/award/pages/new/new.page.ts +++ b/src/app/pages/award/pages/new/new.page.ts @@ -17,7 +17,9 @@ import { TEST_AVAILABLE_MINTABLE_NETWORKS, Token, TokenStatus, - getDefDecimalIfNotSet, Network } from '@build-5/interfaces'; + getDefDecimalIfNotSet, + Network, +} from '@build-5/interfaces'; import { BehaviorSubject, of, Subscription, switchMap } from 'rxjs'; import { filter, map } from 'rxjs/operators'; import { AwardApi } from './../../../../@api/award.api'; diff --git a/src/app/pages/collection/pages/collection/nfts/collectionNfts.service.ts b/src/app/pages/collection/pages/collection/nfts/collectionNfts.service.ts index 6292e0c..c345567 100644 --- a/src/app/pages/collection/pages/collection/nfts/collectionNfts.service.ts +++ b/src/app/pages/collection/pages/collection/nfts/collectionNfts.service.ts @@ -4,7 +4,7 @@ import { Nft, Collection } from '@build-5/interfaces'; import { CartService } from '@components/cart/services/cart.service'; @Injectable({ - providedIn: 'root' + providedIn: 'root', }) export class CollectionNftStateService { private listedNftsSubject = new BehaviorSubject([]); @@ -12,9 +12,7 @@ export class CollectionNftStateService { private availableNftsCountSubject = new BehaviorSubject(0); public availableNftsCount$ = this.availableNftsCountSubject.asObservable(); - constructor( - private cartService: CartService, - ) { } + constructor(private cartService: CartService) {} public setListedNfts(nfts: Nft[], collection: Collection) { this.listedNftsSubject.next(nfts); @@ -22,7 +20,9 @@ export class CollectionNftStateService { } private updateAvailableNftsCount(nfts: Nft[], collection: Collection) { - const availableNftsCount = nfts.filter(nft => this.cartService.isNftAvailableForSale(nft, collection)).length; + const availableNftsCount = nfts.filter((nft) => + this.cartService.isNftAvailableForSale(nft, collection), + ).length; this.availableNftsCountSubject.next(availableNftsCount); } @@ -30,5 +30,3 @@ export class CollectionNftStateService { return this.listedNftsSubject.getValue(); } } - - diff --git a/src/app/pages/collection/pages/collection/nfts/nfts.page.html b/src/app/pages/collection/pages/collection/nfts/nfts.page.html index 407b310..f49c797 100644 --- a/src/app/pages/collection/pages/collection/nfts/nfts.page.html +++ b/src/app/pages/collection/pages/collection/nfts/nfts.page.html @@ -10,15 +10,26 @@
- + {{ state.nbHits | number }} records
- +
{{ sweepCount }} - +
@@ -38,7 +49,7 @@ >
Filters&Sort
-

+
{ @@ -91,16 +92,16 @@ export class CollectionNFTsPage implements OnInit, OnChanges, OnDestroy { this.collectionNftStateService.setListedNfts(this.originalNfts, this.collection); } }, - error: err => { + error: (err) => { // console.error('Error fetching collection:', err); this.notification.error($localize`Error occurred while fetching collection.`, ''); - } + }, }); } this.collectionNftStateService.availableNftsCount$ .pipe(takeUntil(this.destroy$)) - .subscribe(count => { + .subscribe((count) => { this.availableNftsCount = count; }); @@ -166,40 +167,42 @@ export class CollectionNFTsPage implements OnInit, OnChanges, OnDestroy { return; } - this.collectionApi.getCollectionById(this.collectionId) + this.collectionApi + .getCollectionById(this.collectionId) .pipe( take(1), filter((collection): collection is Collection => collection !== undefined), switchMap((collection: Collection) => { const listedNfts = this.collectionNftStateService.getListedNfts(); - const nftsForSale = listedNfts.filter(nft => - this.cartService.isNftAvailableForSale(nft, collection) + const nftsForSale = listedNfts.filter((nft) => + this.cartService.isNftAvailableForSale(nft, collection), ); - const nftsToAdd = nftsForSale - .slice(0, Math.min(count, 20)) - .sort((a, b) => { - const priceA = a.availablePrice != null ? a.availablePrice : 0; - const priceB = b.availablePrice != null ? b.availablePrice : 0; - return priceA - priceB; - }); + const nftsToAdd = nftsForSale.slice(0, Math.min(count, 20)).sort((a, b) => { + const priceA = a.availablePrice != null ? a.availablePrice : 0; + const priceB = b.availablePrice != null ? b.availablePrice : 0; + return priceA - priceB; + }); - nftsToAdd.forEach(nft => { + nftsToAdd.forEach((nft) => { const cartItem = { nft, collection, quantity: 1, salePrice: 0 }; this.cartService.addToCart(cartItem); }); - this.notification.success($localize`NFTs swept into your cart, open cart to review added items.`, ''); + this.notification.success( + $localize`NFTs swept into your cart, open cart to review added items.`, + '', + ); return nftsToAdd; }), - takeUntil(this.destroy$) + takeUntil(this.destroy$), ) .subscribe({ - error: err => { + error: (err) => { this.notification.error($localize`Error occurred while fetching collection.`, ''); - } + }, }); } diff --git a/src/app/pages/nft/pages/nft/nft.page.html b/src/app/pages/nft/pages/nft/nft.page.html index f77166b..fed7c6f 100644 --- a/src/app/pages/nft/pages/nft/nft.page.html +++ b/src/app/pages/nft/pages/nft/nft.page.html @@ -4,19 +4,19 @@ + > NFT + > {{ getCollectionTypeString(collectionType) }} + > {{ getCollectionStatusString(collectionMinting) }} {{ getTitle(data.nft$ | async) }} nzBlock nzSize="large" i18n - style="margin-top:5px;margin-bottom:5px;" + style="margin-top: 5px; margin-bottom: 5px" > Add to Cart diff --git a/src/app/pages/nft/pages/nft/nft.page.ts b/src/app/pages/nft/pages/nft/nft.page.ts index e6c3926..ebab3fe 100644 --- a/src/app/pages/nft/pages/nft/nft.page.ts +++ b/src/app/pages/nft/pages/nft/nft.page.ts @@ -120,7 +120,7 @@ export class NFTPage implements OnInit, OnDestroy { } public ngOnInit(): void { - this.data.nft$.subscribe(nft => { + this.data.nft$.subscribe((nft) => { // console.log('[OnInit] Current NFT:', nft); this.currentNft = nft; }); @@ -418,7 +418,10 @@ export class NFTPage implements OnInit, OnDestroy { if (status === null || status === undefined) { return 'Unknown'; } - console.log('[nft.page-getCollectionStatusString] return collection status: ', CollectionStatus[status]); + console.log( + '[nft.page-getCollectionStatusString] return collection status: ', + CollectionStatus[status], + ); return CollectionStatus[status]; } @@ -555,7 +558,7 @@ export class NFTPage implements OnInit, OnDestroy { if (nft && this.data.collection$) { // console.log('[addToCart-this.data.collection$.value', this.data.collection$.value) // console.log('[addToCart-this.data.nft$.value', this.data.nft$.value) - this.data.collection$.pipe(take(1)).subscribe(collection => { + this.data.collection$.pipe(take(1)).subscribe((collection) => { if (collection) { this.cartService.addToCart({ nft, collection, quantity: 1, salePrice: 0 }); // console.log('Added to cart:', nft, collection); diff --git a/src/app/pages/nft/services/helper.service.ts b/src/app/pages/nft/services/helper.service.ts index 3a6b75f..f0e5081 100644 --- a/src/app/pages/nft/services/helper.service.ts +++ b/src/app/pages/nft/services/helper.service.ts @@ -127,12 +127,10 @@ export class HelperService { // console.log(`[getDate] Original input:`, date); if (typeof date === 'object') { if (date?.toDate) { - const dateFromObject = date.toDate(); // console.log(`[getDate] Object with toDate method detected, toDate result:`, dateFromObject); return dateFromObject; } else if (date?.seconds) { - const dateFromSeconds = new Date(date.seconds * 1000); // Convert to milliseconds // console.log(`[getDate] Object with seconds property detected, converted to Date:`, dateFromSeconds); return dateFromSeconds; @@ -180,12 +178,10 @@ export class HelperService { return false; } - - const isAvail = ( + const isAvail = col.approved === true && !!this.getDate(nft.availableFrom) && - dayjs(this.getDate(nft.availableFrom)).isSameOrBefore(dayjs(), 's') - ); + dayjs(this.getDate(nft.availableFrom)).isSameOrBefore(dayjs(), 's'); // console.log("[NFT helper.service.ts] isAvailableForSale function returning " + isAvail + ". nft name: " + nft?.name + ", col name: " + col?.name + ". nft.availableFrom: " + nft.availableFrom.seconds); // console.log("col.approved: " + (col.approved === true)); // console.log("!!this.getDate(nft.availableFrom): " + !!this.getDate(nft.availableFrom) + ", this.getDate(nft.availableFrom): " + this.getDate(nft.availableFrom));