diff --git a/README.md b/README.md index ae93f32..08a9bfd 100644 --- a/README.md +++ b/README.md @@ -69,6 +69,28 @@ Forms\Components\FileUpload::make('featured_image') - `->small()` - `->thumbnail()` +# Specifying Per Page + +You can specify how many image results should show on a single page. + +Update per_page option in `.env` + +```php +'per_page' => env('UNSPLASH_PICKER_PER_PAGE', 20), +``` + +You can also set different per page option for each `UnsplashPickerAction` by appending `->perPage()` method + +```php +Forms\Components\FileUpload::make('featured_image') + ->image() + ->hintAction( + UnsplashPickerAction::make() + ->thumbnail() + ->perPage(20) + ) +``` + ## Customization The `UnsplashPickerAction` is simple Filament Form Action and you append all the available methods. The Image picker component is a livewire component, you can extend and override the methods. @@ -84,6 +106,7 @@ This is the contents of the published config file: ```php return [ 'unsplash_client_id' => env('UNSPLASH_CLIENT_ID'), + 'per_page' => env('UNSPLASH_PICKER_PER_PAGE', 20), ]; ``` diff --git a/config/unsplash-picker.php b/config/unsplash-picker.php index 8b7cb42..89bf2cc 100644 --- a/config/unsplash-picker.php +++ b/config/unsplash-picker.php @@ -2,4 +2,5 @@ return [ 'unsplash_client_id' => env('UNSPLASH_CLIENT_ID'), + 'per_page' => env('UNSPLASH_PICKER_PER_PAGE', 20), ]; diff --git a/src/Actions/UnsplashPickerAction.php b/src/Actions/UnsplashPickerAction.php index 5af4116..43690a1 100644 --- a/src/Actions/UnsplashPickerAction.php +++ b/src/Actions/UnsplashPickerAction.php @@ -21,6 +21,8 @@ class UnsplashPickerAction extends Action { protected ?ImageSize $imageSize = null; + protected ?int $perPage = null; + public static function getDefaultName(): ?string { return 'unsplash_picker'; @@ -38,11 +40,18 @@ protected function setUp(): void $this->modalWidth(fn (MountableAction $action): ?MaxWidth => MaxWidth::ScreenLarge); - $this->modalContent(fn () => new HtmlString(Blade::render("@livewire('unsplash-picker-component')"))); + $this->modalContent(fn () => new HtmlString(Blade::render("@livewire('unsplash-picker-component', ['perPage' => {$this->perPage}])"))); $this->action($this->uploadImage(...)); } + public function perPage(int $perPage): static + { + $this->perPage = $perPage; + + return $this; + } + public function raw(): static { $this->imageSize = ImageSize::Raw; diff --git a/src/Components/UnsplashPickerComponent.php b/src/Components/UnsplashPickerComponent.php index 7132701..6caaa2c 100644 --- a/src/Components/UnsplashPickerComponent.php +++ b/src/Components/UnsplashPickerComponent.php @@ -22,6 +22,8 @@ class UnsplashPickerComponent extends Component implements HasActions, HasForms public string $search = ''; + public ?int $perPage = null; + public int $page = 1; public ?int $totalPages = null; @@ -97,7 +99,7 @@ public function getTotalPages(): int public function getPerPage(): int { - return 9; + return $this->perPage ?? config('unsplash-picker.per_page'); } public function render()