diff --git a/components/filters/FilterBar/index.tsx b/components/filters/FilterBar/index.tsx
index 421bf9d4..aea4ed38 100644
--- a/components/filters/FilterBar/index.tsx
+++ b/components/filters/FilterBar/index.tsx
@@ -21,9 +21,10 @@ interface Props {
   children: React.ReactNode
   scrolled: boolean
   element?: number
-  raidSlug?: string
+  raid?: string
   recency?: number
   onFilter: (filters: FilterSet) => void
+  onAdvancedFilter: (filters: FilterSet) => void
 }
 
 const FilterBar = (props: Props) => {
@@ -55,10 +56,10 @@ const FilterBar = (props: Props) => {
     const raid = appState.raidGroups
       .filter((group) => group.section > 0)
       .flatMap((group) => group.raids)
-      .find((raid) => raid.slug === props.raidSlug)
+      .find((raid) => raid.id === props.raid)
 
     setCurrentRaid(raid)
-  }, [props.raidSlug])
+  }, [props.raid])
 
   useEffect(() => {
     // Fetch user's advanced filters
@@ -91,12 +92,12 @@ const FilterBar = (props: Props) => {
   }
 
   function raidSelectChanged(raid?: Raid) {
-    props.onFilter({ raidSlug: raid?.slug, ...advancedFilters })
+    props.onFilter({ raid: raid?.slug, ...advancedFilters })
   }
 
   function handleAdvancedFiltersChanged(filters: FilterSet) {
     setAdvancedFilters(filters)
-    props.onFilter(filters)
+    props.onAdvancedFilter(filters)
   }
 
   function onSelectChange(name: 'element' | 'recency') {
diff --git a/components/raids/RaidCombobox/index.tsx b/components/raids/RaidCombobox/index.tsx
index 0cc2a26c..1142c8c5 100644
--- a/components/raids/RaidCombobox/index.tsx
+++ b/components/raids/RaidCombobox/index.tsx
@@ -112,7 +112,7 @@ const RaidCombobox = (props: Props) => {
 
   // Fetch all raids on mount
   useEffect(() => {
-    api.raidGroups().then((response) => sortGroups(response.data))
+    sortGroups(appState.raidGroups)
   }, [])
 
   // Set current raid and section when the component mounts
@@ -136,6 +136,8 @@ const RaidCombobox = (props: Props) => {
       if (appState.party.raid && appState.party.raid.group.section > 0)
         setCurrentSection(props.currentRaid.group.section)
       else setCurrentSection(1)
+    } else {
+      setCurrentRaid(undefined)
     }
   }, [props.currentRaid])
 
@@ -224,7 +226,9 @@ const RaidCombobox = (props: Props) => {
         if (group.section > 0) sections[group.section - 1].push(group)
       })
 
-      setFarmingRaid(groups[0].raids[0])
+      if (groups[0]) {
+        setFarmingRaid(groups[0].raids[0])
+      }
 
       setSections(sections)
     },
diff --git a/pages/[username].tsx b/pages/[username].tsx
index 5d429361..808b58ee 100644
--- a/pages/[username].tsx
+++ b/pages/[username].tsx
@@ -1,6 +1,5 @@
 import React, { useCallback, useEffect, useState } from 'react'
 import InfiniteScroll from 'react-infinite-scroll-component'
-import { getCookie } from 'cookies-next'
 import { queryTypes, useQueryState } from 'next-usequerystate'
 import { useRouter } from 'next/router'
 import { useTranslation } from 'next-i18next'
