authorgravatar for n.anisimov.23@gmail.comNick Anisimov <n.anisimov.23@gmail.com> 2026-08-18 11:37:10+04:00
committergravatar for noreply@github.comGitHub <noreply@github.com> 2026-08-18 09:37:10+02:00
logcebac353defde6211c9e8c3d8ecd140c92042930
treeacfadd32d952f5ecadebcb9f3b03eb4a034c0b41
parent3723722f740dd5ee95b021ca6e2291400074be3b
signature Signed by PGP key B5690EEEBB952194

fix(mobile): show structured input option descriptions (#7321)

1 files changed, 21 insertions(+), 12 deletions(-)

apps/mobile/src/features/threads/PendingUserInputCard.tsx+21-12
...@@ -257,14 +257,16 @@ export function PendingUserInputCard(props: PendingUserInputCardProps) {...@@ -257,14 +257,16 @@ export function PendingUserInputCard(props: PendingUserInputCardProps) {
257 <Text className="font-sans text-base leading-snug text-neutral-950 dark:text-neutral-50">257 <Text className="font-sans text-base leading-snug text-neutral-950 dark:text-neutral-50">
258 {question.question}258 {question.question}
259 </Text>259 </Text>
260 <View className="flex-row flex-wrap gap-2.5">260 <View className="gap-2">
261 {question.options.map((option) => {261 {question.options.map((option) => {
262 const selected = isPendingUserInputOptionSelected(draft, option.label);262 const selected = isPendingUserInputOptionSelected(draft, option.label);
263 const description =
264 option.description !== option.label ? option.description : undefined;
263 return (265 return (
264 <Pressable266 <Pressable
265 key={option.label}267 key={option.label}
266 className={cn(268 className={cn(
267 "rounded-full border px-3 py-2.5 ",269 "min-h-12 w-full rounded-2xl border px-3.5 py-3",
268 selected270 selected
269 ? "border-blue-300/50 bg-blue-50 dark:border-blue-400/28 dark:bg-blue-400/14"271 ? "border-blue-300/50 bg-blue-50 dark:border-blue-400/28 dark:bg-blue-400/14"
270 : "border-neutral-200 bg-white dark:border-white/6 dark:bg-neutral-950/70",272 : "border-neutral-200 bg-white dark:border-white/6 dark:bg-neutral-950/70",
...@@ -277,16 +279,23 @@ export function PendingUserInputCard(props: PendingUserInputCardProps) {...@@ -277,16 +279,23 @@ export function PendingUserInputCard(props: PendingUserInputCardProps) {
277 )279 )
278 }280 }
279 >281 >
280 <Text282 <View className="min-w-0 flex-1 gap-0.5">
281 className={cn(283 <Text
282 "font-t3-bold text-sm",284 className={cn(
283 selected285 "font-t3-bold text-sm",
284 ? "text-sky-700 dark:text-sky-300"286 selected
285 : "text-neutral-600 dark:text-neutral-300",287 ? "text-sky-700 dark:text-sky-300"
286 )}288 : "text-neutral-700 dark:text-neutral-200",
287 >289 )}
288 {option.label}290 >
289 </Text>291 {option.label}
292 </Text>
293 {description ? (
294 <Text className="font-sans text-sm leading-5 text-neutral-500 dark:text-neutral-400">
295 {description}
296 </Text>
297 ) : null}
298 </View>
290 </Pressable>299 </Pressable>
291 );300 );
292 })}301 })}