2366 aoi UI implementation phase1

[guichoquette]

Description

I added UI functionalities to AOI. Strangely the URL image does not get displayed.

Fixes # (2366)

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

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

I added 2 AOI to make sure both were appearing in the AOI panel.

URL for your deploy!

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 

[jolevesq]

Reviewed 1 of 4 files at r1, 3 of 4 files at r2, 1 of 1 files at r4, all commit messages.
Reviewable status: all files reviewed, 4 unresolved discussions (waiting on @guichoquette)

---

packages/geoview-aoi-panel/src/aoi-panel.tsx line 1 at r4 (raw file):

// import { TypeBasemapProps } from 'geoview-core/src/geo/layer/basemap/basemap-types';

Remove all dead code.

---

packages/geoview-aoi-panel/src/aoi-panel.tsx line 29 at r4 (raw file):

export function AoiPanel(props: AoiPanelProps): JSX.Element {
  // eslint-disable-next-line @typescript-eslint/no-unused-vars

Why do you have this eslint escape. If a variableis not use, remove from props

---

packages/geoview-aoi-panel/src/aoi-panel.tsx line 49 at r4 (raw file):

            tabIndex={0}
            className="aoiCardThumbnail"
            onClick={() => myMap.zoomToLngLatExtentOrCoordinate(aoiItem.extent, { maxZoom: 13 })}

CAn we try 14

---

packages/geoview-aoi-panel/src/area-of-interest-style.ts line 53 at r4 (raw file):

        width: '100%',
        overflow: 'hidden',
        border: '1px solid #ccc',

We use theme.palette.geoViewColor.xxx for color

[guichoquette]

Reviewable status: 3 of 5 files reviewed, 4 unresolved discussions (waiting on @jolevesq)

---

packages/geoview-aoi-panel/src/aoi-panel.tsx line 1 at r4 (raw file):

Previously, jolevesq (Johann Levesque) wrote…

Remove all dead code.

Done.

---

packages/geoview-aoi-panel/src/aoi-panel.tsx line 29 at r4 (raw file):

Previously, jolevesq (Johann Levesque) wrote…

Why do you have this eslint escape. If a variableis not use, remove from props

Done.

---

packages/geoview-aoi-panel/src/aoi-panel.tsx line 49 at r4 (raw file):

Previously, jolevesq (Johann Levesque) wrote…

CAn we try 14

Done.

---

packages/geoview-aoi-panel/src/area-of-interest-style.ts line 53 at r4 (raw file):

Previously, jolevesq (Johann Levesque) wrote…

We use theme.palette.geoViewColor.xxx for color

Done.

[jolevesq]

Reviewed all commit messages.
Reviewable status: 3 of 5 files reviewed, 2 unresolved discussions (waiting on @guichoquette)

[jolevesq]

Reviewed 1 of 2 files at r5.
Reviewable status: 4 of 5 files reviewed, 2 unresolved discussions (waiting on @guichoquette)

[jolevesq]

Reviewed 1 of 2 files at r5.
Reviewable status: complete! all files reviewed, all discussions resolved (waiting on @guichoquette)