giseldo/neodataset huggingface dataset:
FE: investigate firefox container query polyfill issue

### User

Developers, users
### Short description
Investigate why firefox is breaking on the build (it is working locally) with using the container-query polyfill. Test this on the build to make sure staging won't break again. 


### Why
So we can use container queries in firefox and have a uniform view

### Test criteria
- firefox should not cause blank screen in build
- firefox should work with container queries

### Extra information
A MR is already open with moving the polyfill to the `polyfills` file, but that did not work and gave a blank screen as well. Maybe include it with cdn link somehow?

Story points: 3.0
FE: fix withEggs wrappers causing unit tests to fail

Currently a lot of providers are wrapper use the `withEggs` wrapper. Even non-redux ones. Tests are getting sometimes a timeout sometimes now because it takes a long time (also in pipeline), and redux warnings appear in tests for non redux components. Have a look at this wrapper only wrapping a non redux theme, causing every story/unit test to use redux:
```
const ThemeWrapperWithModules: React.FC<ThemeProviderProps> = withEggs([
  capModuleConfig,
])(({ theme, children }: ThemeProviderProps) => (
  <ThemeWrapper theme={theme}>{children}</ThemeWrapper>
));
```



Right now every story has redux wrapped. Only redux related components should use this wrapper. Check this for every lib.

Story points: 3.0
FE: fix redux console errors draw function

**Solution needs to be discussed**, see https://gitlab.com/opengeoweb/opengeoweb/-/merge_requests/1987#note_1162617666 
Meeting planned for Friday 25 Nov at 10.00

- In `opengeoweb/apps/geoweb/src/app/store.ts` set `serializableCheck` to true.
- nx serve
- open timeseries preset

Fix redux console errors about `A non-serializable value was detected in the state` for `drawFunction`

link to redux doc https://redux.js.org/faq/organizing-state#can-i-put-functions-promises-or-other-non-serializable-items-in-my-store-state

![Screenshot_2022-10-31_at_14.27.33](/uploads/17a86e0cc94cffceb8aac4a95249da4b/Screenshot_2022-10-31_at_14.27.33.png)

Possible solutions:
- we might need to change the type of values we store, avoid non-serializable values
- make the serializableCheck ignore specific parts for the non-serializable values that we need to store, see for an example https://github.com/maxmantz/redux-oidc/issues/169#issuecomment-693474948

Story points: 3.0
FE: fix redux console errors time interval

- In `opengeoweb/apps/geoweb/src/app/store.ts` set `serializableCheck` to true.
- nx serve
- add a harmonie layer to the map

OR
- nx storybook core
- go to http://localhost:5001/?path=/story/application-demo--geo-web-demo

Fix redux console errors about `A non-serializable value was detected in the state` for TimeInterval

link to redux doc https://redux.js.org/faq/organizing-state#can-i-put-functions-promises-or-other-non-serializable-items-in-my-store-state

![Screenshot_2022-10-31_at_14.27.23](/uploads/d86260ab89b506e48efef3b0c2c91283/Screenshot_2022-10-31_at_14.27.23.png)

Possible solutions:
- we might need to change the type of values we store, avoid non-serializable values
- make the serializableCheck ignore specific parts for the non-serializable values that we need to store, see for an example https://github.com/maxmantz/redux-oidc/issues/169#issuecomment-693474948

Story points: 3.0
BE: Deployment: Describe deployment procedure with microservices

During discussion on 31-10-2022 we decided to continue with the microservices direction.

We need to extend the deployment procedure with a description which version (tag) of the microservice is deployed.

Write this in:
https://gitlab.com/KNMI/geoweb/geoweb-serverless-backend#making-a-new-deployment

Story points: 1.0
FE: Add refresh button for your own WMS service in service list

- Add a refresh button at all services giving the user the option to refresh his WMS when he wants.
- Show it for all services
- Add a tooltip for the refresh button saying: 'Reload WMS service'
- Add Snackbar indicating that his WMS service is refreshed.
- Clear the image store for legend and getmap to ensure new image data is loaded.

