Add external JSX rendering to Vetrina component

apps/vetrina-staging/.build-size-sha256

@@ -1,3 +1,3 @@
 # SHA256 of the content of the build directory.
 # This is used for triggering project deployment when there are updated dependecies.
-be1d6a49da254740363a4b0785c517318a36979b6f7f8d068e75acbfbaaf93d7
+9e9416f3f41961084ec02d2949de68ed736302bc6c54e284f28ae2d8da8a53cb

packages/vetrina/src/Vetrina/Vetrina.purs

@@ -41,12 +41,14 @@ type JSProps =
   { onClose :: Nullable (Effect Unit)
   , onLogin :: Nullable (Effect Unit)
   , products :: Nullable (Array JSProduct)
+  , unexpectedError :: Nullable JSX
   }
 
 type Props =
-  { onClose  :: Effect Unit
-  , onLogin  :: Effect Unit
-  , products :: Either Error (Array Product)
+  { onClose         :: Effect Unit
+  , onLogin         :: Effect Unit
+  , products        :: Either Error (Array Product)
+  , unexpectedError :: JSX
   }
 
 fromJSProps :: JSProps -> Props
@@ -61,18 +63,19 @@ fromJSProps jsProps =
             , not null products -> Right products
             | otherwise -> Left productError
           Nothing -> Left productError
+  , unexpectedError : fromMaybe mempty $ toMaybe jsProps.unexpectedError
   }
 
 type State =
-  { user          :: Maybe User
-  , purchaseState :: PurchaseState
-  , poller        :: Aff.Fiber Unit
-  , isLoading     :: Maybe Spinner.Loading
-  , accountStatus :: AccountStatus
-  , logger        :: Sentry.Logger
-  , products      :: Array Product
+  { user             :: Maybe User
+  , purchaseState    :: PurchaseState
+  , poller           :: Aff.Fiber Unit
+  , isLoading        :: Maybe Spinner.Loading
+  , accountStatus    :: AccountStatus
+  , logger           :: Sentry.Logger
+  , products         :: Array Product
   , productSelection :: Maybe Product
-  , paymentMethod :: User.PaymentMethod
+  , paymentMethod    :: User.PaymentMethod
   }
 
 type Self = React.Self Props State
@@ -92,6 +95,7 @@ data PurchaseState
 data OrderFailure
   = EmailInUse String
   | SubscriptionExists
+  | InitializationError
   | FormFieldError (Array NewPurchase.FormInputField)
   | AuthenticationError
   | ServerError
@@ -141,7 +145,7 @@ didMount self = do
         products <- liftEffect $ case self.props.products of
           Right p -> pure p
           Left err -> do
-            self.setState _ { purchaseState = PurchaseFailed $ UnexpectedError ""  }
+            self.setState _ { purchaseState = PurchaseFailed $ InitializationError }
             logger.error err
             throwError err
 
@@ -253,6 +257,10 @@ render self = vetrinaContainer self $
             , productSelection: self.state.productSelection
             , onLogin: self.props.onLogin
             }
+        ServerError -> self.props.unexpectedError
+        UnexpectedError _ -> self.props.unexpectedError
+        InitializationError ->
+          self.props.unexpectedError
         _ ->
           Purchase.Error.error
             { onRetry: onRetry