Export starter kit

README.md

@@ -5,20 +5,21 @@
 <!-- /statamic:hide -->
 
 ## Features
-- Galleries collection to show off your work
-- Private galleries to share photo-sessions with your clients
-- Categorize your galleries with the categories taxonomy
+- Show your work with the galleries collection
+- Share photos with private galleries
+- Categorize galleries with the categories taxonomy
 - Interactive categories filter linking to the taxonomy term page
-- Responsive images for fast load times
-- Page builder with blocks for galleries, bio, forms, and more
+- Responsive and lazy-loaded images for fast load times
+- Build trust with client testimonials
+- Page builder with blocks for galleries, bio, testimonials, forms, and more
 - Pricing cards
 - Inquiry form
 - Clean & modern design
 - Beautifully responsive
 - Built with [Livewire](https://livewire.laravel.com/), [Alpine.js](https://github.com/alpinejs/alpine), and [TailwindCSS](https://tailwindcss.com)
 
 ### Private Galleries
-- Password protection with a beautiful login page
+- Password protection with gallery-aware login page
 - Image processing with options for watermark and low-res images
 - Download and like individual images
 - Download a zip of all images or a selection thereof

app/Jobs/ProcessImages.php

@@ -2,14 +2,14 @@
 
 namespace App\Jobs;
 
+use Illuminate\Contracts\Queue\ShouldQueue;
+use Illuminate\Foundation\Queue\Queueable;
 use Illuminate\Http\File;
+use Illuminate\Support\Collection;
+use Statamic\Contracts\Assets\Asset;
 use Statamic\Facades\Glide;
 use Statamic\Facades\GlobalSet;
 use Statamic\Globals\Variables;
-use Illuminate\Support\Collection;
-use Statamic\Contracts\Assets\Asset;
-use Illuminate\Foundation\Queue\Queueable;
-use Illuminate\Contracts\Queue\ShouldQueue;
 
 class ProcessImages implements ShouldQueue
 {
@@ -32,7 +32,7 @@ public function handle(): void
         }
 
         $this->assets
-            ->filter->isImage()
+            ->filter(fn (Asset $asset) => $asset->extensionIsOneOf(['jpg', 'jpeg', 'png', 'webp']))
             ->each($this->processAsset(...));
     }
 

app/Listeners/ProcessImages.php

@@ -2,9 +2,11 @@
 
 namespace App\Listeners;
 
-use Statamic\Events\EntrySaved;
-use Illuminate\Contracts\Queue\ShouldQueue;
 use App\Jobs\ProcessImages as ProcessImagesJob;
+use Illuminate\Contracts\Queue\ShouldQueue;
+use Illuminate\Support\Facades\Bus;
+use Illuminate\Support\Facades\Cache;
+use Statamic\Events\EntrySaved;
 
 class ProcessImages implements ShouldQueue
 {
@@ -14,11 +16,14 @@ public function handle(EntrySaved $event): void
             return;
         }
 
-        ProcessImagesJob::dispatch(
-            assets: $event->entry->assets,
-            watermark: $event->entry->watermark,
-            lowres: $event->entry->lowres,
-        );
+        Bus::chain([
+            new ProcessImagesJob(
+                assets: $event->entry->assets,
+                watermark: $event->entry->watermark,
+                lowres: $event->entry->lowres,
+            ),
+            fn () => Cache::forget('processed_images'),
+        ])->dispatch();
     }
 
     protected function shouldProcessImages(EntrySaved $event): bool

app/Livewire/Gallery.php

@@ -19,39 +19,37 @@ class Gallery extends Component
 
     public array $selection = [];
 
-    #[Computed]
-    public function entry(): Entry
+    public array $likes = [];
+
+    public function mount()
     {
-        return \Statamic\Facades\Entry::find($this->id);
+        $this->likes = $this->entry->likes->map->id->all();
     }
 
-    #[Computed]
-    public function assets(array $selection = []): AssetCollection
+    #[Computed(persist: true)]
+    public function entry(): Entry
     {
-        return $this->entry->processed_images
-            ->when($selection, function ($assets) use ($selection) {
-                return $assets->filter(fn ($asset) => in_array($asset->id(), $selection));
-            });
+        return \Statamic\Facades\Entry::find($this->id);
     }
 
-    #[Computed]
-    public function assetsCount(): int
+    #[Computed(persist: true)]
+    public function assets(): AssetCollection
     {
-        return $this->assets($this->selection)->count();
+        return $this->entry->processed_images;
     }
 
     #[Computed]
-    public function likes(): AssetCollection
+    public function assetsCount(): int
     {
-        return $this->entry->likes->map->id;
+        return empty($this->selection) ? $this->assets->count() : count($this->selection);
     }
 
     public function isLiked(string $id): bool
     {
-        return $this->likes->contains($id);
+        return in_array($id, $this->likes);
     }
 
-    #[Computed]
+    #[Computed(persist: true)]
     public function downloadEnabled(): bool
     {
         return $this->entry->download;
@@ -60,7 +58,11 @@ public function downloadEnabled(): bool
     #[Computed]
     public function zipUrl(): string
     {
-        return Zip::make($this->assets($this->selection)->all())
+        $assets = empty($this->selection)
+            ? $this->assets->all()
+            : $this->assets->filter(fn ($asset) => in_array($asset->id(), $this->selection))->all();
+
+        return Zip::make($assets)
             ->filename($this->entry->title)
             ->url();
     }
@@ -71,8 +73,8 @@ public function updateSelection(string $id): void
         $selection = collect($this->selection);
 
         $this->selection = $selection->contains($id)
-            ? $selection->diff($id)->all()
-            : $selection->push($id)->all();
+            ? $selection->diff($id)->values()->all()
+            : $selection->push($id)->values()->all();
     }
 
     public function resetSelection(): void
