From 0920e48d122c8e723fdf9d30eb8aab90f44b85ea Mon Sep 17 00:00:00 2001
From: Jordi Enric <37541088+jordienr@users.noreply.github.com>
Date: Mon, 15 Jun 2026 16:26:25 +0200
Subject: [PATCH] feat(timezone-picker): pin UTC as second option FE-3570
 (#46934)

## Problem

UTC was buried in the middle of the timezone list. Users managing
servers (which run in UTC) had to scroll or search to find it.

## Fix

Hardcode a UTC entry immediately after "Auto detect" so the two most
common choices are always at the top. The entry uses the standard `UTC`
IANA name and shows the checkmark when selected, consistent with all
other entries.

## How to test

- Open any page in Studio and click your user avatar.
- Open the Timezone submenu.
- Confirm the order is: Auto detect, (UTC) Coordinated Universal Time,
then the rest of the list.
- Select UTC and confirm the checkmark appears and the trigger label
updates.
- Search "UTC" in the search box and confirm it still matches.

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

* **New Features**
* Added explicit "UTC (Coordinated Universal Time)" option at the top of
the timezone selector dropdown for easier access.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 .../interfaces/UserDropdown/TimezoneDropdown.tsx    | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/apps/studio/components/interfaces/UserDropdown/TimezoneDropdown.tsx b/apps/studio/components/interfaces/UserDropdown/TimezoneDropdown.tsx
index 16fcc29ce99..8844d7d7a06 100644
--- a/apps/studio/components/interfaces/UserDropdown/TimezoneDropdown.tsx
+++ b/apps/studio/components/interfaces/UserDropdown/TimezoneDropdown.tsx
@@ -81,6 +81,19 @@ export const TimezoneDropdown = () => {
                       )}
                     />
                   </CommandItem>
+                  <CommandItem
+                    key="UTC"
+                    value="UTC Coordinated Universal Time"
+                    onSelect={() => handleSelect('UTC')}
+                  >
+                    {'(UTC) Coordinated Universal Time'}
+                    <CheckIcon
+                      className={cn(
+                        'ml-auto h-4 w-4',
+                        !isAutoDetected && storedTimezone === 'UTC' ? 'opacity-100' : 'opacity-0'
+                      )}
+                    />
+                  </CommandItem>
                   {TIMEZONES_BY_IANA.map((entry) => {
                     const ianaName = entry.utc[0]
                     const isSelected = !isAutoDetected && storedTimezone === ianaName