diff --git a/web/src/ui/rightpanel/UserExtendedProfile.tsx b/web/src/ui/rightpanel/UserExtendedProfile.tsx
index 4be2b7c..1f2cc3c 100644
--- a/web/src/ui/rightpanel/UserExtendedProfile.tsx
+++ b/web/src/ui/rightpanel/UserExtendedProfile.tsx
@@ -61,16 +61,19 @@ function SetTimezoneElement({ tz, client }: SetTimezoneProps) {
 			)
 		}
 	}
+	// TODO: You are unable to set a timezone if you do not already have one set in your profile.
+	//  The defaulting to the current timezone causes `newTz !== tz` to never be true when the user has
+	//  no timezone set.
 
 	return (
 		<>
 			<input
-				list={"timezones"}
-				className={"text-input"}
+				list="timezones"
+				className="text-input"
 				defaultValue={tz || getCurrentTimezone()}
 				onChange={(e) => setTz(e.currentTarget.value)}
 			/>
-			<datalist id={"timezones"}>
+			<datalist id="timezones">
 				{
 					zones.map((zone) => <option key={zone} value={zone} />)
 				}
@@ -90,42 +93,27 @@ export default function UserExtendedProfile({ profile, client, userID }: Extende
 	// otherwise there's an ugly and pointless <hr/> for no real reason.
 
 	const pronouns: PronounSet[] = ensureArray(profile["io.fsky.nyx.pronouns"]) as PronounSet[]
+	const userTimezone: string | undefined = profile["us.cloke.msc4175.tz"]
 	return (
 		<>
 			<hr/>
-			<div className={"extended-profile"}>
-				{
-					profile["us.cloke.msc4175.tz"] && (
-						<>
-							<div title={profile["us.cloke.msc4175.tz"]}>Time:</div>
-							<ClockElement tz={profile["us.cloke.msc4175.tz"]} />
-						</>
-					)
-				}
-				{
-					userID === client.userID && (
-						<>
-							<div>Set Timezone:</div>
-							<SetTimezoneElement tz={profile["us.cloke.msc4175.tz"]} client={client} />
-						</>
-					)
-				}
-				{
-					pronouns.length >= 1 && (
-						<>
-							<div>Pronouns:</div>
-							<div>
-								{
-									pronouns.map(
-										(pronounSet: PronounSet) => (
-											pronounSet.summary || `${pronounSet.subject}/${pronounSet.object}`
-										),
-									).join("/")
-								}
-							</div>
-						</>
-					)
-				}
+			<div className="extended-profile">
+				{userTimezone && <>
+					<div title={userTimezone}>Time:</div>
+					<ClockElement tz={userTimezone} />
+				</>}
+				{userID === client.userID && <>
+					<div>Set Timezone:</div>
+					<SetTimezoneElement tz={userTimezone} client={client} />
+				</>}
+				{pronouns.length >= 1 && <>
+					<div>Pronouns:</div>
+					<div>
+						{pronouns.map((pronounSet: PronounSet) => (
+							pronounSet.summary || `${pronounSet.subject}/${pronounSet.object}`
+						)).join("/")}
+					</div>
+				</>}
 			</div>
 		</>
 	)
diff --git a/web/src/ui/rightpanel/UserInfo.tsx b/web/src/ui/rightpanel/UserInfo.tsx
index fd4275a..2b6e864 100644
--- a/web/src/ui/rightpanel/UserInfo.tsx
+++ b/web/src/ui/rightpanel/UserInfo.tsx
@@ -18,11 +18,11 @@ import { PuffLoader } from "react-spinners"
 import { getAvatarURL } from "@/api/media.ts"
 import { useRoomMember } from "@/api/statestore"
 import { MemberEventContent, UserID, UserProfile } from "@/api/types"
-import UserExtendedProfile from "@/ui/rightpanel/UserExtendedProfile.tsx"
 import { getLocalpart } from "@/util/validation.ts"
 import ClientContext from "../ClientContext.ts"
 import { LightboxContext } from "../modal"
 import { RoomContext } from "../roomview/roomcontext.ts"
+import UserExtendedProfile from "./UserExtendedProfile.tsx"
 import DeviceList from "./UserInfoDeviceList.tsx"
 import UserInfoError from "./UserInfoError.tsx"
 import MutualRooms from "./UserInfoMutualRooms.tsx"