@autobusal/order-confirm 0.0.3 → 1.0.1

package/CHANGELOG.md

@@ -0,0 +1,24 @@
+# Changelog
+
+All notable changes to this package are documented here. This project follows
+[Keep a Changelog](https://keepachangelog.com/) and [Semantic Versioning](https://semver.org/).
+
+## [1.0.1] - 2026-07-19
+
+### Security
+
+- `OrderConfirm.tsx`: fixed an HTML-injection (XSS) vector. The `hash` segment
+  comes straight from the URL (`/orders/:type/:hash`) and was interpolated into
+  markup rendered via `dangerouslySetInnerHTML`. Added an `escapeHtml` helper
+  that encodes `& < > " '` and applied it to the hash before interpolation
+  (`<strong>${ escapeHtml(String(hash ?? '')) }</strong>`), so a crafted hash
+  (e.g. containing `<img onerror=...>`) can no longer inject markup.
+
+### Fixed
+
+- `OrderConfirm.tsx`: the "Manage order" action now routes based on auth state.
+  A logged-in user is sent to `/account/orders` (where the order is listed)
+  instead of the public `/viewtrip/:hash` lookup form that email-gates access to
+  their own order; guests still use the public `/viewtrip/:hash` lookup.
+
+Authored by Ferjolt Ozuni. Consolidated from the magus and alvavel whitelabel patch sets into canonical @autobusal source (eliminates per-repo patch-package divergence).

package/OrderConfirm.tsx

@@ -1,6 +1,5 @@
 import { TFunction } from 'i18next';
-import { useEffect } from 'react';
-import { useSearchParams, useParams, useNavigate } from 'react-router-dom';
+import { useSearchParams, useParams, useNavigate, Navigate } from 'react-router-dom';
 import { AiOutlineCheck } from 'react-icons/ai';
 import { BiErrorAlt } from 'react-icons/bi';
 import { IoReturnUpBackOutline } from 'react-icons/io5';
@@ -13,6 +12,15 @@ interface Props {
   t: TFunction<'common'>
 }
 
+// hash comes straight from the URL (/orders/:type/:hash) and is interpolated into
+// HTML that gets rendered via dangerouslySetInnerHTML below - escape it so a
+// crafted hash segment (e.g. containing <img onerror=...>) can't inject markup.
+const escapeHtml = (value: string): string => (
+  value.replace(/[&<>"']/g, char => ({
+    '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', '\'': '&#39;'
+  }[char] as string))
+);
+
 const OrderConfirm = ({ t }: Props): (JSX.Element | null) => {
   const [ searchParams ] = useSearchParams();
 
@@ -24,28 +32,21 @@ const OrderConfirm = ({ t }: Props): (JSX.Element | null) => {
 
   const { data: UserData } = useUserStore();
 
-  const isAllowed = ['reserved', 'cancelled', 'purchased'].includes(
-    String(type)
-  );
-  
-  useEffect(() => {
-    if (!isAllowed) {
-      navigate('/');
-    }
-  }, []);
+  const isAllowed = ['reserved', 'cancelled', 'purchased'].includes(String(type));
 
   if (!isAllowed) {
-    return null;
+    return <Navigate to="/" />;
   }
 
   const onManage = (): void => {
-    navigate(`/viewtrip/${ hash }`);
+    // a logged-in user shouldn't be sent to the public order-lookup form (which
+    // email-gates access to their OWN order) - send them into their account
+    // orders where the order is listed. Guests use the public lookup.
+    navigate(UserData ? '/account/orders' : `/viewtrip/${ hash }`);
   };
 
   const onBack = (): void => {
-    navigate(
-      UserData ? '/account' : '/'
-    );
+    navigate(UserData ? '/account' : '/');
   };
 
   return (
@@ -56,7 +57,7 @@ const OrderConfirm = ({ t }: Props): (JSX.Element | null) => {
       </Title>
 
       <div className="box" dangerouslySetInnerHTML={{
-        __html: t(`order_confirm.content.${ type}`, { order: `<strong>${ hash }</strong>` })
+        __html: t(`order_confirm.content.${ type}`, { order: `<strong>${ escapeHtml(String(hash ?? '')) }</strong>` })
       }} />
 
       <>

package/package.json

@@ -1,6 +1,7 @@
 {
   "name": "@autobusal/order-confirm",
-  "version": "0.0.3",
+  "version": "1.0.1",
+  "author": "Ferjolt Ozuni",
   "type": "module",
   "main": "index.ts"
 }