Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

newbie360's avatar

Can anyone help me test for display datetime based on timezone

I search google most common solution is add a column timezone to users table

I want to try implement without add any timezone column and handle the datetime in server side

Step 1: Create a Livewire component

php artisan make:livewire get-web-browser-timezone
<?php

namespace App\Livewire;

use Livewire\Component;

class GetWebBrowserTimezone extends Component
{
    public function setTimezone($timezone)
    {
        $isValidTimezone = in_array($timezone, timezone_identifiers_list());

        if (! $isValidTimezone) {
            $timezone = null;
        }

        session()->put('browser_timezone', $timezone);
    }

    public function render()
    {
        return view('livewire.get-web-browser-timezone');
    }
}
<div>
    {{-- avoid trigger on every page load --}}
    @if (! session()->has('browser_timezone'))
        <div
            x-data="{ timezone: Intl.DateTimeFormat().resolvedOptions().timeZone }"
            x-init="$wire.setTimezone(timezone)"
        >
        </div>
    @endif
</div>

Step 2: https://filamentphp.com/docs/3.x/support/render-hooks#registering-render-hooks

add this to service provider

Step 3: Finally in any Filament resource add this to Table Builder

namespace App\Filament\Resources;

class UserResource extends Resource
{
    public static function table(Table $table): Table
    {
        return $table
            ->recordUrl(null)
            ->columns([
                Tables\Columns\TextColumn::make('created_at')
                    ->label(__('Created at (UTC)'))
                    ->since()
                    ->dateTimeTooltip(),

                Tables\Columns\TextColumn::make('created_at')
                    ->label(__('Created at (Timezone)'))
                    ->since()
                    ->dateTimeTooltip(timezone: session('browser_timezone')),
            ])

            // ...
    }
}

and then visit the table, mouse over on the two columns, if anyone have time, please report is it correct, for example:

Firefox correct

Edge incorrect

0 likes
0 replies

Please or to participate in this conversation.