@webority/mobile-support 0.0.12 → 0.1.0

package/lib/module/components/SupportContact.js

@@ -1,129 +1 @@
-"use strict";
-
-import { Button, Card, Spinner, Text, toast, useTheme } from '@webority/mobile-ui';
-import { useMemo } from 'react';
-import { Linking, StyleSheet, View } from 'react-native';
-import { copyText } from "../clipboard.js";
-import { useSupportConfig } from "../SupportProvider.js";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-/** How to reach the support team: email with copy and compose, phone, and hours. */
-export const SupportContact = ({
-  testID = 'support-contact'
-}) => {
-  const theme = useTheme();
-  const styles = useMemo(() => buildStyles(theme), [theme]);
-  const {
-    config,
-    loading,
-    error
-  } = useSupportConfig();
-  if (!config) {
-    return /*#__PURE__*/_jsx(Card, {
-      variant: "outlined",
-      testID: testID,
-      children: loading ? /*#__PURE__*/_jsx(Spinner, {
-        size: "sm",
-        accessibilityLabel: "Loading contact details"
-      }) : /*#__PURE__*/_jsx(Text, {
-        variant: "bodySmall",
-        color: "error",
-        children: error?.message ?? 'Contact details are not available right now.'
-      })
-    });
-  }
-  const email = config.supportEmail;
-  const phone = config.supportPhone?.trim();
-  const hours = config.supportHours?.trim();
-  const copyEmail = async () => {
-    try {
-      await copyText(email);
-      toast.success('Email address copied.');
-    } catch {
-      toast.error('Could not copy the email address.');
-    }
-  };
-  const open = (url, failure) => {
-    Linking.openURL(url).catch(() => toast.error(failure));
-  };
-  return /*#__PURE__*/_jsxs(Card, {
-    variant: "outlined",
-    bodyStyle: styles.body,
-    testID: testID,
-    children: [/*#__PURE__*/_jsx(Text, {
-      variant: "title",
-      accessibilityRole: "header",
-      children: `Contact ${config.supportName || config.productName}`
-    }), /*#__PURE__*/_jsxs(View, {
-      style: styles.row,
-      children: [/*#__PURE__*/_jsx(Text, {
-        variant: "label",
-        color: "secondary",
-        children: "Email"
-      }), /*#__PURE__*/_jsx(Text, {
-        variant: "body",
-        selectable: true,
-        testID: "support-contact-email",
-        children: email || '-'
-      })]
-    }), email ? /*#__PURE__*/_jsxs(View, {
-      style: styles.actions,
-      children: [/*#__PURE__*/_jsx(Button, {
-        title: "Copy",
-        size: "sm",
-        variant: "outline",
-        tone: "neutral",
-        leftIcon: "copy",
-        accessibilityLabel: `Copy ${email}`,
-        onPress: () => void copyEmail(),
-        testID: "support-contact-copy"
-      }), /*#__PURE__*/_jsx(Button, {
-        title: "Send email",
-        size: "sm",
-        variant: "outline",
-        leftIcon: "mail",
-        accessibilityLabel: `Send an email to ${email}`,
-        onPress: () => open(`mailto:${email}`, 'No email app is set up on this device.'),
-        testID: "support-contact-mail"
-      })]
-    }) : null, phone ? /*#__PURE__*/_jsxs(View, {
-      style: styles.row,
-      children: [/*#__PURE__*/_jsx(Text, {
-        variant: "label",
-        color: "secondary",
-        children: "Phone"
-      }), /*#__PURE__*/_jsx(Button, {
-        title: phone,
-        size: "sm",
-        variant: "link",
-        leftIcon: "call",
-        accessibilityLabel: `Call ${phone}`,
-        onPress: () => open(`tel:${phone.replace(/[^\d+]/g, '')}`, 'This device cannot make calls.'),
-        testID: "support-contact-phone"
-      })]
-    }) : null, hours ? /*#__PURE__*/_jsxs(View, {
-      style: styles.row,
-      children: [/*#__PURE__*/_jsx(Text, {
-        variant: "label",
-        color: "secondary",
-        children: "Hours"
-      }), /*#__PURE__*/_jsx(Text, {
-        variant: "bodySmall",
-        children: hours
-      })]
-    }) : null]
-  });
-};
-const buildStyles = theme => StyleSheet.create({
-  body: {
-    gap: theme.spacing.sm
-  },
-  row: {
-    gap: theme.spacing.xxs,
-    alignItems: 'flex-start'
-  },
-  actions: {
-    flexDirection: 'row',
-    gap: theme.spacing.sm
-  }
-});
-//# sourceMappingURL=SupportContact.js.map
+import{Button as t,Card as e,Spinner as a,Text as o,toast as r,useTheme as i}from"@webority/mobile-ui";import{useMemo as l}from"react";import{Linking as s,StyleSheet as n,View as c}from"react-native";import{copyText as p}from"../clipboard.js";import{useSupportConfig as d}from"../SupportProvider.js";import{jsx as m,jsxs as u}from"react/jsx-runtime";export const SupportContact=({testID:n="support-contact"})=>{const y=i(),b=l(()=>buildStyles(y),[y]),{config:h,loading:v,error:f}=d();if(!h)return m(e,{variant:"outlined",testID:n,children:v?m(a,{size:"sm",accessibilityLabel:"Loading contact details"}):m(o,{variant:"bodySmall",color:"error",children:f?.message??"Contact details are not available right now."})});const g=h.supportEmail,I=h.supportPhone?.trim(),w=h.supportHours?.trim(),open=(t,e)=>{s.openURL(t).catch(()=>r.error(e))};return u(e,{variant:"outlined",bodyStyle:b.body,testID:n,children:[m(o,{variant:"title",accessibilityRole:"header",children:`Contact ${h.supportName||h.productName}`}),u(c,{style:b.row,children:[m(o,{variant:"label",color:"secondary",children:"Email"}),m(o,{variant:"body",selectable:!0,testID:"support-contact-email",children:g||"-"})]}),g?u(c,{style:b.actions,children:[m(t,{title:"Copy",size:"sm",variant:"outline",tone:"neutral",leftIcon:"copy",accessibilityLabel:`Copy ${g}`,onPress:()=>{(async()=>{try{await p(g),r.success("Email address copied.")}catch{r.error("Could not copy the email address.")}})()},testID:"support-contact-copy"}),m(t,{title:"Send email",size:"sm",variant:"outline",leftIcon:"mail",accessibilityLabel:`Send an email to ${g}`,onPress:()=>open(`mailto:${g}`,"No email app is set up on this device."),testID:"support-contact-mail"})]}):null,I?u(c,{style:b.row,children:[m(o,{variant:"label",color:"secondary",children:"Phone"}),m(t,{title:I,size:"sm",variant:"link",leftIcon:"call",accessibilityLabel:`Call ${I}`,onPress:()=>open(`tel:${I.replace(/[^\d+]/g,"")}`,"This device cannot make calls."),testID:"support-contact-phone"})]}):null,w?u(c,{style:b.row,children:[m(o,{variant:"label",color:"secondary",children:"Hours"}),m(o,{variant:"bodySmall",children:w})]}):null]})};const buildStyles=t=>n.create({body:{gap:t.spacing.sm},row:{gap:t.spacing.xxs,alignItems:"flex-start"},actions:{flexDirection:"row",gap:t.spacing.sm}});

