feat: and the ability to duplicate chords

resolves #100

src/routes/config/chords/+page.svelte

@@ -196,7 +196,7 @@
           {#each $items.slice(page * $pageSize - (page === 0 ? 0 : 1), (page + 1) * $pageSize - 1) as [chord] (JSON.stringify(chord?.id))}
             {#if chord}
               <tr>
-                <ChordEdit {chord} />
+                <ChordEdit {chord} on:duplicate={() => (page = 0)} />
               </tr>
             {/if}
           {/each}

src/routes/config/chords/ChordEdit.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-  import { changes, ChangeType } from "$lib/undo-redo.js";
+  import { changes, ChangeType, chords } from "$lib/undo-redo.js";
   import type { ChordInfo } from "$lib/undo-redo.js";
   import ChordPhraseEdit from "./ChordPhraseEdit.svelte";
   import ChordActionEdit from "./ChordActionEdit.svelte";
@@ -8,9 +8,12 @@
   import { charaFileToUriComponent } from "$lib/share/share-url";
   import SharePopup from "../SharePopup.svelte";
   import tippy from "tippy.js";
+  import { createEventDispatcher } from "svelte";
 
   export let chord: ChordInfo;
 
+  const dispatch = createEventDispatcher<{ duplicate: void }>();
+
   function remove() {
     changes.update((changes) => {
       changes.push({
@@ -39,6 +42,27 @@
     );
   }
 
+  function duplicate() {
+    const id = [...chord.id];
+    id.splice(id.indexOf(0), 1);
+    id.push(0);
+    while ($chords.some((it) => JSON.stringify(it.id) === JSON.stringify(id))) {
+      id[id.length - 1]++;
+    }
+
+    changes.update((changes) => {
+      changes.push({
+        type: ChangeType.Chord,
+        id,
+        actions: [...chord.actions],
+        phrase: [...chord.phrase],
+      });
+      return changes;
+    });
+
+    dispatch("duplicate");
+  }
+
   async function share(event: Event) {
     const url = new URL(window.location.href);
     url.searchParams.set(
@@ -82,6 +106,9 @@
       >restore_from_trash</button
     >
   {/if}
+  <button disabled={chord.deleted} class="icon compact" on:click={duplicate}
+    >content_copy</button
+  >
   <button
     class="icon compact"
     class:disabled={chord.isApplied}
@@ -102,6 +129,10 @@
     background: currentcolor;
   }
 
+  button {
+    transition: opacity 75ms ease;
+  }
+
   td {
     position: relative;
   }