From 73968646e600ea0af975113eef951b9dff99b769 Mon Sep 17 00:00:00 2001
From: KharchenkoVV <vv.harchenko@autodrilling.ru>
Date: Thu, 2 Sep 2021 16:33:02 +0500
Subject: [PATCH] unique keys errors fix

---
 src/pages/Cluster/ClusterSections.jsx     |  8 ++++----
 src/pages/Cluster/ClusterWells.jsx        |  6 ++++--
 src/pages/Cluster/WellOperationsTable.jsx |  2 +-
 src/pages/Deposit.jsx                     | 13 +++++++------
 src/styles/index.css                      |  4 ++++
 5 files changed, 20 insertions(+), 13 deletions(-)

diff --git a/src/pages/Cluster/ClusterSections.jsx b/src/pages/Cluster/ClusterSections.jsx
index 21789a8..2a367db 100644
--- a/src/pages/Cluster/ClusterSections.jsx
+++ b/src/pages/Cluster/ClusterSections.jsx
@@ -46,19 +46,19 @@ export default function ClusterSections({ clusterData }) {
         setWellOperations(operations)
 
         const tvdPlanData = operations.map(el => { 
-          return {key: el.plan?.id, depth: el.plan?.wellDepth, date: el.plan?.startDate}
+          return {key: el.caption, depth: el.plan?.wellDepth, date: el.plan?.startDate}
         }).filter(el => el.key)
         
         setTvdDataPlan(tvdPlanData)
 
         const tvdFactData = operations.map(el => { 
-          return {key: el.fact?.id, depth: el.fact?.wellDepth, date: el.fact?.startDate}
+          return {key: el.caption, depth: el.fact?.wellDepth, date: el.fact?.startDate}
         }).filter(el => el.key)
 
         setTvdDataFact(tvdFactData)
 
         const tvdPredictData = operations.map(el => { 
-          return {key: el.predict?.id, depth: el.predict?.wellDepth, date: el.predict?.startDate}
+          return {key: el.caption, depth: el.predict?.wellDepth, date: el.predict?.startDate}
         }).filter(el => el.key)
 
         setTvdDataForecast(tvdPredictData)
@@ -231,7 +231,7 @@ export default function ClusterSections({ clusterData }) {
       title: "Подрядчики",
       dataIndex: "companies",
       render: (item) =>
-        item?.map((company) => <Tag color="blue">{company.caption}</Tag>),
+        item?.map((company) => <Tag key={company.caption} color="blue">{company.caption}</Tag>),
     },
   ];
 
diff --git a/src/pages/Cluster/ClusterWells.jsx b/src/pages/Cluster/ClusterWells.jsx
index 777f320..0bb4adc 100644
--- a/src/pages/Cluster/ClusterWells.jsx
+++ b/src/pages/Cluster/ClusterWells.jsx
@@ -96,7 +96,7 @@ export default function ClusterWells({clusterData}) {
       routeSpeedFact: well.total?.fact?.routeSpeed,
       notProductiveTimePlan: well.total?.plan?.nonProductiveHours,
       notProductiveTimeFact: well.total?.fact?.nonProductiveHours,
-      companies: well.companies,
+      companies: well.companies
     };
   });
 
@@ -171,6 +171,7 @@ export default function ClusterWells({clusterData}) {
                   : '-'),
     {
       title: "TVD",
+      key: "tvd",
       render: (value) => <Button onClick={()=> {
         getOperations(value.id)
         setIsTVDModalVisible(true) 
@@ -179,6 +180,7 @@ export default function ClusterWells({clusterData}) {
     },
     {
       title: "Операции",
+      key: "operations",
       render: (value) => <Button onClick={()=> {
         getOperations(value.id)
         setIsOpsModalVisible(true) 
@@ -190,7 +192,7 @@ export default function ClusterWells({clusterData}) {
       key: "companies",
       dataIndex: "companies",
       render: (item) =>
-        item?.map((company) => <Tag color="blue">{company.caption}</Tag>) ?? '-',
+        item?.map((company) => <Tag key={company.caption} color="blue">{company.caption}</Tag>) ?? '-',
     },
   ];
 
diff --git a/src/pages/Cluster/WellOperationsTable.jsx b/src/pages/Cluster/WellOperationsTable.jsx
index d42e1ae..600def8 100644
--- a/src/pages/Cluster/WellOperationsTable.jsx
+++ b/src/pages/Cluster/WellOperationsTable.jsx
@@ -37,7 +37,7 @@ export default function WellOperationsTable({wellOperations}) {
         )
     ];
 
-    const operations = wellOperations.map(el => {
+    const operations = wellOperations?.map(el => {
         return {
             key: el.plan?.id ?? el.fact.id,
             sectionType: el.plan?.wellSectionTypeName ?? el.fact?.wellSectionTypeName,
diff --git a/src/pages/Deposit.jsx b/src/pages/Deposit.jsx
index e43a252..d9d8a01 100644
--- a/src/pages/Deposit.jsx
+++ b/src/pages/Deposit.jsx
@@ -61,12 +61,13 @@ export default function Deposit() {
 
   return (
     <LoaderPortal show={showLoader}>
-      <Map 
-        height='100vh'
-        center={viewParams.center}
-        zoom={viewParams.zoom}>
-        {markers}
-      </Map>
+      <div className={'h-100vh'}>
+        <Map 
+          center={viewParams.center}
+          zoom={viewParams.zoom}>
+          {markers}
+        </Map>
+      </div>
     </LoaderPortal>
   );
 }
diff --git a/src/styles/index.css b/src/styles/index.css
index f90702e..ae77b2e 100644
--- a/src/styles/index.css
+++ b/src/styles/index.css
@@ -39,6 +39,10 @@ body {
   margin-left: 30px;
 }
 
+.h-100vh {
+  height: 100vh;
+}
+
 .vertical-align-center {
   vertical-align: center;
 }