feat(cohorts): enable cohort pagination #27422
Conversation
|
Size Change: +7 B (0%) Total Size: 1.13 MB ℹ️ View Unchanged
|
📸 UI snapshots have been updated2 snapshot changes in total. 0 added, 2 modified, 0 deleted:
Triggered by this commit. |
| @@ -142,7 +142,7 @@ export function Cohorts(): JSX.Element { | |||
| productKey={ProductKey.COHORTS} | |||
| thingName="cohort" | |||
| description="Use cohorts to group people together, such as users who used your app in the last week, or people who viewed the signup page but didn’t convert." | |||
| isEmpty={cohorts?.length == 0 && !cohortsLoading} | |||
| isEmpty={cohorts.count == 0 && !cohortsLoading && !searchTerm} | |||
There was a problem hiding this comment.
I don't want to show the "create new cohort" option if the cohort list has filters applied
| pagination={pagination} | ||
| dataSource={cohorts.results} |
There was a problem hiding this comment.
the pagination and data are now controlled exclusively by the logic, and not some mix of react state management and the logic. And now pagination actually works (it didn't beforehand 😓 )
| search_query = self.request.query_params.get("search", None) | ||
| if search_query: | ||
| queryset = queryset.filter(name__icontains=search_query) |
There was a problem hiding this comment.
added search functionality to this endpoint using the built-in django ORM search.
| @@ -1506,16 +1506,21 @@ const api = { | |||
| async duplicate(cohortId: CohortType['id']): Promise<CohortType> { | |||
| return await new ApiRequest().cohortsDuplicate(cohortId).get() | |||
| }, | |||
| async list(): Promise<PaginatedResponse<CohortType>> { | |||
| // TODO: Remove hard limit and paginate cohorts | |||
| return await new ApiRequest().cohorts().withQueryString('limit=600').get() | |||
There was a problem hiding this comment.
we used to cap the limit at 600, which was causing a problem with returning the cohort name here: https://posthog.slack.com/archives/C07Q2U4BH4L/p1734442912694879
📸 UI snapshots have been updated6 snapshot changes in total. 0 added, 6 modified, 0 deleted:
Triggered by this commit. |
| const { searchParams } = useValues(router) | ||
| const [searchTerm, setSearchTerm] = useState<string>('') | ||
| const [searchTerm, setSearchTerm] = useState(cohortFilters.search || '') |
There was a problem hiding this comment.
nit: I know you didn't add this, but feels odd to still need a useState for a piece of state that's already being written and read from kea logic via cohortFilters, i would think we could do away with it?
| @@ -60,7 +60,7 @@ export function ActionsPie({ inSharedMode, showPersonsModal = true, context }: C | |||
| return formatBreakdownLabel( | |||
| item.breakdown_value, | |||
| breakdownFilter, | |||
| cohorts, | |||
| cohorts.results, | |||
Co-authored-by: github-actions <41898282+github-actions[bot]@users.noreply.github.com>
Problem
We stopped showing cohort names for cohorts past the 600th index because we couldn't fetch them without cohorts logic: https://posthog.slack.com/archives/C07Q2U4BH4L/p1734442912694879
Fix
Paginate cohorts, now we can return all of them if needed
Demo
https://www.loom.com/share/ec8c6d73952c4042849cfdab23a9dc69