@@ -86,12 +88,15 @@ public function resetSelection(): void
     #[Renderless]
     public function updateLikes(string $id): void
     {
-        $likes = $this->likes->contains($id)
-            ? $this->likes->diff($id)->all()
-            : $this->likes->push($id)->all();
+        $likes = collect($this->likes);
+
+        $this->likes = $this->isLiked($id)
+            ? $likes->diff($id)->values()->all()
+            : $likes->push($id)->values()->all();
 
-        $assets = $this->assets($likes)
-            ->map(fn ($asset) => $asset->path())
+        $assets = $this->assets
+            ->filter(fn ($asset) => in_array($asset->id(), $this->likes))
+            ->map->path()
             ->unique()
             ->values()
             ->all();

app/Livewire/GalleryItem.php

@@ -21,7 +21,7 @@ class GalleryItem extends Component
 
     public bool $liked = false;
 
-    #[Computed]
+    #[Computed(persist: true)]
     public function asset(): Asset
     {
         return \Statamic\Facades\Asset::find($this->id);

app/Providers/ComputedPropertiesProvider.php

@@ -3,6 +3,7 @@
 namespace App\Providers;
 
 use Illuminate\Support\Arr;
+use Illuminate\Support\Facades\Cache;
 use Illuminate\Support\ServiceProvider;
 use Statamic\Facades\Asset;
 use Statamic\Facades\Collection;
@@ -24,30 +25,37 @@ public function boot(): void
         });
 
         Collection::computed('private_galleries', 'processed_images', function ($entry, $value) {
-            $images = $entry->get('assets');
-
-            if (empty($images)) {
-                return null;
-            }
-
-            $shouldProcessImages = $entry->get('watermark') || $entry->get('lowres');
-
-            if (! $shouldProcessImages) {
-                return $images;
-            }
-
-            // TODO: Implement caching.
-            /* Save resources by returning the cached processed images if the selection of images hasn't changed. */
-
-            return Asset::query()
-                ->where('container', 'private_galleries')
-                ->where('folder', str(Arr::first($images))->before('/')->append('/processed'))
-                ->whereIn('basename', collect($images)->map(fn ($image) => basename($image))->all())
-                ->get()
-                ->map(fn ($image) => $image->path())
-                ->sortBy(fn ($processed) => collect($images)->search(fn ($original) => basename($processed) === basename($original)))
-                ->values()
-                ->all();
+            return Cache::rememberForever('processed_images', function () use ($entry) {
+                $images = $entry->get('assets');
+
+                if (empty($images)) {
+                    return null;
+                }
+
+                $returnProcessedImages = $entry->get('watermark') || $entry->get('lowres');
+
+                if (! $returnProcessedImages) {
+                    return $images;
+                }
+
+                $originalImages = collect($images);
+
+                $processedImages = Asset::query()
+                    ->where('container', 'private_galleries')
+                    ->where('folder', str(Arr::first($images))->before('/')->append('/processed'))
+                    ->whereIn('basename', $originalImages->map(fn ($image) => basename($image))->all())
+                    ->get()
+                    ->map(fn ($image) => $image->path());
+
+                /* Fall back to the unprocessed image if a processed version doesn't exist. Like GIFs that are never processed. */
+                return $originalImages
+                    ->map(function ($originalImage) use ($processedImages) {
+                        $key = $processedImages->search(fn ($processedImage) => basename($processedImage) === basename($originalImage));
+
+                        return is_numeric($key) ? $processedImages->get($key) : $originalImage;
+                    })
+                    ->all();
+            });
         });
     }
 }

config/statamic/bard_texstyle.php

@@ -59,13 +59,21 @@
                 'class' => 'font-serif text-4xl leading-tight md:text-5xl md:leading-tight xl:text-6xl xl:leading-tight my-8 xl:my-12 2xl:my-16 first:mt-0 last:mb-0',
             ],
 
+            'heading_2' => [
+                'class' => 'font-serif text-2xl leading-tight md:text-3xl md:leading-tight xl:text-4xl xl:leading-tight my-4 xl:my-8 2xl:my-12 first:mt-0 last:mb-0',
+            ],
+
             'paragraph' => [
                 'class' => 'text-base leading-relaxed md:text-lg md:leading-relaxed my-8 first:mt-0 last:mb-0',
             ],
 
             'link' => [
                 'class' => 'underline decoration-1 underline-offset-2 transition hover:text-gray-500 hover:decoration-gray-500 focus:outline-none focus-visible:ring-1 focus-visible:ring-black focus-visible:rounded',
             ],
+
+            'unordered_list' => [
+                'class' => 'list-disc list-outside text-base leading-relaxed md:text-lg md:leading-relaxed my-8 ml-4 first:mt-0 last:mb-0',
+            ],
         ],
 
         'cta' => [
@@ -78,6 +86,16 @@
             ],
         ],
 
+        'testimonial' => [
+            'paragraph' => [
+                'class' => 'text-sm font-medium xl:text-base my-4 first:mt-0 last:mb-0',
+            ],
+
+            'link' => [
+                'class' => 'underline decoration-1 underline-offset-4 transition hover:text-gray-500 hover:decoration-gray-500 focus:outline-none focus-visible:ring-1 focus-visible:ring-black focus-visible:rounded',
+            ],
+        ],
+
     ],
 
     /*