Hugging Face's logo

Spaces:
devarshia5
/
pmtool
Sleeping

App Files Community
pmtool
File size: 4,605 Bytes
d97b8f9
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
import React, { useEffect, useState } from "react";
import { useNavigate, useParams, Link } from "react-router-dom";
import { tasksApi, Task } from "@/services/tasksApi";
import { TaskForm } from "@/components/tasks/TaskForm";
import TaskTimeLogCard from "@/components/tasks/TaskTimeLogCard";
import Layout from "@/components/layout/layout";
import { toast } from "sonner";
import { ChevronRight, Home } from "lucide-react";
import { issuesApi } from "@/lib/api";

// Extend Task interface to include projectId
interface ExtendedTask extends Task {
  projectId?: number | null;
}

const EditTaskPage = () => {
  const navigate = useNavigate();
  const { id } = useParams();
  const [task, setTask] = useState<ExtendedTask | undefined>();
  const [isLoading, setIsLoading] = useState(false);

  useEffect(() => {
    if (id) {
      fetchTask();
    }
  }, [id]);

  const fetchTask = async () => {
    try {
      setIsLoading(true);
      const taskData = await tasksApi.getById(Number(id));
      if (taskData) {
        // Fetch the issue to get its project ID
        if (taskData.issuesId) {
          try {
            const issueData = await issuesApi.getById(taskData.issuesId);
            if (issueData) {
              // Create extended task with project ID from the issue
              const extendedTask: ExtendedTask = {
                ...taskData,
                projectId: issueData.projectId
              };
              setTask(extendedTask);
              return;
            }
          } catch (error) {
            console.error("Error fetching issue data:", error);
          }
        }
        // If we can't get the project ID, just use the task data
        setTask(taskData);
      }
    } catch (error) {
      console.error("Error fetching task:", error);
      toast.error("Failed to load task");
    } finally {
      setIsLoading(false);
    }
  };

  const handleSubmit = async (data: ExtendedTask) => {
    try {
      setIsLoading(true);
      // Remove projectId from the data before submitting to the API
      const { projectId, ...taskData } = data;
      await tasksApi.update(Number(id), taskData);
      toast.success("Task updated successfully");
      navigate("/tasks");
    } catch (error) {
      console.error("Error updating task:", error);
      toast.error("Failed to update task");
    } finally {
      setIsLoading(false);
    }
  };

  const handleCancel = () => {
    navigate("/tasks");
  };

  return (
    <Layout>

      <div className="space-y-6 animate-fadeIn">

        {/* Breadcrumb Navigation */}

        <nav className="flex items-center space-x-2 text-sm text-muted-foreground">

          <Link to="/" className="flex items-center hover:text-foreground transition-colors">

            <Home className="h-4 w-4 mr-1" />

            Home

          </Link>

          <ChevronRight className="h-4 w-4" />

          <Link to="/tasks" className="hover:text-foreground transition-colors">

            Tasks

          </Link>

          <ChevronRight className="h-4 w-4" />

          <span className="text-foreground font-medium">Edit Task</span>

        </nav>



        {/* Header Section */}

        <div className="flex flex-col gap-2">

          <div className="flex items-center justify-between">

            <div>

              <h1 className="text-3xl font-bold tracking-tight">

                Edit Task: {task?.title || ''}

              </h1>

              <p className="text-muted-foreground mt-1">

                Update the task details below

              </p>

            </div>

            <div className="flex items-center gap-2">

              <button

                onClick={handleCancel}

                className="px-4 py-2 text-sm font-medium text-muted-foreground hover:text-foreground transition-colors"

              >

                Cancel

              </button>

            </div>

          </div>

        </div>



        {/* Form Section */}

        <div className="bg-card rounded-lg border shadow-sm">

          <div className="p-6">

            <TaskForm

              task={task}

              onSubmit={handleSubmit}

              onCancel={handleCancel}

              isLoading={isLoading}

            />

          </div>

        </div>

        

        {/* Time Log Section - Only show when we have a valid task ID */}

        {task?.id && (

          <TaskTimeLogCard taskId={task.id} />

        )}

      </div>

    </Layout>
  );
};

export default EditTaskPage;