Skip to content

Commit

Permalink
Merge pull request #68 from datasektionen/calypso-undefined-protection
Browse files Browse the repository at this point in the history
Calypso undefined protection
  • Loading branch information
Herkarl authored Apr 2, 2024
2 parents 5184e06 + c0864fc commit 173093c
Show file tree
Hide file tree
Showing 2 changed files with 130 additions and 113 deletions.
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@
"terser-webpack-plugin": "^4.2.3"
},
"engines": {
"node": ">=10"
"node": ">=21"
},
"devDependencies": {
"babel-plugin-styled-components": "^1.9.2"
Expand Down
241 changes: 129 additions & 112 deletions src/components/News/SingleNews.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,41 +9,111 @@ import { Translate, English, Swedish } from '../Translate'

const cx = classNames.bind(styles)


const HeaderBar = ({}) =>
(
<header key="header">
<div className="header-inner">
<div className="row">
<div className="header-left col-md-2">
<Translate>
<English>
<Link to="/en/news">{'« '}Back</Link>
</English>
<Swedish>
<Link to="/nyheter">{'« '}Tillbaka</Link>
</Swedish>
</Translate>
</div>
<div className="col-md-8">
<h2>
<Translate>
<English>News</English>
<Swedish>Nyheter</Swedish>
</Translate>
</h2>
</div>
<div className="header-right col-md-2"/>
</div>
</div>
</header>
)

const EventInfoSidebar = ({item, lang}) => // item CAN'T be undefined here
<div className="col-md-3" id="sidebar">
<div className="sidebar-card">
<h2>
<Translate>
<English>Event Details</English>
<Swedish>Eventinformation</Swedish>
</Translate>
</h2>
<p>
<b>
<Translate>
<English>Location</English>
<Swedish>Plats</Swedish>
</Translate>
</b>
<br />
{item.eventLocation}
</p>
<p>
<b>
<Translate>
<English>Start Time</English>
<Swedish>Starttid</Swedish>
</Translate>
</b>
<br />
{new Date(item.eventStartTime)
.toLocaleDateString(
lang === 'en' ? 'en-US' : 'sv-SE',
{
day: 'numeric',
month: 'long',
year: 'numeric',
hour: 'numeric',
minute: 'numeric'
}
)}
</p>
<p>
<b>
<Translate>
<English>End Time</English>
<Swedish>Sluttid</Swedish>
</Translate>
</b>
<br />
{new Date(item.eventEndTime)
.toLocaleDateString(
lang === 'en' ? 'en-US' : 'sv-SE',
{
day: 'numeric',
month: 'long',
year: 'numeric',
hour: 'numeric',
minute: 'numeric'
}
)}
</p>
</div>
</div>


export const SingleItem = ({ item, location, lang, match }) =>
<Calypso type='item' search={'/' + match.params.postId}>
{(item) =>
{(item) => // item CAN be undefined here
<Fragment>
<Title>
<Translate>
<English>{ `${item.titleEnglish} - Konglig Datasektionen` }</English>
<Swedish>{ `${item.titleSwedish} - Konglig Datasektionen` }</Swedish>
</Translate>
</Title>
<header key="header">
<div className="header-inner">
<div className="row">
<div className="header-left col-md-2">
<Translate>
<English>
<Link to="/en/news">{'« '}Back</Link>
</English>
<Swedish>
<Link to="/nyheter">{'« '}Tillbaka</Link>
</Swedish>
</Translate>
</div>
<div className="col-md-8">
<h2>
<Translate>
<English>News</English>
<Swedish>Nyheter</Swedish>
</Translate>
</h2>
</div>
<div className="header-right col-md-2"/>
</div>
</div>
</header>
<Translate>
<English>{`${item ? item.titleEnglish : "????"} - Konglig Datasektionen`}</English>
<Swedish>{`${item ? item.titleSwedish : "????"} - Konglig Datasektionen`}</Swedish>
</Translate>
</Title>
<HeaderBar item={item} lang={lang}/>
{item &&
<div id='content'>
<div key={item.id} className={cx('notice', 'ultra_light', 'col-md-9')}>
<div className={styles.metadata}>
Expand Down Expand Up @@ -83,90 +153,37 @@ export const SingleItem = ({ item, location, lang, match }) =>
/>
</div>
{(item.googleForm || item.facebookEvent) &&
<div className="row">
{item.googleForm && <div className={item.facebookEvent ? cx('col-xs-6', styles['no-padding-right']) : 'col-xs-12'}>
<a className={styles.gdocs} href={item.googleForm} target="_blank" rel="noopener noreferrer">
<i className="fab fa-fw fa-google"/>{' '}
<Translate>
<English>Open in Google Docs</English>
<Swedish>Öppna i Google Docs</Swedish>
</Translate>
</a>
</div>}
{item.facebookEvent && <div className={item.googleForm ? cx('col-xs-6', styles['no-padding-left']) : 'col-xs-12'}>
<a className={styles.fb} href={item.facebookEvent} target="_blank" rel="noopener noreferrer">
<i className="fab fa-fw fa-facebook-f"/>{' '}
<Translate>
<English>Facebook Event</English>
<Swedish>Facebook-event</Swedish>
</Translate>
</a>
</div>}
</div>}
<div className="row">
{item.googleForm &&
<div className={item.facebookEvent ? cx('col-xs-6', styles['no-padding-right']) : 'col-xs-12'}>
<a className={styles.gdocs} href={item.googleForm} target="_blank" rel="noopener noreferrer">
<i className="fab fa-fw fa-google"/>{' '}
<Translate>
<English>Open in Google Docs</English>
<Swedish>Öppna i Google Docs</Swedish>
</Translate>
</a>
</div>
}
{item.facebookEvent &&
<div className={item.googleForm ? cx('col-xs-6', styles['no-padding-left']) : 'col-xs-12'}>
<a className={styles.fb} href={item.facebookEvent} target="_blank" rel="noopener noreferrer">
<i className="fab fa-fw fa-facebook-f"/>{' '}
<Translate>
<English>Facebook Event</English>
<Swedish>Facebook-event</Swedish>
</Translate>
</a>
</div>
}
</div>
}
</div>
{item.itemType === "EVENT" &&
<div className="col-md-3" id="sidebar">
<div className="sidebar-card">
<h2>
<Translate>
<English>Event Details</English>
<Swedish>Eventinformation</Swedish>
</Translate>
</h2>
<p>
<b>
<Translate>
<English>Location</English>
<Swedish>Plats</Swedish>
</Translate>
</b>
<br />
{item.eventLocation}
</p>
<p>
<b>
<Translate>
<English>Start Time</English>
<Swedish>Starttid</Swedish>
</Translate>
</b>
<br />
{new Date(item.eventStartTime)
.toLocaleDateString(
lang === 'en' ? 'en-US' : 'sv-SE',
{
day: 'numeric',
month: 'long',
year: 'numeric',
hour: 'numeric',
minute: 'numeric'
}
)}
</p>
<p>
<b>
<Translate>
<English>End Time</English>
<Swedish>Sluttid</Swedish>
</Translate>
</b>
<br />
{new Date(item.eventEndTime)
.toLocaleDateString(
lang === 'en' ? 'en-US' : 'sv-SE',
{
day: 'numeric',
month: 'long',
year: 'numeric',
hour: 'numeric',
minute: 'numeric'
}
)}
</p>
</div>
</div>
<EventInfoSidebar />
}
</div>
</div>
}
</Fragment>
}
</Calypso>
Expand Down

0 comments on commit 173093c

Please sign in to comment.