![image](/uploads/889dedcb941bff13b60de7305731b476/image.png)

Story points: 3.0
FE: Display MetNo Cap feed warnings in Gantt timeline

Use https://cap.opengeoweb.com/allalerts?url=https://api.met.no/weatherapi/metalerts/1.1

Check if the TypeScript type can represent the warning items, this type can be extended in the future to accomodate extra warning properties.

Warning item type should have:
- title
- description
- link
- author
- category
- area (identifier as string)
- phenomenon - (These need to be obtained from the title)
- color - (These need to be obtained from the title)
- guid
- pubDate
- endDate - (These need to be obtained from the title, last item in the comma separated list)
- startDate - (These need to be obtained from the title)

Result is a new storybook displaying the CAP feed in the Gantt component.

Story points: 5.0
FE: Make proof of concept with the Gantt library

Put the mentioned functionalities in https://gitlab.com/opengeoweb/geoweb-assets/-/issues/2258

Use some fake (dummy) data, possibly from the CAP library.

- Add unit test
- ~~- Add snapshot~~ since it's a POC, we decided to not include a snapshot. After we have design we should do it

If it is becomes too big, split this tickets into smaller.

Story points: 5.0
FE: Find OS timeline component (Gantt)

Find a suitable library and try it out. Result is a MR with a storybook demonstrating the new library. Should be done at first in the nx CAP library.

- Suitable to use in React, if possible react based
- Well maintained
- Should handle many items, the library should be able to represent many warnings.
- It should support all functionalities as described in the user story https://gitlab.com/opengeoweb/geoweb-assets/-/issues/2258

Story points: 3.0
FE: sigmet/airmet fix form error styling

The optional styling works nice for the form, because all inputs are now aligned in height but not when there is an error, it show on top of the other optional field:

![Screenshot_2022-10-18_at_14.38.03](/uploads/5142288e0bf2ba36df1eed5df94af20b/Screenshot_2022-10-18_at_14.38.03.png)

Make sure both are visible, maybe the second one (or all errors) could get a relative position, it's not bad to push the form content when there are errors. Snapshot should not change initially, only for when showing an error 

Also make sure to add a snapshot for field errors, so this won't happen again

Story points: 2.0
BE: fix unstable MapPresets functionality

In the TST environment, the performance of the MapPresets is unstable: you need at least two attempts to open the list of MapPresets, often you cannot immediately open a preset but first need to open another one, and saving and opening a custom user preset also needs at least two attempts.

The issue may seem to lie in the NGINX configuration: https://gitlab.com/opengeoweb/backend-services/presets-backend/-/blob/main/nginx/nginx.conf#L114

Currently, it impedes the passing of smoketests of the geoweb serverless BE

Story points: 3.0
BE: Load workspace presets from BE - KNMI / taf

Follow up of https://gitlab.com/opengeoweb/opengeoweb/-/issues/3412

Copy KNMI hamburger menu contents to workspace preset database, this also includes adding mappresets in the workspaces

To move: taf, ~~presets, satcomp presets~~

### Testing criteria

* check if any workspace presets are available in the hamburger menu
* check if all workspace presets expected show up in workspace select

Story points: 2.0
BE: Load workspace presets from BE - KNMI / satcomp

Follow up of https://gitlab.com/opengeoweb/opengeoweb/-/issues/3412


Copy KNMI hamburger menu contents to workspace preset database, this also includes adding mappresets in the workspaces

To move: ~~taf, presets,~~ satcomp presets

### Testing criteria

* check if any workspace presets are available in the hamburger menu
* check if all workspace presets expected show up in workspace select

Story points: 2.0
FE: handle fallback for non backend connected

When no backend_url for presets (workspaces) is present, we should load workspaces from fakeApi. Gitlab support will be dropped

