diff --git a/src/common/AuthWrapper.test.tsx b/src/common/AuthWrapper.test.tsx
index fc5e281e12..f8015befc5 100644
--- a/src/common/AuthWrapper.test.tsx
+++ b/src/common/AuthWrapper.test.tsx
@@ -6,14 +6,26 @@ import { describe, expect, it, vi } from 'vitest';
 
 import { AuthWrapper } from './AuthWrapper';
 
-vi.mock('src/stores/Profile/profile.store', () => ({
-  useProfileStore: () => ({
-    profile: FactoryUser({
-      roles: [UserRole.BETA_TESTER],
-    }),
-  }),
-  ProfileStoreProvider: ({ children }: { children: React.ReactNode }) => children,
-}));
+import type { Profile } from 'oa-shared';
+
+const { ProfileStore } = await vi.hoisted(async () => {
+  const actual = await import('src/stores/Profile/profile.store');
+  return { ProfileStore: actual.ProfileStore };
+});
+
+const mockStore = new ProfileStore();
+mockStore.profile = FactoryUser({
+  roles: [UserRole.BETA_TESTER],
+}) as Profile;
+
+vi.mock('src/stores/Profile/profile.store', async (importOriginal) => {
+  const actual: any = await importOriginal();
+  return {
+    ...actual,
+    useProfileStore: () => mockStore,
+    ProfileStoreProvider: ({ children }: { children: React.ReactNode }) => children,
+  };
+});
 
 describe('AuthWrapper', () => {
   it('renders fallback when user is not authorized', () => {
diff --git a/src/common/AuthWrapper.tsx b/src/common/AuthWrapper.tsx
index 348d43df9d..bdafca4461 100644
--- a/src/common/AuthWrapper.tsx
+++ b/src/common/AuthWrapper.tsx
@@ -2,7 +2,7 @@ import React from 'react';
 import { observer } from 'mobx-react';
 import { useProfileStore } from 'src/stores/Profile/profile.store';
 
-import type { Profile, UserRole } from 'oa-shared';
+import type { UserRole } from 'oa-shared';
 
 /*
     Simple wrapper to only render a component if the user is logged in (plus optional user role required)
@@ -17,9 +17,8 @@ interface IProps {
 
 export const AuthWrapper = observer((props: IProps) => {
   const { borderLess, children, roleRequired } = props;
-  const { profile } = useProfileStore();
-
-  const isAuthorized = isUserAuthorized(profile, roleRequired);
+  const { isUserAuthorized } = useProfileStore();
+  const isAuthorized = isUserAuthorized(roleRequired);
 
   const childElements =
     roleRequired === 'beta-tester' && !borderLess ? (
@@ -30,21 +29,3 @@ export const AuthWrapper = observer((props: IProps) => {
 
   return <>{isAuthorized ? childElements : props.fallback || <></>}</>;
 });
-
-export const isUserAuthorized = (user?: Profile | null, roleRequired?: UserRole | UserRole[]) => {
-  const userRoles = user?.roles || [];
-
-  // If no role required just check if user is logged in
-  if (!roleRequired || roleRequired.length === 0) {
-    return user ? true : false;
-  }
-
-  const rolesRequired = Array.isArray(roleRequired) ? roleRequired : [roleRequired];
-
-  // otherwise use logged in user profile values
-  if (user && roleRequired) {
-    return userRoles.some((role) => rolesRequired.includes(role as UserRole));
-  }
-
-  return false;
-};
diff --git a/src/pages/Library/Content/List/LibraryListHeader.tsx b/src/pages/Library/Content/List/LibraryListHeader.tsx
index 5a6bbbcb02..225acf4ca3 100644
--- a/src/pages/Library/Content/List/LibraryListHeader.tsx
+++ b/src/pages/Library/Content/List/LibraryListHeader.tsx
@@ -166,7 +166,7 @@ export const LibraryListHeader = (props: IProps) => {
 
   return (
     <ListHeader
-      itemCount={showDrafts ? draftCount : itemCount}
+      itemCount={showDrafts ? draftCount : itemCount || 0}
       actionComponents={actionComponents}
       showDrafts={showDrafts}
       headingTitle={headingTitle}
diff --git a/src/pages/News/NewsListHeader.tsx b/src/pages/News/NewsListHeader.tsx
index afc37e3be1..c92c6808bc 100644
--- a/src/pages/News/NewsListHeader.tsx
+++ b/src/pages/News/NewsListHeader.tsx
@@ -1,22 +1,10 @@
-// import { useCallback, useEffect, useState } from 'react'
 import { Link } from 'react-router';
-// import debounce from 'debounce'
-import { Tooltip } from 'oa-components';
 import { UserRole } from 'oa-shared';
-import { AuthWrapper } from 'src/common/AuthWrapper';
-// import { FieldContainer } from 'src/common/Form/FieldContainer'
-import { UserAction } from 'src/common/UserAction';
-// import {
-//   NewsSearchParams,
-// } from 'src/pages/News/newsContent.service'
-import { Button } from 'theme-ui';
+import { useProfileStore } from 'src/stores/Profile/profile.store';
+import { Button, Flex, Heading } from 'theme-ui';
 
 import DraftButton from '../common/Drafts/DraftButton';
-import { ListHeader } from '../common/Layout/ListHeader';
 import { headings, listing } from './labels';
-// import { NewsSortOptions } from './NewsSortOptions'
-
-// import type { Category } from 'oa-shared'
 
 interface IProps {
   draftCount: number;
@@ -26,159 +14,61 @@ interface IProps {
 
 export const NewsListHeader = (props: IProps) => {
   const { draftCount, handleShowDrafts, showDrafts } = props;
-
-  // const [categories, setCategories] = useState<Category[]>([])
-  // const [searchString, setSearchString] = useState<string>('')
-
-  // const [searchParams, setSearchParams] = useSearchParams()
-  // const categoryParam = searchParams.get(NewsSearchParams.category)
-  // const category =
-  //   (categoryParam && categories?.find((x) => x.id === +categoryParam)) ?? null
-  // const q = searchParams.get(NewsSearchParams.q)
-  // const sort = searchParams.get(NewsSearchParams.sort) as NewsSortOption
-
-  // useEffect(() => {
-  //   const initCategories = async () => {
-  //     const categories = (await newsContentService.getCategories()) || []
-  //     setCategories(categories)
-  //   }
-
-  //   initCategories()
-  // }, [])
-
-  // useEffect(() => {
-  //   setSearchString(q || '')
-  // }, [q])
-
-  // const updateFilter = useCallback(
-  //   (key: NewsSearchParams, value: string) => {
-  //     const params = new URLSearchParams(searchParams.toString())
-  //     if (value) {
-  //       params.set(key, value)
-  //     } else {
-  //       params.delete(key)
-  //     }
-  //     setSearchParams(params)
-  //   },
-  //   [searchParams],
-  // )
-
-  // const onSearchInputChange = useCallback(
-  //   debounce((value: string) => {
-  //     searchValue(value)
-  //   }, 500),
-  //   [searchParams],
-  // )
-
-  // const searchValue = (value: string) => {
-  //   const params = new URLSearchParams(searchParams.toString())
-  //   params.set('q', value)
-
-  //   if (value.length > 0 && sort !== 'MostRelevant') {
-  //     params.set('sort', 'MostRelevant')
-  //   }
-
-  //   if (value.length === 0 || !value) {
-  //     params.set('sort', 'Newest')
-  //   }
-
-  //   setSearchParams(params)
-  // }
-
-  const actionComponents = (
-    <UserAction
-      incompleteProfile={
-        <AuthWrapper roleRequired={UserRole.ADMIN}>
-          <Link
-            to="/settings"
-            data-tooltip-id="tooltip"
-            data-tooltip-content={listing.incompleteProfile}
-          >
-            <Button type="button" data-cy="complete-profile-news" variant="disabled">
-              {listing.create}
-            </Button>
-          </Link>
-          <Tooltip id="tooltip" />
-        </AuthWrapper>
-      }
-      loggedIn={
-        <AuthWrapper roleRequired={UserRole.ADMIN}>
-          <DraftButton
-            showDrafts={showDrafts}
-            draftCount={draftCount}
-            handleShowDrafts={handleShowDrafts}
-          />
-          <Link to="/news/create">
-            <Button type="button" data-cy="create-news" variant="primary">
-              {listing.create}
-            </Button>
-          </Link>
-        </AuthWrapper>
-      }
-      loggedOut={<></>}
-    />
-  );
-
-  // const categoryComponent = (
-  //   <CategoryHorizonalList
-  //     allCategories={categories}
-  //     activeCategory={category !== '' ? category : null}
-  //     setActiveCategory={(updatedCategory) =>
-  //       updateFilter(
-  //         NewsSearchParams.category,
-  //         updatedCategory ? (updatedCategory as Category).id.toString() : '',
-  //       )
-  //     }
-  //   />
-  // )
-
-  // const filteringComponents = (
-  //   <Flex
-  //     sx={{
-  //       gap: 2,
-  //       flexDirection: ['column', 'column', 'row'],
-  //       flexWrap: 'wrap',
-  //     }}
-  //   >
-  //     <Flex sx={{ width: ['100%', '100%', '230px'] }}>
-  //       <FieldContainer>
-  //         <Select
-  //           options={NewsSortOptions.toArray(!!q)}
-  //           placeholder={listing.sort}
-  //           value={{ label: NewsSortOptions.get(sort) }}
-  //           onChange={(sortBy) =>
-  //             updateFilter(NewsSearchParams.sort, sortBy.value)
-  //           }
-  //         />
-  //       </FieldContainer>
-  //     </Flex>
-  //     <Flex sx={{ width: ['100%', '100%', '300px'] }}>
-  //       <SearchField
-  //         dataCy="news-search-box"
-  //         placeHolder={listing.search}
-  //         value={searchString}
-  //         onChange={(value) => {
-  //           setSearchString(value)
-  //           onSearchInputChange(value)
-  //         }}
-  //         onClickDelete={() => {
-  //           setSearchString('')
-  //           searchValue('')
-  //         }}
-  //         onClickSearch={() => searchValue(searchString)}
-  //       />
-  //     </Flex>
-  //   </Flex>
-  // )
+  const { isUserAuthorized } = useProfileStore();
 
   return (
-    <ListHeader
-      actionComponents={actionComponents}
-      actionComponentsMaxWidth="650px"
-      showDrafts={showDrafts}
-      headingTitle={headings.list}
-      categoryComponent={<></>}
-      filteringComponents={<></>}
-    />
+    <Flex
+      sx={{
+        flexDirection: 'column',
+        alignItems: 'center',
+        paddingTop: [6, 12],
+        paddingBottom: [4, 8],
+        gap: [4, 8],
+      }}
+    >
+      <Flex>
+        <Heading
+          as="h1"
+          sx={{
+            marginX: 'auto',
+            textAlign: 'center',
+            fontWeight: 'bold',
+            fontSize: 5,
+          }}
+        >
+          {headings.list}
+        </Heading>
+      </Flex>
+      {isUserAuthorized(UserRole.ADMIN) && (
+        <Flex
+          sx={{
+            justifyContent: 'space-between',
+            flexDirection: ['column', 'column', 'row'],
+            gap: [2, 2, 2],
+            paddingX: [2, 0],
+            maxWidth: '100%',
+          }}
+        >
+          <Flex
+            sx={{
+              gap: 2,
+              alignSelf: ['flex-start', 'flex-start', 'flex-end'],
+              display: ['none', 'none', 'flex'],
+            }}
+          >
+            <DraftButton
+              showDrafts={showDrafts}
+              draftCount={draftCount}
+              handleShowDrafts={handleShowDrafts}
+            />
+            <Link to="/news/create">
+              <Button type="button" data-cy="create-news" variant="primary">
+                {listing.create}
+              </Button>
+            </Link>
+          </Flex>
+        </Flex>
+      )}
+    </Flex>
   );
 };
diff --git a/src/pages/News/NewsListing.tsx b/src/pages/News/NewsListing.tsx
index 40b9c45b71..ea20cdf541 100644
--- a/src/pages/News/NewsListing.tsx
+++ b/src/pages/News/NewsListing.tsx
@@ -28,7 +28,6 @@ export const NewsListing = () => {
 
   useEffect(() => {
     if (!sort) {
-      // ensure sort is set
       const params = new URLSearchParams(searchParams.toString());
 
       if (q) {
@@ -70,7 +69,7 @@ export const NewsListing = () => {
   const newsList = showDrafts ? drafts : news;
 
   return (
-    <Flex sx={{ flexDirection: 'column', gap: [2, 4], alignItems: 'center' }}>
+    <Flex sx={{ flexDirection: 'column', alignItems: 'center' }}>
       <NewsListHeader
         draftCount={draftCount}
         handleShowDrafts={handleShowDrafts}
diff --git a/src/pages/Question/QuestionListHeader.tsx b/src/pages/Question/QuestionListHeader.tsx
index b91e6e1e5e..2e11024f22 100644
--- a/src/pages/Question/QuestionListHeader.tsx
+++ b/src/pages/Question/QuestionListHeader.tsx
@@ -171,7 +171,7 @@ export const QuestionListHeader = (props: IProps) => {
 
   return (
     <ListHeader
-      itemCount={showDrafts ? draftCount : itemCount}
+      itemCount={showDrafts ? draftCount : itemCount || 0}
       actionComponents={actionComponents}
       showDrafts={false}
       headingTitle={headings.list}
diff --git a/src/pages/common/Layout/ListHeader.tsx b/src/pages/common/Layout/ListHeader.tsx
index 98805cad6d..7351944f93 100644
--- a/src/pages/common/Layout/ListHeader.tsx
+++ b/src/pages/common/Layout/ListHeader.tsx
@@ -1,9 +1,8 @@
 import { Flex, Heading, Text } from 'theme-ui';
 
 interface IProps {
-  itemCount?: number;
+  itemCount: number;
   actionComponents: React.ReactNode;
-  actionComponentsMaxWidth?: string;
   headingTitle: string;
   categoryComponent: React.ReactNode;
   filteringComponents: React.ReactNode;
@@ -14,7 +13,6 @@ export const ListHeader = (props: IProps) => {
   const {
     itemCount,
     actionComponents,
-    actionComponentsMaxWidth,
     headingTitle,
     showDrafts,
     categoryComponent,
@@ -52,7 +50,7 @@ export const ListHeader = (props: IProps) => {
           flexDirection: ['column', 'column', 'row'],
           gap: [2, 2, 2],
           paddingX: [2, 0],
-          maxWidth: actionComponentsMaxWidth || '100%',
+          maxWidth: '100%',
         }}
       >
         <Flex
@@ -63,27 +61,19 @@ export const ListHeader = (props: IProps) => {
             alignItems: ['flex-start', 'flex-start', 'center'],
           }}
         >
-          <Flex
-            sx={{
-              width: ['100%', '100%', 'auto'],
-              '& > *': { flexGrow: [1, 1, 0] },
-            }}
-          >
-            {!showDrafts ? filteringComponents : <div style={{ width: '100%' }}></div>}
-          </Flex>
-          <Flex
-            sx={{
-              flexDirection: 'row',
-              justifyContent: ['space-between', 'space-between', 'flex-start'],
-              alignItems: 'center',
-              width: ['100%', '100%', 'auto'],
-            }}
-          >
-            <Text sx={{ marginLeft: [0, 0, 2] }}>
-              {itemCount ? `${itemCount} ${itemLabel}` : ''}
-            </Text>
-            <Flex sx={{ gap: 2, display: ['flex', 'flex', 'none'] }}>{actionComponents}</Flex>
-          </Flex>
+          {!showDrafts && filteringComponents}
+          {itemCount !== undefined && itemCount != null && (
+            <Flex
+              sx={{
+                flexDirection: 'row',
+                justifyContent: ['space-between', 'space-between', 'flex-start'],
+                alignItems: 'center',
+                width: ['100%', '100%', 'auto'],
+              }}
+            >
+              <Text sx={{ marginLeft: [0, 0, 2] }}>{`${itemCount} ${itemLabel}`}</Text>
+            </Flex>
+          )}
         </Flex>
         <Flex
           sx={{
diff --git a/src/routes/api.news.ts b/src/routes/api.news.ts
index 0c4f7ebf82..2a70d9a29c 100644
--- a/src/routes/api.news.ts
+++ b/src/routes/api.news.ts
@@ -5,6 +5,7 @@ import { ITEMS_PER_PAGE } from 'src/pages/News/constants';
 import { createSupabaseServerClient } from 'src/repository/supabase.server';
 import { discordServiceServer } from 'src/services/discordService.server';
 import { newsServiceServer } from 'src/services/newsService.server';
+import { ProfileServiceServer } from 'src/services/profileService.server';
 import { storageServiceServer } from 'src/services/storageService.server';
 import { subscribersServiceServer } from 'src/services/subscribersService.server';
 import { updateUserActivity } from 'src/utils/activity.server';
@@ -27,6 +28,14 @@ export const loader = async ({ request }) => {
   const skip = Number(params.get('skip')) || 0;
 
   const { client, headers } = createSupabaseServerClient(request);
+  const claims = await client.auth.getClaims();
+  let currentUserBadges: number[] = [];
+  let isAdmin = false;
+  if (claims?.data?.claims?.sub) {
+    const profile = await new ProfileServiceServer(client).getByAuthId(claims.data.claims.sub);
+    isAdmin = !!profile?.roles?.includes('admin');
+    currentUserBadges = profile?.badges?.map((x) => x.profile_badges.id) || [];
+  }
 
   let query = client
     .from('news')
@@ -56,9 +65,17 @@ export const loader = async ({ request }) => {
           action_url
         )
       ))`,
+      { count: 'exact' },
     )
+
     .eq('is_draft', false);
 
+  if (!isAdmin) {
+    query = query.or(
+      `profile_badge.is.null${currentUserBadges.length > 0 ? `,profile_badge.in.(${currentUserBadges.join(',')})` : ''}`,
+    );
+  }
+
   if (q) {
     query = query.textSearch('news_search_fields', q);
   }
@@ -71,12 +88,11 @@ export const loader = async ({ request }) => {
     query = query.order('comment_count', { ascending: true });
   }
 
-  const queryResult = await query.range(skip, skip + ITEMS_PER_PAGE); // 0 based
+  const queryResult = await query.range(skip, skip + ITEMS_PER_PAGE - 1); // 0 based
 
   const total = queryResult.count;
   const data = queryResult.data as unknown as DBNews[];
-  const allNews = data.map((dbNews) => News.fromDB(dbNews, []));
-  const items = await newsServiceServer.filterNewsByUserFunctions(allNews, client);
+  const items = data.map((dbNews) => News.fromDB(dbNews, []));
 
   if (items && items.length > 0) {
     // Populate useful votes
diff --git a/src/services/newsService.server.ts b/src/services/newsService.server.ts
index e0c27b749b..cc0c207bb9 100644
--- a/src/services/newsService.server.ts
+++ b/src/services/newsService.server.ts
@@ -1,43 +1,9 @@
-import { UserRole } from 'oa-shared';
 import { IMAGE_SIZES } from 'src/config/imageTransforms';
-import { ProfileFactory } from 'src/factories/profileFactory.server';
 
-import { ProfileServiceServer } from './profileService.server';
 import { storageServiceServer } from './storageService.server';
 
 import type { SupabaseClient } from '@supabase/supabase-js';
-import type { DBMedia, DBNews, News, Profile } from 'oa-shared';
-
-async function filterNewsByUserFunctions(allNews: News[], client: SupabaseClient) {
-  const claims = await client.auth.getClaims();
-
-  if (!claims.data?.claims) {
-    return allNews.filter((item) => !item.profileBadge);
-  }
-
-  const profileService = new ProfileServiceServer(client);
-  const dbProfile = await profileService.getByAuthId(claims.data.claims.sub);
-  const profile = new ProfileFactory(client).fromDB(dbProfile!);
-
-  const isAdmin = profile.roles?.includes(UserRole.ADMIN) ?? false;
-
-  if (isAdmin) {
-    return allNews;
-  }
-
-  return filterNewsByUserBadges(allNews, profile);
-}
-
-function filterNewsByUserBadges(news: News[], profile: Profile): News[] {
-  const userBadgeIds = new Set(profile.badges?.map((badge) => badge.id));
-
-  return news.filter((item) => {
-    if (!item.profileBadge) {
-      return true;
-    }
-    return userBadgeIds.has(item.profileBadge.id);
-  });
-}
+import type { DBMedia, DBNews } from 'oa-shared';
 
 async function getById(id: number, client: SupabaseClient) {
   const result = await client.from('news').select().eq('id', id).single();
@@ -93,8 +59,6 @@ const getHeroImage = async (client: SupabaseClient, dbImage: DBMedia | null) =>
 };
 
 export const newsServiceServer = {
-  filterNewsByUserFunctions,
-  filterNewsByUserBadges,
   getById,
   getBySlug,
   getHeroImage,
diff --git a/src/stores/Profile/profile.store.tsx b/src/stores/Profile/profile.store.tsx
index 4d5e057688..e71babd1d1 100644
--- a/src/stores/Profile/profile.store.tsx
+++ b/src/stores/Profile/profile.store.tsx
@@ -5,7 +5,7 @@ import { profileService } from 'src/services/profileService';
 import { profileTypesService } from 'src/services/profileTypesService';
 import { upgradeBadgeService } from 'src/services/upgradeBadgeService';
 
-import type { Profile, ProfileType, UpgradeBadge } from 'oa-shared';
+import type { Profile, ProfileType, UpgradeBadge, UserRole } from 'oa-shared';
 
 export class ProfileStore {
   profile?: Profile = undefined;
@@ -49,6 +49,24 @@ export class ProfileStore {
     return this.profileTypes?.find((type) => type.name === name);
   };
 
+  isUserAuthorized = (roleRequired?: UserRole | UserRole[]) => {
+    const userRoles = this.profile?.roles || [];
+
+    // If no role required just check if user is logged in
+    if (!roleRequired || roleRequired.length === 0) {
+      return this.profile ? true : false;
+    }
+
+    const rolesRequired = Array.isArray(roleRequired) ? roleRequired : [roleRequired];
+
+    // otherwise use logged in user profile values
+    if (this.profile && roleRequired) {
+      return userRoles.some((role) => rolesRequired.includes(role as UserRole));
+    }
+
+    return false;
+  };
+
   constructor() {
     makeObservable(this, {
       profile: observable,
@@ -106,8 +124,10 @@ export const ProfileStoreProvider = ({ children }: { children: React.ReactNode }
 
 export const useProfileStore = () => {
   const store = useContext(ProfileStoreContext);
+
   if (!store) {
     throw new Error('useProfileStore must be used within ProfileStoreProvider');
   }
+
   return store;
 };