1import type {
2 EnvironmentId,
3 UserInputAttachmentAnswerPayload,
4 UserInputAttachments,
5} from "@t3tools/contracts";
6import { Image } from "expo-image";
7import { Linking, Pressable, View } from "react-native";
8import { getQuestionAnswerText } from "@t3tools/client-runtime/work-log/user-input";
9import { AppText as Text } from "../../components/AppText";
10import { assetImageSource } from "../../lib/assetImageSource";
11import { useAssetUrl } from "../../state/assets";
12
13function AnswerFile(props: {
14 environmentId: EnvironmentId;
15 attachment: UserInputAttachments[string][number];
16}) {
17 const resource = { _tag: "attachment", attachmentId: props.attachment.id } as const;
18 const url = useAssetUrl(props.environmentId, resource);
19 return (
20 <Pressable
21 accessibilityRole="link"
22 accessibilityLabel={props.attachment.name}
23 disabled={!url}
24 onPress={() => {
25 if (url) void Linking.openURL(url);
26 }}
27 className="gap-1"
28 >
29 {props.attachment.type === "image" && url ? (
30 <Image
31 source={assetImageSource(props.environmentId, resource, url)}
32 cachePolicy="memory-disk"
33 style={{ width: 160, height: 96 }}
34 contentFit="contain"
35 />
36 ) : null}
37 <Text className="text-sm text-foreground underline">{props.attachment.name}</Text>
38 </Pressable>
39 );
40}
41
42export function QuestionAnswerHistory(props: {
43 environmentId: EnvironmentId;
44 answer: UserInputAttachmentAnswerPayload;
45}) {
46 return (
47 <View className="gap-2">
48 {[
49 ...new Set([
50 ...Object.keys(props.answer.questionTextById ?? {}),
51 ...Object.keys(props.answer.answers),
52 ...Object.keys(props.answer.attachmentsByQuestionId),
53 ]),
54 ].map((questionId) => (
55 <View key={questionId} className="gap-1">
56 {props.answer.questionTextById?.[questionId] ? (
57 <Text className="text-sm text-foreground-muted">
58 {props.answer.questionTextById[questionId]}
59 </Text>
60 ) : null}
61 {getQuestionAnswerText(props.answer.answers[questionId]) ? (
62 <Text className="ml-3 text-sm text-foreground-muted">
63 {getQuestionAnswerText(props.answer.answers[questionId])}
64 </Text>
65 ) : null}
66 {(props.answer.attachmentsByQuestionId[questionId] ?? []).map((attachment) => (
67 <AnswerFile
68 key={attachment.id}
69 environmentId={props.environmentId}
70 attachment={attachment}
71 />
72 ))}
73 </View>
74 ))}
75 </View>
76 );
77}