diff --git a/src/components/Home/TopSection/TopSection.tsx b/src/components/Home/TopSection/TopSection.tsx index e0aab992a2..8e721dc293 100644 --- a/src/components/Home/TopSection/TopSection.tsx +++ b/src/components/Home/TopSection/TopSection.tsx @@ -11,12 +11,16 @@ import { SectionHeading } from 'components/Home/SectionHeading' import { ProjectTag } from 'components/ProjectTags/ProjectTag' import { XLButton } from 'components/buttons/XLButton' import { HOMEPAGE } from 'constants/fathomEvents' -import { useTrendingProjects } from 'hooks/useProjects' +import { PV_V1 } from 'constants/pv' +import { + DEFAULT_TRENDING_PROJECTS_LIMIT, + useDBProjectsQuery, + useTrendingProjects, +} from 'hooks/useProjects' import { trackFathomGoal } from 'lib/fathom' import { ProjectTagName } from 'models/project-tags' import Link from 'next/link' - -const TRENDING_PROJECTS_LIMIT = 10 +import { getSubgraphIdForProject } from 'utils/graph' const HEADER_TAGS: ProjectTagName[] = [ 'dao', @@ -26,10 +30,40 @@ const HEADER_TAGS: ProjectTagName[] = [ 'business', ] +// These projects will render if there isn't enough trending projects. +const BACKUP_PROJECTS = [ + getSubgraphIdForProject(PV_V1, 199), // moondao + getSubgraphIdForProject(PV_V1, 36), // constituiondao + getSubgraphIdForProject(PV_V1, 323), // assange + // add more as needed +] + export function TopSection() { const { data: trendingProjects, isLoading } = useTrendingProjects( - TRENDING_PROJECTS_LIMIT, + DEFAULT_TRENDING_PROJECTS_LIMIT, ) + const { data: backupProjects } = useDBProjectsQuery({ + ids: BACKUP_PROJECTS, + }) + + const remainderProjectCount = + DEFAULT_TRENDING_PROJECTS_LIMIT - (trendingProjects?.length ?? 0) + + const renderBackup = + trendingProjects && backupProjects && remainderProjectCount + ? backupProjects + .slice(0, remainderProjectCount) + .filter( + p => + !trendingProjects + .map(proj => proj.projectId) + .includes(p.projectId), + ) + : [] + + const renderProjects = trendingProjects + ? [...trendingProjects, ...renderBackup] + : undefined return ( @@ -87,9 +121,9 @@ export function TopSection() { - {!isLoading && trendingProjects ? ( + {!isLoading && renderProjects ? ( ( + items={renderProjects?.map(p => ( ))} /> diff --git a/src/components/v2v3/V2V3Project/ProjectDashboard/components/CyclesPayoutsPanel/components/HistorySubPanel.tsx b/src/components/v2v3/V2V3Project/ProjectDashboard/components/CyclesPayoutsPanel/components/HistorySubPanel.tsx index 0898091de7..611c964ee9 100644 --- a/src/components/v2v3/V2V3Project/ProjectDashboard/components/CyclesPayoutsPanel/components/HistorySubPanel.tsx +++ b/src/components/v2v3/V2V3Project/ProjectDashboard/components/CyclesPayoutsPanel/components/HistorySubPanel.tsx @@ -22,10 +22,12 @@ import { HistoricalConfigurationPanel } from './HistoricalConfigurationPanel' export const HistorySubPanel = () => { const { projectId } = useProjectMetadata() + const { fundingCycle } = useProjectContext() const [isFetchingMore, setIsFetchingMore] = useState() const { data, fetchMore, loading, error } = usePastFundingCycles({ projectId, + currentFcNumber: fundingCycle?.number.toNumber() ?? 0, }) const isLoading = loading || isFetchingMore diff --git a/src/components/v2v3/V2V3Project/ProjectDashboard/components/CyclesPayoutsPanel/hooks/usePastFundingCycles.ts b/src/components/v2v3/V2V3Project/ProjectDashboard/components/CyclesPayoutsPanel/hooks/usePastFundingCycles.ts index 2049d2eede..01cc17be1e 100644 --- a/src/components/v2v3/V2V3Project/ProjectDashboard/components/CyclesPayoutsPanel/hooks/usePastFundingCycles.ts +++ b/src/components/v2v3/V2V3Project/ProjectDashboard/components/CyclesPayoutsPanel/hooks/usePastFundingCycles.ts @@ -4,25 +4,24 @@ import { useFundingCyclesQuery, } from 'generated/graphql' import { client } from 'lib/apollo/client' -import { useMemo } from 'react' const DEFAULT_PAGE_SIZE = 5 export function usePastFundingCycles({ projectId, + currentFcNumber, pageSize, }: { projectId: number | undefined + currentFcNumber: number | undefined pageSize?: number }) { - const now = useMemo(() => Math.floor(Date.now() / 1000), []) - return useFundingCyclesQuery({ client, variables: { where: { projectId, - endTimestamp_lt: now, // Only already ended + number_lt: currentFcNumber, }, orderBy: FundingCycle_OrderBy.number, orderDirection: OrderDirection.desc, diff --git a/src/hooks/useProjects.ts b/src/hooks/useProjects.ts index 2a71b7bf43..45cf22667a 100644 --- a/src/hooks/useProjects.ts +++ b/src/hooks/useProjects.ts @@ -87,6 +87,8 @@ export function useDBProjectsInfiniteQuery( ) } +export const DEFAULT_TRENDING_PROJECTS_LIMIT = 10 + export function useTrendingProjects(count: number) { return useQuery(['trending-projects', count], async () => { const res = await axios.get[]>( diff --git a/src/pages/api/projects/trending.ts b/src/pages/api/projects/trending.ts index f9871131df..fb5b3d5f86 100644 --- a/src/pages/api/projects/trending.ts +++ b/src/pages/api/projects/trending.ts @@ -36,7 +36,7 @@ const handler: NextApiHandler = async (req, res) => { query: TrendingProjectsDocument, variables: { where: { - // trendingScore_gt: '0', // Turned off because there wasn't sufficient number of projects to fulfill `first`. + trendingScore_gt: '0' as any, // eslint-disable-line @typescript-eslint/no-explicit-any ...(ARCHIVED_SUBGRAPH_IDS.length ? { id_not_in: ARCHIVED_SUBGRAPH_IDS } : {}), // `id_not_in: ` will return 0 results