@dcrackel/hematournamentui 1.0.714 → 1.0.716

package/src/stories/Organisms/Cards/WaitlistFencerCard/WaitlistFencerCard.vue

@@ -1,153 +1,180 @@
-<template>
-  <div
-    v-if="person"
-    class="flex items-center border border-dropdownSelect rounded-lg shadow-lg bg-poolBox hover:border-bright"
-  >
-    <div class="hidden md:block mr-4 border-r border-dropdownSelect h-20 w-10 items-center text-center pt-7">
-      <BaseText :text="queueLabel" size="md" color="quaternary" weight="bold" />
-    </div>
-    <div class="block md:hidden mr-4 border-r border-dropdownSelect h-16 w-5 items-center text-center pt-5">
-      <BaseText :text="queueLabel" size="sm" color="quaternary" weight="bold" />
-    </div>
-
-    <div class="hidden md:block mr-4">
-      <div v-if="!portraitURL" class="w-14 h-14 rounded-xl bg-dropdownSelect flex items-center justify-center">
-        <BaseText text="" size="sm" color="neutral" weight="bold" />
-      </div>
-      <img v-if="portraitURL" :src="portraitURL" alt="Portrait" class="w-14 h-14 rounded-xl" />
-    </div>
-
-    <div class="flex flex-col w-3/4 md:w-4/12 justify-start">
-      <div class="flex items-center justify-start gap-2 min-w-0">
-        <button class="min-w-0 text-left" type="button" @click="handleForwardToProfile">
-          <BaseText
-            :text="displayName"
-            size="md"
-            color="quaternary"
-            weight="bold"
-            class="text-sm md:text-xl truncate"
-          />
-        </button>
-        <MissingHemaRatingsId :person="person.Person" />
-      </div>
-      <span class="w-full flex justify-start">
-        <BaseText :text="clubName" size="md" color="quinary" weight="normal" class="hidden md:block" />
-        <BaseText :text="clubShortName" size="xs" color="quinary" weight="normal" class="block md:hidden" />
-      </span>
-
-      <div class="grid md:hidden grid-cols-2 gap-x-4 mr-10">
-        <div class="flex">
-          <BaseText text="M2: " size="xs" color="quaternary" weight="normal" class="mr-1" />
-          <BaseText :text="M2Rating" size="xs" color="quinary" weight="bold" class="ml-1" />
-        </div>
-        <div class="flex">
-          <BaseText text="HR: " size="xs" color="quaternary" weight="normal" class="mr-1" />
-          <BaseText :text="HEMARating" size="xs" color="quinary" weight="bold" class="ml-1" />
-        </div>
-      </div>
-    </div>
-
-    <div class="hidden md:grid grid-cols-1 gap-x-4 mr-4 w-36">
-      <div class="flex">
-        <BaseText text="M2Rating:" size="sm" color="quaternary" weight="normal" class="mr-2" />
-        <BaseText :text="M2Rating" size="sm" color="quinary" weight="bold" class="pt-0.5" />
-      </div>
-      <div class="flex">
-        <BaseText text="HemaRating:" size="sm" color="quaternary" weight="normal" class="mr-2" />
-        <BaseText :text="HEMARating" size="sm" color="quinary" weight="bold" />
-      </div>
-    </div>
-
-    <div class="mr-2 md:mr-4 md:ml-auto flex flex-row">
-      <div class="flex justify-center w-20">
-        <div class="hidden md:flex border border-dropdownSelect shadow-md rounded-lg bg-natural h-9 px-3 items-center">
-          <BaseText text="Unpaid" size="xs" color="quinary" weight="bold" />
-        </div>
-      </div>
-      <div class="w-44 flex justify-end">
-        <BaseButton
-          label="Move to Active"
-          size="xs"
-          type="primary"
-          icon-name="fa-arrow-up-from-bracket"
-          class="border border-dropdownSelect shadow-md rounded-l-lg bg-natural w-40 m-0! p-0! h-10"
-          @buttonClick="handleMoveToActive"
-        />
-      </div>
-    </div>
-
-    <div
-      class="block md:ml-4 border-l border-dropdownSelect h-16 w-9 md:h-20 md:w-10 items-center text-center hover:bg-eventBoxRed rounded-tr-lg rounded-br-lg pt-5 md:pt-6"
-    >
-      <BaseIcon
-        icon-name="fa-circle-xmark"
-        size=""
-        color="quinary"
-        hover="alarm"
-        @click="handleRemoveFencer"
-        class="text-md md:text-2xl"
-      />
-    </div>
-  </div>
-</template>
-
-<script>
-import BaseIcon from '../../../Atoms/Icon/BaseIcon.vue';
-import BaseText from '../../../Atoms/Text/BaseText.vue';
-import BaseButton from '../../../Molecules/Buttons/BaseButton/BaseButton.vue';
-import MissingHemaRatingsId from '../../../Molecules/Indicators/MissingHemaRatingsId/MissingHemaRatingsId.vue';
-
-export default {
-  name: 'WaitlistFencerCard',
-  components: { BaseButton, BaseIcon, BaseText, MissingHemaRatingsId },
-  emits: ['forward:toProfile', 'move:active', 'remove:fencer'],
-  props: {
-    person: {
-      type: Object,
-      required: true
-    },
-    queuePosition: {
-      type: Number,
-      required: true
-    }
-  },
-  computed: {
-    queueLabel() {
-      return `#${this.queuePosition}`;
-    },
-    displayName() {
-      return this.person?.Person?.DisplayName || 'Unknown fencer';
-    },
-    clubName() {
-      return this.person?.Person?.Club?.Name || 'No club listed';
-    },
-    clubShortName() {
-      return this.person?.Person?.Club?.ShortName || this.clubName;
-    },
-    portraitURL() {
-      const images = this.person?.Person?.Images || [];
-      const portrait = images.find(image => image.Type === 'Portrait');
-      return portrait ? portrait.URL : '';
-    },
-    HEMARating() {
-      const rating = this.person?.Person?.HEMARatings?.[0]?.Rating;
-      return rating || 0;
-    },
-    M2Rating() {
-      const rating = this.person?.Person?.M2Ratings?.[0]?.Rating;
-      return rating || 'U';
-    }
-  },
-  methods: {
-    handleMoveToActive() {
-      this.$emit('move:active', { ...this.person });
-    },
-    handleRemoveFencer() {
-      this.$emit('remove:fencer', { ...this.person });
-    },
-    handleForwardToProfile() {
-      this.$emit('forward:toProfile', this.person.PersonId);
-    }
-  }
-};
-</script>
+<template>
+  <div
+    v-if="person"
+    class="flex flex-wrap items-center gap-3 rounded-lg border border-dropdownSelect bg-poolBox py-3 pl-3 shadow-lg hover:border-bright md:flex-nowrap"
+  >
+    <div class="w-8 shrink-0 border-r border-dropdownSelect pr-3 text-center">
+      <BaseText :text="queueLabel" size="sm" color="quaternary" weight="bold" />
+    </div>
+    <div class="hidden shrink-0 lg:block">
+      <div v-if="!portraitURL" class="flex h-14 w-14 items-center justify-center rounded-xl bg-dropdownSelect"></div>
+      <img v-else :src="portraitURL" alt="Portrait" class="h-14 w-14 rounded-xl" />
+    </div>
+
+    <div class="min-w-0 flex-1 basis-40 text-left">
+      <div class="flex min-w-0 items-center gap-2">
+        <button class="min-w-0 text-left" type="button" @click="handleForwardToProfile">
+          <BaseText
+            :text="displayName"
+            size="md"
+            color="quaternary"
+            weight="bold"
+            class="break-words text-sm md:text-xl"
+          />
+        </button>
+        <MissingHemaRatingsId :person="person.Person" />
+      </div>
+      <BaseText :text="clubName" size="sm" color="quinary" class="hidden md:block" />
+      <BaseText :text="clubShortName" size="xs" color="quinary" class="md:hidden" />
+      <div class="mt-2 flex flex-wrap items-center gap-2 text-xs" aria-live="polite">
+        <span class="rounded px-2 py-1 font-semibold" :class="checkInClass">{{ checkInStatus }}</span>
+        <span
+          v-if="isNextCheckedIn && checkedIn"
+          class="rounded bg-eventBoxBlueTwo px-2 py-1 font-semibold text-primary"
+          >Next checked in</span
+        >
+        <span class="text-primaryHighlight">{{ waiverStatus }}</span>
+      </div>
+    </div>
+
+    <div class="hidden shrink-0 text-left xl:block">
+      <BaseText :text="`M2: ${M2Rating}`" size="xs" color="quinary" />
+      <BaseText :text="`HR: ${HEMARating}`" size="xs" color="quinary" />
+    </div>
+
+    <div class="flex w-full flex-wrap items-center justify-end gap-y-2 md:ml-auto md:w-auto md:shrink-0">
+      <div class="mr-2 flex items-center gap-2">
+        <span
+          class="hidden rounded border border-dropdownSelect px-2 py-1 text-xs font-bold text-quinary lg:inline-flex"
+          >Unpaid</span
+        >
+        <BaseButton
+          label="Move to Active"
+          size="xs"
+          type="primary"
+          icon-name="fa-arrow-up-from-bracket"
+          class="m-0! min-h-10"
+          @buttonClick="handleMoveToActive"
+        />
+      </div>
+      <div class="mr-2 flex w-44 shrink-0 justify-end md:mr-4">
+        <BaseButton
+          v-if="needsWaiver"
+          label="Sign Waiver"
+          size="xs"
+          type="primary"
+          class="m-0! h-10 w-40 p-0!"
+          @buttonClick="requestWeaverSign"
+        />
+        <ButtonBar
+          v-else
+          :buttons="attendanceButtons"
+          :selected="selectedAttendance"
+          class="mr-1 min-h-10"
+          @update:selected="handleAttendance"
+        />
+      </div>
+      <button
+        type="button"
+        :aria-label="`Remove ${displayName} from waitlist`"
+        class="flex min-h-10 w-9 shrink-0 items-center justify-center border-l border-dropdownSelect text-quinary hover:bg-eventBoxRed focus-visible:outline-2 focus-visible:outline-bright md:ml-4 md:w-10"
+        @click="handleRemoveFencer"
+      >
+        <BaseIcon icon-name="fa-circle-xmark" size="lg" color="quinary" hover="alarm" />
+      </button>
+    </div>
+  </div>
+</template>
+
+<script>
+import BaseIcon from '../../../Atoms/Icon/BaseIcon.vue';
+import BaseText from '../../../Atoms/Text/BaseText.vue';
+import BaseButton from '../../../Molecules/Buttons/BaseButton/BaseButton.vue';
+import ButtonBar from '../../../Molecules/Buttons/ButtonBar/ButtonBar.vue';
+import MissingHemaRatingsId from '../../../Molecules/Indicators/MissingHemaRatingsId/MissingHemaRatingsId.vue';
+import { isWaitlistCheckedIn, needsAttendanceWaiver } from '../../../Util/waitlistAttendance.js';
+
+export default {
+  name: 'WaitlistFencerCard',
+  components: { BaseButton, ButtonBar, BaseIcon, BaseText, MissingHemaRatingsId },
+  emits: ['forward:toProfile', 'move:active', 'remove:fencer', 'update:check-in', 'request:weaver-sign'],
+  props: {
+    person: { type: Object, required: true },
+    queuePosition: { type: Number, required: true },
+    isNextCheckedIn: { type: Boolean, default: false }
+  },
+  computed: {
+    queueLabel() {
+      return `#${this.queuePosition}`;
+    },
+    displayName() {
+      return this.person?.Person?.DisplayName || 'Unknown fencer';
+    },
+    clubName() {
+      return this.person?.Person?.Club?.Name || 'No club listed';
+    },
+    clubShortName() {
+      return this.person?.Person?.Club?.ShortName || this.clubName;
+    },
+    portraitURL() {
+      const images = this.person?.Person?.Images || [];
+      return images.find(image => image.Type === 'Portrait')?.URL || '';
+    },
+    HEMARating() {
+      return this.person?.Person?.HEMARatings?.[0]?.Rating || 0;
+    },
+    M2Rating() {
+      return this.person?.Person?.M2Ratings?.[0]?.Rating || 'U';
+    },
+    checkedIn() {
+      return isWaitlistCheckedIn(this.person);
+    },
+    needsWaiver() {
+      return needsAttendanceWaiver(this.person);
+    },
+    checkInStatus() {
+      return this.checkedIn ? 'Checked in' : 'Not checked in';
+    },
+    attendanceButtons() {
+      return [
+        { id: 'Absent', label: 'Absent', defaultBgColor: 'bg-natural', selectedBgColor: 'bg-eventBoxBlueTwo' },
+        { id: 'Present', label: 'Present', defaultBgColor: 'bg-natural', selectedBgColor: 'bg-eventBoxGreenTwo' }
+      ];
+    },
+    selectedAttendance() {
+      return this.checkedIn ? 'Present' : 'Absent';
+    },
+    checkInClass() {
+      return this.checkedIn ? 'bg-acceptedHighlight text-accepted' : 'bg-dropdownSelect text-primaryHighlight';
+    },
+    waiverStatus() {
+      if (this.needsWaiver) return 'Waiver needed';
+      return this.person?.Person?.Weaver?.Required ? 'Waiver signed' : 'No waiver required';
+    }
+  },
+  methods: {
+    clonePerson() {
+      return JSON.parse(JSON.stringify(this.person));
+    },
+    requestWeaverSign() {
+      this.$emit('request:weaver-sign', this.clonePerson());
+    },
+    handleAttendance(selected) {
+      if (selected === 'Present' && this.needsWaiver) {
+        this.requestWeaverSign();
+        return;
+      }
+      this.$emit('update:check-in', { ...this.clonePerson(), CheckedIn: selected === 'Present' });
+    },
+    handleMoveToActive() {
+      this.$emit('move:active', this.clonePerson());
+    },
+    handleRemoveFencer() {
+      this.$emit('remove:fencer', this.clonePerson());
+    },
+    handleForwardToProfile() {
+      this.$emit('forward:toProfile', this.person.PersonId ?? this.person.Person?.PersonId);
+    }
+  }
+};
+</script>

package/src/stories/Organisms/Containers/Tableau/components/BracketDirectorAssignmentPanel.test.js

@@ -41,11 +41,27 @@ describe('BracketDirectorAssignmentPanel', () => {
     ).toEqual([stations[1]]);
   });
 
-  it('opens director management', async () => {
+  it.each([
+    ['Manage directors', 'request:manage-planned-directors'],
+    ['Redistribute scheduled bouts', 'request:redistribute-scheduled-bouts'],
+    ['Refresh assignments', 'request:refresh-assignments']
+  ])('emits %s intent without changing the station list', async (label, event) => {
     const wrapper = shallowMount(BracketDirectorAssignmentPanel, {
       props: { stations, canManageDirectors: true }
     });
-    await wrapper.get('[data-testid="manage-bracket-directors"]').trigger('click');
-    expect(wrapper.emitted('request:manage-planned-directors')).toEqual([[]]);
+    const button = wrapper.get('button[aria-label="' + label + '"]');
+    expect(button.attributes('title')).toBe(label);
+    await button.trigger('click');
+
+    expect(wrapper.emitted(event)).toEqual([[]]);
+    expect(Object.keys(wrapper.emitted()).filter(name => name.startsWith('request:'))).toEqual([event]);
+    expect(wrapper.props('stations')).toEqual(stations);
+    wrapper.unmount();
+  });
+
+  it('hides the toolbar when management is unavailable', () => {
+    const wrapper = shallowMount(BracketDirectorAssignmentPanel, { props: { stations } });
+    expect(wrapper.find('[role="group"]').exists()).toBe(false);
+    wrapper.unmount();
   });
 });

