From 533e2086438d228cbe18538c3c6e105d64e147d2 Mon Sep 17 00:00:00 2001
From: Nafees Nazik <84864519+G3root@users.noreply.github.com>
Date: Mon, 19 Dec 2022 23:23:46 +0530
Subject: [PATCH] Fix: Position of the "Add" button (#6110)

Fixes https://github.com/calcom/cal.com/issues/6104
---
 .../ee/teams/pages/team-members-view.tsx      | 33 +++++++++++--------
 packages/ui/v2/core/Meta.tsx                  |  2 +-
 2 files changed, 20 insertions(+), 15 deletions(-)

diff --git a/packages/features/ee/teams/pages/team-members-view.tsx b/packages/features/ee/teams/pages/team-members-view.tsx
index f8148bd822..83342a2175 100644
--- a/packages/features/ee/teams/pages/team-members-view.tsx
+++ b/packages/features/ee/teams/pages/team-members-view.tsx
@@ -46,7 +46,25 @@ const MembersView = () => {
 
   return (
     <>
-      <Meta title={t("team_members")} description={t("members_team_description")} />
+      <Meta
+        title={t("team_members")}
+        description={t("members_team_description")}
+        CTA={
+          isAdmin ? (
+            <Button
+              type="button"
+              color="primary"
+              StartIcon={Icon.FiPlus}
+              className="ml-auto"
+              onClick={() => setShowMemberInvitationModal(true)}
+              data-testid="new-member-button">
+              {t("add")}
+            </Button>
+          ) : (
+            <></>
+          )
+        }
+      />
       {!isLoading && (
         <>
           <div>
@@ -68,19 +86,6 @@ const MembersView = () => {
                 )}
               </>
             )}
-            {isAdmin && (
-              <div className="relative mb-5 flex w-full items-center ">
-                <Button
-                  type="button"
-                  color="primary"
-                  StartIcon={Icon.FiPlus}
-                  className="ml-auto"
-                  onClick={() => setShowMemberInvitationModal(true)}
-                  data-testid="new-member-button">
-                  {t("add")}
-                </Button>
-              </div>
-            )}
             <div>
               <ul className="divide-y divide-gray-200 rounded-md border ">
                 {team?.members.map((member) => {
diff --git a/packages/ui/v2/core/Meta.tsx b/packages/ui/v2/core/Meta.tsx
index 15672410bc..1a7b513f22 100644
--- a/packages/ui/v2/core/Meta.tsx
+++ b/packages/ui/v2/core/Meta.tsx
@@ -46,7 +46,7 @@ export default function Meta({ title, description, backButton, CTA }: MetaType)
 
   /* @TODO: maybe find a way to have this data on first render to prevent flicker */
   useEffect(() => {
-    if (meta.title !== title || meta.description !== description) {
+    if (meta.title !== title || meta.description !== description || meta.CTA !== CTA) {
       setMeta({ title, description, backButton, CTA });
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps