diff --git a/app/react-tools/RootProvider.tsx b/app/react-tools/RootProvider.tsx
new file mode 100644
index 000000000..5942afcff
--- /dev/null
+++ b/app/react-tools/RootProvider.tsx
@@ -0,0 +1,10 @@
+import { UIRouterContextComponent } from '@uirouter/react-hybrid';
+import { PropsWithChildren, StrictMode } from 'react';
+
+export function RootProvider({ children }: PropsWithChildren<unknown>) {
+  return (
+    <StrictMode>
+      <UIRouterContextComponent>{children}</UIRouterContextComponent>
+    </StrictMode>
+  );
+}
diff --git a/app/react-tools/react2angular.tsx b/app/react-tools/react2angular.tsx
index 611d125a2..789dbf9e3 100644
--- a/app/react-tools/react2angular.tsx
+++ b/app/react-tools/react2angular.tsx
@@ -1,7 +1,8 @@
-import { UIRouterContextComponent } from '@uirouter/react-hybrid';
 import ReactDOM from 'react-dom';
 import { IComponentOptions, IController } from 'angular';
 
+import { RootProvider } from './RootProvider';
+
 function toProps(
   propNames: string[],
   controller: IController,
@@ -44,10 +45,10 @@ export function react2angular<T>(
     this.$onChanges = () => {
       const props = toProps(propNames, this, $q);
       ReactDOM.render(
-        <UIRouterContextComponent>
+        <RootProvider>
           {/* eslint-disable-next-line react/jsx-props-no-spreading */}
           <Component {...(props as T)} />
-        </UIRouterContextComponent>,
+        </RootProvider>,
         el
       );
     };