From c501cb7c19a3ba15e23ce8d18786bdef842ea1d6 Mon Sep 17 00:00:00 2001 From: gowtham-balaganesh Date: Tue, 10 Sep 2024 15:17:33 +0530 Subject: [PATCH] refactor: final changes --- .../src/components/form/form-util.ts | 14 ----- .../custom-objects/src/components.d.ts | 4 +- .../components/fb-field-drag-drop-item.scss | 7 --- .../components/fb-field-drag-drop-item.tsx | 13 +---- .../components/fb-section-create.tsx | 10 ++-- .../components/fb-section-drag-drop.scss | 53 ------------------- .../components/fb-section-drag-drop.tsx | 23 -------- .../components/form-builder/form-builder.tsx | 2 +- 8 files changed, 10 insertions(+), 116 deletions(-) delete mode 100644 packages/crayons-extended/custom-objects/src/components/form-builder/components/fb-section-drag-drop.scss delete mode 100644 packages/crayons-extended/custom-objects/src/components/form-builder/components/fb-section-drag-drop.tsx diff --git a/packages/crayons-core/src/components/form/form-util.ts b/packages/crayons-core/src/components/form/form-util.ts index c0550f28c..f126b42d4 100644 --- a/packages/crayons-core/src/components/form/form-util.ts +++ b/packages/crayons-core/src/components/form/form-util.ts @@ -480,20 +480,6 @@ export function getValueForField(values, field) { return value; } -export function getChoicesWithNoSectionCreated(choices) { - const choicesWithNoSection = []; - choices.reduce((choicesWithNoSection, choice) => { - if (!choice?.choice_options?.section_name) { - choicesWithNoSection.push({ - text: choice.value, - value: choice.value, - }); - } - return choicesWithNoSection; - }, []); - return choicesWithNoSection; -} - const handleUserTimeZoneOffset = (date) => { return ( new Date(date).valueOf() + new Date(date).getTimezoneOffset() * 60 * 1000 diff --git a/packages/crayons-extended/custom-objects/src/components.d.ts b/packages/crayons-extended/custom-objects/src/components.d.ts index bd1a512b5..025bffbae 100644 --- a/packages/crayons-extended/custom-objects/src/components.d.ts +++ b/packages/crayons-extended/custom-objects/src/components.d.ts @@ -117,7 +117,7 @@ export namespace Components { * index attached inside the parent group component */ "index": number; - "isEditing": any; + "isEditing": boolean; /** * The db type used to determine the json to be used for CUSTOM_OBJECTS or CONVERSATION_PROPERTIES */ @@ -1074,7 +1074,7 @@ declare namespace LocalJSX { * index attached inside the parent group component */ "index"?: number; - "isEditing"?: any; + "isEditing"?: boolean; /** * Triggered when the section is expanded or collapsed */ diff --git a/packages/crayons-extended/custom-objects/src/components/form-builder/components/fb-field-drag-drop-item.scss b/packages/crayons-extended/custom-objects/src/components/form-builder/components/fb-field-drag-drop-item.scss index 40a523b5b..058bb2c84 100644 --- a/packages/crayons-extended/custom-objects/src/components/form-builder/components/fb-field-drag-drop-item.scss +++ b/packages/crayons-extended/custom-objects/src/components/form-builder/components/fb-field-drag-drop-item.scss @@ -21,13 +21,6 @@ --fw-button-hover-background-color: $color-smoke-25; --fw-button-active-box-shadow: $color-smoke-25; --fw-button--lg-focus-border: $color-smoke-25; - - &.disabled { - pointer-events: none; - user-select: none; - cursor: not-allowed; - opacity: 0.6; - } } &.hide { diff --git a/packages/crayons-extended/custom-objects/src/components/form-builder/components/fb-field-drag-drop-item.tsx b/packages/crayons-extended/custom-objects/src/components/form-builder/components/fb-field-drag-drop-item.tsx index 99fbf3441..97aac7093 100644 --- a/packages/crayons-extended/custom-objects/src/components/form-builder/components/fb-field-drag-drop-item.tsx +++ b/packages/crayons-extended/custom-objects/src/components/form-builder/components/fb-field-drag-drop-item.tsx @@ -231,8 +231,8 @@ export class FormBuilderFieldDragDropItem { color='text' class={{ 'fb-show-hide-sections-btn': true, - 'disabled': this.disabled, }} + disabled={this.disabled} onFwClick={() => { this.setSectionsExpandState(!this.sectionsExpanded); this.setSectionCreationExpandState(false); @@ -272,16 +272,7 @@ export class FormBuilderFieldDragDropItem { /> )} - {this.sectionsExpanded && ( - -
- -
- - )} + {this.sectionsExpanded && } )} diff --git a/packages/crayons-extended/custom-objects/src/components/form-builder/components/fb-section-create.tsx b/packages/crayons-extended/custom-objects/src/components/form-builder/components/fb-section-create.tsx index 9a659fa00..b3abf47d8 100644 --- a/packages/crayons-extended/custom-objects/src/components/form-builder/components/fb-section-create.tsx +++ b/packages/crayons-extended/custom-objects/src/components/form-builder/components/fb-section-create.tsx @@ -19,7 +19,7 @@ export class FormBuilderSection { /* * List of field options */ - @Prop() fieldChoices; + @Prop() fieldChoices = null; /** * The db type used to determine the json to be used for CUSTOM_OBJECTS or CONVERSATION_PROPERTIES */ @@ -31,11 +31,11 @@ export class FormBuilderSection { /* * Choosen field value for a section */ - @Prop({ mutable: true }) selectedFieldValue; + @Prop({ mutable: true }) selectedFieldValue = null; /* * Flag to show section pane in edit mode */ - @Prop() isEditing; + @Prop() isEditing = false; /** * index attached inside the parent group component */ @@ -43,11 +43,11 @@ export class FormBuilderSection { /* * Section name field error state */ - @State() sectionInputState; + @State() sectionInputState = ''; /* * Previously selected choice value while in edit mode */ - @State() previousSelectedValue; + @State() previousSelectedValue = null; /** * State to show section input warning message */ diff --git a/packages/crayons-extended/custom-objects/src/components/form-builder/components/fb-section-drag-drop.scss b/packages/crayons-extended/custom-objects/src/components/form-builder/components/fb-section-drag-drop.scss deleted file mode 100644 index ad2d2e073..000000000 --- a/packages/crayons-extended/custom-objects/src/components/form-builder/components/fb-section-drag-drop.scss +++ /dev/null @@ -1,53 +0,0 @@ -.fb-section { - background: $color-smoke-50; - border-radius: 8px; - border: 1px solid $color-smoke-100; - - header { - display: flex; - padding: 12px; - justify-content: space-between; - align-items: center; - } - .fb-section-add { - color: $color-elephant-900; - font-size: 14px; - font-weight: 600; - line-height: 20px; - margin: 0; - } - - .fb-section-content { - background: $color-milk; - padding-block: 12px; - display: flex; - padding-inline: 16px 8px; - flex-direction: column; - justify-content: center; - align-items: center; - gap: 10px; - align-self: stretch; - min-height: 3rem; - height: auto; - border-radius: 0 0 8px 8px; - - .fb-section-content-create { - display: flex; - gap: 5px; - - .fb-section-content-name { - flex-grow: 1; - } - - .fb-section-content-divider { - width: 1px; - height: 54px; - background: $color-smoke-100; - } - - .fb-section-content-value { - flex-grow: 1; - } - } - } -} diff --git a/packages/crayons-extended/custom-objects/src/components/form-builder/components/fb-section-drag-drop.tsx b/packages/crayons-extended/custom-objects/src/components/form-builder/components/fb-section-drag-drop.tsx deleted file mode 100644 index ae88cf2e7..000000000 --- a/packages/crayons-extended/custom-objects/src/components/form-builder/components/fb-section-drag-drop.tsx +++ /dev/null @@ -1,23 +0,0 @@ -import { Component, h, Prop, State } from '@stencil/core'; - -@Component({ - tag: 'fb-section-drag-drop', - styleUrl: 'fb-section-drag-drop.scss', - shadow: true, -}) -export class FormBuilderSection { - /* - * Handler function to create a new section - */ - @Prop() setSectionsExpandStateHandler; - /** - * data source used to set and edit the field values - */ - @Prop({ mutable: true }) dataProvider = null; - - @State() sectionCreated = true; - - render() { - return ; - } -} diff --git a/packages/crayons-extended/custom-objects/src/components/form-builder/form-builder.tsx b/packages/crayons-extended/custom-objects/src/components/form-builder/form-builder.tsx index 7697e58a6..c42bb5ed3 100644 --- a/packages/crayons-extended/custom-objects/src/components/form-builder/form-builder.tsx +++ b/packages/crayons-extended/custom-objects/src/components/form-builder/form-builder.tsx @@ -120,7 +120,7 @@ export class FormBuilder { /* * Beta flag to enable Dynamic sections */ - @Prop() dynamicSectionsBetaEnabled = true; + @Prop() dynamicSectionsBetaEnabled = false; /** * State to store the formValues as a state to transfer the field types */