package/src/stories/Organisms/Containers/Tableau/components/BracketDirectorAssignmentPanel.vue

@@ -1,29 +1,33 @@
 <template>
   <aside
     data-testid="bracket-director-assignment-panel"
-    class="w-full rounded-xl border border-dropdownSelect bg-bannerBackground p-4 shadow-lg xl:sticky xl:top-4 xl:w-72"
+    aria-label="Director assignments"
+    class="w-full border-b border-dropdownSelect py-4 xl:w-72 xl:border-b-0 xl:border-l xl:pl-4"
   >
-    <div class="mb-4 flex items-start justify-between gap-3">
-      <div>
-        <BaseText color="primaryHighlight" size="md" text="Director Assignments" weight="bold" />
-        <BaseText
-          class="mt-1"
-          color="quaternary"
-          size="xs"
-          text="Plan ring coverage. Scheduled bouts may still be moved between rings."
-        />
+    <header class="mb-4 space-y-3 border-b border-dropdownSelect pb-4">
+      <h2 class="text-md font-bold text-primaryHighlight">Director Assignments</h2>
+      <div v-if="canManageDirectors" class="flex flex-wrap gap-1" role="group" aria-label="Director assignment actions">
+        <button
+          v-for="action in directorActions"
+          :key="action.event"
+          type="button"
+          :data-testid="action.testId"
+          :aria-label="action.description"
+          :title="action.description"
+          class="flex min-h-9 flex-auto items-center justify-center gap-1 whitespace-nowrap rounded border border-dropdownSelect bg-white px-1 py-2 text-xs text-primaryHighlight transition hover:bg-dropdownSelect focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-bright"
+          @click="$emit(action.event)"
+        >
+          <BaseIcon :iconName="action.icon" iconStyle="fa" color="primaryHighlight" size="xs" aria-hidden="true" />
+          <span>{{ action.label }}</span>
+        </button>
       </div>