- inside Workspace replace the `ScreenManagerApiWrapper` with `ApiProvider`. 
- import fakeAPi and realApi and API_NAME from screenmanager
- depending on 
```
        createApi={config?.GW_PRESET_BACKEND_URL ? createApiWorkspace : createFakeApiWorkspace}
```
- remove the `ScreenManagerApiWrapper` apiWrapper

Story points: 3.0
FE screenmanager store types are not correct

See `ScreenManagerPreset` and `ScreenManagerViewType`, they are not correct. It seems they have some overlap, but when using it in tests you can quickly see there are issues. 
- store type should be same as in Type
- all tests with store tests should use the correct type (https://gitlab.com/opengeoweb/opengeoweb/-/merge_requests/2339#note_1320821300)

Story points: 2.0
FE: error state on fetch workspace

how does it look when
- workspace can't be loaded
- when a viewpreset can't be loaded (screenshot shows map, but we don't know that)
- errors should be able to be dismissed 


When error on workspace
- show error notifiction without screenmanager view (completely grey)
- make sure to retry and close it

add error stories
- add storybook examples

![image__1_](/uploads/78dc412fef9bee365ecc978603e114b5/image__1_.png)

Story points: 3.0
FE: Implement MenuSelectList Connect

Implemented the connected component of `WorkspaceSelectList` that connects to the redux store and retrieves the list and the selected workspace from the store. Some logic that now is done in `WorkspaceDetail` can be moved over there, as the `screenManagerActions.fetchWorkspace` action

- create WorkspaceSelectListConnect
- use selector from store to retrieve the list of workspaceListItems
- pass workspaceListItems to the underlying component
- on click list item, should trigger `screenManagerActions.fetchWorkspace`
- move `fetchWorkspaceList` in `WorkspaceDetail`  the new connect component. 

After this is done, the list with links that now is rendered in WorkspaceDetail can be removed as we don't use it anymore, leaving only the home button

Story points: 3.0
BE: Load workspace presets from BE - KNMI

Copy KNMI hamburger menu contents to workspace preset database, this also includes adding mappresets in the workspaces

To move: taf, presets, satcomp presets

### Testing criteria

* check if any workspace presets are available in the hamburger menu
* check if all workspace presets expected show up in workspace select


##### Follow up
Tickets: https://gitlab.com/opengeoweb/opengeoweb/-/issues/3430 & https://gitlab.com/opengeoweb/opengeoweb/-/issues/3431

Story points: 5.0
FE: create WorkspaceTabConnect

After https://gitlab.com/opengeoweb/opengeoweb/-/issues/3383 is merged, the current selected workspace is there so we can use it to show the title of the workspace inside the WorkspaceTab.

1. Create a new WorkspaceTabConnect inside WorkspaceTab
2. Create a new selector, getWorkspaceTitle and use it there
3. Pass the title to the WorkspaceTab component
4. Include the WorkspaceTabConnect inside apps/geoweb/src/app/pages/workspace/WorkspaceLayout.tsx

Story points: 3.0
FE: add loading state for workspacepresetList

Make sure workspacepresetList has a loading and error state. Perhaps better to split this ticket, and possible depending on https://gitlab.com/opengeoweb/opengeoweb/-/issues/3422 to have the connected component in 

example new state:
```
workspaceList: {
    // new props
    isFetching: true,   
    // current props
    ids: [
      'workspaceSomeId',    
    ],
    entities: {
      workspaceSomeId: {
        id: 'emptyMapView',
        date: '2023-03-21T15:21:15.089171',
        title: 'Empty Map',
        scope: 'system'
      },      
    }
  },
```


Loading:
- add `isFetching` to the `workspaceList` reducer
- make it true on `fetchWorkspaceList` and false on `fetchedWorkspaceList`
- create a new selector like `getIsWorkspaceListFetching`
- use the selector to show the loading state for the preset list.

Story points: 3.0
FE: change border radius from 5 to 3

