diff --git a/src/components/AddNewSessionModal.vue b/src/components/AddNewSessionModal.vue
new file mode 100644
index 00000000..ecd872b0
--- /dev/null
+++ b/src/components/AddNewSessionModal.vue
@@ -0,0 +1,99 @@
+<template>
+  <ion-modal :is-open="isOpen" @did-dismiss="closeModal">
+    <ion-header>
+      <ion-toolbar>
+        <ion-buttons slot="start">
+          <ion-button @click="closeModal" fill="clear" aria-label="Close">
+            <ion-icon :icon="closeOutline" slot="icon-only" />
+          </ion-button>
+        </ion-buttons>
+        <ion-title>New session</ion-title>
+      </ion-toolbar>
+    </ion-header>
+    <ion-content>
+        <ion-item>
+          <ion-label position="stacked">Name</ion-label>
+          <ion-input v-model="countName" placeholder="category, section, or person"></ion-input>
+          <ion-note slot="helper">Add a name to help identify what inventory is counted in this session</ion-note>
+        </ion-item>
+
+      <ion-list>
+        <ion-list-header>Area</ion-list-header>
+
+        <ion-radio-group v-model="selectedArea">
+          <ion-item v-for="area in areas" :key="area.value">
+            <ion-radio label-placement="start" :value="area.value">{{ area.label }}</ion-radio>
+          </ion-item>
+        </ion-radio-group>
+      </ion-list>
+      <ion-fab vertical="bottom" horizontal="end" slot="fixed">
+          <ion-fab-button @click="addNewSession">
+              <ion-icon :icon="checkmarkDoneOutline" />
+          </ion-fab-button>
+      </ion-fab>
+    </ion-content>
+  </ion-modal>
+</template>
+
+<script setup lang="ts">
+
+import { defineProps, defineEmits, ref } from 'vue';
+import { IonButtons, IonModal, IonIcon, IonFab, IonFabButton, IonContent, IonHeader, IonToolbar, IonTitle, IonButton, IonList, IonListHeader, IonItem, IonLabel, IonRadioGroup, IonRadio, IonInput, IonNote } from '@ionic/vue';
+import { closeOutline, saveOutline, checkmarkDoneOutline } from "ionicons/icons";
+import { showToast } from '@/utils';
+import { useInventoryCountImport } from '@/composables/useInventoryCountImportItem';
+import store from '@/store';
+
+const props = defineProps({
+  isOpen: {
+    type: Boolean,
+    required: true
+  },
+  workEffortId: {
+    type: Number,
+    required: true
+  }
+});
+
+const emit = defineEmits(['update:isOpen']);
+
+const closeModal = () => emit('update:isOpen', false);
+
+async function addNewSession() {
+    const resp = await useInventoryCountImport().createSessionOnServer({
+        countImportName: countName.value,
+        statusId: "SESSION_ASSIGNED",
+        uploadedByUserLogin: store.getters["user/getUserProfile"].username,
+        facilityAreaId: selectedArea.value,
+        createdDate: Date.now(),
+        dueDate: Date.now(),
+        workEffortId: props.workEffortId
+    });
+
+    if (resp.status !== 200) {
+        showToast("Something Went Wrong!");
+        console.error(resp);
+    } else {
+        showToast("Session added Successfully");
+    }
+    closeModal();
+}
+
+// new reactive state for the radio group
+const areas = [
+  { value: 'back_stock', label: 'Back stock' },
+  { value: 'display', label: 'Display' },
+  { value: 'floor_wall', label: 'Floor - wall' },
+  { value: 'floor_shelf', label: 'Floor - shelf' },
+  { value: 'overflow', label: 'Overflow' },
+  { value: 'register', label: 'Register' },
+];
+
+const selectedArea = ref(areas[0].value);
+const countName = ref(''); // <-- store user input
+
+function handleAreaChange(event: any) {
+  selectedArea.value = event.detail?.value;
+  // you can use selectedArea.value when creating the session
+}
+</script>
diff --git a/src/composables/useInventoryCountImportItem.ts b/src/composables/useInventoryCountImportItem.ts
index 28c9896b..e2b9e201 100644
--- a/src/composables/useInventoryCountImportItem.ts
+++ b/src/composables/useInventoryCountImportItem.ts
@@ -2,9 +2,10 @@ import { ref, computed, ComputedRef } from 'vue';
 import Dexie, { Table } from 'dexie';
 import { useProductMaster } from './useProductMaster';
 import { hasError } from '@hotwax/oms-api';
-import api from '@/api';
+import api, { client } from '@/api';
 import { wrap } from 'comlink';
 import type { InventorySyncWorker } from '@/workers/inventorySyncWorker';
