-
Notifications
You must be signed in to change notification settings - Fork 2.5k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
refactor webhookAnalytics call and enrich analytics module (#8253)
**TLDR** Refactor WebhoonAnalytics Graph to a more abstract version AnalyticsGraph (in analytics module). Thus enabling the components to be used on different instances (ex: new endpoint, new kind of graph). **In order to test:** 1. Set ANALYTICS_ENABLED to true 2. Set TINYBIRD_JWT_TOKEN to the ADMIN token from the workspace twenty_analytics_playground 3. Set TINYBIRD_JWT_TOKEN to the datasource or your admin token from the workspace twenty_analytics_playground 4. Create a Webhook in twenty and set wich events it needs to track 5. Run twenty-worker in order to make the webhooks work. 6. Do your tasks in order to populate the data 7. Enter to settings> webhook>your webhook and the statistics section should be displayed. --------- Co-authored-by: Félix Malfait <[email protected]>
- Loading branch information
1 parent
f9c076d
commit f06cdbd
Showing
62 changed files
with
1,429 additions
and
539 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
32 changes: 32 additions & 0 deletions
32
packages/twenty-front/src/modules/analytics/components/AnalyticsGraphEffect.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,32 @@ | ||
| import { useGraphData } from '@/analytics/hooks/useGraphData'; | ||
| import { analyticsGraphDataComponentState } from '@/analytics/states/analyticsGraphDataComponentState'; | ||
| import { AnalyticsComponentProps as AnalyticsGraphEffectProps } from '@/analytics/types/AnalyticsComponentProps'; | ||
| import { computeAnalyticsGraphDataFunction } from '@/analytics/utils/computeAnalyticsGraphDataFunction'; | ||
| import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useSetRecoilComponentStateV2'; | ||
| import { useState } from 'react'; | ||
|
|
||
| export const AnalyticsGraphEffect = ({ | ||
| recordId, | ||
| endpointName, | ||
| }: AnalyticsGraphEffectProps) => { | ||
| const setAnalyticsGraphData = useSetRecoilComponentStateV2( | ||
| analyticsGraphDataComponentState, | ||
| ); | ||
|
|
||
| const transformDataFunction = computeAnalyticsGraphDataFunction(endpointName); | ||
| const [isLoaded, setIsLoaded] = useState(false); | ||
|
|
||
| const { fetchGraphData } = useGraphData({ | ||
| recordId, | ||
| endpointName, | ||
| }); | ||
|
|
||
| if (!isLoaded) { | ||
| fetchGraphData('7D').then((graphInput) => { | ||
| setAnalyticsGraphData(transformDataFunction(graphInput)); | ||
| }); | ||
| setIsLoaded(true); | ||
| } | ||
|
|
||
| return <></>; | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
10 changes: 10 additions & 0 deletions
10
packages/twenty-front/src/modules/analytics/constants/AnalyticsEndpointTypeMap.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,10 @@ | ||
| import { AnalyticsTinybirdJwtMap } from '~/generated-metadata/graphql'; | ||
|
|
||
| export const ANALYTICS_ENDPOINT_TYPE_MAP: AnalyticsTinybirdJwtMap = { | ||
| getWebhookAnalytics: 'webhook', | ||
| getPageviewsAnalytics: 'pageviews', | ||
| getUsersAnalytics: 'users', | ||
| getServerlessFunctionDuration: 'function', | ||
| getServerlessFunctionSuccessRate: 'function', | ||
| getServerlessFunctionErrorCount: 'function', | ||
| }; |
10 changes: 10 additions & 0 deletions
10
packages/twenty-front/src/modules/analytics/constants/AnalyticsGraphDescriptionMap.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,10 @@ | ||
| import { AnalyticsTinybirdJwtMap } from '~/generated-metadata/graphql'; | ||
|
|
||
| export const ANALYTICS_GRAPH_DESCRIPTION_MAP: AnalyticsTinybirdJwtMap = { | ||
| getWebhookAnalytics: 'See your webhook activity over time', | ||
| getPageviewsAnalytics: 'See your Page Views activity over time', | ||
| getUsersAnalytics: 'See your Users activity over time', | ||
| getServerlessFunctionDuration: 'See your function duration over time', | ||
| getServerlessFunctionSuccessRate: 'See your function success rate over time', | ||
| getServerlessFunctionErrorCount: 'See your function error count over time', | ||
| }; |
6 changes: 6 additions & 0 deletions
6
packages/twenty-front/src/modules/analytics/constants/AnalyticsGraphOptionMap.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,6 @@ | ||
| export const ANALYTICS_GRAPH_OPTION_MAP = { | ||
| '7D': { granularity: 'day' }, | ||
| '1D': { granularity: 'hour' }, | ||
| '12H': { granularity: 'hour' }, | ||
| '4H': { granularity: 'hour' }, | ||
| }; |
10 changes: 10 additions & 0 deletions
10
packages/twenty-front/src/modules/analytics/constants/AnalyticsGraphTitleMap.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,10 @@ | ||
| import { AnalyticsTinybirdJwtMap } from '~/generated-metadata/graphql'; | ||
|
|
||
| export const ANALYTICS_GRAPH_TITLE_MAP: AnalyticsTinybirdJwtMap = { | ||
| getWebhookAnalytics: 'Activity', | ||
| getPageviewsAnalytics: 'Page Views', | ||
| getUsersAnalytics: 'Users', | ||
| getServerlessFunctionDuration: 'Duration (ms)', | ||
| getServerlessFunctionSuccessRate: 'Success Rate (%)', | ||
| getServerlessFunctionErrorCount: 'Error Count', | ||
| }; |
87 changes: 87 additions & 0 deletions
87
packages/twenty-front/src/modules/analytics/hooks/__tests__/useAnalyticsTinybirdJwt.test.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,87 @@ | ||
| import { useAnalyticsTinybirdJwts } from '@/analytics/hooks/useAnalyticsTinybirdJwts'; | ||
| import { CurrentUser, currentUserState } from '@/auth/states/currentUserState'; | ||
| import { act, renderHook } from '@testing-library/react'; | ||
| import { useSetRecoilState } from 'recoil'; | ||
| import { getJestMetadataAndApolloMocksWrapper } from '~/testing/jest/getJestMetadataAndApolloMocksWrapper'; | ||
|
|
||
| const Wrapper = getJestMetadataAndApolloMocksWrapper({ | ||
| apolloMocks: [], | ||
| }); | ||
|
|
||
| describe('useAnalyticsTinybirdJwts', () => { | ||
| const JWT_NAME = 'getWebhookAnalytics'; | ||
| const TEST_JWT_TOKEN = 'test-jwt-token'; | ||
|
|
||
| it('should return undefined when no user is logged in', () => { | ||
| const { result } = renderHook( | ||
| () => { | ||
| const setCurrentUserState = useSetRecoilState(currentUserState); | ||
| return { | ||
| hook: useAnalyticsTinybirdJwts(JWT_NAME), | ||
| setCurrentUserState, | ||
| }; | ||
| }, | ||
| { wrapper: Wrapper }, | ||
| ); | ||
|
|
||
| act(() => { | ||
| result.current.setCurrentUserState(null); | ||
| }); | ||
|
|
||
| expect(result.current.hook).toBeUndefined(); | ||
| }); | ||
|
|
||
| it('should return the correct JWT token when available', () => { | ||
| const { result } = renderHook( | ||
| () => { | ||
| const setCurrentUserState = useSetRecoilState(currentUserState); | ||
| return { | ||
| hook: useAnalyticsTinybirdJwts(JWT_NAME), | ||
| setCurrentUserState, | ||
| }; | ||
| }, | ||
| { wrapper: Wrapper }, | ||
| ); | ||
|
|
||
| act(() => { | ||
| result.current.setCurrentUserState({ | ||
| id: '1', | ||
| email: '[email protected]', | ||
| canImpersonate: false, | ||
| userVars: {}, | ||
| analyticsTinybirdJwts: { | ||
| [JWT_NAME]: TEST_JWT_TOKEN, | ||
| }, | ||
| } as CurrentUser); | ||
| }); | ||
|
|
||
| expect(result.current.hook).toBe(TEST_JWT_TOKEN); | ||
| }); | ||
|
|
||
| it('should return undefined when JWT token is not available', () => { | ||
| const { result } = renderHook( | ||
| () => { | ||
| const setCurrentUserState = useSetRecoilState(currentUserState); | ||
| return { | ||
| hook: useAnalyticsTinybirdJwts(JWT_NAME), | ||
| setCurrentUserState, | ||
| }; | ||
| }, | ||
| { wrapper: Wrapper }, | ||
| ); | ||
|
|
||
| act(() => { | ||
| result.current.setCurrentUserState({ | ||
| id: '1', | ||
| email: '[email protected]', | ||
| canImpersonate: false, | ||
| userVars: {}, | ||
| analyticsTinybirdJwts: { | ||
| getPageviewsAnalytics: TEST_JWT_TOKEN, | ||
| }, | ||
| } as CurrentUser); | ||
| }); | ||
|
|
||
| expect(result.current.hook).toBeUndefined(); | ||
| }); | ||
| }); |
Oops, something went wrong.