diff --git a/frontend/src/assets/locales/en/dashboard.json b/frontend/src/assets/locales/en/dashboard.json index 48f5f0505..c88fa945b 100644 --- a/frontend/src/assets/locales/en/dashboard.json +++ b/frontend/src/assets/locales/en/dashboard.json @@ -12,8 +12,9 @@ "title": "Transactions", "orgHas": "{{name}} has:", "transfersInProgress": "Transfer(s) in progress", - "organizationsRegistered": "Organizations registered for transfers", + "organizationsRegistered": "Organizations registered for transfers (see bulletin RLCF-013)", "startNewTransfer": "Start a new transfer", + "linkTooltip": "Link opens in a new browser tab", "loadingMessage": "Loading transactions card..." }, "transactions": { @@ -31,7 +32,9 @@ }, "website": { "title": "Low Carbon Fuel Standard", - "link": "Visit our website at:
gov.bc.ca/lowcarbonfuels" + "linkText": "Visit our website at:", + "linkUrl": "gov.bc.ca/lowcarbonfuels", + "linkTooltip": "Link opens in a new browser tab" }, "orgBalance": { "loading": "Loading balance details...", @@ -52,7 +55,8 @@ "orgDetailsLabel": "Organization Details", "orgDetailsLoadingMsg": "Loading organization details...", "users": "Users", - "createNewUsrLabel": "Create new BCeID account" + "createNewUsrLabel": "Create new BCeID account", + "linkTooltip": "Link opens in a new browser tab" }, "orgComplianceReports": { "title": "Compliance reports", diff --git a/frontend/src/views/Dashboard/components/cards/bceid/OrgDetailsCard.jsx b/frontend/src/views/Dashboard/components/cards/bceid/OrgDetailsCard.jsx index 6304314a8..e78c73607 100644 --- a/frontend/src/views/Dashboard/components/cards/bceid/OrgDetailsCard.jsx +++ b/frontend/src/views/Dashboard/components/cards/bceid/OrgDetailsCard.jsx @@ -15,6 +15,12 @@ const OrgDetailsCard = () => { const { t } = useTranslation(['dashboard']) const { data: orgData, isLoading: orgLoading } = useOrganization() const navigate = useNavigate() + + function openExternalLink(event, url) { + event.preventDefault() + window.open(url, '_blank', 'noopener,noreferrer') + } + return ( { {orgData?.email} - + navigate(ROUTES.ORGANIZATION)} + sx={{ padding: '4px 0' }} > { navigate(ROUTES.ORGANIZATION_ADDUSER)} + onClick={(e) => openExternalLink(e, 'https://www.bceid.ca/')} + sx={{ padding: '4px 0' }} > { textDecoration: 'underline', '&:hover': { color: 'info.main' } }} + title={t('dashboard:orgDetails.linkTooltip')} > {t('dashboard:orgDetails.createNewUsrLabel')} ( variant="h3" sx={{ color: 'success.main', - marginX: 3 + marginX: 3, + visibility: count != null ? 'visible' : 'hidden' }} > - {count} + {count ?? 0} ) const OrgTransactionsCard = () => { const { t } = useTranslation(['dashboard']) const navigate = useNavigate() + const { data: orgData, isLoading: orgLoading } = useOrganization() const { data: counts, isLoading } = useOrgTransactionCounts() @@ -45,23 +46,31 @@ const OrgTransactionsCard = () => { navigate(route, { state: { filters } }) } - function handleExternalNavigate(event, route) { + function openExternalLink(event, url) { event.preventDefault() - window.open(route, '_blank', 'noopener,noreferrer') + window.open(url, '_blank', 'noopener,noreferrer') } - const renderLinkWithCount = (text, count, onClick, icons = []) => { + const renderLinkWithCount = ( + text, + count, + onClick, + icons = [], + title = '' + ) => { return ( <> - {count != null && } + {text} {icons.map((icon, index) => ( @@ -79,7 +88,6 @@ const OrgTransactionsCard = () => { return ( { maxWidth: '100%', padding: 0, '& .MuiListItemButton-root': { - padding: '2px 0' + padding: '1px 0' } }} > @@ -121,10 +129,11 @@ const OrgTransactionsCard = () => { ]) )} + - handleExternalNavigate( + openExternalLink( e, 'https://www2.gov.bc.ca/assets/gov/farming-natural-resources-and-industry/electricity-alternative-energy/transportation/renewable-low-carbon-fuels/rlcf-013.pdf' ) @@ -134,13 +143,15 @@ const OrgTransactionsCard = () => { t('dashboard:orgTransactions.organizationsRegistered'), null, (e) => - handleExternalNavigate( + openExternalLink( e, - 'https://www2.gov.bc.ca/assets/gov/farming-natural-resources-and-industry/electricity-alternative-energy/transportation/renewable-low-carbon-fuels/rlcf-013.pdf' + 'https://www2.gov.bc.ca/gov/content?id=4B2DC59D77F64C8491C5CDFCF8732F10' ), - [faFilePdf, faShareFromSquare] + [faShareFromSquare], + t('dashboard:orgTransactions.linkTooltip') )} + navigate(ROUTES.TRANSFERS_ADD)} diff --git a/frontend/src/views/Dashboard/components/cards/bceid/WebsiteCard.jsx b/frontend/src/views/Dashboard/components/cards/bceid/WebsiteCard.jsx index 11085b3dc..cd7273434 100644 --- a/frontend/src/views/Dashboard/components/cards/bceid/WebsiteCard.jsx +++ b/frontend/src/views/Dashboard/components/cards/bceid/WebsiteCard.jsx @@ -1,7 +1,8 @@ -import React from 'react' import { useTranslation } from 'react-i18next' import { Box } from '@mui/material' import BCTypography from '@/components/BCTypography' +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' +import { faShareFromSquare } from '@fortawesome/free-solid-svg-icons' const WebsiteCard = () => { const { t } = useTranslation(['dashboard']) @@ -29,10 +30,30 @@ const WebsiteCard = () => { {t('dashboard:website.title')} + style={{ + fontSize: '16px', + color: '#003366', + textAlign: 'center' + }} + > + {t('dashboard:website.linkText')} +
+ + {t('dashboard:website.linkUrl')} + + + ) }