Fix TypeScript key prop error on SourceCallPlayer map

Wrap SourceCallPlayer in Fragment to avoid the broken JSX env treating
key as a component prop on the custom component.

drb-frontend/app/systems/page.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useRef, useState } from "react";
+import { useRef, useState, Fragment } from "react";
 import { useSystems } from "@/lib/useSystems";
 import { c2api } from "@/lib/c2api";
 import type { SystemRecord, VocabularyPendingTerm } from "@/lib/types";
@@ -841,7 +841,7 @@ function SourceCallPlayer({ callId }: { callId: string }) {
       setLoading(true);
       try {
         const c = await c2api.getCall(callId);
-        setCall(c as typeof call);
+        setCall(c as unknown as typeof call);
       } finally {
         setLoading(false);
       }
@@ -1038,8 +1038,10 @@ function VocabularyPanel({ systemId }: { systemId: string }) {
                         </div>
                         {p.source_call_ids && p.source_call_ids.length > 0 && (
                           <div className="pl-1 space-y-1">
-                            {p.source_call_ids.map((id) => (
-                              <SourceCallPlayer key={id} callId={id} />
+                            {p.source_call_ids.map((id: string) => (
+                              <Fragment key={id}>
+                                <SourceCallPlayer callId={id} />
+                              </Fragment>
                             ))}
                           </div>
                         )}