[red-knot] Fix stale syntax errors in playground (#17280)

## Summary

React requires that `key`s are unique but the constructed key for
diagnostics wasn't guaranteed when two diagnostics had the same name and
location.

This PR fixes this by using a disambiguator map to disambiguate the key.

Fixes #17276

## Test Plan



https://github.com/user-attachments/assets/f3f9d10a-ecc4-4ffe-8676-3633a12e07ce

Author: MichaReiser

playground/knot/src/Editor/Diagnostics.tsx

@@ -62,18 +62,25 @@ function Items({
     );
   }
 
+  const uniqueIds: Map<string, number> = new Map();
+
   return (
     <ul className="space-y-0.5 grow overflow-y-scroll">
-      {diagnostics.map((diagnostic, index) => {
+      {diagnostics.map((diagnostic) => {
         const position = diagnostic.range;
         const start = position?.start;
         const id = diagnostic.id;
 
         const startLine = start?.line ?? 1;
         const startColumn = start?.column ?? 1;
 
+        const mostlyUniqueId = `${startLine}:${startColumn}-${id}`;
+
+        const disambiguator = uniqueIds.get(mostlyUniqueId) ?? 0;
+        uniqueIds.set(mostlyUniqueId, disambiguator + 1);
+
         return (
-          <li key={`${startLine}:${startColumn}-${id ?? index}`}>
+          <li key={`${mostlyUniqueId}-${disambiguator}`}>
             <button
               onClick={() => onGoTo(startLine, startColumn)}
               className="w-full text-start cursor-pointer select-text"