Merge branch 'dev' into e2e-integrate

Author: treoden

packages/evershop/src/modules/auth/pages/admin/adminLogin/LoginForm.tsx

@@ -12,21 +12,13 @@ interface LoginFormProps {
   dashboardUrl: string;
 }
 
-const SubmitButton: React.FC<{ formId: string }> = ({ formId }) => {
+const SubmitButton: React.FC = () => {
   const {
     formState: { isSubmitting }
   } = useFormContext();
   return (
     <div className="form-submit-button flex border-t border-border mt-4 pt-4 justify-between">
-      <Button
-        onClick={() => {
-          (document.getElementById(formId) as HTMLFormElement).dispatchEvent(
-            new Event('submit', { cancelable: true, bubbles: true })
-          );
-        }}
-        size="lg"
-        isLoading={isSubmitting}
-      >
+      <Button type="submit" size="lg" isLoading={isSubmitting}>
         SIGN IN
       </Button>
     </div>
@@ -122,7 +114,7 @@ export default function LoginForm({ authUrl, dashboardUrl }: LoginFormProps) {
             },
             {
               component: {
-                default: <SubmitButton formId="adminLoginForm" />
+                default: <SubmitButton />
               },
               sortOrder: 30
             }

packages/evershop/src/modules/oms/pages/admin/orderEdit/AddTrackingButton.tsx

@@ -101,7 +101,7 @@ export default function AddTrackingButton({
               <DialogClose>
                 <Button
                   title="Cancel"
-                  variant="destructive"
+                  variant="outline"
                   onClick={() => {
                     setDialogOpen(false);
                   }}

packages/evershop/src/modules/oms/pages/admin/orderEdit/Customer.tsx

@@ -90,7 +90,11 @@ export default function Customer({
       <CardContent className="border-t border-border pt-3">
         <CardTitle className="mb-2">Shipping Address</CardTitle>
         {!noShippingRequired && <AddressSummary address={shippingAddress} />}
-        {noShippingRequired && <span>{'No shipping required'}</span>}
+        {noShippingRequired && (
+          <span className="text-muted-foreground">
+            {'No shipping required'}
+          </span>
+        )}
       </CardContent>
       <CardContent className="border-t border-border pt-3">
         <CardTitle className="mb-2">Billing address</CardTitle>

packages/evershop/src/modules/oms/pages/admin/orderEdit/Items.jsx

@@ -27,7 +27,7 @@ export default function Items({ order: { items, shipmentStatus } }) {
         </CardTitle>
       </CardHeader>
       <CardContent>
-        <Table>
+        <Table className="table-fixed">
           <TableBody>
             {items.map((i, k) => (
               <TableRow key={k}>
@@ -64,7 +64,8 @@ export default function Items({ order: { items, shipmentStatus } }) {
                       component: { default: 'td' },
                       props: {
                         children: <span>{i.lineTotal.text}</span>,
-                        key: 'lineTotal'
+                        key: 'lineTotal',
+                        className: 'w-20 whitespace-nowrap text-right'
                       },
                       sortOrder: 40,
                       id: 'lineTotal'

packages/evershop/src/modules/oms/pages/admin/orderEdit/ShipButton.tsx

@@ -30,7 +30,11 @@ export default function ShipButton({
 }: ShipButtonProps) {
   const { openAlert, closeAlert, dispatchAlert } = useAlertContext();
   if (noShippingRequired) {
-    return <Button title="No Shipping Required" variant="secondary" />;
+    return (
+      <Button disabled variant="secondary">
+        No Shipping Required
+      </Button>
+    );
   }
   if (shipment) {
     return null;
@@ -91,7 +95,7 @@ export default function ShipButton({
               primaryAction: {
                 title: 'Cancel',
                 onAction: closeAlert,
-                variant: ''
+                variant: 'outline'
               },
               secondaryAction: {
                 title: 'Ship',
@@ -106,7 +110,7 @@ export default function ShipButton({
                     new Event('submit', { cancelable: true, bubbles: true })
                   );
                 },
-                variant: 'secondary',
+                variant: 'default',
                 isLoading: false
               }
             });

packages/evershop/src/modules/oms/pages/admin/orderEdit/items/Name.tsx

@@ -18,15 +18,19 @@ export function Name({
   productUrl,
   variantOptions = []
 }: NameProps) {
+  const truncatedName = name.length > 30 ? `${name.substring(0, 30)}...` : name;
+
   return (
-    <TableCell>
-      <div className="product-column">
+    <TableCell className="w-auto min-w-0">
+      <div className="product-column overflow-hidden">
         <div>
           <span className="font-semibold">
-            <a href={productUrl}>{name}</a>
+            <a href={productUrl} title={name}>
+              {truncatedName}
+            </a>
           </span>
         </div>
-        <div className="text-gray-500">
+        <div className="text-muted-foreground">
           <span className="font-semibold">SKU: </span>
           <span>{productSku}</span>
         </div>

packages/evershop/src/modules/oms/pages/admin/orderEdit/items/Price.tsx

@@ -8,7 +8,7 @@ interface PriceProps {
 
 export function Price({ price, qty }: PriceProps) {
   return (
-    <TableCell>
+    <TableCell className="w-32 whitespace-nowrap">
       <div className="product-price">
         <span>
           {price} x {qty}

packages/evershop/src/modules/oms/pages/admin/orderEdit/items/Thumbnail.tsx

@@ -8,7 +8,7 @@ interface ThumbnailProps {
 
 export function Thumbnail({ imageUrl, qty }: ThumbnailProps) {
   return (
-    <TableCell>
+    <TableCell className="w-20">
       <div className="relative w-12 h-12 flex justify-center border border-divider rounded-[3px] p-0.5 box-border">
         <div className="self-center text-border">
           {imageUrl && (