diff --git a/cypress/integration/conditions.e2e.ts b/cypress/integration/conditions.e2e.ts deleted file mode 100644 index b0a661cb8e..0000000000 --- a/cypress/integration/conditions.e2e.ts +++ /dev/null @@ -1,25 +0,0 @@ -describe('Collections', () => { - before(() => { - cy.apiLogin(); - }); - - beforeEach(() => { - cy.visit('/admin/collections/conditions/create'); - }); - - it('can see conditional fields', () => { - cy.get('#simpleCondition') - .should('not.exist'); - - cy.get('#customComponent') - .should('not.exist'); - - cy.contains('Enable Test').click(); - - cy.get('#simpleCondition') - .should('be.visible'); - - cy.get('#customComponent') - .should('be.visible'); - }); -}); diff --git a/cypress/integration/fields.e2e.ts b/cypress/integration/fields.e2e.ts new file mode 100644 index 0000000000..ce0c15a7a1 --- /dev/null +++ b/cypress/integration/fields.e2e.ts @@ -0,0 +1,76 @@ +describe('Fields', () => { + before(() => { + cy.apiLogin(); + }); + + describe('Array', () => { + beforeEach(() => { + cy.visit('/admin/collections/all-fields/create'); + }); + + it('can add and remove rows', () => { + cy.contains('Add Array').click(); + + cy.contains('Array Text 1') + .should('be.visible'); + + cy.get('.action-panel__add-row').first().click(); + + cy.get('.field-type.array') + .filter(':contains("Editable Array")') + .should('contain', '02'); + + cy.get('.action-panel__remove-row').first().click(); + + cy.get('.field-type.array') + .filter(':contains("Editable Array")') + .should('not.contain', '02') + .should('contain', '01'); + }); + + it('can be readOnly', () => { + cy.get('.field-type.array') + .filter(':contains("readOnly Array")') + .should('not.contain', 'Add Row'); + + cy.get('.field-type.array') + .filter(':contains("readOnly Array")') + .children('.action-panel__add-row') + .should('not.exist'); + + cy.get('.field-type.array') + .filter(':contains("readOnly Array")') + .children('.position-panel__move-backward') + .should('not.exist'); + + cy.get('.field-type.array') + .filter(':contains("readOnly Array")') + .children('.position-panel__move-forward') + .should('not.exist'); + }); + }); + + describe('Admin', () => { + describe('Conditions', () => { + beforeEach(() => { + cy.visit('/admin/collections/conditions/create'); + }); + + it('can see conditional fields', () => { + cy.get('#simpleCondition') + .should('not.exist'); + + cy.get('#customComponent') + .should('not.exist'); + + cy.contains('Enable Test').click(); + + cy.get('#simpleCondition') + .should('be.visible'); + + cy.get('#customComponent') + .should('be.visible'); + }); + }); + }); +}); diff --git a/demo/collections/AllFields.ts b/demo/collections/AllFields.ts index e043cec164..d7c8d66ca2 100644 --- a/demo/collections/AllFields.ts +++ b/demo/collections/AllFields.ts @@ -203,7 +203,7 @@ const AllFields: CollectionConfig = { }, { type: 'array', - label: 'Array', + label: 'Editable Array', name: 'array', minRows: 2, maxRows: 4, @@ -250,6 +250,26 @@ const AllFields: CollectionConfig = { }, ], }, + { + type: 'array', + name: 'readOnlyArray', + label: 'readOnly Array', + admin: { + readOnly: true, + }, + defaultValue: [{ + text: 'text in readOnly array one', + }, + { + text: 'text in readOnly array two', + }], + fields: [ + { + type: 'text', + name: 'text', + }, + ], + }, { type: 'blocks', label: 'Blocks Content', diff --git a/src/admin/components/forms/DraggableSection/PositionPanel/index.tsx b/src/admin/components/forms/DraggableSection/PositionPanel/index.tsx index e390d3a3f8..a3f7465f6a 100644 --- a/src/admin/components/forms/DraggableSection/PositionPanel/index.tsx +++ b/src/admin/components/forms/DraggableSection/PositionPanel/index.tsx @@ -7,34 +7,45 @@ import './index.scss'; const baseClass = 'position-panel'; const PositionPanel: React.FC = (props) => { - const { moveRow, positionIndex, rowCount } = props; + const { moveRow, positionIndex, rowCount, readOnly } = props; const adjustedIndex = positionIndex + 1; const classes = [ baseClass, + `${baseClass}__${readOnly ? 'read-only' : ''}`, ].filter(Boolean).join(' '); return (
-
); }; diff --git a/src/admin/components/forms/DraggableSection/PositionPanel/types.ts b/src/admin/components/forms/DraggableSection/PositionPanel/types.ts index 49822d2ea9..07d0960286 100644 --- a/src/admin/components/forms/DraggableSection/PositionPanel/types.ts +++ b/src/admin/components/forms/DraggableSection/PositionPanel/types.ts @@ -2,4 +2,5 @@ export type Props = { moveRow: (fromIndex: number, toIndex: number) => void positionIndex: number rowCount: number + readOnly: boolean } diff --git a/src/admin/components/forms/DraggableSection/index.tsx b/src/admin/components/forms/DraggableSection/index.tsx index e81fdbe57f..0728562c0f 100644 --- a/src/admin/components/forms/DraggableSection/index.tsx +++ b/src/admin/components/forms/DraggableSection/index.tsx @@ -70,6 +70,7 @@ const DraggableSection: React.FC = (props) => { moveRow={moveRow} rowCount={rowCount} positionIndex={rowIndex} + readOnly={readOnly} />