feat: update single product page and checkout page

app/Actions/CreateOrder.php

@@ -4,7 +4,6 @@
 
 namespace App\Actions;
 
-use App\Models\Product;
 use Darryldecode\Cart\Facades\CartFacade;
 use Illuminate\Support\Facades\Auth;
 use Shopper\Core\Models\Country;
@@ -58,7 +57,7 @@ public function handle(): Order
             'number' => generate_number(),
             'customer_id' => $customer->id,
             'zone_id' => ZoneSessionManager::getSession()->zoneId,
-            'currency_code' => ZoneSessionManager::getSession()->currencyCode,
+            'currency_code' => current_currency(),
             'shipping_address_id' => $shippingAddress->id,
             'billing_address_id' => $billingAddress->id,
             'shipping_option_id' => data_get($checkout, 'shipping_option')[0]['id'],
@@ -74,7 +73,7 @@ public function handle(): Order
                 'name' => $item->name,
                 'sku' => $item->associatedModel->sku,
                 'product_id' => $item->id,
-                'product_type' => Product::class,
+                'product_type' => $item->associatedModel->getMorphClass(),
             ]);
         }
 

app/Livewire/Pages/SingleProduct.php

@@ -23,9 +23,11 @@ final class SingleProduct extends Component
     public function mount(): void
     {
         abort_unless($this->product->isPublished(), 404);
+
         $this->product->load([
             'brand',
             'media',
+            'inventoryHistories',
             'relatedProducts',
             'prices' => function ($query) {
                 $query->whereRelation('currency', 'code', current_currency());

app/Livewire/ShoppingCart.php

@@ -41,15 +41,14 @@ public function cartUpdated(): void
         $this->subtotal = CartFacade::session($this->sessionKey)->getSubTotal(); // @phpstan-ignore-line
     }
 
-    public function removeToCart(int $id): void
+    public function removeToCart(int $id, string $name): void
     {
         /** @var Product $product */
-        $product = Product::query()->find($id);
         CartFacade::session($this->sessionKey)->remove($id); // @phpstan-ignore-line
 
         Notification::make()
             ->title(__('Cart updated'))
-            ->body(__('The product ":name" has been removed from your cart !', ['name' => $product->name]))
+            ->body(__('The product ":name" has been removed from your cart !', ['name' => $name]))
             ->success()
             ->send();
 

app/Livewire/VariantsSelector.php

@@ -19,27 +19,31 @@ final class VariantsSelector extends Component
 
     public function mount(): void
     {
-        $this->selectedVariant?->load([
+        $this->selectedVariant?->loadMissing([
             'prices' => function ($query) {
                 $query->whereRelation('currency', 'code', current_currency());
             },
             'prices.currency',
         ]);
+
     }
 
     public function addToCart(): void
     {
-        $price = $this->selectedVariant && $this->selectedVariant->getPrice()
-            ? $this->selectedVariant->getPrice()->amount->amount
-            : $this->product->getPrice()->amount->amount;
+        $model = $this->selectedVariant ?? $this->product;
 
         // @phpstan-ignore-next-line
         CartFacade::session(session()->getId())->add([
-            'id' => $this->product->id,
+            'id' => $model->id,
             'name' => $this->product->name,
-            'price' => $price,
+            'price' => $model->getPrice()->amount->amount,
             'quantity' => 1,
-            'associatedModel' => $this->selectedVariant ?? $this->product,
+            'attributes' => $this->selectedVariant
+                ? $this->selectedVariant->values->mapWithKeys(function ($value) {
+                    return [$value->attribute->name => $value->value];
+                })->toArray()
+                : [],
+            'associatedModel' => $model,
         ]);
 
         $this->dispatch('cartUpdated');

resources/views/components/cart/element.blade.php

@@ -3,14 +3,34 @@
 @php
     $price = shopper_money_format(
         amount: $item->price * $item->quantity,
-        currency: \App\Actions\ZoneSessionManager::getSession()?->currencyCode
+        currency: current_currency(),
     );
+
+    $model = $item->associatedModel instanceof \App\Models\ProductVariant ? $item->associatedModel->product : $item->associatedModel;
 @endphp
 
 <li class="flex items-start py-6 space-x-4">
     <x-products.thumbnail :product="$item->associatedModel" class="size-20 border aspect-none border-primary-700" />
     <div class="flex-auto space-y-1">
-        <h3>{{ $item->name }}</h3>
+        <div>
+            <h3 class="font-medium font-heading">
+                <x-link :href="route('single-product', $model)">
+                    {{ $item->name }}
+                </x-link>
+            </h3>
+
+            @if($item->attributes->isNotEmpty())
+                <ul>
+                    @foreach($item->attributes as $name => $value)
+                        <li class="text-sm text-white">
+                            <span class=" font-medium">{{ $name }}</span>:
+                            <span >{{ $value }}</span>
+                        </li>
+                    @endforeach
+                </ul>
+            @endif
+        </div>
+
         <p class="text-gray-400">
             {{ __(':qty x :price', ['qty' => $item->quantity, 'price' => shopper_money_format($item->price, \App\Actions\ZoneSessionManager::getSession()?->currencyCode)]) }}
         </p>

resources/views/components/cart/item.blade.php

@@ -5,19 +5,35 @@
 @php
     $price = shopper_money_format(
         amount: $item->price * $item->quantity,
-        currency: \App\Actions\ZoneSessionManager::getSession()?->currencyCode
+        currency: current_currency(),
     );
+
+    $model = $item->associatedModel instanceof \App\Models\ProductVariant ? $item->associatedModel->product : $item->associatedModel;
 @endphp
 
 <li class="flex py-6">
     <x-products.thumbnail :product="$item->associatedModel" class="size-32 border border-gray-200 rounded-lg aspect-none" />
     <div class="flex flex-col flex-1 ml-4">
         <div class="flex justify-between text-base">
-            <h3 class="font-medium font-heading text-primary-900">
-                <x-link :href="route('single-product', $item->associatedModel)">
-                    {{ $item->name }}
-                </x-link>
-            </h3>
+            <div>
+                <h3 class="font-medium font-heading text-primary-900">
+                    <x-link :href="route('single-product', $model)">
+                        {{ $item->name }}
+                    </x-link>
+                </h3>
+
+                @if($item->attributes->isNotEmpty())
+                    <ul>
+                        @foreach($item->attributes as $name => $value)
+                            <li class="text-sm">
+                                <span class="text-gray-700 font-medium">{{ $name }}</span>:
+                                <span class="text-gray-500">{{ $value }}</span>
+                            </li>
+                        @endforeach
+                    </ul>
+                @endif
+            </div>
+
             <p class="ml-4 text-gray-700">
                 {{ $price }}
             </p>
@@ -30,7 +46,7 @@
             <div class="flex">
                 <button
                     type="button"
-                    wire:click="removeToCart('{{ $item->id }}')"
+                    wire:click="removeToCart('{{ $item->id }}', '{{ $item->name }}')"
                     class="inline-flex items-center px-2 py-1.5 bg-red-50 rounded-md text-xs gap-2 font-medium text-red-700 hover:bg-red-100"
                 >
                     <x-untitledui-trash-03 class="size-4" aria-hidden="true" />

resources/views/components/collections/card.blade.php

@@ -13,9 +13,4 @@ class="object-cover object-center max-w-none size-full"
     <h3 class="mt-4 text-base font-semibold text-gray-900 font-heading lg:text-lg">
         {{ $collection->name }}
     </h3>
-    @if ($collection->description)
-        <p class="mt-2 text-sm text-gray-500">
-            {{ $collection->description }}
-        </p>
-    @endif
 </x-link>

resources/views/livewire/components/variants-selector.blade.php

@@ -1,7 +1,7 @@
 <form class="mt-6" wire:submit="addToCart">
     @if ($product->variants->isNotEmpty())
         <fieldset>
-            <legend class="text-sm text-gray-500">
+            <legend class="text-md text-gray-500">
                 Variants: <span class="font-bold text-sm text-gray-700">{{ $selectedVariant?->name }}</span>
             </legend>
             <div class="mt-4 grid grid-cols-2 gap-4 sm:grid-cols-4">
@@ -11,7 +11,11 @@
                         @class([
                             'inline-flex items-center justify-center text-gray-500 font-medium hover:text-gray-900 px-3 py-2.5 rounded-md',
                             'border border-gray-200',
-                            'ring-2 ring-primary-600 ring-offset-2' => $selectedVariant && $selectedVariant->id === $variant->id
+                            'ring-2 ring-primary-600 ring-offset-2' => $selectedVariant && $selectedVariant->id === $variant->id,
+                            'border bg-neutral-100 px-2 py-1 relative z-10 cursor-not-allowed overflow-hidden bg-neutral-100
+                             text-neutral-500 ring-1 ring-neutral-300 before:absolute before:inset-x-0 before:-z-10 before:h-px
+                             before:-rotate-45 before:bg-neutral-300 before:transition-transform dark:bg-neutral-900 dark:text-neutral-400 dark:ring-neutral-700
+                             before:dark:bg-neutral-700' =>  $variant->stock < 1
                         ])
                     >
                         {{ $variant->name }}
@@ -25,9 +29,10 @@
         <x-buttons.primary
             type="submit"
             class="max-w-xs px-8 py-3 sm:w-full"
-            :disabled="$product->variants->isNotEmpty() && ! $selectedVariant"
+            :disabled="$product->isVariant() && ! $selectedVariant || $product->isVariant() && $this->selectedVariant && $this->selectedVariant->stock < 1 ||
+            ! $product->isVariant() && ! $product->stock < 1"
         >
-            {{ $product->variants->isNotEmpty() && ! $selectedVariant ? __('Choose any variant') : __('Add to cart') }}
+            {{ $product->isVariant() && ! $selectedVariant ? __('Choose any variant') : __('Add to cart') }}
         </x-buttons.primary>
 
         <x-buttons.primary type="button" class="px-4">

resources/views/livewire/pages/checkout.blade.php

@@ -10,7 +10,7 @@
                     <span class="sr-only">{{ shopper_setting('legal_name') }}</span>
                     <x-brand class="w-auto h-10 text-primary-700" aria-hidden="true" />
                 </x-link>
-                <x-link href="#" class="inline-flex items-center font-medium text-gray-600 hover:text-gray-900">
+                <x-link :href="route('store.products')" class="inline-flex items-center font-medium text-gray-600 hover:text-gray-900">
                     {{ __('Back to Shopping Cart') }}
                 </x-link>
             </div>

resources/views/livewire/pages/customer/orders/index.blade.php

@@ -13,7 +13,7 @@ class="w-12 h-12 text-gray-400"
             <p class="max-w-3xl mx-auto text-sm text-gray-500">
                 {{ __("You haven't ordered anything from us yet. Is this the day to change that?") }}
             </p>
-            <x-buttons.primary link="/" class="px-4 text-sm">
+            <x-buttons.primary :href="route('store.products')" class="px-4 text-sm">
                 {{ __('Continue shopping') }}
             </x-buttons.primary>
         </div>

resources/views/livewire/pages/single-product.blade.php

@@ -1,7 +1,7 @@
 <div class="bg-white">
     <div class="py-3 bg-white border-b border-gray-200 bg-opacity-80">
         <x-container class="flex items-center justify-between px-4">
-                {{ Breadcrumbs::render('product', $product) }}
+            {{ Breadcrumbs::render('product', $product) }}
         </x-container>
     </div>
 
@@ -87,7 +87,7 @@ class="text-base font-medium text-gray-900"
                 </section>
             @endif
 
-            <livewire:product.reviews :product="$product" />
+            <livewire:product.reviews :product="$product->load('ratings')" />
         </x-container>
     </div>
 </div>