Fix workflows empty states (#9878)

Versions and runs cannot be added manually. Updating message.

<img width="545" alt="Capture d’écran 2025-01-28 à 11 33 47"
src="https://github.com/user-attachments/assets/36b7ade8-3061-4b72-bfa5-c262e4d7d25e"
/>
<img width="614" alt="Capture d’écran 2025-01-28 à 11 34 02"
src="https://github.com/user-attachments/assets/9b524eb4-f40c-4330-a37f-fb33e08d22f4"
/>
This commit is contained in:
Thomas Trompette
2025-01-28 15:16:36 +01:00
committed by GitHub
parent ac92aed87f
commit 0e981bae0a
6 changed files with 106 additions and 4 deletions

View File

@ -5,6 +5,8 @@ import { RecordIndexAddRecordInGroupDropdown } from '@/object-record/record-inde
import { recordIndexRecordGroupHideComponentFamilyState } from '@/object-record/record-index/states/recordIndexRecordGroupHideComponentFamilyState';
import { useRecordTableContextOrThrow } from '@/object-record/record-table/contexts/RecordTableContext';
import { RecordTableEmptyStateDisplay } from '@/object-record/record-table/empty-state/components/RecordTableEmptyStateDisplay';
import { getEmptyStateSubTitle } from '@/object-record/record-table/empty-state/utils/getEmptyStateSubTitle';
import { getEmptyStateTitle } from '@/object-record/record-table/empty-state/utils/getEmptyStateTitle';
import { useSetRecoilComponentFamilyStateV2 } from '@/ui/utilities/state/component-state/hooks/useSetRecoilComponentFamilyStateV2';
import { ViewType } from '@/views/types/ViewType';
@ -20,9 +22,15 @@ export const RecordTableEmptyStateByGroupNoRecordAtAll = () => {
const buttonTitle = `Add a ${objectLabel}`;
const title = `Add your first ${objectLabel}`;
const title = getEmptyStateTitle(
objectMetadataItem.nameSingular,
objectLabel,
);
const subTitle = `Use our API or add your first ${objectLabel} manually`;
const subTitle = getEmptyStateSubTitle(
objectMetadataItem.nameSingular,
objectLabel,
);
const handleButtonClick = () => {
// When we have no records in the group, we want to show the empty state

View File

@ -3,6 +3,8 @@ import { IconPlus } from 'twenty-ui';
import { useObjectLabel } from '@/object-metadata/hooks/useObjectLabel';
import { useRecordTableContextOrThrow } from '@/object-record/record-table/contexts/RecordTableContext';
import { RecordTableEmptyStateDisplay } from '@/object-record/record-table/empty-state/components/RecordTableEmptyStateDisplay';
import { getEmptyStateSubTitle } from '@/object-record/record-table/empty-state/utils/getEmptyStateSubTitle';
import { getEmptyStateTitle } from '@/object-record/record-table/empty-state/utils/getEmptyStateTitle';
import { useCreateNewTableRecord } from '@/object-record/record-table/hooks/useCreateNewTableRecords';
export const RecordTableEmptyStateNoGroupNoRecordAtAll = () => {
@ -21,9 +23,15 @@ export const RecordTableEmptyStateNoGroupNoRecordAtAll = () => {
const buttonTitle = `Add a ${objectLabel}`;
const title = `Add your first ${objectLabel}`;
const title = getEmptyStateTitle(
objectMetadataItem.nameSingular,
objectLabel,
);
const subTitle = `Use our API or add your first ${objectLabel} manually`;
const subTitle = getEmptyStateSubTitle(
objectMetadataItem.nameSingular,
objectLabel,
);
return (
<RecordTableEmptyStateDisplay

View File

@ -0,0 +1,29 @@
import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
import { getEmptyStateSubTitle } from '../getEmptyStateSubTitle';
describe('getEmptyStateSubTitle', () => {
it('should return the correct sub title for workflow version', () => {
const subTitle = getEmptyStateSubTitle(
CoreObjectNameSingular.WorkflowVersion,
'Workflow Version',
);
expect(subTitle).toBe(
'Create a workflow and return here to view its versions',
);
});
it('should return the correct sub title for workflow run', () => {
const subTitle = getEmptyStateSubTitle(
CoreObjectNameSingular.WorkflowRun,
'Workflow Run',
);
expect(subTitle).toBe(
'Run a workflow and return here to view its executions',
);
});
it('should return the correct sub title for other object', () => {
const subTitle = getEmptyStateSubTitle('object', 'Object');
expect(subTitle).toBe('Use our API or add your first Object manually');
});
});

View File

@ -0,0 +1,25 @@
import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
import { getEmptyStateTitle } from '../getEmptyStateTitle';
describe('getEmptyStateTitle', () => {
it('should return the correct title for workflow version', () => {
const title = getEmptyStateTitle(
CoreObjectNameSingular.WorkflowVersion,
'Workflow Version',
);
expect(title).toBe('No workflow versions yet');
});
it('should return the correct title for workflow run', () => {
const title = getEmptyStateTitle(
CoreObjectNameSingular.WorkflowRun,
'Workflow Run',
);
expect(title).toBe('No workflow runs yet');
});
it('should return the correct title for other object', () => {
const title = getEmptyStateTitle('object', 'Object');
expect(title).toBe('Add your first Object');
});
});

View File

@ -0,0 +1,16 @@
import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
export const getEmptyStateSubTitle = (
objectNameSingular: string,
objectLabel: string,
) => {
if (objectNameSingular === CoreObjectNameSingular.WorkflowVersion) {
return 'Create a workflow and return here to view its versions';
}
if (objectNameSingular === CoreObjectNameSingular.WorkflowRun) {
return 'Run a workflow and return here to view its executions';
}
return `Use our API or add your first ${objectLabel} manually`;
};

View File

@ -0,0 +1,16 @@
import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
export const getEmptyStateTitle = (
objectNameSingular: string,
objectLabel: string,
) => {
if (objectNameSingular === CoreObjectNameSingular.WorkflowVersion) {
return 'No workflow versions yet';
}
if (objectNameSingular === CoreObjectNameSingular.WorkflowRun) {
return 'No workflow runs yet';
}
return `Add your first ${objectLabel}`;
};