https://tadaaa.co.uk/assets/controllers/mini_cart_item_controller-ae2f076e.js

1import BaseController from "controllers/base_controller";
2
3export default class extends BaseController {
4  static targets = [
5    "quantityDisplay",
6    "quantityInput",
7    "decreaseButton",
8    "increaseButton",
9    "productName",
10    "image",
11    "price",
12    "priceEach"
13  ]
14  static outlets = ["mini-cart-widget"]
15  static values = {
16    price: Number,
17    unitPrice: String,
18    minAmount: Number,
19    step: Number,
20    quantity: Number
21  }
22
23  connect() {
24
25  }
26
27  increase(event) {
28    event.preventDefault()
29    const newQuantity = this.quantityValue === 0 ? this.minAmountValue : this.quantityValue + this.stepValue
30    this.updateQuantity(newQuantity)
31  }
32
33  decrease(event) {
34    event.preventDefault()
35    const atMinimum = this.quantityValue <= this.minAmountValue
36    const newQuantity = atMinimum ? 0 : this.quantityValue - this.stepValue
37    this.updateQuantity(newQuantity)
38  }
39
40  updateQuantity(newQuantity) {
41    this.quantityValue = newQuantity
42    this.quantityDisplayTarget.textContent = newQuantity
43    this.quantityInputTarget.value = newQuantity
44    this.updatePriceDisplay(newQuantity)
45
46    if (newQuantity === 0) {
47      this.imageTarget.classList.add("opacity-50")
48      this.decreaseButtonTarget.disabled = true
49    } else {
50      this.imageTarget.classList.remove("opacity-50")
51      this.decreaseButtonTarget.disabled = false
52    }
53
54    this.miniCartWidgetOutlet.recalculate()
55  }
56
57  updatePriceDisplay(quantity) {
58    if (quantity === 0 || quantity === 1) {
59      this.priceTarget.textContent = this.unitPriceValue
60      this.priceEachTarget.classList.add("hidden")
61    } else {
62      const totalCents = this.priceValue * quantity
63      const totalPrice = this.formatPrice(totalCents)
64      this.priceTarget.textContent = totalPrice
65      this.priceEachTarget.classList.remove("hidden")
66    }
67  }
68
69  formatPrice(cents) {
70    return new Intl.NumberFormat('en-GB', {
71      style: 'currency',
72      currency: 'GBP',
73      minimumFractionDigits: 2,
74      maximumFractionDigits: 2
75    }).format(cents / 100)
76  }
77}