package/lib/module/components/SupportTicketDetail.js

@@ -1,343 +1 @@
-"use strict";
-
-import { Button, Card, Input, Spinner, StatusBadge, Text, useTheme } from '@webority/mobile-ui';
-import { useMemo, useState } from 'react';
-import { ScrollView, StyleSheet, View } from 'react-native';
-import { formatWhen } from "../format.js";
-import { useSupportConfig, useSupportTicket } from "../SupportProvider.js";
-import { validateBody, validateFiles } from "../validation.js";
-import { AttachmentList, ImageViewer } from "./Attachments.js";
-import { PhotoTray } from "./PhotoTray.js";
-import { STATUS_TONES } from "./SupportTicketList.js";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-const MessageBubble = ({
-  message,
-  styles,
-  onOpenImage
-}) => {
-  if (message.authorKind === 'System') {
-    return /*#__PURE__*/_jsx(View, {
-      style: styles.system,
-      testID: `support-message-${message.id}`,
-      children: /*#__PURE__*/_jsx(Text, {
-        variant: "caption",
-        color: "tertiary",
-        align: "center",
-        children: `${message.body}, ${formatWhen(message.createdDateTimeUtc)}`
-      })
-    });
-  }
-  const mine = message.authorKind === 'Customer';
-  return /*#__PURE__*/_jsx(View, {
-    style: [styles.bubbleRow, mine ? styles.mineRow : styles.theirsRow],
-    testID: `support-message-${message.id}`,
-    children: /*#__PURE__*/_jsxs(View, {
-      style: [styles.bubble, mine ? styles.mine : styles.theirs],
-      children: [/*#__PURE__*/_jsx(Text, {
-        variant: "label",
-        color: mine ? 'primary' : 'secondary',
-        children: message.authorName ?? '-'
-      }), /*#__PURE__*/_jsx(Text, {
-        variant: "body",
-        selectable: true,
-        children: message.body
-      }), /*#__PURE__*/_jsx(AttachmentList, {
-        attachments: message.attachments,
-        onOpenImage: onOpenImage
-      }), /*#__PURE__*/_jsx(Text, {
-        variant: "caption",
-        color: "tertiary",
-        children: formatWhen(message.createdDateTimeUtc)
-      })]
-    })
-  });
-};
-const SATISFACTION_TEXT = {
-  Satisfied: 'You said we handled this well.',
-  Unsatisfied: 'You said we did not handle this well.'
-};
-export const SupportTicketDetail = ({
-  ticketId,
-  testID = 'support-ticket-detail'
-}) => {
-  const theme = useTheme();
-  const styles = useMemo(() => buildStyles(theme), [theme]);
-  const {
-    config
-  } = useSupportConfig();
-  const {
-    ticket,
-    loading,
-    error,
-    actionError,
-    busy,
-    reload,
-    reply,
-    reopen,
-    rate
-  } = useSupportTicket(ticketId);
-  const [viewing, setViewing] = useState(null);
-  const [draft, setDraft] = useState('');
-  const [photos, setPhotos] = useState([]);
-  const [replyError, setReplyError] = useState(null);
-  const [choice, setChoice] = useState(null);
-  const [comment, setComment] = useState('');
-  if (!ticket) {
-    return /*#__PURE__*/_jsx(View, {
-      style: styles.center,
-      testID: testID,
-      children: loading ? /*#__PURE__*/_jsx(Spinner, {
-        accessibilityLabel: "Loading the ticket"
-      }) : /*#__PURE__*/_jsxs(_Fragment, {
-        children: [/*#__PURE__*/_jsx(Text, {
-          variant: "body",
-          color: "error",
-          align: "center",
-          children: error?.message ?? 'That ticket could not be found.'
-        }), /*#__PURE__*/_jsx(Button, {
-          title: "Try again",
-          variant: "ghost",
-          onPress: () => void reload()
-        })]
-      })
-    });
-  }
-  const sendReply = async () => {
-    const body = draft.trim();
-    // Without the config the server still enforces its limits; only emptiness is checked here.
-    const problem = config ? validateBody(body, config) ?? validateFiles(photos, config) : body ? undefined : 'Write a message.';
-    if (problem) {
-      setReplyError(problem);
-      return;
-    }
-    setReplyError(null);
-    if (await reply({
-      body,
-      files: photos
-    })) {
-      setDraft('');
-      setPhotos([]);
-    }
-  };
-  const sendRating = async () => {
-    if (!choice) {
-      return;
-    }
-    if (await rate({
-      satisfaction: choice,
-      comment
-    })) {
-      setChoice(null);
-      setComment('');
-    }
-  };
-  const visible = ticket.messages.filter(m => !m.isInternal);
-  return /*#__PURE__*/_jsxs(View, {
-    style: styles.root,
-    testID: testID,
-    children: [/*#__PURE__*/_jsxs(ScrollView, {
-      contentContainerStyle: styles.content,
-      keyboardShouldPersistTaps: "handled",
-      children: [/*#__PURE__*/_jsxs(View, {
-        style: styles.head,
-        children: [/*#__PURE__*/_jsx(Text, {
-          variant: "h3",
-          accessibilityRole: "header",
-          children: ticket.subject
-        }), /*#__PURE__*/_jsx(Text, {
-          variant: "bodySmall",
-          color: "secondary",
-          children: `${ticket.number}, ${ticket.category}`
-        }), /*#__PURE__*/_jsxs(View, {
-          style: styles.headRow,
-          children: [/*#__PURE__*/_jsx(StatusBadge, {
-            label: ticket.statusLabel,
-            tone: STATUS_TONES[ticket.status] ?? 'neutral',
-            accessibilityLabel: `Status: ${ticket.statusLabel}`
-          }), /*#__PURE__*/_jsx(Text, {
-            variant: "caption",
-            color: "tertiary",
-            children: `Opened ${formatWhen(ticket.createdDateTimeUtc)}`
-          })]
-        })]
-      }), ticket.canReopen && /*#__PURE__*/_jsxs(Card, {
-        variant: "outlined",
-        bodyStyle: styles.section,
-        children: [/*#__PURE__*/_jsx(Text, {
-          variant: "bodySmall",
-          children: `This ticket is ${ticket.statusLabel}. Reopen it if you still need help.`
-        }), /*#__PURE__*/_jsx(Button, {
-          title: "Reopen ticket",
-          variant: "outline",
-          size: "sm",
-          loading: busy,
-          disabled: busy,
-          onPress: () => void reopen(),
-          testID: "support-reopen"
-        })]
-      }), ticket.canRate && /*#__PURE__*/_jsxs(Card, {
-        variant: "outlined",
-        bodyStyle: styles.section,
-        testID: "support-rating",
-        children: [/*#__PURE__*/_jsx(Text, {
-          variant: "label",
-          children: "How did we do?"
-        }), ticket.satisfaction && /*#__PURE__*/_jsx(Text, {
-          variant: "bodySmall",
-          color: "secondary",
-          children: SATISFACTION_TEXT[ticket.satisfaction]
-        }), /*#__PURE__*/_jsxs(View, {
-          style: styles.ratingRow,
-          children: [/*#__PURE__*/_jsx(Button, {
-            title: "Satisfied",
-            size: "sm",
-            leftIcon: "like",
-            variant: choice === 'Satisfied' ? 'solid' : 'outline',
-            tone: "success",
-            accessibilityState: {
-              selected: choice === 'Satisfied'
-            },
-            onPress: () => setChoice('Satisfied'),
-            testID: "support-rate-satisfied"
-          }), /*#__PURE__*/_jsx(Button, {
-            title: "Not satisfied",
-            size: "sm",
-            leftIcon: "dislike",
-            variant: choice === 'Unsatisfied' ? 'solid' : 'outline',
-            tone: "error",
-            accessibilityState: {
-              selected: choice === 'Unsatisfied'
-            },
-            onPress: () => setChoice('Unsatisfied'),
-            testID: "support-rate-unsatisfied"
-          })]
-        }), choice && /*#__PURE__*/_jsxs(_Fragment, {
-          children: [/*#__PURE__*/_jsx(Input, {
-            label: "Anything to add? (optional)",
-            value: comment,
-            onChangeText: setComment,
-            multiline: true,
-            maxLength: config?.satisfactionCommentMaxLength,
-            testID: "support-rating-comment"
-          }), /*#__PURE__*/_jsx(Button, {
-            title: "Send rating",
-            size: "sm",
-            loading: busy,
-            disabled: busy,
-            onPress: () => void sendRating(),
-            testID: "support-rating-send"
-          })]
-        })]
-      }), /*#__PURE__*/_jsx(View, {
-        style: styles.thread,
-        accessibilityLabel: "Conversation",
-        children: visible.map(m => /*#__PURE__*/_jsx(MessageBubble, {
-          message: m,
-          styles: styles,
-          onOpenImage: (uri, name) => setViewing({
-            uri,
-            name
-          })
-        }, m.id))
-      }), /*#__PURE__*/_jsxs(View, {
-        style: styles.section,
-        children: [/*#__PURE__*/_jsx(Input, {
-          label: "Your reply",
-          placeholder: "Write a reply to the support team",
-          value: draft,
-          onChangeText: setDraft,
-          multiline: true,
-          maxLength: config?.bodyMaxLength,
-          error: replyError ?? undefined,
-          testID: "support-reply-input"
-        }), config && /*#__PURE__*/_jsx(PhotoTray, {
-          photos: photos,
-          onChange: setPhotos,
-          remaining: config.maxAttachmentsPerMessage - photos.length,
-          maxBytes: config.maxAttachmentBytes,
-          disabled: busy
-        }), ticket.canReopen && /*#__PURE__*/_jsx(Text, {
-          variant: "caption",
-          color: "secondary",
-          children: "Replying reopens this ticket."
-        }), actionError && /*#__PURE__*/_jsx(Text, {
-          variant: "bodySmall",
-          color: "error",
-          accessibilityLiveRegion: "polite",
-          children: actionError.message
-        }), /*#__PURE__*/_jsx(Button, {
-          title: "Send reply",
-          leftIcon: "send",
-          loading: busy,
-          disabled: busy,
-          onPress: () => void sendReply(),
-          testID: "support-reply-send"
-        })]
-      })]
-    }), /*#__PURE__*/_jsx(ImageViewer, {
-      image: viewing,
-      onClose: () => setViewing(null)
-    })]
-  });
-};
-const buildStyles = theme => StyleSheet.create({
-  root: {
-    flex: 1
-  },
-  content: {
-    padding: theme.spacing.md,
-    gap: theme.spacing.md
-  },
-  center: {
-    flex: 1,
-    alignItems: 'center',
-    justifyContent: 'center',
-    padding: theme.spacing.xl,
-    gap: theme.spacing.sm
-  },
-  head: {
-    gap: theme.spacing.xxs
-  },
-  headRow: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    gap: theme.spacing.sm,
-    marginTop: theme.spacing.xs
-  },
-  section: {
-    gap: theme.spacing.sm
-  },
-  ratingRow: {
-    flexDirection: 'row',
-    gap: theme.spacing.sm
-  },
-  thread: {
-    gap: theme.spacing.sm
-  },
-  system: {
-    paddingHorizontal: theme.spacing.lg,
-    paddingVertical: theme.spacing.xxs
-  },
-  bubbleRow: {
-    flexDirection: 'row'
-  },
-  mineRow: {
-    justifyContent: 'flex-end'
-  },
-  theirsRow: {
-    justifyContent: 'flex-start'
-  },
-  bubble: {
-    maxWidth: '85%',
-    borderRadius: theme.radius.lg,
-    padding: theme.spacing.sm,
-    gap: theme.spacing.xxs
-  },
-  mine: {
-    backgroundColor: theme.colors.primaryMuted
-  },
-  theirs: {
-    backgroundColor: theme.colors.background.secondary
-  }
-});
-//# sourceMappingURL=SupportTicketDetail.js.map
+import{Button as e,Card as t,Input as i,Spinner as a,StatusBadge as n,Text as s,useTheme as r}from"@webority/mobile-ui";import{useMemo as o,useState as l}from"react";import{ScrollView as c,StyleSheet as d,View as p}from"react-native";import{formatWhen as m}from"../format.js";import{useSupportConfig as g,useSupportTicket as h,useSupportTimeZone as u}from"../SupportProvider.js";import{validateBody as y,validateFiles as b}from"../validation.js";import{AttachmentList as f,ImageViewer as x}from"./Attachments.js";import{PhotoTray as v}from"./PhotoTray.js";import{STATUS_TONES as I}from"./SupportTicketList.js";import{jsx as w,jsxs as S,Fragment as D}from"react/jsx-runtime";const MessageBubble=({message:e,styles:t,timeZone:i,onOpenImage:a})=>{if("System"===e.authorKind)return w(p,{style:t.system,testID:`support-message-${e.id}`,children:w(s,{variant:"caption",color:"tertiary",align:"center",children:`${e.body}, ${m(e.createdDateTimeUtc,i)}`})});const n="Customer"===e.authorKind;return w(p,{style:[t.bubbleRow,n?t.mineRow:t.theirsRow],testID:`support-message-${e.id}`,children:S(p,{style:[t.bubble,n?t.mine:t.theirs],children:[w(s,{variant:"label",color:n?"primary":"secondary",children:e.authorName??"-"}),w(s,{variant:"body",selectable:!0,children:e.body}),w(f,{attachments:e.attachments,onOpenImage:a}),w(s,{variant:"caption",color:"tertiary",children:m(e.createdDateTimeUtc,i)})]})})},R={Satisfied:"You said we handled this well.",Unsatisfied:"You said we did not handle this well."};export const SupportTicketDetail=({ticketId:d,testID:f="support-ticket-detail"})=>{const k=r(),j=o(()=>buildStyles(k),[k]),{config:C}=g(),L=u(),{ticket:T,loading:P,error:$,actionError:U,busy:z,reload:A,reply:M,reopen:O,rate:W}=h(d),[Y,B]=l(null),[H,K]=l(""),[N,Z]=l([]),[E,F]=l(null),[V,q]=l(null),[G,J]=l("");if(!T)return w(p,{style:j.center,testID:f,children:P?w(a,{accessibilityLabel:"Loading the ticket"}):S(D,{children:[w(s,{variant:"body",color:"error",align:"center",children:$?.message??"That ticket could not be found."}),w(e,{title:"Try again",variant:"ghost",onPress:()=>{A()}})]})});const Q=T.messages.filter(e=>!e.isInternal);return S(p,{style:j.root,testID:f,children:[S(c,{contentContainerStyle:j.content,keyboardShouldPersistTaps:"handled",children:[S(p,{style:j.head,children:[w(s,{variant:"h3",accessibilityRole:"header",children:T.subject}),w(s,{variant:"bodySmall",color:"secondary",children:`${T.number}, ${T.category}`}),S(p,{style:j.headRow,children:[w(n,{label:T.statusLabel,tone:I[T.status]??"neutral",accessibilityLabel:`Status: ${T.statusLabel}`}),w(s,{variant:"caption",color:"tertiary",children:`Opened ${m(T.createdDateTimeUtc,L)}`})]})]}),T.canReopen&&S(t,{variant:"outlined",bodyStyle:j.section,children:[w(s,{variant:"bodySmall",children:`This ticket is ${T.statusLabel}. Reopen it if you still need help.`}),w(e,{title:"Reopen ticket",variant:"outline",size:"sm",loading:z,disabled:z,onPress:()=>{O()},testID:"support-reopen"})]}),T.canRate&&S(t,{variant:"outlined",bodyStyle:j.section,testID:"support-rating",children:[w(s,{variant:"label",children:"How did we do?"}),T.satisfaction&&w(s,{variant:"bodySmall",color:"secondary",children:R[T.satisfaction]}),S(p,{style:j.ratingRow,children:[w(e,{title:"Satisfied",size:"sm",leftIcon:"like",variant:"Satisfied"===V?"solid":"outline",tone:"success",accessibilityState:{selected:"Satisfied"===V},onPress:()=>q("Satisfied"),testID:"support-rate-satisfied"}),w(e,{title:"Not satisfied",size:"sm",leftIcon:"dislike",variant:"Unsatisfied"===V?"solid":"outline",tone:"error",accessibilityState:{selected:"Unsatisfied"===V},onPress:()=>q("Unsatisfied"),testID:"support-rate-unsatisfied"})]}),V&&S(D,{children:[w(i,{label:"Anything to add? (optional)",value:G,onChangeText:J,multiline:!0,maxLength:C?.satisfactionCommentMaxLength,testID:"support-rating-comment"}),w(e,{title:"Send rating",size:"sm",loading:z,disabled:z,onPress:()=>{(async()=>{V&&await W({satisfaction:V,comment:G})&&(q(null),J(""))})()},testID:"support-rating-send"})]})]}),w(p,{style:j.thread,accessibilityLabel:"Conversation",children:Q.map(e=>w(MessageBubble,{message:e,styles:j,timeZone:L,onOpenImage:(e,t)=>B({uri:e,name:t})},e.id))}),S(p,{style:j.section,children:[w(i,{label:"Your reply",placeholder:"Write a reply to the support team",value:H,onChangeText:K,multiline:!0,maxLength:C?.bodyMaxLength,error:E??void 0,testID:"support-reply-input"}),C&&w(v,{photos:N,onChange:Z,remaining:C.maxAttachmentsPerMessage-N.length,maxBytes:C.maxAttachmentBytes,disabled:z}),T.canReopen&&w(s,{variant:"caption",color:"secondary",children:"Replying reopens this ticket."}),U&&w(s,{variant:"bodySmall",color:"error",accessibilityLiveRegion:"polite",children:U.message}),w(e,{title:"Send reply",leftIcon:"send",loading:z,disabled:z,onPress:()=>{(async()=>{const e=H.trim(),t=C?y(e,C)??b(N,C):e?void 0:"Write a message.";t?F(t):(F(null),await M({body:e,files:N})&&(K(""),Z([])))})()},testID:"support-reply-send"})]})]}),w(x,{image:Y,onClose:()=>B(null)})]})};const buildStyles=e=>d.create({root:{flex:1},content:{padding:e.spacing.md,gap:e.spacing.md},center:{flex:1,alignItems:"center",justifyContent:"center",padding:e.spacing.xl,gap:e.spacing.sm},head:{gap:e.spacing.xxs},headRow:{flexDirection:"row",alignItems:"center",gap:e.spacing.sm,marginTop:e.spacing.xs},section:{gap:e.spacing.sm},ratingRow:{flexDirection:"row",gap:e.spacing.sm},thread:{gap:e.spacing.sm},system:{paddingHorizontal:e.spacing.lg,paddingVertical:e.spacing.xxs},bubbleRow:{flexDirection:"row"},mineRow:{justifyContent:"flex-end"},theirsRow:{justifyContent:"flex-start"},bubble:{maxWidth:"85%",borderRadius:e.radius.lg,padding:e.spacing.sm,gap:e.spacing.xxs},mine:{backgroundColor:e.colors.primaryMuted},theirs:{backgroundColor:e.colors.background.secondary}});