@webority/mobile-support 0.0.13 → 0.2.0

package/lib/commonjs/components/SupportContact.js

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

package/lib/commonjs/components/SupportTicketDetail.js

@@ -1,348 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.SupportTicketDetail = void 0;
-var _mobileUi = require("@webority/mobile-ui");
-var _react = require("react");
-var _reactNative = require("react-native");
-var _format = require("../format.js");
-var _SupportProvider = require("../SupportProvider.js");
-var _validation = require("../validation.js");
-var _Attachments = require("./Attachments.js");
-var _PhotoTray = require("./PhotoTray.js");
-var _SupportTicketList = require("./SupportTicketList.js");
-var _jsxRuntime = require("react/jsx-runtime");
-const MessageBubble = ({
-  message,
-  styles,
-  onOpenImage
-}) => {
-  if (message.authorKind === 'System') {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-      style: styles.system,
-      testID: `support-message-${message.id}`,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_mobileUi.Text, {
-        variant: "caption",
-        color: "tertiary",
-        align: "center",
-        children: `${message.body}, ${(0, _format.formatWhen)(message.createdDateTimeUtc)}`
-      })
-    });
-  }
-  const mine = message.authorKind === 'Customer';
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-    style: [styles.bubbleRow, mine ? styles.mineRow : styles.theirsRow],
-    testID: `support-message-${message.id}`,
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: [styles.bubble, mine ? styles.mine : styles.theirs],
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_mobileUi.Text, {
-        variant: "label",
-        color: mine ? 'primary' : 'secondary',
-        children: message.authorName ?? '-'
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_mobileUi.Text, {
-        variant: "body",
-        selectable: true,
-        children: message.body
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Attachments.AttachmentList, {
-        attachments: message.attachments,
-        onOpenImage: onOpenImage
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_mobileUi.Text, {
-        variant: "caption",
-        color: "tertiary",
-        children: (0, _format.formatWhen)(message.createdDateTimeUtc)
-      })]
-    })
-  });
-};
-const SATISFACTION_TEXT = {
-  Satisfied: 'You said we handled this well.',
-  Unsatisfied: 'You said we did not handle this well.'
-};
-const SupportTicketDetail = ({
-  ticketId,
-  testID = 'support-ticket-detail'
-}) => {
-  const theme = (0, _mobileUi.useTheme)();
-  const styles = (0, _react.useMemo)(() => buildStyles(theme), [theme]);
-  const {
-    config
-  } = (0, _SupportProvider.useSupportConfig)();
-  const {
-    ticket,
-    loading,
-    error,
-    actionError,
-    busy,
-    reload,
-    reply,
-    reopen,
-    rate
-  } = (0, _SupportProvider.useSupportTicket)(ticketId);
-  const [viewing, setViewing] = (0, _react.useState)(null);
-  const [draft, setDraft] = (0, _react.useState)('');
-  const [photos, setPhotos] = (0, _react.useState)([]);
-  const [replyError, setReplyError] = (0, _react.useState)(null);
-  const [choice, setChoice] = (0, _react.useState)(null);
-  const [comment, setComment] = (0, _react.useState)('');
-  if (!ticket) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-      style: styles.center,
-      testID: testID,
-      children: loading ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_mobileUi.Spinner, {
-        accessibilityLabel: "Loading the ticket"
-      }) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_mobileUi.Text, {
-          variant: "body",
-          color: "error",
-          align: "center",
-          children: error?.message ?? 'That ticket could not be found.'
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_mobileUi.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 ? (0, _validation.validateBody)(body, config) ?? (0, _validation.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__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-    style: styles.root,
-    testID: testID,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.ScrollView, {
-      contentContainerStyle: styles.content,
-      keyboardShouldPersistTaps: "handled",
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-        style: styles.head,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_mobileUi.Text, {
-          variant: "h3",
-          accessibilityRole: "header",
-          children: ticket.subject
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_mobileUi.Text, {
-          variant: "bodySmall",
-          color: "secondary",
-          children: `${ticket.number}, ${ticket.category}`
-        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-          style: styles.headRow,
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_mobileUi.StatusBadge, {
-            label: ticket.statusLabel,
-            tone: _SupportTicketList.STATUS_TONES[ticket.status] ?? 'neutral',
-            accessibilityLabel: `Status: ${ticket.statusLabel}`
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_mobileUi.Text, {
-            variant: "caption",
-            color: "tertiary",
-            children: `Opened ${(0, _format.formatWhen)(ticket.createdDateTimeUtc)}`
-          })]
-        })]
-      }), ticket.canReopen && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_mobileUi.Card, {
-        variant: "outlined",
-        bodyStyle: styles.section,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_mobileUi.Text, {
-          variant: "bodySmall",
-          children: `This ticket is ${ticket.statusLabel}. Reopen it if you still need help.`
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_mobileUi.Button, {
-          title: "Reopen ticket",
-          variant: "outline",
-          size: "sm",
-          loading: busy,
-          disabled: busy,
-          onPress: () => void reopen(),
-          testID: "support-reopen"
-        })]
-      }), ticket.canRate && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_mobileUi.Card, {
-        variant: "outlined",
-        bodyStyle: styles.section,
-        testID: "support-rating",
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_mobileUi.Text, {
-          variant: "label",
-          children: "How did we do?"
-        }), ticket.satisfaction && /*#__PURE__*/(0, _jsxRuntime.jsx)(_mobileUi.Text, {
-          variant: "bodySmall",
-          color: "secondary",
-          children: SATISFACTION_TEXT[ticket.satisfaction]
-        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-          style: styles.ratingRow,
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_mobileUi.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__*/(0, _jsxRuntime.jsx)(_mobileUi.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__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_mobileUi.Input, {
-            label: "Anything to add? (optional)",
-            value: comment,
-            onChangeText: setComment,
-            multiline: true,
-            maxLength: config?.satisfactionCommentMaxLength,
-            testID: "support-rating-comment"
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_mobileUi.Button, {
-            title: "Send rating",
-            size: "sm",
-            loading: busy,
-            disabled: busy,
-            onPress: () => void sendRating(),
-            testID: "support-rating-send"
-          })]
-        })]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: styles.thread,
-        accessibilityLabel: "Conversation",
-        children: visible.map(m => /*#__PURE__*/(0, _jsxRuntime.jsx)(MessageBubble, {
-          message: m,
-          styles: styles,
-          onOpenImage: (uri, name) => setViewing({
-            uri,
-            name
-          })
-        }, m.id))
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-        style: styles.section,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_mobileUi.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__*/(0, _jsxRuntime.jsx)(_PhotoTray.PhotoTray, {
-          photos: photos,
-          onChange: setPhotos,
-          remaining: config.maxAttachmentsPerMessage - photos.length,
-          maxBytes: config.maxAttachmentBytes,
-          disabled: busy
-        }), ticket.canReopen && /*#__PURE__*/(0, _jsxRuntime.jsx)(_mobileUi.Text, {
-          variant: "caption",
-          color: "secondary",
-          children: "Replying reopens this ticket."
-        }), actionError && /*#__PURE__*/(0, _jsxRuntime.jsx)(_mobileUi.Text, {
-          variant: "bodySmall",
-          color: "error",
-          accessibilityLiveRegion: "polite",
-          children: actionError.message
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_mobileUi.Button, {
-          title: "Send reply",
-          leftIcon: "send",
-          loading: busy,
-          disabled: busy,
-          onPress: () => void sendReply(),
-          testID: "support-reply-send"
-        })]
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Attachments.ImageViewer, {
-      image: viewing,
-      onClose: () => setViewing(null)
-    })]
-  });
-};
-exports.SupportTicketDetail = SupportTicketDetail;
-const buildStyles = theme => _reactNative.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
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.SupportTicketDetail=void 0;var _mobileUi=require("@webority/mobile-ui"),_react=require("react"),_reactNative=require("react-native"),_format=require("../format.js"),_SupportProvider=require("../SupportProvider.js"),_validation=require("../validation.js"),_Attachments=require("./Attachments.js"),_PhotoTray=require("./PhotoTray.js"),_SupportTicketList=require("./SupportTicketList.js"),_jsxRuntime=require("react/jsx-runtime");const MessageBubble=({message:e,styles:t,timeZone:i,onOpenImage:s})=>{if("System"===e.authorKind)return(0,_jsxRuntime.jsx)(_reactNative.View,{style:t.system,testID:`support-message-${e.id}`,children:(0,_jsxRuntime.jsx)(_mobileUi.Text,{variant:"caption",color:"tertiary",align:"center",children:`${e.body}, ${(0,_format.formatWhen)(e.createdDateTimeUtc,i)}`})});const a="Customer"===e.authorKind;return(0,_jsxRuntime.jsx)(_reactNative.View,{style:[t.bubbleRow,a?t.mineRow:t.theirsRow],testID:`support-message-${e.id}`,children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[t.bubble,a?t.mine:t.theirs],children:[(0,_jsxRuntime.jsx)(_mobileUi.Text,{variant:"label",color:a?"primary":"secondary",children:e.authorName??"-"}),(0,_jsxRuntime.jsx)(_mobileUi.Text,{variant:"body",selectable:!0,children:e.body}),(0,_jsxRuntime.jsx)(_Attachments.AttachmentList,{attachments:e.attachments,onOpenImage:s}),(0,_jsxRuntime.jsx)(_mobileUi.Text,{variant:"caption",color:"tertiary",children:(0,_format.formatWhen)(e.createdDateTimeUtc,i)})]})})},SATISFACTION_TEXT={Satisfied:"You said we handled this well.",Unsatisfied:"You said we did not handle this well."},SupportTicketDetail=({ticketId:e,testID:t="support-ticket-detail"})=>{const i=(0,_mobileUi.useTheme)(),s=(0,_react.useMemo)(()=>buildStyles(i),[i]),{config:a}=(0,_SupportProvider.useSupportConfig)(),n=(0,_SupportProvider.useSupportTimeZone)(),{ticket:r,loading:o,error:l,actionError:c,busy:u,reload:d,reply:m,reopen:x,rate:p}=(0,_SupportProvider.useSupportTicket)(e),[_,j]=(0,_react.useState)(null),[b,h]=(0,_react.useState)(""),[g,y]=(0,_react.useState)([]),[R,S]=(0,_react.useState)(null),[v,T]=(0,_react.useState)(null),[f,U]=(0,_react.useState)("");if(!r)return(0,_jsxRuntime.jsx)(_reactNative.View,{style:s.center,testID:t,children:o?(0,_jsxRuntime.jsx)(_mobileUi.Spinner,{accessibilityLabel:"Loading the ticket"}):(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_mobileUi.Text,{variant:"body",color:"error",align:"center",children:l?.message??"That ticket could not be found."}),(0,_jsxRuntime.jsx)(_mobileUi.Button,{title:"Try again",variant:"ghost",onPress:()=>{d()}})]})});const w=r.messages.filter(e=>!e.isInternal);return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:s.root,testID:t,children:[(0,_jsxRuntime.jsxs)(_reactNative.ScrollView,{contentContainerStyle:s.content,keyboardShouldPersistTaps:"handled",children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:s.head,children:[(0,_jsxRuntime.jsx)(_mobileUi.Text,{variant:"h3",accessibilityRole:"header",children:r.subject}),(0,_jsxRuntime.jsx)(_mobileUi.Text,{variant:"bodySmall",color:"secondary",children:`${r.number}, ${r.category}`}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:s.headRow,children:[(0,_jsxRuntime.jsx)(_mobileUi.StatusBadge,{label:r.statusLabel,tone:_SupportTicketList.STATUS_TONES[r.status]??"neutral",accessibilityLabel:`Status: ${r.statusLabel}`}),(0,_jsxRuntime.jsx)(_mobileUi.Text,{variant:"caption",color:"tertiary",children:`Opened ${(0,_format.formatWhen)(r.createdDateTimeUtc,n)}`})]})]}),r.canReopen&&(0,_jsxRuntime.jsxs)(_mobileUi.Card,{variant:"outlined",bodyStyle:s.section,children:[(0,_jsxRuntime.jsx)(_mobileUi.Text,{variant:"bodySmall",children:`This ticket is ${r.statusLabel}. Reopen it if you still need help.`}),(0,_jsxRuntime.jsx)(_mobileUi.Button,{title:"Reopen ticket",variant:"outline",size:"sm",loading:u,disabled:u,onPress:()=>{x()},testID:"support-reopen"})]}),r.canRate&&(0,_jsxRuntime.jsxs)(_mobileUi.Card,{variant:"outlined",bodyStyle:s.section,testID:"support-rating",children:[(0,_jsxRuntime.jsx)(_mobileUi.Text,{variant:"label",children:"How did we do?"}),r.satisfaction&&(0,_jsxRuntime.jsx)(_mobileUi.Text,{variant:"bodySmall",color:"secondary",children:SATISFACTION_TEXT[r.satisfaction]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:s.ratingRow,children:[(0,_jsxRuntime.jsx)(_mobileUi.Button,{title:"Satisfied",size:"sm",leftIcon:"like",variant:"Satisfied"===v?"solid":"outline",tone:"success",accessibilityState:{selected:"Satisfied"===v},onPress:()=>T("Satisfied"),testID:"support-rate-satisfied"}),(0,_jsxRuntime.jsx)(_mobileUi.Button,{title:"Not satisfied",size:"sm",leftIcon:"dislike",variant:"Unsatisfied"===v?"solid":"outline",tone:"error",accessibilityState:{selected:"Unsatisfied"===v},onPress:()=>T("Unsatisfied"),testID:"support-rate-unsatisfied"})]}),v&&(0,_jsxRuntime.jsxs)(_jsxRuntime.Fragment,{children:[(0,_jsxRuntime.jsx)(_mobileUi.Input,{label:"Anything to add? (optional)",value:f,onChangeText:U,multiline:!0,maxLength:a?.satisfactionCommentMaxLength,testID:"support-rating-comment"}),(0,_jsxRuntime.jsx)(_mobileUi.Button,{title:"Send rating",size:"sm",loading:u,disabled:u,onPress:()=>{(async()=>{v&&await p({satisfaction:v,comment:f})&&(T(null),U(""))})()},testID:"support-rating-send"})]})]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:s.thread,accessibilityLabel:"Conversation",children:w.map(e=>(0,_jsxRuntime.jsx)(MessageBubble,{message:e,styles:s,timeZone:n,onOpenImage:(e,t)=>j({uri:e,name:t})},e.id))}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:s.section,children:[(0,_jsxRuntime.jsx)(_mobileUi.Input,{label:"Your reply",placeholder:"Write a reply to the support team",value:b,onChangeText:h,multiline:!0,maxLength:a?.bodyMaxLength,error:R??void 0,testID:"support-reply-input"}),a&&(0,_jsxRuntime.jsx)(_PhotoTray.PhotoTray,{photos:g,onChange:y,remaining:a.maxAttachmentsPerMessage-g.length,maxBytes:a.maxAttachmentBytes,disabled:u}),r.canReopen&&(0,_jsxRuntime.jsx)(_mobileUi.Text,{variant:"caption",color:"secondary",children:"Replying reopens this ticket."}),c&&(0,_jsxRuntime.jsx)(_mobileUi.Text,{variant:"bodySmall",color:"error",accessibilityLiveRegion:"polite",children:c.message}),(0,_jsxRuntime.jsx)(_mobileUi.Button,{title:"Send reply",leftIcon:"send",loading:u,disabled:u,onPress:()=>{(async()=>{const e=b.trim(),t=a?(0,_validation.validateBody)(e,a)??(0,_validation.validateFiles)(g,a):e?void 0:"Write a message.";t?S(t):(S(null),await m({body:e,files:g})&&(h(""),y([])))})()},testID:"support-reply-send"})]})]}),(0,_jsxRuntime.jsx)(_Attachments.ImageViewer,{image:_,onClose:()=>j(null)})]})};exports.SupportTicketDetail=SupportTicketDetail;const buildStyles=e=>_reactNative.StyleSheet.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}});