Use the same surplus renderer for team kudos.

Author: ocielliottc

web-ui/src/components/kudos/PublicKudosCard.jsx

@@ -51,6 +51,18 @@ const KudosCard = ({ kudos }) => {
 
   const sender = selectProfile(state, kudos.senderId);
 
+  const multiTooltip = (num, list) => {
+    let tooltip = "";
+    let prefix = "";
+    for (let member of list.slice(-num)) {
+      tooltip += prefix + `${member.firstName} ${member.lastName}`;
+      prefix = ", ";
+    }
+    return <Tooltip arrow key="multi-member-tooltip" title={tooltip}>
+             {`+${num}`}
+           </Tooltip>;
+  };
+
   const getRecipientComponent = useCallback(() => {
     if (kudos.recipientTeam) {
       return (
@@ -66,18 +78,6 @@ const KudosCard = ({ kudos }) => {
       );
     }
 
-    const multiTooltip = (num, list) => {
-      let tooltip = "";
-      let prefix = "";
-      for (let member of list.slice(-num)) {
-        tooltip += prefix + `${member.firstName} ${member.lastName}`;
-        prefix = ", ";
-      }
-      return <Tooltip arrow key="multi-member-tooltip" title={tooltip}>
-               {`+${num}`}
-             </Tooltip>;
-    };
-
     return (
       <AvatarGroup max={4}
                    renderSurplus={(extra) => multiTooltip(
@@ -114,7 +114,9 @@ const KudosCard = ({ kudos }) => {
         <CardContent>
           <Typography variant="body1"><em>{kudos.message}</em></Typography>
           {kudos.recipientTeam && (
-      <AvatarGroup max={12}>
+      <AvatarGroup max={12}
+                   renderSurplus={(extra) => multiTooltip(
+                                               extra, kudos.recipientMembers)}>
         {kudos.recipientMembers.map((member) => (
           <Tooltip
             arrow