The border-radius should be turned from 5 to 3. Inside `libs/theme/src/lib/components/Theme/utils.ts` you can see the `BORDER_RADIUS` is already set to 3. Somehow the button's (like the map zoom buttons, and pretty much all other buttons) don't use it and have 5 as border-radius.

Find how why they are not respecting the `BORDER_RADIUS` and fix it. Maybe some components in `libs/theme/src/lib/components/Theme/utils.ts` are missing the default value of `BORDER_RADIUS`

Story points: 3.0
FE: screenmanager cleanup providers

Screenmanager has a a lot of provider files:
- Providers folder
- ScreenManagerProvider
- TestWrapper
- TestWrapperWith store

I think we can limit this to 2 wrappers: 
- Providers/ScreenManagerProvider
- Providers/ScreenManagerStoreProvider

Only 2 are needed for connected and unconnected components. We can use it for stories and tests. See the presets lib for inspiriation

Story points: 3.0
FE: create workspace demo page inside screenmanager lib

Currently the screenmanager has a `ScreenManager.stories.tsx` main demo page. Here we are loading screenPresets without any api with the old code.

We should create a new `Workspace.stories.tsx` demo page, where we can try out loading and testing the full workspace UI with the fakeApi (wrap story with `WorkspacePresetsProvider`). For now, show what we have that mimics what we have on app. Just a basic app header without content (use the AppLayout), and wrapped with the ApiProvider using the fakeApi like:

![Screenshot_2023-03-14_at_15.54.54](/uploads/853a8086a5dda2e4e59b02f6607be004/Screenshot_2023-03-14_at_15.54.54.png)

Story points: 3.0
BE: Make python lambda for monitoring adaguc-server getCapabilities

- This should be done for all configured datasets
- Should read the getCapabilities file and report the time dimension for each layer
- Should also report the amount of seconds since current time for each layer. 
- Time resolution should be extracted from the time dimension. 
- Log this as json so Kibana can pick it up.

See repo in https://gitlab.com/KNMI/geoweb/backend-services/monitor-wms

Story points: 3.0
Open workspace preset

- after clicking on a workspace preset in the workspace menu, make a call to fetch the workspace preset from the BE.
- update url with opening workspace preset. in storybook, check how this is implemented. maybe we can separate by making some detail examples
- fetch mappresets based in mappreset ids in allIds
- if one of the mappresets in the workspace preset fails to load, a banner should show saying that the mappreset failed to load. include a reload/retry button. 
- if one of the mappresets in the workspace preset was deleted, a banner should show up that the mappreset no longer exists and cannot be loaded


```json
 {
    "id": "RadarAndSatelliteScreenConfig",
    "title": "Radar and satellite",
    "abstract": "some long string"
    "views": {
      "allIds": ["screenSat", "screenRadar"]
    },
    "syncGroups": [
      { "id": "Area_SatRadar", "type": "SYNCGROUPS_TYPE_SETBBOX" },
      { "id": "Time_SatRadar", "type": "SYNCGROUPS_TYPE_SETTIME" }
    ],
    "viewType": "multiWindow",
    "mosaicNode": {
      "direction": "row",
      "first": "screenSat",
      "second": "screenRadar"
    }
}
```

Story points: 5.0
BE: Open workspace preset - endpoint open workspace by id/detail

- workspace presets saved in database. links to mappreset, saves the display configuration and syncing as is shown in schema below
- allIds refers to mappreset id s

```json
 {
    "id": "RadarAndSatelliteScreenConfig",
    "title": "Radar and satellite",
    "views": {
      "allIds": ["screenSat", "screenRadar"]
    },
    "syncGroups": [
      { "id": "Area_SatRadar", "type": "SYNCGROUPS_TYPE_SETBBOX" },
      { "id": "Time_SatRadar", "type": "SYNCGROUPS_TYPE_SETTIME" }
    ],
    "viewType": "multiWindow",
    "mosaicNode": {
      "direction": "row",
      "first": "screenSat",
      "second": "screenRadar"
    }
}
```

