-
-
-
- {_showPublishModal ?
: null}
- {_showLaunchModal ?
: null}
- {_showLaunchImageModal ?
: null}
- {_showUploadGeojsonModal ? (
-
- ) : null}
- {_showApplicationAlert ?
: null}
-
+ {_appConfig ? (
+
+
+
+ {_showPublishModal ?
: null}
+ {_showLaunchModal ?
: null}
+ {_showLaunchImageModal ?
: null}
+ {_showUploadGeojsonModal ? (
+
+ ) : null}
+ {_showApplicationAlert ?
: null}
+
+ ) : (
+
+
+ {_showApplicationAlert ?
: null}
+
+ )}
)
}
diff --git a/src/App.test.jsx b/src/App.test.jsx
index 6a3abb5f..1cadb2d7 100644
--- a/src/App.test.jsx
+++ b/src/App.test.jsx
@@ -8,10 +8,13 @@ import {
setShowLaunchModal,
setShowLaunchImageModal,
setshowUploadGeojsonModal,
- setshowApplicationAlert
+ setshowApplicationAlert,
+ setappConfig
} from './redux/slices/mainSlice'
import { vi } from 'vitest'
import * as CollectionsService from './services/get-collections-service'
+import * as LoadConfigService from './services/get-config-service'
+import { mockAppConfig } from './testing/shared-mocks'
describe('App', () => {
const setup = () =>
@@ -21,7 +24,10 @@ describe('App', () => {
)
- describe('on app render', () => {
+ describe('on app render with config', () => {
+ beforeEach(() => {
+ store.dispatch(setappConfig(mockAppConfig))
+ })
afterEach(() => {
vi.restoreAllMocks()
})
@@ -30,6 +36,11 @@ describe('App', () => {
setup()
expect(spy).toHaveBeenCalledTimes(1)
})
+ it('should call LoadConfigIntoStateService once', () => {
+ const spy = vi.spyOn(LoadConfigService, 'LoadConfigIntoStateService')
+ setup()
+ expect(spy).toHaveBeenCalledTimes(1)
+ })
it('should render the PageHeader component', () => {
setup()
const PageHeaderComponent = screen.queryByTestId('testPageHeader')
@@ -114,4 +125,24 @@ describe('App', () => {
})
})
})
+ describe('on app render without config', () => {
+ afterEach(() => {
+ vi.restoreAllMocks()
+ })
+ it('should showAppLoading page', () => {
+ setup()
+ const PageHeaderComponent = screen.queryByTestId('testAppLoading')
+ expect(PageHeaderComponent).not.toBeNull()
+ })
+ it('should call LoadConfigIntoStateService once', () => {
+ const spy = vi.spyOn(LoadConfigService, 'LoadConfigIntoStateService')
+ setup()
+ expect(spy).toHaveBeenCalledTimes(1)
+ })
+ it('should call not GetCollectionsService', () => {
+ const spy = vi.spyOn(CollectionsService, 'GetCollectionsService')
+ setup()
+ expect(spy).not.toHaveBeenCalled()
+ })
+ })
})
diff --git a/src/assets/config.example.js b/src/assets/config.example.js
deleted file mode 100644
index 621034e1..00000000
--- a/src/assets/config.example.js
+++ /dev/null
@@ -1,78 +0,0 @@
-export const PUBLIC_URL = 'http://example.com/'
-export const VITE_LOGO_URL = './logo.png'
-export const VITE_LOGO_ALT = 'Alt description for my custom logo'
-export const VITE_SHOW_PUBLISH_BTN = false
-export const VITE_DEFAULT_COLLECTION = 'collection-name'
-export const VITE_STAC_API_URL = 'https://api-endpoint.example.com'
-export const VITE_API_MAX_ITEMS = 200
-export const VITE_SCENE_TILER_URL = 'https://titiler.example.com'
-export const VITE_DASHBOARD_BTN_URL = 'https://dashboard.example.com'
-export const VITE_ANALYZE_BTN_URL = 'https://dashboard.example.com'
-export const VITE_CF_TEMPLATE_URL = 'https://cf-template.example.com'
-export const VITE_SCENE_TILER_PARAMS = {
- 'sentinel-2-l2a': {
- assets: ['red', 'green', 'blue'],
- color_formula: 'Gamma+RGB+3.2+Saturation+0.8+Sigmoidal+RGB+12+0.35'
- },
- 'landsat-c2-l2': {
- assets: ['red', 'green', 'blue'],
- color_formula: 'Gamma+RGB+1.7+Saturation+1.7+Sigmoidal+RGB+15+0.35'
- },
- naip: { assets: ['image'], bidx: '1,2,3' },
- 'cop-dem-glo-30': {
- assets: ['data'],
- colormap_name: 'terrain',
- rescale: ['-1000,4000']
- },
- 'cop-dem-glo-90': {
- assets: ['data'],
- colormap_name: 'terrain',
- rescale: ['-1000,4000']
- },
- 'sentinel-1-grd': {
- assets: ['vv'],
- rescale: ['0,250'],
- colormap_name: 'plasma'
- }
-}
-export const VITE_MOSAIC_TILER_URL = 'https://titiler-mosaic.example.com'
-export const VITE_MOSAIC_TILER_PARAMS = {
- 'sentinel-2-l2a': { assets: ['visual'] },
- 'landsat-c2-l2': {
- assets: ['red'],
- color_formula: 'Gamma+R+1.7+Sigmoidal+R+15+0.35'
- },
- naip: { assets: ['image'], bidx: '1,2,3' },
- 'cop-dem-glo-30': {
- assets: ['data'],
- colormap_name: 'terrain',
- rescale: ['-1000,4000']
- },
- 'cop-dem-glo-90': {
- assets: ['data'],
- colormap_name: 'terrain',
- rescale: ['-1000,4000']
- },
- 'sentinel-1-grd': {
- assets: ['vv'],
- rescale: ['0,250'],
- colormap_name: 'plasma'
- }
-}
-export const VITE_MOSAIC_MAX_ITEMS = 100
-export const VITE_MOSAIC_MIN_ZOOM_LEVEL = 7
-export const VITE_COLORMAP = 'viridis'
-export const VITE_SEARCH_MIN_ZOOM_LEVELS = {
- 'sentinel-2-l2a': { medium: 4, high: 7 },
- 'landsat-c2-l2': { medium: 4, high: 7 },
- naip: { medium: 10, high: 14 },
- 'cop-dem-glo-30': { medium: 6, high: 8 },
- 'cop-dem-glo-90': { medium: 6, high: 8 },
- 'sentinel-1-grd': { medium: 7, high: 7 }
-}
-export const VITE_BASEMAP_URL =
- 'https://tile-provider.example.com/{z}/{x}/{y}.png'
-export const VITE_BASEMAP_HTML_ATTRIBUTION =
- '©
Launch Your Own
-
{APP_NAME}
+
{DEFAULT_APP_NAME}
- Now you can view your own datasets by deploying {APP_NAME} into your
- AWS account! Simply follow the instructions below to get started.
+ Now you can view your own datasets by deploying {DEFAULT_APP_NAME}{' '}
+ into your AWS account! Simply follow the instructions below to get
+ started.
Sign In to the Console
@@ -62,7 +63,7 @@ const LaunchModal = () => {
Create a new CloudFormation Stack with the template link below
Configure new Stack as needed
- Launch your own {APP_NAME}
+ Launch your own {DEFAULT_APP_NAME}
onButtonClick()}>
diff --git a/src/components/Layout/Content/BottomContent/BottomContent.jsx b/src/components/Layout/Content/BottomContent/BottomContent.jsx
index f039fa0e..96cdd960 100644
--- a/src/components/Layout/Content/BottomContent/BottomContent.jsx
+++ b/src/components/Layout/Content/BottomContent/BottomContent.jsx
@@ -1,15 +1,10 @@
import React from 'react'
import './BottomContent.css'
-import { MOSAIC_MIN_ZOOM, APP_NAME } from '../../../defaults'
+import { DEFAULT_MOSAIC_MIN_ZOOM, DEFAULT_APP_NAME } from '../../../defaults'
import LeafMap from '../../../LeafMap/LeafMap'
import PopupResults from '../../../PopupResults/PopupResults'
import LoadingAnimation from '../../../LoadingAnimation/LoadingAnimation'
import Legend from '../../../Legend/Legend'
-import {
- VITE_CF_TEMPLATE_URL,
- VITE_SHOW_PUBLISH_BTN,
- VITE_ANALYZE_BTN_URL
-} from '../../../../assets/config.js'
import { useSelector, useDispatch } from 'react-redux'
import {
setShowPublishModal,
@@ -24,7 +19,6 @@ import {
import Box from '@mui/material/Box'
const BottomContent = () => {
- // set up useSelector to get value from store
const _map = useSelector((state) => state.mainSlice.map)
const _showAppLoading = useSelector((state) => state.mainSlice.showAppLoading)
const _searchResults = useSelector((state) => state.mainSlice.searchResults)
@@ -40,19 +34,16 @@ const BottomContent = () => {
const _isDrawingEnabled = useSelector(
(state) => state.mainSlice.isDrawingEnabled
)
+ const _appConfig = useSelector((state) => state.mainSlice.appConfig)
- // if you are setting redux state, call dispatch
const dispatch = useDispatch()
- const ANALYZE_LINK = VITE_ANALYZE_BTN_URL
- const SHOW_PUBLISH_BTN = VITE_SHOW_PUBLISH_BTN
- const CF_TEMPLATE_URL = VITE_CF_TEMPLATE_URL
- const VIEWER_BTN_TEXT = `Launch Your Own ${APP_NAME}`
+ const VIEWER_BTN_TEXT = `Launch Your Own ${DEFAULT_APP_NAME}`
const resultType = _searchType === 'hex' ? 'hex cells' : 'grid cells'
function onAnalyzeClick() {
- window.open(ANALYZE_LINK, '_blank')
+ window.open(_appConfig.ANALYZE_BTN_URL, '_blank')
}
function onPublishClick() {
@@ -65,6 +56,8 @@ const BottomContent = () => {
function onZoomClick() {
if (_viewMode === 'mosaic') {
+ const MOSAIC_MIN_ZOOM =
+ _appConfig.MOSAIC_MIN_ZOOM_LEVEL || DEFAULT_MOSAIC_MIN_ZOOM
_map.setZoom(MOSAIC_MIN_ZOOM)
setMapZoomLevel(MOSAIC_MIN_ZOOM)
dispatch(setShowZoomNotice(false))
@@ -90,17 +83,17 @@ const BottomContent = () => {
)}
- {ANALYZE_LINK && (
+ {_appConfig.ANALYZE_BTN_URL && (
onAnalyzeClick()}>
Analyze
)}
- {SHOW_PUBLISH_BTN === true && (
+ {_appConfig.SHOW_PUBLISH_BTN === true && (
onPublishClick()}>
Publish
)}
- {CF_TEMPLATE_URL && (
+ {_appConfig.CF_TEMPLATE_URL && (
onLaunchClick()}>
{VIEWER_BTN_TEXT}
@@ -135,7 +128,7 @@ const BottomContent = () => {
{_showAppLoading && (
- Loading {APP_NAME}
+ Loading {DEFAULT_APP_NAME}
)}
{_searchType === 'hex' &&
diff --git a/src/components/Layout/Content/BottomContent/BottomContent.test.jsx b/src/components/Layout/Content/BottomContent/BottomContent.test.jsx
index ad2fb9c1..d05a9804 100644
--- a/src/components/Layout/Content/BottomContent/BottomContent.test.jsx
+++ b/src/components/Layout/Content/BottomContent/BottomContent.test.jsx
@@ -6,12 +6,14 @@ import { Provider } from 'react-redux'
import { store } from '../../../../redux/store'
import {
setSearchResults,
- setisDrawingEnabled
+ setisDrawingEnabled,
+ setappConfig
} from '../../../../redux/slices/mainSlice'
import {
mockSceneSearchResult,
mockHexAggregateSearchResult,
- mockGridAggregateSearchResult
+ mockGridAggregateSearchResult,
+ mockAppConfig
} from '../../../../testing/shared-mocks'
import userEvent from '@testing-library/user-event'
import * as mapHelper from '../../../../utils/mapHelper'
@@ -26,6 +28,7 @@ describe('BottomContent', () => {
)
beforeEach(() => {
+ store.dispatch(setappConfig(mockAppConfig))
vi.mock('../../../../utils/mapHelper')
})
afterEach(() => {
diff --git a/src/components/Layout/PageHeader/PageHeader.jsx b/src/components/Layout/PageHeader/PageHeader.jsx
index 12ac2d5a..d3f07ff2 100644
--- a/src/components/Layout/PageHeader/PageHeader.jsx
+++ b/src/components/Layout/PageHeader/PageHeader.jsx
@@ -1,45 +1,42 @@
import React from 'react'
import './PageHeader.css'
-
import { OpenInNew } from '@mui/icons-material'
import logoFilmDrop from '../../../assets/logo-filmdrop-e84.png'
-import {
- PUBLIC_URL,
- VITE_LOGO_ALT,
- VITE_LOGO_URL,
- VITE_DASHBOARD_BTN_URL
-} from '../../../assets/config.js'
+import { useSelector } from 'react-redux'
+import { Box } from '@mui/material'
const PageHeader = () => {
- const DASHBOARD_LINK = VITE_DASHBOARD_BTN_URL
- const LOGO = VITE_LOGO_URL
- const ALT_TEXT = VITE_LOGO_ALT
+ const _appConfig = useSelector((state) => state.mainSlice.appConfig)
function onDashboardClick() {
- window.open(DASHBOARD_LINK, '_blank')
+ window.open(_appConfig.DASHBOARD_BTN_URL, '_blank')
}
return (
- {LOGO ? (
-
+ {_appConfig.LOGO_URL ? (
+
) : (
)}
- {DASHBOARD_LINK && (
-
onDashboardClick()}>
+ {_appConfig.DASHBOARD_BTN_URL && (
+ onDashboardClick()}>
Dashboard
-
+
)}
{
const setup = () =>
@@ -11,6 +13,10 @@ describe('PageHeader', () => {
)
+
+ beforeEach(() => {
+ store.dispatch(setappConfig(mockAppConfig))
+ })
describe('on app render', () => {
it('should load the filmdrop logo into the document', () => {
setup()
diff --git a/src/components/LeafMap/LeafMap.jsx b/src/components/LeafMap/LeafMap.jsx
index ebeab733..040195b5 100644
--- a/src/components/LeafMap/LeafMap.jsx
+++ b/src/components/LeafMap/LeafMap.jsx
@@ -1,6 +1,6 @@
import { React, useEffect, useState, useRef } from 'react'
import './LeafMap.css'
-import { useDispatch } from 'react-redux'
+import { useDispatch, useSelector } from 'react-redux'
import { setMap, setmapDrawPolygonHandler } from '../../redux/slices/mainSlice'
import * as L from 'leaflet'
import 'leaflet-draw'
@@ -11,10 +11,6 @@ import 'leaflet-geosearch/dist/geosearch.css'
import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined'
import { Tooltip } from 'react-tooltip'
import 'react-tooltip/dist/react-tooltip.css'
-import {
- VITE_BASEMAP_URL,
- VITE_BASEMAP_HTML_ATTRIBUTION
-} from '../../assets/config.js'
import DOMPurify from 'dompurify'
import {
mapClickHandler,
@@ -24,6 +20,7 @@ import {
const LeafMap = () => {
const dispatch = useDispatch()
+ const _appConfig = useSelector((state) => state.mainSlice.appConfig)
// set map ref to itself with useRef
const mapRef = useRef()
@@ -142,8 +139,8 @@ const LeafMap = () => {
}, [map])
useEffect(() => {
- if (VITE_BASEMAP_HTML_ATTRIBUTION) {
- const output = sanitize(String(VITE_BASEMAP_HTML_ATTRIBUTION))
+ if (_appConfig.BASEMAP_HTML_ATTRIBUTION) {
+ const output = sanitize(String(_appConfig.BASEMAP_HTML_ATTRIBUTION))
setmapAttribution(output)
}
}, [])
@@ -173,9 +170,10 @@ const LeafMap = () => {
>
{/* set basemap layers here: */}
@@ -204,7 +202,7 @@ const LeafMap = () => {
Leaflet
{' '}
| {' '}
- {VITE_BASEMAP_URL && mapAttribution ? (
+ {_appConfig.BASEMAP_URL && mapAttribution ? (
) : (
diff --git a/src/components/Search/Search.Advanced.test.jsx b/src/components/Search/Search.Advanced.test.jsx
deleted file mode 100644
index 8decfaaf..00000000
--- a/src/components/Search/Search.Advanced.test.jsx
+++ /dev/null
@@ -1,198 +0,0 @@
-import { vi } from 'vitest'
-import React from 'react'
-import { render, screen } from '@testing-library/react'
-import Search from './Search'
-import { Provider } from 'react-redux'
-import { store } from '../../redux/store'
-import {
- setCloudCover,
- setsearchGeojsonBoundary,
- setshowAdvancedSearchOptions
-} from '../../redux/slices/mainSlice'
-import userEvent from '@testing-library/user-event'
-import * as mapHelper from '../../utils/mapHelper'
-
-describe('Search', () => {
- const user = userEvent.setup()
- const setup = () =>
- render(
-
-
-
- )
-
- beforeEach(() => {
- vi.mock('../../utils/mapHelper')
- vi.mock('../../utils/searchHelper')
- vi.mock('../../assets/config', async () => {
- const actualConfig = await vi.importActual('../../assets/config')
- return {
- ...actualConfig,
- VITE_ADVANCED_SEARCH_ENABLED: true
- }
- })
- })
-
- afterEach(() => {
- vi.resetAllMocks()
- })
-
- describe('on render', () => {
- it('should not render auto search when VITE_ADVANCED_SEARCH_ENABLED is true', () => {
- setup()
- expect(
- screen.queryByText('test_autoSearchContainer')
- ).not.toBeInTheDocument()
- })
- it('should not render disabled search bar overlay div', async () => {
- setup()
- expect(
- screen.queryByTestId('test_disableSearchOverlay')
- ).not.toBeInTheDocument()
- })
- })
- describe('when search options changed', () => {
- it('should set showAdvancedSearchOptions to false in redux', () => {
- store.dispatch(setshowAdvancedSearchOptions(true))
- setup()
- store.dispatch(setCloudCover(5))
- expect(store.getState().mainSlice.showAdvancedSearchOptions).toBeFalsy()
- })
- })
- describe('when search button clicked', () => {
- it('should set showAdvancedSearchOptions to false in redux', async () => {
- store.dispatch(setshowAdvancedSearchOptions(true))
- setup()
- const searchButton = screen.getByRole('button', {
- name: /search/i
- })
- await user.click(searchButton)
- expect(store.getState().mainSlice.showAdvancedSearchOptions).toBeFalsy()
- })
- })
- describe('when advanced clicked', () => {
- it('should set showAdvancedSearchOptions be the opposite showAdvancedSearchOptions of in redux', async () => {
- setup()
- const advancedButton = screen.getByText(/advanced/i)
- await user.click(advancedButton)
- expect(store.getState().mainSlice.showAdvancedSearchOptions).toBeTruthy()
- await user.click(advancedButton)
- expect(store.getState().mainSlice.showAdvancedSearchOptions).toBeFalsy()
- })
- })
- describe('when draw boundary button clicked', () => {
- it('should not call functions if geom already exists', async () => {
- const spyEnableMapPolyDrawing = vi.spyOn(
- mapHelper,
- 'enableMapPolyDrawing'
- )
- store.dispatch(
- setsearchGeojsonBoundary({
- type: 'Polygon',
- coordinates: [[]]
- })
- )
- setup()
- const advancedButton = screen.getByText(/advanced/i)
- await user.click(advancedButton)
- const drawBoundaryButton = screen.getByRole('button', {
- name: /draw boundary/i
- })
- await user.click(drawBoundaryButton)
- expect(spyEnableMapPolyDrawing).not.toHaveBeenCalled()
- })
- it('should enter drawing state if geom does not exists', async () => {
- const spyEnableMapPolyDrawing = vi.spyOn(
- mapHelper,
- 'enableMapPolyDrawing'
- )
- store.dispatch(setshowAdvancedSearchOptions(true))
- setup()
- const advancedButton = screen.getByText(/advanced/i)
- await user.click(advancedButton)
- const drawBoundaryButton = screen.getByRole('button', {
- name: /draw boundary/i
- })
- await user.click(drawBoundaryButton)
- expect(spyEnableMapPolyDrawing).toHaveBeenCalled()
- expect(store.getState().mainSlice.showAdvancedSearchOptions).toBeFalsy()
- expect(store.getState().mainSlice.isDrawingEnabled).toBeTruthy()
- })
- })
- describe('when clear button clicked', () => {
- it('should not call functions if geom does not exists', async () => {
- const spyClearLayer = vi.spyOn(mapHelper, 'clearLayer')
- setup()
- const advancedButton = screen.getByText(/advanced/i)
- await user.click(advancedButton)
- const clearButton = screen.getByRole('button', {
- name: /clear/i
- })
- await user.click(clearButton)
- expect(spyClearLayer).not.toHaveBeenCalled()
- })
- it('should clear layer and close options if geom exists', async () => {
- const spyClearLayer = vi.spyOn(mapHelper, 'clearLayer')
- store.dispatch(
- setsearchGeojsonBoundary({
- type: 'Polygon',
- coordinates: [[]]
- })
- )
- setup()
- const advancedButton = screen.getByText(/advanced/i)
- await user.click(advancedButton)
- const clearButton = screen.getByRole('button', {
- name: /clear/i
- })
- await user.click(clearButton)
- expect(spyClearLayer).toHaveBeenCalled()
- expect(store.getState().mainSlice.searchGeojsonBoundary).toBeNull()
- expect(store.getState().mainSlice.showAdvancedSearchOptions).toBeFalsy()
- })
- })
- describe('when upload geojson button clicked', () => {
- it('should not call dispatch functions if geom already exists', async () => {
- store.dispatch(
- setsearchGeojsonBoundary({
- type: 'Polygon',
- coordinates: [[]]
- })
- )
- setup()
- const advancedButton = screen.getByText(/advanced/i)
- await user.click(advancedButton)
- const uploadGeojsonButton = screen.getByRole('button', {
- name: /upload geojson/i
- })
- await user.click(uploadGeojsonButton)
- expect(store.getState().mainSlice.showUploadGeojsonModal).toBeFalsy()
- })
- it('should call dispatch functions if geom does not exists', async () => {
- store.dispatch(setshowAdvancedSearchOptions(true))
- setup()
- const advancedButton = screen.getByText(/advanced/i)
- await user.click(advancedButton)
- const uploadGeojsonButton = screen.getByRole('button', {
- name: /upload geojson/i
- })
- await user.click(uploadGeojsonButton)
- expect(store.getState().mainSlice.showAdvancedSearchOptions).toBeFalsy()
- expect(store.getState().mainSlice.showUploadGeojsonModal).toBeTruthy()
- })
- })
- describe('when drawing mode enabled', () => {
- it('should render disabled search bar overlay div', async () => {
- setup()
- const advancedButton = screen.getByText(/advanced/i)
- await user.click(advancedButton)
- const drawBoundaryButton = screen.getByRole('button', {
- name: /draw boundary/i
- })
- await user.click(drawBoundaryButton)
- expect(
- screen.queryByTestId('test_disableSearchOverlay')
- ).toBeInTheDocument()
- })
- })
-})
diff --git a/src/components/Search/Search.jsx b/src/components/Search/Search.jsx
index 89471bc5..3339a315 100644
--- a/src/components/Search/Search.jsx
+++ b/src/components/Search/Search.jsx
@@ -14,10 +14,6 @@ import DateTimeRangeSelector from '../DateTimeRangeSelector/DateTimeRangeSelecto
import CloudSlider from '../CloudSlider/CloudSlider'
import CollectionDropdown from '../CollectionDropdown/CollectionDropdown'
import ViewSelector from '../ViewSelector/ViewSelector'
-import {
- VITE_MOSAIC_TILER_URL,
- VITE_ADVANCED_SEARCH_ENABLED
-} from '../../assets/config'
import KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown'
import KeyboardArrowUpIcon from '@mui/icons-material/KeyboardArrowUp'
import { newSearch, debounceNewSearch } from '../../utils/searchHelper'
@@ -46,7 +42,8 @@ const Search = () => {
const _searchGeojsonBoundary = useSelector(
(state) => state.mainSlice.searchGeojsonBoundary
)
- const mosaicTilerURL = VITE_MOSAIC_TILER_URL || ''
+ const _appConfig = useSelector((state) => state.mainSlice.appConfig)
+ const mosaicTilerURL = _appConfig.MOSAIC_TILER_URL || ''
useEffect(() => {
dispatch(setshowAdvancedSearchOptions(false))
@@ -120,7 +117,7 @@ const Search = () => {
)}
- {VITE_ADVANCED_SEARCH_ENABLED ? (
+ {_appConfig.ADVANCED_SEARCH_ENABLED ? (
{
+ const user = userEvent.setup()
const setup = () =>
render(
@@ -13,24 +23,190 @@ describe('Search', () => {
)
- beforeEach(() => {
- vi.mock('../../assets/config', async () => {
- const actualConfig = await vi.importActual('../../assets/config')
- return {
- ...actualConfig,
- VITE_ADVANCED_SEARCH_ENABLED: false
- }
- })
- })
-
afterEach(() => {
vi.resetAllMocks()
})
- describe('on render', () => {
- it('should render auto search when VITE_ADVANCED_SEARCH_ENABLED is false', () => {
- setup()
- expect(screen.getByText(/auto search/i)).toBeInTheDocument()
+ describe('if advanced search enabled is false', () => {
+ beforeEach(() => {
+ store.dispatch(setappConfig(mockAppConfig))
+ })
+ describe('on render', () => {
+ it('should render auto search when ADVANCED_SEARCH_ENABLED is false', () => {
+ setup()
+ expect(screen.getByText(/auto search/i)).toBeInTheDocument()
+ })
+ })
+ })
+ describe('if advanced search enabled is true', () => {
+ beforeEach(() => {
+ vi.mock('../../utils/mapHelper')
+ vi.mock('../../utils/searchHelper')
+ const mockAppConfigSearchEnabled = {
+ ...mockAppConfig,
+ ADVANCED_SEARCH_ENABLED: true
+ }
+ store.dispatch(setappConfig(mockAppConfigSearchEnabled))
+ })
+ describe('on render', () => {
+ it('should not render auto search when ADVANCED_SEARCH_ENABLED is true', () => {
+ setup()
+ expect(
+ screen.queryByText('test_autoSearchContainer')
+ ).not.toBeInTheDocument()
+ })
+ it('should not render disabled search bar overlay div', async () => {
+ setup()
+ expect(
+ screen.queryByTestId('test_disableSearchOverlay')
+ ).not.toBeInTheDocument()
+ })
+ })
+ describe('when search options changed', () => {
+ it('should set showAdvancedSearchOptions to false in redux', () => {
+ store.dispatch(setshowAdvancedSearchOptions(true))
+ setup()
+ store.dispatch(setCloudCover(5))
+ expect(store.getState().mainSlice.showAdvancedSearchOptions).toBeFalsy()
+ })
+ })
+ describe('when search button clicked', () => {
+ it('should set showAdvancedSearchOptions to false in redux', async () => {
+ store.dispatch(setshowAdvancedSearchOptions(true))
+ setup()
+ const searchButton = screen.getByRole('button', {
+ name: /search/i
+ })
+ await user.click(searchButton)
+ expect(store.getState().mainSlice.showAdvancedSearchOptions).toBeFalsy()
+ })
+ })
+ describe('when advanced clicked', () => {
+ it('should set showAdvancedSearchOptions be the opposite showAdvancedSearchOptions of in redux', async () => {
+ setup()
+ const advancedButton = screen.getByText(/advanced/i)
+ await user.click(advancedButton)
+ expect(
+ store.getState().mainSlice.showAdvancedSearchOptions
+ ).toBeTruthy()
+ await user.click(advancedButton)
+ expect(store.getState().mainSlice.showAdvancedSearchOptions).toBeFalsy()
+ })
+ })
+ describe('when draw boundary button clicked', () => {
+ it('should not call functions if geom already exists', async () => {
+ const spyEnableMapPolyDrawing = vi.spyOn(
+ mapHelper,
+ 'enableMapPolyDrawing'
+ )
+ store.dispatch(
+ setsearchGeojsonBoundary({
+ type: 'Polygon',
+ coordinates: [[]]
+ })
+ )
+ setup()
+ const advancedButton = screen.getByText(/advanced/i)
+ await user.click(advancedButton)
+ const drawBoundaryButton = screen.getByRole('button', {
+ name: /draw boundary/i
+ })
+ await user.click(drawBoundaryButton)
+ expect(spyEnableMapPolyDrawing).not.toHaveBeenCalled()
+ })
+ it('should enter drawing state if geom does not exists', async () => {
+ const spyEnableMapPolyDrawing = vi.spyOn(
+ mapHelper,
+ 'enableMapPolyDrawing'
+ )
+ store.dispatch(setshowAdvancedSearchOptions(true))
+ setup()
+ const advancedButton = screen.getByText(/advanced/i)
+ await user.click(advancedButton)
+ const drawBoundaryButton = screen.getByRole('button', {
+ name: /draw boundary/i
+ })
+ await user.click(drawBoundaryButton)
+ expect(spyEnableMapPolyDrawing).toHaveBeenCalled()
+ expect(store.getState().mainSlice.showAdvancedSearchOptions).toBeFalsy()
+ expect(store.getState().mainSlice.isDrawingEnabled).toBeTruthy()
+ })
+ })
+ describe('when clear button clicked', () => {
+ it('should not call functions if geom does not exists', async () => {
+ const spyClearLayer = vi.spyOn(mapHelper, 'clearLayer')
+ setup()
+ const advancedButton = screen.getByText(/advanced/i)
+ await user.click(advancedButton)
+ const clearButton = screen.getByRole('button', {
+ name: /clear/i
+ })
+ await user.click(clearButton)
+ expect(spyClearLayer).not.toHaveBeenCalled()
+ })
+ it('should clear layer and close options if geom exists', async () => {
+ const spyClearLayer = vi.spyOn(mapHelper, 'clearLayer')
+ store.dispatch(
+ setsearchGeojsonBoundary({
+ type: 'Polygon',
+ coordinates: [[]]
+ })
+ )
+ setup()
+ const advancedButton = screen.getByText(/advanced/i)
+ await user.click(advancedButton)
+ const clearButton = screen.getByRole('button', {
+ name: /clear/i
+ })
+ await user.click(clearButton)
+ expect(spyClearLayer).toHaveBeenCalled()
+ expect(store.getState().mainSlice.searchGeojsonBoundary).toBeNull()
+ expect(store.getState().mainSlice.showAdvancedSearchOptions).toBeFalsy()
+ })
+ })
+ describe('when upload geojson button clicked', () => {
+ it('should not call dispatch functions if geom already exists', async () => {
+ store.dispatch(
+ setsearchGeojsonBoundary({
+ type: 'Polygon',
+ coordinates: [[]]
+ })
+ )
+ setup()
+ const advancedButton = screen.getByText(/advanced/i)
+ await user.click(advancedButton)
+ const uploadGeojsonButton = screen.getByRole('button', {
+ name: /upload geojson/i
+ })
+ await user.click(uploadGeojsonButton)
+ expect(store.getState().mainSlice.showUploadGeojsonModal).toBeFalsy()
+ })
+ it('should call dispatch functions if geom does not exists', async () => {
+ store.dispatch(setshowAdvancedSearchOptions(true))
+ setup()
+ const advancedButton = screen.getByText(/advanced/i)
+ await user.click(advancedButton)
+ const uploadGeojsonButton = screen.getByRole('button', {
+ name: /upload geojson/i
+ })
+ await user.click(uploadGeojsonButton)
+ expect(store.getState().mainSlice.showAdvancedSearchOptions).toBeFalsy()
+ expect(store.getState().mainSlice.showUploadGeojsonModal).toBeTruthy()
+ })
+ })
+ describe('when drawing mode enabled', () => {
+ it('should render disabled search bar overlay div', async () => {
+ setup()
+ const advancedButton = screen.getByText(/advanced/i)
+ await user.click(advancedButton)
+ const drawBoundaryButton = screen.getByRole('button', {
+ name: /draw boundary/i
+ })
+ await user.click(drawBoundaryButton)
+ expect(
+ screen.queryByTestId('test_disableSearchOverlay')
+ ).toBeInTheDocument()
+ })
})
})
})
diff --git a/src/components/defaults.js b/src/components/defaults.js
index 33712032..f2a8bdee 100644
--- a/src/components/defaults.js
+++ b/src/components/defaults.js
@@ -1,20 +1,8 @@
-import {
- VITE_COLORMAP,
- VITE_API_MAX_ITEMS,
- VITE_MOSAIC_MAX_ITEMS,
- VITE_MOSAIC_MIN_ZOOM_LEVEL
-} from '../assets/config.js'
-
-export const MOSAIC_MIN_ZOOM = VITE_MOSAIC_MIN_ZOOM_LEVEL || 7
-export const APP_NAME = import.meta.env.VITE_APP_NAME || 'FilmDrop Console'
-export const MOSAIC_MAX_ITEMS = VITE_MOSAIC_MAX_ITEMS || 100
-export const API_MAX_ITEMS = VITE_API_MAX_ITEMS || 200
+export const DEFAULT_MOSAIC_MIN_ZOOM = 7
+export const DEFAULT_MOSAIC_MAX_ITEMS = 100
+export const DEFAULT_API_MAX_ITEMS = 200
export const DEFAULT_MED_ZOOM = 4
export const DEFAULT_HIGH_ZOOM = 7
-export const COLORMAP = VITE_COLORMAP || 'viridis'
-export const SearchTypes = Object.freeze({
- Scene: Symbol('scene'),
- GridCode: Symbol('gridCode'),
- GridCodeScenes: Symbol('gridCodeScene'),
- GeoHex: Symbol('geoHex')
-})
+export const DEFAULT_COLORMAP = 'viridis'
+export const DEFAULT_APP_NAME =
+ import.meta.env.VITE_APP_NAME || 'FilmDrop Console'
diff --git a/src/redux/slices/mainSlice.js b/src/redux/slices/mainSlice.js
index 2caafed7..01d28b9e 100644
--- a/src/redux/slices/mainSlice.js
+++ b/src/redux/slices/mainSlice.js
@@ -1,5 +1,4 @@
import { createSlice } from '@reduxjs/toolkit'
-import { VITE_DEFAULT_COLLECTION } from '../../assets/config.js'
// this is the initial state values for the redux store
// add to this for new state and set whatever default you want
@@ -8,7 +7,6 @@ const initialState = {
dateTime: [],
cloudCover: 0,
showCloudSlider: true,
- selectedCollection: VITE_DEFAULT_COLLECTION || null,
searchResults: null,
clickResults: [],
searchLoading: false,
@@ -35,7 +33,8 @@ const initialState = {
showUploadGeojsonModal: false,
showApplicationAlert: false,
applicationAlertMessage: 'System Error',
- applicationAlertSeverity: 'error'
+ applicationAlertSeverity: 'error',
+ appConfig: null
}
// next, for every key in the initialState
@@ -139,6 +138,9 @@ export const mainSlice = createSlice({
},
setapplicationAlertSeverity: (state, action) => {
state.applicationAlertSeverity = action.payload
+ },
+ setappConfig: (state, action) => {
+ state.appConfig = action.payload
}
}
})
@@ -177,5 +179,6 @@ export const { setshowUploadGeojsonModal } = mainSlice.actions
export const { setshowApplicationAlert } = mainSlice.actions
export const { setapplicationAlertMessage } = mainSlice.actions
export const { setapplicationAlertSeverity } = mainSlice.actions
+export const { setappConfig } = mainSlice.actions
export default mainSlice.reducer
diff --git a/src/services/get-aggregate-service.js b/src/services/get-aggregate-service.js
index 65b1bf75..7170d2f7 100644
--- a/src/services/get-aggregate-service.js
+++ b/src/services/get-aggregate-service.js
@@ -1,6 +1,5 @@
import { store } from '../redux/store'
import { setSearchLoading, setSearchResults } from '../redux/slices/mainSlice'
-import { VITE_STAC_API_URL } from '../assets/config'
import {
addDataToLayer,
buildHexGridLayerOptions,
@@ -9,9 +8,14 @@ import {
import { mapHexGridFromJson, mapGridCodeFromJson } from '../utils/searchHelper'
export async function AggregateSearchService(searchParams, gridType) {
- await fetch(`${VITE_STAC_API_URL}/aggregate?${searchParams}`, {
- method: 'GET'
- })
+ await fetch(
+ `${
+ store.getState().mainSlice.appConfig.STAC_API_URL
+ }/aggregate?${searchParams}`,
+ {
+ method: 'GET'
+ }
+ )
.then((response) => {
if (response.ok) {
return response.json()
diff --git a/src/services/get-aggregations-service.js b/src/services/get-aggregations-service.js
index 9c3498cd..59b5cd1f 100644
--- a/src/services/get-aggregations-service.js
+++ b/src/services/get-aggregations-service.js
@@ -1,8 +1,10 @@
-import { VITE_STAC_API_URL } from '../assets/config'
+import { store } from '../redux/store'
export async function GetCollectionAggregationsService(collectionId) {
return fetch(
- `${VITE_STAC_API_URL}/collections/${collectionId}/aggregations`,
+ `${
+ store.getState().mainSlice.appConfig.STAC_API_URL
+ }/collections/${collectionId}/aggregations`,
{
method: 'GET'
}
diff --git a/src/services/get-collections-service.js b/src/services/get-collections-service.js
index 9f3b5132..632d4e83 100644
--- a/src/services/get-collections-service.js
+++ b/src/services/get-collections-service.js
@@ -3,13 +3,15 @@ import {
setCollectionsData,
setShowAppLoading
} from '../redux/slices/mainSlice'
-import { VITE_STAC_API_URL } from '../assets/config'
import { buildCollectionsData, loadLocalGridData } from '../utils/dataHelper'
export async function GetCollectionsService(searchParams) {
- await fetch(`${VITE_STAC_API_URL}/collections`, {
- method: 'GET'
- })
+ await fetch(
+ `${store.getState().mainSlice.appConfig.STAC_API_URL}/collections`,
+ {
+ method: 'GET'
+ }
+ )
.then((response) => {
if (response.ok) {
return response.json()
diff --git a/src/services/get-config-service.js b/src/services/get-config-service.js
new file mode 100644
index 00000000..b9c4d5bf
--- /dev/null
+++ b/src/services/get-config-service.js
@@ -0,0 +1,24 @@
+import { store } from '../redux/store'
+import { setappConfig } from '../redux/slices/mainSlice'
+import { showApplicationAlert } from '../utils/alertHelper'
+
+export async function LoadConfigIntoStateService() {
+ await fetch(`/config/config.json`, {
+ method: 'GET'
+ })
+ .then((response) => {
+ if (response.ok) {
+ return response.json()
+ }
+ throw new Error()
+ })
+ .then((json) => {
+ store.dispatch(setappConfig(json))
+ })
+ .catch((error) => {
+ const message = 'Error Fetching Config File'
+ // log full error for diagnosing client side errors if needed
+ console.error(message, error)
+ showApplicationAlert('error', message, null)
+ })
+}
diff --git a/src/services/get-queryables-service.js b/src/services/get-queryables-service.js
index ca6d3129..c4fd1e3f 100644
--- a/src/services/get-queryables-service.js
+++ b/src/services/get-queryables-service.js
@@ -1,9 +1,14 @@
-import { VITE_STAC_API_URL } from '../assets/config'
+import { store } from '../redux/store'
export function GetCollectionQueryablesService(collectionId) {
- return fetch(`${VITE_STAC_API_URL}/collections/${collectionId}/queryables`, {
- method: 'GET'
- })
+ return fetch(
+ `${
+ store.getState().mainSlice.appConfig.STAC_API_URL
+ }/collections/${collectionId}/queryables`,
+ {
+ method: 'GET'
+ }
+ )
.then((response) => {
if (response.ok) {
return response.json()
diff --git a/src/services/get-search-service.js b/src/services/get-search-service.js
index c0dde87f..2c51e996 100644
--- a/src/services/get-search-service.js
+++ b/src/services/get-search-service.js
@@ -5,13 +5,17 @@ import {
setSearchResults,
setShowPopupModal
} from '../redux/slices/mainSlice'
-import { VITE_STAC_API_URL } from '../assets/config'
import { addDataToLayer, footprintLayerStyle } from '../utils/mapHelper'
export async function SearchService(searchParams, typeOfSearch) {
- await fetch(`${VITE_STAC_API_URL}/search?${searchParams}`, {
- method: 'GET'
- })
+ await fetch(
+ `${
+ store.getState().mainSlice.appConfig.STAC_API_URL
+ }/search?${searchParams}`,
+ {
+ method: 'GET'
+ }
+ )
.then((response) => {
if (response.ok) {
return response.json()
diff --git a/src/services/post-mosaic-service.js b/src/services/post-mosaic-service.js
index 2e4dfbb2..f1e1f2ff 100644
--- a/src/services/post-mosaic-service.js
+++ b/src/services/post-mosaic-service.js
@@ -1,10 +1,9 @@
import { store } from '../redux/store'
import { setSearchLoading } from '../redux/slices/mainSlice'
-import { VITE_MOSAIC_TILER_URL } from '../assets/config'
import { addMosaicLayer } from '../utils/mapHelper'
export async function AddMosaicService(reqParams) {
- const mosaicTilerURL = VITE_MOSAIC_TILER_URL || ''
+ const mosaicTilerURL = store.getState().mainSlice.appConfig.MOSAIC_TILER_URL
await fetch(`${mosaicTilerURL}/mosaicjson/mosaics`, reqParams)
.then((response) => {
if (response.ok) {
diff --git a/src/testing/shared-mocks.js b/src/testing/shared-mocks.js
index 74f1e190..b5270f0a 100644
--- a/src/testing/shared-mocks.js
+++ b/src/testing/shared-mocks.js
@@ -3442,3 +3442,109 @@ export const mockSceneSearchResult = {
}
]
}
+
+export const mockAppConfig = {
+ PUBLIC_URL: 'http://example.com/',
+ LOGO_URL: './logo.png',
+ LOGO_ALT: 'Alt description for my custom logo',
+ SHOW_PUBLISH_BTN: false,
+ DEFAULT_COLLECTION: 'collection-name',
+ STAC_API_URL: 'https://api-endpoint.example.com',
+ API_MAX_ITEMS: 200,
+ SCENE_TILER_URL: 'https://titiler.example.com',
+ DASHBOARD_BTN_URL: 'https://dashboard.example.com',
+ ANALYZE_BTN_URL: 'https://dashboard.example.com',
+ CF_TEMPLATE_URL: 'https://cf-template.example.com',
+ SCENE_TILER_PARAMS: {
+ 'sentinel-2-l2a': {
+ assets: ['red', 'green', 'blue'],
+ color_formula: 'Gamma+RGB+3.2+Saturation+0.8+Sigmoidal+RGB+12+0.35'
+ },
+ 'landsat-c2-l2': {
+ assets: ['red', 'green', 'blue'],
+ color_formula: 'Gamma+RGB+1.7+Saturation+1.7+Sigmoidal+RGB+15+0.35'
+ },
+ naip: {
+ assets: ['image'],
+ bidx: '1,2,3'
+ },
+ 'cop-dem-glo-30': {
+ assets: ['data'],
+ colormap_name: 'terrain',
+ rescale: ['-1000,4000']
+ },
+ 'cop-dem-glo-90': {
+ assets: ['data'],
+ colormap_name: 'terrain',
+ rescale: ['-1000,4000']
+ },
+ 'sentinel-1-grd': {
+ assets: ['vv'],
+ rescale: ['0,250'],
+ colormap_name: 'plasma'
+ }
+ },
+ MOSAIC_TILER_URL: 'https://titiler-mosaic.example.com',
+ MOSAIC_TILER_PARAMS: {
+ 'sentinel-2-l2a': {
+ assets: ['visual']
+ },
+ 'landsat-c2-l2': {
+ assets: ['red'],
+ color_formula: 'Gamma+R+1.7+Sigmoidal+R+15+0.35'
+ },
+ naip: {
+ assets: ['image'],
+ bidx: '1,2,3'
+ },
+ 'cop-dem-glo-30': {
+ assets: ['data'],
+ colormap_name: 'terrain',
+ rescale: ['-1000,4000']
+ },
+ 'cop-dem-glo-90': {
+ assets: ['data'],
+ colormap_name: 'terrain',
+ rescale: ['-1000,4000']
+ },
+ 'sentinel-1-grd': {
+ assets: ['vv'],
+ rescale: ['0,250'],
+ colormap_name: 'plasma'
+ }
+ },
+ MOSAIC_MAX_ITEMS: 100,
+ MOSAIC_MIN_ZOOM_LEVEL: 7,
+ CONFIG_COLORMAP: 'viridis',
+ SEARCH_MIN_ZOOM_LEVELS: {
+ 'sentinel-2-l2a': {
+ medium: 4,
+ high: 7
+ },
+ 'landsat-c2-l2': {
+ medium: 4,
+ high: 7
+ },
+ naip: {
+ medium: 10,
+ high: 14
+ },
+ 'cop-dem-glo-30': {
+ medium: 6,
+ high: 8
+ },
+ 'cop-dem-glo-90': {
+ medium: 6,
+ high: 8
+ },
+ 'sentinel-1-grd': {
+ medium: 7,
+ high: 7
+ }
+ },
+ BASEMAP_URL: 'https://tile-provider.example.com/{z}/{x}/{y}.png',
+ BASEMAP_HTML_ATTRIBUTION:
+ '© TileProvider ',
+ ADVANCED_SEARCH_ENABLED: false,
+ CART_ENABLED: false
+}
diff --git a/src/utils/colorMap.js b/src/utils/colorMap.js
index 5850198d..486387d5 100644
--- a/src/utils/colorMap.js
+++ b/src/utils/colorMap.js
@@ -1,9 +1,11 @@
-import { COLORMAP } from '../components/defaults'
+import { DEFAULT_COLORMAP } from '../components/defaults'
import colormap from 'colormap'
+import { store } from '../redux/store'
export const colorMap = (largestRatio) => {
return colormap({
- colormap: COLORMAP,
+ colormap:
+ store.getState().mainSlice.appConfig.CONFIG_COLORMAP || DEFAULT_COLORMAP,
nshades: Math.round(Math.max(9, largestRatio)),
format: 'hex'
})
diff --git a/src/utils/mapHelper.js b/src/utils/mapHelper.js
index 7f43bb2a..2e25b972 100644
--- a/src/utils/mapHelper.js
+++ b/src/utils/mapHelper.js
@@ -12,14 +12,9 @@ import {
} from '../redux/slices/mainSlice'
import { searchGridCodeScenes, debounceNewSearch } from './searchHelper'
import debounce from './debounce'
-import {
- VITE_SCENE_TILER_URL,
- VITE_SCENE_TILER_PARAMS,
- VITE_MOSAIC_MIN_ZOOM_LEVEL,
- VITE_MOSAIC_TILER_PARAMS
-} from '../assets/config'
import { GetMosaicBoundsService } from '../services/get-mosaic-bounds'
import GeoJSONValidation from './geojsonValidation'
+import { DEFAULT_MOSAIC_MIN_ZOOM } from '../components/defaults'
export const footprintLayerStyle = {
color: '#3183f5',
@@ -298,7 +293,8 @@ export function mapCallDebounceNewSearch() {
export const debounceTitilerOverlay = debounce(() => addImageOverlay(), 800)
function addImageOverlay() {
- const sceneTilerURL = VITE_SCENE_TILER_URL || ''
+ const sceneTilerURL =
+ store.getState().mainSlice.appConfig.SCENE_TILER_URL || ''
const _currentPopupResult = store.getState().mainSlice.currentPopupResult
const _selectedCollectionData =
store.getState().mainSlice.selectedCollectionData
@@ -346,7 +342,6 @@ function addImageOverlay() {
}
} else {
store.dispatch(setSearchLoading(false))
- console.log('VITE_SCENE_TILER_URL is not set in env variables.')
}
})
}
@@ -364,7 +359,8 @@ function setupBounds(bbox) {
}
const constructSceneTilerParams = (collection) => {
- const envSceneTilerParams = VITE_SCENE_TILER_PARAMS || ''
+ const envSceneTilerParams =
+ store.getState().mainSlice.appConfig.SCENE_TILER_PARAMS || ''
// retrieve mosaic tiler parameters from env variable
const tilerParams = getTilerParams(envSceneTilerParams)
@@ -448,7 +444,9 @@ const parameters = {
export function setMosaicZoomMessage() {
const map = store.getState().mainSlice.map
if (map && Object.keys(map).length > 0) {
- const MOSAIC_MIN_ZOOM = VITE_MOSAIC_MIN_ZOOM_LEVEL || 7
+ const MOSAIC_MIN_ZOOM =
+ store.getState().mainSlice.appConfig.MOSAIC_MIN_ZOOM_LEVEL ||
+ DEFAULT_MOSAIC_MIN_ZOOM
if (
map.getZoom() >= MOSAIC_MIN_ZOOM ||
store.getState().mainSlice.viewMode === 'scene'
@@ -461,7 +459,8 @@ export function setMosaicZoomMessage() {
}
export const constructMosaicTilerParams = (collection) => {
- const mosaicTilerParams = VITE_MOSAIC_TILER_PARAMS || ''
+ const mosaicTilerParams =
+ store.getState().mainSlice.appConfig.MOSAIC_TILER_PARAMS || ''
// retrieve mosaic tiler parameters from env variable
const tilerParams = getTilerParams(mosaicTilerParams)
diff --git a/src/utils/searchHelper.js b/src/utils/searchHelper.js
index 46da90d4..9cc2dc62 100644
--- a/src/utils/searchHelper.js
+++ b/src/utils/searchHelper.js
@@ -1,12 +1,10 @@
import { store } from '../redux/store'
import {
- VITE_SEARCH_MIN_ZOOM_LEVELS,
- VITE_API_MAX_ITEMS,
- VITE_STAC_API_URL,
- VITE_MOSAIC_MAX_ITEMS,
- VITE_MOSAIC_TILER_PARAMS
-} from '../assets/config'
-import { DEFAULT_MED_ZOOM, DEFAULT_HIGH_ZOOM } from '../components/defaults'
+ DEFAULT_MED_ZOOM,
+ DEFAULT_HIGH_ZOOM,
+ DEFAULT_API_MAX_ITEMS,
+ DEFAULT_MOSAIC_MAX_ITEMS
+} from '../components/defaults'
import {
getCurrentMapZoomLevel,
clearAllLayers,
@@ -38,12 +36,14 @@ export function newSearch() {
const _selectedCollection = store.getState().mainSlice.selectedCollectionData
const midZoomLevel =
- VITE_SEARCH_MIN_ZOOM_LEVELS[_selectedCollection.id]?.medium ||
- DEFAULT_MED_ZOOM
+ store.getState().mainSlice.appConfig.SEARCH_MIN_ZOOM_LEVELS[
+ _selectedCollection.id
+ ]?.medium || DEFAULT_MED_ZOOM
const highZoomLevel =
- VITE_SEARCH_MIN_ZOOM_LEVELS[_selectedCollection.id]?.high ||
- DEFAULT_HIGH_ZOOM
+ store.getState().mainSlice.appConfig.SEARCH_MIN_ZOOM_LEVELS[
+ _selectedCollection.id
+ ]?.high || DEFAULT_HIGH_ZOOM
const currentMapZoomLevel = getCurrentMapZoomLevel()
@@ -104,7 +104,8 @@ function buildSearchScenesParams(gridCodeToSearchIn) {
const _dateTimeRange = convertDateForURL(
store.getState().mainSlice.searchDateRangeValue
)
- const limit = VITE_API_MAX_ITEMS || 200
+ const limit =
+ store.getState().mainSlice.appConfig.API_MAX_ITEMS || DEFAULT_API_MAX_ITEMS
const collections = _selectedCollection.id
const _searchGeojsonBoundary =
store.getState().mainSlice.searchGeojsonBoundary
@@ -423,11 +424,13 @@ function newMosaicSearch() {
const bboxFromMap = bboxFromMapBounds()
const createMosaicBody = {
- stac_api_root: VITE_STAC_API_URL,
+ stac_api_root: store.getState().mainSlice.appConfig.STAC_API_URL,
asset_name: constructMosaicAssetVal(_selectedCollectionData.id),
collections: [_selectedCollectionData.id],
datetime,
- max_items: VITE_MOSAIC_MAX_ITEMS || 100
+ max_items:
+ store.getState().mainSlice.appConfig.MOSAIC_MAX_ITEMS ||
+ DEFAULT_MOSAIC_MAX_ITEMS
}
if (_searchGeojsonBoundary) {
createMosaicBody.intersects = _searchGeojsonBoundary.geometry
@@ -456,7 +459,8 @@ function newMosaicSearch() {
}
const constructMosaicAssetVal = (collection) => {
- const envMosaicTilerParams = VITE_MOSAIC_TILER_PARAMS || ''
+ const envMosaicTilerParams =
+ store.getState().mainSlice.appConfig.MOSAIC_TILER_PARAMS || ''
const asset = getTilerParams(envMosaicTilerParams)[collection]?.assets || ''
if (!asset) {
console.log(`Assets not defined for ${collection}`)