Hide DSU

components/dotations/results/Results.tsx

@@ -24,15 +24,19 @@ type Props = PropsFromRedux & {}
 class Results extends PureComponent<Props> {
   render() {
     const { communesTypes } = this.props;
+    const url = new URLSearchParams(window.location.search);
+    const isDsuVisible = url.has("dsu");
     return (
       <div className={styles.container}>
         <Grid container spacing={3}>
           <Grid item lg={4} md={6} sm={6} xl={3} xs={12}>
             <CommuneSummary dotation="dsr" />
           </Grid>
+          {isDsuVisible && (
             <Grid item lg={4} md={6} sm={6} xl={3} xs={12}>
               <CommuneSummary dotation="dsu" />
             </Grid>
+          )}
           <Grid item lg={8} md={12} sm={6} xl={6} xs={12}>
             <CommuneStrateDetails />
           </Grid>

components/dotations/results/commune-strate-details/commune-strate-details-table/CommuneStrateDetailsTable.module.scss

@@ -40,13 +40,6 @@
   tbody {
     font-weight: bold;
 
-    tr:nth-child(4n+2) {
-      background-color: $light-grey-bg-color;
-    }  
-    
-    tr:nth-child(4n+1) {
-      background-color: $light-grey-bg-color;
-    }  
 
     th[scope="row"] {
       color: $dark-grey-text-color;
@@ -73,3 +66,20 @@
     padding: 5px;
   }
 }
+
+
+.dsr {
+  tr:nth-child(odd) {
+    background-color: $light-grey-bg-color;
+  }
+}
+
+.dsrAndDsu {
+  tr:nth-child(4n+2) {
+    background-color: $light-grey-bg-color;
+  }  
+  
+  tr:nth-child(4n+1) {
+    background-color: $light-grey-bg-color;
+  }  
+}
\ No newline at end of file

components/dotations/results/commune-strate-details/commune-strate-details-table/CommuneStrateDetailsTable.tsx

@@ -28,6 +28,8 @@ type Props = PropsFromRedux & {
 class CommuneStrateDetailsTable extends PureComponent<Props> {
   render() {
     const { isFetching, strates } = this.props;
+    const url = new URLSearchParams(window.location.search);
+    const isDsuVisible = url.has("dsu");
     return (
       <div className={styles.container}>
         <table className={styles.table}>
@@ -58,12 +60,12 @@ class CommuneStrateDetailsTable extends PureComponent<Props> {
             </tr>
           </thead>
           {!isFetching && (
-            <tbody>
+            <tbody className={isDsuVisible ? styles.dsrAndDsu : styles.dsr}>
               {
                 strates.map((strate, index) => (
                   <Fragment>
                     <tr key={strate.habitants}>
-                      <th rowSpan={2} scope="row">
+                      <th rowSpan={isDsuVisible ? 2 : 1} scope="row">
                         {
                           strate.habitants === -1 ? (
                             <Fragment>
@@ -80,12 +82,12 @@ class CommuneStrateDetailsTable extends PureComponent<Props> {
                         }
 
                       </th>
-                      <td className={styles.light} rowSpan={2}>
+                      <td className={styles.light} rowSpan={isDsuVisible ? 2 : 1}>
                         {formatNumber(strate.partPopTotale, { decimals: 0 })}
                         {" "}
                         %
                       </td>
-                      <td className={styles.light} rowSpan={2}>
+                      <td className={styles.light} rowSpan={isDsuVisible ? 2 : 1}>
                         {formatNumber(strate.potentielFinancierMoyenParHab, { decimals: 2 })}
                       </td>
                       <td>
@@ -110,6 +112,8 @@ class CommuneStrateDetailsTable extends PureComponent<Props> {
                         %
                       </td>
                     </tr>
+                    {
+                      isDsuVisible && (
                         <tr key={strate.habitants}>
                           <td>
                             <LocationCityIcon />
@@ -133,6 +137,8 @@ class CommuneStrateDetailsTable extends PureComponent<Props> {
                             %
                           </td>
                         </tr>
+                      )
+                    }
                   </Fragment>
                 ))
               }