diff --git a/app/assets/scripts/components/compare-map/index.js b/app/assets/scripts/components/compare-map/index.js index b46bc302..f4b42a9a 100644 --- a/app/assets/scripts/components/compare-map/index.js +++ b/app/assets/scripts/components/compare-map/index.js @@ -36,6 +36,7 @@ import { PanelBlockBody, } from '../common/panel-block'; import { getMosaicTileUrl } from '../../utils/mosaics'; +import { composeMosaicName } from '../../utils/mosaics'; const { restApiEndpoint } = config; @@ -117,14 +118,6 @@ const INITIAL_MAP_LAYERS = { }, }; -export const composeMosaicName = (start, end) => - `${new Date(start).toLocaleString('default', { - month: 'short', - })} - ${new Date(end).toLocaleString('default', { - month: 'short', - year: 'numeric', - })}`; - function CompareMap() { const { leftUUID, rightUUID } = useParams(); const [mapRef, setMapRef] = useState(null); diff --git a/app/assets/scripts/components/profile/project/batch-list.js b/app/assets/scripts/components/profile/project/batch-list.js index 06cb7b6b..dd9e132a 100644 --- a/app/assets/scripts/components/profile/project/batch-list.js +++ b/app/assets/scripts/components/profile/project/batch-list.js @@ -3,6 +3,7 @@ import T from 'prop-types'; import styled from 'styled-components'; import { Button } from '@devseed-ui/button'; import { Heading } from '@devseed-ui/typography'; +import tArea from '@turf/area'; import Table, { TableRow, TableCell } from '../../common/table'; import Paginator from '../../common/paginator'; @@ -17,14 +18,17 @@ import { formatDateTime } from '../../../utils/format'; import logger from '../../../utils/logger'; import useFetch from '../../../utils/use-fetch'; import { downloadGeotiff } from '../../../utils/share-link'; +import { formatThousands } from '../../../utils/format'; +import { composeMosaicName } from '../../../utils/mosaics'; const TABLE_PAGE_SIZE = 5; const TABLE_HEADERS = [ 'Id', 'AOI Name', + 'AOI Size (KM2)', + 'Started', 'Mosaic', 'Status', - 'Started', 'Download', ]; @@ -104,7 +108,11 @@ const BatchRow = ({ batch, projectId }) => { {id} {aoi?.name} - {mosaic?.name} + {formatThousands(tArea(aoi?.bounds) / 1e6)} + {formatDateTime(created)} + + {composeMosaicName(mosaic.mosaic_ts_start, mosaic.mosaic_ts_end)} + {status === 'Processing' ? ( <> @@ -121,7 +129,6 @@ const BatchRow = ({ batch, projectId }) => { status )} - {formatDateTime(created)} + `${new Date(start).toLocaleString('default', { + month: 'short', + })} - ${new Date(end).toLocaleString('default', { + month: 'short', + year: 'numeric', + })}`; diff --git a/cypress/e2e/project/batch.cy.js b/cypress/e2e/project/batch.cy.js index cfc68b26..240c63fa 100644 --- a/cypress/e2e/project/batch.cy.js +++ b/cypress/e2e/project/batch.cy.js @@ -22,7 +22,25 @@ describe('Batch predictions', () => { project_id: 1, created: new Date(Date.parse('2001-02-01')).setUTCDate(-i), updated: new Date(Date.parse('2001-02-01')).setUTCDate(i + 1), - aoi: { id: i, name: `AOI ${i}` }, + aoi: { + id: i, + name: `AOI ${i}`, + created: `2023-12-04T12:02:26.1792${i}`, + updated: `2023-12-04T12:02:26.1792${i}`, + bounds: { + type: 'Polygon', + crs: { type: 'name', properties: { name: 'EPSG:4326' } }, + coordinates: [ + [ + [-100.08922576904298, 19.28910944501149], + [-99.9700927734375, 19.28910944501149], + [-99.9700927734375, 19.17954399635705], + [-100.08922576904298, 19.17954399635705], + [-100.08922576904298, 19.28910944501149], + ], + ], + }, + }, mosaic: { id: i, name: `Mosaic ${i}` }, abort: false, completed: i !== 1, @@ -505,12 +523,13 @@ describe('Batch predictions', () => { // Check available columns cy.get('th') - .should('have.length', 6) + .should('have.length', 7) .should('include.text', 'Id') .should('include.text', 'AOI Name') + .should('include.text', 'AOI Size (KM2)') + .should('include.text', 'Started') .should('include.text', 'Mosaic') .should('include.text', 'Status') - .should('include.text', 'Started') .should('include.text', 'Download'); // Check if page is well-formed @@ -545,7 +564,45 @@ describe('Batch predictions', () => { id: 1, created: 1630056802895, updated: 1630056976364, - aoi: 1, + aoi: { + id: 1, + name: `AOI 1`, + created: `2023-12-04T12:02:26.17921`, + updated: `2023-12-04T12:02:26.17921`, + bounds: { + type: 'Polygon', + crs: { type: 'name', properties: { name: 'EPSG:4326' } }, + coordinates: [ + [ + [-100.08922576904298, 19.28910944501149], + [-99.9700927734375, 19.28910944501149], + [-99.9700927734375, 19.17954399635705], + [-100.08922576904298, 19.17954399635705], + [-100.08922576904298, 19.28910944501149], + ], + ], + }, + }, + mosaic: { + id: '3c694933cb850c3d76fa7651765ad9c2', + name: 'Sep 27, 2021 - Nov 27, 2021', + params: { + assets: ['B04', 'B03', 'B02', 'B08'], + rescale: '0,10000', + collection: 'sentinel-2-l2a', + }, + imagery_source_id: 2, + created: '2024-02-14T11:18:58.106998', + updated: '2024-02-14T11:18:58.106998', + mosaic_ts_start: '2021-09-27T10:25:31', + mosaic_ts_end: '2021-11-27T11:25:31', + ui_params: { + assets: ['B04', 'B03', 'B02'], + collection: 'sentinel-2-l2a', + color_formula: + 'Gamma+RGB+3.2+Saturation+0.8+Sigmoidal+RGB+25+0.35', + }, + }, name: 'Wesley Heights', abort: false, completed: false, @@ -555,7 +612,45 @@ describe('Batch predictions', () => { id: 2, created: 1630056802895, updated: 1630056976364, - aoi: 1, + aoi: { + id: 2, + name: `AOI 2`, + created: `2023-12-04T12:02:26.17922`, + updated: `2023-12-04T12:02:26.17922`, + bounds: { + type: 'Polygon', + crs: { type: 'name', properties: { name: 'EPSG:4326' } }, + coordinates: [ + [ + [-100.08922576904298, 19.28910944501149], + [-99.9700927734375, 19.28910944501149], + [-99.9700927734375, 19.17954399635705], + [-100.08922576904298, 19.17954399635705], + [-100.08922576904298, 19.28910944501149], + ], + ], + }, + }, + mosaic: { + id: '3c694933cb850c3d76fa7651765ad9c2', + name: 'Sep 27, 2021 - Nov 27, 2021', + params: { + assets: ['B04', 'B03', 'B02', 'B08'], + rescale: '0,10000', + collection: 'sentinel-2-l2a', + }, + imagery_source_id: 2, + created: '2024-02-14T11:18:58.106998', + updated: '2024-02-14T11:18:58.106998', + mosaic_ts_start: '2021-09-27T10:25:31', + mosaic_ts_end: '2021-11-27T11:25:31', + ui_params: { + assets: ['B04', 'B03', 'B02'], + collection: 'sentinel-2-l2a', + color_formula: + 'Gamma+RGB+3.2+Saturation+0.8+Sigmoidal+RGB+25+0.35', + }, + }, name: 'Wesley Heights', abort: true, completed: false, @@ -565,7 +660,45 @@ describe('Batch predictions', () => { id: 3, created: 1630056802895, updated: 1630056976364, - aoi: 1, + aoi: { + id: 3, + name: `AOI 3`, + created: `2023-12-04T12:02:26.17923`, + updated: `2023-12-04T12:02:26.17923`, + bounds: { + type: 'Polygon', + crs: { type: 'name', properties: { name: 'EPSG:4326' } }, + coordinates: [ + [ + [-100.08922576904298, 19.28910944501149], + [-99.9700927734375, 19.28910944501149], + [-99.9700927734375, 19.17954399635705], + [-100.08922576904298, 19.17954399635705], + [-100.08922576904298, 19.28910944501149], + ], + ], + }, + }, + mosaic: { + id: '3c694933cb850c3d76fa7651765ad9c2', + name: 'Sep 27, 2021 - Nov 27, 2021', + params: { + assets: ['B04', 'B03', 'B02', 'B08'], + rescale: '0,10000', + collection: 'sentinel-2-l2a', + }, + imagery_source_id: 2, + created: '2024-02-14T11:18:58.106998', + updated: '2024-02-14T11:18:58.106998', + mosaic_ts_start: '2021-09-27T10:25:31', + mosaic_ts_end: '2021-11-27T11:25:31', + ui_params: { + assets: ['B04', 'B03', 'B02'], + collection: 'sentinel-2-l2a', + color_formula: + 'Gamma+RGB+3.2+Saturation+0.8+Sigmoidal+RGB+25+0.35', + }, + }, name: 'Wesley Heights', abort: false, completed: true,