# Warning!!!! This repository is archived and no longer supported. It doesn't work with Nova 4. Just have a look at the form from https://github.com/shuvroroy/nova-dynamic-views --- # Nova dynamic views This package is meant to be used **INSTEAD** of overwriting the `custom-index-header`, `custom-index-toolbar`, `custom-detail-header`, `custom-detail-toolbar`, etc. by yourself. It provides a much easier API for it and it allows you to use these "placeholder" components multiple times without overwriting each other. ![2020-10-14_16-13](https://user-images.githubusercontent.com/642292/96001510-6592a980-0e38-11eb-9aea-54ebbf6126d1.png) ## Installation Require the package with composer ``` composer require bernhardh/nova-dynamic-views ``` Register the tool in the `tools` method in your `\App\Providers\NovaServiceProvider`: ```php use Bernhardh\NovaDynamicViews\NovaDynamicViews; ... public function tools() { return [ new NovaDynamicViews() ]; } ``` ## Usage Let's say you want to add a custom button to the `toolbar` of all `index` views. Just create a vue component for it, as you would do if you use the `custom-index-header` (see section "Create custom component" if you don't know how to). Let's call it `my-index-toolbar-btn`. Now the only thing you have to do is register it to your `\App\Ĺ…ova\Resource` class, within a new method called `customIndexToolbarComponents`, which returns a `\Bernhardh\NovaDynamicViews\CustomComponents` object: ```php public function customIndexToolbarComponents() { return CustomComponents::make() ->addItem('my-index-toolbar-btn'); } ``` Thats it. Now you should see the content of your component in the toolbar. ### Provide extra data If you want to add extra data (for example a label) to your component (without extra request), just add it to the `addItem` method as second parameter (as array): ```php public function customIndexToolbarComponents() { return CustomComponents::make() ->addItem('my-index-toolbar-btn', [ 'label' => 'My label' ]); } ``` ### Access resource data You have access to the ressource class in all methods by using `$this`. On `detail` and `edit` components, you have access to the ID of the current model with `request('id')`. So if you need the model itself in your `customDetailhHeaderComponents`, `customDetailToolbarComponents` or your `customUpdateHeaderComponents`, you can query for it like so: ```php public function customDetailToolbarComponents() { $model = $this->model()->query()->where('id', request('id'))->first(); //... } ``` ### Add (tailwind) class to the container If you want to add additional CSS classes to the container div of a section (for example add `flex w-full justify-end items-center mx-3` to the `customIndexToolbarComponents` section), add the `class` in the `make` function (or use the `setClass` method): ```php public function customIndexToolbarComponents() { return CustomComponents::make('flex w-full justify-end items-center mx-3') ->addItem('my-index-toolbar-btn'); } ``` ### Full usage example ```php class Resource extends \Laravel\Nova\Resource { ... /** * Using the `custom-index-toolbar` placeholder component * * @return array[] */ public function customIndexToolbarComponents() { return CustomComponents::make('flex w-full justify-end items-center mx-3') ->addItem('my-index-toolbar-btn', [ 'title' => 'My first btn' ]) ->addItem('my-index-toolbar-btn', [ 'title' => 'My second btn' ]); } /** * Using the `custom-detail-header` placeholder component * * @return array[] */ public function customDetailHeaderComponents() { $model = $this->model()->query()->where('id', request('id'))->first(); return CustomComponents::make() ->addItem('my-other-component', [ 'id' => $model->id, 'name' => $model->name ]); } } ``` ### Use only on specific resources If you want to show this button only on a specific resource, for example only for Users, just add this method to the `\App\Nova\User` class. ## Available methods and areas All `custom-*-*` nova placeholders (except `custom-dashboard-header`) are available as camel case methods postfixed with `Components`: - `customAttachHeaderComponents` - `customCreateHeaderComponents` - `customDetailhHeaderComponents` - `customDetailToolbarComponents` - `customIndexHeaderComponents` - `customIndexToolbarComponents` - `customLensHeaderComponents` - `customUpdateAttachHeaderComponents` - `customUpdateHeaderComponents` ## Create custom component This is just a kick start documentation for this. For more info, see https://nova.laravel.com/docs/3.0/customization/resource-tools.html Create a new resource tool with artisan: ```bash php artisan nova:resource-tool acme/my-index-toolbar-btn ``` and say yes to all questions of the prompt. Now you can use this component (located ad `nova-components/my-index-toolbar-btn`) inside your `customXXXComponents` (f.e. `customIndexToolbarComponents`)