@@ -53,13 +52,12 @@ const ProfileRoute: React.FC<Props> = ({
   const { t } = useTranslation('common')
 
   // Set up app-specific states
-  const [raidsLoading, setRaidsLoading] = useState(true)
+  const [mounted, setMounted] = useState(false)
   const [scrolled, setScrolled] = useState(false)
 
   // Set up page-specific states
   const [parties, setParties] = useState<Party[]>([])
   const [raids, setRaids] = useState<Raid[]>()
-  const [raid, setRaid] = useState<Raid>()
 
   // Set up infinite scrolling-related states
   const [recordCount, setRecordCount] = useState(0)
@@ -74,9 +72,15 @@ const ProfileRoute: React.FC<Props> = ({
     parse: (query: string) => parseElement(query),
     serialize: (value) => serializeElement(value),
   })
-  const [raidSlug, setRaidSlug] = useQueryState('raid', {
+  const [raid, setRaid] = useQueryState('raid', {
     defaultValue: 'all',
     history: 'push',
+    parse: (query: string) => {
+      const raids = context?.raidGroups.flatMap((group) => group.raids)
+      const raid = raids?.find((r: Raid) => r.slug === query)
+      return raid ? raid.id : 'all'
+    },
+    serialize: (value) => value,
   })
   const [recency, setRecency] = useQueryState('recency', {
     defaultValue: -1,
@@ -113,6 +117,7 @@ const ProfileRoute: React.FC<Props> = ({
       setTotalPages(context.pagination.totalPages)
       setRecordCount(context.pagination.count)
       replaceResults(context.pagination.count, context.teams)
+      appState.raidGroups = context.raidGroups
       appState.version = version
     }
     setCurrentPage(1)
@@ -139,7 +144,7 @@ const ProfileRoute: React.FC<Props> = ({
       const filters = {
         params: {
           element: element != -1 ? element : undefined,
-          raid: raid ? raid.id : undefined,
+          raid: raid === 'all' ? undefined : raid,
           recency: recency != -1 ? recency : undefined,
           page: currentPage,
           ...advancedFilters,
@@ -183,14 +188,8 @@ const ProfileRoute: React.FC<Props> = ({
   // Fetch all raids on mount, then find the raid in the URL if present
   useEffect(() => {
     api.endpoints.raids.getAll().then((response) => {
-      setRaids(response.data)
-
-      setRaidsLoading(false)
-
-      const raid = response.data.find((r: Raid) => r.slug === raidSlug)
-      setRaid(raid)
-
-      return raid
+      const raids = appState.raidGroups.flatMap((group) => group.raids)
+      setRaids(raids)
     })
   }, [setRaids])
 
@@ -198,7 +197,12 @@ const ProfileRoute: React.FC<Props> = ({
   // fetch all teams again.
   useDidMountEffect(() => {
     setCurrentPage(1)
-    fetchProfile({ replace: true })
+
+    if (mounted) {
+      fetchProfile({ replace: true })
+    }
+
+    setMounted(true)
   }, [username, element, raid, recency, advancedFilters])
 
   // When the page changes, fetch all teams again.
@@ -206,25 +210,18 @@ const ProfileRoute: React.FC<Props> = ({
     // Current page changed
     if (currentPage > 1) fetchProfile({ replace: false })
     else if (currentPage == 1) fetchProfile({ replace: true })
+    setMounted(true)
   }, [currentPage])
 
   // Receive filters from the filter bar
   function receiveFilters(filters: FilterSet) {
     if (filters.element == 0) setElement(0, { shallow: true })
     else if (filters.element) setElement(filters.element, { shallow: true })
-
-    if (raids && filters.raidSlug) {
-      const raid = raids.find((raid) => raid.slug === filters.raidSlug)
-      setRaid(raid)
-      setRaidSlug(filters.raidSlug, { shallow: true })
-    }
-
     if (filters.recency) setRecency(filters.recency, { shallow: true })
+    if (filters.raid) setRaid(filters.raid, { shallow: true })
+  }
 
-    delete filters.element
-    delete filters.raidSlug
-    delete filters.recency
-
+  function receiveAdvancedFilters(filters: FilterSet) {
     setAdvancedFilters(filters)
   }
 
@@ -273,15 +270,16 @@ const ProfileRoute: React.FC<Props> = ({
 
   if (context) {
     return (
-      <div id="Profile">
+      <div className="profile">
         {pageHead()}
         <FilterBar
           defaultFilterset={permissiveFilterset}
+          onAdvancedFilter={receiveAdvancedFilters}
           onFilter={receiveFilters}
           persistFilters={false}
           scrolled={scrolled}
           element={element}
-          raidSlug={raidSlug ? raidSlug : undefined}
+          raid={raid}
           recency={recency}
         >
           <UserInfo user={context.user!} />
diff --git a/pages/_app.tsx b/pages/_app.tsx
index 92ff0856..60381287 100644
--- a/pages/_app.tsx
+++ b/pages/_app.tsx
@@ -25,6 +25,7 @@ import '../styles/globals.scss'
 
 function MyApp({ Component, pageProps }: AppProps) {
   const { t } = useTranslation('common')
+  const [mounted, setMounted] = useState(false)
   const [refresh, setRefresh] = useState(false)
 
   // Subscribe to app state to listen for account changes and
diff --git a/pages/saved.tsx b/pages/saved.tsx
index 4725d729..1e130896 100644
--- a/pages/saved.tsx
+++ b/pages/saved.tsx
@@ -1,6 +1,5 @@
 import React, { useCallback, useEffect, useState } from 'react'
 import InfiniteScroll from 'react-infinite-scroll-component'
-import { getCookie } from 'cookies-next'
 import { queryTypes, useQueryState } from 'next-usequerystate'
 import { useRouter } from 'next/router'
 import { useTranslation } from 'next-i18next'
@@ -52,13 +51,12 @@ const SavedRoute: React.FC<Props> = ({
   const { t } = useTranslation('common')
 
   // Set up app-specific states
-  const [raidsLoading, setRaidsLoading] = useState(true)
+  const [mounted, setMounted] = useState(false)
   const [scrolled, setScrolled] = useState(false)
 
   // Set up page-specific states
   const [parties, setParties] = useState<Party[]>([])
   const [raids, setRaids] = useState<Raid[]>()
-  const [raid, setRaid] = useState<Raid>()
 
   // Set up infinite scrolling-related states
   const [recordCount, setRecordCount] = useState(0)
@@ -73,9 +71,15 @@ const SavedRoute: React.FC<Props> = ({
     parse: (query: string) => parseElement(query),
     serialize: (value) => serializeElement(value),
   })
-  const [raidSlug, setRaidSlug] = useQueryState('raid', {
+  const [raid, setRaid] = useQueryState('raid', {
     defaultValue: 'all',
     history: 'push',
+    parse: (query: string) => {
+      const raids = context?.raidGroups.flatMap((group) => group.raids)
+      const raid = raids?.find((r: Raid) => r.slug === query)
+      return raid ? raid.id : 'all'
+    },
+    serialize: (value) => value,
   })
   const [recency, setRecency] = useQueryState('recency', {
     defaultValue: -1,
@@ -112,6 +116,7 @@ const SavedRoute: React.FC<Props> = ({
       setTotalPages(context.pagination.totalPages)
       setRecordCount(context.pagination.count)
       replaceResults(context.pagination.count, context.teams)
+      appState.raidGroups = context.raidGroups
       appState.version = version
     }
     setCurrentPage(1)
@@ -138,7 +143,7 @@ const SavedRoute: React.FC<Props> = ({
         [key: string]: any
       } = {
         element: element !== -1 ? element : undefined,
-        raid: raid ? raid.id : undefined,
+        raid: raid === 'all' ? undefined : raid,
         recency: recency !== -1 ? recency : undefined,
         page: currentPage,
         ...advancedFilters,
@@ -186,14 +191,8 @@ const SavedRoute: React.FC<Props> = ({
   // Fetch all raids on mount, then find the raid in the URL if present
   useEffect(() => {
     api.endpoints.raids.getAll().then((response) => {
-      setRaids(response.data)
-
-      setRaidsLoading(false)
-
-      const raid = response.data.find((r: Raid) => r.slug === raidSlug)
-      setRaid(raid)
-
-      return raid
+      const raids = appState.raidGroups.flatMap((group) => group.raids)
+      setRaids(raids)
     })
   }, [setRaids])
 
@@ -201,7 +200,12 @@ const SavedRoute: React.FC<Props> = ({
   // fetch all teams again.
   useDidMountEffect(() => {
     setCurrentPage(1)
-    fetchTeams({ replace: true })
+
+    if (mounted) {
+      fetchTeams({ replace: true })
+    }
+
+    setMounted(true)
   }, [element, raid, recency, advancedFilters])
 
   // When the page changes, fetch all teams again.
@@ -209,25 +213,18 @@ const SavedRoute: React.FC<Props> = ({
     // Current page changed
     if (currentPage > 1) fetchTeams({ replace: false })
     else if (currentPage == 1) fetchTeams({ replace: true })
+    setMounted(true)
   }, [currentPage])
 
   // Receive filters from the filter bar
   function receiveFilters(filters: FilterSet) {
     if (filters.element == 0) setElement(0, { shallow: true })
     else if (filters.element) setElement(filters.element, { shallow: true })
-
-    if (raids && filters.raidSlug) {
-      const raid = raids.find((raid) => raid.slug === filters.raidSlug)
-      setRaid(raid)
-      setRaidSlug(filters.raidSlug, { shallow: true })
-    }
-
     if (filters.recency) setRecency(filters.recency, { shallow: true })
+    if (filters.raid) setRaid(filters.raid, { shallow: true })
+  }
 
-    delete filters.element
-    delete filters.raidSlug
-    delete filters.recency
-
+  function receiveAdvancedFilters(filters: FilterSet) {
     setAdvancedFilters(filters)
   }
 
@@ -313,15 +310,16 @@ const SavedRoute: React.FC<Props> = ({
 
   if (context) {
     return (
-      <div id="Teams">
+      <div className="teams">
         {pageHead()}
         <FilterBar
           defaultFilterset={permissiveFilterset}
           onFilter={receiveFilters}
+          onAdvancedFilter={receiveAdvancedFilters}
           persistFilters={false}
           scrolled={scrolled}
           element={element}
-          raidSlug={raidSlug ? raidSlug : undefined}
+          raid={raid}
           recency={recency}
         >
           <h1>{t('saved.title')}</h1>
diff --git a/pages/teams.tsx b/pages/teams.tsx
index 0d42a956..d06c3027 100644
--- a/pages/teams.tsx
+++ b/pages/teams.tsx
@@ -52,13 +52,12 @@ const TeamsRoute: React.FC<Props> = ({
   const { t } = useTranslation('common')
 
   // Set up app-specific states
-  const [raidsLoading, setRaidsLoading] = useState(true)
+  const [mounted, setMounted] = useState(false)
   const [scrolled, setScrolled] = useState(false)
 
   // Set up page-specific states
   const [parties, setParties] = useState<Party[]>([])
   const [raids, setRaids] = useState<Raid[]>()
-  const [raid, setRaid] = useState<Raid>()
 
   // Set up infinite scrolling-related states
   const [recordCount, setRecordCount] = useState(0)
@@ -73,9 +72,15 @@ const TeamsRoute: React.FC<Props> = ({
     parse: (query: string) => parseElement(query),
     serialize: (value) => serializeElement(value),
   })
-  const [raidSlug, setRaidSlug] = useQueryState('raid', {
+  const [raid, setRaid] = useQueryState('raid', {
     defaultValue: 'all',
     history: 'push',
+    parse: (query: string) => {
+      const raids = context?.raidGroups.flatMap((group) => group.raids)
+      const raid = raids?.find((r: Raid) => r.slug === query)
+      return raid ? raid.id : 'all'
+    },
+    serialize: (value) => value,
   })
   const [recency, setRecency] = useQueryState('recency', {
     defaultValue: -1,
@@ -149,7 +154,7 @@ const TeamsRoute: React.FC<Props> = ({
         [key: string]: any
       } = {
         element: element !== -1 ? element : undefined,
-        raid: raid ? raid.id : undefined,
+        raid: raid === 'all' ? undefined : raid,
         recency: recency !== -1 ? recency : undefined,
         page: currentPage,
         ...advancedFilters,
@@ -196,49 +201,39 @@ const TeamsRoute: React.FC<Props> = ({
 
   // Fetch all raids on mount, then find the raid in the URL if present
   useEffect(() => {
-    api.endpoints.raids.getAll().then((response) => {
-      setRaids(response.data)
-
-      setRaidsLoading(false)
-
-      const raid = response.data.find((r: Raid) => r.slug === raidSlug)
-      setRaid(raid)
-
-      return raid
-    })
+    const raids = appState.raidGroups.flatMap((group) => group.raids)
+    setRaids(raids)
   }, [setRaids])
 
   // When the element, raid or recency filter changes,
   // fetch all teams again.
   useDidMountEffect(() => {
     setCurrentPage(1)
-    fetchTeams({ replace: true })
+
+    if (mounted) {
+      fetchTeams({ replace: true })
+    }
+
+    setMounted(true)
   }, [element, raid, recency, advancedFilters])
 
   // When the page changes, fetch all teams again.
   useDidMountEffect(() => {
     // Current page changed
     if (currentPage > 1) fetchTeams({ replace: false })
-    else if (currentPage == 1) fetchTeams({ replace: true })
+    else if (currentPage == 1 && mounted) fetchTeams({ replace: true })
+    setMounted(true)
   }, [currentPage])
 
   // Receive filters from the filter bar
   function receiveFilters(filters: FilterSet) {
     if (filters.element == 0) setElement(0, { shallow: true })
     else if (filters.element) setElement(filters.element, { shallow: true })
-
-    if (raids && filters.raidSlug) {
-      const raid = raids.find((raid) => raid.slug === filters.raidSlug)
-      setRaid(raid)
-      setRaidSlug(filters.raidSlug, { shallow: true })
-    }
-
     if (filters.recency) setRecency(filters.recency, { shallow: true })
+    if (filters.raid) setRaid(filters.raid, { shallow: true })
+  }
 
-    delete filters.element
-    delete filters.raidSlug
-    delete filters.recency
-
+  function receiveAdvancedFilters(filters: FilterSet) {
     setAdvancedFilters(filters)
   }
 
@@ -324,15 +319,16 @@ const TeamsRoute: React.FC<Props> = ({
 
   if (context) {
     return (
-      <div id="Teams">
+      <div className="teams">
         {pageHead()}
         <FilterBar
           defaultFilterset={defaultFilterset}
           onFilter={receiveFilters}
+          onAdvancedFilter={receiveAdvancedFilters}
           persistFilters={true}
           scrolled={scrolled}
           element={element}
-          raidSlug={raidSlug ? raidSlug : undefined}
+          raid={raid}
           recency={recency}
         >
           <h1>{t('teams.title')}</h1>
diff --git a/styles/globals.scss b/styles/globals.scss
index 0281acf9..45cc6507 100644
--- a/styles/globals.scss
+++ b/styles/globals.scss
@@ -121,8 +121,8 @@ h5 {
 }
 
 // Used for collection pages
-#Teams,
-#Profile {
+.teams,
+.profile {
   display: flex;
   height: 100%;
   flex-direction: column;
diff --git a/types/FilterSet.d.ts b/types/FilterSet.d.ts
index 6022f40c..fc42195d 100644
--- a/types/FilterSet.d.ts
+++ b/types/FilterSet.d.ts
@@ -1,6 +1,6 @@
 interface FilterSet {
   element?: number
-  raidSlug?: string
+  raid?: string
   recency?: number
   full_auto?: number
   auto_guard?: number