+import store from '@/store';
 
 /**
  * Schema definitions
@@ -84,6 +85,8 @@ export function useInventoryCountImport() {
   const syncStatus = ref<'idle'>('idle');
   const currentImport = ref<InventoryCountRecord | null>(null);
   const productMaster = useProductMaster();
+  const maargInstanceUrl = store.getters["user/getInstanceUrl"];
+  const omsRedirectionInfo = store.getters["user/getOmsRedirectionInfo"]; 
 
   /** Loads a specific inventory import record session */
   async function loadSession(inventoryCountImportId: string): Promise<void> {
@@ -253,6 +256,21 @@ export function useInventoryCountImport() {
     }
   }
 
+  async function createSessionOnServer (payload: any) {
+
+    const resp = await client({
+        url: `rest/s1/inventory-cycle-count/cycleCounts/workEfforts/${payload.workEffortId}/sessions`,
+        method: "POST",
+        baseURL: maargInstanceUrl,
+        data: payload,
+        headers: {
+          "Authorization": 'Bearer ' + omsRedirectionInfo.token,
+          'Content-Type': 'application/json'
+        }
+      })
+    return resp;
+  }
+
   return {
     currentImport,
     syncStatus,
@@ -263,6 +281,7 @@ export function useInventoryCountImport() {
     pendingItems,
     loadInventoryItemsFromBackend,
     startAggregationScheduler,
-    startSyncWorker
+    startSyncWorker,
+    createSessionOnServer
   };
 }
\ No newline at end of file
diff --git a/src/router/index.ts b/src/router/index.ts
index a800df54..0bbe6dbf 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -17,6 +17,8 @@ import Settings from "@/views/Settings.vue";
 import HardCount from "@/views/HardCount.vue"
 import HardCountDetail from "@/views/HardCountDetail.vue"
 import SessionCountDetail from "@/views/SessionCountDetail.vue"
+import Draft from "@/views/Draft.vue";
+import Closed from "@/views/Closed.vue";
 
 // Defining types for the meta values
 declare module 'vue-router' {
@@ -108,6 +110,16 @@ const routes: Array<RouteRecordRaw> = [
       permissionId: "APP_DRAFT_VIEW"
     }
   },
+  {
+    path: '/draft',
+    name: 'Draft',
+    component: Draft,
+    beforeEnter: authGuard,
+    props: true,
+    meta: {
+      permissionId: "APP_DRAFT_VIEW"
+    }
+  },
   {
     path: '/assigned',
     name: 'Assigned',
@@ -117,6 +129,15 @@ const routes: Array<RouteRecordRaw> = [
       permissionId: "APP_ASSIGNED_VIEW"
     }
   },
+  {
+    path: '/closed',
+    name: 'Closed',
+    component: Closed,
+    beforeEnter: authGuard,
+    meta: {
+      permissionId: "APP_CLOSED_VIEW"
+    }
+  },
   {
     path: '/assigned/:inventoryCountImportId',
     name: 'AssignedDetail',
@@ -194,9 +215,9 @@ router.beforeEach((to, from) => {
   // - If using ionViewWillLeave/DidLeave hook to clear the filters, the filters are also cleared when moving to and fro from the details page of the same parent page, but in this case we do not want to clear the filters
   //
   // Added check that if the `to` page has the same url pattern as the `from` page and vice-versa then do not clear the filters, used this approach as parent and child page paths are identical
-  if(!(to.path.includes(from.path) || from.path.includes(to.path))) {
-    store.dispatch("count/clearQuery")
-  }
+  // if(!(to.path.includes(from.path) || from.path.includes(to.path))) {
+  //   store.dispatch("count/clearQuery")
+  // }
 })
 
 
diff --git a/src/services/CountService.ts b/src/services/CountService.ts
index a55a14af..7dd8e38b 100644
--- a/src/services/CountService.ts
+++ b/src/services/CountService.ts
@@ -13,13 +13,28 @@ const getAssignedWorkEfforts = async (params: any): Promise <any> => {
     params
   });
 }
