messagesBehind field in api request I'd like to work on this task.
Add "Total lag" within Consumer group 


**Describe the bug**
Add "Total lag" into Consumer group profile

**Set up**
https://www.kafka-ui.provectus.io/


**Screenshots**

<img width="1356" alt="total lag" src="https://user-images.githubusercontent.com/104780608/188556151-c77c8eba-0dd2-44b8-95c2-da5a8863a4aa.png">




kafka-ui-react-app/src/components/ConsumerGroups/Details/Details.tsx
kafka-ui-react-app/src/components/ConsumerGroups/Details/Details.tsx
diff --git a/kafka-ui-react-app/src/components/ConsumerGroups/Details/Details.tsx b/kafka-ui-react-app/src/components/ConsumerGroups/Details/Details.tsx
index 912b88a8a38..f1ce947fdb7 100644
--- a/kafka-ui-react-app/src/components/ConsumerGroups/Details/Details.tsx
+++ b/kafka-ui-react-app/src/components/ConsumerGroups/Details/Details.tsx
@@ -103,6 +103,9 @@ const Details: React.FC = () => {
           <Metrics.Indicator label="Coordinator ID">
             {consumerGroup.coordinator?.id}
           </Metrics.Indicator>
+          <Metrics.Indicator label="Total lag">
+            {consumerGroup.messagesBehind}
+          </Metrics.Indicator>
         </Metrics.Section>
       </Metrics.Wrapper>
       <Table isFullwidth>
