Skip to content

Commit

Permalink
1004 otimizao da pagina de detalhes (#1011)
Browse files Browse the repository at this point in the history
* Alteração no layout do card da página Details do PredictionEvents

* Divisão das linhas RA e Dec da página de detalhes

* Inclusao de uma classe no card dos itens para controlar layout

* Criação de um arquivo de styles para alterar o layout da page de detalhes  PredictionsEvents

* Correcao no arquivo de styles da pagina de detalhes PredictionsEvents

* Correção no layout da pagina de detalhes do PredictionEvents

* Ajustes no layout da pagina de detalhes do PredictionEvents

* insercao de if usando o parametro breakline

* Inclusao do if else para fazer a quebra de linha nos items RA e Dec do layout da pagina de detalhes do PredictionEvents

* Inclusao de if/else no index do componente List para quebrar as linha de RA e Dec da página de detalhes PredictionEvents

* Exclusao da pagina de styles para a pagina de detalhes

* Limpeza de código

* style: fix lint

---------

Co-authored-by: rcboufleur <rcboufleur@gmail.com>
Co-authored-by: Glauber Costa Vila Verde <glauber.vila.verde@gmail.com>
  • Loading branch information
3 people authored Jun 11, 2024
1 parent 2dedc2f commit 4322949
Show file tree
Hide file tree
Showing 2 changed files with 34 additions and 32 deletions.
24 changes: 20 additions & 4 deletions frontend/src/components/List/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import ListItem from '@mui/material/ListItem'
import ListItemText from '@mui/material/ListItemText'
import Icon from '@mui/material/Icon'
import { List as MuiList } from '@mui/material'
import Stack from '@mui/material/Stack'

import PropTypes from 'prop-types'
import useStyles from './styles'
Expand Down Expand Up @@ -33,10 +34,25 @@ function List({ data, height, width, align }) {
}
className={classes.itemText}
/>
<ListItemText
className={`${classes.itemText} ${classes.itemValueText}`}
secondary={typeof item.value === 'function' ? item.value() : item.value}
/>
{item.breakline === true ? (
<Stack spacing={1}>
<ListItemText
className={`${classes.itemText} ${classes.itemValueText}`}
secondary={typeof item.value === 'function' ? item.value() : item.value.split(',')[0]}
/>
<ListItemText
className={`${classes.itemText} ${classes.itemValueText}`}
secondary={typeof item.value === 'function' ? item.value() : item.value.split(',')[1]}
/>
</Stack>
) : (
<Stack spacing={1}>
<ListItemText
className={`${classes.itemText} ${classes.itemValueText}`}
secondary={typeof item.value === 'function' ? item.value() : item.value}
/>
</Stack>
)}
</ListItem>
)
})}
Expand Down
42 changes: 14 additions & 28 deletions frontend/src/pages/PredictionEvents/Detail.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,6 @@ import List from '../../components/List'
import Typography from '@mui/material/Typography'
import Link from '@mui/material/Link'
import Container from '@mui/material/Container'

import IconButton from '@mui/material/IconButton'
import HelpOutlineIcon from '@mui/icons-material/HelpOutline'

