Skip to content

Commit c7537bb

Browse files
Merge pull request #1429 from liberu-genealogy/copilot/improve-ui-ux
Improve UI/UX throughout the application
2 parents 7896cb6 + acfb428 commit c7537bb

File tree

8 files changed

+378
-365
lines changed

8 files changed

+378
-365
lines changed

app/Filament/App/Resources/FamilyResource.php

Lines changed: 61 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,12 @@
33
namespace App\Filament\App\Resources;
44

55
use Override;
6+
use Filament\Forms\Components\Section;
67
use Filament\Forms\Components\Textarea;
78
use Filament\Forms\Components\TextInput;
9+
use Filament\Forms\Components\Toggle;
810
use Filament\Tables\Columns\TextColumn;
11+
use Filament\Tables\Columns\IconColumn;
912
use Filament\Actions\EditAction;
1013
use Filament\Actions\BulkActionGroup;
1114
use Filament\Actions\DeleteBulkAction;
@@ -38,23 +41,48 @@ public static function form(Schema $schema): Schema
3841
{
3942
return $schema
4043
->components([
41-
Textarea::make('description')
42-
->maxLength(65535)
43-
->columnSpanFull(),
44-
TextInput::make('is_active')
45-
->numeric(),
46-
TextInput::make('type_id')
47-
->numeric(),
48-
TextInput::make('husband_id')
49-
->numeric(),
50-
TextInput::make('wife_id')
51-
->numeric(),
52-
TextInput::make('chan')
53-
->maxLength(255),
54-
TextInput::make('nchi')
55-
->maxLength(255),
56-
TextInput::make('rin')
57-
->maxLength(255),
44+
Section::make('Family Members')
45+
->description('Identify the husband and wife in this family unit')
46+
->icon('heroicon-o-users')
47+
->columns(2)
48+
->schema([
49+
TextInput::make('husband_id')
50+
->label('Husband ID')
51+
->numeric(),
52+
TextInput::make('wife_id')
53+
->label('Wife ID')
54+
->numeric(),
55+
TextInput::make('nchi')
56+
->label('Number of Children')
57+
->maxLength(255),
58+
TextInput::make('type_id')
59+
->label('Family Type')
60+
->numeric(),
61+
Toggle::make('is_active')
62+
->label('Active')
63+
->default(true),
64+
]),
65+
66+
Section::make('Notes')
67+
->icon('heroicon-o-document-text')
68+
->schema([
69+
Textarea::make('description')
70+
->maxLength(65535)
71+
->columnSpanFull(),
72+
]),
73+
74+
Section::make('Record References')
75+
->icon('heroicon-o-hashtag')
76+
->columns(2)
77+
->collapsed()
78+
->schema([
79+
TextInput::make('chan')
80+
->label('Change Date')
81+
->maxLength(255),
82+
TextInput::make('rin')
83+
->label('RIN')
84+
->maxLength(255),
85+
]),
5886
]);
5987
}
6088

