From 69fa020bd4b7cf7c658ba855d5ab5c89c18c254a Mon Sep 17 00:00:00 2001
From: Balint Gabor <127662+gbalint@users.noreply.github.com>
Date: Wed, 3 Jan 2024 17:03:57 +0100
Subject: [PATCH] Fix thread with first comment deleted

---
 .../src/components/canvas/controls/comment-indicator.tsx  | 3 ++-
 .../src/components/inspector/sections/comment-section.tsx | 5 +++--
 editor/src/core/shared/multiplayer.ts                     | 8 ++++++--
 3 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/editor/src/components/canvas/controls/comment-indicator.tsx b/editor/src/components/canvas/controls/comment-indicator.tsx
index a578caf7f993..0eeac07ed933 100644
--- a/editor/src/components/canvas/controls/comment-indicator.tsx
+++ b/editor/src/components/canvas/controls/comment-indicator.tsx
@@ -22,6 +22,7 @@ import {
   windowPoint,
 } from '../../../core/shared/math-utils'
 import {
+  getFirstComment,
   multiplayerColorFromIndex,
   multiplayerInitialsFromName,
   normalizeMultiplayerName,
@@ -427,7 +428,7 @@ const HoveredCommentIndicator = React.memo((props: HoveredCommentIndicatorProps)
     return null
   }
 
-  const comment = thread.comments[0]
+  const comment = getFirstComment(thread)
   if (comment == null) {
     return null
   }
diff --git a/editor/src/components/inspector/sections/comment-section.tsx b/editor/src/components/inspector/sections/comment-section.tsx
index 0d474ef0e6ce..ea9fb66b5406 100644
--- a/editor/src/components/inspector/sections/comment-section.tsx
+++ b/editor/src/components/inspector/sections/comment-section.tsx
@@ -36,7 +36,7 @@ import {
 } from '../../../core/commenting/comment-hooks'
 import { Substores, useEditorState, useSelectorWithCallback } from '../../editor/store/store-hook'
 import { when } from '../../../utils/react-conditionals'
-import { openCommentThreadActions } from '../../../core/shared/multiplayer'
+import { getFirstComment, openCommentThreadActions } from '../../../core/shared/multiplayer'
 import { getRemixLocationLabel } from '../../canvas/remix/remix-utils'
 import type { RestOfEditorState } from '../../editor/store/store-hook-substore-types'
 import { getCurrentTheme } from '../../editor/store/editor-state'
@@ -215,7 +215,8 @@ const ThreadPreview = React.memo(({ thread }: ThreadPreviewProps) => {
     'ThreadPreview theme',
   )
 
-  const comment = thread.comments[0]
+  const comment = getFirstComment(thread)
+
   if (comment == null) {
     return null
   }
diff --git a/editor/src/core/shared/multiplayer.ts b/editor/src/core/shared/multiplayer.ts
index 9c27938c0e71..5e60c8e85dca 100644
--- a/editor/src/core/shared/multiplayer.ts
+++ b/editor/src/core/shared/multiplayer.ts
@@ -1,5 +1,5 @@
-import type { User } from '@liveblocks/client'
-import type { Presence, UserMeta } from '../../../liveblocks.config'
+import type { CommentData, ThreadData, User } from '@liveblocks/client'
+import type { Presence, ThreadMetadata, UserMeta } from '../../../liveblocks.config'
 import { possiblyUniqueInArray, safeIndex, stripNulls, uniqBy } from './array-utils'
 import { colorTheme, getPreferredColorScheme } from '../../uuiui'
 import type { ElementPath } from './project-file-types'
@@ -161,3 +161,7 @@ export function openCommentThreadActions(threadId: string, scene: ElementPath |
     scene != null ? setHighlightedView(scene) : null,
   ])
 }
+
+export function getFirstComment(thread: ThreadData<ThreadMetadata>): CommentData | null {
+  return thread.comments.filter((c) => c.deletedAt == null)[0] ?? null
+}