-      <button
-        v-if="canManageDirectors"
-        type="button"
-        data-testid="manage-bracket-directors"
-        class="rounded border border-dropdownSelect bg-white px-2 py-1 text-xs text-primaryHighlight hover:bg-dropdownSelect focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-bright"
-        @click="$emit('request:manage-planned-directors')"
-      >
-        Manage
-      </button>
-    </div>
 
+      <BaseText
+        color="quaternary"
+        size="xs"
+        text="Plan ring coverage. Scheduled bouts may still be moved between rings."
+      />
+    </header>
     <div class="space-y-3">
       <BracketDirectorAssignmentCard
         v-for="station in stations"
@@ -42,12 +46,45 @@
 
 <script>
 import BaseText from '../../../../Atoms/Text/BaseText.vue';
+import BaseIcon from '../../../../Atoms/Icon/BaseIcon.vue';
 import BracketDirectorAssignmentCard from '../../../Cards/BracketDirectorAssignmentCard/BracketDirectorAssignmentCard.vue';
 
+const directorActions = [
+  {
+    label: 'Manage',
+    description: 'Manage directors',
+    icon: 'fa-users',
+    event: 'request:manage-planned-directors',
+    testId: 'manage-bracket-directors'
+  },
+  {
+    label: 'Redistribute',
+    description: 'Redistribute scheduled bouts',
+    icon: 'fa-random',
+    event: 'request:redistribute-scheduled-bouts',
+    testId: 'redistribute-scheduled-bouts'
+  },
+  {
+    label: 'Refresh',
+    description: 'Refresh assignments',
+    icon: 'fa-refresh',
+    event: 'request:refresh-assignments',
+    testId: 'refresh-bracket-assignments'
+  }
+];
 export default {
   name: 'BracketDirectorAssignmentPanel',
-  components: { BaseText, BracketDirectorAssignmentCard },
-  emits: ['request:add-planned-director', 'request:remove-planned-director', 'request:manage-planned-directors'],
+  components: { BaseIcon, BaseText, BracketDirectorAssignmentCard },
+  emits: [
+    'request:add-planned-director',
+    'request:remove-planned-director',
+    'request:manage-planned-directors',
+    'request:redistribute-scheduled-bouts',
+    'request:refresh-assignments'
+  ],
+  data() {
+    return { directorActions };
+  },
   props: {
     canManageDirectors: { type: Boolean, default: false },
     stations: {

package/src/stories/Templates/EventManagement/Bracket/Bracket.stories.js

@@ -135,6 +135,11 @@ const renderInteractiveBracket = args => ({
       requestBoutDirector,
       assignPlannedDirector,
       handleAddPlannedDirector,
+      redistributeAssignments,
+      refreshAssignments() {
+        storyStations.value = cloneStations(args.plannedDirectingStations);
+        applyProvidedAssignments(args.plannedBoutAssignments);
+      },
       handleRemovePlannedDirector(station) {
         const remainingStations = storyStations.value.filter(item => String(item.RingId) !== String(station?.RingId));
         if (remainingStations.length === storyStations.value.length) return;
@@ -174,6 +179,8 @@ const renderInteractiveBracket = args => ({
       :plannedBoutAssignments="storyAssignments"
       :showAddPlannedDirectorCard="args.showAddPlannedDirectorCard && canAddDirector"
       @request:bout-director="requestBoutDirector"
+      @request:redistribute-scheduled-bouts="redistributeAssignments"
+      @request:refresh-assignments="refreshAssignments"
       @close:directing-bout="handleCloseDirectingBout"
       @request:add-planned-director="handleAddPlannedDirector"
       @request:remove-planned-director="handleRemovePlannedDirector"
@@ -208,6 +215,12 @@ export default {
     showBoutDirectorAssignment: true
   },
   argTypes: {
+    'request:redistribute-scheduled-bouts': {
+      description: 'Parent intent to redistribute scheduled coverage without changing active or completed bouts.'
+    },
+    'request:refresh-assignments': {
+      description: 'Parent intent to reload stations and assignments. This story reloads the supplied args fixtures.'
+    },
     availableDirectors: {
       control: 'object',
       description: 'Eligible staff, including DE-only directors, supplied by the parent.'

package/src/stories/Templates/EventManagement/Bracket/Bracket.test.js

@@ -216,3 +216,29 @@ describe('Bracket assignment defaults', () => {
     wrapper.unmount();
   });
 });
+
+describe('Bracket assignment toolbar', () => {
+  it.each(['request:redistribute-scheduled-bouts', 'request:refresh-assignments'])(
+    'forwards %s without changing bouts or planned coverage',
+    async event => {
+      const bouts = [createBout(), createBout({ BoutId: 43, Status: 'Active', RefereeId: 99 })];
+      const stations = [{ RingId: 1, Director: { PersonId: 99, DisplayName: 'Dave Smith' } }];
+      const assignments = [{ DEBoutId: 1, RingId: 1 }];
+      const wrapper = mountBracket(bouts, {
+        availableDirectors: [stations[0].Director],
+        rings: [{ RingId: 1 }],
+        plannedDirectingStations: stations,
+        plannedBoutAssignments: assignments
+      });
+
+      wrapper.findComponent(BracketDirectorAssignmentPanel).vm.$emit(event);
+      await wrapper.vm.$nextTick();
+
+      expect(wrapper.emitted()).toEqual({ [event]: [[]] });
+      expect(wrapper.vm.boutsData).toEqual(bouts);
+      expect(wrapper.props('plannedDirectingStations')).toEqual(stations);
+      expect(wrapper.props('plannedBoutAssignments')).toEqual(assignments);
+      wrapper.unmount();
+    }
+  );
+});

package/src/stories/Templates/EventManagement/Bracket/Bracket.vue

@@ -1,5 +1,5 @@
 <template>
-  <section>
+  <section class="flex min-h-full flex-col xl:min-h-[calc(100dvh-2rem)]">
     <EditEventsTopMenu :currentTab="'Bracket'" :tabs="tabs(role, isMobile)" @tabMenuClick="handleTabMenuClick" />
     <ToggleHeader
       :currentSelection="viewName"
@@ -17,7 +17,7 @@
       :statusText="connectedToServer ? 'Connected' : 'Disconnected'"
     />
 
-    <div class="flex flex-col gap-4 xl:flex-row">
+    <div class="flex flex-1 flex-col gap-4 xl:flex-row">
       <div class="min-w-0 flex-1">
         <Tableau
           :bouts="sortedBouts"
@@ -42,6 +42,8 @@
         :showAddCard="showAddPlannedDirectorCard"
         :canManageDirectors="canManagePlannedDirectors"
         @request:manage-planned-directors="handleManagePlannedDirectors"
+        @request:redistribute-scheduled-bouts="$emit('request:redistribute-scheduled-bouts')"
+        @request:refresh-assignments="$emit('request:refresh-assignments')"
         @request:add-planned-director="handleAddPlannedDirector"
         @request:remove-planned-director="$emit('request:remove-planned-director', $event)"
       />
@@ -136,6 +138,8 @@ export default {
     'penalty:update',
     'request:add-planned-director',
     'request:remove-planned-director',
+    'request:redistribute-scheduled-bouts',
+    'request:refresh-assignments',
     'update:planned-directing-stations',
     'request:bout-active',
     'request:bout-director',

package/src/stories/Templates/EventManagement/EventAttendance/EventAttendance.stories.js

@@ -43,7 +43,7 @@ export default {
   },
   argTypes: {
     personsInTournament: {
-      control: { type: 'array' },
+      control: { type: 'object' },
       description: 'List of persons in the tournament',
       table: {
         type: { summary: 'Array' },
@@ -51,7 +51,7 @@ export default {
       }
     },
     personsAll: {
-      control: { type: 'array' },
+      control: { type: 'object' },
       description: 'List of all persons',
       table: {
         type: { summary: 'Array' },
@@ -59,7 +59,7 @@ export default {
       }
     },
     fencingClubs: {
-      control: { type: 'array' },
+      control: { type: 'object' },
       description: 'List of clubs',
       table: {
         type: { summary: 'Array' },
@@ -117,6 +117,38 @@ export const WithWaitlist = {
   }
 };
 
+export const WaitlistCheckIn = {
+  parameters: {
+    docs: {
+      description: {
+        story:
+          'Waitlisted fencers sign the waiver, then use Absent/Present to check in without joining the active roster. Move to Active remains available to fill a no-show spot. The parent handles update:waitlist-check-in ({ ...person, CheckedIn }), weaver:sign, and move:waitlist-to-active, then supplies updated personsInTournament. Status stays Waitlist until the parent promotes the fencer.'
+      }
+    }
+  },
+  args: {
+    ...WithWaitlist.args,
+    personsInTournament: [
+      {
+        ...activeRoster[0],
+        Status: 'Absent',
+        Person: {
+          ...activeRoster[0].Person,
+          Weaver: { Required: true, Scope: 'Tournament', Signed: true }
+        }
+      },
+      ...waitlistedPersons.map((person, index) => ({
+        ...person,
+        CheckedIn: index === 2,
+        Person: {
+          ...person.Person,
+          Weaver: { Required: true, Scope: 'Tournament', Signed: index !== 0 }
+        }
+      }))
+    ]
+  }
+};
+
 export const RegistrationOpen = {
   args: {
     personsInTournament: eventPersonGetEventById.persons,