fix bugs

CommonServer/Services/BillingService.ts

@@ -75,7 +75,7 @@ export class BillingService {
         hasTrial: boolean
     ): Promise<{
         id: string;
-        trialEndsAt: Date;
+        trialEndsAt: Date | null;
     }> {
         if (!this.isBillingEnabled()) {
             throw new BadDataException(
@@ -106,9 +106,9 @@ export class BillingService {
 
         return {
             id: subscription.id,
-            trialEndsAt: hasTrial
+            trialEndsAt: hasTrial && plan.getTrialPeriod() > 0
                 ? OneUptimeDate.getSomeDaysAfter(plan.getTrialPeriod())
-                : OneUptimeDate.getCurrentDate(),
+                : null,
         };
     }
 

CommonServer/Services/ProjectService.ts

@@ -251,7 +251,7 @@ export class Service extends DatabaseService<Model> {
                 data: {
                     paymentProviderCustomerId: customerId,
                     paymentProviderSubscriptionId: id,
-                    trialEndsAt: trialEndsAt,
+                    trialEndsAt: (trialEndsAt || null) as any,
                 },
                 props: {
                     isRoot: true,

CommonUI/src/Components/Button/Button.tsx

@@ -18,6 +18,7 @@ export enum ButtonStyleType {
     SUCCESS_OUTLINE,
     WARNING,
     WARNING_OUTLINE,
+    LINK
 }
 
 export enum ButtonSize {
@@ -99,6 +100,10 @@ const Button: FunctionComponent<ComponentProps> = ({
 
     let buttonStyleCssClass: string = 'no-border-on-hover';
 
+    if (buttonStyle === ButtonStyleType.LINK) {
+        buttonStyleCssClass = 'no-border-on-hover font-500';
+    }
+
     if (buttonStyle === ButtonStyleType.DANGER) {
         buttonStyleCssClass = 'btn-danger';
     }

CommonUI/src/Styles/Custom/utils/Utils.scss

@@ -566,4 +566,8 @@
     text-decoration: underline;
     color: $color-blue;
     cursor: pointer;
+}
+
+.font-500{
+    font-weight: 500 !important;
 }

Dashboard/src/App.tsx

@@ -147,6 +147,7 @@ const App: FunctionComponent = () => {
                     name: true,
                     _id: true,
                     trialEndsAt: true,
+                    paymentProviderPlanId: true
                 },
                 {},
                 {},

Dashboard/src/Components/Header/Header.tsx

@@ -113,7 +113,10 @@ const DashboardHeader: FunctionComponent<ComponentProps> = (
                                         title={`Trial ends in ${OneUptimeDate.getNumberOfDaysBetweenDatesInclusive(
                                             OneUptimeDate.getCurrentDate(),
                                             props.selectedProject?.trialEndsAt!
-                                        )} days`}
+                                        )} ${OneUptimeDate.getNumberOfDaysBetweenDatesInclusive(
+                                            OneUptimeDate.getCurrentDate(),
+                                            props.selectedProject?.trialEndsAt!
+                                        ) > 1 ? 'days' : 'day'}`}
                                     />
                                 )}
                         </div>

Dashboard/src/Components/Header/Upgrade.tsx

@@ -1,5 +1,4 @@
 import React, { FunctionComponent, ReactElement, useState } from 'react';
-import HeaderIconDropdownButton from 'CommonUI/src/Components/Header/HeaderIconDropdownButton';
 import { IconProp } from 'CommonUI/src/Components/Icon/Icon';
 import ModelFormModal from 'CommonUI/src/Components/ModelFormModal/ModelFormModal';
 import Project from 'Model/Models/Project';
@@ -9,6 +8,7 @@ import { FormType } from 'CommonUI/src/Components/Forms/ModelForm';
 import FormFieldSchemaType from 'CommonUI/src/Components/Forms/Types/FormFieldSchemaType';
 import SubscriptionPlan from 'Common/Types/Billing/SubscriptionPlan';
 import { RadioButton } from 'CommonUI/src/Components/RadioButtons/RadioButtons';
+import Button, { ButtonStyleType } from 'CommonUI/src/Components/Button/Button';
 
 export interface ComponentProps {
     projectId: ObjectID;
@@ -22,13 +22,14 @@ const Upgrade: FunctionComponent<ComponentProps> = (
 
     return (
         <>
-            <HeaderIconDropdownButton
-                title="Upgrade"
+            <Button
+                title="Upgrade Plan"
                 onClick={() => {
                     setShowModal(true);
                 }}
-                icon={IconProp.Upgrade}
-            ></HeaderIconDropdownButton>
+                buttonStyle={ButtonStyleType.LINK}
+                icon={IconProp.Automation}
+            ></Button>
             {showModal ? (
                 <ModelFormModal<Project>
                     modelType={Project}