Merge branch 'develop' into feature-2873/public-kudos-tab

Author: ocielliottc

web-ui/package.json

@@ -24,7 +24,7 @@
     "canvas-confetti": "^1.6.0",
     "date-fns": "^2.24.0",
     "dayjs": "^1.11.11",
-    "dompurify": "^3.1.0",
+    "dompurify": "^3.2.4",
     "fuse.js": "^6.4.6",
     "html-react-parser": "^5.1.12",
     "isomorphic-fetch": "^3.0.0",

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 title={tooltip}>
+             <Typography>{`+${num}`}</Typography>
+           </Tooltip>;
+  };
+
   const getRecipientComponent = useCallback(() => {
     if (kudos.recipientTeam) {
       return (
@@ -67,7 +79,9 @@ const KudosCard = ({ kudos }) => {
     }
 
     return (
-      <AvatarGroup max={4}>
+      <AvatarGroup max={4}
+                   renderSurplus={(extra) => multiTooltip(
+                                               extra, kudos.recipientMembers)}>
         {kudos.recipientMembers.map((member) => (
           <Tooltip
             arrow
@@ -100,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

web-ui/yarn.lock

@@ -1540,6 +1540,11 @@
   resolved "https://registry.yarnpkg.com/@types/tough-cookie/-/tough-cookie-4.0.5.tgz#cb6e2a691b70cb177c6e3ae9c1d2e8b2ea8cd304"
   integrity sha512-/Ad8+nIOV7Rl++6f1BdKxFSMgmoqEoYbHRpPcx3JEfv8VRsQe9Z4mCXeJBzxs7mbHY/XOZZuXlRNfhpVPbs6ZA==
 
+"@types/trusted-types@^2.0.7":
+  version "2.0.7"
+  resolved "https://registry.yarnpkg.com/@types/trusted-types/-/trusted-types-2.0.7.tgz#baccb07a970b91707df3a3e8ba6896c57ead2d11"
+  integrity sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==
+
 "@types/unist@*", "@types/unist@^3.0.0":
   version "3.0.3"
   resolved "https://registry.yarnpkg.com/@types/unist/-/unist-3.0.3.tgz#acaab0f919ce69cce629c2d4ed2eb4adc1b6c20c"
@@ -2944,10 +2949,12 @@ domhandler@^4.2.0, domhandler@^4.2.2:
   dependencies:
     domelementtype "^2.2.0"
 
-dompurify@^3.1.0:
-  version "3.2.0"
-  resolved "https://registry.yarnpkg.com/dompurify/-/dompurify-3.2.0.tgz#53c414317c51503183696fcdef6dd3f916c607ed"
-  integrity sha512-AMdOzK44oFWqHEi0wpOqix/fUNY707OmoeFDnbi3Q5I8uOpy21ufUA5cDJPr0bosxrflOVD/H2DMSvuGKJGfmQ==
+dompurify@^3.2.4:
+  version "3.2.4"
+  resolved "https://registry.yarnpkg.com/dompurify/-/dompurify-3.2.4.tgz#af5a5a11407524431456cf18836c55d13441cd8e"
+  integrity sha512-ysFSFEDVduQpyhzAob/kkuJjf5zWkZD8/A9ywSp1byueyuCfHamrCBa14/Oc2iiB0e51B+NpxSl5gmzn+Ms/mg==
+  optionalDependencies:
+    "@types/trusted-types" "^2.0.7"
 
 domutils@^2.4.2, domutils@^2.8.0:
   version "2.8.0"