fix(react): defaultHref fixes (#18278)

* fix(react): making children prop optional on overlay components

* fix(react): passing in defaultHref so it can be used if there is no prev view

react/src/components/createControllerComponent.tsx

@@ -7,11 +7,11 @@ export function createControllerComponent<T extends object, E extends OverlayCom
   const displayName = dashToPascalCase(tagName);
   const dismissEventName = `on${displayName}DidDismiss`;
 
-  type ReactProps = {
+  type ReactControllerProps = {
     isOpen: boolean;
     onDidDismiss: (event: CustomEvent<OverlayEventDetail>) => void;
   }
-  type Props = T & ReactProps;
+  type Props = T & ReactControllerProps;
 
   return class ReactControllerComponent extends React.Component<Props> {
     element: E;

react/src/components/createOverlayComponent.tsx

@@ -9,14 +9,14 @@ export function createOverlayComponent<T extends object, E extends OverlayCompon
   const displayName = dashToPascalCase(tagName);
   const dismissEventName = `on${displayName}DidDismiss`;
 
-  type ReactProps = {
-    children: React.ReactNode;
+  type ReactOverlayProps = {
+    children?: React.ReactNode;
     isOpen: boolean;
     onDidDismiss: (event: CustomEvent<OverlayEventDetail>) => void;
   }
-  type Props = T & ReactProps;
+  type Props = T & ReactOverlayProps;
 
-  return class ReactControllerComponent extends React.Component<Props> {
+  return class ReactOverlayComponent extends React.Component<Props> {
     element: E;
     controllerElement: C;
     el: HTMLDivElement;

react/src/components/navigation/IonRouterOutlet.tsx

@@ -32,7 +32,7 @@ interface State {
 }
 
 interface ContextInterface {
-  goBack: () => void
+  goBack: (defaultHref?: string) => void
 }
 
 const Context = React.createContext<ContextInterface>({
@@ -152,11 +152,11 @@ class RouterOutlet extends Component<Props, State> {
     });
   }
 
-  goBack = () => {
+  goBack = (defaultHref?: string) => {
     const prevView = this.state.views.find(v => v.id === this.state.activeId);
     const newView = this.state.views.find(v => v.id === prevView.prevId);
-
-    this.props.history.replace(newView.location.pathname);
+    const newPath = newView ? newView.location.pathname : defaultHref;
+    this.props.history.replace(newPath);
   }
 
   componentDidUpdate() {
@@ -232,8 +232,7 @@ export class IonBackButton extends Component<ButtonProps> {
 
   clickButton = (e: MouseEvent) => {
     e.stopPropagation();
-
-    this.context.goBack();
+    this.context.goBack(this.props.defaultHref);
   }
 
   render() {