links in activity log open explorer

app/javascript/mastodon/actions/activitypub_explorer.js

@@ -1,6 +1,12 @@
 export const ACTIVITYPUB_EXPLORER_DATA ='ACTIVITYPUB_EXPLORER_DATA';
+export const ACTIVITYPUB_EXPLORER_URL ='ACTIVITYPUB_EXPLORER_URL';
 
 export const setExplorerData = (value) => ({
   type: ACTIVITYPUB_EXPLORER_DATA,
   value,
 });
+
+export const setExplorerUrl = (value) => ({
+  type: ACTIVITYPUB_EXPLORER_URL,
+  value,
+});

app/javascript/mastodon/features/activity_log/index.js

@@ -6,7 +6,7 @@ import PropTypes from 'prop-types';
 import Column from 'mastodon/components/column';
 import ColumnHeader from 'mastodon/components/column_header';
 import { HotKeys } from 'react-hotkeys';
-import { setExplorerData } from 'mastodon/actions/activitypub_explorer';
+import { setExplorerData, setExplorerUrl } from 'mastodon/actions/activitypub_explorer';
 import DismissableBanner from 'mastodon/components/dismissable_banner';
 
 import { ActivityPubVisualization } from 'activitypub-visualization';
@@ -77,10 +77,19 @@ class ActivityLog extends ImmutablePureComponent {
 
         <HotKeys handlers={handlers}>
           <div className={`${darkMode ? 'dark' : ''}`}>
-            <ActivityPubVisualization logs={logs} showExplorerLink onExplorerLinkClick={(data) => {
-              dispatch(setExplorerData(data));
-              this.context.router.history.push('/activitypub_explorer');
-            }} />
+            <ActivityPubVisualization
+              logs={logs}
+              clickableLinks
+              onLinkClick={(url) => {
+                dispatch(setExplorerUrl(url));
+                this.context.router.history.push('/activitypub_explorer');
+              }}
+              showExplorerLink
+              onExplorerLinkClick={(data) => {
+                dispatch(setExplorerData(data));
+                this.context.router.history.push('/activitypub_explorer');
+              }}
+            />
           </div>
         </HotKeys>
 

app/javascript/mastodon/features/activitypub_explorer/index.js

@@ -6,7 +6,7 @@ import PropTypes from 'prop-types';
 import Column from 'mastodon/components/column';
 import ColumnHeader from 'mastodon/components/column_header';
 import DismissableBanner from 'mastodon/components/dismissable_banner';
-import { setExplorerData } from 'mastodon/actions/activitypub_explorer';
+import { setExplorerData, setExplorerUrl } from 'mastodon/actions/activitypub_explorer';
 
 import { ActivityPubExplorer as Explorer } from 'activitypub-visualization';
 
@@ -14,6 +14,7 @@ import { ActivityPubExplorer as Explorer } from 'activitypub-visualization';
 const mapStateToProps = (state) => {
   return {
     data: state.getIn(['activitypub_explorer', 'data']),
+    url: state.getIn(['activitypub_explorer', 'url']),
   };
 };
 
@@ -33,14 +34,15 @@ class ActivityPubExplorer extends ImmutablePureComponent {
     this.column = c;
   }
 
-  componentWillMount () {
+  componentWillUnmount () {
     // clear explorer data on unbound so that we start with a clean slate on next navigation
     this.props.dispatch(setExplorerData(null));
+    this.props.dispatch(setExplorerUrl(''));
   }
 
   render() {
 
-    const { data, multiColumn } = this.props;
+    const { data, url, multiColumn } = this.props;
 
     const darkMode = !(document.body && document.body.classList.contains('theme-mastodon-light'));
 
@@ -66,7 +68,7 @@ class ActivityPubExplorer extends ImmutablePureComponent {
         </DismissableBanner>
 
         <div className={`${darkMode ? 'dark' : ''}`}>
-          <Explorer initialValue={data} />
+          <Explorer initialValue={data} initialUrl={url} />
         </div>
       </Column>
     );

app/javascript/mastodon/reducers/activitypub_explorer.js

@@ -1,14 +1,17 @@
 import { Map as ImmutableMap } from 'immutable';
-import { ACTIVITYPUB_EXPLORER_DATA } from '../actions/activitypub_explorer';
+import { ACTIVITYPUB_EXPLORER_DATA, ACTIVITYPUB_EXPLORER_URL } from '../actions/activitypub_explorer';
 
 const initialState = ImmutableMap({
   data: null,
+  url: '',
 });
 
 export default function activitypub_explorer(state = initialState, action) {
   switch (action.type) {
   case ACTIVITYPUB_EXPLORER_DATA:
     return state.set('data', action.value);
+  case ACTIVITYPUB_EXPLORER_URL:
+    return state.set('url', action.value);
   default:
     return state;
   }