Story points: 5.0
BE: Implement workspace select menu UI - setup workspace presets

Set up basis for workspace presets. Create table, setup link to mappresets to appear in workspace presets based on mappreset id.

Should return title, scope and abstract (minimum) to be displayed in workspace menu, also: id's of mappreset in workspace preset. 

Include functionality to load default workspace presets (the menu presets) during startup. Start with basic list from opengeoweb. Each institute can later provide their own initial workspace presets to be shown by default.

(To open: FE will request workspace preset from BE. BE will return the id's of the mappresets that are linked in the workspace presets. FE will do another call to fetch the mappresets that belong in workspace preset)

Story points: 5.0
BE: Implement workspace select menu UI - implement list call

Implement endpoint to return a list of workspace presets. Sorting: system presets first, alphabetical. Followed by user presets, alphabetical.

Should return id, date, title, scope and abstract (at minimum) to be displayed in workspace menu (also: id's of mappreset in workspace preset?)

No max length yet (and no user presets yet).


Example:
```json
  {
    "id": "Radar",                          # required
    "date": "2022-06-01T12:34:27.787184",
    "title": "Radar",                       # required
    "scope": "user",                        # required
    "abstract": "some long string",
    "viewType": "tiledWindow"               # required
  },
```

Story points: 3.0
Implement workspace select menu UI - create fakeAPI

Create a FakeAPI to support developing of workspace presets in storybooks. Include wrapper. Inside app, should use real API. Implement workspace calls, but also viewpreset calls. 

If you wrap API provider with workspace api, can you remove API provider work viewpreset api (only try, no fixing required)

Set up in discussion with BE, so that real api and fake api align.

Story points: 3.0
Implement workspace select menu UI - list items

The name of the menu should be `Workspace Select` (shown in the topbar). Should display a list of workspace presets. Start with a fake list to display. Add snapshot as well. This does not include filtering (and sorting will be done in BE)

For opening with click, use a callback param. Because we need to wire it up with routing probably

It has two main components, a WorspaceSelect (not sure if correct name) and a WorkspaceSelectConnect component. This wrapper has store selectors to get the presets from the store and has the only connection to redux. It will pas them to WorkSpaceSelect component.

For the WorkspaceSelectConnect we need some new store actions. I suggest wait for that until we have the full store moved from presets

Story points: 3.0
Implement workspace menu (options) UI - top bar with tab

Just the title and tab, without button functionality. Add a fake title, hook up with routes when that works. Include snapshots

Logic for italic display will be done in a later ticket.

Should be a seperate component inside the screenmanager storybook. Can be included inside the app header as child? 

![Screenshot_2023-03-13_at_14.04.04](/uploads/e5a3cecabf73cd1e4594219f7789676e/Screenshot_2023-03-13_at_14.04.04.png)

Story points: 3.0
FE: Starting page workspace presets

Following starting page design: https://app.zeplin.io/project/5ecf84a3c6ae1047a368f393/screen/63f39f8146fcd10f3a7243fb

Make sure when you are on an unselected workspace (new empty map) that the dialog is triggered (both app as storybook)

![Screenshot_2023-03-21_at_09.33.27](/uploads/ac0a1a6f3c775a16876d59d67abdb6ff/Screenshot_2023-03-21_at_09.33.27.png)

Story points: 3.0
Routes for workspaces - create a workspace route

Create a new route to access workspace logic from inside the GeoWeb App. The component should be created inside pages. For now uses only the layout of the application, and the text `Workspaces`.

We will use this page to import all the logic that will be used for the workspace presets. Right now, we have a homepage with all modules imported, can leave that untouched for now. This way, we can leave current code untouched and work in a separate component on workspaces and import the required components. Hook the application up with the screenmanager library. 


The page should only be accessible via the URL, not via the application

- create a new folder inside pages called workspace 
- inside workspace create a new component called Workspace. This hold the text 'Workspace' and has the page layout. 
- create a new route inside app.tsx called `/workspace` and import the Workspace component

Story points: 3.0
POC Routes for workspaces - if refresh page, stay on same route

Make a POC of routes, make sure if you refresh your page, that you stay on the page. Current place/url should be saved before refreshing. A POC was created, but should be tested on a build

Can try with a `hello world`, test for every institute (make sure that re-routing is working for every institute, with cognito/gitlab login for example). Test is locally, also with a build (not nx serve, but build it)


After this ticket, is will be more clear what steps need to be taken to finish the routes

Story points: 5.0
BE: update serverless and presets repo BE documentation with latest new config example

When working on the FE, I would expect that the serverless BE documentation has a copy and paste config to let the FE run. This is the current config we are using, should be updated in the readme. Also update the readme the presets repo
```
{
    "GW_APP_URL": "http://localhost:5400",
    "GW_AUTH_CLIENT_ID": "lhp25jhdqin65sn0sg335boru",
    "GW_AUTH_LOGIN_URL": "https://knmi-geoweb-tst.auth.eu-west-1.amazoncognito.com/oauth2/authorize?client_id={client_id}&response_type=code&scope=email+openid&redirect_uri={app_url}/code&state={state}&code_challenge={code_challenge}&code_challenge_method=S256",
    "GW_AUTH_LOGOUT_URL": "https://knmi-geoweb-tst.auth.eu-west-1.amazoncognito.com/logout?client_id={client_id}&logout_uri={app_url}/login",
    "GW_AUTH_TOKEN_URL": "https://84q8po1iql-vpce-026bc1761b17f4f69.execute-api.eu-west-1.amazonaws.com/infra/auth/token",
    "GW_FEATURE_APP_TITLE": "GeoWeb",
    "GW_FEATURE_FORCE_AUTHENTICATION": true,
    "GW_FEATURE_MENU_FEEDBACK": true,
    "GW_FEATURE_MENU_INFO": true,
    "GW_FEATURE_MENU_SATCOMP": true,
    "GW_FEATURE_MENU_VERSION": true,
    "GW_FEATURE_MODULE_AIRMET": true,
    "GW_FEATURE_MODULE_AIRMET_CONFIGURATION": "knmi.airmetConfig.json",
    "GW_FEATURE_MODULE_SIGMET": true,
    "GW_FEATURE_MODULE_SIGMET_CONFIGURATION": "knmi.sigmetConfig.json",
    "GW_FEATURE_MODULE_SPACE_WEATHER": true,
    "GW_FEATURE_MODULE_TAF": true,
    "GW_INFRA_BASE_URL": "https://84q8po1iql-vpce-026bc1761b17f4f69.execute-api.eu-west-1.amazonaws.com/infra",
    "GW_INITIAL_PRESETS_FILENAME": "knmi.initialPresets.json",
    "GW_PRESET_BACKEND_URL": "https://gwpresetsbe-tst.geoweb.dev.knmi.cloud",
    "GW_SCREEN_PRESETS_FILENAME": "knmi.screenPresets.json",
    "GW_AIRMET_BASE_URL": "https://argl88v0da-vpce-026bc1761b17f4f69.execute-api.eu-west-1.amazonaws.com/aviation",
    "GW_SIGMET_BASE_URL": "https://argl88v0da-vpce-026bc1761b17f4f69.execute-api.eu-west-1.amazonaws.com/aviation",
    "GW_SW_BASE_URL": "https://vko1z3liqc-vpce-026bc1761b17f4f69.execute-api.eu-west-1.amazonaws.com/spaceweather",
    "GW_TAF_BASE_URL": "https://argl88v0da-vpce-026bc1761b17f4f69.execute-api.eu-west-1.amazonaws.com/aviation"
  }


```

Story points: 1.0