diff --git a/ee/app/assets/javascripts/merge_requests/components/reviewers/approval_summary.vue b/ee/app/assets/javascripts/merge_requests/components/reviewers/approval_summary.vue
index 3572d36f885cd6bbe36402f03f81ab814ef49754..5256ccab09612c490ef6e9883e188c75b8d25715 100644
--- a/ee/app/assets/javascripts/merge_requests/components/reviewers/approval_summary.vue
+++ b/ee/app/assets/javascripts/merge_requests/components/reviewers/approval_summary.vue
@@ -1,5 +1,5 @@
 <script>
-import { n__, sprintf, s__ } from '~/locale';
+import { n__, sprintf, s__, __ } from '~/locale';
 import { getApprovalRuleNamesLeft } from 'ee/vue_merge_request_widget/mappers';
 import { toNounSeriesText } from '~/lib/utils/grammar';
 import { TYPENAME_MERGE_REQUEST } from '~/graphql_shared/constants';
@@ -81,6 +81,10 @@ export default {
         return s__('mrWidget|Approval is optional');
       }
 
+      if (this.mergeRequest.approved) {
+        return __('All required approvals given');
+      }
+
       if (this.rulesLeft.length && !this.shortText) {
         return sprintf(
           n__(
diff --git a/ee/app/assets/javascripts/merge_requests/queries/approval_summary.query.graphql b/ee/app/assets/javascripts/merge_requests/queries/approval_summary.query.graphql
index e41e43b36f43c902a9e5e19e57e17dd3b7cfe078..ccfeb61e6ee5aebda880d0ab2e1012cca047d59a 100644
--- a/ee/app/assets/javascripts/merge_requests/queries/approval_summary.query.graphql
+++ b/ee/app/assets/javascripts/merge_requests/queries/approval_summary.query.graphql
@@ -3,6 +3,7 @@ query approvalSummary($projectPath: ID!, $iid: String!) {
     id
     mergeRequest(iid: $iid) {
       id
+      approved
       approvalsLeft
       approvalsRequired
       approvedBy {
diff --git a/ee/app/assets/javascripts/merge_requests/queries/approval_summary.subscription.graphql b/ee/app/assets/javascripts/merge_requests/queries/approval_summary.subscription.graphql
index c01821db4c85bd06eb4b11590a38a3f8795f3c15..2b59206abb89cd9806a76719395515ea7395cc28 100644
--- a/ee/app/assets/javascripts/merge_requests/queries/approval_summary.subscription.graphql
+++ b/ee/app/assets/javascripts/merge_requests/queries/approval_summary.subscription.graphql
@@ -2,6 +2,7 @@ subscription approvalSummarySubscription($issuableId: IssuableID!) {
   mergeRequestApprovalStateUpdated(issuableId: $issuableId) {
     ... on MergeRequest {
       id
+      approved
       approvalsLeft
       approvalsRequired
       approvedBy {
diff --git a/ee/spec/frontend/merge_requests/components/reviewers/approval_summary_spec.js b/ee/spec/frontend/merge_requests/components/reviewers/approval_summary_spec.js
index bd6b03878c6def69db64275eafcaf852427d0b39..7e959965c7ed47d5da1b34f7a44f6f1c983a4397 100644
--- a/ee/spec/frontend/merge_requests/components/reviewers/approval_summary_spec.js
+++ b/ee/spec/frontend/merge_requests/components/reviewers/approval_summary_spec.js
@@ -16,6 +16,7 @@ const mockData = ({ approvalsRequired = 1, approvalsLeft = 1, approvedBy = [] }
       id: 1,
       mergeRequest: {
         id: 1,
+        approved: approvalsLeft === 0,
         approvalsLeft,
         approvalsRequired,
         approvedBy: {
@@ -79,6 +80,16 @@ describe('Reviewers drawer approval summary component', () => {
 
       expect(wrapper.text()).toBe('Requires 1 approval from Code Owners.');
     });
+
+    it('renders approval given when approved', async () => {
+      createComponent({
+        resolver: jest.fn().mockResolvedValue(mockData({ approvalsLeft: 0 })),
+      });
+
+      await waitForPromises();
+
+      expect(wrapper.text()).toBe('All required approvals given');
+    });
   });
 
   describe('when approval is optional', () => {
@@ -98,6 +109,8 @@ describe('Reviewers drawer approval summary component', () => {
 
     await waitForPromises();
 
+    expect(wrapper.text()).toBe('Requires 1 approval from Code Owners.');
+
     mockedSubscription.next({
       data: {
         mergeRequestApprovalStateUpdated: mockData({
@@ -110,6 +123,6 @@ describe('Reviewers drawer approval summary component', () => {
 
     await waitForPromises();
 
-    expect(wrapper.text()).toBe('Requires 0 approvals from Code Owners.');
+    expect(wrapper.text()).toBe('All required approvals given');
   });
 });
diff --git a/locale/gitlab.pot b/locale/gitlab.pot
index 4012fba884fd07a255b40f02c97ee8197f3af8cd..f39d109ff51acfc72b0bc72279b870d5d16cafd6 100644
--- a/locale/gitlab.pot
+++ b/locale/gitlab.pot
@@ -5661,6 +5661,9 @@ msgstr ""
 msgid "All protected branches"
 msgstr ""
 
+msgid "All required approvals given"
+msgstr ""
+
 msgid "All required approvals must be given."
 msgstr ""