change background to first if the background in url is invalid

src/redux/map/map.thunks.test.ts

@@ -70,6 +70,16 @@ describe('map thunks - utils', () => {
 
       expect(backgroundId).toBe(0);
     });
+
+    it('should return main map background id if query param background id is invalid', () => {
+      const store: RootState = {
+        ...INITIAL_STORE_STATE_MOCK,
+        backgrounds: { ...BACKGROUND_INITIAL_STATE_MOCK, data: BACKGROUNDS_MOCK },
+      };
+      const backgroundId = getBackgroundId(store, QUERY_DATA_WITH_BG);
+
+      expect(backgroundId).toBe(13);
+    });
   });
 
   describe('getInitMapPosition', () => {

src/redux/map/map.thunks.ts

@@ -21,7 +21,10 @@ import {
   OppenedMap,
   Position,
 } from './map.types';
-import { mainBackgroundsDataSelector } from '../backgrounds/background.selectors';
+import {
+  backgroundsDataSelector,
+  mainBackgroundsDataSelector,
+} from '../backgrounds/background.selectors';
 import {
   currentModelSelector,
   mainMapModelSelector,
@@ -37,11 +40,22 @@ import {
   INIT_OPENED_MAPS_ERROR_PREFIX,
 } from './map.constants';
 
-/** UTILS - in the same file because of dependancy cycle */
+/** UTILS - in the same file because of dependency cycle */
 
 export const getBackgroundId = (state: RootState, queryData: QueryData): number => {
   const mainMapBackground = mainBackgroundsDataSelector(state);
-  const backgroundId = queryData?.backgroundId || mainMapBackground?.id || ZERO;
+  const backgrounds = backgroundsDataSelector(state);
+  let backgroundId = queryData?.backgroundId || mainMapBackground?.id || ZERO;
+
+  if (backgrounds.length > 0) {
+    if (
+      backgrounds.filter(background => {
+        return background.id === backgroundId;
+      }).length === 0
+    ) {
+      backgroundId = backgrounds[ZERO].id;
+    }
+  }
 
   if (backgroundId !== mainMapBackground?.id) {
     PluginsEventBus.dispatchEvent('onBackgroundOverlayChange', backgroundId);