cmmc: PaymentStepForm can run w null auth svc

packages/commerce/components/checkout/payment-step-form/index.tsx

@@ -26,23 +26,28 @@ const PaymentStepForm: React.FC<CheckoutStepComponentProps> = observer(({
   setOrderId
 }) => {
   const cmmc = useCommerce()
-  const auth = useAuth()
+  const auth = useAuth() // may be null in some cases
+
   const [transactionStatus, setTransactionStatus] = useState<TransactionStatus>('unpaid')
 
+  if (!auth) {
+    console.log("PAYMENT STEP FORM:  auth service is null! ")
+  }
+
   const contactForm = useForm<z.infer<typeof contactFormSchema>>({
     resolver: zodResolver(contactFormSchema),  
     defaultValues: {
-      name: auth.user?.displayName ?? '',
-      email: auth.user?.email ?? '',
+      name: auth?.user?.displayName ?? '',
+      email: auth?.user?.email ?? '',
     },
   })
 
   useEffect(() => {
-    if (auth.loggedIn) {
-      contactForm.setValue('name', auth.user?.displayName ?? '')
-      contactForm.setValue('email', auth.user?.email ?? '')
+    if (auth?.loggedIn) {
+      contactForm.setValue('name', auth!.user?.displayName ?? '')
+      contactForm.setValue('email', auth!.user?.email ?? '')
     }
-  }, [auth.loggedIn])
+  }, [auth?.loggedIn])
 
   const storePaymentInfo = async (paymentInfo: any) => {
     const {name, email} = contactForm.getValues()

packages/commerce/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hanzo/commerce",
-  "version": "7.0.13",
+  "version": "7.0.15",
   "description": "e-commerce framework.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",

packages/ui/primitives/step-indicator.tsx

@@ -18,6 +18,8 @@ const StepIndicator: React.FC<{
 
   const pX = `calc(${1 / (steps.length * 2) * 100}% - ${dotSizeRem / 2}rem)`
 
+    // This code current throws 'Warning: Each child in a list should have a unique "key" prop.'
+    // As is evident, we supply keys that should suffice.  < shrug >
   return ( 
     <div className={cn('flex flex-col', className)}>
       <div