Dev

[abhishek-nexgen-dev]

No description provided.

[gemini-code-assist]

Code Review

This pull request introduces a comprehensive Task Management system, including full CRUD functionality, a submission and review workflow, and advanced filtering and search capabilities. The implementation covers new pages, hooks, and a suite of reusable UI components like Avatars, Modals, and Toasts, alongside significant updates to the global design tokens and theme configuration. Feedback focuses on improving the robustness of the system by using more reliable unique ID and color generation methods to avoid collisions. Additionally, there are recommendations to enhance accessibility through semantic HTML, improve error handling in asynchronous operations, and optimize React rendering by removing unnecessary timeouts in validation logic.

[gemini-code-assist]

The color generation logic only considers the first two characters of the name, which leads to frequent color collisions for different names (e.g., "John" and "Joe" would get the same color). A more robust approach is to hash the entire string.

Suggested change

	function getColor(name: string): string {
	const code = name.charCodeAt(0) + (name.charCodeAt(1) || 0);
	return BG_COLORS[code % BG_COLORS.length];
	}
	function getColor(name: string): string {
	const code = name.split("").reduce((acc, char) => acc + char.charCodeAt(0), 0);
	return BG_COLORS[code % BG_COLORS.length];
	}

[gemini-code-assist]

The handleSubmit function calls mutateAsync without a try-catch block. If the network request fails, the error won't be caught locally to display a meaningful message to the user via the setError state, and it might result in an unhandled promise rejection.

  const handleSubmit = async () => {
    if (!text.trim()) { setError("Comment cannot be empty."); return; }
    setError("");
    try {
      await addComment.mutateAsync({ taskId, text: text.trim() });
      setText("");
    } catch (err) {
      setError("Failed to post comment. Please try again.");
    }
  };

[gemini-code-assist]

Using a div with an onClick handler for a toggle action is not accessible to screen readers or keyboard users. It should be replaced with a semantic button with appropriate ARIA attributes.

            <button
              type="button"
              role="switch"
              aria-checked={useScore}
              onClick={() => setUseScore((v) => !v)}
              className="relative w-8 h-4 rounded-full transition-colors"
              style={{ backgroundColor: useScore ? "var(--cd-primary)" : "var(--cd-surface-3)" }}>
              <span className={`absolute top-0.5 w-3 h-3 bg-white rounded-full shadow transition-transform ${useScore ? "translate-x-4" : "translate-x-0.5"}`} />
            </button>

[gemini-code-assist]

The use of setTimeout with a delay of 0 inside useEffect is unnecessary for validation logic in React 18+ and can lead to redundant render cycles. State updates are already batched.

    setErrors(validate({ eventId, title, description, assignedTo, deadline, points: points === "" ? undefined : Number(points) }));

[gemini-code-assist]

Using Date.now() for ID generation is prone to collisions if multiple items are created in rapid succession. It is safer to use crypto.randomUUID() for unique identifiers.

Suggested change

	id: `task-${Date.now()}`,
	id: crypto.randomUUID(),