From 7bb5fd05881097752ec0dd1008e3d61607ea2267 Mon Sep 17 00:00:00 2001
From: Jaco Greeff <jacogr@gmail.com>
Date: Wed, 13 Mar 2019 13:24:54 +0100
Subject: [PATCH] Inject react router into content (work-around) (#810)

---
 packages/apps/src/Content/index.tsx | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/packages/apps/src/Content/index.tsx b/packages/apps/src/Content/index.tsx
index 3de4bd228f..5ec77ad637 100644
--- a/packages/apps/src/Content/index.tsx
+++ b/packages/apps/src/Content/index.tsx
@@ -5,6 +5,7 @@
 import { I18nProps } from '@polkadot/ui-app/types';
 import { ApiProps } from '@polkadot/ui-api/types';
 import { QueueProps } from '@polkadot/ui-app/Status/types';
+import { RouteProps } from '../types';
 
 import React from 'react';
 import { withRouter } from 'react-router';
@@ -57,12 +58,17 @@ class Content extends React.Component<Props> {
       );
     }
 
+    // inject router into component that we are rendering (in some cases react-router does
+    // not play 100% with styled-components because of the new vs old context usage, this
+    // is a workaround for that)
+    const ComponentRouted = (withRouter(Component as any) as any) as React.ComponentType<RouteProps>;
+
     return (
       <Wrapper>
         <QueueConsumer>
           {({ queueAction, stqueue, txqueue }: QueueProps) => (
             <>
-              <Component
+              <ComponentRouted
                 basePath={`/${name}`}
                 location={location}
                 onStatusChange={queueAction}