A Null Priority Bug Between UI, Database, and Zod

While working on FocusYar, I found a bug when editing a Task without a priority.

I created a Task with only a title, so the database stored:

priority: null

Later, when I opened the edit form and left priority empty, I got:

There is nothing task

The problem

In my Zod schema, I was checking for undefined:

priority: z.preprocess(
  (value) => (value === undefined ? "" : value),
  z.enum(["LOW", "MEDIUM", "HIGH", "URGENT"]).optional(),
),

But the actual value coming from the database was null.

At first, I changed the condition to "", but it didn't solve the problem.

The solution

I checked the complete data flow:

UI → Database → Zod → Server Action

Then I found the same field in my edit schema and changed the check from undefined to null:

priority: z.preprocess(
  (value) => (value === null ? "" : value),
  z.enum(["LOW", "MEDIUM", "HIGH", "URGENT"]).optional(),
),

What I learned

When debugging optional fields, I should check the actual value at every layer.

undefined, null, and "" are not the same.

Sometimes the bug isn't in the UI or database alone.
It can be caused by how the value moves between different layers of the application.