fix(dienstgrad): add ASB→Abschnittssachbearbeiter, remove non-existent ranks (FA/FF/BOI/BAM variants), sync DB constraint, TS types, and display map

frontend/src/pages/Mitglieder.tsx

@@ -117,7 +117,7 @@ function Mitglieder() {
     } finally {
       setLoading(false);
     }
-  }, [debouncedSearch, selectedStatus, selectedDienstgrad, page]);
+  }, [debouncedSearch, selectedStatus, selectedDienstgrad, page, pageSize]);
 
   useEffect(() => {
     // Reset to page 0 when search changes
@@ -137,8 +137,7 @@ function Mitglieder() {
       return;
     }
     fetchMembers();
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [page, selectedStatus, selectedDienstgrad]);
+  }, [page, pageSize, selectedStatus, selectedDienstgrad]);
 
   // ----------------------------------------------------------------
   // Event handlers
@@ -275,6 +274,22 @@ function Mitglieder() {
 
         {/* Table */}
         <Paper sx={{ width: '100%', overflow: 'hidden' }}>
+          <TablePagination
+            component="div"
+            count={total}
+            page={page}
+            onPageChange={(_e, newPage) => setPage(newPage)}
+            rowsPerPage={pageSize}
+            rowsPerPageOptions={[25, 50, 100, { value: -1, label: 'Alle' }]}
+            onRowsPerPageChange={(e) => {
+              setPageSize(parseInt(e.target.value, 10));
+              setPage(0);
+            }}
+            labelRowsPerPage="Einträge pro Seite:"
+            labelDisplayedRows={({ from, to, count }) =>
+              `${from}–${to} von ${count !== -1 ? count : `mehr als ${to}`}`
+            }
+          />
           <DataTable<MemberListItem>
             columns={[
               { key: 'profile_picture_url', label: 'Foto', width: 56, sortable: false, searchable: false, render: (member) => {
@@ -330,22 +345,6 @@ function Mitglieder() {
             stickyHeader
           />
 
-          <TablePagination
-            component="div"
-            count={total}
-            page={page}
-            onPageChange={(_e, newPage) => setPage(newPage)}
-            rowsPerPage={pageSize}
-            rowsPerPageOptions={[25, 50, 100, { value: -1, label: 'Alle' }]}
-            onRowsPerPageChange={(e) => {
-              setPageSize(parseInt(e.target.value, 10));
-              setPage(0);
-            }}
-            labelRowsPerPage="Einträge pro Seite:"
-            labelDisplayedRows={({ from, to, count }) =>
-              `${from}–${to} von ${count !== -1 ? count : `mehr als ${to}`}`
-            }
-          />
         </Paper>
       </Container>