fixed bad component placement

Author: AnthonyMarin

src/components/blocked-pubkeys/BlockedPubkeys.tsx

@@ -16,7 +16,7 @@ const { Title, Text } = Typography;
 export function createStyledTable<T extends object = any>() {
   const GenericTable: FC<TableProps<T>> = (props) => <Table {...props} />;
 
-  return styled(GenericTable)`
+  const StyledTable = styled(GenericTable)`
     border-radius: 12px;
 
     & .ant-table-thead .ant-table-cell {
@@ -34,6 +34,7 @@ export function createStyledTable<T extends object = any>() {
       background-color: var(--layout-sider-bg-color);
     }
   `;
+  return StyledTable;
 }
 export const BlockedPubkeys: React.FC = () => {
   const [activeView, setActiveView] = useState<'blocked' | 'flagged'>('blocked');

src/components/blocked-pubkeys/components/BlockedPubkeysTable.tsx

@@ -11,12 +11,12 @@ interface BlockedPubkeysTableProps {
   loading: boolean;
   onUnblock: (pubkey: string) => Promise<void>;
 }
-const TableRoot = createStyledTable<BlockedPubkey>();
 export const BlockedPubkeysTable: React.FC<BlockedPubkeysTableProps> = ({ blockedPubkeys, loading, onUnblock }) => {
   const [searchText, setSearchText] = useState('');
   const [confirmModalVisible, setConfirmModalVisible] = useState(false);
   const [currentPubkey, setCurrentPubkey] = useState('');
   const { getFlagCountsForPubkeys, loading: statsLoading } = useModerationStats();
+  const TableRoot = createStyledTable<BlockedPubkey>();
 
   // Get flag counts for all pubkeys in the table
   const pubkeyFlagCounts = getFlagCountsForPubkeys(blockedPubkeys.map((bp) => bp.pubkey));

src/components/blocked-pubkeys/components/FlaggedPubkeysTable.tsx

@@ -12,7 +12,7 @@ interface FlaggedPubkeysTableProps {
   onBlock: (pubkey: string, reason?: string) => Promise<void>;
   disabled?: boolean;
 }
-const TableRoot = createStyledTable<UserStat>();
+
 export const FlaggedPubkeysTable: React.FC<FlaggedPubkeysTableProps> = ({
   blockedPubkeys,
   onBlock,
@@ -23,6 +23,7 @@ export const FlaggedPubkeysTable: React.FC<FlaggedPubkeysTableProps> = ({
   const [currentPubkey, setCurrentPubkey] = useState('');
   const [blockReason, setBlockReason] = useState('');
   const { stats, loading: statsLoading } = useModerationStats();
+  const TableRoot = createStyledTable<UserStat>();
 
   // Filter out already blocked pubkeys and return the rest
   const flaggedUsers =