Skip to content

Commit

Permalink
Revert "Add the changes for crayons inbox form changes for dynamic se…
Browse files Browse the repository at this point in the history
…ction"
  • Loading branch information
gokulrajtm committed Sep 23, 2024
1 parent 63bce7b commit d0cde14
Show file tree
Hide file tree
Showing 6 changed files with 102 additions and 222 deletions.
2 changes: 1 addition & 1 deletion packages/crayons-core/src/components/form/form-util.ts
Original file line number Diff line number Diff line change
Expand Up @@ -402,7 +402,7 @@ export const translateErrors = async (errors = {}, fields) => {
);
};

export const formServFieldTypes = {
const formServFieldTypes = {
'1': { type: 'TEXT' },
'2': { type: 'DROPDOWN' },
'3': { type: 'EMAIL' },
Expand Down
4 changes: 0 additions & 4 deletions packages/crayons-core/src/components/form/form.scss

This file was deleted.

124 changes: 18 additions & 106 deletions packages/crayons-core/src/components/form/form.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,6 @@ import {
Watch,
Event,
EventEmitter,
Fragment,
} from '@stencil/core';
import { v4 as uuidv4 } from 'uuid';
import {
Expand All @@ -33,12 +32,11 @@ import {
getMappedSchema,
getValueForField,
LEGO,
formServFieldTypes,
} from './form-util';
import { debounce, hasSlot } from '../../utils';

@Component({
tag: 'fw-form',
styleUrl: 'form.scss',
shadow: true,
})
export class Form {
Expand Down Expand Up @@ -195,27 +193,8 @@ export class Form {
}

async handleFormSchemaAndInitialValuesChange(formSchema, initialValues) {
const getSectionFields = (fields = []) => {
return fields.reduce((acc, field) => {
// Update the type based on formServFieldTypes
field.type = formServFieldTypes[field.type]?.type || field.type;
return {
...acc,
[field.name]: field,
...getSectionFields(field?.fields || []),
};
}, {});
};

this.fields = formSchema?.fields?.reduce((acc, field) => {
// If there are Section fields, add them as well, outside of `fields` key
const nestedFields = getSectionFields(field?.fields || []);

return {
...acc,
[field.name]: field,
...nestedFields,
};
return { ...acc, [field.name]: field };
}, {});

this.formValidationSchema =
Expand Down Expand Up @@ -382,26 +361,6 @@ export class Form {
componentValue = value;
}

// reset for section fields when values changed

const previousfield = this.formSchema.fields.find(
(field) => field.name === name
);

if (previousfield && previousfield?.field_options?.has_sections) {
const selectedObj = previousfield?.choices?.find(
({ id }) => id === this.values[name]
);

selectedObj?.dependent_ids?.field?.forEach((fieldId) => {
const fieldOptionName = previousfield?.fields.find(
({ id }) => id === fieldId
)?.name;

delete this.values[fieldOptionName];
});
}

this.values = {
...this.values,
[name]: componentValue,
Expand Down Expand Up @@ -836,50 +795,6 @@ export class Form {
) || {};
}

renderSectionFields(field) {
const utils: FormUtils = this.composedUtils();
// Early return if no value for the field or no dependent choices
const selectedChoiceHash = this.values[field.name];
if (!selectedChoiceHash) return null;

// Find the selected field and get dependent field IDs
const dependendFieldIds = field.choices?.find(
({ id }) => id === selectedChoiceHash
)?.dependent_ids?.field;
if (!dependendFieldIds?.length) return null;

// Map dependent field IDs to form controls
return (
<div class='nest_indent'>
{dependendFieldIds.map((dependendFieldId) => {
const fieldObj = field.fields?.find(
({ id }) => id === dependendFieldId
);
if (!fieldObj) return null;

return (
<fw-form-control
key={fieldObj.name}
name={fieldObj.name}
type={fieldObj.type}
label={fieldObj.label}
required={fieldObj.required}
hint={fieldObj.hint}
placeholder={fieldObj.placeholder}
hidden={fieldObj.hidden}
error={this.errors[fieldObj.name]}
touched={this.touched[fieldObj.name]}
disabled={this.isDisabledField(fieldObj)}
choices={fieldObj.choices}
fieldProps={fieldObj}
controlProps={utils}
/>
);
})}
</div>
);
}

render() {
const utils: FormUtils = this.composedUtils();

Expand All @@ -892,25 +807,22 @@ export class Form {
.map((field) => {
return (
this.shouldRenderFormControl(field) && (
<Fragment>
<fw-form-control
key={field.name}
name={field.name}
type={field.type}
label={field.label}
required={field.required}
hint={field.hint}
placeholder={field.placeholder}
hidden={field.hidden}
error={this.errors[field.name]}
touched={this.touched[field.name]}
disabled={this.isDisabledField(field)}
choices={field.choices}
fieldProps={field}
controlProps={utils}
></fw-form-control>
{this.renderSectionFields(field)}
</Fragment>
<fw-form-control
key={field.name}
name={field.name}
type={field.type}
label={field.label}
required={field.required}
hint={field.hint}
placeholder={field.placeholder}
hidden={field.hidden}
error={this.errors[field.name]}
touched={this.touched[field.name]}
disabled={this.isDisabledField(field)}
choices={field.choices}
fieldProps={field}
controlProps={utils}
></fw-form-control>
)
);
})
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -24,5 +24,6 @@ describe('fw-popover', () => {
await document.body.click();
await page.waitForChanges();
content = await page.find('fw-popover >>> .popper-content');
expect(content).not.toHaveAttribute('data-show');
});
});
111 changes: 0 additions & 111 deletions packages/crayons-core/src/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -836,117 +836,6 @@ <h3>Dynamic form via `formSchema`</h3>
option_value_path: 'text',
},
},
{
"id": "74f86523-7591-4250-8f9d-44d31efedee6",
"name": "cf_sectiontype",
"label": "sectiontype",
"type": 2,
"field_options": {
"option_value_path": "id",
"has_sections": "true",
"option_label_path": "value",
"unique": "false",
"required_on_resolve": "false"
},
"custom": true,
"editable": true,
"position": 150,
"deleted": false,
"required": false,
"visible": true,
"column_type_blob": false,
"nodegroup_skip": false,
"validatable": false,
"builder": false,
"internal": false,
"choices": [
{
"id": "c322ad67-9b28-4b40-9833-6c3017228464",
"value": "order",
"field_id": "74f86523-7591-4250-8f9d-44d31efedee6",
"choice_options": {},
"dependent_ids": {
"field": [],
"choice": []
}
},
{
"id": "b9018ff6-2a6e-4ebe-97a8-a31e840df3aa",
"value": "tracking",
"field_id": "74f86523-7591-4250-8f9d-44d31efedee6",
"choice_options": {
"section_name": "sep5"
},
"dependent_ids": {
"field": [
"2b532f15-ec62-47de-8e5a-fc501e390774",
"40af799f-a852-4265-a2c1-a83ad0818541"
]
}
}
],
"fields": [
{
"id": "2b532f15-ec62-47de-8e5a-fc501e390774",
"parent_id": "74f86523-7591-4250-8f9d-44d31efedee6",
"name": "cf_order_tr_num",
"column_name": "cf_int026",
"label": "order_tr_num",
"type": 8,
"field_options": {
"is_section_field": "true",
"unique": "false"
},
"custom": true,
"editable": true,
"position": 1,
"deleted": false,
"required": false,
"visible": true,
"column_type_blob": false,
"nodegroup_skip": false,
"validatable": false,
"builder": false,
"internal": false,
"choices": [],
"fields": [],
"regex": {},
"created_at": 1725949057000,
"updated_at": 1725949057000
},
{
"id": "40af799f-a852-4265-a2c1-a83ad0818541",
"parent_id": "74f86523-7591-4250-8f9d-44d31efedee6",
"name": "cf_return_reason",
"column_name": "cf_str023",
"label": "return_reason",
"type": 1,
"field_options": {
"is_section_field": "true",
"unique": "false"
},
"custom": true,
"editable": true,
"position": 2,
"deleted": false,
"required": false,
"visible": true,
"column_type_blob": false,
"nodegroup_skip": false,
"validatable": false,
"builder": false,
"internal": false,
"choices": [],
"fields": [],
"regex": {},
"created_at": 1725949081000,
"updated_at": 1725949081000
}
],
"regex": {},
"created_at": 1725529206000,
"updated_at": 1725949081000
},
],
};
Expand Down
82 changes: 82 additions & 0 deletions packages/crayons-extended/untitled.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,82 @@
// TYPES
[
'PRIMARY', ==> same as 'TEXT'
'TEXT',
'EMAIL',
'CHECKBOX',
'PARAGRAPH',
'NUMBER',
'DECIMAL',
'DATE',
'DROPDOWN',
'RELATIONSHIP',
'MULTI_SELECT',
]

// PRIMARY | TEXT | NUMBER | DECIMAL | PARAGRAPH | DATE | CHECKBOX

id, name, label, type, required, field_options (unique), filterable, display_label

// RELATIONSHIP

id, name, label, type, required, field_options (unique), filterable, related_entity_id, display_label

// PARAGRAPH

id, name, label, type, required, field_options (unique), filterable, display_label

// DROPDOWN | MULTI_SELECT

id, name, label, type, required, field_options (unique), filterable, display_label, choices

// --choices

id, value

// FORMSERV EQUIVALENT KEYS

type - NUMBER instead of STRING

/*
{
'TEXT': 1, +
'DROPDOWN': 2, +
'EMAIL': 3, +
'PHONE_NUMBER': 4,
'CHECKBOX': 5, +
'PARAGRAPH': 6, +
'DATE_TIME': 7,
'NUMBER': 8, +
'URL': 10,
'RADIO': 12,
'DECIMAL': 13, +
'SECTION': 14,
'AUTO_COMPLETE': 16,
'DATE': 17, +
'MULTI_SELECT': 18, +
'BIG_NUMBER': 20,
}
// SUPPORTED TYPES EQUIVALENTS
{
'TEXT': 1, +
'DROPDOWN': 2, +
'EMAIL': 3, +
'CHECKBOX': 5, +
'PARAGRAPH': 6, +
'NUMBER': 8, +
'DECIMAL': 13, +
'DATE': 17, +
'MULTI_SELECT': 18, +
}
*/


/*
{
label: display_label,
}
*/

0 comments on commit d0cde14

Please sign in to comment.