Added free trial info in plan details

refs https://github.com/TryGhost/Team/issues/1757

- adds free trial info for a member subscription when active

ghost/portal/src/components/pages/AccountHomePage.js

@@ -3,7 +3,7 @@ import MemberAvatar from '../common/MemberGravatar';
 import ActionButton from '../common/ActionButton';
 import CloseButton from '../common/CloseButton';
 import Switch from '../common/Switch';
-import {getMemberSubscription, getMemberTierName, getSiteNewsletters, getSupportAddress, getUpdatedOfferPrice, hasCommentsEnabled, hasMultipleNewsletters, hasMultipleProductsFeature, hasOnlyFreePlan, isComplimentaryMember} from '../../utils/helpers';
+import {getMemberSubscription, getMemberTierName, getSiteNewsletters, getSupportAddress, getUpdatedOfferPrice, hasCommentsEnabled, hasMultipleNewsletters, hasMultipleProductsFeature, hasOnlyFreePlan, isComplimentaryMember, subscriptionHasFreeTrial} from '../../utils/helpers';
 import {getDateString} from '../../utils/date-time';
 import {ReactComponent as LoaderIcon} from '../../images/icons/loader.svg';
 import {ReactComponent as OfferTagIcon} from '../../images/icons/offer-tag.svg';
@@ -186,6 +186,19 @@ function getOfferLabel({offer, price, subscriptionStartDate}) {
     return offerLabel;
 }
 
+function FreeTrialLabel({subscription}) {
+    if (subscriptionHasFreeTrial({sub: subscription})) {
+        const trialEnd = getDateString(subscription.trial_end_at);
+        return (
+            <p className="gh-portal-account-discountcontainer">
+                <OfferTagIcon className="gh-portal-account-tagicon" />
+                <span>Free Trial till {trialEnd}</span>
+            </p>
+        );
+    }
+    return null;
+}
+
 const PaidAccountActions = () => {
     const {member, site, onAction} = useContext(AppContext);
 
@@ -233,12 +246,14 @@ const PaidAccountActions = () => {
             }
             return null;
         };
+
         return (
             <>
                 <p className={oldPriceClassName}>
                     {label}
                 </p>
                 <OfferLabel />
+                <FreeTrialLabel subscription={subscription} />
             </>
         );
     };

ghost/portal/src/utils/helpers.js

@@ -457,6 +457,25 @@ export function hasOnlyFreeProduct({site}) {
     return (products.length === 1 && hasFreeProductPrice({site}));
 }
 
+export function subscriptionHasFreeTrial({sub} = {}) {
+    if (sub?.trial_end_at && !isInThePast(new Date(sub?.trial_end_at))) {
+        return true;
+    }
+    return false;
+}
+
+function isInThePast(date) {
+    const today = new Date();
+
+    // 👇️ OPTIONAL!
+    // This line sets the hour of the current date to midnight
+    // so the comparison only returns `true` if the passed in date
+    // is at least yesterday
+    today.setHours(0, 0, 0, 0);
+
+    return date < today;
+}
+
 export function getProductFromPrice({site, priceId}) {
     if (priceId === 'free') {
         return getFreeProduct({site});