From 45826c7ad0af80aca208dcdc67476fcbf6b4180f Mon Sep 17 00:00:00 2001
From: Sebastian Jambor <seb.jambor@gmail.com>
Date: Sat, 14 Jan 2023 17:19:37 +0100
Subject: [PATCH] add description to activity log page

---
 .../features/activity_log/dummy-data.json     | 143 ------------------
 .../mastodon/features/activity_log/index.js   |  44 ++++--
 2 files changed, 29 insertions(+), 158 deletions(-)
 delete mode 100644 app/javascript/mastodon/features/activity_log/dummy-data.json

diff --git a/app/javascript/mastodon/features/activity_log/dummy-data.json b/app/javascript/mastodon/features/activity_log/dummy-data.json
deleted file mode 100644
index 1ec9f2dbd..000000000
--- a/app/javascript/mastodon/features/activity_log/dummy-data.json
+++ /dev/null
@@ -1,143 +0,0 @@
-[
-  {
-    "timestamp":"2022-12-08T17:12:38Z",
-    "type": "inbound",
-    "path": "/users/admin/inbox",
-    "data": {
-      "@context": "https://www.w3.org/ns/activitystreams",
-      "id": "https://techhub.social/users/crepels#follows/410930/undo",
-      "type": "Undo",
-      "actor": "https://techhub.social/users/crepels",
-      "object": {
-        "id": "https://techhub.social/bba308ce-f0e1-49af-9aa0-30d92e4ff71e",
-        "type": "Follow",
-        "actor": "https://techhub.social/users/crepels",
-        "object": "https://localhost.jambor.dev/users/admin"
-      }
-    }
-  },
-  {
-    "timestamp":"2022-12-08T17:12:38Z",
-    "type": "inbound",
-    "path": "/users/admin/inbox",
-    "data": {
-      "@context": "https://www.w3.org/ns/activitystreams",
-      "id": "https://techhub.social/a5f25e0a-98d6-4e5c-baad-65318cd4d67d",
-      "type": "Follow",
-      "actor": "https://techhub.social/users/crepels",
-      "object": "https://localhost.jambor.dev/users/admin"
-    }
-  },
-  {
-    "timestamp":"2022-12-08T17:12:38Z",
-    "type": "outbound",
-    "path": "https://techhub.social/users/crepels/inbox",
-    "data": {
-      "@context": "https://www.w3.org/ns/activitystreams",
-      "id": "https://localhost.jambor.dev/users/admin#accepts/follows/29",
-      "type": "Accept",
-      "actor": "https://localhost.jambor.dev/users/admin",
-      "object": {
-        "id": "https://techhub.social/a5f25e0a-98d6-4e5c-baad-65318cd4d67d",
-        "type": "Follow",
-        "actor": "https://techhub.social/users/crepels",
-        "object": "https://localhost.jambor.dev/users/admin"
-      }
-    }
-  },
-  {
-    "timestamp":"2022-12-08T17:12:38Z",
-    "type": "inbound",
-    "path": "/inbox",
-    "data": {
-      "@context": [
-        "https://www.w3.org/ns/activitystreams",
-        {
-          "ostatus": "http://ostatus.org#",
-          "atomUri": "ostatus:atomUri",
-          "inReplyToAtomUri": "ostatus:inReplyToAtomUri",
-          "conversation": "ostatus:conversation",
-          "sensitive": "as:sensitive",
-          "toot": "http://joinmastodon.org/ns#",
-          "votersCount": "toot:votersCount"
-        }
-      ],
-      "id": "https://techhub.social/users/crepels/statuses/109473290785654613/activity",
-      "type": "Create",
-      "actor": "https://techhub.social/users/crepels",
-      "published": "2022-12-07T16:17:32Z",
-      "to": [
-        "https://localhost.jambor.dev/users/admin"
-      ],
-      "cc": [],
-      "object": {
-        "id": "https://techhub.social/users/crepels/statuses/109473290785654613",
-        "type": "Note",
-        "summary": null,
-        "inReplyTo": null,
-        "published": "2022-12-07T16:17:32Z",
-        "url": "https://techhub.social/@crepels/109473290785654613",
-        "attributedTo": "https://techhub.social/users/crepels",
-        "to": [
-          "https://localhost.jambor.dev/users/admin"
-        ],
-        "cc": [],
-        "sensitive": false,
-        "atomUri": "https://techhub.social/users/crepels/statuses/109473290785654613",
-        "inReplyToAtomUri": null,
-        "conversation": "tag:techhub.social,2022-12-07:objectId=5564498:objectType=Conversation",
-        "content": "<p><span class=\"h-card\"><a href=\"https://localhost.jambor.dev/@admin\" class=\"u-url mention\">@<span>admin</span></a></span> test</p>",
-        "contentMap": {
-          "en": "<p><span class=\"h-card\"><a href=\"https://localhost.jambor.dev/@admin\" class=\"u-url mention\">@<span>admin</span></a></span> test</p>"
-        },
-        "attachment": [],
-        "tag": [
-          {
-            "type": "Mention",
-            "href": "https://localhost.jambor.dev/users/admin",
-            "name": "@admin@localhost.jambor.dev"
-          }
-        ],
-        "replies": {
-          "id": "https://techhub.social/users/crepels/statuses/109473290785654613/replies",
-          "type": "Collection",
-          "first": {
-            "type": "CollectionPage",
-            "next": "https://techhub.social/users/crepels/statuses/109473290785654613/replies?only_other_accounts=true&page=true",
-            "partOf": "https://techhub.social/users/crepels/statuses/109473290785654613/replies",
-            "items": []
-          }
-        }
-      }
-    }
-  },
-  {
-    "timestamp":"2022-12-08T17:12:38Z",
-    "type": "inbound",
-    "path": "/users/admin/inbox",
-    "data": {
-      "@context": "https://www.w3.org/ns/activitystreams",
-      "id": "https://techhub.social/users/crepels#likes/263597",
-      "type": "Like",
-      "actor": "https://techhub.social/users/crepels",
-      "object": "https://localhost.jambor.dev/users/admin/statuses/109461738015823934"
-    }
-  },
-  {
-    "timestamp":"2022-12-08T17:12:38Z",
-    "type": "inbound",
-    "path": "/users/admin/inbox",
-    "data": {
-      "@context": "https://www.w3.org/ns/activitystreams",
-      "id": "https://techhub.social/users/crepels#likes/263597/undo",
-      "type": "Undo",
-      "actor": "https://techhub.social/users/crepels",
-      "object": {
-        "id": "https://techhub.social/users/crepels#likes/263597",
-        "type": "Like",
-        "actor": "https://techhub.social/users/crepels",
-        "object": "https://localhost.jambor.dev/users/admin/statuses/109461738015823934"
-      }
-    }
-  }
-]
diff --git a/app/javascript/mastodon/features/activity_log/index.js b/app/javascript/mastodon/features/activity_log/index.js
index ede6ffbc6..6ae431e2c 100644
--- a/app/javascript/mastodon/features/activity_log/index.js
+++ b/app/javascript/mastodon/features/activity_log/index.js
@@ -1,10 +1,10 @@
 import React, { useEffect, useReducer, useRef } from 'react';
