diff --git a/src/client/components/msComponent/MSComponentDetailed.tsx b/src/client/components/msComponent/MSComponentDetailed.tsx
index addfef72..391df4ba 100644
--- a/src/client/components/msComponent/MSComponentDetailed.tsx
+++ b/src/client/components/msComponent/MSComponentDetailed.tsx
@@ -190,7 +190,6 @@ export const ComponentDetailedDesktop = (props: {data?: ComponentCommonApiJson,
             {error !== undefined && error !== null ? <ErrorAlert error={error}/> : undefined}
             {warning !== undefined && warning !== null ? <ErrorAlert error={warning} status="warning"/> : undefined}
             <MSErrorBoundary>{props.live ? <PlayersContainerFetchable nowPlaying={isSource ? undefined : true} data={props.data}/> : <PlayersContainer nowPlaying={isSource ? undefined : true} data={props.data} live={props.live}/>}</MSErrorBoundary>
-            <Heading size="3xl" width="100%">{isComponentTypeSource(props.data.mode) ? 'Plays' : 'Scrobbles'}</Heading>
             <MSErrorBoundary><ListContainerFilterable render="virtDynamic" componentType={props.data.mode} componentId={props.data.id}/></MSErrorBoundary>
         </Flex>
         </MSErrorBoundary>
diff --git a/src/client/components/playActivity/ActivityList.tsx b/src/client/components/playActivity/ActivityList.tsx
index 9f653a42..360a4091 100644
--- a/src/client/components/playActivity/ActivityList.tsx
+++ b/src/client/components/playActivity/ActivityList.tsx
@@ -1,4 +1,4 @@
-import { Accordion, Container, Stack } from '@chakra-ui/react';
+import { Accordion, Container, Stack, Heading } from '@chakra-ui/react';
 import { useSSEAnyEvent, useSSEContext } from '@flamefrontend/sse-runtime-react';
 import { type InfiniteData, useInfiniteQuery, type UseInfiniteQueryResult, useQueryClient } from '@tanstack/react-query';
 import dayjs from 'dayjs';
@@ -9,7 +9,7 @@ import type {ComponentType} from '../../../core/Atomic.js';
 import { type QueryPlaysOptsJsonRefreshable, tanQueries } from '../../queries/index.js';
 import { ActivityDetailFetchable, ActivityDetails, ActivitySummary, ActivitySummaryFetchable, ActivitySummarySkeleton } from '../ActivityDetail.js';
 import { ErrorAlert } from '../ErrorAlert.js';
-import { ListFilters, todayRange } from './ListFilters.js';
+import { ListFilters, ListRefereshButton, todayRange } from './ListFilters.js';
 import { type ActivityLogProps, generateGroupPlays, GroupHeader } from './ListParts.js';
 import { NoPlayResults, VirtualizedListDynamic } from './VirtualListDynamic.js';
 import { VirtualizedListExp } from './VirtualListExperimental.js';
@@ -262,6 +262,7 @@ const playInWindow = (data: PlayApiCommonDetailed, query: QueryPlaysOptsJson): b
 }
 
 export const ListContainerFilterable = (props: { componentId: number, componentType: ComponentType } & Pick<ComponentProps<typeof ActivityList>, 'render'>) => {
+  const {componentType} = props;
   const [filters, setFilter] = useState<QueryPlaysOptsJsonRefreshable>({
     playedAt: {
       type: 'between',
@@ -273,7 +274,8 @@ export const ListContainerFilterable = (props: { componentId: number, componentT
   });
   return (
     <Stack width="100%" gap="4">
-      <ListFilters componentType={props.componentType} componentId={props.componentId} filters={filters} onChange={setFilter}/>
+      <Heading size="3xl" width="100%">{componentType === 'source' ? 'Plays' : 'Scrobbles'}<ListRefereshButton size="md" componentId={props.componentId} filters={filters}/></Heading>
+      <ListFilters componentType={props.componentType} filters={filters} onChange={setFilter}/>
       <ListContainerFetchable {...props} filters={filters} />
     </Stack>
   )
diff --git a/src/client/components/playActivity/ListFilters.tsx b/src/client/components/playActivity/ListFilters.tsx
index f312c788..ca1a0d04 100644
--- a/src/client/components/playActivity/ListFilters.tsx
+++ b/src/client/components/playActivity/ListFilters.tsx
@@ -1,4 +1,4 @@
-import { Button, Card, createListCollection, DatePicker, Flex, HStack, Portal, Select, Span, TagsInput, useSelectContext, VStack, Wrap } from '@chakra-ui/react';
+import { Button, Card, createListCollection, DatePicker, Flex, HStack, Portal, Select, Span, TagsInput, useSelectContext, VStack, Wrap, type IconProps } from '@chakra-ui/react';
 import type {
     ZonedDateTime
 } from "@internationalized/date";
@@ -255,16 +255,12 @@ export const ListFilters = (props: {
     loading?: boolean
     filters: QueryPlaysOptsJsonRefreshable
     componentType: ComponentType,
-    componentId: number
 }) => {
     const {
         filters,
         onChange,
-        componentId,
     } = props;
 
-    const queryClient = useQueryClient();
-
     const setState = useCallback((val: PlayStateUI[]) => {
         const {
             state,
@@ -299,26 +295,9 @@ export const ListFilters = (props: {
         onChange({...rest, text: val});
     }, [onChange, filters]);
 
-    const onRefresh = useCallback(() => {
-    queryClient.invalidateQueries({
-        queryKey: tanQueries.activities.list(componentId, filters).queryKey
-    });
-    // const nonce = nanoid();
-    // const {
-    //     ...rest
-    // } = filters;
-    // console.log(`Adding nonce for refresh ${nonce}`);
-    // onChange({...rest, nonce});
-    }, [componentId, filters]);
-
-    const { isFetching } = useQueryWatcher(tanQueries.activities.list(componentId, filters).queryKey)
-
     return (
         <Card.Root size="sm" variant="outline">
-            <Card.Header {...cardHeaderSeparator}>
-                <HStack>Filters <RefreshButton variant="ghost" size="sm" loading={isFetching} onClick={(e) => onRefresh()}/></HStack>
-            </Card.Header>
-            <Card.Body px="3" py="4">
+            <Card.Body>
                 <Wrap gap="5">
                     <PhraseFilter value={filters.text} onChange={setPhrases} />
                     <PlayStateFilter value={filters.state} onChange={setState} mode={props.componentType} />
@@ -328,4 +307,23 @@ export const ListFilters = (props: {
         </Card.Root>
     )
 
+}
+
+export const ListRefereshButton = (props: ComponentProps<typeof RefreshButton> & {componentId: number, filters: QueryPlaysOptsJsonRefreshable}) => {
+    const {
+        componentId,
+        filters,
+        ...rest
+    } = props;
+    const queryClient = useQueryClient();
+    
+    const onRefresh = useCallback(() => {
+        queryClient.invalidateQueries({
+            queryKey: tanQueries.activities.list(componentId, filters).queryKey
+        });
+    }, [componentId, filters]);
+
+    const { isFetching } = useQueryWatcher(tanQueries.activities.list(componentId, filters).queryKey)
+
+    return <RefreshButton variant="ghost" size="sm" {...rest} loading={isFetching} onClick={(e) => onRefresh()}/>
 }
\ No newline at end of file