tpl-index.php:

          $.ajax({
            url : "process/ajax_Handler.php",
            method : "POST", 
            data : {"action" : "add_folder" , "name" : input.val()},
            success : function(response){
              if (response > 0) {
                const folderId = response; 
                const folderName = input ? input.val() : "Unnamed Folder";
                const listItem = `
                    <li>
                        <a href="?folder_id=${folderId}" style="text-decoration: none; color: #1f6674;">
                            <i class="fa fa-folder"></i> ${folderName}
                        </a>
                        <a href="?delete_folder=${folderId}" class="trash">
                            <i class="fa fa-trash-o trash"></i>
                        </a>
                    </li>`;
                $(listItem).appendTo("ul.folder-list");
            }
            } 
          });

lib-task.php:

function addFolder($folder_name){
    global $conn;
    $query = "INSERT INTO folders (name,user_id) VALUES (:folder_name,:user_id)";
    $stmt = $conn->prepare($query);
    $stmt->execute([':folder_name'=>$folder_name,':user_id' => 1]);
    return $conn->lastInsertId();
}

ajax_handler.php:

switch($_POST["action"]){
    case "add_folder":
        if(!isset($_POST["name"]) && empty($_POST["name"])){
            echo "فیلد را پر کنید";
            die();
        }
       echo addFolder($_POST["name"]);
    break;
    default : 
    diePage("invalid Action!!");
}