[arvados-workbench2] created: 2.4.0-359-g74e6ba23

[git repository hosting]

        at  74e6ba2377c3c1ad7c2a8e97c24e8be369f40fe3 (commit)


commit 74e6ba2377c3c1ad7c2a8e97c24e8be369f40fe3
Author: Lucas Di Pentima <lucas.dipentima at curii.com>
Date:   Tue Dec 6 00:00:23 2022 +0100

    19732: Removes 'require' validation on Property form fields.
    
    Also, only enable the 'Add' button when both property key & value are set
    on the form.
    
    Arvados-DCO-1.1-Signed-off-by: Lucas Di Pentima <lucas.dipentima at curii.com>

diff --git a/src/validators/validators.tsx b/src/validators/validators.tsx
index 6e72ef68..87a4c1f5 100644
--- a/src/validators/validators.tsx
+++ b/src/validators/validators.tsx
@@ -8,8 +8,8 @@ import { isRsaKey } from './is-rsa-key';
 import { isRemoteHost } from "./is-remote-host";
 import { validFilePath, validName, validNameAllowSlash } from "./valid-name";
 
-export const TAG_KEY_VALIDATION = [require, maxLength(255)];
-export const TAG_VALUE_VALIDATION = [require, maxLength(255)];
+export const TAG_KEY_VALIDATION = [maxLength(255)];
+export const TAG_VALUE_VALIDATION = [maxLength(255)];
 
 export const PROJECT_NAME_VALIDATION = [require, validName, maxLength(255)];
 export const PROJECT_NAME_VALIDATION_ALLOW_SLASH = [require, validNameAllowSlash, maxLength(255)];
diff --git a/src/views-components/resource-properties-form/property-value-field.tsx b/src/views-components/resource-properties-form/property-value-field.tsx
index b8e525bf..8941d441 100644
--- a/src/views-components/resource-properties-form/property-value-field.tsx
+++ b/src/views-components/resource-properties-form/property-value-field.tsx
@@ -89,7 +89,7 @@ const getValidation = (props: PropertyValueFieldProps) =>
 
 const matchTagValues = ({ vocabulary, propertyKeyId }: PropertyValueFieldProps) =>
     (value: string) =>
-        getTagValues(propertyKeyId, vocabulary).find(v => v.label === value)
+        getTagValues(propertyKeyId, vocabulary).find(v => !value || v.label === value)
             ? undefined
             : 'Incorrect value';
 
diff --git a/src/views-components/resource-properties-form/resource-properties-form.tsx b/src/views-components/resource-properties-form/resource-properties-form.tsx
index 25d0f2bb..01473129 100644
--- a/src/views-components/resource-properties-form/resource-properties-form.tsx
+++ b/src/views-components/resource-properties-form/resource-properties-form.tsx
@@ -3,13 +3,29 @@
 // SPDX-License-Identifier: AGPL-3.0
 
 import React from 'react';
-import { InjectedFormProps } from 'redux-form';
+import { RootState } from 'store/store';
+import { connect } from 'react-redux';
+import { formValueSelector, InjectedFormProps } from 'redux-form';
 import { Grid, withStyles, WithStyles } from '@material-ui/core';
 import { PropertyKeyField, PROPERTY_KEY_FIELD_NAME, PROPERTY_KEY_FIELD_ID } from './property-key-field';
 import { PropertyValueField, PROPERTY_VALUE_FIELD_NAME, PROPERTY_VALUE_FIELD_ID } from './property-value-field';
 import { ProgressButton } from 'components/progress-button/progress-button';
 import { GridClassKey } from '@material-ui/core/Grid';
 
+const AddButton = withStyles(theme => ({
+    root: { marginTop: theme.spacing.unit }
+}))(ProgressButton);
+
+const mapStateToProps = (state: RootState) => {
+    return {
+        applySelector: (selector) => selector(state, 'key', 'value', 'keyID', 'valueID')
+    }
+}
+
+interface ApplySelector {
+    applySelector: (selector) => any;
+}
+
 export interface ResourcePropertiesFormData {
     uuid: string;
     [PROPERTY_KEY_FIELD_NAME]: string;
@@ -19,10 +35,11 @@ export interface ResourcePropertiesFormData {
     clearPropertyKeyOnSelect?: boolean;
 }
 
-export type ResourcePropertiesFormProps = {uuid: string; clearPropertyKeyOnSelect?: boolean } & InjectedFormProps<ResourcePropertiesFormData, {uuid: string; }> & WithStyles<GridClassKey>;
+type ResourcePropertiesFormProps = {uuid: string; clearPropertyKeyOnSelect?: boolean } & InjectedFormProps<ResourcePropertiesFormData, {uuid: string;}> & WithStyles<GridClassKey> & ApplySelector;
 
-export const ResourcePropertiesForm = ({ handleSubmit, change, submitting, invalid, classes, uuid, clearPropertyKeyOnSelect }: ResourcePropertiesFormProps ) => {
+export const ResourcePropertiesForm = connect(mapStateToProps)(({ handleSubmit, change, submitting, invalid, classes, uuid, clearPropertyKeyOnSelect, applySelector,  ...props }: ResourcePropertiesFormProps ) => {
     change('uuid', uuid); // Sets the uuid field to the uuid of the resource.
+    const propertyValue = applySelector(formValueSelector(props.form));
     return <form data-cy='resource-properties-form' onSubmit={handleSubmit}>
         <Grid container spacing={16} classes={classes}>
             <Grid item xs>
@@ -32,19 +49,16 @@ export const ResourcePropertiesForm = ({ handleSubmit, change, submitting, inval
                 <PropertyValueField />
             </Grid>
             <Grid item>
-                <Button
+                <AddButton
                     data-cy='property-add-btn'
-                    disabled={invalid}
+                    disabled={invalid || !(propertyValue.key && propertyValue.value)}
                     loading={submitting}
                     color='primary'
                     variant='contained'
                     type='submit'>
                     Add
-                </Button>
+                </AddButton>
             </Grid>
         </Grid>
-    </form>};
-
-export const Button = withStyles(theme => ({
-    root: { marginTop: theme.spacing.unit }
-}))(ProgressButton);
+    </form>}
+);
\ No newline at end of file

commit d10e3de65595d9ab1983da00dc498c5fb11abf79
Author: Lucas Di Pentima <lucas.dipentima at curii.com>
Date:   Wed Dec 7 19:43:41 2022 +0100

    19732: Adds test assertion exposing the bug.
    
    Arvados-DCO-1.1-Signed-off-by: Lucas Di Pentima <lucas.dipentima at curii.com>

diff --git a/cypress/integration/collection.spec.js b/cypress/integration/collection.spec.js
index 74506aea..a62cca59 100644
--- a/cypress/integration/collection.spec.js
+++ b/cypress/integration/collection.spec.js
@@ -911,6 +911,10 @@ describe('Collection panel tests', function () {
         // Confirm proper vocabulary labels are displayed on the UI.
         cy.get('[data-cy=form-dialog]').should('contain', 'Color: Magenta');
 
+        // Value field should not complain about being required just after
+        // adding a new property. See #19732
+        cy.get('[data-cy=form-dialog]').should('not.contain', 'This field is required');
+
         cy.get('[data-cy=form-submit-btn]').click();
         // Confirm that the user was taken to the newly created collection
         cy.get('[data-cy=form-dialog]').should('not.exist');

-----------------------------------------------------------------------


hooks/post-receive
--