From d6c30092ec3fefbd754e096bc850d93967e561ee Mon Sep 17 00:00:00 2001
From: DaneEveritt <dane@daneeveritt.com>
Date: Sun, 10 Jul 2022 14:53:29 -0400
Subject: [PATCH] Utilize a unique ID for activity logs to improve rendering
 perf

---
 app/Transformers/Api/Client/ActivityLogTransformer.php        | 4 ++++
 resources/scripts/api/definitions/user/models.d.ts            | 1 +
 resources/scripts/api/definitions/user/transformers.ts        | 1 +
 .../components/dashboard/activity/ActivityLogContainer.tsx    | 2 +-
 .../scripts/components/server/ServerActivityLogContainer.tsx  | 2 +-
 5 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/app/Transformers/Api/Client/ActivityLogTransformer.php b/app/Transformers/Api/Client/ActivityLogTransformer.php
index 25a7562f8..c8345e26a 100644
--- a/app/Transformers/Api/Client/ActivityLogTransformer.php
+++ b/app/Transformers/Api/Client/ActivityLogTransformer.php
@@ -18,6 +18,10 @@ class ActivityLogTransformer extends BaseClientTransformer
     public function transform(ActivityLog $model): array
     {
         return [
+            // This is not for security, it is only to provide a unique identifier to
+            // the front-end for each entry to improve rendering performance since there
+            // is nothing else sufficiently unique to key off at this point.
+            'id' => sha1($model->id),
             'batch' => $model->batch,
             'event' => $model->event,
             'is_api' => !is_null($model->api_key_id),
diff --git a/resources/scripts/api/definitions/user/models.d.ts b/resources/scripts/api/definitions/user/models.d.ts
index f42697eec..a5b40ca67 100644
--- a/resources/scripts/api/definitions/user/models.d.ts
+++ b/resources/scripts/api/definitions/user/models.d.ts
@@ -20,6 +20,7 @@ interface SSHKey extends Model {
 }
 
 interface ActivityLog extends Model<'actor'> {
+    id: string;
     batch: UUID | null;
     event: string;
     ip: string | null;
diff --git a/resources/scripts/api/definitions/user/transformers.ts b/resources/scripts/api/definitions/user/transformers.ts
index bc747a936..1fa62d3f9 100644
--- a/resources/scripts/api/definitions/user/transformers.ts
+++ b/resources/scripts/api/definitions/user/transformers.ts
@@ -31,6 +31,7 @@ export default class Transformers {
         const { actor } = attributes.relationships || {};
 
         return {
+            id: attributes.id,
             batch: attributes.batch,
             event: attributes.event,
             ip: attributes.ip,
diff --git a/resources/scripts/components/dashboard/activity/ActivityLogContainer.tsx b/resources/scripts/components/dashboard/activity/ActivityLogContainer.tsx
index 60d486111..f10701f81 100644
--- a/resources/scripts/components/dashboard/activity/ActivityLogContainer.tsx
+++ b/resources/scripts/components/dashboard/activity/ActivityLogContainer.tsx
@@ -49,7 +49,7 @@ export default () => {
             ) : (
                 <div className={'bg-gray-700'}>
                     {data?.items.map((activity) => (
-                        <ActivityLogEntry key={activity.timestamp.toString() + activity.event} activity={activity}>
+                        <ActivityLogEntry key={activity.id} activity={activity}>
                             {typeof activity.properties.useragent === 'string' && (
                                 <Tooltip content={activity.properties.useragent} placement={'top'}>
                                     <span>
diff --git a/resources/scripts/components/server/ServerActivityLogContainer.tsx b/resources/scripts/components/server/ServerActivityLogContainer.tsx
index 676d462b2..531945486 100644
--- a/resources/scripts/components/server/ServerActivityLogContainer.tsx
+++ b/resources/scripts/components/server/ServerActivityLogContainer.tsx
@@ -52,7 +52,7 @@ export default () => {
             ) : (
                 <div className={'bg-gray-700'}>
                     {data?.items.map((activity) => (
-                        <ActivityLogEntry key={activity.timestamp.toString() + activity.event} activity={activity}>
+                        <ActivityLogEntry key={activity.id} activity={activity}>
                             <span />
                         </ActivityLogEntry>
                     ))}