diff --git a/src/components/Accordion/WellShow/Equipment.tsx b/src/components/Accordion/WellShow/Equipment.tsx index da1cf084..f60821bf 100644 --- a/src/components/Accordion/WellShow/Equipment.tsx +++ b/src/components/Accordion/WellShow/Equipment.tsx @@ -48,9 +48,10 @@ export const EquipmentAccordion = ({ id }: { id?: number }) => { }) const { dataGridProps: deploymentsDataGridProps } = useDataGrid({ - resource: `thing/${id}/deployment`, + resource: id ? `thing/${id}/deployment` : undefined, dataProviderName: 'ocotillo', queryOptions: { + enabled: Boolean(id), cacheTime: 10 * 60 * 1000, // cached data for 10 minutes staleTime: 5 * 60 * 1000, // get data fresh for 5 minutes, }, diff --git a/src/components/Accordion/WellShow/Notes.tsx b/src/components/Accordion/WellShow/Notes.tsx new file mode 100644 index 00000000..61e46d78 --- /dev/null +++ b/src/components/Accordion/WellShow/Notes.tsx @@ -0,0 +1,71 @@ +import { + Accordion, + AccordionDetails, + AccordionSummary, + Stack, + Typography, +} from '@mui/material' +import { ExpandMore, Notes } from '@mui/icons-material' +import Grid from '@mui/material/Grid2' +import { IWell } from '@/interfaces/ocotillo/IThing' + +export const NotesAccordion = ({ well }: { well?: IWell }) => { + return ( + + } + // Match the visual height of summaries that contain a CreateButton + sx={{ + minHeight: 36, + '& .MuiAccordionSummary-content': { + margin: 0, + paddingY: 2.75, + }, + '&.Mui-expanded': { + minHeight: 36, + }, + }} + > + + + + + Notes + + + + + + + + Water Notes: + + {well?.water_notes || 'N/A'} + + + + Measuring Notes: + + {well?.measuring_notes || 'N/A'} + + + + Construction Notes: + + {well?.well_construction_notes || 'N/A'} + + + + Notes: + {well?.notes || 'N/A'} + + + + + ) +} diff --git a/src/components/Accordion/WellShow/index.ts b/src/components/Accordion/WellShow/index.ts index a1481ab6..40e9f922 100644 --- a/src/components/Accordion/WellShow/index.ts +++ b/src/components/Accordion/WellShow/index.ts @@ -1,5 +1,6 @@ export * from './Attachments' export * from './AlternateIds' -export * from './Equipment' export * from './Contacts' +export * from './Equipment' +export * from './Notes' export * from './WellScreens' diff --git a/src/components/card/CoreWellInfo.tsx b/src/components/card/CoreWellInfo.tsx index 6863daff..f9e0709d 100644 --- a/src/components/card/CoreWellInfo.tsx +++ b/src/components/card/CoreWellInfo.tsx @@ -1,4 +1,5 @@ import { IWell } from '@/interfaces/ocotillo/IThing' +import { convertLonLatToUTM, parseWktPoint } from '@/utils' import { Card, CardContent, @@ -24,6 +25,9 @@ export const CoreWellInfoCard = ({ return } + const { lon, lat } = parseWktPoint(well.current_location) + const { easting, northing } = convertLonLatToUTM({ lon, lat }) + return ( {well?.name}} /> @@ -99,37 +103,36 @@ export const CoreWellInfoCard = ({ Northing/Easting: - {`${well?.current_location?.properties?.utm_coordinates?.easting?.toFixed(0) || 'N/A'}, ${well?.current_location?.properties?.utm_coordinates?.northing?.toFixed(0) || 'N/A'}`} + {`${easting?.toFixed(0) || 'N/A'}, ${northing?.toFixed(0) || 'N/A'}`} Vertical Datum: - {well?.current_location?.properties?.vertical_datum || 'N/A'}{' '} + {well?.current_location?.vertical_datum || 'N/A'}{' '} Latitude/Longitude: - {well?.current_location?.geometry?.coordinates - ? `${well?.current_location?.geometry?.coordinates?.[0]?.toFixed(6)}, ${well?.current_location?.geometry?.coordinates?.[1]?.toFixed(6)}` + {well?.current_location?.point + ? `${lat?.toFixed(6)}, ${lon?.[1]?.toFixed(6)}` : 'N/A'} Elevation: - {well?.current_location?.properties?.elevation?.toFixed(2) || - 'N/A'} - {well?.current_location?.properties?.elevation_unit - ? ` ${well?.current_location?.properties?.elevation_unit}` + {well?.current_location?.elevation?.toFixed(2) || 'N/A'} + {well?.current_location?.elevation_unit + ? ` ${well?.current_location?.elevation_unit}` : null} Elevation Method: - {well?.current_location?.properties?.elevation_method || 'N/A'} + {well?.current_location?.elevation_method || 'N/A'} diff --git a/src/components/card/InteractiveSatelliteMap.tsx b/src/components/card/InteractiveSatelliteMap.tsx index cbb8a9fb..1246c3ef 100644 --- a/src/components/card/InteractiveSatelliteMap.tsx +++ b/src/components/card/InteractiveSatelliteMap.tsx @@ -12,6 +12,7 @@ import { import { Map } from '@mui/icons-material' import { Layer, MapRef, Source } from 'react-map-gl' import { MapComponent, MapPopup } from '@/components' +import { parseWktPoint } from '@/utils' import { useThingLayers } from '@/hooks' import { useGo } from '@refinedev/core' @@ -25,8 +26,7 @@ export const InteractiveSatelliteMapCard = ({ well }: { well: IWell }) => { const waterWellsLayer = THING_LAYERS['water-wells'] const { sourceProps, layerProps } = waterWellsLayer - const coordinates = well?.current_location?.geometry?.coordinates ?? [] - const [lon, lat] = coordinates + const { lon, lat } = parseWktPoint(well?.current_location) // Automatically zoom to well coordinates when map loads or well changes useEffect(() => { diff --git a/src/components/form/location/CreateEditLocation.tsx b/src/components/form/location/CreateEditLocation.tsx index c41af26a..3338c66a 100644 --- a/src/components/form/location/CreateEditLocation.tsx +++ b/src/components/form/location/CreateEditLocation.tsx @@ -25,7 +25,11 @@ import { MenuItem, } from '@mui/material' import wellknown from 'wellknown' -import { convertUTMToLonLat, convertLonLatToUTM } from '@/utils/UtmToLonLat' +import { + convertUTMToLonLat, + convertLonLatToUTM, + Datum, +} from '@/utils/UtmToLonLat' import { useElevation } from '@/hooks/useElevation' /** @@ -66,7 +70,7 @@ export const CreateEditLocation: React.FC = ({ //Local state for UTM zone/datum/easting/northing/lat/long since only point is sent to backend const [utmZone, setUtmZone] = useState(13) - const [utmDatum, setUtmDatum] = useState('NAD83') + const [utmDatum, setUtmDatum] = useState('NAD83') const [latitude, setLatitude] = useState('') const [longitude, setLongitude] = useState('') const [easting, setEasting] = useState('') @@ -144,18 +148,17 @@ export const CreateEditLocation: React.FC = ({ //handle map click to set lat and long or easting and northing const handleMapClick = (e: any) => { - const { lng, lat } = e.lngLat + const { lng: lon, lat } = e.lngLat if (useUTM) { - const [easting, northing] = convertLonLatToUTM( - lng, - lat, + const { easting, northing } = convertLonLatToUTM( + { lon, lat }, utmZone, utmDatum ) setEasting(easting.toFixed(3)) setNorthing(northing.toFixed(3)) } else { - setLongitude(lng.toFixed(10)) + setLongitude(lon.toFixed(10)) setLatitude(lat.toFixed(10)) } } @@ -174,9 +177,8 @@ export const CreateEditLocation: React.FC = ({ setLatitude(lat.toFixed(10)) } else if (!useUTM && latitude && longitude) { // Lat/Long to UTM - const [easting, northing] = convertLonLatToUTM( - Number(longitude), - Number(latitude), + const { easting, northing } = convertLonLatToUTM( + { lon: Number(longitude), lat: Number(latitude) }, utmZone, utmDatum ) @@ -275,7 +277,7 @@ export const CreateEditLocation: React.FC = ({