diff --git a/webapp/channels/src/components/self_hosted_expansion_modal/expansion_card.tsx b/webapp/channels/src/components/self_hosted_expansion_modal/expansion_card.tsx
index 6eadd2de6e..47ecfa49aa 100644
--- a/webapp/channels/src/components/self_hosted_expansion_modal/expansion_card.tsx
+++ b/webapp/channels/src/components/self_hosted_expansion_modal/expansion_card.tsx
@@ -41,7 +41,7 @@ export default function SelfHostedExpansionCard(props: Props) {
 
     const getMonthsUntilExpiry = () => {
         const now = new Date();
-        return (licenseExpiry.getMonth() - now.getMonth()) + 12 * (licenseExpiry.getFullYear() - now.getFullYear());
+        return (licenseExpiry.getMonth() - now.getMonth()) + (MONTHS_IN_YEAR * (licenseExpiry.getFullYear() - now.getFullYear()));
     };
 
     const getMonthlyPrice = () => {
@@ -208,6 +208,7 @@ export default function SelfHostedExpansionCard(props: Props) {
                         <br/>
                         <FormattedMessage
                             id='self_hosted_expansion_rhs_card_cost_per_user_breakdown'
+                            /* eslint-disable no-template-curly-in-string */
                             defaultMessage='${costPerUser} x {monthsUntilExpiry} months'
                             values={{
                                 costPerUser: getMonthlyPrice().toFixed(2),
diff --git a/webapp/channels/src/components/self_hosted_expansion_modal/index.test.tsx b/webapp/channels/src/components/self_hosted_expansion_modal/index.test.tsx
index 7e19fb88cf..94a5ff2b2b 100644
--- a/webapp/channels/src/components/self_hosted_expansion_modal/index.test.tsx
+++ b/webapp/channels/src/components/self_hosted_expansion_modal/index.test.tsx
@@ -3,7 +3,7 @@
 
 import React from 'react';
 
-import {screen, fireEvent, waitFor} from '@testing-library/react';
+import {screen, fireEvent} from '@testing-library/react';
 
 import {GlobalState} from 'types/store';