diff --git a/__tests__/Unit/Components/Tasks/Card.test.tsx b/__tests__/Unit/Components/Tasks/Card.test.tsx
index c09ad7232..095e41c3d 100644
--- a/__tests__/Unit/Components/Tasks/Card.test.tsx
+++ b/__tests__/Unit/Components/Tasks/Card.test.tsx
@@ -41,7 +41,7 @@ const DEFAULT_PROPS = {
         startedOn: '1618790400',
         isNoteworthy: true,
         title: 'test 1 for drag and drop',
-        purpose: 'string',
+        purpose: 'to test purpose',
         percentCompleted: 0,
         endsOn: 1618790400,
         status: COMPLETED,
@@ -54,9 +54,55 @@ const DEFAULT_PROPS = {
     onContentChange: jest.fn(),
 };
 
+describe("Task card, self task's purpose and status", () => {
+    it('renders the card with title and status', () => {
+        renderWithRouter(
+            <Provider store={store()}>
+                <Card {...DEFAULT_PROPS} />
+            </Provider>,
+            {
+                query: { dev: 'true' },
+            }
+        );
+        expect(
+            screen.getByText('test 1 for drag and drop')
+        ).toBeInTheDocument();
+        expect(screen.getByText('Done')).toBeInTheDocument();
+    });
+
+    it('displays the purpose if provided', () => {
+        renderWithRouter(
+            <Provider store={store()}>
+                <Card {...DEFAULT_PROPS} />
+            </Provider>,
+            {
+                query: { dev: 'true' },
+            }
+        );
+        expect(screen.getByText('to test purpose')).toBeInTheDocument();
+    });
+
+    it('does not display the purpose if not provided', () => {
+        const PROPS_WITHOUT_PURPOSE = {
+            ...DEFAULT_PROPS,
+            content: { ...DEFAULT_PROPS.content, purpose: '' },
+        };
+        renderWithRouter(
+            <Provider store={store()}>
+                <Card {...PROPS_WITHOUT_PURPOSE} />
+            </Provider>,
+            {
+                query: { dev: 'true' },
+            }
+        );
+        expect(screen.queryByText('to test purpose')).not.toBeInTheDocument();
+    });
+});
+
 jest.mock('@/hooks/useUserData', () => {
     return () => ({
         data: {
+            username: 'ankur',
             roles: {
                 admin: true,
                 super_user: true,
diff --git a/__tests__/Unit/Components/Tasks/TaskDropDown.test.tsx b/__tests__/Unit/Components/Tasks/TaskDropDown.test.tsx
index 935ee282c..c16225705 100644
--- a/__tests__/Unit/Components/Tasks/TaskDropDown.test.tsx
+++ b/__tests__/Unit/Components/Tasks/TaskDropDown.test.tsx
@@ -97,6 +97,29 @@ describe('TaskDropDown', () => {
         expect(onChange).toHaveBeenCalledTimes(0);
         expect(screen.getByTestId('task-status')).toHaveValue(oldStatus);
     });
+
+    it('should render cardPurposeAndStatusFont for label and taskStatusUpdate for select when isDevMode is true', () => {
+        const oldProgress = 100;
+        const oldStatus = BACKEND_TASK_STATUS.NEEDS_REVIEW;
+        const TASK_STATUS_UPDATE = 'taskStatusUpdate';
+        const CARD_PURPOSE_STATUS_FONT = 'cardPurposeAndStatusFont';
+
+        render(
+            <TaskDropDown
+                isDevMode={true}
+                oldProgress={oldProgress}
+                oldStatus={oldStatus}
+                onChange={onChange}
+            />
+        );
+        expect(screen.getByTestId('task-status')).toHaveClass(
+            TASK_STATUS_UPDATE
+        );
+        expect(screen.getByTestId('task-status-label')).toHaveClass(
+            CARD_PURPOSE_STATUS_FONT
+        );
+    });
+
     it('should not show any model info on change of status from in progress to backlog', () => {
         const oldProgress = 80;
         const oldStatus = BACKEND_TASK_STATUS.IN_PROGRESS;
diff --git a/__tests__/Unit/Components/Tasks/TaskStatusEditMode.test.tsx b/__tests__/Unit/Components/Tasks/TaskStatusEditMode.test.tsx
index 3f9c312bb..4f78dab5a 100644
--- a/__tests__/Unit/Components/Tasks/TaskStatusEditMode.test.tsx
+++ b/__tests__/Unit/Components/Tasks/TaskStatusEditMode.test.tsx
@@ -19,8 +19,10 @@ const BLOCKED_TASK = {
 
 describe('TaskStatusEditMode', () => {
     let updateTaskSpy: any;
+    let updateSelfTaskSpy: any;
     beforeEach(() => {
         updateTaskSpy = jest.spyOn(tasksApi, 'useUpdateTaskMutation');
+        updateSelfTaskSpy = jest.spyOn(tasksApi, 'useUpdateSelfTaskMutation');
     });
 
     afterEach(() => {
@@ -173,6 +175,27 @@ describe('TaskStatusEditMode', () => {
             expect(screen.getByTestId('error')).toBeInTheDocument();
         });
     });
+
+    it('change task status from BLOCKED to IN_PROGRESS when  and isDevMode are true', async () => {
+        const setEditedTaskDetails = jest.fn();
+
+        renderWithRouter(
+            <Provider store={store()}>
+                <TaskStatusEditMode
+                    task={BLOCKED_TASK}
+                    setEditedTaskDetails={setEditedTaskDetails}
+                    isDevMode={true}
+                    isSelfTask={true}
+                />
+            </Provider>
+        );
+
+        const statusSelect = screen.getByLabelText('Status:');
+        expect(statusSelect).toHaveValue('BLOCKED');
+
+        fireEvent.change(statusSelect, { target: { value: 'IN_PROGRESS' } });
+        expect(statusSelect).toHaveValue('IN_PROGRESS');
+    });
 });
 
 describe('test beautifyStatus function', () => {
diff --git a/src/components/tasks/TaskDropDown.tsx b/src/components/tasks/TaskDropDown.tsx
index 2a177c952..ff55b376d 100644
--- a/src/components/tasks/TaskDropDown.tsx
+++ b/src/components/tasks/TaskDropDown.tsx
@@ -1,6 +1,7 @@
 import React, { useState } from 'react';
 import { BACKEND_TASK_STATUS } from '@/constants/task-status';
 import { beautifyStatus } from './card/TaskStatusEditMode';
+import styles from '@/components/tasks/card/card.module.scss';
 
 import { MSG_ON_0_PROGRESS, MSG_ON_100_PROGRESS } from '@/constants/constants';
 import TaskDropDownModel from './TaskDropDownModel';
@@ -102,6 +103,40 @@ export default function TaskDropDown({
         onChange(payload);
         setMessage('');
     };
+    if (isDevMode) {
+        return (
+            <>
+                <label
+                    className={styles.cardPurposeAndStatusFont}
+                    data-testid="task-status-label"
+                >
+                    Status:
+                    <select
+                        className={styles.taskStatusUpdate}
+                        data-testid="task-status"
+                        name="status"
+                        onChange={handleChange}
+                        value={newStatus}
+                    >
+                        {taskStatus.map(([name, status]) => (
+                            <option
+                                data-testid={`task-status-${name}`}
+                                key={status}
+                                value={status}
+                            >
+                                {beautifyStatus(name, isDevMode)}
+                            </option>
+                        ))}
+                    </select>
+                </label>
+                <TaskDropDownModel
+                    message={message}
+                    resetProgressAndStatus={resetProgressAndStatus}
+                    handleProceed={handleProceed}
+                />
+            </>
+        );
+    }
     return (
         <>
             <label>
diff --git a/src/components/tasks/card/TaskStatusEditMode.tsx b/src/components/tasks/card/TaskStatusEditMode.tsx
index 8d4c31b37..8efc15d64 100644
--- a/src/components/tasks/card/TaskStatusEditMode.tsx
+++ b/src/components/tasks/card/TaskStatusEditMode.tsx
@@ -5,15 +5,24 @@ import task, {
 import { useState } from 'react';
 import styles from '@/components/tasks/card/card.module.scss';
 import { PENDING, SAVED, ERROR_STATUS } from '../constants';
-import { useUpdateTaskMutation } from '@/app/services/tasksApi';
+import {
+    useUpdateTaskMutation,
+    useUpdateSelfTaskMutation,
+} from '@/app/services/tasksApi';
 import { StatusIndicator } from './StatusIndicator';
 import TaskDropDown from '../TaskDropDown';
-import { TASK_STATUS_MAPING } from '@/constants/constants';
+import {
+    STATUS_UPDATE_ERROR,
+    STATUS_UPDATE_SUCCESSFUL,
+    TASK_STATUS_MAPING,
+} from '@/constants/constants';
+import { toast, ToastTypes } from '@/helperFunctions/toast';
 
 type Props = {
     task: task;
     setEditedTaskDetails: React.Dispatch<React.SetStateAction<CardTaskDetails>>;
     isDevMode?: boolean;
+    isSelfTask?: boolean;
 };
 
 // TODO: remove this after fixing the card beautify status
@@ -33,11 +42,14 @@ const TaskStatusEditMode = ({
     task,
     setEditedTaskDetails,
     isDevMode,
+    isSelfTask,
 }: Props) => {
     const [saveStatus, setSaveStatus] = useState('');
     const [updateTask] = useUpdateTaskMutation();
+    const [updateSelfTask] = useUpdateSelfTaskMutation();
+    const { SUCCESS, ERROR } = ToastTypes;
 
-    const onChangeUpdateTaskStatus = ({
+    const onChangeUpdateTaskStatus = async ({
         newStatus,
         newProgress,
     }: taskStatusUpdateHandleProp) => {
@@ -48,6 +60,21 @@ const TaskStatusEditMode = ({
         if (newProgress !== undefined) {
             payload.percentCompleted = newProgress;
         }
+
+        try {
+            if (isDevMode && isSelfTask) {
+                await updateSelfTask({ id: task.id, task: payload }).unwrap();
+            }
+            toast(SUCCESS, STATUS_UPDATE_SUCCESSFUL);
+        } catch (error) {
+            const errorMessage =
+                error && typeof error === 'object' && 'data' in error
+                    ? (error.data as { message?: string }).message ||
+                      STATUS_UPDATE_ERROR
+                    : STATUS_UPDATE_ERROR;
+            toast(ERROR, errorMessage);
+        }
+
         setEditedTaskDetails((prev: CardTaskDetails) => ({
             ...prev,
             ...payload,
@@ -80,7 +107,7 @@ const TaskStatusEditMode = ({
                 oldProgress={task.percentCompleted}
                 onChange={onChangeUpdateTaskStatus}
             />
-            <StatusIndicator status={saveStatus} />
+            {!isDevMode && <StatusIndicator status={saveStatus} />}
         </div>
     );
 };
diff --git a/src/components/tasks/card/card.module.scss b/src/components/tasks/card/card.module.scss
index 371131140..4fb78978d 100644
--- a/src/components/tasks/card/card.module.scss
+++ b/src/components/tasks/card/card.module.scss
@@ -91,6 +91,16 @@
     color: #aeaeae;
 }
 
+.cardPurposeAndStatusFont {
+    font-size: 1.1rem;
+    color: #555;
+}
+.cardPurposeText {
+    padding: 8px;
+    color: #aeaeae;
+    font-size: 1rem;
+}
+
 .cardStatusFont {
     font-size: 1.3rem;
     font-weight: 500;
@@ -247,10 +257,37 @@
     justify-content: space-between;
 }
 
+.taskStatusDateAndPurposeContainer {
+    display: grid;
+    align-items: baseline;
+    grid-template-columns: 2fr 3fr;
+    gap: 2rem;
+    grid-auto-flow: column;
+    margin-bottom: 1rem;
+}
+
 .taskStatusEditMode {
     margin-top: 0.8rem;
 }
 
+.taskStatusUpdate {
+    border: 1px solid #000000b3;
+    border-radius: 4px;
+    font-size: inherit;
+    font-weight: bolder;
+    background-color: transparent;
+    color: $theme-primary-alt;
+    padding: 0.5rem;
+    height: 2.5rem;
+    width: 10rem;
+    transition: 250ms ease-in-out;
+}
+
+.taskStatusUpdate:hover {
+    background-color: $theme-primary-alt;
+    color: #ffffff;
+}
+
 .taskTagLevelWrapper {
     display: flex;
     padding-top: 0.5rem;
diff --git a/src/components/tasks/card/index.tsx b/src/components/tasks/card/index.tsx
index a2e8457f6..4d26f95cd 100644
--- a/src/components/tasks/card/index.tsx
+++ b/src/components/tasks/card/index.tsx
@@ -73,7 +73,7 @@ const Card: FC<CardProps> = ({
         userResponse?.users[0]?.picture?.url || placeholderImageURL;
     const { SUCCESS, ERROR } = ToastTypes;
 
-    const { isUserAuthorized } = useUserData();
+    const { data, isUserAuthorized } = useUserData();
 
     const [showEditButton, setShowEditButton] = useState(false);
 
@@ -266,7 +266,8 @@ const Card: FC<CardProps> = ({
         setIsEditMode(true);
     };
     const isEditable = shouldEdit && isUserAuthorized && isEditMode;
-
+    const isSelfTask = editedTaskDetails.assignee === data?.username;
+    const isVerifiedTask = editedTaskDetails.status === VERIFIED;
     const getFormattedClosedAtDate = () => {
         const closedAt = cardDetails?.github?.issue?.closedAt;
         return getDateInString(new Date(closedAt ?? Date.now()));
@@ -543,7 +544,13 @@ const Card: FC<CardProps> = ({
                     </div>
                 )}
             </div>
-            <div className={styles.taskStatusAndDateContainer}>
+            <div
+                className={
+                    isDevMode
+                        ? styles.taskStatusDateAndPurposeContainer
+                        : styles.taskStatusAndDateContainer
+                }
+            >
                 <div className={styles.dateInfo}>
                     <div className={styles.dateSection}>
                         <p className={styles.cardSpecialFont}>
@@ -569,26 +576,45 @@ const Card: FC<CardProps> = ({
                             : `Started ${getStartedAgo()}`}
                     </span>
                 </div>
+                {/*card purpose*/}
+                {isDevMode && isSelfTask && editedTaskDetails.purpose && (
+                    <div>
+                        <b className={styles.cardPurposeAndStatusFont}>
+                            Purpose:{' '}
+                        </b>
+                        <span className={styles.cardPurposeText}>
+                            {editedTaskDetails.purpose}
+                        </span>
+                    </div>
+                )}
+
                 {/* EDIT task status */}
-                <div className={styles.taskStatusEditMode}>
-                    {isEditable ? (
-                        <TaskStatusEditMode
-                            task={editedTaskDetails}
-                            setEditedTaskDetails={setEditedTaskDetails}
-                            isDevMode={isDevMode}
-                        />
-                    ) : (
-                        <div className={styles.statusContainer} style={{}}>
-                            <p className={styles.cardSpecialFont}>Status:</p>
-                            <p
-                                data-testid="task-status"
-                                className={styles.statusText}
-                            >
-                                {beautifyStatus(cardDetails.status, isDevMode)}
-                            </p>
-                        </div>
-                    )}
-                </div>
+                {!isDevMode && (
+                    <div className={styles.taskStatusEditMode}>
+                        {isEditable ? (
+                            <TaskStatusEditMode
+                                task={editedTaskDetails}
+                                setEditedTaskDetails={setEditedTaskDetails}
+                                isDevMode={isDevMode}
+                            />
+                        ) : (
+                            <div className={styles.statusContainer} style={{}}>
+                                <p className={styles.cardSpecialFont}>
+                                    Status:
+                                </p>
+                                <p
+                                    data-testid="task-status"
+                                    className={styles.statusText}
+                                >
+                                    {beautifyStatus(
+                                        cardDetails.status,
+                                        isDevMode
+                                    )}
+                                </p>
+                            </div>
+                        )}
+                    </div>
+                )}
             </div>
 
             <div className={styles.contributor}>
@@ -630,6 +656,29 @@ const Card: FC<CardProps> = ({
                 {showAssignButton() && <AssigneeButton />}
             </div>
 
+            {/* EDIT task status */}
+            {isDevMode && (
+                <div className={styles.taskStatusEditMode}>
+                    {isEditable || (!isVerifiedTask && isSelfTask) ? (
+                        <TaskStatusEditMode
+                            task={editedTaskDetails}
+                            setEditedTaskDetails={setEditedTaskDetails}
+                            isDevMode={isDevMode}
+                            isSelfTask={isSelfTask}
+                        />
+                    ) : (
+                        <div className={styles.statusContainer} style={{}}>
+                            <p className={styles.cardSpecialFont}>Status:</p>
+                            <p
+                                data-testid="task-status"
+                                className={styles.statusText}
+                            >
+                                {beautifyStatus(cardDetails.status, isDevMode)}
+                            </p>
+                        </div>
+                    )}
+                </div>
+            )}
             <div className={styles.cardItems}>
                 <div
                     className={`${styles.taskTagLevelWrapper} ${
diff --git a/src/constants/constants.ts b/src/constants/constants.ts
index 4bd9e52ca..21ddeb67c 100644
--- a/src/constants/constants.ts
+++ b/src/constants/constants.ts
@@ -6,6 +6,8 @@ export const DONE = 'DONE';
 export const AVAILABLE = 'AVAILABLE';
 export const UNASSIGNED = 'UNASSIGNED';
 export const PROGRESS_SUCCESSFUL = 'Progress Updated Successfully';
+export const STATUS_UPDATE_SUCCESSFUL = 'Status Updated Successfully';
+export const STATUS_UPDATE_ERROR = 'An error occurred while saving';
 export const STANDUP_ALREADY_SUBMITTED =
     'Standup already submitted for the day';
 export const DATEFORMAT = 'MMMM DD, YYYY ';