Refactor code

src/features/explorer/components/filters.tsx

@@ -305,7 +305,8 @@ const CreateFilter = () => {
 const MediaFilter = () => {
   const intl = useIntl();
   const dispatch = useAppDispatch();
-  const filters = useAppSelector((state) => state.search_filter).slice(4, 8);
+  const filters = useAppSelector((state) => state.search_filter.filter(filter => ['all', 'image only', 'video only', 'no media'].includes(filter.name.toLowerCase())));
+    
 
   const mediaFilters = useMemo(() => ({
     all: intl.formatMessage(messages.all),

src/features/explorer/components/popular-accounts.tsx

@@ -20,6 +20,8 @@ import {
   useSuggestions,
 } from 'soapbox/queries/suggestions.ts';
 
+import 'swiper/css/navigation';
+import 'swiper/css/pagination';
 import 'swiper/css';
 
 const PopularAccounts = ({ id }: { id: string }) => {