Fix Approval UI showing up for free plan

What does this MR do?

Approval related UI are showing for free plan projects in

• MR edit page
• MR show page widget

This MR hides those UI elements for free plan projects.

What are the relevant issue numbers?

Closes #9908 (closed)

Does this MR meet the acceptance criteria?

• Changelog entry added, if necessary
• Documentation created/updated via this MR
• Documentation reviewed by technical writer or follow-up review issue created
• Tests added for this feature/bug
• Tested in all supported browsers
• Conforms to the code review guidelines
• Conforms to the merge request performance guidelines
• Conforms to the style guides
• Conforms to the database guides
• Link to e2e tests MR added if this MR has Requires e2e tests label. See the Test Planning Process.
• EE specific content should be in the top level /ee folder
• For a paid feature, have we considered GitLab.com plans, how it works for groups, and is there a design for promoting it to users who aren't on the correct plan?

app/assets/javascripts/vue_merge_request_widget/components/states/ready_to_merge.vue

@@ -112,7 +112,7 @@ export default {
       return enableSquashBeforeMerge && commitsCount > 1;
     },
     isApprovalNeeded() {
-      return this.mr.approvalsRequired ? !this.mr.isApproved : false;
+      return this.mr.hasApprovalsAvailable ? !this.mr.isApproved : false;
     },
     shouldShowMergeControls() {
       return this.mr.isMergeAllowed || this.shouldShowMergeWhenPipelineSucceedsText;