Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Demo info not rendering #234 #238

Open
wants to merge 5 commits into
base: master
Choose a base branch
from
Open

Demo info not rendering #234 #238

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
03bb6da
Demo info not rendering
MingyiXu11 Nov 4, 2024
a07637a
dob format
MingyiXu11 Nov 11, 2024
78e5d8d
git fetch
MingyiXu11 Nov 14, 2024
5e0ac1c
fix storybook
MingyiXu11 Nov 15, 2024
651c29a
revert
MingyiXu11 Feb 9, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 8 additions & 2 deletions app/components/dem-info.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,8 @@ import insertSheet from 'react-jss'

function DemInfo(props) {
const { state, dob, party, classes, className, ...otherProps } = props
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

classes is not a prop, it is create by:

  const classes = useStylesFromThemeFunction()

if (!(state && dob && party)) return null // if no data, render not
console.log('Received dob prop:', dob)
if (!(state || dob || party)) return null // if no data, render not

const userState = state || ''
const userAge = dob ? calculateAge(dob) : ''
Expand All @@ -23,7 +24,7 @@ function DemInfo(props) {
} else if (userAge || userState) {
contentText += userAge || userState
}

console.log('Final Content Text:', contentText)
return (
<span className={cx(classes.infoText, className)} {...otherProps}>
{contentText}
Expand All @@ -37,7 +38,12 @@ function DemInfo(props) {
* @return {Number} age (in years)
*/
function calculateAge(birthdayStr) {
console.log('Date of Birth:', birthdayStr)
const birthday = new Date(birthdayStr)
if (isNaN(birthday)) {
console.warn('Invalid date format for dob:', birthdayStr)
return null
}
const today = new Date()
let age = today.getFullYear() - birthday.getFullYear()
const month = today.getMonth() - birthday.getMonth()
Expand Down
8 changes: 4 additions & 4 deletions stories/dem-info.stories.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ export default {

export const PrimaryAllFieldsIncluded = {
args: {
dob: '1990-10-20T00:00:00.000Z',
dob: '1990-10-20',
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The test data is correct, it's an ISO format date string. If necessary please fix the code to work with the data in the story.

state: 'NY',
party: 'Independent',
},
Expand All @@ -18,7 +18,7 @@ export const UserNotFound = { args: {} }

export const AgeAndStateOnly = {
args: {
dob: '1990-10-20T00:00:00.000Z',
dob: '1990-10-20',
state: 'NY',
},
}
Expand All @@ -32,7 +32,7 @@ export const StateAndPartyOnly = {

export const AgeAndPartyOnly = {
args: {
dob: '1990-10-20T00:00:00.000Z',
dob: '1990-10-20',
party: 'Independent',
},
}
Expand All @@ -45,7 +45,7 @@ export const PartyOnly = {

export const AgeOnly = {
args: {
dob: '1990-10-20T00:00:00.000Z',
dob: '1990-10-20',
},
}

Expand Down