Ai dashboard (#3338)

* 1st working version

* Move AI page into explore

* Update ai-contracts.ts

web/components/ai-content.tsx

@@ -0,0 +1,191 @@
+import { useEffect, useState } from 'react'
+import { Contract } from 'common/contract'
+import { getAiContracts } from './ai-contracts'
+
+import { LoadingIndicator } from 'web/components/widgets/loading-indicator'
+import { QueryUncontrolledTabs, Tab } from 'web/components/layout/tabs'
+import { Col } from 'web/components/layout/col'
+import { FeedContractCard } from 'web/components/contract/feed-contract-card'
+import { ContractsTable } from 'web/components/contract/contracts-table'
+import { HorizontalContractsCarousel } from './horizontal-contracts-carousel'
+
+export interface AiContentData {
+  newAiModel: Contract | null
+  closingSoonContracts: Contract[]
+  surveyContracts: Contract[]
+  shortBenchmarks: Contract[]
+  longBenchmarks: Contract[]
+  aiPolicyContracts: Contract[]
+  aiCompaniesContracts: Contract[]
+  recentActivityContracts: Contract[]
+  justResolvedContracts: Contract[]
+}
+
+async function getAiContentData(): Promise<AiContentData | null> {
+  try {
+    const aiContracts = await getAiContracts()
+    if (!aiContracts) return null
+
+    const {
+      surveyContracts,
+      closingSoonContracts,
+      shortBenchmarks,
+      longBenchmarks,
+      aiPolicyContracts,
+      aiCompaniesContracts,
+      newAiModel,
+      recentActivityContracts,
+      justResolvedContracts,
+    } = aiContracts
+
+    return {
+      newAiModel,
+      closingSoonContracts,
+      surveyContracts,
+      shortBenchmarks,
+      longBenchmarks,
+      aiPolicyContracts,
+      aiCompaniesContracts,
+      recentActivityContracts,
+      justResolvedContracts,
+    }
+  } catch (error) {
+    console.error('Error fetching AI contracts:', error)
+    return null
+  }
+}
+
+export function AiContent() {
+  const [data, setData] = useState<AiContentData | null>(null)
+  const [isLoading, setIsLoading] = useState(true)
+
+  useEffect(() => {
+    const fetchData = async () => {
+      try {
+        const aiData = await getAiContentData()
+        setData(aiData)
+      } catch (error) {
+        console.error(error)
+      } finally {
+        setIsLoading(false)
+      }
+    }
+    fetchData()
+  }, [])
+
+  if (isLoading) {
+    return <LoadingIndicator />
+  }
+
+  if (!data) {
+    return <div>No AI data found.</div>
+  }
+
+  const {
+    newAiModel,
+    closingSoonContracts,
+    surveyContracts,
+    shortBenchmarks,
+    longBenchmarks,
+    aiPolicyContracts,
+    aiCompaniesContracts,
+    recentActivityContracts,
+    justResolvedContracts,
+  } = data
+
+  const AI_TABS: Tab[] = [
+    {
+      title: 'Happening Now',
+      content: (
+        <Col className=" px-1 pt-2">
+          <HorizontalContractsCarousel
+            contracts={recentActivityContracts}
+            title="Recent Activity"
+            className="pt-2"
+          />
+
+          <HorizontalContractsCarousel
+            contracts={closingSoonContracts}
+            title="Closing Soon"
+            className=" pt-2"
+          />
+
+          <HorizontalContractsCarousel
+            contracts={justResolvedContracts}
+            title="Most Recently Resolved"
+            className=" pt-2"
+          />
+        </Col>
+      ),
+    },
+    {
+      title: 'Companies',
+      content: (
+        <Col className="mb-8 px-1">
+          <ContractsTable contracts={aiCompaniesContracts} />
+        </Col>
+      ),
+    },
+    {
+      title: 'AI Digest 2025',
+      content: (
+        <Col className="mb-8 px-1">
+          <div className="pb-2 pt-3">
+            Manifold has partnered with AI Digest to bring you high quality
+            markets on AI benchmarks and indicators in 2025.{' '}
+            <a
+              href="https://ai2025.org"
+              target="_blank"
+              className="text-primary-600 hover:underline"
+            >
+              Complete their survey
+            </a>{' '}
+            and trade on our corresponding markets!
+          </div>
+          <ContractsTable contracts={surveyContracts} />
+        </Col>
+      ),
+    },
+    {
+      title: 'Short Benchmarks',
+      content: (
+        <Col className="mt-1 px-1">
+          <ContractsTable contracts={shortBenchmarks} />
+        </Col>
+      ),
+    },
+    {
+      title: 'Long Benchmarks',
+      content: (
+        <Col className="mb-8 px-1">
+          <ContractsTable contracts={longBenchmarks} />
+        </Col>
+      ),
+    },
+    {
+      title: 'Policy',
+      content: (
+        <Col className="mb-8 px-1">
+          <ContractsTable contracts={aiPolicyContracts} />
+        </Col>
+      ),
+    },
+  ]
+
+  return (
+    <Col className="px-1">
+      {newAiModel && (
+        <Col className="pb-4">
+          <FeedContractCard contract={newAiModel} />
+        </Col>
+      )}
+      <QueryUncontrolledTabs
+        className="bg-canvas-50 sticky top-[2.9rem] z-10"
+        tabs={AI_TABS}
+        defaultIndex={0}
+        labelsParentClassName="mr-4"
+        trackingName="ai-tabs"
+      />
+    </Col>
+  )
+}

web/components/ai-contracts.ts

@@ -0,0 +1,138 @@
+import { Contract } from 'common/contract'
+import { api } from 'web/lib/api/api'
+import { getContract, getContracts } from '../../common/src/supabase/contracts'
+import { db } from 'web/lib/supabase/db'
+
+export const aiSurveyContractIds = [
+  '9cy09yhQd2',
+  'hRU0NuZhSy',
+  'AELz6Q2usA',
+  'EzN2u8OQq2',
+  'Uul0EZt0td',
+  'z8sPq6NSqQ',
+  'dL2Rl06NUI',
+  'EQqSEhAuOd',
+  'Uu5q0usuQg',
+]
+
+export const shortAiBenchmarkContractIds = [
+  'CkzcqS69tr1hOS56mjZY',
+  '4cobxeU2KSBo5BPSFCKe',
+  'tXYiojNCLmLSJVfGUGK5',
+  'hhnUhg5pty',
+  'SfBHzKtfZhIqeV2gcLuZ',
+  'BcJbQTDX1rdmaLYGKUOz',
+  'osbD00CDUgcQGPHhH0mn',
+  '7yaoogxozx',
+  'INyzgSlIAq',
+]
+
+export const longAiBenchmarkContractIds = [
+  'dI5U6ps6IP',
+  'DKWUoTfIrbxHwQloZLG3',
+  'j7IOXyBOzFiYHtVFXWP3',
+  'Red8L367S1DreBesRRu3',
+  'ymaev6DmK5AlzKdaTqOt',
+  'HJdflF0LTJwPNKQmaf6G',
+]
+
+export const aiPolicyContractIds = [
+  '0YCYyjBNcZ2XW9Qer4sD',
+  'Twyw0JCFW7VXfa4vl0d6',
+  'zo6v3r95mq',
+  'PEAh4AsufK9Xdy8kKker',
+  'Lb3FC1lLBtU5KySEbVzJ',
+  'Uxu9dll7SdYVTGUEmebV',
+  'p83DN95Vy7eQPXRsSgpR',
+  'U58ue9CkiHRqrgmPlr0S',
+  'DKtHVhTHJu2lcEfwmnlP',
+  '0odd65dzft',
+  'QuNoQ7wHgdFBetB3K4jT',
+  'g6Cz8nQZy5',
+  '8wp0xc905e',
+]
+
+export const aiCompaniesContractIds = [
+  'uA88Oc5Uqs',
+  '5M2I0YYBYCstkwDI3yDK',
+  'BmK6wCA9ol7sjaqB9ZGt',
+  'rALUJE3xQLyBEGoW1j9Q',
+  'C8MtRn2ixX8Y0rV2Oqcy',
+  'h6yuo5ag84',
+  'lp17jc8bxl',
+  'iz2ovejkv3',
+  'UpfNoFH6Q6sU3HAZ2SzR',
+  'RB1446KxI8aNMAiaIEDl',
+  'a9QwFRF9xYWbjhGi4dde',
+  '1m08c366fh',
+  'cnowgnMl9y1YEhE32NUG',
+]
+
+export async function getAiContracts(): Promise<{
+  surveyContracts: Contract[]
+  closingSoonContracts: Contract[]
+  shortBenchmarks: Contract[]
+  longBenchmarks: Contract[]
+  aiPolicyContracts: Contract[]
+  aiCompaniesContracts: Contract[]
+  recentActivityContracts: Contract[]
+  justResolvedContracts: Contract[]
+  newAiModel: Contract | null
+}> {
+  const fetchContractsByIds = async (ids: string[]): Promise<Contract[]> => {
+    const contracts = await Promise.all(ids.map((id) => getContract(db, id)))
+    return contracts.filter((c): c is Contract => c !== null)
+  }
+
+  const [
+    surveyContracts,
+    closingSoonContracts,
+    shortBenchmarks,
+    longBenchmarks,
+    aiPolicyContracts,
+    aiCompaniesContracts,
+    recentActivityContracts,
+    justResolvedContracts,
+    newAiModel,
+  ] = await Promise.all([
+    getContracts(db, aiSurveyContractIds, 'id'),
+    api('search-markets-full', {
+      term: '',
+      sort: 'most-popular',
+      filter: 'closing-month',
+      limit: 7,
+      gids: 'yEWvvwFFIqzf8JklMewp',
+    }),
+    fetchContractsByIds(shortAiBenchmarkContractIds),
+    fetchContractsByIds(longAiBenchmarkContractIds),
+    fetchContractsByIds(aiPolicyContractIds),
+    fetchContractsByIds(aiCompaniesContractIds),
+    api('search-markets-full', {
+      term: '',
+      sort: 'last-updated',
+      filter: 'open',
+      limit: 7,
+      gids: 'yEWvvwFFIqzf8JklMewp',
+    }),
+    api('search-markets-full', {
+      term: '',
+      sort: 'resolve-date',
+      filter: 'all',
+      limit: 7,
+      gids: 'yEWvvwFFIqzf8JklMewp',
+    }),
+    getContract(db, 'sPsE8AZl06'), // New AI Model releases, update monthly with new contract
+  ])
+
+  return {
+    surveyContracts,
+    closingSoonContracts,
+    shortBenchmarks,
+    longBenchmarks,
+    aiPolicyContracts,
+    aiCompaniesContracts,
+    recentActivityContracts,
+    justResolvedContracts,
+    newAiModel,
+  }
+}