starting to add explorer

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

@@ -8,8 +8,7 @@ import ColumnHeader from 'mastodon/components/column_header';
 import { HotKeys } from 'react-hotkeys';
 import DismissableBanner from 'mastodon/components/dismissable_banner';
 
-import ActivityPubVisualization from 'activitypub-visualization';
+import { ActivityPubVisualization } from 'activitypub-visualization';
-
 
 const mapStateToProps = (state) => {
   return {

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

@@ -0,0 +1,69 @@
+import React from 'react';
+import { connect } from 'react-redux';
+import ImmutablePureComponent from 'react-immutable-pure-component';
+import { FormattedMessage } from 'react-intl';
+import PropTypes from 'prop-types';
+import Column from 'mastodon/components/column';
+import ColumnHeader from 'mastodon/components/column_header';
+import { HotKeys } from 'react-hotkeys';
+import DismissableBanner from 'mastodon/components/dismissable_banner';
+
+import { ActivityPubExplorer as Explorer } from 'activitypub-visualization';
+
+
+const mapStateToProps = (state) => {
+  return {
+    logs: state.getIn(['activity_log', 'logs']),
+  };
+};
+
+export default @connect(mapStateToProps)
+class ActivityPubExplorer extends ImmutablePureComponent {
+
+  static propTypes = {
+    multiColumn: PropTypes.bool,
+  };
+
+
+  handleHeaderClick = () => {
+    this.column.scrollTop();
+  }
+
+  setRef = c => {
+    this.column = c;
+  }
+
+  render() {
+
+    const { logs, multiColumn } = this.props;
+
+    const darkMode = !(document.body && document.body.classList.contains('theme-mastodon-light'));
+
+    return (
+      <Column bindToDocument={!multiColumn} ref={this.setRef} label='ActivityPub Explorer'>
+        <ColumnHeader
+          icon='wpexplorer'
+          title='ActivityPub Explorer'
+          onClick={this.handleHeaderClick}
+          multiColumn={multiColumn}
+        />
+
+        <DismissableBanner id='activity_log'>
+          <p>
+            <FormattedMessage
+              id='dismissable_banner.activity_pub_explorer_information'
+              defaultMessage='TODO. You can find more information on my {blog}.'
+              values={{
+                blog: <a href='//seb.jambor.dev/' style={{ color: darkMode ? '#8c8dff' : '#3a3bff', textDecoration: 'none' }}>blog</a>,
+              }}
+            />
+          </p>
+        </DismissableBanner>
+
+        <div>Hello world</div>
+      </Column>
+    );
+  }
+
+}
+

app/javascript/mastodon/features/ui/components/navigation_panel.js

@@ -88,6 +88,8 @@ class NavigationPanel extends React.Component {
 
             <ColumnLink transparent to='/activity_log' icon='comments' text='Activity Log' />
 
+            <ColumnLink transparent to='/activitypub_explorer' icon='wpexplorer' text='ActivityPub Explorer' />
+
             <ListPanel />
 
             <hr />

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

@@ -50,6 +50,7 @@ import {
   PinnedStatuses,
   Lists,
   ActivityLog,
+  ActivityPubExplorer,
   Directory,
   Explore,
   FollowRecommendations,
@@ -108,6 +109,7 @@ const keyMap = {
   goToMuted: 'g m',
   goToRequests: 'g r',
   goToActivityLog: 'g a',
+  goToActivityPubExplorer: 'g e',
   toggleHidden: 'x',
   toggleSensitive: 'h',
   openMedia: 'e',
@@ -219,6 +221,7 @@ class SwitchingColumnsArea extends React.PureComponent {
           <WrappedRoute path='/mutes' component={Mutes} content={children} />
           <WrappedRoute path='/lists' component={Lists} content={children} />
           <WrappedRoute path='/activity_log' component={ActivityLog} content={children} />
+          <WrappedRoute path='/activitypub_explorer' component={ActivityPubExplorer} content={children} />
 
           <Route component={BundleColumnError} />
         </WrappedSwitch>
@@ -494,6 +497,10 @@ class UI extends React.PureComponent {
     this.context.router.history.push('/activity_log');
   }
 
+  handleHotkeyGoToActivityPubExplorer = () => {
+    this.context.router.history.push('/activitypub_explorer');
+  }
+
   handleHotkeyGoToNotifications = () => {
     this.context.router.history.push('/notifications');
   };
@@ -552,6 +559,7 @@ class UI extends React.PureComponent {
       back: this.handleHotkeyBack,
       goToHome: this.handleHotkeyGoToHome,
       goToActivityLog: this.handleHotkeyGoToActivityLog,
+      goToActivityPubExplorer: this.handleHotkeyGoToActivityPubExplorer,
       goToNotifications: this.handleHotkeyGoToNotifications,
       goToLocal: this.handleHotkeyGoToLocal,
       goToFederated: this.handleHotkeyGoToFederated,

app/javascript/mastodon/features/ui/util/async-components.js

@@ -42,6 +42,10 @@ export function ActivityLog () {
   return import(/* webpackChunkName: "features/activity_log" */'../../activity_log');
 }
 
+export function ActivityPubExplorer () {
+  return import(/* webpackChunkName: "features/activity_log" */'../../activitypub_explorer');
+}
+
 export function Status () {
   return import(/* webpackChunkName: "features/status" */'../../status');
 }

config/routes.rb

@@ -25,6 +25,7 @@ Rails.application.routes.draw do
     /publish
     /follow_requests
     /activity_log
+    /activitypub_explorer
     /blocks
     /domain_blocks
     /mutes

package.json

@@ -35,7 +35,7 @@
     "@github/webauthn-json": "^0.5.7",
     "@rails/ujs": "^6.1.7",
     "abortcontroller-polyfill": "^1.7.5",
-    "activitypub-visualization": "^1.0.0",
+    "activitypub-visualization": "^1.1.0",
     "array-includes": "^3.1.6",
     "arrow-key-navigation": "^1.2.0",
     "autoprefixer": "^9.8.8",

yarn.lock

@@ -2190,10 +2190,10 @@ acorn@^8.8.0:
   resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.8.2.tgz#1b2f25db02af965399b9776b0c2c391276d37c4a"
   integrity sha512-xjIYgE8HBrkpd/sJqOGNspf8uHG+NOHGOw6a/Urj8taM2EXfdNAH2oFcPeIFfsv3+kz/mJrS5VuMqbNLjCa2vw==
 
-activitypub-visualization@^1.0.0:
+activitypub-visualization@^1.1.0:
-  version "1.0.0"
+  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/activitypub-visualization/-/activitypub-visualization-1.0.0.tgz#728ce9a20336bf927980748c37c8b5206cafecac"
+  resolved "https://registry.yarnpkg.com/activitypub-visualization/-/activitypub-visualization-1.1.0.tgz#db7875657aa3215f6d7be16795964c82c1021efe"
-  integrity sha512-azxnf4POMTsI8J0PiOXeD70wZvxAd6KdcD2YIE+AqkW00Fgg39Jxi+OcImc8GoAiUh7dpFp6nLA+WVH4uVnIEw==
+  integrity sha512-0DrnCdmpx5551q0vZiQYHu3ZsVVFP0JJKLHQpbLmgetVJxGjRoZC7iwjh+tvyYixBhUneIAhVJ2VH0bugiAwFA==
 
 agent-base@6:
   version "6.0.2"