Routines Now Have Days

Fecit has a routine feature. You register things you want to do every day on a timeline, and each morning they automatically become tasks. Wake up, exercise, read — that kind of thing.

But not many people do the exact same thing every single day. Monday-Wednesday-Friday is for working out, Tuesday-Thursday for studying English, Saturday for cleaning. People need different routines for different days.

Daily and Weekly

The existing routines were Daily — same time, same task, every day. We added Weekly. You pick a day, and the routine repeats only on that day.

We put Daily / Weekly tabs at the top of the screen. We initially built it as a modal, but tapping to open, selecting, then closing felt cumbersome. We switched to tabs. There’s no reason to require two taps for something that needs one.

Day Tabs

When you select Weekly, day tabs appear: ALL, Mon, Tue, Wed, Thu, Fri, Sat, Sun. Tap a day and you see only that day’s timeline.

The single-day view is almost identical to Daily. A 24-hour timeline with blocks, long-press to create, drag to move, grab edges to resize. The only difference is that routines created here automatically get a day attached.

The Full Week

Tap ALL and you see the entire week in one screen. Seven day columns side by side, each showing that day’s routines as blocks.

Seven columns on a phone screen means small blocks. We hid the star icon and time text, leaving only the title in a smaller font. Even when it’s cramped, you should be able to tell “there’s something in this time slot.”

Drag to Change Days

In the ALL view, dragging a block horizontally moves it to a different day. Drag Wednesday’s workout to Thursday and it becomes a Thursday routine.

Vertical drag changes the time. Horizontal drag changes the day. Both work simultaneously — drag diagonally and both the time and day change.

We added horizontal drag support to the existing timeline block component. An enableHorizontalDrag flag controls it — when on, X-axis movement is tracked too. When the drag ends, we divide the X distance by the column width to figure out how many columns it moved.

Daily Routines in the Background

In the weekly routines, Daily routines appear as semi-transparent backgrounds. You can see where your everyday routines sit while placing day-specific ones on top.

The backgrounds must not intercept touches. You should be able to long-press on top of a background block to create a new routine. We set pointerEvents="none" so touch events pass right through. A small setting, but noticeable when missing.

The Detours

Passing the day information around took some fumbling. When you long-press to create a new routine, the registration screen needs to know which day was pressed.

We tried passing it through a Jotai atom, but the registration screen couldn’t read the value. Route params didn’t work either. We ended up reading the atom value directly at the moment of the API call. It’s a workaround we haven’t fully diagnosed, which is a bit uncomfortable, but it works.

The server needed changes too. The day field was originally defined as a list (list[int]), but the database model expected a single enum. The registration API kept returning 422 errors, and it took a while to realize the type mismatch was the cause. We unified the day field to a single value on both server and client, and that fixed it.

A Name Change

“Daily Routine” no longer fit since it’s not just daily anymore. We renamed it to just “Routine.” When the scope gets wider, the name should too.

What’s Next

Routines are essentially timetables. When to do what. Daily is a day’s timetable, Weekly is a week’s timetable.

Next, we’re thinking about tracking completion rates. Registering routines means nothing if you don’t do them. How many did you complete today, how many this week. When those numbers accumulate, that’s when habits form.