Expand Down Expand Up @@ -62,22 +61,19 @@ function PredictionEventDetail() {
},
{
title: 'Star position (ICRF)',
// tooltip: 'Right Ascension and Declination with assumed proper motion in ICRF/J2000',
value: `RA ${occultation.ra_star_candidate}, Dec ${occultation.dec_star_candidate}`
value: `RA ${occultation.ra_star_candidate}, Dec ${occultation.dec_star_candidate}`,
breakline: true
},
{
title: 'Closest approach',
// tooltip: 'Geocentric closest approach',
value: `${occultation.closest_approach} (arcsec)`
},
{
title: 'Position angle',
// tooltip: "Planet's position angle with respect to the star at closest approach",
value: `${occultation.position_angle} (deg)`
},
{
title: 'Velocity',
// tooltip: 'Velocity on the plane of the sky. Positive is prograde, negative is retrograde',
value: `${occultation.velocity} (km/s)`
},
{
Expand All @@ -90,12 +86,10 @@ function PredictionEventDetail() {
},
{
title: 'Star magnitude (Gaia)',
// tooltip: 'Gaia magnitude',
value: `${occultation.g_star ? occultation.g_star.toFixed(3) : null}`
},
{
title: 'H mag (2MASS)',
// tooltip: '2MASS H magnitude',
value: `${occultation.h_star ? occultation.h_star.toFixed(3) : null}`
},
{
Expand All @@ -118,26 +112,24 @@ function PredictionEventDetail() {
])

setStar([
// {
// title: 'Star source ID',
// tooltip: 'Unique source identifier',
// value: `${starObj.source_id}`
// },
{
title: 'Stellar catalogue',
value: 'Gaia DR3'
},
{
title: 'Star astrometric position in catalogue (ICRF)',
value: `RA ${starObj.ra ? starObj.ra.toFixed(8) : null}, Dec ${starObj.dec ? starObj.dec.toFixed(7) : null}`
value: `RA ${starObj.ra ? starObj.ra.toFixed(8) : null}, Dec ${starObj.dec ? starObj.dec.toFixed(7) : null}`,
breakline: true
},
{
title: 'Star astrometric position with proper motion (ICRF)',
value: `RA ${occultation.ra_star_with_pm}, Dec ${occultation.dec_star_with_pm}`
value: `RA ${occultation.ra_star_with_pm}, Dec ${occultation.dec_star_with_pm}`,
breakline: true
},
{
title: 'Star apparent position (date)',
value: `RA ${occultation.ra_star_to_date}, Dec ${occultation.dec_star_to_date}`
value: `RA ${occultation.ra_star_to_date}, Dec ${occultation.dec_star_to_date}`,
breakline: true
},
{
title: 'Proper motion',
Expand All @@ -153,7 +145,8 @@ function PredictionEventDetail() {
title: 'Uncertainty in the star position',
value: `RA ${starObj.ra_error ? starObj.ra_error.toFixed(1) : null}, Dec ${
starObj.dec_error ? starObj.dec_error.toFixed(1) : null
} (mas)`
} (mas)`,
breakline: true
},
{
title: 'G magnitude (source: Gaia DR3)',
Expand Down Expand Up @@ -188,13 +181,9 @@ function PredictionEventDetail() {
},
{
title: "Object's astrometric position (ICRF)",
value: `RA ${occultation.ra_target}, Dec ${occultation.dec_target}`
value: `RA ${occultation.ra_target}, Dec ${occultation.dec_target}`,
breakline: true
},
// {
// title: "Object's Apparent Position (date)",
// tooltip: "Relative to the Earth's center",
// value: `RA ${occultation.ra_target_apparent}, Dec ${occultation.dec_target_apparent}`
// },
{
title: 'Absolute magnitude',
value: `${occultation.h ? occultation.h.toFixed(3) : null}`
Expand All @@ -219,7 +208,8 @@ function PredictionEventDetail() {
},
{
title: 'Uncertainty in position',
value: `RA ${occultation.e_ra_target}, Dec ${occultation.e_dec_target} (mas)`
value: `RA ${occultation.e_ra_target}, Dec ${occultation.e_dec_target} (mas)`,
breakline: true
},
{
title: 'Ephemeris',
Expand All @@ -229,10 +219,6 @@ function PredictionEventDetail() {
title: 'Dynamic class (Skybot)',
value: `${occultation.dynclass}`
},
// {
// title: 'Dynamic class (Lowell Observatory)',
// value: `${occultation.astorb_dynbaseclass ? occultation.astorb_dynbaseclass : null}`
// },
{
title: 'Semi-major axis',
value: `${occultation.semimajor_axis ? occultation.semimajor_axis.toFixed(4) : null} (AU)`
Expand Down

0 comments on commit 4322949

Please sign in to comment.