Fix activity log rendering; closes #4208

app/Transformers/Api/Client/ActivityLogTransformer.php

@@ -55,6 +55,11 @@ class ActivityLogTransformer extends BaseClientTransformer
                 }
 
                 if (!is_array($value)) {
+                    // Perform some directory normalization at this point.
+                    if ($key === 'directory') {
+                        $value = str_replace('//', '/', '/' . trim($value, '/') . '/');
+                    }
+
                     return [$key => $value];
                 }
 

resources/scripts/components/elements/activity/ActivityLogEntry.tsx

@@ -8,37 +8,40 @@ import ActivityLogMetaButton from '@/components/elements/activity/ActivityLogMet
 import { TerminalIcon } from '@heroicons/react/solid';
 import classNames from 'classnames';
 import style from './style.module.css';
-import { isObject } from '@/lib/objects';
 import Avatar from '@/components/Avatar';
 import useLocationHash from '@/plugins/useLocationHash';
+import { getObjectKeys, isObject } from '@/lib/objects';
 
 interface Props {
     activity: ActivityLog;
     children?: React.ReactNode;
 }
 
-const formatProperties = (properties: Record<string, unknown>): Record<string, unknown> => {
+function wrapProperties(value: unknown): any {
-    return Object.keys(properties).reduce((obj, key) => {
+    if (value === null || typeof value === 'string' || typeof value === 'number') {
-        const value = properties[key];
+        return `<strong>${String(value)}</strong>`;
-        // noinspection SuspiciousTypeOfGuard
+    }
-        const isCount = key === 'count' || (typeof key === 'string' && key.endsWith('_count'));
 
-        return {
+    if (isObject(value)) {
-            ...obj,
+        return getObjectKeys(value).reduce((obj, key) => {
-            [key]:
+            if (key === 'count' || (typeof key === 'string' && key.endsWith('_count'))) {
-                isCount || typeof value !== 'string'
+                return { ...obj, [key]: value[key] };
-                    ? isObject(value)
+            }
-                        ? formatProperties(value)
+            return { ...obj, [key]: wrapProperties(value[key]) };
-                        : value
+        }, {} as Record<string, unknown>);
-                    : `<strong>${value}</strong>`,
+    }
-        };
+
-    }, {});
+    if (Array.isArray(value)) {
-};
+        return value.map(wrapProperties);
+    }
+
+    return value;
+}
 
 export default ({ activity, children }: Props) => {
     const { pathTo } = useLocationHash();
     const actor = activity.relationships.actor;
-    const properties = formatProperties(activity.properties);
+    const properties = wrapProperties(activity.properties);
 
     return (
         <div className={'grid grid-cols-10 py-4 border-b-2 border-gray-800 last:rounded-b last:border-0 group'}>