Select to view content in your preferred language

Using react function in setting.tsx file in EBS 1.10 does not import config.json values

614
1
Jump to solution
01-26-2023 12:16 PM
Gurunara
Frequent Contributor

EBS version 1.10.

 

The setting.tsx file imports IMConfig type from:


import { IMConfig } from "../config";

 

Which has:

 

import {ImmutableObject} from 'jimu-core';

interface Field {

    name: string,

    label: string,

    maxLength: number,

    includeTime: boolean,

}

interface EditorLayerConfig {

    title: string,

    fieldConfig?: Field[],

    addEnabled: boolean,

    updateEnabled: boolean,

    deleteEnabled: boolean,

}

 

export interface Config{

  enableAdvancedEditing: boolean;

  editableLayers:EditorLayerConfig[],

  allowedOperations:string[]

}

 

export type IMConfig = ImmutableObject<Config>;

 

The config.json file is under the widget folder, which has:

{

    "enableAdvancedEditing":true,

    "allowedOperations":["create","update"],

    "editableLayers":[{

        "title":"Rail Features",

        "addEnabled": false ,

        "updateEnabled": true ,

        "deleteEnabled": false ,

        "fieldConfig":[

        {"name":"NEW_CLASS","label":"New Class", "maxLength":50},

        {"name":"CHANGED_CLASS","label":"Changed Class", "maxLength":1},

        {"name":"CHNG_DATE","label":"Change Date", "maxLength":8, "includeTime":false},

        {"name":"CHNG_RACF","label":"Change RACF", "maxLength":10},

        {"name":"LAT","label":"Latitude"},

        {"name":"LNG","label":"Longitude"},

        {"name":"COMMENTS","label":"Comments", "maxLength":255}

        ]}

        ]

}

 

The rest of setting.tsx file has:

export default function Setting(props: AllWidgetSettingProps<IMConfig>){

    return (

        <div className="widget-setting-js-api-widget">

            …

           <SettingSection

                title={props.intl.formatMessage({

                    id: "sectionEditableLayers",

                    defaultMessage: defaultMessages.labelSectionLayers,

                })}

            >

                …

               <TextInput

                    className="w-100"

                    name="text"

                    id="txtEditableLayers"

                    value={

                        props.config.editableLayers

                            ? JSON.stringify(props.config.editableLayers)

                            : ""

                    }

                    placeholder={defaultMessages.placeholderEditableLayers}

                    onBlur={(evt) => {

                        onPropertyChange("editableLayers", JSON.parse(evt.target.value));

                    }}

                />

            </SettingSection>

        </div>

    );

 

But props.config does not contain entries for:
editableLayers
allowedOperations

Setting.tsx code is copied from working version in ebs 1.05.

And there the prop.config values are populated:
(see image1)

When running the widget, the settings section shows empty for those missing configurations:
(see image2)

* [‘create’, ‘update’] above is just placeholder hint text, the textbox is actually empty… but it should be populated with text => ‘["create","update"]’.

Also Editable Layers should be populated from values in config.json.

- Does 1.10 support React functions for setting.tsx file?
- Provide a working example where IMConfig/config.ts/config.json values (above) are properly imported..?

Thanks.



0 Kudos
1 Solution

Accepted Solutions
Gurunara
Frequent Contributor

The answer was simple. The config.json is loaded only when the custom widget is initially added to the page. The issue was the config.json and config.ts, etc were modified/added "after" the initial widget was added to the page, and was being modified.

View solution in original post

0 Kudos
1 Reply
Gurunara
Frequent Contributor

The answer was simple. The config.json is loaded only when the custom widget is initially added to the page. The issue was the config.json and config.ts, etc were modified/added "after" the initial widget was added to the page, and was being modified.

0 Kudos