Add clear button to set deadline property.Issue-1132

[RemyaManoharan]

Pull Request Template

Description Solve #1132

Implemented functionality to clear task deadlines and improved the UI by replacing Collapse component with a Drawer for better user interaction.

Changes

Improvements

• Replaced Collapse component with Material-UI Drawer component for better user experience
• Added styles for Drawer positioning and appearance
• Implemented proper button for clear date
• Added disabled state for Clear button when no deadline exists

New Features

1. Added ability to clear task deadlines
2. Implemented notification system for deadline removal
3. Added proper validation to prevent clearing non-existent deadlines

Purpose

The main purpose is to set clear button for Deadline and implementing Drawer functionality.

Solution

Code Changes

1. In task.js, Modified the function to handle clear functionality:

        ```javascript
           handleDeadlineForm = (e) => {
              e.preventDefault()
              this.setState((prevState) => ({
                  deadlineForm: !prevState.deadlineForm,
                  paymentForm: false,
                   }));
            }

2. In In task-dead-line-form , added handleClearDeadLine()

  ```javascript
      handleClearDeadline = () => {
         const { deadline, updateTask, match, addNotification } = this.props 
         if (deadline) { 
            updateTask({
            id: match.params.id,
            deadline: null
          })
          addNotification('actions.task.deadline.clear')
        }
    this.setState({ deadline: null })
  }

In render, changed the Collapse component to Drawer component

         <Drawer
          anchor="bottom"
          open={open}
          onClose={onClose}
          classes={{
            paper: classes.drawerPaper
            }}
          >
 #####  And last,  added clear button
         ```javascript
            <Button disabled={ !this.props.deadline }
                    variant='contained' 
                    color='primary'
                    className={ classes.clearButton}
                    onClick={this.handleClearDeadline}
                  >
                    <FormattedMessage id='task.deadline.button.clear' defaultMessage='Clear date' />
                  </Button>
                  
 #### 3. In **In taskActions**  Modified updateTask action to handle deadline clearing:
         ```javascript
          else if ('deadline' in task && task.deadline === null) {
             dispatch(addNotification('actions.task.deadline.clear'))
              dispatch(updateTaskSuccess())
            }
### Translation Updates
#### Added new message IDs:
1. In `messages.js`:
```javascript
notificationTaskDeadlineClear: {
  id: 'actions.task.deadline.clear',
  defaultMessage: 'Deadline has been removed'
}
2.en.json
{
  "actions.task.deadline.clear": "Deadline has been removed"
}
## Screenshots
Include any relevant screenshots or images to showcase the changes made.

![cleardate](https://github.com/user-attachments/assets/14958e0b-73ae-4063-b2de-b5a3f6d8b7c0.png)

## Checklist
- [ ] Code has been tested and works as intended
- [ ] Properly documented code
- [ ] Follows coding standards and guidelines
- [ ] All tests pass
- [ ] No conflicts with current codebase
- [ ] Code has been reviewed by at least one other team member

## Related Issues
Link any related issues that this pull request addresses.

## Additional Notes
Include any additional notes or information that may be relevant to this pull request.

## Contributor Guidelines
Please ensure that your pull request follows the guidelines outlined in the project's [CONTRIBUTING.md](https://github.com/<username>/<repository>/blob/master/CONTRIBUTING.md) file.

Thank you for your contribution!

[alexanmtz]

Great @RemyaManoharan , can you add a screenshot of how it looks like?

[alexanmtz]

And add on the description which issue this solves, like:

solves #1132

[alexanmtz]

Hello @RemyaManoharan, I tested your PR, and there are some adjustments we need to address before releasing it.

• It's interesting to see a partial drawer coming from the bottom, but let's make this one like the others, so take a look in on the one for payments, which comes from the left and with full height
• When you set the date, the buttons lose their alignment
• If I set a date and save, then I refresh the screen, and I edit the date, it should come with the current date, and it's not working in this case
• The date suggestions are misaligned
• There's no space between the buttons

So, let's fix those, and then we can proceed. Feel free to let me know if you need any help.