From 6e2d9bb513ffdff06f5bd35e641b04666c8b8aad Mon Sep 17 00:00:00 2001
From: XiNGRZ <hi@xingrz.me>
Date: Sat, 6 Apr 2024 21:01:26 +0800
Subject: [PATCH] Calculate unique id for each rows

This improves performance on inserting new lines as lines below will not
need to all revalidate.
---
 src/components/BSMap.vue | 14 +++++++++++---
 1 file changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/components/BSMap.vue b/src/components/BSMap.vue
index 62bea1b..781f38a 100644
--- a/src/components/BSMap.vue
+++ b/src/components/BSMap.vue
@@ -1,6 +1,6 @@
 <template>
   <div :class="$style.map" :style="style">
-    <BSRow v-for="(row, index) in rows" :key="index" :src="row" :row="index" />
+    <BSRow v-for="({ row, id }, index) in rows" :key="id" :src="row" :row="index" />
   </div>
 </template>
 
@@ -20,8 +20,16 @@ const props = defineProps<{
   size: number;
 }>();
 
-const rows = computed(() => props.content.split('\n'));
-const cols = computed(() => max(rows.value.map((row) => row.split('\\').length)) || 1);
+const rows = computed(() => {
+  const appears: Record<string, number> = {};
+  return props.content.split('\n').map((row) => {
+    const id = (appears[row] ?? -1) + 1;
+    appears[row] = id;
+    return { row, id: `${row}#${id}` };
+  });
+});
+
+const cols = computed(() => max(rows.value.map(({ row }) => row.split('\\').length)) || 1);
 
 const style = computed(() => ({
   '--bs-map-size': props.size,