edit reported team in admin ui

src/app/admin/reports/BottomBar.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-  import type { Report, ReportStatus, StrikeReasons } from './reports.ts';
+  import { editReport, type Report, type ReportStatus, type StrikeReasons } from './reports.ts';
   import Input from '@components/input/Input.svelte';
   import Textarea from '@components/input/Textarea.svelte';
   import Select from '@components/input/Select.svelte';
@@ -17,6 +17,7 @@
   let { strikeReasons, report }: Props = $props();
 
   // states
+  let reportedTeam = $state<{ id: number; name: string } | null>(report?.reported ?? null);
   let status = $state<'open' | 'closed' | null>(null);
   let notice = $state<string | null>(null);
   let statement = $state<string | null>(null);
@@ -46,13 +47,18 @@
     $confirmPopupState = {
       title: 'Änderungen speichern?',
       message: 'Sollen die Änderungen am Report gespeichert werden?',
-      onConfirm: async () =>
-        editReportStatus(report!, {
+      onConfirm: async () => {
+        if (reportedTeam?.id != report?.reported?.id) {
+          report!.reported = reportedTeam;
+          await editReport(report!);
+        }
+        await editReportStatus(report!, {
           status: status,
           notice: notice,
           statement: statement,
           strikeReasonId: Number(strikeReason)
-        } as ReportStatus)
+        } as ReportStatus);
+      }
     };
   }
 </script>
@@ -64,7 +70,7 @@
   <button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2" onclick={() => (report = null)}>✕</button>
   <div class="w-[34rem]">
     <TeamSearch value={report?.reporter.name} label="Report Team" readonly mustMatch />
-    <TeamSearch value={report?.reported?.name} label="Reportetes Team" />
+    <TeamSearch value={report?.reported?.name} label="Reportetes Team" onSubmit={(team) => (reportedTeam = team)} />
     <Textarea bind:value={notice} label="Interne Notizen" rows={8} />
   </div>
   <div class="divider divider-horizontal"></div>

src/app/admin/reports/reports.ts

@@ -59,6 +59,17 @@ export async function getReportStatus(report: Report) {
   return data.reportStatus;
 }
 
+export async function editReport(report: Report) {
+  const { error } = await actions.report.editReport({
+    reportId: report.id,
+    reported: report.reported?.id ?? null
+  });
+
+  if (error) {
+    actionErrorPopup(error);
+  }
+}
+
 export async function editReportStatus(report: Report, reportStatus: ReportStatus) {
   const { error } = await actions.report.editReportStatus({
     reportId: report.id,

src/app/website/index/Teams.svelte

@@ -48,10 +48,7 @@
         <tr>
           <td>
             <div class="flex items-center gap-x-2">
-              <div
-                class="rounded-sm min-w-3 w-3 min-h-3 h-3"
-                style="background-color: {team.color}"
-              ></div>
+              <div class="rounded-sm min-w-3 w-3 min-h-3 h-3" style="background-color: {team.color}"></div>
               <h3
                 class="text-xs sm:text-xl break-all"
                 class:line-through={team.memberOne.dead && team.memberTwo.dead}