diff --git a/__tests__/Unit/Components/Tasks/ProgressCard.test.tsx b/__tests__/Unit/Components/Tasks/ProgressCard.test.tsx
index 5a4287c66..33dc2c7b7 100644
--- a/__tests__/Unit/Components/Tasks/ProgressCard.test.tsx
+++ b/__tests__/Unit/Components/Tasks/ProgressCard.test.tsx
@@ -1,11 +1,12 @@
-import { fireEvent, render, screen, waitFor } from '@testing-library/react';
-import { Provider } from 'react-redux';
 import { store } from '@/app/store';
+import ProgressCard from '@/components/ProgressCard';
 import { renderWithRouter } from '@/test_utils/createMockRouter';
+import { fireEvent, screen } from '@testing-library/react';
+import moment from 'moment';
 import { setupServer } from 'msw/node';
-import handlers from '../../../../__mocks__/handlers';
+import { Provider } from 'react-redux';
 import { mockGetTaskProgress } from '../../../../__mocks__/db/progresses';
-import ProgressCard from '@/components/ProgressCard';
+import handlers from '../../../../__mocks__/handlers';
 
 const server = setupServer(...handlers);
 
@@ -15,11 +16,21 @@ beforeAll(() => {
     });
 });
 
+const dateInAgoFormatOne = moment(
+    mockGetTaskProgress.data[0].createdAt
+).fromNow();
+const dateInAgoFormatTwo = moment(
+    mockGetTaskProgress.data[1].createdAt
+).fromNow();
+const dateInAgoFormatThree = moment(
+    mockGetTaskProgress.data[2].createdAt
+).fromNow();
+
 afterEach(() => server.resetHandlers());
 afterAll(() => server.close());
 
 describe('ProgressCard Component', () => {
-    it('shuld render the ProgressCard', async () => {
+    it('should render the ProgressCard', async () => {
         renderWithRouter(
             <Provider store={store()}>
                 <ProgressCard taskProgress={mockGetTaskProgress.data} />
@@ -55,12 +66,12 @@ describe('ProgressCard Component', () => {
             </Provider>
         );
         const progressArr = container.querySelectorAll(
-            '[data-testid="progress-item"]'
+            '[data-testid="progress-update-card-date"]'
         );
-        expect(progressArr[0]).toHaveTextContent('Wednesday, 31 May 2023');
 
-        expect(progressArr[1]).toHaveTextContent('Wednesday, 31 May 2023');
-        expect(progressArr[2]).toHaveTextContent('Sunday, 28 May 2023');
+        expect(progressArr[0]).toHaveTextContent(dateInAgoFormatOne);
+        expect(progressArr[1]).toHaveTextContent(dateInAgoFormatTwo);
+        expect(progressArr[2]).toHaveTextContent(dateInAgoFormatThree);
     });
     it('should render the progress enteries in dscending order after Dsc btn click  ', async () => {
         const { container, getByRole } = renderWithRouter(
@@ -72,10 +83,16 @@ describe('ProgressCard Component', () => {
         const btn = getByRole('button', { name: 'Dsc' });
         fireEvent.click(btn);
         const progressArr = container.querySelectorAll(
-            '[data-testid="progress-item"]'
+            '[data-testid="progress-update-card-date"]'
+        );
+        expect(progressArr[progressArr.length - 1]).toHaveTextContent(
+            dateInAgoFormatOne
+        );
+        expect(progressArr[progressArr.length - 2]).toHaveTextContent(
+            dateInAgoFormatTwo
+        );
+        expect(progressArr[progressArr.length - 3]).toHaveTextContent(
+            dateInAgoFormatThree
         );
-        expect(progressArr[2]).toHaveTextContent('Wednesday, 31 May 2023');
-        expect(progressArr[1]).toHaveTextContent('Sunday, 28 May 2023');
-        expect(progressArr[0]).toHaveTextContent('Saturday, 27 May 2023');
     });
 });
diff --git a/__tests__/Unit/Components/Tasks/ProgressDetails.test.tsx b/__tests__/Unit/Components/Tasks/ProgressDetails.test.tsx
index 90cfb60c4..a01c875a7 100644
--- a/__tests__/Unit/Components/Tasks/ProgressDetails.test.tsx
+++ b/__tests__/Unit/Components/Tasks/ProgressDetails.test.tsx
@@ -1,90 +1,38 @@
-import { fireEvent, render, screen, waitFor } from '@testing-library/react';
-import { Provider } from 'react-redux';
 import { store } from '@/app/store';
+import ProgressUpdateCard from '@/components/taskDetails/ProgressUpdateCard/ProgressUpdateCard';
 import { renderWithRouter } from '@/test_utils/createMockRouter';
+import { screen } from '@testing-library/react';
 import { setupServer } from 'msw/node';
-import handlers from '../../../../__mocks__/handlers';
+import { Provider } from 'react-redux';
 import { mockGetTaskProgress } from '../../../../__mocks__/db/progresses';
-import ProgressDetails from '@/components/taskDetails/ProgressDetails';
+import handlers from '../../../../__mocks__/handlers';
 
 const server = setupServer(...handlers);
 
+let mockedOpenDetailsFunction: jest.Mock<void, [React.MouseEvent<HTMLElement>]>;
+
 beforeAll(() => {
     server.listen({
         onUnhandledRequest: 'error',
     });
+    mockedOpenDetailsFunction =
+        jest.fn<void, [React.MouseEvent<HTMLElement>]>();
 });
 afterEach(() => server.resetHandlers());
 afterAll(() => server.close());
 
 describe('ProgressDetails Component', () => {
-    it('should render the ProgressDetails', async () => {
-        renderWithRouter(
-            <Provider store={store()}>
-                <ProgressDetails data={mockGetTaskProgress.data[2]} />
-            </Provider>
-        );
-
-        const progress = screen.getByTestId('progress-item');
-        expect(progress).toBeInTheDocument();
-        expect(progress).toHaveTextContent('Wednesday, 31 May 2023');
-    });
-    it('should open the modal with the specific progress details when clicked on details', () => {
-        renderWithRouter(
-            <Provider store={store()}>
-                <ProgressDetails data={mockGetTaskProgress.data[2]} />
-            </Provider>
-        );
-
-        const progress = screen.getByTestId('progress-item');
-        fireEvent.click(progress);
-
-        const modalBackground = screen.getByTestId('modal-background');
-        const content = screen.getByTestId('content');
-        const completed = screen.getByText('Completed:');
-
-        expect(modalBackground).toBeInTheDocument();
-        expect(content).toBeInTheDocument();
-        expect(completed).toBeInTheDocument();
-    });
-
-    it('should close the modal when clicking outside the modal', () => {
+    it('should render the ProgressUpdateCard', async () => {
         renderWithRouter(
             <Provider store={store()}>
-                <ProgressDetails data={mockGetTaskProgress.data[2]} />
+                <ProgressUpdateCard
+                    data={mockGetTaskProgress.data[2]}
+                    openDetails={mockedOpenDetailsFunction}
+                />
             </Provider>
         );
 
-        const progress = screen.getByTestId('progress-item');
-        fireEvent.click(progress);
-
-        const modalBackground = screen.getByTestId('modal-background');
-        const content = screen.getByTestId('content');
-
-        expect(modalBackground).toBeInTheDocument();
-        fireEvent.click(modalBackground);
-
-        expect(content).not.toBeInTheDocument();
-    });
-
-    it('should close the modal on clicking CLOSE button', () => {
-        renderWithRouter(
-            <Provider store={store()}>
-                <ProgressDetails data={mockGetTaskProgress.data[2]} />
-            </Provider>
-        );
-
-        const progress = screen.getByTestId('progress-item');
-        fireEvent.click(progress);
-
-        const closeButton = screen.getByText('Close');
-        expect(closeButton).toBeInTheDocument();
-
-        const content = screen.getByTestId('content');
-        expect(content).toBeInTheDocument();
-
-        fireEvent.click(closeButton);
-
-        expect(content).not.toBeInTheDocument();
+        const cardTitle = screen.getByRole('heading');
+        expect(cardTitle).toBeInTheDocument();
     });
 });
diff --git a/src/components/ProgressCard/index.tsx b/src/components/ProgressCard/index.tsx
index e627738fa..0e049b744 100755
--- a/src/components/ProgressCard/index.tsx
+++ b/src/components/ProgressCard/index.tsx
@@ -1,10 +1,9 @@
-import { useRouter } from 'next/router';
-import React, { useEffect, useState } from 'react';
-import TaskContainer from '../taskDetails/TaskContainer';
+import styles from '@/components/ProgressCard/ProgressCard.module.scss';
 import { ProgressDetailsData } from '@/types/standup.type';
+import { useEffect, useState } from 'react';
 import ProgressDetails from '../taskDetails/ProgressDetails';
-import styles from '@/components/ProgressCard/ProgressCard.module.scss';
 import LatestProgressUpdateCard from '../taskDetails/ProgressUpdateCard/LatestProgressUpdateCard';
+import TaskContainer from '../taskDetails/TaskContainer';
 
 type SortedProgressType = { data: ProgressDetailsData[]; order: number };
 
@@ -12,7 +11,6 @@ type Props = { taskProgress: ProgressDetailsData[] };
 
 export default function ProgressCard({ taskProgress }: Props) {
     const [sortedProgress, setSortedProgress] = useState<SortedProgressType>();
-    const isDev = useRouter().query?.dev === 'true';
     const sortedProgressLength = sortedProgress?.data?.length;
 
     const reverseSortingOrder = () => {
@@ -44,7 +42,7 @@ export default function ProgressCard({ taskProgress }: Props) {
     }, [taskProgress]);
 
     const cardsToShow = sortedProgress?.data?.map((progress, idx) => {
-        if (idx === 0 && sortedProgress?.order === 1 && isDev) {
+        if (idx === 0 && sortedProgress?.order === 1) {
             return (
                 <LatestProgressUpdateCard key={progress.id} data={progress} />
             );
@@ -53,8 +51,7 @@ export default function ProgressCard({ taskProgress }: Props) {
         if (
             sortedProgressLength &&
             idx === sortedProgressLength - 1 &&
-            sortedProgress?.order === 0 &&
-            isDev
+            sortedProgress?.order === 0
         ) {
             return (
                 <LatestProgressUpdateCard key={progress.id} data={progress} />
diff --git a/src/components/taskDetails/ProgressDetails.tsx b/src/components/taskDetails/ProgressDetails.tsx
index 54a7b2b34..aef041366 100644
--- a/src/components/taskDetails/ProgressDetails.tsx
+++ b/src/components/taskDetails/ProgressDetails.tsx
@@ -1,15 +1,11 @@
-import { useState, FC, MouseEvent } from 'react';
 import { ProgressDetailsData } from '@/types/standup.type';
-import { getDateFromTimestamp } from '@/utils/getDateFromTimestamp';
-import styles from './progress-details.module.scss';
-import { useRouter } from 'next/router';
+import { FC, MouseEvent, useState } from 'react';
 import ProgressUpdateCard from './ProgressUpdateCard/ProgressUpdateCard';
 
 type Props = {
     data: ProgressDetailsData;
 };
 const ProgressDetails: FC<Props> = ({ data }) => {
-    const router = useRouter();
     const [showProgressDetails, setShowProgressDetails] =
         useState<boolean>(false);
 
@@ -21,61 +17,7 @@ const ProgressDetails: FC<Props> = ({ data }) => {
         setShowProgressDetails(false);
     };
 
-    const isDev = router.query.dev === 'true';
-    return (
-        <>
-            {isDev ? (
-                <ProgressUpdateCard data={data} openDetails={openDetails} />
-            ) : (
-                <li
-                    onClick={openDetails}
-                    className={styles['list-item']}
-                    data-testid="progress-item"
-                >
-                    {getDateFromTimestamp(data.date)}
-                </li>
-            )}
-            {showProgressDetails && (
-                <div className={styles['container-parent']}>
-                    <div
-                        role="button"
-                        className={styles['container-back']}
-                        onClick={closeDetails}
-                        data-testid="modal-background"
-                    ></div>
-
-                    <div className={styles['container-main']}>
-                        <h2>{getDateFromTimestamp(data.date)}</h2>
-                        <div
-                            className={styles['content']}
-                            data-testid="content"
-                        >
-                            <div className={styles['content-wrapper']}>
-                                <div className={styles['content-item']}>
-                                    <span>Completed:</span>
-                                    <p>{data.completed}</p>
-                                </div>
-                                <div className={styles['content-item']}>
-                                    <span>Planned:</span>
-                                    <p>{data.planned}</p>
-                                </div>
-                                <div className={styles['content-item']}>
-                                    <span>Blockers:</span>
-                                    <p>{data.blockers}</p>
-                                </div>
-                            </div>
-                        </div>
-                        <button
-                            className={styles['container-close']}
-                            onClick={closeDetails}
-                        >
-                            Close
-                        </button>
-                    </div>
-                </div>
-            )}
-        </>
-    );
+    return <ProgressUpdateCard data={data} openDetails={openDetails} />;
 };
 
 export default ProgressDetails;
diff --git a/src/components/taskDetails/index.tsx b/src/components/taskDetails/index.tsx
index 73af9f30a..72dbac3b2 100755
--- a/src/components/taskDetails/index.tsx
+++ b/src/components/taskDetails/index.tsx
@@ -1,35 +1,33 @@
-import React, { ChangeEvent, FC, useState, useEffect, useRef } from 'react';
-import TaskContainer from './TaskContainer';
-import Details from './Details';
-import { toast, ToastTypes } from '@/helperFunctions/toast';
-import convertTimeStamp from '@/helperFunctions/convertTimeStamp';
-import styles from './task-details.module.scss';
-import { useRouter } from 'next/router';
+import { useGetProgressDetailsQuery } from '@/app/services/progressesApi';
 import {
     useGetTaskDetailsQuery,
     useUpdateTaskDetailsMutation,
 } from '@/app/services/taskDetailsApi';
-
+import { useAddOrUpdateMutation } from '@/app/services/taskRequestApi';
+import Layout from '@/components/Layout';
+import TaskDependency from '@/components/taskDetails/taskDependency';
+import { BACKEND_TASK_STATUS } from '@/constants/task-status';
+import { TASK_REQUEST_TYPES } from '@/constants/tasks';
+import convertTimeStamp from '@/helperFunctions/convertTimeStamp';
+import { ToastTypes, toast } from '@/helperFunctions/toast';
 import useUserData from '@/hooks/useUserData';
+import task from '@/interfaces/task.type';
 import {
     ButtonProps,
     TextAreaProps,
     taskDetailsDataType,
 } from '@/interfaces/taskDetails.type';
-import Layout from '@/components/Layout';
-import TaskDependency from '@/components/taskDetails/taskDependency';
-import { useGetProgressDetailsQuery } from '@/app/services/progressesApi';
 import { ProgressDetailsData } from '@/types/standup.type';
-import { useAddOrUpdateMutation } from '@/app/services/taskRequestApi';
+import { useRouter } from 'next/router';
+import React, { ChangeEvent, FC, useEffect, useRef, useState } from 'react';
 import Progress from '../ProgressCard';
 import TaskManagementModal from '../issues/TaskManagementModal';
-import { TASK_REQUEST_TYPES } from '@/constants/tasks';
 import { TaskRequestData } from '../issues/constants';
-import ProgressContainer from '../tasks/card/progressContainer';
-import DevFeature from '../DevFeature';
 import Suggestions from '../tasks/SuggestionBox/Suggestions';
-import { BACKEND_TASK_STATUS } from '@/constants/task-status';
-import task from '@/interfaces/task.type';
+import ProgressContainer from '../tasks/card/progressContainer';
+import Details from './Details';
+import TaskContainer from './TaskContainer';
+import styles from './task-details.module.scss';
 
 const taskStatus = Object.entries(BACKEND_TASK_STATUS);
 
@@ -312,33 +310,33 @@ const TaskDetails: FC<Props> = ({ taskID }) => {
                                         detailType={'Priority'}
                                         value={taskDetailsData?.priority}
                                     />
-                                    <DevFeature>
-                                        {isEditing && (
-                                            <label>
-                                                Status:
-                                                <select
-                                                    name="status"
-                                                    onChange={
-                                                        handleTaskStatusUpdate
-                                                    }
-                                                    value={
-                                                        editedTaskDetails?.status
-                                                    }
-                                                >
-                                                    {taskStatus.map(
-                                                        ([name, status]) => (
-                                                            <option
-                                                                key={status}
-                                                                value={status}
-                                                            >
-                                                                {name}
-                                                            </option>
-                                                        )
-                                                    )}
-                                                </select>
-                                            </label>
-                                        )}
-                                    </DevFeature>
+
+                                    {isEditing && (
+                                        <label>
+                                            Status:
+                                            <select
+                                                name="status"
+                                                onChange={
+                                                    handleTaskStatusUpdate
+                                                }
+                                                value={
+                                                    editedTaskDetails?.status
+                                                }
+                                            >
+                                                {taskStatus.map(
+                                                    ([name, status]) => (
+                                                        <option
+                                                            key={status}
+                                                            value={status}
+                                                        >
+                                                            {name}
+                                                        </option>
+                                                    )
+                                                )}
+                                            </select>
+                                        </label>
+                                    )}
+
                                     <Details
                                         detailType={'Status'}
                                         value={taskDetailsData?.status}
@@ -350,13 +348,12 @@ const TaskDetails: FC<Props> = ({ taskID }) => {
                                                 ?.html_url
                                         }
                                     />
-                                    <DevFeature>
-                                        {isUserAuthorized && (
-                                            <ProgressContainer
-                                                content={taskDetailsData}
-                                            />
-                                        )}
-                                    </DevFeature>
+
+                                    {isUserAuthorized && (
+                                        <ProgressContainer
+                                            content={taskDetailsData}
+                                        />
+                                    )}
                                 </div>
                             </TaskContainer>
                             <Progress taskProgress={taskProgress} />
@@ -392,28 +389,24 @@ const TaskDetails: FC<Props> = ({ taskID }) => {
                                               )
                                     }
                                 />
-                                <DevFeature>
-                                    {isEditing && isUserAuthorized && (
-                                        <div
-                                            className={`${styles.assigneeSuggestionInput} ${styles.assignedToSection}`}
-                                        >
-                                            <Suggestions
-                                                assigneeName={assigneeName}
-                                                showSuggestion={showSuggestion}
-                                                handleClick={
-                                                    handleAssigneSelect
-                                                }
-                                                handleAssignment={
-                                                    handleAssignment
-                                                }
-                                                setShowSuggestion={
-                                                    setShowSuggestion
-                                                }
-                                                ref={inputRef}
-                                            />
-                                        </div>
-                                    )}
-                                </DevFeature>
+
+                                {isEditing && isUserAuthorized && (
+                                    <div
+                                        className={`${styles.assigneeSuggestionInput} ${styles.assignedToSection}`}
+                                    >
+                                        <Suggestions
+                                            assigneeName={assigneeName}
+                                            showSuggestion={showSuggestion}
+                                            handleClick={handleAssigneSelect}
+                                            handleAssignment={handleAssignment}
+                                            setShowSuggestion={
+                                                setShowSuggestion
+                                            }
+                                            ref={inputRef}
+                                        />
+                                    </div>
+                                )}
+
                                 <Details
                                     detailType={'Reporter'}
                                     value={'Ankush'}
@@ -435,28 +428,25 @@ const TaskDetails: FC<Props> = ({ taskID }) => {
                                     detailType={'Ends On'}
                                     value={getEndsOn(taskDetailsData?.endsOn)}
                                 />
-                                <DevFeature>
-                                    {isEditing && (
-                                        <>
-                                            <label htmlFor="endsOnTaskDetails">
-                                                Ends On:
-                                            </label>
-                                            <input
-                                                id="endsOnTaskDetails"
-                                                type="date"
-                                                name="endsOn"
-                                                onChange={(e) => {
-                                                    setNewEndOnDate(
-                                                        e.target.value
-                                                    );
-                                                }}
-                                                onBlur={handleBlurOfEndsOn}
-                                                value={newEndOnDate}
-                                                data-testid="endsOnTaskDetails"
-                                            />
-                                        </>
-                                    )}
-                                </DevFeature>
+
+                                {isEditing && (
+                                    <>
+                                        <label htmlFor="endsOnTaskDetails">
+                                            Ends On:
+                                        </label>
+                                        <input
+                                            id="endsOnTaskDetails"
+                                            type="date"
+                                            name="endsOn"
+                                            onChange={(e) => {
+                                                setNewEndOnDate(e.target.value);
+                                            }}
+                                            onBlur={handleBlurOfEndsOn}
+                                            value={newEndOnDate}
+                                            data-testid="endsOnTaskDetails"
+                                        />
+                                    </>
+                                )}
                             </TaskContainer>
                             <TaskContainer
                                 hasImg={false}