fix(todo): streamline button click handling and improve UI feedback

- Simplified the button click handling logic in todo.js by removing redundant code and improving readability.
- Enhanced the user interface feedback for important task toggling and deletion confirmation.
- Added autocomplete="on" to the task input field in index.html for better user experience.
- Removed redundant class addition in the todo item creation process.

web/recon_note/static/note/js/todo.js

@@ -52,16 +52,13 @@ function populateTodofunction(project=null){
   });
 
   const $btns = $('.list-actions').click((event) => {
-    if (this.id === 'all-list') {
-      const $el = $('.' + this.id).fadeIn();
-      $('#ct > div').not($el).hide();
-    } else {
-      const $el = $('.' + this.id).fadeIn();
-      $('#ct > div').not($el).hide();
-    }
+    const selectedId = event.currentTarget.id;
+    const $el = $('.' + selectedId);
+    $('#ct > div').hide();
+    $el.fadeIn();
     $btns.removeClass('active');
     $(event.currentTarget).addClass('active');
-  })
+  });
 
   checkCheckbox();
   importantDropdown();
@@ -87,7 +84,7 @@ function populateTodofunction(project=null){
       let data = {
         'title': $_task,
         'description': $_taskDescriptionText
-      }
+      };
 
       if ($("#scanHistoryIDropdown").val() && $("#scanHistoryIDropdown").val() != 'Choose Scan History...') {
         data['scan_history'] = parseInt($("#scanHistoryIDropdown").val());
@@ -233,7 +230,7 @@ function deleteDropdown() {
   $('.action-dropdown .dropdown-menu .delete.dropdown-item').click(async function() {
     const id = this.id.split('_')[1];
     const main_this = this;
-    const result = await swal.queue([{
+    await swal.queue([{
       title: 'Are you sure you want to delete this Recon Note?',
       text: "You won't be able to revert this!",
       icon: 'warning',
@@ -325,11 +322,12 @@ function importantDropdown() {
       is_important_badge.innerHTML = badge;
 
       $(this).parents('.todo-item').find('.todo-content').after(is_important_badge);
+      $(this).text('Remove Important');
     }
     else if($(this).parents('.todo-item').hasClass('todo-task-important')){
       $(this).parents('.todo-item').removeClass('todo-task-important');
-      $(".list-actions#all-list").trigger('click');
-      $("#important-badge-"+badge_id).empty();
+      $("#important-badge-"+badge_id).remove();
+      $(this).text('Toggle Important');
     }
     new dynamicBadgeNotification('importantList');
     await fetch('/recon_note/flip_important_status', {

web/recon_note/templates/note/index.html

@@ -84,7 +84,7 @@ <h5 class="task-heading"></h5>
           <div class="compose-content" id="addTaskModalTitle">
             <h5 class="">Add Todo</h5>
             <form>
-              <input id="task" type="text" placeholder="Todo Title" class="form-control" name="task" required minlength="3" maxlength="100" pattern="[A-Za-z0-9\s\-\_\.]+" title="Only alphanumeric characters, hyphens, underscores, and periods are allowed.">
+              <input id="task" type="text" placeholder="Todo Title" class="form-control" name="task" required minlength="3" maxlength="100" pattern="[A-Za-z0-9\s\-\_\.]+" title="Only alphanumeric characters, hyphens, underscores, and periods are allowed." autocomplete="on">
               <div class="mt-2">
                 <label for="scanHistoryIDropdown" class="form-label">Select Scan History (Optional)</label>
                 <select class="w-100 form-control" id="scanHistoryIDropdown" data-toggle="select2" data-width="100%">
@@ -187,7 +187,7 @@ <h5 class="todo-heading">{title}</h5>
     var todo_item = document.createElement("div");
     todo_item.classList.add("todo-item");
     todo_item.classList.add("all-list");
-    todo_item.classList.add("todo-item"); // Add the special class
+    todo_item.classList.add("todo-item");
     var target_text = '';
     if (note_obj['domain_name']) {
       target_text += 'Domain: ' + note_obj['domain_name'] + ', Scanned ' + moment.utc(note_obj['scan_started_time']).fromNow();