-const getInventoryCountImportsByWorkEffort = async (params: any): Promise <any> => {
+const getWorkEfforts = async (params: any): Promise <any> => {
   return api({
-    url: `inventory-cycle-count/cycleCounts/workEfforts/${params.workEffortId}/imports`,
+    url: "inventory-cycle-count/cycleCounts/workEfforts",
     method: "get",
     params
   });
 }
+const getInventoryCountImportsByWorkEffort = async (params: any): Promise <any> => {
+  return api({
+    url: `inventory-cycle-count/cycleCounts/workEfforts/${params.workEffortId}/sessions`,
+    method: "get",
+  });
+}
+
+const addSessionInCount = async (payload: any): Promise<any> => {
+  return api({
+    url: `inventory-cycle-count/cycleCounts/workEfforts/${payload.workEffortId}/sessions`,
+    method: "post",
+    data: payload
+  }
+  );
+}
 const getInventoryCountImportSession = async (params: { workEffortId: string; inventoryCountImportId: string; }): Promise<any> => {
   return await api({
     url: `inventory-cycle-count/cycleCounts/workEfforts/${params.workEffortId}/sessions/${params.inventoryCountImportId}`,
@@ -31,5 +46,6 @@ const getInventoryCountImportSession = async (params: { workEffortId: string; in
 export const CountService = {
   getAssignedWorkEfforts,
   getInventoryCountImportsByWorkEffort,
-  getInventoryCountImportSession
+  addSessionInCount,
+  getWorkEfforts
 }
\ No newline at end of file
diff --git a/src/store/modules/count/CountState.ts b/src/store/modules/count/CountState.ts
index 355d0fc9..b14854ed 100644
--- a/src/store/modules/count/CountState.ts
+++ b/src/store/modules/count/CountState.ts
@@ -1,5 +1,8 @@
 export default interface CountState {
   assignedWorkEfforts: Array<any>,
+  draftWorkEfforts: Array<any>,
+  inReviewWorkEfforts: Array<any>,
+  closedWorkEfforts: Array<any>,
   total: number,
   isScrollable: boolean,
   query: {
diff --git a/src/store/modules/count/actions.ts b/src/store/modules/count/actions.ts
index 5ba2150b..8c7a1e79 100644
--- a/src/store/modules/count/actions.ts
+++ b/src/store/modules/count/actions.ts
@@ -37,14 +37,14 @@ const actions: ActionTree<CountState, RootState> = {
             if (!hasError(inventoryResp)) {
               assignedWorkEfforts.push({
                 ...workEffort,
-                inventoryCountImports: inventoryResp.data || []
+                sessions: inventoryResp.data || []
               })
             }
           } catch (err) {
             logger.error(`Error fetching inventory imports for workEffortId ${workEffort.workEffortId}:`, err)
           }
         }
-
+        console.log("These are counts: ", assignedWorkEfforts);
         total = assignedWorkEfforts.length
         isScrollable = workEfforts.length >= params.pageSize
       } else {
@@ -59,6 +59,37 @@ const actions: ActionTree<CountState, RootState> = {
 
     commit(types.COUNT_ASSIGNED_WORK_EFFORTS_UPDATED, { assignedWorkEfforts, total, isScrollable })
   },
+  async getCycleCounts ({commit}, payload) {
+    let workEfforts = [];
+    console.log("This is payload again from the: ", payload);
+    try {
+      const resp = await CountService.getWorkEfforts(payload);
+      if (!resp || resp.status !== 200 || hasError(resp)) {
+        console.error(resp);
+        return;
+      }
+
+      workEfforts = resp.data;
+      const total = workEfforts?.length;
+      const isScrollable = total > payload.pageSize;
+    
+      if (payload.currentStatusId === 'CYCLE_CNT_IN_CMPLTD') {
+        console.log("In Review");
+        commit(types.COUNT_IN_REVIEW_WORK_EFFORTS_UPDATED, { inReviewWorkEfforts: workEfforts, total, isScrollable })
+      } else if (payload.currentStatusId === 'CYCLE_CNT_CREATED') {
+        console.log("In Created");
+        commit(types.COUNT_DRAFT_WORK_EFFORTS_UPDATED, { draftWorkEfforts: workEfforts, total, isScrollable })
+      } else if (payload.currentStatusId === 'CYCLE_CNT_IN_PRGS') {
+        console.log("In Progress");
+        commit(types.COUNT_ASSIGNED_WORK_EFFORTS_UPDATED, { assignedWorkEfforts: workEfforts, total, isScrollable })
+      } else if (payload.currentStatusId === "CYCLE_CNT_IN_CLOSED") {
+        console.log("In Closed");
+        commit(types.COUNT_CLOSED_WORK_EFFORTS_UPDATED, { closedWorkEfforts: workEfforts, total, isScrollable })
+      }
+    } catch (error) {
+      console.error(error);
+    }
+  },
   setCountDetailPageActive({ commit }, isPageActive) {
     commit(types.COUNT_DETAIL_PAGE_ACTIVE_UPDATED, isPageActive);
   }
diff --git a/src/store/modules/count/getters.ts b/src/store/modules/count/getters.ts
index 65e283f1..6f0cae34 100644
--- a/src/store/modules/count/getters.ts
+++ b/src/store/modules/count/getters.ts
@@ -6,6 +6,15 @@ const getters: GetterTree<CountState, RootState> = {
   getAssignedWorkEfforts(state) {
     return state.assignedWorkEfforts ? JSON.parse(JSON.stringify(state.assignedWorkEfforts)) : []
   },
+  getDraftWorkEfforts(state) {
+    return state.draftWorkEfforts ? JSON.parse(JSON.stringify(state.draftWorkEfforts)) : []
+  },
+  getInReviewCounts(state) {
+    return state.inReviewWorkEfforts ? JSON.parse(JSON.stringify(state.inReviewWorkEfforts)) : []
+  },
+  getClosedCounts(state) {
+    return state.closedWorkEfforts ? JSON.parse(JSON.stringify(state.closedWorkEfforts)) : [];
+  },
   getCycleCountsList(state) {
     return state.cycleCounts.list ? JSON.parse(JSON.stringify(state.cycleCounts.list)) : []
   },
diff --git a/src/store/modules/count/index.ts b/src/store/modules/count/index.ts
index d51e3abf..1d4d2e61 100644
--- a/src/store/modules/count/index.ts
+++ b/src/store/modules/count/index.ts
@@ -9,6 +9,9 @@ const countModule: Module<CountState, RootState> = {
   namespaced: true,
   state: {
     assignedWorkEfforts: [],
+    draftWorkEfforts: [],
+    inReviewWorkEfforts: [],
+    closedWorkEfforts: [],
     total: 0,
     isScrollable: true,
     query: {
diff --git a/src/store/modules/count/mutation-types.ts b/src/store/modules/count/mutation-types.ts
index 247eb0ac..7b2598a3 100644
--- a/src/store/modules/count/mutation-types.ts
+++ b/src/store/modules/count/mutation-types.ts
@@ -1,3 +1,6 @@
 export const SN_COUNT = "count"
 export const COUNT_DETAIL_PAGE_ACTIVE_UPDATED = SN_COUNT + '/DETAIL_PAGE_ACTIVE_UPDATED'
-export const COUNT_ASSIGNED_WORK_EFFORTS_UPDATED = SN_COUNT + "/ASSIGNED_WORK_EFFORTS_UPDATED"
\ No newline at end of file
+export const COUNT_ASSIGNED_WORK_EFFORTS_UPDATED = SN_COUNT + "/ASSIGNED_WORK_EFFORTS_UPDATED"
+export const COUNT_DRAFT_WORK_EFFORTS_UPDATED = SN_COUNT + "/DRAFT_WORK_EFFORTS_UPDATED"
+export const COUNT_IN_REVIEW_WORK_EFFORTS_UPDATED = SN_COUNT + "/IN_REVIEW_WORK_EFFORTS_UPDATED"
+export const COUNT_CLOSED_WORK_EFFORTS_UPDATED = SN_COUNT + "/CLOSED_WORK_EFFORTS_UPDATED"
\ No newline at end of file
diff --git a/src/store/modules/count/mutations.ts b/src/store/modules/count/mutations.ts
index 01345b65..caf137a1 100644
--- a/src/store/modules/count/mutations.ts
+++ b/src/store/modules/count/mutations.ts
@@ -10,6 +10,18 @@ const mutations: MutationTree <CountState> = {
     state.assignedWorkEfforts = payload.assignedWorkEfforts
     state.total = payload.total
     state.isScrollable = payload.isScrollable;
+  },
+  [types.COUNT_DRAFT_WORK_EFFORTS_UPDATED] (state, payload) {
+    state.draftWorkEfforts = payload.draftWorkEfforts
+    state.isScrollable = payload.isScrollable;
+  },
+  [types.COUNT_IN_REVIEW_WORK_EFFORTS_UPDATED] (state, payload) {
+    state.inReviewWorkEfforts = payload.inReviewWorkEfforts
+    state.isScrollable = payload.isScrollable;
+  },
+  [types.COUNT_CLOSED_WORK_EFFORTS_UPDATED] (state, payload) {
+    state.closedWorkEfforts = payload.closedWorkEfforts
+    state.isScrollable = payload.isScrollable;
   }
 }	
 export default mutations;	
diff --git a/src/views/Assigned.vue b/src/views/Assigned.vue
index 858065f3..b6129a0e 100644
--- a/src/views/Assigned.vue
+++ b/src/views/Assigned.vue
@@ -18,25 +18,19 @@
         {{ translate("No cycle counts found") }}
       </p>
       <ion-list v-else>
-        <div class="list-item" v-for="count in cycleCounts" :key="count.inventoryCountImportId" button @click="router.push(`/assigned/${count.inventoryCountImportId}`)">
+        <div class="list-item" v-for="count in cycleCounts" :key="count.workEffortId" button @click="router.push(`/assigned/${count.inventoryCountImportId}`)">
           <ion-item lines="none">
             <ion-icon :icon="storefrontOutline" slot="start"></ion-icon>
             <ion-label>
               <p class="overline" v-if="count.countTypeEnumId === 'HARD_COUNT'">{{ translate("HARD COUNT") }}</p>
-              {{ count.countImportName }}
-              <p>{{ count.inventoryCountImportId }}</p>
+              {{ count.workEffortName }}
+              <p>{{ count.workEffortId }}</p>
             </ion-label>
           </ion-item>
           
           <ion-chip outline>
             <ion-label>{{ getFacilityName(count?.facilityId) }}</ion-label>
           </ion-chip>
-          
-          <ion-label>
-            <!-- TODO: make it dynamic currently not getting stats correctly -->
-            {{ getCycleCountStats(count.inventoryCountImportId, count.countTypeEnumId === "HARD_COUNT") }}
-            <p>{{ translate("counted") }}</p>
-          </ion-label>
 
           <ion-label>
             {{ getDateWithOrdinalSuffix(count.dueDate) }}
@@ -44,7 +38,7 @@
           </ion-label>
           
           <ion-item lines="none">
-            <ion-badge :color="getDerivedStatusForCount(count)?.color" slot="end">{{ translate(getDerivedStatusForCount(count)?.label) }}</ion-badge>
+            <ion-badge class="status-badge" slot="end">{{ count.currentStatusId }}</ion-badge>
           </ion-item>
         </div>
       </ion-list>
@@ -67,7 +61,7 @@ import { getCycleCountStats, getDateWithOrdinalSuffix, getDerivedStatusForCount,
 import router from "@/router"
 // import SearchBarAndSortBy from "@/components/SearchBarAndSortBy.vue";
 
-const cycleCounts = computed(() => store.getters["count/getCounts"])
+const cycleCounts = computed(() => store.getters["count/getAssignedWorkEfforts"])
 const isScrollable = computed(() => store.getters["count/isCycleCountListScrollable"])
 
 const isScrollingEnabled = ref(false);
@@ -113,9 +107,9 @@ async function fetchAssignedCycleCount(vSize?: any, vIndex?: any) {
   const payload = {
     pageSize,
     pageIndex,
-    statusId: "INV_COUNT_ASSIGNED"
+    currentStatusId: "CYCLE_CNT_IN_PRGS"
   }
-  await store.dispatch("count/fetchCycleCounts", payload)
+  await store.dispatch("count/getCycleCounts", payload)
 }
 </script>
 
diff --git a/src/views/Closed.vue b/src/views/Closed.vue
new file mode 100644
index 00000000..ade2ca0a
--- /dev/null
+++ b/src/views/Closed.vue
@@ -0,0 +1,77 @@
+<template>
+  <ion-page>
+    <ion-header>
+      <ion-toolbar>
+        <ion-title>{{ translate("Closed")}}</ion-title>
+        <ion-buttons slot="end">
+          <ion-menu-button menu="assigned-filter">
+            <ion-icon :icon="filterOutline" />
+          </ion-menu-button>
+        </ion-buttons>
+      </ion-toolbar>
+    </ion-header>
+    <ion-content>
+      <ion-list>
+        <div class="list-item" v-for="count in cycleCounts" :key="count.workEffortId">
+          <ion-item lines="none">
+            <ion-icon :icon="storefrontOutline" slot="start"></ion-icon>
+            <ion-label>
+              <p class="overline" v-if="count.workEffortPurposeTypeId === 'HARD_COUNT'">{{ translate("HARD COUNT") }}</p>
+              {{ count.workEffortName }}
+              <p>{{ count.workEffortId }}</p>
+            </ion-label>
+          </ion-item>
+
+          <ion-chip outline>
+            <ion-label>{{ getFacilityName(count?.facilityId) }}</ion-label>
+          </ion-chip>
+        </div>
+      </ion-list>
+    </ion-content>
+  </ion-page>
+</template>
+
+<script setup lang="ts">
+import { translate } from '@/i18n';
+import store from '@/store';
+import { useUserStore } from '@hotwax/dxp-components';
+import { IonPage, IonHeader, IonTitle, IonToolbar, IonButtons, IonMenuButton, IonContent, IonList, IonItem, onIonViewDidEnter } from '@ionic/vue';
+import { filterOutline, storefrontOutline } from "ionicons/icons";
+import { computed } from 'vue';
+
+const cycleCounts = computed(() => store.getters["count/getClosedCounts"]);
+
+onIonViewDidEnter(async () => {
+  fetchClosedCycleCounts();
+})
+
+async function fetchClosedCycleCounts(vSize?: any, vIndex?: any) {
+  const pageSize = vSize ? vSize : process.env.VUE_APP_VIEW_SIZE;
+  const pageIndex = vIndex ? vIndex : 0;
+  const payload = {
+    pageSize,
+    pageIndex,
+    currentStatusId: "CYCLE_CNT_IN_CLOSED"
+  }
+  await store.dispatch("count/getCycleCounts", payload);
+}
+
+function getFacilityName(id: string) {
+  return useUserStore().getFacilites.find((facility: any) => facility.facilityId === id)?.facilityName || id
+}
+</script>
+
+<style scoped>
+ion-content {
+  --padding-bottom: 80px;
+}
+
+.list-item {
+  --columns-desktop: 7;
+  border-bottom : 1px solid var(--ion-color-medium);
+}
+
+.list-item > ion-item {
+  width: 100%;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/Count.vue b/src/views/Count.vue
index f95e6ede..760330d3 100644
--- a/src/views/Count.vue
+++ b/src/views/Count.vue
@@ -30,7 +30,6 @@
                 created date
               </ion-card-subtitle>
             </div>
-            <ion-note>number of items</ion-note>
           </ion-card-header>
           <ion-item lines="none">
             {{ translate("Due date") }}
@@ -44,7 +43,7 @@
                 Sessions
               </ion-label>
             </ion-list-header>
-            <ion-button expand="block" class="ion-margin-horizontal">
+            <ion-button expand="block" class="ion-margin-horizontal" @click="showAddNewSessionModal">
               <ion-label>
                 Start new session
               </ion-label>
@@ -66,7 +65,6 @@
                 created date
               </ion-card-subtitle>
             </div>
-            <ion-note>number of items</ion-note>
           </ion-card-header>
           <ion-item lines="none">
             {{ translate("Due date") }}
@@ -79,7 +77,7 @@
               <ion-label>
                 Sessions
               </ion-label>
-              <ion-button fill="clear" size="small">
+              <ion-button fill="clear" size="small" @click="showAddNewSessionModal">
                 <ion-icon slot="start" :icon="addCircleOutline"></ion-icon>
                 New
               </ion-button>
@@ -131,7 +129,6 @@
                 created date
               </ion-card-subtitle>
             </div>
-            <ion-note>number of items</ion-note>
           </ion-card-header>
           <ion-item lines="none">
             {{ translate("Due date") }}
@@ -184,20 +181,19 @@
           </ion-list>
         </ion-card>
         
-        <ion-card v-for="count in cycleCount" :key="count.inventoryCountImportId" @click="navigateToStoreView(count)" button>
+        <ion-card v-for="count in cycleCount" :key="count.workEffortId">
           <ion-card-header>
             <div>
-              <ion-label v-if="count.countTypeEnumId === 'HARD_COUNT'" color="warning" class="overline">
+              <ion-label v-if="count.workEffortPurposeTypeId === 'HARD_COUNT'" color="warning" class="overline">
                 {{ translate("HARD COUNT") }}
               </ion-label>
               <ion-card-title>
-                {{ count.countImportName }}
+                {{ count.workEffortName }}
               </ion-card-title>
               <ion-card-subtitle>
                 {{ getDateWithOrdinalSuffix(count.createdDate) }}
               </ion-card-subtitle>
             </div>
-            <ion-note>{{ cycleCountStats(count.inventoryCountImportId)?.totalItems }} {{ translate("items") }}</ion-note>
           </ion-card-header>
           <ion-item lines="none">
             {{ translate("Due date") }}
@@ -205,7 +201,38 @@
               <p>{{ getDateWithOrdinalSuffix(count.dueDate) }}</p>
             </ion-label>
           </ion-item>
+          <ion-list>
+            <ion-list-header>
+              <ion-label>
+                Sessions
+              </ion-label>
+              <ion-button v-if="count.sessions?.length" fill="clear" size="small" @click="showAddNewSessionModal(count.workEffortId)">
+                  <ion-icon slot="start" :icon="addCircleOutline"></ion-icon>
+                  New
+              </ion-button>
+            </ion-list-header>
+            <ion-button v-if="count.sessions?.length === 0" expand="block" class="ion-margin-horizontal" @click="showAddNewSessionModal(count.workEffortId)">
+              <ion-label>
+                Start new session
+              </ion-label>
+            </ion-button>
+            <!-- TODO: Need to show the session on this device seperately from the other sessions -->
+              <ion-item-group v-for="session in count.sessions" :key="session.inventoryCountImportId">
+              <ion-item detail="true" :router-link="`/session-count-detail/${session.workEffortId}/${count.workEffortPurposeTypeId}/${session.inventoryCountImportId}`">
+                <ion-label>
+                  {{ session.countImportName }} + {{ session.facilityAreaId }}
+                  <p>
+                    created By {{ session.uploadedByUserLogin }}
+                  </p>
+                </ion-label>
+                <ion-note slot="end">
+                  {{ getSessionStatusDescription(session.statusId) }}
+                </ion-note>
+              </ion-item>
+            </ion-item-group>
+          </ion-list>
         </ion-card>
+        <AddNewSessionModal v-model:isOpen="isAddSessionModalOpen" :work-effort-id="selectedWorkEffortId"/>
       </template>
       <!-- <template v-else>
         <p class="empty-state">{{ translate("No cycle counts found") }}</p>
@@ -245,8 +272,9 @@ import { translate } from '@/i18n';
 import { computed, ref } from "vue";
 import { useStore } from 'vuex';
 import { useRouter } from 'vue-router'
-import { getCycleCountStats, getDateWithOrdinalSuffix, showToast } from "@/utils"
+import { getDateWithOrdinalSuffix, showToast } from "@/utils"
 import { useUserStore } from '@hotwax/dxp-components';
+import AddNewSessionModal from '@/components/AddNewSessionModal.vue';
 
 const store = useStore();
 const router = useRouter()
@@ -255,20 +283,43 @@ const userStore = useUserStore();
 const cycleCount = computed(() => store.getters["count/getAssignedWorkEfforts"]);
 const isScrollable = computed(() => store.getters["count/isCycleCountScrollable"])
 const currentFacility = computed(() => userStore.getCurrentFacility)
-const cycleCountStats = computed(() => (id) => store.getters["count/getCycleCountStats"](id))
+// const cycleCountStats = computed(() => (id) => store.getters["count/getCycleCountStats"](id))
+const userProfile = store.getters["user/getUserProfile"];
 
 const selectedSegment = ref("assigned");
 const isScrollingEnabled = ref(false);
 const contentRef = ref({});
 const infiniteScrollRef = ref({});
 let isLoading = ref(false);
-
+const isAddSessionModalOpen = ref(false);
+const selectedWorkEffortId = ref(null);
 onIonViewDidEnter(async() => {
   isLoading.value = true;
   await fetchCycleCounts();
   isLoading.value = false;
 })
 
+// TODO: Fetch the status description when the app loads.
+function getSessionStatusDescription(statusId) {
+  if (!statusId) {
+    return "";
+  }
+  if (statusId === "SESSION_CREATED") {
+    return "Created";
+  } else if (statusId === "SESSION_ASSIGNED") {
+    return "In Progress";
+  } else if (statusId === "SESSION_SUBMITTED") {
+    return "Submitted";
+  } else if (statusId === "SESSION_VOIDED") {
+    return "Voided";
+  }
+}
+
+function showAddNewSessionModal(workEffortId) {
+  isAddSessionModalOpen.value = true;
+  selectedWorkEffortId.value = workEffortId;
+}
+
 function enableScrolling() {
   // Make sure refs exist and DOM is ready
   const parentElement = contentRef.value?.$el
@@ -317,9 +368,9 @@ async function fetchCycleCounts(vSize, vIndex) {
     pageSize,
     pageIndex,
     facilityId,
-    statusId: getStatusIdForCountsToBeFetched()
+    currentStatusId: getStatusIdForCountsToBeFetched()
   };
-  await store.dispatch("count/fetchCycleCountsLists", payload);
+  await store.dispatch("count/getAssignedWorkEfforts", payload);
 }
 
 async function segmentChanged(value) {
@@ -335,7 +386,7 @@ function navigateToStoreView(count) {
 
 function getStatusIdForCountsToBeFetched() {
   if(selectedSegment.value === "assigned") {
-    return "INV_COUNT_ASSIGNED"
+    return "CYCLE_CNT_IN_PRGS"
   } else if(selectedSegment.value === "pendingReview") {
     return "INV_COUNT_REVIEW"
   } else {
@@ -343,25 +394,25 @@ function getStatusIdForCountsToBeFetched() {
   }
 }
 
-function getSubmissionDate(count) {
-  const history = cycleCountStats.value(count.inventoryCountImportId)?.statusHistory
-  if(!history) {
-    return "-";
-  }
+// function getSubmissionDate(count) {
+//   const history = cycleCountStats.value(count.inventoryCountImportId)?.statusHistory
+//   if(!history) {
+//     return "-";
+//   }
 
-  const submissionStatus = history.toReversed().find((status) => status.statusId === "INV_COUNT_REVIEW")
-  return getDateWithOrdinalSuffix(submissionStatus?.statusDate)
-}
+//   const submissionStatus = history.toReversed().find((status) => status.statusId === "INV_COUNT_REVIEW")
+//   return getDateWithOrdinalSuffix(submissionStatus?.statusDate)
+// }
 
-function getClosedDate(count) {
-  const history = cycleCountStats.value(count.inventoryCountImportId)?.statusHistory
-  if(!history) {
-    return "-";
-  }
+// function getClosedDate(count) {
+//   const history = cycleCountStats.value(count.inventoryCountImportId)?.statusHistory
+//   if(!history) {
+//     return "-";
+//   }
 
-  const submissionStatus = history.toReversed().find((status) => status.statusId === "INV_COUNT_COMPLETED")
-  return getDateWithOrdinalSuffix(submissionStatus?.statusDate)
-}
+//   const submissionStatus = history.toReversed().find((status) => status.statusId === "INV_COUNT_COMPLETED")
+//   return getDateWithOrdinalSuffix(submissionStatus?.statusDate)
+// }
 </script> 
 
 <style scoped>
diff --git a/src/views/Draft.vue b/src/views/Draft.vue
new file mode 100644
index 00000000..6dff59a4
--- /dev/null
+++ b/src/views/Draft.vue
@@ -0,0 +1,60 @@
+<template>
+    <ion-page>
+        <ion-header>
+        <ion-toolbar>
+            <ion-title>{{ translate("Draft")}}</ion-title>
+        </ion-toolbar>
+        </ion-header>
+        <ion-content>
+            <p v-if="!cycleCounts.length" class="empty-state">
+                {{ translate("No cycle counts found") }}
+            </p>
+            <ion-list v-else class="list">
+                <ion-item lines="full" v-for="count in cycleCounts" :key="count.workEffortId" button detail>
+                    <ion-label>
+                        <p class="overline" v-if="count.workEffortPurposeTypeId === 'HARD_COUNT'">{{ translate("HARD COUNT") }}</p>
+                        {{ count.workEffortName }}
+                    </ion-label>
+                </ion-item>
+            </ion-list>
+        </ion-content>
+    </ion-page>
+</template>
+
+<script setup lang="ts">
+import { translate, useUserStore } from '@hotwax/dxp-components';
+import { IonPage, IonHeader, IonContent, onIonViewDidEnter, IonList, IonLabel } from '@ionic/vue';
+import { computed, ref } from 'vue';
+import { useStore } from 'vuex';
+import { useRouter } from 'vue-router'
+
+const isLoading = ref(false);
+const store = useStore();
+const router = useRouter()
+const userStore = useUserStore();
+
+const cycleCounts = computed(() => store.getters["count/getDraftWorkEfforts"]);
+
+onIonViewDidEnter(async () => {
+    isLoading.value = true;
+    fetchCycleCounts();
+    isLoading.value = false;
+});
+
+async function fetchCycleCounts(vSize?: any, vIndex?: any) {
+    const pageSize = vSize ? vSize : process.env.VUE_APP_VIEW_SIZE;
+    const pageIndex = vIndex ? vIndex : 0;
+    const payload = {
+        pageSize,
+        pageIndex,
+        currentStatusId: "CYCLE_CNT_CREATED"
+    };
+    await store.dispatch("count/getCycleCounts", payload);
+}
+</script>
+
+<style scoped>
+.list {
+  padding: 6px 70px 0 70px;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/PendingReview.vue b/src/views/PendingReview.vue
index 7328787d..6a385060 100644
--- a/src/views/PendingReview.vue
+++ b/src/views/PendingReview.vue
@@ -13,7 +13,7 @@
     </ion-header>
 
     <ion-content ref="contentRef" :scroll-events="true" @ionScroll="enableScrolling()" id="filter">
-      <SearchBarAndSortBy />
+      <!-- <SearchBarAndSortBy /> -->
       <!-- <p v-if="!cycleCounts.length" class="empty-state">
         {{ translate("No cycle counts found") }}
       </p> -->
@@ -22,21 +22,15 @@
           <ion-item lines="none">
             <ion-icon :icon="storefrontOutline" slot="start"></ion-icon>
             <ion-label>
-              <p class="overline" v-if="count.countTypeEnumId === 'HARD_COUNT'">{{ translate("HARD COUNT") }}</p>
-              {{ count.countImportName }}
-              <p>{{ count.inventoryCountImportId }}</p>
+              <p class="overline" v-if="count.workEffortPurposeTypeId === 'HARD_COUNT'">{{ translate("HARD COUNT") }}</p>
+              {{ count.workEffortName }}
+              <p>{{ count.workEffortId }}</p>
             </ion-label>
           </ion-item>
           
           <ion-chip outline>
             <ion-label>{{ getFacilityName(count?.facilityId) }}</ion-label>
           </ion-chip>
-          
-          <ion-label>
-            <!-- TODO: make it dynamic currently not getting stats correctly -->
-            {{ getCycleCountStats(count.inventoryCountImportId, count.countTypeEnumId === "HARD_COUNT") }}
-            <p>{{ translate("counted") }}</p>
-          </ion-label>
 
           <ion-label>
             {{ getDateWithOrdinalSuffix(count.dueDate) }}
@@ -44,7 +38,7 @@
           </ion-label>
           
           <ion-item lines="none">
-            <ion-badge :color="getDerivedStatusForCount(count)?.color" slot="end">{{ translate(getDerivedStatusForCount(count)?.label) }}</ion-badge>
+            <ion-badge slot="end">{{ translate(count.currentStatusId) }}</ion-badge>
           </ion-item>
         </div>
       </ion-list>
@@ -67,7 +61,7 @@ import Filters from "@/components/Filters.vue"
 import { getCycleCountStats, getDateWithOrdinalSuffix, getDerivedStatusForCount, getFacilityName } from "@/utils"
 import SearchBarAndSortBy from "@/components/SearchBarAndSortBy.vue";
 
-const cycleCounts = computed(() => store.getters["count/getCounts"])
+const cycleCounts = computed(() => store.getters["count/getInReviewCounts"])
 const isScrollable = computed(() => store.getters["count/isCycleCountListScrollable"])
 
 const isScrollingEnabled = ref(false);
@@ -113,9 +107,9 @@ async function fetchPendingCycleCounts(vSize?: any, vIndex?: any) {
   const payload = {
     pageSize,
     pageIndex,
-    statusId: "INV_COUNT_REVIEW"
+    currentStatusId: "CYCLE_CNT_IN_CMPLTD"
   }
-  await store.dispatch("count/fetchCycleCounts", payload)
+  await store.dispatch("count/getCycleCounts", payload)
 }
 </script>