+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 dummy_data from './dummy-data.json';
+import DismissableBanner from 'mastodon/components/dismissable_banner';
 
 import ActivityPubVisualization from 'activitypub-visualization';
 
@@ -19,7 +19,6 @@ export default function ActivityLog({ multiColumn }) {
     default:
       return state;
     }
-  // }, dummy_data);
   }, []);
 
   const columnElement = useRef(null);
@@ -46,24 +45,39 @@ export default function ActivityLog({ multiColumn }) {
   };
 
   return (
-    <HotKeys handlers={handlers}>
-      <Column bindToDocument={!multiColumn} ref={columnElement} label='Activity Log'>
-        <ColumnHeader
-          icon='comments'
-          title='Activity Log'
-          onClick={() => { columnElement.current.scrollTop() }}
-          multiColumn={multiColumn}
-        />
+    <Column bindToDocument={!multiColumn} ref={columnElement} label='Activity Log'>
+      <ColumnHeader
+        icon='comments'
+        title='Activity Log'
+        onClick={() => { columnElement.current.scrollTop() }}
+        multiColumn={multiColumn}
+      />
 
-        {/* <button onClick={() => navigator.clipboard.writeText(JSON.stringify(logs, null, 2))}>Copy logs</button> */}
-        {/* <button onClick={() => dispatch(['reset-logs'])}>Clear logs</button> */}
+      <DismissableBanner id='activity_log'>
+        <p>
+          <FormattedMessage
+            id='dismissable_banner.activity_log_information'
+            defaultMessage='Open Mastodon in another tab and interact with another instance (for example, follow an account on another instance). The resulting Activities will be shown here. 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>
+        <p style={{ paddingTop: '5px' }}>
+          <FormattedMessage
+            id='dismissable_banner.activity_log_clear'
+            defaultMessage='Note: Activities will only be logged while this view is open. When you navigate elsewhere, the log will be cleared.'
+          />
+        </p>
+      </DismissableBanner>
 
+      <HotKeys handlers={handlers}>
         <div className={`${darkMode ? 'dark' : ''}`}>
           <ActivityPubVisualization logs={logs} />
         </div>
+      </HotKeys>
 
-      </Column>
-    </HotKeys>
+    </Column>
   );
 }