Fix Award links for team and user (#102)

* Added WU Link. * Updates for WUs Award Link. * Added Teams Award link. * Updates for Team Certificate Link.
FoldingCommunity · Jun 23, 2022 · 9326596 · 9326596
1 parent d1a3b0d
commit 9326596
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 8 deletions.
diff --git a/src/modules/Donor/DonorCard.jsx b/src/modules/Donor/DonorCard.jsx
@@ -81,7 +81,8 @@ const styles = {
 const DonorCard = ({ donor, editAction, hasLinks }) => {
   const hasError = donor?.status === 'error';
   const footerActions = hasError ? [] : [
-    <CertificateLink id={donor.id} type="wus" text="My Award" key="award" />,
+    <CertificateLink id={donor.id} type="wus" text="WUs Award" key="award" />,
+    <CertificateLink id={donor.id} text="Points Award" key="award" />,
   ];
   if (editAction) {
     footerActions.push(

diff --git a/src/modules/Team/TeamCard.jsx b/src/modules/Team/TeamCard.jsx
@@ -3,10 +3,20 @@ import PropTypes from 'prop-types';
 import { css } from '@emotion/react';
 import { PrettyCount, SetupURL } from 'utils/format';
 import { Badge, Card } from 'antd';
+import { TrophyTwoTone } from '@ant-design/icons';
 import TeamLogo from 'modules/Team/TeamLogo';
 
 const { Meta } = Card;
 const styles = {
+  certified: css`
+    > span {
+      color: #fe6215;
+    }
+    vertical-align: middle;
+    .anticon {
+      margin-right: 0.25rem;
+    }
+  `,
   dLogo: css`
     img {
       width: 4rem;
@@ -60,6 +70,14 @@ const styles = {
 };
 const TeamCard = ({ team }) => {
   const footerActions = [
+    <a target="_blank" rel="noopener noreferrer" href={`https://apps.foldingathome.org/awards?team=${team?.id}&type=wus`} css={styles.certified}>
+      <TrophyTwoTone twoToneColor="#fe6215" />
+      <span>Team WUs Award</span>
+    </a>,
+    <a target="_blank" rel="noopener noreferrer" href={`https://apps.foldingathome.org/awards?team=${team?.id}`} css={styles.certified}>
+      <TrophyTwoTone twoToneColor="#fe6215" />
+      <span>Team Points Award</span>
+    </a>,
     <a target="_blank" rel="noopener noreferrer" href={SetupURL(team?.url)}>Team Website</a>,
     `ID: ${team.id}`,
   ];

diff --git a/src/utils/format.jsx b/src/utils/format.jsx
@@ -49,14 +49,20 @@ PrettyCount.propTypes = {
   count: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
 };
 
-export const CertificateLink = ({ id, text, type }) => (id && text && type && (
-  <a target="_blank" rel="noopener noreferrer" href={`https://apps.foldingathome.org/awards?user=${id}&type=${type}`} css={styles.certified}>
-    <TrophyTwoTone twoToneColor="#fe6215" />
-    <span>{text}</span>
-  </a>
-));
+export const CertificateLink = ({ id, text, type }) => {
+  let url;
+  if (type) url = `https://apps.foldingathome.org/awards?user=${id}&type=${type}`;
+  else url = `https://apps.foldingathome.org/awards?user=${id}`;
+  return id && text && (
+    <a target="_blank" rel="noopener noreferrer" href={url} css={styles.certified}>
+      <TrophyTwoTone twoToneColor="#fe6215" />
+      <span>{text}</span>
+    </a>
+  );
+};
+
 CertificateLink.propTypes = {
   id: PropTypes.number.isRequired,
   text: PropTypes.string.isRequired,
-  type: PropTypes.string.isRequired,
+  type: PropTypes.string, // eslint-disable-line
 };