Filament Rating Tool

Authors
  • avatar
    Name
    Cristian Iosif
    Laravel and FilamentPHP Enthusiast
    X.com
    @X

Filament Rating Tool is a FilamentPHP plugin meant to provide a set of tools for measuring or rating different resources of your app.

What's different from other (star) rating tools?

Well, we thought of giving a user the possibility to choose an icon, depending on the context of the rating.

For example, if you want to rate a movie, you can use a star icon, if you want to rate a book, you can use a book icon, if you want to provide the number of persons that can occupy a hotel room, you can use a user icon ... and so on, you get the idea. Any icon provided by Filament can be user for rating / measuring.

Also, we made it possible for a user to choose their on size for the icons, the number of icons to be displayed and also the color for the icons. Yeah, you can set different colors for the icons, depending on the rating value.

# Installation

You can install the package via composer:

1composer require lartisan/filament-rating-tool

Optionally, you can publish the views using

1php artisan vendor:publish --tag="filament-rating-tool-views"

# How it works

Form Usage

When preparing a form, you need to define a RatingInput field and, optionally, make some configurations:

1RatingInput::make('rating')
2 ->size('xl')
3 ->maxValue(5)
4 ->icon('heroicon-o-stop')
5 ->color(fn (int $state): string => match ($state) {
6 1 => 'danger',
7 2 => 'warning',
8 3 => 'info',
9 4 => 'primary',
10 5 => 'success',
11 default => 'gray',
12 }),
Edit meals form

These are all the possible methods one can use to configure this field. As you can see, you can provide a maxValue for your input, so if you want to match some custom color based on the $state, you'll need the same amount of colors. Of course, one can only choose one color for all the symbols of the field

1RatingInput::make('rating')
2 ->color('warning')
3 // ...

Table Usage

Similar to forms, there is a dedicated column for displaying the measurement value...

1RatingColumn::make('rating')
2 ->size('xs')
3 ->maxValue(5)
4 ->icon('heroicon-s-star')
5 ->color(fn (int $state): string => match ($state) {
6 1 => 'danger',
7 2 => 'warning',
8 3 => 'info',
9 4 => 'primary',
10 5 => 'success',
11 default => 'gray',
12 }),
13 // ...
Hotels table

Infolist Usage

... and another one to display the infolist when viewing the records

1RatingEntry::make('rating')
2 ->columnSpan(2)
3 ->size('lg')
4 ->maxValue(5)
5 ->icon('heroicon-s-user')
6 ->color(fn (int $state): string => match ($state) {
7 1 => 'danger',
8 2 => 'warning',
9 3 => 'info',
10 4 => 'primary',
11 5 => 'success',
12 default => 'gray',
13 }),
14 // ...
Hotel infolist

Of course, all the components above can be used with any corresponding methods from Filament.

# Components configuration

As you have already seen, the methods available for each component are:

  • size() accepts TailwindCSS screen sizes from xs to xl
  • maxValue() you can set any integer here
  • icon() any Heroicon supported also by Filament
  • color() any color already defined in Filament

Advertising

Ploi referral

We take all the difficult work out of your hands, so you can focus on doing what you love: developing your application.