import React from "react";
import classes from "./ShortSGonksList.module.css";

import ShortSGonksRow from "./ShortSGonksRow/ShortSGonksRow";
import { Link } from "react-router-dom";

const ShortSGonksList = (props) => {
  const LIST_LIMIT = 7;

  const sGonksList = props.sgonks.slice(0, 7).map((singularSGonk) => {
    return (
      <ShortSGonksRow
        sgonk={singularSGonk}
        key={singularSGonk.searchTerm}
      ></ShortSGonksRow>
    );
  });

  return (
    <div {...props} className={classes.List}>
      {sGonksList}
      {props.sgonks.length > LIST_LIMIT ? (
        <Link to="/toroutelater" className={classes.SeeAll}>
          ...more
        </Link>
      ) : null}
    </div>
  );
};

export default ShortSGonksList;

@@ -222,25 +222,44 @@
   const 
-LIST_LIMI
+MAX_ROWS_IN_SHORT_SGONKS_LIS
 T = 7;%0A%0A
@@ -291,16 +291,21 @@
 s.sgonks
+%0A    
 .slice(0
@@ -310,10 +310,43 @@
 (0, 
-7)
+MAX_ROWS_IN_SHORT_SGONKS_LIST)%0A    
 .map
@@ -371,16 +371,18 @@
 %3E %7B%0A    
+  
 return (
@@ -378,24 +378,26 @@
    return (%0A
+  
       %3CShort
@@ -414,16 +414,18 @@
         
+ 
+ 
 sgonk=%7Bs
@@ -438,16 +438,18 @@
 rSGonk%7D%0A
+  
         
@@ -479,16 +479,18 @@
 chTerm%7D%0A
+  
       %3E%3C
@@ -510,19 +510,23 @@
 ow%3E%0A    
+  
 );%0A
+  
   %7D);%0A%0A 

Rename constant