adding tree display to adding layer functionality

[cphelefu]

Description

This PR does the following;

• adds a new component that renders layers as a tree.
• Add functionality for adding those layers

Fixes #1100

Type of change

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• This change requires a documentation update

How Has This Been Tested?

Please describe the tests that you ran to verify your changes. Provide instructions so we can reproduce.

https://cphelefu.github.io/geoview

URL you can use for testing
https://maps-cartes.ec.gc.ca/arcgis/rest/services/CESI/MapServer/

Checklist:

• I have build (rush build) and deploy (rush host) my PR
• I have connected the issues(s) to this PR
• My code follows the style guidelines of this project
• I have performed a self-review of my own code
• I have commented my code, particularly in hard-to-understand areas
• My changes generate no new warnings
• I have created new issue(s) related to the outcome of this PR is needed
• I have made corresponding changes to the documentation
• I have added tests that prove my fix is effective or that my feature works
• New and existing unit tests pass locally with my changes

---

This change is 

[ychoquet]

Reviewed 7 of 7 files at r1, all commit messages.
Reviewable status: all files reviewed, 1 unresolved discussion (waiting on @cphelefu, @DamonU2, and @kaminderpal)

---

packages/geoview-core/src/core/components/layers/left-panel/add-new-layer/add-new-layer.tsx line 184 at r1 (raw file):

    const populateLayerList = async (curlayerType: TypeGeoviewLayerType) => {
      try {
        const layersTree = await api.config.createMetadataLayerTree(layerURL, curlayerType, [], 'en');

I think the language should be selectable because GeoCore layers are bilingual. Just add a drop down to allow the user to select the language.

[jolevesq]

Reviewed 4 of 7 files at r1, all commit messages.
Reviewable status: 6 of 8 files reviewed, 9 unresolved discussions (waiting on @cphelefu, @DamonU2, @kaminderpal, and @ychoquet)

---

packages/geoview-core/src/core/components/layers/left-panel/add-new-layer/add-layer-tree.tsx line 29 at r2 (raw file):

  // this use effect acts like onComponentDidMount
  useEffect(() => {

Add logger inside useEffect

---

packages/geoview-core/src/core/components/layers/left-panel/add-new-layer/add-layer-tree.tsx line 45 at r2 (raw file):

  useEffect(() => {
    onSelectedItemsChange(selectedItems);

Add logger inside useEffect

---

packages/geoview-core/src/core/components/layers/left-panel/add-new-layer/add-layer-tree.tsx line 48 at r2 (raw file):

  }, [selectedItems]);

  const renderTreeItem = function (layer: GroupLayerEntryConfig, parentId: string | null): JSX.Element {

CAn you add JSDoc for function

---

packages/geoview-core/src/core/components/layers/left-panel/add-new-layer/add-layer-tree.tsx line 60 at r2 (raw file):

  };

  const getLayerChildren = function (treeLayerId: string): string[] {

CAn you add JSDoc for function

---

packages/geoview-core/src/core/components/layers/left-panel/add-new-layer/add-new-layer.tsx line 184 at r1 (raw file):

Previously, ychoquet (Yves Choquette) wrote…

I think the language should be selectable because GeoCore layers are bilingual. Just add a drop down to allow the user to select the language.

Or just use the application language .... for now remove hardcoded 'en' and replace by interface language value

---

packages/geoview-core/src/core/components/layers/left-panel/add-new-layer/add-new-layer.tsx line 218 at r2 (raw file):

      // wfsValidation();
    }
    // else if (layerType === WFS) promise = wfsValidation();

Why this dead code?

---

packages/geoview-core/src/core/components/layers/left-panel/add-new-layer/add-new-layers-utils.ts line 11 at r2 (raw file):

  listOfLayerEntryConfig?: ListOfLayerEntry[];
};
type GeoViewLayerToAdd = {

Blank line between type

---

packages/geoview-core/src/core/components/layers/left-panel/add-new-layer/add-new-layers-utils.ts line 31 at r2 (raw file):

    if (branchGroup.layerId === layerId) return branchGroup;

    const layer = branchGroup.listOfLayerEntryConfig?.find((childLayer) => childLayer.layerId === layerId);

add some comments to explain what you do and some blank line for readability (ex: between if, before for ...)

---

packages/geoview-core/src/core/components/layers/left-panel/add-new-layer/add-new-layers-utils.ts line 75 at r2 (raw file):

  function appendChildLayerNode(treeRoot: ListOfLayerEntry, layerId: string, parentLayerId: string) {
    if (treeRoot.layerId === parentLayerId) {

add some comments to explain what you do and some blank line for readability (ex: between if, before for ...)

[jolevesq]

Will be merge in #2517