From 44eeeea05ed50fcc4c26b6fd19495d6fcb10fb23 Mon Sep 17 00:00:00 2001
From: TJ <tracy@coder.com>
Date: Mon, 24 Aug 2026 07:25:47 -0700
Subject: [PATCH 1/9] fix(site): use default size for sessions date/time range
 picker

---
 .../AIBridgePage/ListSessionsPage/ListSessionsFilter.tsx    | 6 +-----
 1 file changed, 1 insertion(+), 5 deletions(-)

diff --git a/site/src/pages/AIBridgePage/ListSessionsPage/ListSessionsFilter.tsx b/site/src/pages/AIBridgePage/ListSessionsPage/ListSessionsFilter.tsx
index d9f10c48ab9..a90fdab070f 100644
--- a/site/src/pages/AIBridgePage/ListSessionsPage/ListSessionsFilter.tsx
+++ b/site/src/pages/AIBridgePage/ListSessionsPage/ListSessionsFilter.tsx
@@ -48,11 +48,7 @@ export const ListSessionsFilter: FC<ListSessionsFilterProps> = ({
 			error={error}
 			options={
 				<>
-					<DateTimeRangePicker
-						value={timeRange}
-						onChange={onTimeRangeChange}
-						size="lg"
-					/>
+					<DateTimeRangePicker value={timeRange} onChange={onTimeRangeChange} />
 					<UserMenu
 						menu={menus.user}
 						placeholder="All users"

From 8aef3b6c0e3d5bf16692e621dafca9db42050c2c Mon Sep 17 00:00:00 2001
From: TJ <tracy@coder.com>
Date: Mon, 24 Aug 2026 07:35:54 -0700
Subject: [PATCH 2/9] fix(site): keep lg trigger for sessions date/time range
 picker

---
 .../AIBridgePage/ListSessionsPage/ListSessionsFilter.tsx    | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/site/src/pages/AIBridgePage/ListSessionsPage/ListSessionsFilter.tsx b/site/src/pages/AIBridgePage/ListSessionsPage/ListSessionsFilter.tsx
index a90fdab070f..d9f10c48ab9 100644
--- a/site/src/pages/AIBridgePage/ListSessionsPage/ListSessionsFilter.tsx
+++ b/site/src/pages/AIBridgePage/ListSessionsPage/ListSessionsFilter.tsx
@@ -48,7 +48,11 @@ export const ListSessionsFilter: FC<ListSessionsFilterProps> = ({
 			error={error}
 			options={
 				<>
-					<DateTimeRangePicker value={timeRange} onChange={onTimeRangeChange} />
+					<DateTimeRangePicker
+						value={timeRange}
+						onChange={onTimeRangeChange}
+						size="lg"
+					/>
 					<UserMenu
 						menu={menus.user}
 						placeholder="All users"

From b1c5b958facf9e3af40039a3a8817e6f4bebd413 Mon Sep 17 00:00:00 2001
From: TJ <tracy@coder.com>
Date: Mon, 24 Aug 2026 07:38:21 -0700
Subject: [PATCH 3/9] fix(site): pin date/time range picker icon sizes against
 button overrides

---
 .../DateTimeRangePicker/DateTimeRangePicker.tsx           | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx b/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx
index fe551b52892..2a2ab7ddf4e 100644
--- a/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx
+++ b/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx
@@ -211,10 +211,14 @@ export const DateTimeRangePicker: FC<DateTimeRangePickerProps> = ({
 	return (
 		<Popover open={open} onOpenChange={handleOpenChange}>
 			<PopoverTrigger asChild>
+				{/* The icon sizes are marked important because the Button's
+				    `[&>svg]` sizing/padding rules would otherwise win on
+				    specificity and inflate the icons at larger button sizes.
+				    The calendar matches the search field icon (size-icon-sm). */}
 				<Button variant="outline" size={size} className="group">
-					<CalendarIcon className="size-4 text-content-secondary" />
+					<CalendarIcon className="!size-icon-sm !p-0 text-content-secondary" />
 					<span>{triggerLabel}</span>
-					<ChevronDownIcon className="size-3.5 text-content-secondary" />
+					<ChevronDownIcon className="!size-3.5 !p-0 text-content-secondary" />
 				</Button>
 			</PopoverTrigger>
 			<PopoverContent

From 0e88309684a731ee220f35c1e0108602c36d04c4 Mon Sep 17 00:00:00 2001
From: TJ <tracy@coder.com>
Date: Mon, 24 Aug 2026 07:40:32 -0700
Subject: [PATCH 4/9] fix(site): match date picker icon-to-text spacing to
 search field

---
 .../components/DateTimeRangePicker/DateTimeRangePicker.tsx  | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx b/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx
index 2a2ab7ddf4e..23a2467ede3 100644
--- a/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx
+++ b/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx
@@ -214,9 +214,11 @@ export const DateTimeRangePicker: FC<DateTimeRangePickerProps> = ({
 				{/* The icon sizes are marked important because the Button's
 				    `[&>svg]` sizing/padding rules would otherwise win on
 				    specificity and inflate the icons at larger button sizes.
-				    The calendar matches the search field icon (size-icon-sm). */}
+				    The calendar matches the search field icon (size-icon-sm),
+				    and its mr-1 plus the button's gap-1 matches the search
+				    field's 8px icon-to-text spacing. */}
 				<Button variant="outline" size={size} className="group">
-					<CalendarIcon className="!size-icon-sm !p-0 text-content-secondary" />
+					<CalendarIcon className="!size-icon-sm !p-0 mr-1 text-content-secondary" />
 					<span>{triggerLabel}</span>
 					<ChevronDownIcon className="!size-3.5 !p-0 text-content-secondary" />
 				</Button>

From 5638233fa6831edb1c451fac64d1fb9a65e94fd9 Mon Sep 17 00:00:00 2001
From: TJ <tracy@coder.com>
Date: Mon, 24 Aug 2026 07:48:51 -0700
Subject: [PATCH 5/9] fix(site): thin calendar icon stroke for optical parity
 with search icon

---
 .../DateTimeRangePicker/DateTimeRangePicker.tsx          | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx b/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx
index 23a2467ede3..726f409c031 100644
--- a/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx
+++ b/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx
@@ -216,9 +216,14 @@ export const DateTimeRangePicker: FC<DateTimeRangePickerProps> = ({
 				    specificity and inflate the icons at larger button sizes.
 				    The calendar matches the search field icon (size-icon-sm),
 				    and its mr-1 plus the button's gap-1 matches the search
-				    field's 8px icon-to-text spacing. */}
+				    field's 8px icon-to-text spacing. The calendar glyph is
+				    denser than the magnifier, so its stroke is slightly
+				    thinner to read as the same optical weight. */}
 				<Button variant="outline" size={size} className="group">
-					<CalendarIcon className="!size-icon-sm !p-0 mr-1 text-content-secondary" />
+					<CalendarIcon
+						strokeWidth={1.75}
+						className="!size-icon-sm !p-0 mr-1 text-content-secondary"
+					/>
 					<span>{triggerLabel}</span>
 					<ChevronDownIcon className="!size-3.5 !p-0 text-content-secondary" />
 				</Button>

From 17281f0807c217893701b0115427aac04794e650 Mon Sep 17 00:00:00 2001
From: TJ <tracy@coder.com>
Date: Mon, 24 Aug 2026 08:00:11 -0700
Subject: [PATCH 6/9] fix(site): restore chevron icon to production styling

---
 .../DateTimeRangePicker.tsx                    | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx b/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx
index 726f409c031..b37cbf4bdb6 100644
--- a/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx
+++ b/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx
@@ -211,21 +211,21 @@ export const DateTimeRangePicker: FC<DateTimeRangePickerProps> = ({
 	return (
 		<Popover open={open} onOpenChange={handleOpenChange}>
 			<PopoverTrigger asChild>
-				{/* The icon sizes are marked important because the Button's
-				    `[&>svg]` sizing/padding rules would otherwise win on
-				    specificity and inflate the icons at larger button sizes.
-				    The calendar matches the search field icon (size-icon-sm),
-				    and its mr-1 plus the button's gap-1 matches the search
-				    field's 8px icon-to-text spacing. The calendar glyph is
-				    denser than the magnifier, so its stroke is slightly
-				    thinner to read as the same optical weight. */}
+				{/* The calendar icon sizing is marked important because the
+				    Button's `[&>svg]` sizing/padding rules would otherwise win
+				    on specificity and inflate it at larger button sizes. It
+				    matches the search field icon (size-icon-sm), and its mr-1
+				    plus the button's gap-1 matches the search field's 8px
+				    icon-to-text spacing. The calendar glyph is denser than the
+				    magnifier, so its stroke is slightly thinner to read as the
+				    same optical weight. */}
 				<Button variant="outline" size={size} className="group">
 					<CalendarIcon
 						strokeWidth={1.75}
 						className="!size-icon-sm !p-0 mr-1 text-content-secondary"
 					/>
 					<span>{triggerLabel}</span>
-					<ChevronDownIcon className="!size-3.5 !p-0 text-content-secondary" />
+					<ChevronDownIcon className="size-3.5 text-content-secondary" />
 				</Button>
 			</PopoverTrigger>
 			<PopoverContent

From 171695dbf388e24d982996dfd06fee14c8b15343 Mon Sep 17 00:00:00 2001
From: TJ <tracy@coder.com>
Date: Mon, 24 Aug 2026 08:28:09 -0700
Subject: [PATCH 7/9] fix(site): match date picker chevron color and spacing to
 other dropdowns

---
 .../DateTimeRangePicker.tsx                   | 23 ++++++++++---------
 1 file changed, 12 insertions(+), 11 deletions(-)

diff --git a/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx b/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx
index b37cbf4bdb6..34a47187e02 100644
--- a/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx
+++ b/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx
@@ -211,21 +211,22 @@ export const DateTimeRangePicker: FC<DateTimeRangePickerProps> = ({
 	return (
 		<Popover open={open} onOpenChange={handleOpenChange}>
 			<PopoverTrigger asChild>
-				{/* The calendar icon sizing is marked important because the
-				    Button's `[&>svg]` sizing/padding rules would otherwise win
-				    on specificity and inflate it at larger button sizes. It
-				    matches the search field icon (size-icon-sm), and its mr-1
-				    plus the button's gap-1 matches the search field's 8px
-				    icon-to-text spacing. The calendar glyph is denser than the
-				    magnifier, so its stroke is slightly thinner to read as the
-				    same optical weight. */}
-				<Button variant="outline" size={size} className="group">
+				{/* The trigger mirrors ComboboxButton (gap-2, pr-1.5, chevron
+				    inheriting the button's primary text color) so it matches
+				    the other filter dropdowns. The calendar icon sizing is
+				    marked important because the Button's `[&>svg]` rules would
+				    otherwise win on specificity and inflate it at larger button
+				    sizes; it matches the search field icon (size-icon-sm) with
+				    the same 8px icon-to-text spacing via gap-2. The calendar
+				    glyph is denser than the magnifier, so its stroke is
+				    slightly thinner to read as the same optical weight. */}
+				<Button variant="outline" size={size} className="group gap-2 pr-1.5">
 					<CalendarIcon
 						strokeWidth={1.75}
-						className="!size-icon-sm !p-0 mr-1 text-content-secondary"
+						className="!size-icon-sm !p-0 text-content-secondary"
 					/>
 					<span>{triggerLabel}</span>
-					<ChevronDownIcon className="size-3.5 text-content-secondary" />
+					<ChevronDownIcon className="size-icon-sm" />
 				</Button>
 			</PopoverTrigger>
 			<PopoverContent

From c4b974959a3cac6833e6b8502ce72c4c64877d5a Mon Sep 17 00:00:00 2001
From: TJ <tracy@coder.com>
Date: Mon, 24 Aug 2026 09:04:21 -0700
Subject: [PATCH 8/9] fix(site): use primary content color for date picker
 calendar icon

---
 .../components/DateTimeRangePicker/DateTimeRangePicker.tsx | 7 ++-----
 1 file changed, 2 insertions(+), 5 deletions(-)

diff --git a/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx b/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx
index 34a47187e02..d982b9869cb 100644
--- a/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx
+++ b/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx
@@ -211,7 +211,7 @@ export const DateTimeRangePicker: FC<DateTimeRangePickerProps> = ({
 	return (
 		<Popover open={open} onOpenChange={handleOpenChange}>
 			<PopoverTrigger asChild>
-				{/* The trigger mirrors ComboboxButton (gap-2, pr-1.5, chevron
+				{/* The trigger mirrors ComboboxButton (gap-2, pr-1.5, icons
 				    inheriting the button's primary text color) so it matches
 				    the other filter dropdowns. The calendar icon sizing is
 				    marked important because the Button's `[&>svg]` rules would
@@ -221,10 +221,7 @@ export const DateTimeRangePicker: FC<DateTimeRangePickerProps> = ({
 				    glyph is denser than the magnifier, so its stroke is
 				    slightly thinner to read as the same optical weight. */}
 				<Button variant="outline" size={size} className="group gap-2 pr-1.5">
-					<CalendarIcon
-						strokeWidth={1.75}
-						className="!size-icon-sm !p-0 text-content-secondary"
-					/>
+					<CalendarIcon strokeWidth={1.75} className="!size-icon-sm !p-0" />
 					<span>{triggerLabel}</span>
 					<ChevronDownIcon className="size-icon-sm" />
 				</Button>

From 20c1229c30e5fe0ad5ae5e965a202f37f5485d26 Mon Sep 17 00:00:00 2001
From: Tracy Johnson <tracy@coder.com>
Date: Wed, 26 Aug 2026 20:08:11 +0000
Subject: [PATCH 9/9] fix(site): address date picker review comments

---
 .../DateTimeRangePicker/DateTimeRangePicker.tsx     | 13 +++----------
 1 file changed, 3 insertions(+), 10 deletions(-)

diff --git a/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx b/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx
index d982b9869cb..f3c1d7e1207 100644
--- a/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx
+++ b/site/src/components/DateTimeRangePicker/DateTimeRangePicker.tsx
@@ -211,17 +211,10 @@ export const DateTimeRangePicker: FC<DateTimeRangePickerProps> = ({
 	return (
 		<Popover open={open} onOpenChange={handleOpenChange}>
 			<PopoverTrigger asChild>
-				{/* The trigger mirrors ComboboxButton (gap-2, pr-1.5, icons
-				    inheriting the button's primary text color) so it matches
-				    the other filter dropdowns. The calendar icon sizing is
-				    marked important because the Button's `[&>svg]` rules would
-				    otherwise win on specificity and inflate it at larger button
-				    sizes; it matches the search field icon (size-icon-sm) with
-				    the same 8px icon-to-text spacing via gap-2. The calendar
-				    glyph is denser than the magnifier, so its stroke is
-				    slightly thinner to read as the same optical weight. */}
 				<Button variant="outline" size={size} className="group gap-2 pr-1.5">
-					<CalendarIcon strokeWidth={1.75} className="!size-icon-sm !p-0" />
+					<span className="size-icon-sm shrink-0">
+						<CalendarIcon strokeWidth={1.75} className="size-full p-0" />
+					</span>
 					<span>{triggerLabel}</span>
 					<ChevronDownIcon className="size-icon-sm" />
 				</Button>