Move home out of experimental!

web/hooks/use-group.ts

@@ -85,8 +85,10 @@ export const useMemberGroups = (userId: string | null | undefined) => {
 }
 
 export const useMemberGroupIds = (user: User | null | undefined) => {
+  const cachedGroups = useMemberGroups(user?.id)
+
   const [memberGroupIds, setMemberGroupIds] = useState<string[] | undefined>(
-    undefined
+    cachedGroups?.map((g) => g.id)
   )
 
   useEffect(() => {

web/pages/explore-groups.tsx

@@ -5,7 +5,7 @@ import { Page } from 'web/components/page'
 import { Title } from 'web/components/title'
 import { useMemberGroupIds, useTrendingGroups } from 'web/hooks/use-group'
 import { useUser } from 'web/hooks/use-user'
-import { GroupCard } from '../groups'
+import { GroupCard } from './groups'
 
 export default function Explore() {
   const user = useUser()

web/pages/home.tsx

@@ -1,47 +0,0 @@
-import { useRouter } from 'next/router'
-import { PencilAltIcon } from '@heroicons/react/solid'
-
-import { Page } from 'web/components/page'
-import { Col } from 'web/components/layout/col'
-import { ContractSearch } from 'web/components/contract-search'
-import { useTracking } from 'web/hooks/use-tracking'
-import { useUser } from 'web/hooks/use-user'
-import { track } from 'web/lib/service/analytics'
-import { useSaveReferral } from 'web/hooks/use-save-referral'
-import { usePrefetch } from 'web/hooks/use-prefetch'
-
-const Home = () => {
-  const user = useUser()
-  const router = useRouter()
-  useTracking('view home')
-
-  useSaveReferral()
-  usePrefetch(user?.id)
-
-  return (
-    <>
-      <Page>
-        <Col className="mx-auto w-full p-2">
-          <ContractSearch
-            user={user}
-            persistPrefix="home-search"
-            useQueryUrlParam={true}
-            headerClassName="sticky"
-          />
-        </Col>
-        <button
-          type="button"
-          className="fixed bottom-[70px] right-3 z-20 inline-flex items-center rounded-full border border-transparent bg-indigo-600 p-4 text-white shadow-sm hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 lg:hidden"
-          onClick={() => {
-            router.push('/create')
-            track('mobile create button')
-          }}
-        >
-          <PencilAltIcon className="h-7 w-7" aria-hidden="true" />
-        </button>
-      </Page>
-    </>
-  )
-}
-
-export default Home

web/pages/home/edit.tsx

@@ -47,7 +47,7 @@ function DoneButton(props: { className?: string }) {
   const { className } = props
 
   return (
-    <SiteLink href="/experimental/home">
+    <SiteLink href="/home">
       <Button
         size="lg"
         color="blue"

web/pages/home/index.tsx

@@ -203,7 +203,7 @@ function SearchSection(props: {
         noControls
         maxResults={6}
         headerClassName="sticky"
-        persistPrefix={`experimental-home-${sort}`}
+        persistPrefix={`home-${sort}`}
       />
     </Col>
   )
@@ -255,7 +255,7 @@ function DailyMoversSection(props: { userId: string | null | undefined }) {
 
   return (
     <Col className="gap-2">
-      <SectionHeader label="Daily movers" href="/experimental/daily-movers" />
+      <SectionHeader label="Daily movers" href="/daily-movers" />
       <ProbChangeTable changes={changes} />
     </Col>
   )
@@ -324,14 +324,11 @@ function TrendingGroupsSection(props: { user: User | null | undefined }) {
     (g) => !memberGroupIds.includes(g.id)
   )
   const count = 25
-  const chosenGroups = chooseRandomSubset(groups.slice(0, count), count)
+  const chosenGroups = groups.slice(0, count)
 
   return (
     <Col>
-      <SectionHeader
+      <SectionHeader label="Trending groups" href="/explore-groups">
-        label="Trending groups"
-        href="/experimental/explore-groups"
-      >
         <CustomizeButton />
       </SectionHeader>
       <Row className="flex-wrap gap-2">
@@ -368,7 +365,7 @@ function CustomizeButton() {
   return (
     <SiteLink
       className="mb-2 flex flex-row items-center text-xl hover:no-underline"
-      href="/experimental/home/edit"
+      href="/home/edit"
     >
       <Button size="lg" color="gray" className={clsx('flex gap-2')}>
         <AdjustmentsIcon