diff --git a/packages/grid_client/src/clients/tf-grid/contracts.ts b/packages/grid_client/src/clients/tf-grid/contracts.ts
index be5084abd1..fb40d29caa 100644
--- a/packages/grid_client/src/clients/tf-grid/contracts.ts
+++ b/packages/grid_client/src/clients/tf-grid/contracts.ts
@@ -110,6 +110,7 @@ export interface GetConsumptionOptions {
 export interface Consumption {
   amountBilled: number;
   discountReceived: DiscountLevel;
+  inFirstBillingCycle: boolean;
 }
 
 export interface GetDiscountPackageOptions {
@@ -308,6 +309,7 @@ class TFContracts extends Contracts {
         return {
           amountBilled: 0,
           discountReceived: "None",
+          inFirstBillingCycle: true,
         };
       } else {
         let duration = 1;
@@ -334,6 +336,7 @@ class TFContracts extends Contracts {
             .div(10 ** 7)
             .toNumber(),
           discountReceived: billReports[0].discountReceived,
+          inFirstBillingCycle: false,
         };
       }
     } catch (err) {
@@ -342,6 +345,33 @@ class TFContracts extends Contracts {
     }
   }
 
+  /**
+   *  Get the estimated contract consumption details per hour in TFT.
+   *
+   * @param  {GetConsumptionOptions} options
+   * @returns {Promise<Consumption>} A promise resolving to the consumption details,
+   * including the amount billed and the discount received.
+   */
+  async getConsumptionWithEstimation(options: GetConsumptionOptions, proxy: GridProxyClient): Promise<Consumption> {
+    try {
+      const consumption = await this.getConsumption(options);
+      if (consumption.inFirstBillingCycle) {
+        const contract = (await proxy.contracts.list({ contractId: options.id }))[0];
+        const contractCostUSD = await this.getContractCost(contract, proxy);
+        const contractCostTFT = await this.convertToTFT(Decimal(contractCostUSD));
+        return {
+          amountBilled: contractCostTFT.div(HOURS_ONE_MONTH).toNumber(),
+          discountReceived: "None",
+          inFirstBillingCycle: true,
+        };
+      }
+      return consumption;
+    } catch (err) {
+      (err as Error).message = formatErrorMessage(`Error getting consumption for contract ${options.id}.`, err);
+      throw err;
+    }
+  }
+
   async listContractsByAddress(options: ListContractByAddressOptions) {
     const twinId = await this.client.twins.getTwinIdByAccountId({ accountId: options.accountId });
     return await this.listContractsByTwinId({
diff --git a/packages/grid_client/src/modules/contracts.ts b/packages/grid_client/src/modules/contracts.ts
index 2728b55e7b..cfdc8996cd 100644
--- a/packages/grid_client/src/modules/contracts.ts
+++ b/packages/grid_client/src/modules/contracts.ts
@@ -555,6 +555,26 @@ class Contracts {
     return this.client.contracts.getConsumption({ id: options.id, graphqlURL: this.config.graphqlURL });
   }
 
+  /**
+   * Get the estimated contract consumption details per hour in TFT.
+   *
+   * @param  {ContractConsumption} options - The contract consumption parameters.
+   * @returns {Promise<Consumption>} A promise resolving to the consumption details,
+   * including the amount billed and the discount received.
+   * @decorators
+   * - `@expose`: Exposes the method for external use.
+   * - `@validateInput`: Validates the input options.
+   */
+  @expose
+  @validateInput
+  async getConsumptionWithEstimation(options: ContractConsumption): Promise<Consumption> {
+    const proxy = new GridProxyClient(this.config.proxyURL);
+    return this.client.contracts.getConsumptionWithEstimation(
+      { id: options.id, graphqlURL: this.config.graphqlURL },
+      proxy,
+    );
+  }
+
   /**
    * Retrieves the deletion time of a contract based on the provided options.
    *
diff --git a/packages/playground/src/components/contracts_list/contracts_table.vue b/packages/playground/src/components/contracts_list/contracts_table.vue
index 5b0971d163..a14b0b9e0b 100644
--- a/packages/playground/src/components/contracts_list/contracts_table.vue
+++ b/packages/playground/src/components/contracts_list/contracts_table.vue
@@ -36,19 +36,18 @@
       </template>
 
       <template #[`item.consumption`]="{ item }">
-        <div
-          v-if="item?.consumption !== 0 && item?.consumption !== undefined"
-          class="d-flex justify-center align-center"
-        >
-          <p class="mr-2 text-no-wrap" cols="8">{{ item.consumption.toFixed(3) }} TFT/hour</p>
+        <div v-if="item?.consumption !== undefined" class="d-flex justify-center align-center">
+          <p class="mr-2 text-no-wrap" cols="8">
+            {{ item.consumption === 0 ? item.consumption : item.consumption.toFixed(3) }} TFT/hour
+          </p>
 
-          <v-tooltip v-if="item.discountPackage" bottom color="primary" close-delay="100" cols="2">
+          <v-tooltip v-if="item.discountPackage !== 'None'" bottom color="primary" close-delay="100" cols="2">
             <template #activator="{ props: discountProps }">
               <v-icon class="scale_beat" color="warning" v-bind="discountProps"> mdi-brightness-percent </v-icon>
             </template>
 
             <a
-              v-if="item.discountPackage === 'None'"
+              v-if="item.discountPackage === undefined"
               class="app-link"
               target="_blank"
               :href="manual.discount_levels"
diff --git a/packages/playground/src/utils/contracts.ts b/packages/playground/src/utils/contracts.ts
index a4e473bf26..5cbe60b076 100644
--- a/packages/playground/src/utils/contracts.ts
+++ b/packages/playground/src/utils/contracts.ts
@@ -55,9 +55,9 @@ export async function normalizeContract(
 
   let consumption: Consumption;
   try {
-    consumption = await grid.contracts.getConsumption({ id });
+    consumption = await grid.contracts.getConsumptionWithEstimation({ id });
   } catch {
-    consumption = { amountBilled: 0, discountReceived: "None" };
+    consumption = { amountBilled: 0, discountReceived: "None", inFirstBillingCycle: false };
   }
 
   return {