1. Go to this page and download the library: Download oza75/laravel-hubble library. Choose the download type require.
2. Extract the ZIP file and open the index.php.
3. Add this code to the index.php.
<?php
require_once('vendor/autoload.php');
/* Start to develop here. Best regards https://php-download.com/ */
oza75 / laravel-hubble example snippets
// file: app/Providers/HubbleServiceProvider.php
/**
* Determines if a given user can access to hubble dashboard.
* By default every user can access to hubble
*
* @param User $user
* @return bool
*/
public function authorizesAccess(User $user): bool
{
return $user->isAdmin();
}
namespace App\Hubble;
use Illuminate\Database\Eloquent\Builder;
use Oza75\LaravelHubble\Action;
use Oza75\LaravelHubble\Field;
use Oza75\LaravelHubble\Filter;
use Oza75\LaravelHubble\Actions\DeleteAction;
use App\Hubble\Resource;
class UserResource extends Resource
{
/**
* @var string The title will be used as your resource name in the ui
*/
protected $title = "Users";
/**
* @var string[]
*/
protected $searchColumns = ['id'];
/**
* @var string used to show resource value in relationship
*/
protected $displayColumn = 'id';
/**
* Get the fields displayed that the user resource
*
* @return Field[] array of fields
*/
public function fields()
{
return [
Field::make('id', 'ID'),
Field::make('name', 'Name')
];
}
/**
* Register all actions that the user resource have
*
* @return Action[] array of actions
*/
public function actions()
{
return [
DeleteAction::make(),
];
}
/**
* Register all filters that the user resource have
*
* @return Filter[] array of filters
*/
public function filters()
{
return [];
}
/**
* @return Builder
*/
public function baseQuery(): Builder
{
return \App\User::query();
}
/**
* Return this resource icon
*
* @return string|null
*/
public function icon()
{
return null;
}
}
/**
* @return Builder
*/
public function baseQuery(): Builder
{
return \App\User::query()->select('*')->selectRaw('age > 18 as is_adult');
}
/**
* Get the fields displayed that the user resource
*
* @return Field[] array of fields
*/
public function fields()
{
return [
Field::make('id', 'ID'),
TextField::make('name', 'Name')->sortable(),
TextareaField::make('bio', 'Bio')->onlyOnDetails(),
TextField::make('email', 'Email')->displayOnIndexUsing(function ($value) {
return "<a href='mailto:$value'>$value</a>";
})->type('email')->sortable(),
];
}
/**
* @var string The title will be used as your resource name in the ui
*/
protected $title = "Users";
/**
* @var string[]
*/
protected $searchColumns = ['id', 'name'];
/**
* @var string used to show resource value in relationship
*/
protected $displayColumn = 'name';
/** @var int Number of records per page */
protected $perPage = 38;
/** @var bool Determines if a resource should be shown in sidebar */
protected $displayInSidebar = true;
/**
* @var bool Determines if a resource can be exported in excel format.
*/
protected $exportable = true;
// use Oza75\LaravelHubble\Configuration\Configuration;
// use Oza75\LaravelHubble\Configuration\ScreenConfiguration;
public function configure(Configuration $configuration)
{
$configuration->details(function (ScreenConfiguration $configuration, User $user) {
$configuration->setTitle("User #". $user->id);
});
}
namespace App\Providers;
use Illuminate\Foundation\Auth\User;
use Oza75\LaravelHubble\HubbleServiceProvider as BaseProvider;
class HubbleServiceProvider extends BaseProvider
{
/**
* Determines if hubble should detects automatically
* resources under Hubble resource folder. This is useful when you are
* developing but should be disable in production
*
* @var bool
*/
protected $autoRegistration = false; // set to false to disable auto registration
/**
* List of resource Hubble should register. Should be used
* when you set autoRegistration = false. Optionally you can
* define a resource method in this class to bypass this property.
*
* @var array
*/
protected $resources = [
// add your resources manually here
UserResource::class,
];
/**
* Determines if a given user can access to hubble dashboard.
* By default every user can access to hubble
*
* @param User $user
* @return bool
*/
public function authorizesAccess(User $user): bool
{
return parent::authorizesAccess($user);
}
}
namespace App\Hubble\Actions;
use App\User;
use Illuminate\Database\Eloquent\Builder;
use Illuminate\Database\Eloquent\Model;
use Illuminate\Support\LazyCollection;
use Oza75\LaravelHubble\Action;
class ActiveUsers extends Action
{
/**
* @var string the title of this action
*/
protected $title = 'ActiveUsers';
/**
* @var string the confirmation message to warn user before running this action. Set to null to disable it
*/
protected $confirmationMessage = 'Do you really want to perform this action ?';
/**
* Handle your action
*
* @param LazyCollection $collection
* @param Builder $query
* @return string
*/
public function handle(LazyCollection $collection, Builder $query)
{
$query = $query->newQuery();
$collection->each(function (User $user) use ($query) {
$query->orWhere('id', $user->id);
});
$query->update(['is_active' => true]);
return "Utilisateurs activé avec succès !";
}
/**
* @param \Illuminate\Foundation\Auth\User $user
* @param Model|null $model
* @return bool
*/
public function can(\Illuminate\Foundation\Auth\User $user, ?Model $model = null): bool
{
return true;
}
protected function icon()
{
return asset('images/lock.svg');
}
}
/**
* Handle your action
*
* @param $ids
* @return void
*/
public function handle($ids)
{
User::query()->whereIn('id', $ids)->update(['active' => true]);
}
/**
* Register all actions that the user resource have
*
* @return Action[] array of actions
*/
public function actions()
{
return [
DeleteAction::make(),
new ActiveUsers(),
];
}
/**
* Register all filters that the user resource have
*
* @return Filter[] array of filters
*/
public function filters()
{
return [
Filter::make('is_active', 'Only Active Users', ['Yes' => 1, 'No' => 0]),
];
}
/**
* Register all filters that the user resource have
*
* @return Filter[] array of filters
*/
public function filters()
{
return [
Filter::make('is_active', 'Users Status', [
['name' => 'All', 'value' => null],
['name' => 'Active', 'value' => 1],
['name' => 'Non active', 'value' => 0]
])->setValueKey('value')->setTextKey('name'),
];
}
/**
* Register all filters that the user resource have
*
* @return Filter[] array of filters
*/
public function filters()
{
return [
Filter::make('state', 'Users State', "https://restcountries.eu/rest/v2/all")
->setValueKey('alpha3Code')
->setTextKey('name')
->searchable('Start typing a state...'),
];
}
/**
* Register all filters that the user resource have
*
* @return Filter[] array of filters
*/
public function filters()
{
return [
Filter::make('state', 'Users State', "https://restcountries.eu/rest/v2/all")
->setValueKey('alpha3Code')
->setTextKey('name')
->setHandler(function (Builder $builder, $value) {
$builder->whereHas('state', function ($query) use ($value) {
$query->where('code', $value);
});
}),
];
}
namespace App\Hubble\Filters;
use Illuminate\Database\Eloquent\Builder;
use Oza75\LaravelHubble\Filter;
class MyCustomFilter extends Filter
{
/**
* @var string the title of your filter that will be shown on the ui.
*/
protected $title = 'My custom filter';
/**
* @var string the VueJs component that will be used to display this filter
*/
protected $component = 'hubble-checkbox-filter';
/**
* Apply your filter
*
* @param Builder $query
* @param $value
* @return void
*/
public function handle(Builder $query, $value)
{
// apply your filter here.
return null;
}
/**
* Return all options for this filter
*
* @return array
*/
public function options()
{
// first way
return ['Option 1' => 1, 'Option 2' => 2]; // the key is the label and the value is the option value
// second way
return [
['name' => 'Option 1', 'value' => 1],
['name' => 'Option 2', 'value' => 2],
];
// third way
return "https://restcountries.eu/rest/v2/all";
// do not forget to use `setValueKey(string $key)` and `setTextKey(string $key)` in the constructor of this class
// or when instantiating this class to set the value key and the text key
}
}
\Oza75\LaravelHubble\Field::make('fullname', 'Full Name')->displayUsing(function ($value, $resource) {
return $resource->first_name . ' '. $resource->last_name; // in this case resource is a User model
});
\Oza75\LaravelHubble\Field::make('email', 'Email')->displayOnIndexUsing(function ($value) {
return "<a href='mailto:$value'>$value</a>";
});
namespace App\Hubble\Fields;
use Oza75\LaravelHubble\Field;
use Oza75\LaravelHubble\HubbleResource;
class ColorField extends Field
{
/**
* Register your vuejs components
*/
protected function registerComponents()
{
parent::registerComponents();
$this->components = [
'index' => 'index-text-field',
'editing' => 'edit-text-field',
'creating' => 'edit-text-field',
'details' => 'show-text-field'
];
}
/**
* This hook is called when the field is ready to work.
* Basically it will just set the resource within your field is added.
* So if you have some attributes to add or actions that depends on the resource
* this is where you should do it.
*
* @param HubbleResource $resource
*/
public function prepare(HubbleResource $resource)
{
parent::boot($resource);
// do action that depends on the resource within this field is added
}
}
namespace App\Policies;
use App\Post;
use Illuminate\Auth\Access\HandlesAuthorization;
class PostPolicy
{
use HandlesAuthorization;
public function before(User $user)
{
// bypass all authorization check when user is admin
if ($user->isAdmin()) {
return true;
}
}
/**
* Determine whether the user can view any models.
*
* @param \App\User $user
* @return mixed
*/
public function viewAny(User $user)
{
return true; // Anyone can see `the index table`. You can also return false to remove the hubble' PostResource in sidebar.
}
/**
* Determine whether the user can view the model.
*
* @param \App\User $user
* @param \App\Post $model
* @return mixed
*/
public function view(User $user, Post $model)
{
return true; // anyone can see the details screen.
}
/**
* Determine whether the user can create models.
*
* @param \App\User $user
* @return mixed
*/
public function create(User $user)
{
return true; // anyone can create a new user
}
/**
* Determine whether the user can update the model.
*
* @param \App\User $user
* @param \App\Post $model
* @return mixed
*/
public function update(User $user, Post $model)
{
return $user->id === $model->user_id; // only the owner of the post can edit this post
}
/**
* Determine whether the user can delete the model.
*
* @param \App\User $user
* @param \App\Post $model
* @return mixed
*/
public function delete(User $user, Post $model)
{
return $user->id === $model->user_id; // only the owner of the post can delete this post
}
/**
* Determine whether the user can restore the model.
*
* @param \App\User $user
* @param \App\User $model
* @return mixed
*/
public function restore(User $user, User $model)
{
return false;
}
/**
* Determine whether the user can permanently delete the model.
*
* @param \App\User $user
* @param \App\User $model
* @return mixed
*/
public function forceDelete(User $user, User $model)
{
return false;
}
/**
* Determines if the current user can attach users to post
* when using a HasManyField
*/
public function attachUser(User $user) {
return false;
}
/**
* Determines if the current user can detach users to post
* when using a HasManyField
*/
public function detachUser(User $user, Post $model) {
return false;
}
}
bash
php artisan hubble:install
# Now Add App\Providers\HubbleServiceProvider into providers array in your config/app.php