@@ -63,39 +91,37 @@ public static function table(Table $table): Table
6391
{
6492
return $table
6593
->columns([
66-
TextColumn::make('is_active')
67-
->numeric()
68-
->sortable(),
69-
TextColumn::make('type_id')
70-
->numeric()
94+
TextColumn::make('id')
95+
->label('ID')
7196
->sortable(),
7297
TextColumn::make('husband_id')
98+
->label('Husband ID')
7399
->numeric()
74100
->sortable(),
75101
TextColumn::make('wife_id')
102+
->label('Wife ID')
76103
->numeric()
77104
->sortable(),
105+
TextColumn::make('nchi')
106+
->label('Children')
107+
->searchable(),
108+
IconColumn::make('is_active')
109+
->label('Active')
110+
->boolean(),
78111
TextColumn::make('created_at')
79-
->dateTime()
112+
->label('Created')
113+
->since()
80114
->sortable()
81115
->toggleable(isToggledHiddenByDefault: true),
82116
TextColumn::make('updated_at')
83-
->dateTime()
117+
->label('Updated')
118+
->since()
84119
->sortable()
85120
->toggleable(isToggledHiddenByDefault: true),
86-
TextColumn::make('deleted_at')
87-
->dateTime()
88-
->sortable()
89-
->toggleable(isToggledHiddenByDefault: true),
90-
TextColumn::make('chan')
91-
->searchable(),
92-
TextColumn::make('nchi')
93-
->searchable(),
94-
TextColumn::make('rin')
95-
->searchable(),
96121
])
97122
->filters([
98-
//
123+
Tables\Filters\TernaryFilter::make('is_active')
124+
->label('Active'),
99125
])
100126
->recordActions([
101127
EditAction::make(),

app/Filament/App/Resources/PersonResource.php

Lines changed: 80 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,8 @@
66
use Filament\Forms\Components\TextInput;
77
use Filament\Forms\Components\Select;
88
use Filament\Forms\Components\DateTimePicker;
9+
use Filament\Forms\Components\Section;
10+
use Filament\Forms\Components\Grid;
911
use Filament\Tables\Columns\TextColumn;
1012
use Filament\Actions\EditAction;
1113
use Filament\Actions\BulkActionGroup;
@@ -46,36 +48,65 @@ public static function form(Schema $schema): Schema
4648
{
4749
return $schema
4850
->components([
49-
TextInput::make('givn')->label('First Name'),
50-
TextInput::make('surn')->label('Last Name'),
51-
Select::make('sex')
52-
->options([
53-
'M' => 'Male',
54-
'F' => 'Female',
55-
])
56-
->label('Sex'),
57-
TextInput::make('child_in_family_id')->label('Child In Family ID'),
58-
TextInput::make('description')->label('Description'),
59-
TextInput::make('titl')->label('Title'),
60-
TextInput::make('name')->label('Name'),
61-
TextInput::make('appellative')->label('Appellative'),
62-
TextInput::make('email')->label('Email'),
63-
TextInput::make('phone')->label('Phone'),
64-
DateTimePicker::make('birthday')->label('Birthday'),
65-
DateTimePicker::make('deathday')->label('Deathday'),
66-
FileUpload::make('photo_url')
67-
->image()
68-
->label('Profile Photo')
69-
->directory('people')
70-
->disk('public'),
71-
DateTimePicker::make('burial_day')->label('Burial Day'),
72-
TextInput::make('bank')->label('Bank'),
73-
TextInput::make('bank_account')->label('Bank Account'),
74-
TextInput::make('chan')->label('Chan'),
75-
TextInput::make('rin')->label('Rin'),
76-
TextInput::make('resn')->label('Resn'),
77-
TextInput::make('rfn')->label('Rfn'),
78-
TextInput::make('afn')->label('Afn'),
51+
Section::make('Basic Information')
52+
->description('Core identity and personal details')
53+
->icon('heroicon-o-user')
54+
->columns(2)
55+
->schema([
56+
FileUpload::make('photo_url')
57+
->image()
58+
->label('Profile Photo')
59+
->directory('persons')
60+
->disk('public')
61+
->columnSpanFull(),
62+
TextInput::make('givn')->label('First Name'),
63+
TextInput::make('surn')->label('Last Name'),
64+
TextInput::make('titl')->label('Title'),
65+
TextInput::make('appellative')->label('Appellative'),
66+
TextInput::make('name')->label('Full Name'),
67+
Select::make('sex')
68+
->options([
69+
'M' => 'Male',
70+
'F' => 'Female',
71+
])
72+
->label('Sex'),
73+
TextInput::make('description')->label('Description')->columnSpanFull(),
74+
]),
75+
76+
Section::make('Vital Records')
77+
->description('Birth, death, and burial information')
78+
->icon('heroicon-o-calendar')
79+
->columns(2)
80+
->schema([
81+
DateTimePicker::make('birthday')->label('Date of Birth'),
82+
DateTimePicker::make('deathday')->label('Date of Death'),
83+
DateTimePicker::make('burial_day')->label('Burial Date'),
84+
TextInput::make('child_in_family_id')->label('Child in Family ID'),
85+
]),
86+
87+
Section::make('Contact Information')
88+
->description('Email and phone details')
89+
->icon('heroicon-o-envelope')
90+
->columns(2)
91+
->schema([
92+
TextInput::make('email')->label('Email')->email(),
93+
TextInput::make('phone')->label('Phone'),
94+
]),
95+
96+
Section::make('Record References')
97+
->description('Genealogy record identifiers and metadata')
98+
->icon('heroicon-o-document-text')
99+
->columns(3)
100+
->collapsed()
101+
->schema([
102+
TextInput::make('rin')->label('RIN'),
103+
TextInput::make('rfn')->label('RFN'),
104+
TextInput::make('afn')->label('AFN'),
105+
TextInput::make('resn')->label('Restriction'),
106+
TextInput::make('chan')->label('Change Date'),
107+
TextInput::make('bank')->label('Bank'),
108+
TextInput::make('bank_account')->label('Bank Account'),
109+
]),
79110
]);
80111
}
81112

@@ -84,33 +115,27 @@ public static function table(Table $table): Table
84115
{
85116
return $table
86117
->columns([
87-
TextColumn::make('givn')->label('First Name'),
88-
TextColumn::make('surn')->label('Last Name'),
89-
TextColumn::make('sex')->label('Sex'),
90-
TextColumn::make('child_in_family_id')->label('Child In Family ID'),
91-
TextColumn::make('description')->label('Description'),
92-
TextColumn::make('titl')->label('Title'),
93-
TextColumn::make('name')->label('Name'),
94-
TextColumn::make('appellative')->label('Appellative'),
95-
TextColumn::make('email')->label('Email'),
96-
TextColumn::make('phone')->label('Phone'),
97-
TextColumn::make('birthday')->label('Birthday'),
98-
TextColumn::make('deathday')->label('Deathday'),
99-
ImageColumn::make('photo_url')->label('Photo')->disk('public')->height(40)->width(40),
100-
TextColumn::make('burial_day')->label('Burial Day'),
101-
TextColumn::make('bank')->label('Bank'),
102-
TextColumn::make('bank_account')->label('Bank Account'),
103-
TextColumn::make('chan')->label('Chan'),
104-
TextColumn::make('rin')->label('Rin'),
105-
TextColumn::make('resn')->label('Resn'),
106-
TextColumn::make('rfn')->label('Rfn'),
107-
TextColumn::make('afn')->label('Afn'),
108-
TextColumn::make('created_at')->label('Created At')->sortable(),
109-
TextColumn::make('updated_at')->label('Updated At')->sortable(),
110-
118+
ImageColumn::make('photo_url')->label('Photo')->disk('public')->height(40)->width(40)->circular(),
119+
TextColumn::make('givn')->label('First Name')->searchable()->sortable(),
120+
TextColumn::make('surn')->label('Last Name')->searchable()->sortable(),
121+
TextColumn::make('sex')->label('Sex')->badge()
122+
->color(fn (string $state): string => match ($state) {
123+
'M' => 'info',
124+
'F' => 'danger',
125+
default => 'gray',
126+
}),
127+
TextColumn::make('birthday')->label('Born')->date('Y')->sortable(),
128+
TextColumn::make('deathday')->label('Died')->date('Y')->sortable(),
129+
TextColumn::make('email')->label('Email')->toggleable(isToggledHiddenByDefault: true),
130+
TextColumn::make('phone')->label('Phone')->toggleable(isToggledHiddenByDefault: true),
131+
TextColumn::make('created_at')->label('Added')->since()->sortable()->toggleable(isToggledHiddenByDefault: true),
111132
])
112133
->filters([
113-
//
134+
Tables\Filters\SelectFilter::make('sex')
135+
->options([
136+
'M' => 'Male',
137+
'F' => 'Female',
138+
]),
114139
])
115140
->recordActions([
116141
EditAction::make(),

0 commit comments

Comments
 (0)