in src/amo/pages/LandingPage/index.js [215:319]
render() {
const {
errorHandler,
recommendedAddons,
highlyRatedAddons,
i18n,
loading,
trendingAddons,
} = this.props;
const { visibleAddonType } = this.props.match.params;
const { addonType, html } = this.contentForType(visibleAddonType);
const headingText = {
[ADDON_TYPE_STATIC_THEME]: i18n.gettext('Themes'),
[ADDON_TYPE_EXTENSION]: i18n.gettext('Extensions'),
};
const contentText = {
[ADDON_TYPE_STATIC_THEME]: i18n.gettext(`Change your browser's appearance.
Choose from thousands of themes to give Firefox the look you want.`),
[ADDON_TYPE_EXTENSION]: i18n.gettext(`Explore powerful tools and features
to customize Firefox and make the browser all your own.`),
};
const isAddonTheme = ADDON_TYPE_STATIC_THEME === addonType;
const title = headingText[addonType];
return (
<Page>
<div
className={makeClassName('LandingPage', `LandingPage--${addonType}`, {
'LandingPage--theme': isAddonTheme,
})}
>
<Helmet>
<title>{title}</title>
</Helmet>
<HeadMetaTags description={this.getPageDescription()} title={title} />
<HeadLinks />
{errorHandler.renderErrorIfPresent()}
<div className="LandingPage-header">
<h1 className="LandingPage-addonType-name">
{headingText[addonType]}
</h1>
<p className="LandingPage-heading-content">
{contentText[addonType]}
</p>
</div>
<Categories addonType={addonType} />
<Button
buttonType="light"
className="LandingPage-button"
to={`/${getVisibleAddonType(addonType)}/categories/`}
>
{i18n.gettext('Explore all categories')}
</Button>
{this.renderIfNotEmpty(
recommendedAddons,
<LandingAddonsCard
addonInstallSource={INSTALL_SOURCE_FEATURED}
addons={recommendedAddons}
className="RecommendedAddons"
footerText={html.recommendedFooterText}
footerLink={html.recommendedFooterLink}
header={html.recommendedHeader}
isTheme={isAddonTheme}
loading={loading}
/>,
)}
{this.renderIfNotEmpty(
highlyRatedAddons,
<LandingAddonsCard
addonInstallSource={INSTALL_SOURCE_TOP_RATED}
addons={highlyRatedAddons}
className="HighlyRatedAddons"
footerLink={html.highlyRatedFooterLink}
footerText={html.highlyRatedFooterText}
header={html.highlyRatedHeader}
isTheme={isAddonTheme}
loading={loading}
/>,
)}
{this.renderIfNotEmpty(
trendingAddons,
<LandingAddonsCard
addonInstallSource={INSTALL_SOURCE_TRENDING}
addons={trendingAddons}
className="TrendingAddons"
footerLink={html.trendingFooterLink}
footerText={html.trendingFooterText}
header={html.trendingHeader}
isTheme={isAddonTheme}
loading={loading}
/>,
)}
</div>
</Page>
);
}