updated feature flag

Real-Dev-Squad · Oct 3, 2024 · 30706f0 · 30706f0
1 parent a6bd0f3
commit 30706f0
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 15 deletions.
diff --git a/__tests__/Unit/Components/Tasks/TaskDates.test.tsx b/__tests__/Unit/Components/Tasks/TaskDates.test.tsx
@@ -1,8 +1,9 @@
 import React from 'react';
 import { Provider } from 'react-redux';
-import { render, screen, fireEvent } from '@testing-library/react';
+import { screen, fireEvent } from '@testing-library/react';
 import { TaskDates } from '@/components/taskDetails/TaskDates';
 import { store } from '@/app/store';
+import { renderWithRouter } from '@/test_utils/createMockRouter';
 
 jest.mock('@/hooks/useUserData', () => {
     return () => ({
@@ -25,7 +26,7 @@ describe('TaskDates Component', () => {
     });
 
     it('should render input field for End On date when in editing mode', () => {
-        render(
+        renderWithRouter(
             <Provider store={store()}>
                 <TaskDates
                     isEditing={true}
@@ -47,7 +48,7 @@ describe('TaskDates Component', () => {
     });
 
     it('should not render input field for End On date when not in editing mode', () => {
-        render(
+        renderWithRouter(
             <Provider store={store()}>
                 <TaskDates
                     isEditing={false}
@@ -65,7 +66,7 @@ describe('TaskDates Component', () => {
     });
 
     it('should display an extension icon, when isExtensionRequestPending is true', () => {
-        render(
+        renderWithRouter(
             <Provider store={store()}>
                 <TaskDates
                     isEditing={true}
@@ -83,7 +84,7 @@ describe('TaskDates Component', () => {
     });
 
     it('should not update the input value if invalid date is entered', () => {
-        render(
+        renderWithRouter(
             <Provider store={store()}>
                 <TaskDates
                     isEditing={true}
@@ -105,7 +106,7 @@ describe('TaskDates Component', () => {
     });
 
     it('should render correctly with admin role', () => {
-        render(
+        renderWithRouter(
             <Provider store={store()}>
                 <TaskDates
                     isEditing={true}
@@ -136,7 +137,7 @@ describe('TaskDates Component', () => {
             });
         });
 
-        render(
+        renderWithRouter(
             <Provider store={store()}>
                 <TaskDates
                     isEditing={true}
@@ -154,7 +155,7 @@ describe('TaskDates Component', () => {
     });
 
     it('should render the correct date when endsOn is null', () => {
-        render(
+        renderWithRouter(
             <Provider store={store()}>
                 <TaskDates
                     isEditing={true}

diff --git a/src/components/taskDetails/Details.tsx b/src/components/taskDetails/Details.tsx
@@ -2,6 +2,7 @@ import React, { FC, useEffect, useState } from 'react';
 import moment from 'moment';
 import { FaReceipt } from 'react-icons/fa6';
 import Link from 'next/link';
+import { useRouter } from 'next/router';
 import Tooltip from '@/components/common/Tooltip/Tooltip';
 import setColor from './taskPriorityColors';
 import extractRepoName from '@/utils/extractRepoName';
@@ -85,6 +86,8 @@ const Details: FC<TaskDetailsProps> = (props) => {
     const gitHubIssueLink = isGitHubLink ? value : undefined;
     const [newEndOnDate, setNewEndOnDate] = useState('');
     const { isUserAuthorized } = useUserData();
+    const router = useRouter();
+    const isDevFlagEnabled = router.query.dev === 'true';
 
     useEffect(() => {
         if (!isEditing) setNewEndOnDate('');
@@ -154,6 +157,9 @@ const Details: FC<TaskDetailsProps> = (props) => {
             : detailType;
 
     const renderedValue = value ?? 'N/A';
+    const dateValue =
+        newEndOnDate || new Date(value as string).toLocaleDateString('en-CA');
+    const finalDateValue = isDevFlagEnabled ? dateValue : newEndOnDate;
 
     return (
         <div className={styles.detailsContainer}>
@@ -165,10 +171,7 @@ const Details: FC<TaskDetailsProps> = (props) => {
                     name="endsOn"
                     onChange={(e) => setNewEndOnDate(e.target.value)}
                     onBlur={handleEndsOnBlur}
-                    value={
-                        newEndOnDate ||
-                        new Date(value as string).toLocaleDateString('en-CA')
-                    }
+                    value={finalDateValue}
                     className={styles.inputField}
                 />
             ) : (

diff --git a/src/components/taskDetails/index.tsx b/src/components/taskDetails/index.tsx
@@ -92,6 +92,8 @@ const TaskDetails: FC<Props> = ({ taskID }) => {
     );
     const inputRef = useRef<HTMLInputElement>(null);
     const [showSuggestion, setShowSuggestion] = useState<boolean>(false);
+    const isDevFlagEnabled = router.query.dev === 'true';
+
     const handleAssignment = (e: React.ChangeEvent<HTMLInputElement>) => {
         setAssigneeName(e.target.value);
         setShowSuggestion(Boolean(e.target.value));
@@ -139,6 +141,7 @@ const TaskDetails: FC<Props> = ({ taskID }) => {
         setEditedTaskDetails(taskDetailsData);
     }
     async function onSave() {
+        !isDevFlagEnabled && setIsEditing(false);
         const updatedFields: Partial<taskDetailsDataType['taskData']> = {};
         for (const key in editedTaskDetails) {
             if (
@@ -161,7 +164,7 @@ const TaskDetails: FC<Props> = ({ taskID }) => {
             return;
         }
 
-        setLoading(true);
+        isDevFlagEnabled && setLoading(true);
         await updateTaskDetails({
             editedDetails: updatedFields,
             taskID,
@@ -170,8 +173,8 @@ const TaskDetails: FC<Props> = ({ taskID }) => {
             .then(() => toast(SUCCESS, 'Successfully saved'))
             .catch((error) => toast(ERROR, error.data.message))
             .finally(() => {
-                setIsEditing(false);
-                setLoading(false);
+                isDevFlagEnabled && setIsEditing(false);
+                isDevFlagEnabled && setLoading(false);
             });
     }