Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

hackgreenville-com-432 - Set admin panel FilamentPHP icon, item sorting, and fix resource global searching #437

Draft
wants to merge 10 commits into
base: develop
Choose a base branch
from
Draft
10 changes: 8 additions & 2 deletions app/Filament/Resources/CategoryResource.php
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@

use App\Filament\Resources\CategoryResource\Pages;
use App\Models\Category;
use Exception;
use Filament\Forms;
use Filament\Forms\Form;
use Filament\Resources\Resource;
Expand All @@ -14,7 +15,9 @@ class CategoryResource extends Resource
{
protected static ?string $model = Category::class;

protected static ?string $navigationIcon = 'heroicon-o-rectangle-stack';
protected static ?string $navigationIcon = Category::icon;
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I have to disagree with this approach - these icons should not live on the Model. This is very specific to the Filament dashboard. Just set the icon string here.

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@bogdankharchenko, the resources are directly tied to the models. Maybe I could register a config/icons.php file or something like that, but it's simpler to create consistency. For example, if we wanted to use the icon wherever that record is rendered, then we could just get the icon from the model. It's very easy to figure out the icon with that pattern.

I don't like having them hard-coded in the resource because it makes reuse harder and it makes maintaining them harder since their spread out throughout the codebase

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't mind the idea of being able to update the icons in a config, but we have a bunch of different icons being used on the front-end in the navigation (header & footer), in a few pages, and in the homepage widgets.

If we're going to create configurable icons, then would it confuse the issue if we only did that for the admin panel and not the entire site?

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@bogdankharchenko, the resources are directly tied to the models. Maybe I could register a config/icons.php file or something like that, but it's simpler to create consistency. For example, if we wanted to use the icon wherever that record is rendered, then we could just get the icon from the model. It's very easy to figure out the icon with that pattern.

I don't like having them hard-coded in the resource because it makes reuse harder and it makes maintaining them harder since their spread out throughout the codebase

I understand, but that icon configuration is specific for the filament resource not the model. It is not available outside of the filament dashboard

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I do agree with Bogdan on this one. We shouldn't mix concerns of the model with the view. Since we're only using this icon on Filament, we should be fine keeping the icon definition there. Until we actually run into a case where we need to use the same icon twice, we can figure it out then (which the icon config may not be a bad idea). Just don't think we should put the icon information on the model itself.

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I know you're seeing the changes in the context of filamentPhp, but in reality, we can use these icons everywhere we display icons of this nature. It would help to create consistency.

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@bogdankharchenko and @irby

In open-source projects, decisions about icon usage are made more consistent by using model icon registers, config files, or lang packages, just to name a few ideas. I like Model icon registers because, IMO, they're the easiest to reason about, but really, I'm open to suggestions. I ask for reasoning because I might want to adopt the change personally.

Language packs would be neat because you can do different icons based on culture, like hats would be sombreros, buildings could be offal towers, etc. These are just examples and optional for hackgreenville.com. They are just giving options and alternatives.

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't have a lot of problem defining icons like this. It's not a pattern I'm used to but I'm open to it. I'll defer to @bogdankharchenko on the final word for it. 😃

Copy link
Member

@allella allella Nov 20, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@zach2825 since we're talking about a decent shift in implementation, how about we revert to what we had and move the icon flexibility as a task under our plans to upgrade the front-end framework?

We talked about exploring Tailwind, or upgrading to a newer Bootstrap in #252

Also, our current, older Bootstrap is causing issues like depreciation warnings we can't turn off without something like #451

So, we probably need a UI refresh for a number of reasons and the config-based icons could be part of that. Eric Anderson mentioned Iconpark in #ruby today and its more plentiful and style-able icons as a newer option, so that could be part of a larger revamp too if it justifies the need for more dynamic icons in the front-end.


protected static ?int $navigationSort = 900;

public static function form(Form $form): Form
{
Expand All @@ -26,6 +29,9 @@ public static function form(Form $form): Form
]);
}

/**
* @throws Exception
*/
allella marked this conversation as resolved.
Show resolved Hide resolved
public static function table(Table $table): Table
{
return $table
Expand All @@ -46,7 +52,7 @@ public static function table(Table $table): Table
->toggleable(isToggledHiddenByDefault: true),
])
->filters([

Tables\Filters\TrashedFilter::make(),
])
->actions([
Tables\Actions\EditAction::make(),
Expand Down
23 changes: 22 additions & 1 deletion app/Filament/Resources/EventResource.php
Original file line number Diff line number Diff line change
Expand Up @@ -8,18 +8,35 @@
use App\Models\Event;
use App\Models\Org;
use App\Models\Venue;
use Exception;
use Filament\Forms;
use Filament\Forms\Form;
use Filament\Resources\Resource;
use Filament\Tables;
use Filament\Tables\Table;
use Illuminate\Database\Eloquent\Model;
use Malzariey\FilamentDaterangepickerFilter\Filters\DateRangeFilter;

class EventResource extends Resource
{
protected static ?string $model = Event::class;

protected static ?string $navigationIcon = 'heroicon-o-rectangle-stack';
protected static ?string $navigationIcon = Event::icon;

protected static ?int $navigationSort = 20;

public static function getGloballySearchableAttributes(): array
{
return ['event_name', 'description'];
}

public static function getGlobalSearchResultDetails(Model $record): array
{
return [
'Event Name' => $record->event_name,
'Description' => $record->description,
];
}

public static function form(Form $form): Form
{
Expand Down Expand Up @@ -90,6 +107,9 @@ public static function form(Form $form): Form
]);
}

/**
* @throws Exception
*/
public static function table(Table $table): Table
{
return $table
Expand All @@ -114,6 +134,7 @@ public static function table(Table $table): Table
->sortable(),
])
->filters([
Tables\Filters\TrashedFilter::make(),
DateRangeFilter::make('active_at')
->defaultToday()
->autoApply()
Expand Down
45 changes: 45 additions & 0 deletions app/Filament/Resources/EventResource/Widgets/TotalActiveEvents.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
<?php

namespace App\Filament\Resources\EventResource\Widgets;

use App\Models\Event;
use Filament\Widgets\ChartWidget;

class TotalActiveEvents extends ChartWidget
{
protected static ?string $heading = 'Chart';

protected static ?string $description = 'All Events';

protected static ?string $maxHeight = '250px';

protected function getData(): array
{
$data = Event::query()
->published()
->get()
->groupBy('status')
->map(fn ($events) => $events->count())
->toArray();

return [
'labels' => array_keys($data),
'datasets' => [
[
'label' => 'Events',
'data' => array_values($data),
'backgroundColor' => [
'#FF6384',
'#36A2EB',
'#FFCE56',
],
],
],
];
}

protected function getType(): string
{
return 'pie';
}
}
Loading
Loading