diff --git a/client-v3/e2e/tests/06-show-config-characters.spec.ts b/client-v3/e2e/tests/06-show-config-characters.spec.ts
index e6e957bcf..c2207ffb9 100644
--- a/client-v3/e2e/tests/06-show-config-characters.spec.ts
+++ b/client-v3/e2e/tests/06-show-config-characters.spec.ts
@@ -83,6 +83,62 @@ test('deletes a character', async () => {
   });
 });
 
+// ── Rows per page selector ─────────────────────────────────────────────────
+
+test('rows per page selector is hidden when row count does not exceed minimum', async () => {
+  // Only Hamlet exists (1 row) — controls hidden when totalRows ≤ 10 (smallest option)
+  await expect(page.locator('select#character-table-per-page')).not.toBeVisible();
+});
+
+test('creates enough characters for pagination controls to appear', async () => {
+  for (const name of [
+    'Alice',
+    'Bob',
+    'Carol',
+    'Dave',
+    'Eve',
+    'Frank',
+    'Grace',
+    'Henry',
+    'Iris',
+    'Jack',
+  ]) {
+    await page.getByRole('button', { name: 'New Character', exact: true }).click();
+    await waitForModal(page, 'New Character');
+    await page.fill('.modal.show input[type="text"]', name);
+    await confirmModal(page);
+    await waitForModalClosed(page);
+  }
+  // 11 characters total (Hamlet + 10) — controls should now appear
+  await expect(page.locator('select#character-table-per-page')).toBeVisible();
+});
+
+test('rows per page selector has correct default', async () => {
+  await expect(page.locator('label[for="character-table-per-page"]')).toBeVisible();
+  await expect(page.locator('select#character-table-per-page')).toHaveValue('15');
+});
+
+test('rows per page selector has all expected options', async () => {
+  const options = await page
+    .locator('select#character-table-per-page')
+    .locator('option')
+    .allTextContents();
+  expect(options).toEqual(expect.arrayContaining(['10', '15', '25', '50', 'All']));
+});
+
+test('pagination nav shows when rows exceed per-page and hides on All', async () => {
+  // 11 rows, default perPage=15: nav hidden (11 ≤ 15)
+  await expect(page.locator('button[aria-controls="character-table"]').first()).not.toBeVisible();
+  // Change to 10 rows/page: nav appears (11 > 10)
+  await page.locator('select#character-table-per-page').selectOption('10');
+  await expect(page.locator('button[aria-controls="character-table"]').first()).toBeVisible();
+  // Select All: nav disappears
+  await page.locator('select#character-table-per-page').selectOption('0');
+  await expect(page.locator('button[aria-controls="character-table"]').first()).not.toBeVisible();
+  // Reset to default
+  await page.locator('select#character-table-per-page').selectOption('15');
+});
+
 // ── Character Merge ────────────────────────────────────────────────────────
 
 test('Merge button is visible for each character row', async () => {
diff --git a/client-v3/e2e/tests/10-show-config-script.spec.ts b/client-v3/e2e/tests/10-show-config-script.spec.ts
index b32cf7608..e2b92d04f 100644
--- a/client-v3/e2e/tests/10-show-config-script.spec.ts
+++ b/client-v3/e2e/tests/10-show-config-script.spec.ts
@@ -120,6 +120,73 @@ test('saves a dialogue line to the script', async () => {
   ).toBeVisible({ timeout: 10_000 });
 });
 
+// ── Cut mode ──────────────────────────────────────────────────────────────
+
+test('enters cut mode', async () => {
+  await page.goto(`${UI_BASE}/show-config/script`);
+  await waitForAppReady(page);
+  await page.click('button:has-text("Cuts")');
+  await expect(page.locator('button:has-text("Stop Editing")')).toBeVisible({ timeout: 10_000 });
+});
+
+test('dialogue line becomes clickable in cut mode', async () => {
+  await expect(
+    page.locator('a.viewable-line-cut').filter({ hasText: 'To be or not to be' })
+  ).toBeVisible({ timeout: 5_000 });
+});
+
+test('clicking a line toggles cut styling', async () => {
+  await page.locator('a.viewable-line-cut').filter({ hasText: 'To be or not to be' }).click();
+  await expect(
+    page.locator('.cut-line-part').filter({ hasText: 'To be or not to be' })
+  ).toBeVisible({ timeout: 3_000 });
+});
+
+test('saves cuts', async () => {
+  await page.getByRole('button', { name: 'Save', exact: true }).click();
+  await expect(page.locator('.v-toast__text').filter({ hasText: /saved/i })).toBeVisible({
+    timeout: 5_000,
+  });
+});
+
+test('stops cut mode without blank-page flash', async () => {
+  // In cut mode the line is an anchor (.viewable-line-cut); verify it exists before stopping
+  await expect(
+    page.locator('.viewable-line-cut').filter({ hasText: 'To be or not to be' })
+  ).toBeVisible();
+
+  await page.click('button:has-text("Stop Editing")');
+
+  // Edit button reappears
+  await expect(page.getByRole('button', { name: 'Edit', exact: true })).toBeVisible({
+    timeout: 10_000,
+  });
+  // The saved line is still visible (no reload / blank flash)
+  await expect(
+    page.locator('.viewable-line').filter({ hasText: 'To be or not to be' })
+  ).toBeVisible();
+  // No edit controls are shown after stopping
+  await expect(page.locator('.script-edit-controls')).not.toBeVisible();
+});
+
+test('cut styling persists after re-entering cut mode', async () => {
+  await page.click('button:has-text("Cuts")');
+  await expect(page.locator('button:has-text("Stop Editing")')).toBeVisible({ timeout: 10_000 });
+  await expect(
+    page.locator('.cut-line-part').filter({ hasText: 'To be or not to be' })
+  ).toBeVisible({ timeout: 5_000 });
+  // Clean up: un-cut the line so later tests start from a known state
+  await page.locator('a.viewable-line-cut').filter({ hasText: 'To be or not to be' }).click();
+  await page.getByRole('button', { name: 'Save', exact: true }).click();
+  await expect(page.locator('.v-toast__text').filter({ hasText: /saved/i })).toBeVisible({
+    timeout: 5_000,
+  });
+  await page.click('button:has-text("Stop Editing")');
+  await expect(page.getByRole('button', { name: 'Edit', exact: true })).toBeVisible({
+    timeout: 10_000,
+  });
+});
+
 // ── Stage Direction Styles ────────────────────────────────────────────────
 
 test('switches to Stage Direction Styles sub-tab', async () => {
diff --git a/client-v3/package-lock.json b/client-v3/package-lock.json
index 08f2ce7b0..69ae23544 100644
--- a/client-v3/package-lock.json
+++ b/client-v3/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "client-v3",
-  "version": "0.31.1",
+  "version": "0.31.2",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "client-v3",
-      "version": "0.31.1",
+      "version": "0.31.2",
       "dependencies": {
         "@vuelidate/core": "^2.0.3",
         "@vuelidate/validators": "^2.0.4",
diff --git a/client-v3/package.json b/client-v3/package.json
index c231186b5..fcda5dfa1 100644
--- a/client-v3/package.json
+++ b/client-v3/package.json
@@ -1,6 +1,6 @@
 {
   "name": "client-v3",
-  "version": "0.31.1",
+  "version": "0.31.2",
   "description": "DigiScript front end (Vue 3)",
   "author": "DreamTeamProd",
   "private": true,
diff --git a/client-v3/src/components/config/ConfigShows.vue b/client-v3/src/components/config/ConfigShows.vue
index 071be64ec..62ca7a9d9 100644
--- a/client-v3/src/components/config/ConfigShows.vue
+++ b/client-v3/src/components/config/ConfigShows.vue
@@ -7,7 +7,7 @@
             id="shows-table"
             :items="availableShows"
             :fields="showFields"
-            :per-page="rowsPerPage"
+            :per-page="perPage"
             :current-page="currentPage"
           >
             <template #head(btn)>
@@ -37,13 +37,11 @@
               </BButtonGroup>
             </template>
           </BTable>
-          <BPagination
-            v-show="availableShows.length > rowsPerPage"
-            v-model="currentPage"
+          <PaginationControls
+            v-model:per-page="perPage"
+            v-model:current-page="currentPage"
             :total-rows="availableShows.length"
-            :per-page="rowsPerPage"
             aria-controls="shows-table"
-            class="justify-content-center"
           />
         </BCol>
       </BRow>
@@ -129,6 +127,7 @@ import { makeURL } from '@/js/utils';
 import { useSystemStore } from '@/stores/system';
 import { useShowStore } from '@/stores/show';
 import { useConfirm } from '@/composables/useConfirm';
+import { usePagination } from '@/composables/usePagination';
 import { toast } from '@/js/toast';
 import type { Show } from '@/types/api/show';
 
@@ -144,8 +143,7 @@ const isSubmittingLoad = ref(false);
 const isSubmittingShow = ref(false);
 const isDeleting = ref(false);
 const deletingId = ref<number | null>(null);
-const currentPage = ref(1);
-const rowsPerPage = 15;
+const { perPage, currentPage } = usePagination();
 
 const showFields = [
   { key: 'id', label: 'ID' },
diff --git a/client-v3/src/components/config/ConfigSystem.vue b/client-v3/src/components/config/ConfigSystem.vue
index ae5e74134..ecdb107a7 100644
--- a/client-v3/src/components/config/ConfigSystem.vue
+++ b/client-v3/src/components/config/ConfigSystem.vue
@@ -73,12 +73,11 @@
         :current-page="currentPage"
         small
       />
-      <BPagination
-        v-model="currentPage"
+      <PaginationControls
+        v-model:per-page="perPage"
+        v-model:current-page="currentPage"
         :total-rows="connectedSessions.length"
-        :per-page="perPage"
         aria-controls="connected-clients-table"
-        class="justify-content-center"
       />
     </BModal>
   </div>
@@ -92,6 +91,7 @@ import { ref, computed, onMounted, onBeforeUnmount } from 'vue';
 import { storeToRefs } from 'pinia';
 import { BModal } from 'bootstrap-vue-next';
 import { useSystemStore } from '@/stores/system';
+import { usePagination } from '@/composables/usePagination';
 import { toast } from '@/js/toast';
 
 const systemStore = useSystemStore();
@@ -99,8 +99,7 @@ const { connectedSessions, versionStatus, serverInfo } = storeToRefs(systemStore
 
 const loading = ref(true);
 const isCheckingVersion = ref(false);
-const currentPage = ref(1);
-const perPage = 5;
+const { perPage, currentPage } = usePagination();
 const clientsModal = ref<InstanceType<typeof BModal>>();
 
 const clientFields = [
diff --git a/client-v3/src/components/shared/PaginationControls.vue b/client-v3/src/components/shared/PaginationControls.vue
new file mode 100644
index 000000000..1f37e7ca6
--- /dev/null
+++ b/client-v3/src/components/shared/PaginationControls.vue
@@ -0,0 +1,55 @@
+<template>
+  <div
+    v-if="totalRows > minPerPageOption"
+    class="d-flex align-items-center justify-content-center gap-3 mt-2 mb-3"
+  >
+    <div class="d-flex align-items-center gap-2">
+      <label class="mb-0 text-nowrap" :for="selectId">Rows per page</label>
+      <BFormSelect
+        :id="selectId"
+        v-model="perPage"
+        :options="PER_PAGE_OPTIONS"
+        size="sm"
+        style="width: auto"
+      />
+    </div>
+    <BPagination
+      v-show="perPage > 0 && totalRows > perPage"
+      v-model="currentPage"
+      :total-rows="totalRows"
+      :per-page="perPage"
+      :aria-controls="ariaControls"
+      class="mb-0"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed } from 'vue';
+import { PER_PAGE_OPTIONS } from '@/composables/usePagination';
+
+const props = withDefaults(
+  defineProps<{
+    totalRows: number;
+    ariaControls?: string;
+  }>(),
+  { ariaControls: undefined }
+);
+
+const perPage = defineModel<number>('perPage', { required: true });
+const currentPage = defineModel<number>('currentPage', { required: true });
+
+const selectId = computed(() =>
+  props.ariaControls ? `${props.ariaControls}-per-page` : 'per-page-select'
+);
+
+const minPerPageOption = Math.min(
+  ...PER_PAGE_OPTIONS.filter((o) => o.value > 0).map((o) => o.value)
+);
+</script>
+
+<style scoped>
+:deep(.pagination) {
+  margin-bottom: 0;
+}
+</style>
diff --git a/client-v3/src/components/show/config/acts_and_scenes/ConfigActs.vue b/client-v3/src/components/show/config/acts_and_scenes/ConfigActs.vue
index 850df7cba..9bb104c4c 100644
--- a/client-v3/src/components/show/config/acts_and_scenes/ConfigActs.vue
+++ b/client-v3/src/components/show/config/acts_and_scenes/ConfigActs.vue
@@ -4,7 +4,7 @@
       id="acts-table"
       :items="actTableItems"
       :fields="actFields"
-      :per-page="rowsPerPage"
+      :per-page="perPage"
       :current-page="currentPage"
       show-empty
     >
@@ -46,13 +46,11 @@
         </BButtonGroup>
       </template>
     </BTable>
-    <BPagination
-      v-show="actTableItems.length > rowsPerPage"
-      v-model="currentPage"
+    <PaginationControls
+      v-model:per-page="perPage"
+      v-model:current-page="currentPage"
       :total-rows="actTableItems.length"
-      :per-page="rowsPerPage"
       aria-controls="acts-table"
-      class="justify-content-center"
     />
 
     <BModal
@@ -136,6 +134,7 @@ import log from 'loglevel';
 import { useSystemStore } from '@/stores/system';
 import { useShowStore } from '@/stores/show';
 import { useConfirm } from '@/composables/useConfirm';
+import { usePagination } from '@/composables/usePagination';
 import type { Act } from '@/types/api/show';
 
 const systemStore = useSystemStore();
@@ -143,8 +142,7 @@ const showStore = useShowStore();
 const { confirm } = useConfirm();
 
 const loading = ref(true);
-const rowsPerPage = 15;
-const currentPage = ref(1);
+const { perPage, currentPage } = usePagination();
 const submittingNewAct = ref(false);
 const submittingEditAct = ref(false);
 const deletingAct = ref(false);
diff --git a/client-v3/src/components/show/config/acts_and_scenes/ConfigScenes.vue b/client-v3/src/components/show/config/acts_and_scenes/ConfigScenes.vue
index a23a89c93..1d7680ffd 100644
--- a/client-v3/src/components/show/config/acts_and_scenes/ConfigScenes.vue
+++ b/client-v3/src/components/show/config/acts_and_scenes/ConfigScenes.vue
@@ -6,7 +6,7 @@
           id="scene-table"
           :items="sceneTableItems"
           :fields="sceneFields"
-          :per-page="rowsPerPage"
+          :per-page="perPage"
           :current-page="currentPage"
           show-empty
         >
@@ -49,13 +49,11 @@
             </BButtonGroup>
           </template>
         </BTable>
-        <BPagination
-          v-show="sceneTableItems.length > rowsPerPage"
-          v-model="currentPage"
+        <PaginationControls
+          v-model:per-page="perPage"
+          v-model:current-page="currentPage"
           :total-rows="sceneTableItems.length"
-          :per-page="rowsPerPage"
           aria-controls="scene-table"
-          class="justify-content-center"
         />
       </BCol>
       <BCol cols="4">
@@ -200,6 +198,7 @@ import log from 'loglevel';
 import { useSystemStore } from '@/stores/system';
 import { useShowStore } from '@/stores/show';
 import { useConfirm } from '@/composables/useConfirm';
+import { usePagination } from '@/composables/usePagination';
 import type { Scene } from '@/types/api/show';
 
 const systemStore = useSystemStore();
@@ -207,8 +206,7 @@ const showStore = useShowStore();
 const { confirm } = useConfirm();
 
 const loading = ref(true);
-const rowsPerPage = 15;
-const currentPage = ref(1);
+const { perPage, currentPage } = usePagination();
 const submittingNewScene = ref(false);
 const submittingEditScene = ref(false);
 const submittingFirstScene = ref(false);
diff --git a/client-v3/src/components/show/config/characters/CharacterGroups.vue b/client-v3/src/components/show/config/characters/CharacterGroups.vue
index 848d12611..68a1f1956 100644
--- a/client-v3/src/components/show/config/characters/CharacterGroups.vue
+++ b/client-v3/src/components/show/config/characters/CharacterGroups.vue
@@ -4,7 +4,7 @@
       id="character-group-table"
       :items="showStore.characterGroupList"
       :fields="characterGroupFields"
-      :per-page="rowsPerPage"
+      :per-page="perPage"
       :current-page="currentPage"
       show-empty
     >
@@ -48,13 +48,11 @@
         </BButtonGroup>
       </template>
     </BTable>
-    <BPagination
-      v-show="showStore.characterGroupList.length > rowsPerPage"
-      v-model="currentPage"
+    <PaginationControls
+      v-model:per-page="perPage"
+      v-model:current-page="currentPage"
       :total-rows="showStore.characterGroupList.length"
-      :per-page="rowsPerPage"
       aria-controls="character-group-table"
-      class="justify-content-center"
     />
 
     <BModal
@@ -140,6 +138,7 @@ import log from 'loglevel';
 import { useSystemStore } from '@/stores/system';
 import { useShowStore } from '@/stores/show';
 import { useConfirm } from '@/composables/useConfirm';
+import { usePagination } from '@/composables/usePagination';
 import type { Character, CharacterGroup } from '@/types/api/show';
 
 const systemStore = useSystemStore();
@@ -147,8 +146,7 @@ const showStore = useShowStore();
 const { confirm } = useConfirm();
 
 const loading = ref(true);
-const rowsPerPage = 15;
-const currentPage = ref(1);
+const { perPage, currentPage } = usePagination();
 const submittingNewGroup = ref(false);
 const submittingEditGroup = ref(false);
 const deletingGroup = ref(false);
diff --git a/client-v3/src/components/show/config/mics/MicList.vue b/client-v3/src/components/show/config/mics/MicList.vue
index 9954daf78..005e886a1 100644
--- a/client-v3/src/components/show/config/mics/MicList.vue
+++ b/client-v3/src/components/show/config/mics/MicList.vue
@@ -5,7 +5,7 @@
         <BTable
           :items="showStore.microphones"
           :fields="fields"
-          :per-page="rowsPerPage"
+          :per-page="perPage"
           :current-page="currentPage"
           show-empty
         >
@@ -33,11 +33,10 @@
             </BButtonGroup>
           </template>
         </BTable>
-        <BPagination
-          v-if="showStore.microphones.length > rowsPerPage"
-          v-model="currentPage"
+        <PaginationControls
+          v-model:per-page="perPage"
+          v-model:current-page="currentPage"
           :total-rows="showStore.microphones.length"
-          :per-page="rowsPerPage"
         />
       </BCol>
     </BRow>
@@ -94,6 +93,7 @@ import { required, helpers } from '@vuelidate/validators';
 import { useShowStore } from '@/stores/show';
 import { useSystemStore } from '@/stores/system';
 import { useConfirm } from '@/composables/useConfirm';
+import { usePagination } from '@/composables/usePagination';
 import { useFormValidation } from '@/composables/useFormValidation';
 import type { Microphone } from '@/types/api/microphones';
 import log from 'loglevel';
@@ -103,8 +103,7 @@ const systemStore = useSystemStore();
 const { confirm } = useConfirm();
 const { validationState } = useFormValidation();
 
-const rowsPerPage = 15;
-const currentPage = ref(1);
+const { perPage, currentPage } = usePagination();
 const isSubmitting = ref(false);
 
 const newModal = ref<InstanceType<typeof BModal>>();
diff --git a/client-v3/src/components/show/config/script/ScriptEditor.vue b/client-v3/src/components/show/config/script/ScriptEditor.vue
index 44d98c963..ce862e05c 100644
--- a/client-v3/src/components/show/config/script/ScriptEditor.vue
+++ b/client-v3/src/components/show/config/script/ScriptEditor.vue
@@ -257,7 +257,7 @@ const isEditor = computed(
     wsStore.internalUUID !== null &&
     wsStore.internalUUID === scriptConfigStore.editStatus.currentEditor
 );
-const canEdit = computed(() => isEditor.value && !scriptConfigStore.cutMode);
+const canEdit = computed(() => isEditor.value);
 
 const saveProgressVariant = computed(() => {
   if (savingInProgress.value) return 'primary';
@@ -336,13 +336,20 @@ async function stopEditing(): Promise<void> {
     );
     if (!ok) return;
   }
+  const wasCutMode = scriptConfigStore.cutMode;
   editingLines.value.clear();
   exitBulkEditMode();
-  scriptConfigStore.emptyScript();
   linePartCuts.value = [...scriptStore.cuts];
-  sendObj({ OP: 'STOP_SCRIPT_EDIT', DATA: {} });
   scriptConfigStore.setCutMode(false);
-  await loadPage(currentPage.value);
+  scriptConfigStore.setEditStatus({
+    canRequestEdit: scriptConfigStore.editStatus.canRequestEdit,
+    currentEditor: null,
+  });
+  sendObj({ OP: 'STOP_SCRIPT_EDIT', DATA: {} });
+  if (!wasCutMode) {
+    scriptConfigStore.emptyScript();
+    await loadPage(currentPage.value);
+  }
 }
 
 async function loadPage(page: number): Promise<void> {
diff --git a/client-v3/src/components/show/config/script/ScriptLineViewer.vue b/client-v3/src/components/show/config/script/ScriptLineViewer.vue
index 5c3c6c0e1..6bf13b507 100644
--- a/client-v3/src/components/show/config/script/ScriptLineViewer.vue
+++ b/client-v3/src/components/show/config/script/ScriptLineViewer.vue
@@ -1,5 +1,6 @@
 <template>
   <BRow
+    class="script-line-row"
     :class="{
       'stage-direction': line.line_type === LINE_TYPES.STAGE_DIRECTION,
       'heading-padding': line.line_type === LINE_TYPES.DIALOGUE && needsHeadingsAll,
@@ -121,7 +122,7 @@
           End
         </BButton>
       </BButtonGroup>
-      <BButtonGroup v-else-if="canEdit && !isCutMode">
+      <BButtonGroup v-else-if="canEdit && !isCutMode" class="script-edit-controls">
         <BButton variant="link" style="padding: 0" @click.prevent.stop="$emit('editLine')"
           >Edit</BButton
         >
@@ -305,4 +306,9 @@ function cutLinePart(partIndex: number): void {
 .cut-line-part {
   text-decoration: line-through;
 }
+.script-line-row:has(.script-edit-controls:hover) {
+  background-color: rgba(255, 255, 255, 0.06);
+  border-radius: 4px;
+  transition: background-color 0.15s ease;
+}
 </style>
diff --git a/client-v3/src/components/show/config/script/StageDirectionStyles.vue b/client-v3/src/components/show/config/script/StageDirectionStyles.vue
index 7f04c92e7..a23180d72 100644
--- a/client-v3/src/components/show/config/script/StageDirectionStyles.vue
+++ b/client-v3/src/components/show/config/script/StageDirectionStyles.vue
@@ -5,7 +5,7 @@
         <BTable
           :items="scriptStore.stageDirectionStyles"
           :fields="columns"
-          :per-page="rowsPerPage"
+          :per-page="perPage"
           :current-page="currentPage"
           show-empty
         >
@@ -53,11 +53,10 @@
             </BButtonGroup>
           </template>
         </BTable>
-        <BPagination
-          v-if="scriptStore.stageDirectionStyles.length > rowsPerPage"
-          v-model="currentPage"
+        <PaginationControls
+          v-model:per-page="perPage"
+          v-model:current-page="currentPage"
           :total-rows="scriptStore.stageDirectionStyles.length"
-          :per-page="rowsPerPage"
         />
       </BCol>
     </BRow>
@@ -147,6 +146,7 @@ import log from 'loglevel';
 import { useScriptStore } from '@/stores/script';
 import { useSystemStore } from '@/stores/system';
 import { useConfirm } from '@/composables/useConfirm';
+import { usePagination } from '@/composables/usePagination';
 import { useFormValidation } from '@/composables/useFormValidation';
 import type { StageDirectionStyle } from '@/types/api/script';
 import { toast } from '@/js/toast';
@@ -156,8 +156,7 @@ const systemStore = useSystemStore();
 const { confirm } = useConfirm();
 const { validationState } = useFormValidation();
 
-const rowsPerPage = 15;
-const currentPage = ref(1);
+const { perPage, currentPage } = usePagination();
 const isSubmittingNew = ref(false);
 const isSubmittingEdit = ref(false);
 const isDeleting = ref(false);
diff --git a/client-v3/src/components/show/config/sessions/SessionTagList.vue b/client-v3/src/components/show/config/sessions/SessionTagList.vue
index 40a43ad20..a0e6b34b6 100644
--- a/client-v3/src/components/show/config/sessions/SessionTagList.vue
+++ b/client-v3/src/components/show/config/sessions/SessionTagList.vue
@@ -4,7 +4,7 @@
       id="session-tags-table"
       :items="showStore.sessionTags"
       :fields="tagFields"
-      :per-page="rowsPerPage"
+      :per-page="perPage"
       :current-page="currentPage"
       show-empty
     >
@@ -39,13 +39,11 @@
         </BButtonGroup>
       </template>
     </BTable>
-    <BPagination
-      v-show="showStore.sessionTags.length > rowsPerPage"
-      v-model="currentPage"
+    <PaginationControls
+      v-model:per-page="perPage"
+      v-model:current-page="currentPage"
       :total-rows="showStore.sessionTags.length"
-      :per-page="rowsPerPage"
       aria-controls="session-tags-table"
-      class="justify-content-center"
     />
 
     <BModal
@@ -198,14 +196,14 @@ import log from 'loglevel';
 import { useSystemStore } from '@/stores/system';
 import { useShowStore } from '@/stores/show';
 import { useConfirm } from '@/composables/useConfirm';
+import { usePagination } from '@/composables/usePagination';
 import type { SessionTag } from '@/types/api/session';
 
 const systemStore = useSystemStore();
 const showStore = useShowStore();
 const { confirm } = useConfirm();
 
-const rowsPerPage = 15;
-const currentPage = ref(1);
+const { perPage, currentPage } = usePagination();
 const isSubmittingNewTag = ref(false);
 const isSubmittingEditTag = ref(false);
 const isSubmittingDeleteTag = ref(false);
diff --git a/client-v3/src/components/show/config/stage/CrewList.vue b/client-v3/src/components/show/config/stage/CrewList.vue
index 7efd97f6f..b1be46b3d 100644
--- a/client-v3/src/components/show/config/stage/CrewList.vue
+++ b/client-v3/src/components/show/config/stage/CrewList.vue
@@ -5,7 +5,7 @@
         <BTable
           :items="stageStore.crewList"
           :fields="fields"
-          :per-page="rowsPerPage"
+          :per-page="perPage"
           :current-page="currentPage"
           show-empty
         >
@@ -29,11 +29,10 @@
             </BButtonGroup>
           </template>
         </BTable>
-        <BPagination
-          v-if="stageStore.crewList.length > rowsPerPage"
-          v-model="currentPage"
+        <PaginationControls
+          v-model:per-page="perPage"
+          v-model:current-page="currentPage"
           :total-rows="stageStore.crewList.length"
-          :per-page="rowsPerPage"
         />
       </BCol>
     </BRow>
@@ -102,6 +101,7 @@ import { required } from '@vuelidate/validators';
 import { useStageStore } from '@/stores/stage';
 import { useSystemStore } from '@/stores/system';
 import { useConfirm } from '@/composables/useConfirm';
+import { usePagination } from '@/composables/usePagination';
 import { useFormValidation } from '@/composables/useFormValidation';
 import type { Crew } from '@/types/api/stage';
 import log from 'loglevel';
@@ -111,8 +111,7 @@ const systemStore = useSystemStore();
 const { confirm } = useConfirm();
 const { validationState } = useFormValidation();
 
-const rowsPerPage = 15;
-const currentPage = ref(1);
+const { perPage, currentPage } = usePagination();
 const isSubmitting = ref(false);
 
 const newModal = ref<InstanceType<typeof BModal>>();
diff --git a/client-v3/src/components/show/config/stage/PropsList.vue b/client-v3/src/components/show/config/stage/PropsList.vue
index 3eec6db21..7e65e62a3 100644
--- a/client-v3/src/components/show/config/stage/PropsList.vue
+++ b/client-v3/src/components/show/config/stage/PropsList.vue
@@ -6,7 +6,7 @@
         <BTable
           :items="stageStore.propTypes"
           :fields="propTypeFields"
-          :per-page="rowsPerPage"
+          :per-page="propTypesPerPage"
           :current-page="currentPropTypesPage"
           show-empty
         >
@@ -38,11 +38,10 @@
             </BButtonGroup>
           </template>
         </BTable>
-        <BPagination
-          v-if="stageStore.propTypes.length > rowsPerPage"
-          v-model="currentPropTypesPage"
+        <PaginationControls
+          v-model:per-page="propTypesPerPage"
+          v-model:current-page="currentPropTypesPage"
           :total-rows="stageStore.propTypes.length"
-          :per-page="rowsPerPage"
         />
       </BCol>
       <BCol cols="7">
@@ -50,7 +49,7 @@
         <BTable
           :items="stageStore.propsList"
           :fields="propsFields"
-          :per-page="rowsPerPage"
+          :per-page="propsPerPage"
           :current-page="currentPropsPage"
           show-empty
         >
@@ -81,11 +80,10 @@
             </BButtonGroup>
           </template>
         </BTable>
-        <BPagination
-          v-if="stageStore.propsList.length > rowsPerPage"
-          v-model="currentPropsPage"
+        <PaginationControls
+          v-model:per-page="propsPerPage"
+          v-model:current-page="currentPropsPage"
           :total-rows="stageStore.propsList.length"
-          :per-page="rowsPerPage"
         />
       </BCol>
     </BRow>
@@ -212,6 +210,7 @@ import { required, helpers } from '@vuelidate/validators';
 import { useStageStore } from '@/stores/stage';
 import { useSystemStore } from '@/stores/system';
 import { useConfirm } from '@/composables/useConfirm';
+import { usePagination } from '@/composables/usePagination';
 import { useFormValidation } from '@/composables/useFormValidation';
 import type { PropType, Props } from '@/types/api/stage';
 import log from 'loglevel';
@@ -221,9 +220,8 @@ const systemStore = useSystemStore();
 const { confirm } = useConfirm();
 const { validationState } = useFormValidation();
 
-const rowsPerPage = 15;
-const currentPropTypesPage = ref(1);
-const currentPropsPage = ref(1);
+const { perPage: propTypesPerPage, currentPage: currentPropTypesPage } = usePagination();
+const { perPage: propsPerPage, currentPage: currentPropsPage } = usePagination();
 const isSubmitting = ref(false);
 
 const newPropTypeModal = ref<InstanceType<typeof BModal>>();
diff --git a/client-v3/src/components/show/config/stage/SceneryList.vue b/client-v3/src/components/show/config/stage/SceneryList.vue
index 272d6cf2f..bad527bb5 100644
--- a/client-v3/src/components/show/config/stage/SceneryList.vue
+++ b/client-v3/src/components/show/config/stage/SceneryList.vue
@@ -6,7 +6,7 @@
         <BTable
           :items="stageStore.sceneryTypes"
           :fields="sceneryTypeFields"
-          :per-page="rowsPerPage"
+          :per-page="sceneryTypesPerPage"
           :current-page="currentSceneryTypesPage"
           show-empty
         >
@@ -38,11 +38,10 @@
             </BButtonGroup>
           </template>
         </BTable>
-        <BPagination
-          v-if="stageStore.sceneryTypes.length > rowsPerPage"
-          v-model="currentSceneryTypesPage"
+        <PaginationControls
+          v-model:per-page="sceneryTypesPerPage"
+          v-model:current-page="currentSceneryTypesPage"
           :total-rows="stageStore.sceneryTypes.length"
-          :per-page="rowsPerPage"
         />
       </BCol>
       <BCol cols="7">
@@ -50,7 +49,7 @@
         <BTable
           :items="stageStore.sceneryList"
           :fields="sceneryFields"
-          :per-page="rowsPerPage"
+          :per-page="sceneryPerPage"
           :current-page="currentSceneryPage"
           show-empty
         >
@@ -85,11 +84,10 @@
             </BButtonGroup>
           </template>
         </BTable>
-        <BPagination
-          v-if="stageStore.sceneryList.length > rowsPerPage"
-          v-model="currentSceneryPage"
+        <PaginationControls
+          v-model:per-page="sceneryPerPage"
+          v-model:current-page="currentSceneryPage"
           :total-rows="stageStore.sceneryList.length"
-          :per-page="rowsPerPage"
         />
       </BCol>
     </BRow>
@@ -214,6 +212,7 @@ import { required, helpers } from '@vuelidate/validators';
 import { useStageStore } from '@/stores/stage';
 import { useSystemStore } from '@/stores/system';
 import { useConfirm } from '@/composables/useConfirm';
+import { usePagination } from '@/composables/usePagination';
 import { useFormValidation } from '@/composables/useFormValidation';
 import type { SceneryType, Scenery } from '@/types/api/stage';
 import log from 'loglevel';
@@ -223,9 +222,8 @@ const systemStore = useSystemStore();
 const { confirm } = useConfirm();
 const { validationState } = useFormValidation();
 
-const rowsPerPage = 15;
-const currentSceneryTypesPage = ref(1);
-const currentSceneryPage = ref(1);
+const { perPage: sceneryTypesPerPage, currentPage: currentSceneryTypesPage } = usePagination();
+const { perPage: sceneryPerPage, currentPage: currentSceneryPage } = usePagination();
 const isSubmitting = ref(false);
 
 const newSceneryTypeModal = ref<InstanceType<typeof BModal>>();
diff --git a/client-v3/src/components/show/config/stage/StageManager.vue b/client-v3/src/components/show/config/stage/StageManager.vue
index d5e6f61a7..cbd298eda 100644
--- a/client-v3/src/components/show/config/stage/StageManager.vue
+++ b/client-v3/src/components/show/config/stage/StageManager.vue
@@ -65,7 +65,7 @@
                 <BTable
                   :items="currentSceneSceneryAllocations"
                   :fields="sceneryAllocFields"
-                  :per-page="rowsPerPage"
+                  :per-page="sceneryAllocPerPage"
                   :current-page="currentSceneryAllocPage"
                   show-empty
                   empty-text="No scenery allocated to this scene"
@@ -86,11 +86,10 @@
                     </BButton>
                   </template>
                 </BTable>
-                <BPagination
-                  v-if="currentSceneSceneryAllocations.length > rowsPerPage"
-                  v-model="currentSceneryAllocPage"
+                <PaginationControls
+                  v-model:per-page="sceneryAllocPerPage"
+                  v-model:current-page="currentSceneryAllocPage"
                   :total-rows="currentSceneSceneryAllocations.length"
-                  :per-page="rowsPerPage"
                 />
               </BCol>
               <BCol cols="6">
@@ -98,7 +97,7 @@
                 <BTable
                   :items="currentScenePropsAllocations"
                   :fields="propsAllocFields"
-                  :per-page="rowsPerPage"
+                  :per-page="propsAllocPerPage"
                   :current-page="currentPropsAllocPage"
                   show-empty
                   empty-text="No props allocated to this scene"
@@ -119,11 +118,10 @@
                     </BButton>
                   </template>
                 </BTable>
-                <BPagination
-                  v-if="currentScenePropsAllocations.length > rowsPerPage"
-                  v-model="currentPropsAllocPage"
+                <PaginationControls
+                  v-model:per-page="propsAllocPerPage"
+                  v-model:current-page="currentPropsAllocPage"
                   :total-rows="currentScenePropsAllocations.length"
-                  :per-page="rowsPerPage"
                 />
               </BCol>
             </BRow>
@@ -433,6 +431,7 @@ import { required, helpers } from '@vuelidate/validators';
 import { useStageStore } from '@/stores/stage';
 import { useShowStore } from '@/stores/show';
 import { useConfirm } from '@/composables/useConfirm';
+import { usePagination } from '@/composables/usePagination';
 import { useFormValidation } from '@/composables/useFormValidation';
 import { findOrphanedAssignments } from '@/js/blockOrphanUtils';
 import type { SceneryAllocation, PropsAllocation, CrewAssignment, Crew } from '@/types/api/stage';
@@ -451,9 +450,8 @@ const setExpanded = ref(false);
 const strikeExpanded = ref(false);
 const savingAssignment = ref(false);
 const newCrewSelections = ref<Record<string, number | null>>({});
-const rowsPerPage = 10;
-const currentSceneryAllocPage = ref(1);
-const currentPropsAllocPage = ref(1);
+const { perPage: sceneryAllocPerPage, currentPage: currentSceneryAllocPage } = usePagination();
+const { perPage: propsAllocPerPage, currentPage: currentPropsAllocPage } = usePagination();
 
 const goToSceneModal = ref<InstanceType<typeof BModal>>();
 const addSceneryModal = ref<InstanceType<typeof BModal>>();
diff --git a/client-v3/src/components/user/settings/CueColourPreferences.vue b/client-v3/src/components/user/settings/CueColourPreferences.vue
index d53841c99..8b36b354c 100644
--- a/client-v3/src/components/user/settings/CueColourPreferences.vue
+++ b/client-v3/src/components/user/settings/CueColourPreferences.vue
@@ -5,7 +5,7 @@
         id="cue-colour-table"
         :items="tableData"
         :fields="columns"
-        :per-page="rowsPerPage"
+        :per-page="perPage"
         :current-page="currentPage"
         show-empty
       >
@@ -54,6 +54,12 @@
           </BButtonGroup>
         </template>
       </BTable>
+      <PaginationControls
+        v-model:per-page="perPage"
+        v-model:current-page="currentPage"
+        :total-rows="tableData.length"
+        aria-controls="cue-colour-table"
+      />
     </template>
     <BAlert v-else :model-value="true" variant="danger">No show loaded.</BAlert>
 
@@ -169,6 +175,7 @@ import log from 'loglevel';
 import { useUserStore } from '@/stores/user';
 import { useSystemStore } from '@/stores/system';
 import { useFormValidation } from '@/composables/useFormValidation';
+import { usePagination } from '@/composables/usePagination';
 import type { CueType } from '@/types/api/cues';
 
 const userStore = useUserStore();
@@ -180,8 +187,7 @@ const columns = [
   { key: 'example', label: 'Example Cue Button' },
   { key: 'btn', label: '' },
 ];
-const rowsPerPage = 15;
-const currentPage = ref(1);
+const { perPage, currentPage } = usePagination();
 
 const cueTypes = ref<CueType[]>([]);
 const isSubmittingNew = ref(false);
diff --git a/client-v3/src/components/user/settings/StageDirectionStyles.vue b/client-v3/src/components/user/settings/StageDirectionStyles.vue
index 31d6ffbfb..a0bcc42ba 100644
--- a/client-v3/src/components/user/settings/StageDirectionStyles.vue
+++ b/client-v3/src/components/user/settings/StageDirectionStyles.vue
@@ -5,7 +5,7 @@
         id="stage-directions-table"
         :items="tableData"
         :fields="columns"
-        :per-page="rowsPerPage"
+        :per-page="perPage"
         :current-page="currentPage"
         show-empty
       >
@@ -54,6 +54,12 @@
           </BButtonGroup>
         </template>
       </BTable>
+      <PaginationControls
+        v-model:per-page="perPage"
+        v-model:current-page="currentPage"
+        :total-rows="tableData.length"
+        aria-controls="stage-directions-table"
+      />
     </template>
     <BAlert v-else :model-value="true" variant="danger">No show loaded.</BAlert>
 
@@ -243,6 +249,7 @@ import { makeURL } from '@/js/utils';
 import { useUserStore } from '@/stores/user';
 import { useSystemStore } from '@/stores/system';
 import { useFormValidation } from '@/composables/useFormValidation';
+import { usePagination } from '@/composables/usePagination';
 import type { StageDirectionStyle } from '@/types/api/script';
 
 interface StyleOption {
@@ -266,8 +273,7 @@ const columns = [
   { key: 'example', label: 'Example Stage Direction' },
   { key: 'btn', label: '' },
 ];
-const rowsPerPage = 15;
-const currentPage = ref(1);
+const { perPage, currentPage } = usePagination();
 
 const stageDirectionStyles = ref<StageDirectionStyle[]>([]);
 const isSubmittingNew = ref(false);
diff --git a/client-v3/src/composables/usePagination.ts b/client-v3/src/composables/usePagination.ts
new file mode 100644
index 000000000..4a6e1ca30
--- /dev/null
+++ b/client-v3/src/composables/usePagination.ts
@@ -0,0 +1,20 @@
+import { ref, watch } from 'vue';
+
+export const PER_PAGE_OPTIONS = [
+  { value: 10, text: '10' },
+  { value: 15, text: '15' },
+  { value: 25, text: '25' },
+  { value: 50, text: '50' },
+  { value: 0, text: 'All' },
+] as const;
+
+export function usePagination(defaultPerPage = 15) {
+  const perPage = ref(defaultPerPage);
+  const currentPage = ref(1);
+
+  watch(perPage, () => {
+    currentPage.value = 1;
+  });
+
+  return { perPage, currentPage };
+}
diff --git a/client-v3/src/views/show/config/ConfigCast.vue b/client-v3/src/views/show/config/ConfigCast.vue
index accb669c4..d3bc61316 100644
--- a/client-v3/src/views/show/config/ConfigCast.vue
+++ b/client-v3/src/views/show/config/ConfigCast.vue
@@ -8,7 +8,7 @@
               id="cast-table"
               :items="showStore.castList"
               :fields="castFields"
-              :per-page="rowsPerPage"
+              :per-page="perPage"
               :current-page="currentPage"
               show-empty
             >
@@ -40,13 +40,11 @@
                 </BButtonGroup>
               </template>
             </BTable>
-            <BPagination
-              v-show="showStore.castList.length > rowsPerPage"
-              v-model="currentPage"
+            <PaginationControls
+              v-model:per-page="perPage"
+              v-model:current-page="currentPage"
               :total-rows="showStore.castList.length"
-              :per-page="rowsPerPage"
               aria-controls="cast-table"
-              class="justify-content-center"
             />
           </BTab>
           <BTab title="Line Counts">
@@ -126,6 +124,7 @@ import log from 'loglevel';
 import { useSystemStore } from '@/stores/system';
 import { useShowStore } from '@/stores/show';
 import { useConfirm } from '@/composables/useConfirm';
+import { usePagination } from '@/composables/usePagination';
 import CastLineStats from '@/components/show/config/cast/CastLineStats.vue';
 import type { Cast } from '@/types/api/show';
 
@@ -133,8 +132,7 @@ const systemStore = useSystemStore();
 const showStore = useShowStore();
 const { confirm } = useConfirm();
 
-const rowsPerPage = 15;
-const currentPage = ref(1);
+const { perPage, currentPage } = usePagination();
 const submittingNewCast = ref(false);
 const submittingEditCast = ref(false);
 const deletingCast = ref(false);
diff --git a/client-v3/src/views/show/config/ConfigCharacters.vue b/client-v3/src/views/show/config/ConfigCharacters.vue
index 41c9ddc00..b72a6b604 100644
--- a/client-v3/src/views/show/config/ConfigCharacters.vue
+++ b/client-v3/src/views/show/config/ConfigCharacters.vue
@@ -8,7 +8,7 @@
               id="character-table"
               :items="showStore.characterList"
               :fields="characterFields"
-              :per-page="rowsPerPage"
+              :per-page="perPage"
               :current-page="currentPage"
               show-empty
             >
@@ -55,13 +55,11 @@
                 </BButtonGroup>
               </template>
             </BTable>
-            <BPagination
-              v-show="showStore.characterList.length > rowsPerPage"
-              v-model="currentPage"
+            <PaginationControls
+              v-model:per-page="perPage"
+              v-model:current-page="currentPage"
               :total-rows="showStore.characterList.length"
-              :per-page="rowsPerPage"
               aria-controls="character-table"
-              class="justify-content-center"
             />
           </BTab>
           <BTab title="Character Groups">
@@ -180,6 +178,7 @@ import 'vue-multiselect/dist/vue-multiselect.css';
 import { useSystemStore } from '@/stores/system';
 import { useShowStore } from '@/stores/show';
 import { useConfirm } from '@/composables/useConfirm';
+import { usePagination } from '@/composables/usePagination';
 import CharacterGroups from '@/components/show/config/characters/CharacterGroups.vue';
 import CharacterLineStats from '@/components/show/config/characters/CharacterLineStats.vue';
 import type { Character } from '@/types/api/show';
@@ -188,8 +187,7 @@ const systemStore = useSystemStore();
 const showStore = useShowStore();
 const { confirm } = useConfirm();
 
-const rowsPerPage = 15;
-const currentPage = ref(1);
+const { perPage, currentPage } = usePagination();
 const submittingNewCharacter = ref(false);
 const submittingEditCharacter = ref(false);
 const deletingCharacter = ref(false);
diff --git a/client-v3/src/views/show/config/ConfigCues.vue b/client-v3/src/views/show/config/ConfigCues.vue
index 9326a1e2c..9958698f9 100644
--- a/client-v3/src/views/show/config/ConfigCues.vue
+++ b/client-v3/src/views/show/config/ConfigCues.vue
@@ -8,7 +8,7 @@
               id="cue-types-table"
               :items="showStore.cueTypes"
               :fields="cueTypeFields"
-              :per-page="rowsPerPage"
+              :per-page="perPage"
               :current-page="currentPage"
               show-empty
             >
@@ -50,13 +50,11 @@
                 </BButtonGroup>
               </template>
             </BTable>
-            <BPagination
-              v-show="showStore.cueTypes.length > rowsPerPage"
-              v-model="currentPage"
+            <PaginationControls
+              v-model:per-page="perPage"
+              v-model:current-page="currentPage"
               :total-rows="showStore.cueTypes.length"
-              :per-page="rowsPerPage"
               aria-controls="cue-types-table"
-              class="justify-content-center"
             />
           </BTab>
           <BTab title="Cue Configuration">
@@ -221,6 +219,7 @@ import log from 'loglevel';
 import { useSystemStore } from '@/stores/system';
 import { useShowStore } from '@/stores/show';
 import { useConfirm } from '@/composables/useConfirm';
+import { usePagination } from '@/composables/usePagination';
 import CueCountStats from '@/components/show/config/cues/CueCountStats.vue';
 import CueEditor from '@/components/show/config/cues/CueEditor.vue';
 import type { CueType } from '@/types/api/cues';
@@ -229,8 +228,7 @@ const systemStore = useSystemStore();
 const showStore = useShowStore();
 const { confirm } = useConfirm();
 
-const rowsPerPage = 15;
-const currentPage = ref(1);
+const { perPage, currentPage } = usePagination();
 const submittingNewCueType = ref(false);
 const submittingEditCueType = ref(false);
 const deletingCueType = ref(false);
diff --git a/client/package-lock.json b/client/package-lock.json
index d5d4110f0..259c91dc2 100644
--- a/client/package-lock.json
+++ b/client/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "client",
-  "version": "0.31.1",
+  "version": "0.31.2",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "client",
-      "version": "0.31.1",
+      "version": "0.31.2",
       "dependencies": {
         "bootstrap": "4.6.2",
         "bootstrap-vue": "2.23.1",
diff --git a/client/package.json b/client/package.json
index 015d1bd52..2152dd630 100644
--- a/client/package.json
+++ b/client/package.json
@@ -1,6 +1,6 @@
 {
   "name": "client",
-  "version": "0.31.1",
+  "version": "0.31.2",
   "description": "DigiScript front end",
   "author": "DreamTeamProd",
   "private": true,
diff --git a/client/src/main.ts b/client/src/main.ts
index c322f39ad..a20913a7e 100644
--- a/client/src/main.ts
+++ b/client/src/main.ts
@@ -6,6 +6,7 @@ import Vuelidate from 'vuelidate';
 import ToastPlugin from 'vue-toast-notification';
 import Multiselect from 'vue-multiselect';
 import { Splitpanes, Pane } from 'splitpanes';
+import PaginationControls from '@/vue_components/shared/PaginationControls.vue';
 
 import store from '@/store/store';
 import App from './App.vue';
@@ -30,6 +31,7 @@ Vue.use(IconsPlugin);
 Vue.component('MultiSelect', Multiselect);
 Vue.component('SplitPanes', Splitpanes);
 Vue.component('SplitPane', Pane);
+Vue.component('PaginationControls', PaginationControls);
 
 Vue.use(Vuex);
 Vue.use(Vuelidate as any); // @types/vuelidate bundles its own Vue copy that conflicts with main package
diff --git a/client/src/mixins/paginationMixin.ts b/client/src/mixins/paginationMixin.ts
new file mode 100644
index 000000000..3ffd58a35
--- /dev/null
+++ b/client/src/mixins/paginationMixin.ts
@@ -0,0 +1,15 @@
+import { defineComponent } from 'vue';
+
+export default defineComponent({
+  data() {
+    return {
+      rowsPerPage: 15 as number,
+      currentPage: 1 as number,
+    };
+  },
+  watch: {
+    rowsPerPage(this: { currentPage: number }) {
+      this.currentPage = 1;
+    },
+  },
+});
diff --git a/client/src/views/show/config/ConfigCast.vue b/client/src/views/show/config/ConfigCast.vue
index b607f3616..e03a2fae6 100644
--- a/client/src/views/show/config/ConfigCast.vue
+++ b/client/src/views/show/config/ConfigCast.vue
@@ -36,13 +36,11 @@
                 </b-button-group>
               </template>
             </b-table>
-            <b-pagination
-              v-show="CAST_LIST.length > rowsPerPage"
-              v-model="currentPage"
+            <pagination-controls
+              :per-page.sync="rowsPerPage"
+              :current-page.sync="currentPage"
               :total-rows="CAST_LIST.length"
-              :per-page="rowsPerPage"
               aria-controls="cast-table"
-              class="justify-content-center"
             />
           </b-tab>
           <b-tab title="Line Counts">
@@ -150,11 +148,12 @@ import { mapGetters, mapActions } from 'vuex';
 import CastLineStats from '@/vue_components/show/config/cast/CastLineStats.vue';
 import log from 'loglevel';
 import formValidationMixin from '@/mixins/formValidationMixin';
+import paginationMixin from '@/mixins/paginationMixin';
 
 export default defineComponent({
   name: 'ConfigCast',
   components: { CastLineStats },
-  mixins: [formValidationMixin],
+  mixins: [formValidationMixin, paginationMixin],
   data() {
     return {
       castFields: ['first_name', 'last_name', { key: 'btn', label: '' }],
@@ -162,8 +161,6 @@ export default defineComponent({
         firstName: '',
         lastName: '',
       },
-      rowsPerPage: 15,
-      currentPage: 1,
       editFormState: {
         id: null as number | null,
         showID: null as number | null,
diff --git a/client/src/views/show/config/ConfigCharacters.vue b/client/src/views/show/config/ConfigCharacters.vue
index 5c949575d..0e846fa1a 100644
--- a/client/src/views/show/config/ConfigCharacters.vue
+++ b/client/src/views/show/config/ConfigCharacters.vue
@@ -51,13 +51,11 @@
                 </b-button-group>
               </template>
             </b-table>
-            <b-pagination
-              v-show="CHARACTER_LIST.length > rowsPerPage"
-              v-model="currentPage"
+            <pagination-controls
+              :per-page.sync="rowsPerPage"
+              :current-page.sync="currentPage"
               :total-rows="CHARACTER_LIST.length"
-              :per-page="rowsPerPage"
               aria-controls="character-table"
-              class="justify-content-center"
             />
           </b-tab>
           <b-tab title="Character Groups">
@@ -207,15 +205,14 @@ import CharacterTimeline from '@/vue_components/show/config/characters/Character
 import log from 'loglevel';
 import CharacterGroups from '@/vue_components/show/config/characters/CharacterGroups.vue';
 import formValidationMixin from '@/mixins/formValidationMixin';
+import paginationMixin from '@/mixins/paginationMixin';
 
 export default defineComponent({
   name: 'ConfigCharacters',
   components: { CharacterGroups, CharacterLineStats, CharacterTimeline },
-  mixins: [formValidationMixin],
+  mixins: [formValidationMixin, paginationMixin],
   data() {
     return {
-      rowsPerPage: 15,
-      currentPage: 1,
       characterFields: [
         'name',
         'description',
diff --git a/client/src/views/show/config/ConfigCues.vue b/client/src/views/show/config/ConfigCues.vue
index e7b3ccc09..1879e4ccc 100644
--- a/client/src/views/show/config/ConfigCues.vue
+++ b/client/src/views/show/config/ConfigCues.vue
@@ -49,13 +49,11 @@
                 </b-button-group>
               </template>
             </b-table>
-            <b-pagination
-              v-show="CUE_TYPES.length > rowsPerPage"
-              v-model="currentPage"
+            <pagination-controls
+              :per-page.sync="rowsPerPage"
+              :current-page.sync="currentPage"
               :total-rows="CUE_TYPES.length"
-              :per-page="rowsPerPage"
               aria-controls="cue-types-table"
-              class="justify-content-center"
             />
           </b-tab>
           <b-tab title="Cue Configuration">
@@ -228,18 +226,17 @@ import { defineComponent } from 'vue';
 import { required, maxLength } from 'vuelidate/lib/validators';
 import { mapGetters, mapActions } from 'vuex';
 import log from 'loglevel';
-
+import paginationMixin from '@/mixins/paginationMixin';
 import CueEditor from '@/vue_components/show/config/cues/CueEditor.vue';
 import CueCountStats from '@/vue_components/show/config/cues/CueCountStats.vue';
 
 export default defineComponent({
   name: 'ConfigCues',
   components: { CueCountStats, CueEditor },
+  mixins: [paginationMixin],
   data() {
     return {
       cueTypeFields: ['prefix', 'description', 'colour', { key: 'btn', label: '' }],
-      rowsPerPage: 15,
-      currentPage: 1,
       newCueTypeForm: {
         prefix: '',
         description: '',
diff --git a/client/src/vue_components/config/ConfigShows.vue b/client/src/vue_components/config/ConfigShows.vue
index fd787b518..775ee5135 100644
--- a/client/src/vue_components/config/ConfigShows.vue
+++ b/client/src/vue_components/config/ConfigShows.vue
@@ -42,13 +42,11 @@
               </b-button-group>
             </template>
           </b-table>
-          <b-pagination
-            v-show="AVAILABLE_SHOWS.length > rowsPerPage"
-            v-model="currentPage"
+          <pagination-controls
+            :per-page.sync="rowsPerPage"
+            :current-page.sync="currentPage"
             :total-rows="AVAILABLE_SHOWS.length"
-            :per-page="rowsPerPage"
             aria-controls="shows-table"
-            class="justify-content-center"
           />
         </b-col>
       </b-row>
@@ -152,9 +150,11 @@ import { required, maxLength } from 'vuelidate/lib/validators';
 import { mapGetters, mapActions } from 'vuex';
 import { makeURL } from '@/js/utils';
 import log from 'loglevel';
+import paginationMixin from '@/mixins/paginationMixin';
 
 export default defineComponent({
   name: 'ConfigShows',
+  mixins: [paginationMixin],
   data() {
     return {
       loaded: false,
@@ -166,8 +166,6 @@ export default defineComponent({
         'created_at',
         { key: 'btn', label: '' },
       ],
-      rowsPerPage: 15,
-      currentPage: 1,
       isSubmittingLoad: false,
       isSubmittingShow: false,
       isDeleting: false,
diff --git a/client/src/vue_components/config/ConfigSystem.vue b/client/src/vue_components/config/ConfigSystem.vue
index 9a139ef21..d99453293 100644
--- a/client/src/vue_components/config/ConfigSystem.vue
+++ b/client/src/vue_components/config/ConfigSystem.vue
@@ -81,16 +81,15 @@
         id="connected-clients-table"
         :items="connectedClients"
         :fields="clientFields"
-        :per-page="perPage"
-        :current-page="currentPageClients"
+        :per-page="rowsPerPage"
+        :current-page="currentPage"
         small
       />
-      <b-pagination
-        v-model="currentPageClients"
+      <pagination-controls
+        :per-page.sync="rowsPerPage"
+        :current-page.sync="currentPage"
         :total-rows="connectedClients.length"
-        :per-page="perPage"
         aria-controls="connected-clients-table"
-        class="justify-content-center"
       />
     </b-modal>
   </div>
@@ -103,6 +102,7 @@
 import { defineComponent } from 'vue';
 import log from 'loglevel';
 import { makeURL } from '@/js/utils';
+import paginationMixin from '@/mixins/paginationMixin';
 
 interface VersionStatus {
   current_version: string | null;
@@ -115,11 +115,10 @@ interface VersionStatus {
 
 export default defineComponent({
   name: 'ConfigSystem',
+  mixins: [paginationMixin],
   data() {
     return {
-      perPage: 5,
       connectedClients: [] as unknown[],
-      currentPageClients: 1,
       clientFields: [
         { key: 'internal_id', label: 'UUID' },
         { key: 'remote_ip', label: 'IP' },
diff --git a/client/src/vue_components/shared/PaginationControls.vue b/client/src/vue_components/shared/PaginationControls.vue
new file mode 100644
index 000000000..76989e928
--- /dev/null
+++ b/client/src/vue_components/shared/PaginationControls.vue
@@ -0,0 +1,78 @@
+<template>
+  <div
+    v-if="showControls"
+    class="d-flex align-items-center justify-content-center mt-2 mb-3"
+    style="gap: 1rem"
+  >
+    <div class="d-flex align-items-center" style="gap: 0.5rem">
+      <label class="mb-0 text-nowrap" :for="selectId">Rows per page</label>
+      <b-form-select
+        :id="selectId"
+        :value="perPage"
+        :options="perPageOptions"
+        size="sm"
+        style="width: auto"
+        @change="$emit('update:perPage', $event)"
+      />
+    </div>
+    <b-pagination
+      v-show="perPage > 0 && totalRows > perPage"
+      class="mb-0"
+      :value="currentPage"
+      :total-rows="totalRows"
+      :per-page="perPage"
+      :aria-controls="ariaControls"
+      @change="$emit('update:currentPage', $event)"
+    />
+  </div>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+
+export const PER_PAGE_OPTIONS = [
+  { value: 10, text: '10' },
+  { value: 15, text: '15' },
+  { value: 25, text: '25' },
+  { value: 50, text: '50' },
+  { value: 0, text: 'All' },
+];
+
+const MIN_PER_PAGE = Math.min(...PER_PAGE_OPTIONS.filter((o) => o.value > 0).map((o) => o.value));
+
+export default defineComponent({
+  name: 'PaginationControls',
+  props: {
+    perPage: {
+      type: Number,
+      required: true,
+    },
+    currentPage: {
+      type: Number,
+      required: true,
+    },
+    totalRows: {
+      type: Number,
+      required: true,
+    },
+    ariaControls: {
+      type: String,
+      default: undefined,
+    },
+  },
+  emits: ['update:perPage', 'update:currentPage'],
+  data() {
+    return {
+      perPageOptions: PER_PAGE_OPTIONS,
+    };
+  },
+  computed: {
+    selectId(): string {
+      return this.ariaControls ? `${this.ariaControls}-per-page` : 'per-page-select';
+    },
+    showControls(): boolean {
+      return this.totalRows > MIN_PER_PAGE;
+    },
+  },
+});
+</script>
diff --git a/client/src/vue_components/show/config/acts_and_scenes/ConfigActs.vue b/client/src/vue_components/show/config/acts_and_scenes/ConfigActs.vue
index 01f5e0126..cbe583405 100644
--- a/client/src/vue_components/show/config/acts_and_scenes/ConfigActs.vue
+++ b/client/src/vue_components/show/config/acts_and_scenes/ConfigActs.vue
@@ -48,13 +48,11 @@
         </b-button-group>
       </template>
     </b-table>
-    <b-pagination
-      v-show="actTableItems.length > rowsPerPage"
-      v-model="currentPage"
+    <pagination-controls
+      :per-page.sync="rowsPerPage"
+      :current-page.sync="currentPage"
       :total-rows="actTableItems.length"
-      :per-page="rowsPerPage"
       aria-controls="acts-table"
-      class="justify-content-center"
     />
     <b-modal
       id="new-act"
@@ -167,15 +165,14 @@ import { required, integer } from 'vuelidate/lib/validators';
 import { mapGetters, mapActions } from 'vuex';
 import log from 'loglevel';
 import formValidationMixin from '@/mixins/formValidationMixin';
+import paginationMixin from '@/mixins/paginationMixin';
 
 export default defineComponent({
   name: 'ConfigActs',
-  mixins: [formValidationMixin],
+  mixins: [formValidationMixin, paginationMixin],
   data() {
     return {
       loading: true,
-      rowsPerPage: 15,
-      currentPage: 1,
       actFields: [
         'name',
         { key: 'interval_after', label: 'Interval After' },
diff --git a/client/src/vue_components/show/config/acts_and_scenes/ConfigScenes.vue b/client/src/vue_components/show/config/acts_and_scenes/ConfigScenes.vue
index 3c69308fd..6b85b3df2 100644
--- a/client/src/vue_components/show/config/acts_and_scenes/ConfigScenes.vue
+++ b/client/src/vue_components/show/config/acts_and_scenes/ConfigScenes.vue
@@ -49,13 +49,11 @@
             </b-button-group>
           </template>
         </b-table>
-        <b-pagination
-          v-show="sceneTableItems.length > rowsPerPage"
-          v-model="currentPage"
+        <pagination-controls
+          :per-page.sync="rowsPerPage"
+          :current-page.sync="currentPage"
           :total-rows="sceneTableItems.length"
-          :per-page="rowsPerPage"
           aria-controls="scene-table"
-          class="justify-content-center"
         />
       </b-col>
       <b-col cols="4">
@@ -217,15 +215,14 @@ import { required, integer } from 'vuelidate/lib/validators';
 import { mapGetters, mapActions } from 'vuex';
 import log from 'loglevel';
 import formValidationMixin from '@/mixins/formValidationMixin';
+import paginationMixin from '@/mixins/paginationMixin';
 
 export default defineComponent({
   name: 'ConfigScenes',
-  mixins: [formValidationMixin],
+  mixins: [formValidationMixin, paginationMixin],
   data() {
     return {
       loading: true,
-      rowsPerPage: 15,
-      currentPage: 1,
       sceneFields: [
         'name',
         'act',
diff --git a/client/src/vue_components/show/config/characters/CharacterGroups.vue b/client/src/vue_components/show/config/characters/CharacterGroups.vue
index 1a3cc3c6b..e21670363 100644
--- a/client/src/vue_components/show/config/characters/CharacterGroups.vue
+++ b/client/src/vue_components/show/config/characters/CharacterGroups.vue
@@ -43,13 +43,11 @@
         </b-button-group>
       </template>
     </b-table>
-    <b-pagination
-      v-show="CHARACTER_GROUP_LIST.length > rowsPerPage"
-      v-model="currentPage"
+    <pagination-controls
+      :per-page.sync="rowsPerPage"
+      :current-page.sync="currentPage"
       :total-rows="CHARACTER_GROUP_LIST.length"
-      :per-page="rowsPerPage"
       aria-controls="character-group-table"
-      class="justify-content-center"
     />
     <b-modal
       id="new-character-group"
@@ -170,16 +168,15 @@ import { mapActions, mapGetters } from 'vuex';
 import { required } from 'vuelidate/lib/validators';
 import log from 'loglevel';
 import formValidationMixin from '@/mixins/formValidationMixin';
+import paginationMixin from '@/mixins/paginationMixin';
 
 export default defineComponent({
   name: 'CharacterGroups',
-  mixins: [formValidationMixin],
+  mixins: [formValidationMixin, paginationMixin],
   data() {
     return {
       loading: true,
       characterGroupFields: ['name', 'description', 'characters', { key: 'btn', label: '' }],
-      rowsPerPage: 15,
-      currentPage: 1,
       tempCharacterList: [] as any[],
       newFormState: {
         name: '',
diff --git a/client/src/vue_components/show/config/mics/MicList.vue b/client/src/vue_components/show/config/mics/MicList.vue
index bf8fbbeb8..ca502ed57 100644
--- a/client/src/vue_components/show/config/mics/MicList.vue
+++ b/client/src/vue_components/show/config/mics/MicList.vue
@@ -29,13 +29,11 @@
         </b-button-group>
       </template>
     </b-table>
-    <b-pagination
-      v-show="MICROPHONES.length > rowsPerPage"
-      v-model="currentPage"
+    <pagination-controls
+      :per-page.sync="rowsPerPage"
+      :current-page.sync="currentPage"
       :total-rows="MICROPHONES.length"
-      :per-page="rowsPerPage"
       aria-controls="microphones-table"
-      class="justify-content-center"
     />
     <b-modal
       id="new-microphone"
@@ -126,6 +124,7 @@ import { defineComponent } from 'vue';
 import { mapActions, mapGetters } from 'vuex';
 import { required } from 'vuelidate/lib/validators';
 import log from 'loglevel';
+import paginationMixin from '@/mixins/paginationMixin';
 
 function isNameUnique(this: any, value: string): boolean {
   if (value === '') {
@@ -145,11 +144,10 @@ function isNameUnique(this: any, value: string): boolean {
 
 export default defineComponent({
   name: 'MicList',
+  mixins: [paginationMixin],
   data() {
     return {
       micFields: ['name', 'description', { key: 'btn', label: '' }],
-      rowsPerPage: 15,
-      currentPage: 1,
       newMicrophoneForm: {
         name: '',
         description: '',
diff --git a/client/src/vue_components/show/config/script/ScriptLineViewer.vue b/client/src/vue_components/show/config/script/ScriptLineViewer.vue
index e2751e334..d901cf3d5 100644
--- a/client/src/vue_components/show/config/script/ScriptLineViewer.vue
+++ b/client/src/vue_components/show/config/script/ScriptLineViewer.vue
@@ -1,5 +1,6 @@
 <template>
   <b-row
+    class="script-line-row"
     :class="{
       'stage-direction': line.line_type === LINE_TYPES.STAGE_DIRECTION,
       'heading-padding': line.line_type === LINE_TYPES.DIALOGUE && needsHeadingsAll,
@@ -142,6 +143,7 @@
       </b-button-group>
       <b-dropdown
         v-else-if="canEdit && !IS_CUT_MODE"
+        class="script-edit-controls"
         split
         text="Edit"
         right
@@ -386,4 +388,9 @@ export default defineComponent({
 .cut-line-part {
   text-decoration: line-through;
 }
+.script-line-row:has(.script-edit-controls:hover) {
+  background-color: rgba(255, 255, 255, 0.06);
+  border-radius: 4px;
+  transition: background-color 0.15s ease;
+}
 </style>
diff --git a/client/src/vue_components/show/config/sessions/SessionTagList.vue b/client/src/vue_components/show/config/sessions/SessionTagList.vue
index 75c3aafce..45c441a65 100644
--- a/client/src/vue_components/show/config/sessions/SessionTagList.vue
+++ b/client/src/vue_components/show/config/sessions/SessionTagList.vue
@@ -44,13 +44,11 @@
         </b-button-group>
       </template>
     </b-table>
-    <b-pagination
-      v-show="SESSION_TAGS.length > rowsPerPage"
-      v-model="currentPage"
+    <pagination-controls
+      :per-page.sync="rowsPerPage"
+      :current-page.sync="currentPage"
       :total-rows="SESSION_TAGS.length"
-      :per-page="rowsPerPage"
       aria-controls="session-tags-table"
-      class="justify-content-center"
     />
     <b-modal
       id="new-tag"
@@ -215,6 +213,7 @@ import { mapActions, mapGetters } from 'vuex';
 import log from 'loglevel';
 import { required } from 'vuelidate/lib/validators';
 import { contrastColor } from 'contrast-color';
+import paginationMixin from '@/mixins/paginationMixin';
 
 function isValidHexColor(value: string): boolean {
   if (!value) return false;
@@ -241,6 +240,7 @@ function isTagNameUnique(this: any, value: string): boolean {
 
 export default defineComponent({
   name: 'SessionTagList',
+  mixins: [paginationMixin],
   data() {
     return {
       tagFields: [
@@ -248,8 +248,6 @@ export default defineComponent({
         { key: 'session_count', label: 'Sessions' },
         { key: 'btn', label: '' },
       ],
-      rowsPerPage: 15,
-      currentPage: 1,
       newTagForm: {
         tag: '',
         colour: '#3498DB',
diff --git a/client/src/vue_components/show/config/stage/CrewList.vue b/client/src/vue_components/show/config/stage/CrewList.vue
index 9a12467de..cf0b2ff53 100644
--- a/client/src/vue_components/show/config/stage/CrewList.vue
+++ b/client/src/vue_components/show/config/stage/CrewList.vue
@@ -20,13 +20,11 @@
         </b-button-group>
       </template>
     </b-table>
-    <b-pagination
-      v-show="CREW_LIST.length > rowsPerPage"
-      v-model="currentPage"
+    <pagination-controls
+      :per-page.sync="rowsPerPage"
+      :current-page.sync="currentPage"
       :total-rows="CREW_LIST.length"
-      :per-page="rowsPerPage"
       aria-controls="crew-table"
-      class="justify-content-center"
     />
     <b-modal
       id="new-crew"
@@ -123,10 +121,11 @@ import { defineComponent } from 'vue';
 import { required } from 'vuelidate/lib/validators';
 import { mapGetters, mapActions } from 'vuex';
 import formValidationMixin from '@/mixins/formValidationMixin';
+import paginationMixin from '@/mixins/paginationMixin';
 
 export default defineComponent({
   name: 'CrewList',
-  mixins: [formValidationMixin],
+  mixins: [formValidationMixin, paginationMixin],
   data() {
     return {
       crewFields: ['first_name', 'last_name', { key: 'btn', label: '' }],
@@ -134,8 +133,6 @@ export default defineComponent({
         firstName: '',
         lastName: '',
       },
-      rowsPerPage: 15,
-      currentPage: 1,
       editFormState: {
         id: null as number | null,
         showID: null as number | null,
diff --git a/client/src/vue_components/show/config/stage/PropsList.vue b/client/src/vue_components/show/config/stage/PropsList.vue
index f44ed9f25..f5f632b13 100644
--- a/client/src/vue_components/show/config/stage/PropsList.vue
+++ b/client/src/vue_components/show/config/stage/PropsList.vue
@@ -23,13 +23,11 @@
             </b-button-group>
           </template>
         </b-table>
-        <b-pagination
-          v-show="PROP_TYPES.length > rowsPerPage"
-          v-model="currentPropTypePage"
+        <pagination-controls
+          :per-page.sync="rowsPerPage"
+          :current-page.sync="currentPropTypePage"
           :total-rows="PROP_TYPES.length"
-          :per-page="rowsPerPage"
           aria-controls="prop-type-table"
-          class="justify-content-center"
         />
       </b-col>
       <b-col cols="7">
@@ -57,13 +55,11 @@
             </b-button-group>
           </template>
         </b-table>
-        <b-pagination
-          v-show="PROPS_LIST.length > rowsPerPage"
-          v-model="currentPropPage"
+        <pagination-controls
+          :per-page.sync="rowsPerPage"
+          :current-page.sync="currentPropPage"
           :total-rows="PROPS_LIST.length"
-          :per-page="rowsPerPage"
           aria-controls="props-table"
-          class="justify-content-center"
         />
       </b-col>
     </b-row>
@@ -358,6 +354,12 @@ export default defineComponent({
     },
     ...mapGetters(['PROPS_LIST', 'PROP_TYPES', 'IS_SHOW_EDITOR', 'PROP_TYPE_BY_ID']),
   },
+  watch: {
+    rowsPerPage() {
+      this.currentPropPage = 1;
+      this.currentPropTypePage = 1;
+    },
+  },
   async mounted(): Promise<void> {
     await Promise.all([(this as any).GET_PROP_TYPES(), (this as any).GET_PROPS_LIST()]);
   },
diff --git a/client/src/vue_components/show/config/stage/SceneryList.vue b/client/src/vue_components/show/config/stage/SceneryList.vue
index e559479b4..e3025a1c1 100644
--- a/client/src/vue_components/show/config/stage/SceneryList.vue
+++ b/client/src/vue_components/show/config/stage/SceneryList.vue
@@ -23,13 +23,11 @@
             </b-button-group>
           </template>
         </b-table>
-        <b-pagination
-          v-show="SCENERY_TYPES.length > rowsPerPage"
-          v-model="currentSceneryTypesPage"
+        <pagination-controls
+          :per-page.sync="rowsPerPage"
+          :current-page.sync="currentSceneryTypesPage"
           :total-rows="SCENERY_TYPES.length"
-          :per-page="rowsPerPage"
           aria-controls="scenery-types-table"
-          class="justify-content-center"
         />
       </b-col>
       <b-col cols="7">
@@ -57,13 +55,11 @@
             </b-button-group>
           </template>
         </b-table>
-        <b-pagination
-          v-show="SCENERY_LIST.length > rowsPerPage"
-          v-model="currentSceneryPage"
+        <pagination-controls
+          :per-page.sync="rowsPerPage"
+          :current-page.sync="currentSceneryPage"
           :total-rows="SCENERY_LIST.length"
-          :per-page="rowsPerPage"
           aria-controls="scenery-table"
-          class="justify-content-center"
         />
       </b-col>
     </b-row>
@@ -366,6 +362,12 @@ export default defineComponent({
     },
     ...mapGetters(['SCENERY_LIST', 'SCENERY_TYPES', 'IS_SHOW_EDITOR', 'SCENERY_TYPE_BY_ID']),
   },
+  watch: {
+    rowsPerPage() {
+      this.currentSceneryPage = 1;
+      this.currentSceneryTypesPage = 1;
+    },
+  },
   async mounted(): Promise<void> {
     await Promise.all([(this as any).GET_SCENERY_TYPES(), (this as any).GET_SCENERY_LIST()]);
   },
diff --git a/client/src/vue_components/show/config/stage/StageManager.vue b/client/src/vue_components/show/config/stage/StageManager.vue
index 0e2b65012..bedfcd7c8 100644
--- a/client/src/vue_components/show/config/stage/StageManager.vue
+++ b/client/src/vue_components/show/config/stage/StageManager.vue
@@ -90,13 +90,11 @@
                     </b-button>
                   </template>
                 </b-table>
-                <b-pagination
-                  v-show="currentSceneSceneryAllocations.length > rowsPerPage"
-                  v-model="currentSceneryAllocPage"
+                <pagination-controls
+                  :per-page.sync="rowsPerPage"
+                  :current-page.sync="currentSceneryAllocPage"
                   :total-rows="currentSceneSceneryAllocations.length"
-                  :per-page="rowsPerPage"
                   aria-controls="scenery-alloc-table"
-                  class="justify-content-center"
                 />
               </b-col>
               <b-col cols="6">
@@ -122,13 +120,11 @@
                     </b-button>
                   </template>
                 </b-table>
-                <b-pagination
-                  v-show="currentScenePropsAllocations.length > rowsPerPage"
-                  v-model="currentPropsAllocPage"
+                <pagination-controls
+                  :per-page.sync="rowsPerPage"
+                  :current-page.sync="currentPropsAllocPage"
                   :total-rows="currentScenePropsAllocations.length"
-                  :per-page="rowsPerPage"
                   aria-controls="props-alloc-table"
-                  class="justify-content-center"
                 />
               </b-col>
             </b-row>
@@ -668,6 +664,12 @@ export default defineComponent({
       'CREW_ASSIGNMENTS_BY_SCENERY',
     ]),
   },
+  watch: {
+    rowsPerPage() {
+      this.currentSceneryAllocPage = 1;
+      this.currentPropsAllocPage = 1;
+    },
+  },
   async mounted(): Promise<void> {
     await Promise.all([
       (this as any).GET_ACT_LIST(),
diff --git a/electron/package-lock.json b/electron/package-lock.json
index fe6e86a62..4a93c7d1b 100644
--- a/electron/package-lock.json
+++ b/electron/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "digiscript-electron",
-  "version": "0.31.1",
+  "version": "0.31.2",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "digiscript-electron",
-      "version": "0.31.1",
+      "version": "0.31.2",
       "license": "GPL-3.0",
       "dependencies": {
         "bonjour-service": "^1.4.0",
diff --git a/electron/package.json b/electron/package.json
index fd55c1cd1..a4f6cae3b 100644
--- a/electron/package.json
+++ b/electron/package.json
@@ -1,6 +1,6 @@
 {
   "name": "digiscript-electron",
-  "version": "0.31.1",
+  "version": "0.31.2",
   "description": "DigiScript Electron Desktop Application",
   "author": "DreamTeamProd",
   "license": "GPL-3.0",
diff --git a/server/pyproject.toml b/server/pyproject.toml
index 90327a909..3e077ffc2 100644
--- a/server/pyproject.toml
+++ b/server/pyproject.toml
@@ -11,7 +11,7 @@ build-backend = "setuptools.build_meta"
 
 [project]
 name = "digiscript-server"
-version = "0.31.1"
+version = "0.31.2"
 description = "DigiScript server - Digital script management for theatrical shows"
 readme = "../README.md"
 requires-python = ">=3.13"