fix(systemaddon): Limit the number of topsites being rendered. Closes #…

…2945.
mozilla · Aug 3, 2017 · c186a0a · c186a0a
1 parent 4f17940
commit c186a0a
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 1 deletion.
diff --git a/system-addon/content-src/components/TopSites/TopSites.jsx b/system-addon/content-src/components/TopSites/TopSites.jsx
@@ -7,6 +7,7 @@ const {perfService: perfSvc} = require("common/PerfService.jsm");
 const TOP_SITES_SOURCE = "TOP_SITES";
 const TOP_SITES_CONTEXT_MENU_OPTIONS = ["CheckPinTopSite", "Separator", "OpenInNewWindow",
   "OpenInPrivateWindow", "Separator", "BlockUrl", "DeleteUrl"];
+const TOP_SITES_SHOWMORE_LENGTH = 12;
 
 class TopSite extends React.Component {
   constructor(props) {
@@ -175,7 +176,7 @@ class TopSitesPerfTimer extends React.Component {
 const TopSites = props => (<section>
   <h3 className="section-title"><span className={`icon icon-small-spacer icon-topsites`} /><FormattedMessage id="header_top_sites" /></h3>
   <ul className="top-sites-list">
-    {props.TopSites.rows.map((link, index) => link && <TopSite
+    {props.TopSites.rows.slice(0, TOP_SITES_SHOWMORE_LENGTH).map((link, index) => link && <TopSite
       key={link.guid || link.url}
       dispatch={props.dispatch}
       link={link}

diff --git a/system-addon/test/unit/content-src/components/TopSites.test.jsx b/system-addon/test/unit/content-src/components/TopSites.test.jsx
@@ -172,6 +172,13 @@ describe("<TopSites>", () => {
     assert.lengthOf(links, 2);
     links.forEach((link, i) => assert.equal(link.props().link.url, rows[i].url));
   });
+  it("should render at most `TOP_SITES_SHOWMORE_LENGTH` topsites", () => {
+    const rows = new Array(20).fill(null).map((s, i) => ({isPinned: true, url: "foo.com", pinIndex: i}));
+    const wrapper = shallow(<TopSites {...DEFAULT_PROPS} TopSites={{rows}} />);
+
+    const links = wrapper.find(TopSite);
+    assert.lengthOf(links, 12);
+  });
 });
 
 describe("<TopSite>", () => {