salat 5.0.0 → 5.0.1

package/dist/components/ProgressBar.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from "ink";
+export const ProgressBar = ({ progress, width }) => {
+    const filledWidth = Math.max(0, Math.min(width, Math.round(progress * width)));
+    const emptyWidth = width - filledWidth;
+    return (_jsxs(Box, { children: [_jsx(Text, { color: "green", children: "█".repeat(filledWidth) }), _jsx(Text, { color: "gray", children: "░".repeat(emptyWidth) })] }));
+};

package/dist/components/RamadanInfo.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ProgressBar } from "#components/ProgressBar";
+import { Box, Text } from "ink";
+export const RamadanInfo = ({ data }) => {
+    if (!data)
+        return null;
+    if (data.type === "fasting") {
+        return (_jsxs(Box, { flexDirection: "column", alignItems: "center", children: [_jsx(Text, { bold: true, color: "yellow", children: "\u231B Iftar Progress" }), _jsx(Box, { marginTop: 1, children: _jsx(ProgressBar, { progress: data.progress, width: 50 }) }), _jsxs(Box, { justifyContent: "space-between", width: 50, children: [_jsx(Text, { color: "gray", dimColor: true, children: "Fajr" }), _jsxs(Box, { children: [_jsxs(Text, { color: "yellow", bold: true, children: [Math.round(data.progress * 100), "%"] }), _jsx(Text, { color: "gray", children: " to Maghrib" })] }), _jsx(Text, { color: "gray", dimColor: true, children: "Iftar" })] })] }));
+    }
+    return (_jsxs(Box, { flexDirection: "column", alignItems: "center", children: [_jsx(Text, { bold: true, color: "yellow", children: "\uD83C\uDF19 Time to Imsak (Suhoor ends)" }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { color: "yellow", bold: true, children: data.timeLeft }) }), _jsx(Text, { dimColor: true, color: "gray", children: "until fast begins" })] }));
+};

package/dist/components/TimesApp.js

@@ -1,18 +1,15 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { ProgressBar } from "#components/ProgressBar";
+import { RamadanInfo } from "#components/RamadanInfo";
 import { useHijriDate } from "#hooks/useHijriDate";
 import { usePrayerTimes } from "#hooks/usePrayerTimes";
-import { getImsakTime, getNextPrayer, tConv24 } from "#services/utils/time";
-import { differenceInSeconds, format, parse, subDays } from "date-fns";
+import { getImsakTime, getNextPrayer, getPrayerProgress, getRamadanData, tConv24 } from "#services/utils/time";
+import { format } from "date-fns";
 import { Box, Text, useApp, useInput } from "ink";
 import { useEffect, useState } from "react";
-const ProgressBar = ({ progress, width, }) => {
-    const filledWidth = Math.max(0, Math.min(width, Math.round(progress * width)));
-    const emptyWidth = width - filledWidth;
-    return (_jsxs(Box, { children: [_jsx(Text, { color: "green", children: "█".repeat(filledWidth) }), _jsx(Text, { color: "gray", children: "░".repeat(emptyWidth) })] }));
-};
 const App = ({ cityNameArg, once, onReset }) => {
     const { exit } = useApp();
-    const { prayerTimes, error, loading, resolvedCityName } = usePrayerTimes({
+    const { prayerTimes, tomorrowTimes, error, loading, resolvedCityName } = usePrayerTimes({
         cityNameArg,
     });
     const { hijriDate } = useHijriDate();
@@ -47,23 +44,9 @@ const App = ({ cityNameArg, once, onReset }) => {
         return (_jsx(Box, { padding: 1, children: _jsx(Text, { color: "red", bold: true, children: "Could not fetch prayer times." }) }));
     }
     const nextPrayerData = getNextPrayer(prayerTimes, currentTime);
-    // Calculate progress
-    const prayerOrder = ["Fajr", "Chorouq", "Dhuhr", "Asr", "Maghrib", "Ishae"];
-    const nextIndex = prayerOrder.indexOf(nextPrayerData.prayer);
-    const prevIndex = (nextIndex - 1 + prayerOrder.length) % prayerOrder.length;
-    const prevPrayerName = prayerOrder[prevIndex];
-    let prevDate = parse(prayerTimes[prevPrayerName], "HH:mm", currentTime);
-    let nextDate = parse(nextPrayerData.time, "HH:mm", currentTime);
-    if (nextPrayerData.prayer === "Fajr" && currentTime.getHours() >= 12) {
-        nextDate = parse(nextPrayerData.time, "HH:mm", new Date(currentTime.getTime() + 24 * 60 * 60 * 1000));
-    }
-    else if (nextPrayerData.prayer === "Fajr" && currentTime.getHours() < 12) {
-        prevDate = subDays(parse(prayerTimes.Ishae, "HH:mm", currentTime), 1);
-    }
-    const totalSeconds = differenceInSeconds(nextDate, prevDate);
-    const elapsedSeconds = differenceInSeconds(currentTime, prevDate);
-    const progress = Math.max(0, Math.min(1, elapsedSeconds / totalSeconds));
-    return (_jsxs(Box, { flexDirection: "column", paddingX: 2, paddingY: 1, borderStyle: "round", borderColor: "green", width: 60, children: [_jsxs(Box, { flexDirection: "column", alignItems: "center", gap: 1, children: [_jsx(Box, { borderStyle: "single", borderColor: "green", children: _jsxs(Text, { bold: true, color: "green", children: ["\uD83C\uDDF2\uD83C\uDDE6 ", resolvedCityName, ", Morocco \uD83C\uDDF2\uD83C\uDDE6"] }) }), _jsx(Box, { marginTop: 1, children: _jsxs(Text, { color: "white", bold: true, children: ["\uD83D\uDCC5  ", format(currentTime, "EEEE, MMMM do yyyy")] }) }), hijriDate && (_jsxs(Text, { color: "gray", dimColor: true, children: ["\uD83D\uDD4C ", hijriDate] }))] }), _jsx(Box, { flexDirection: "column", marginY: 1, children: Object.entries({
+    const progress = getPrayerProgress(prayerTimes, currentTime, nextPrayerData.prayer);
+    const ramadanData = getRamadanData(prayerTimes, tomorrowTimes, currentTime);
+    return (_jsxs(Box, { flexDirection: "column", paddingX: 2, paddingY: 1, borderStyle: "round", borderColor: "green", width: 60, children: [_jsxs(Box, { flexDirection: "column", alignItems: "center", gap: 1, children: [_jsx(Box, { borderStyle: "single", borderColor: "green", children: _jsxs(Text, { bold: true, color: "green", children: ["\uD83C\uDDF2\uD83C\uDDE6 ", resolvedCityName, ", Morocco \uD83C\uDDF2\uD83C\uDDE6"] }) }), _jsx(Box, { marginTop: 1, children: _jsxs(Text, { color: "white", bold: true, children: ["\uD83D\uDCC5  ", format(currentTime, "EEEE, MMMM do yyyy")] }) }), hijriDate && (_jsxs(Text, { color: "gray", dimColor: true, children: ["\uD83D\uDD4C ", hijriDate] }))] }), _jsx(Box, { flexDirection: "column", alignItems: "center", marginY: 1, padding: 1, borderStyle: "single", borderColor: "yellow", children: _jsx(RamadanInfo, { data: ramadanData }) }), _jsx(Box, { flexDirection: "column", marginY: 1, children: Object.entries({
                     "Imsak *": getImsakTime(prayerTimes.Fajr),
                     ...prayerTimes,
                 }).map(([prayer, time]) => {

package/dist/components/TimesApp.test.js

@@ -30,6 +30,7 @@ describe("TimesApp", () => {
     it("should render loading state", () => {
         vi.mocked(usePrayerTimes).mockReturnValue({
             prayerTimes: null,
+            tomorrowTimes: null,
             error: null,
             loading: true,
             resolvedCityName: "Marrakech",
@@ -40,6 +41,7 @@ describe("TimesApp", () => {
     it("should render error state", () => {
         vi.mocked(usePrayerTimes).mockReturnValue({
             prayerTimes: null,
+            tomorrowTimes: null,
             error: "Failed to fetch",
             loading: false,
             resolvedCityName: "",
@@ -50,6 +52,7 @@ describe("TimesApp", () => {
     it("should render null prayerTimes state", () => {
         vi.mocked(usePrayerTimes).mockReturnValue({
             prayerTimes: null,
+            tomorrowTimes: null,
             error: null,
             loading: false,
             resolvedCityName: "",
@@ -68,6 +71,7 @@ describe("TimesApp", () => {
         };
         vi.mocked(usePrayerTimes).mockReturnValue({
             prayerTimes: mockPrayerTimes,
+            tomorrowTimes: null,
             error: null,
             loading: false,
             resolvedCityName: "Marrakech",
@@ -77,4 +81,52 @@ describe("TimesApp", () => {
         expect(lastFrame()).toContain("Fajr");
         expect(lastFrame()).toContain("05:00 AM");
     });
+    it("should render Iftar progress when fasting", () => {
+        const mockPrayerTimes = {
+            Fajr: "05:00",
+            Chorouq: "06:30",
+            Dhuhr: "12:30",
+            Asr: "15:45",
+            Maghrib: "18:20",
+            Ishae: "19:50",
+        };
+        // Use a fixed date for the test
+        const mockNow = new Date("2026-02-18T12:00:00");
+        vi.setSystemTime(mockNow);
+        vi.mocked(usePrayerTimes).mockReturnValue({
+            prayerTimes: mockPrayerTimes,
+            tomorrowTimes: mockPrayerTimes,
+            error: null,
+            loading: false,
+            resolvedCityName: "Marrakech",
+        });
+        const { lastFrame } = render(_jsx(TimesApp, {}));
+        expect(lastFrame()).toContain("Iftar Progress");
+        // (12:00 - 05:00) / (18:20 - 05:00) = 7h / 13h 20m = 420m / 800m = 0.525 = 53%
+        expect(lastFrame()).toContain("53%");
+    });
+    it("should render Time to Imsak when not fasting (after Maghrib)", () => {
+        const mockPrayerTimes = {
+            Fajr: "05:00",
+            Chorouq: "06:30",
+            Dhuhr: "12:30",
+            Asr: "15:45",
+            Maghrib: "18:20",
+            Ishae: "19:50",
+        };
+        // Use a fixed date for the test (9:00 PM)
+        const mockNow = new Date("2026-02-18T21:00:00");
+        vi.setSystemTime(mockNow);
+        vi.mocked(usePrayerTimes).mockReturnValue({
+            prayerTimes: mockPrayerTimes,
+            tomorrowTimes: mockPrayerTimes, // Tomorrow's Fajr 05:00 -> Imsak 04:50
+            error: null,
+            loading: false,
+            resolvedCityName: "Marrakech",
+        });
+        const { lastFrame } = render(_jsx(TimesApp, {}));
+        expect(lastFrame()).toContain("Time to Imsak");
+        // From 21:00 to 04:50 is 7 hours and 50 minutes
+        expect(lastFrame()).toContain("07:50:00");
+    });
 });

package/dist/hooks/usePrayerTimes.js

@@ -3,21 +3,26 @@ import { getCityId, getCityName } from "#services/utils/city";
 import { useQuery } from "@tanstack/react-query";
 import citiesData from "../data/cities.json" with { type: "json" };
 const cities = citiesData;
+import { addDays } from "date-fns";
 export const usePrayerTimes = ({ cityNameArg }) => {
     const resolvedCityName = getCityName(cityNameArg, cities);
     const query = useQuery({
         queryKey: ["prayerTimes", resolvedCityName],
         queryFn: async () => {
-            // Fetch fresh data
             const cityId = getCityId(resolvedCityName, cities);
-            const data = await getData(cityId);
-            return data;
+            const now = new Date();
+            const [today, tomorrow] = await Promise.all([
+                getData(cityId, now),
+                getData(cityId, addDays(now, 1)),
+            ]);
+            return { today, tomorrow };
         },
         staleTime: 1000 * 60 * 60 * 24, // 24 hours
         gcTime: 1000 * 60 * 60 * 24, // garbage collection after 24 hours
     });
     return {
-        prayerTimes: query.data ?? null,
+        prayerTimes: query.data?.today ?? null,
+        tomorrowTimes: query.data?.tomorrow ?? null,
         error: query.error?.message ?? null,
         loading: query.isPending,
         resolvedCityName,

package/dist/services/utils/api.js

@@ -1,8 +1,8 @@
 import { PRIERE_API_URL } from "#services/constants";
 // import fetch from "node-fetch";
-export const getData = async (cityId) => {
-    const day = new Date().getDate();
-    const month = new Date().getMonth() + 1;
+export const getData = async (cityId, date = new Date()) => {
+    const day = date.getDate();
+    const month = date.getMonth() + 1;
     const url = PRIERE_API_URL(cityId, day, month);
     const response = await fetch(url);
     const data = (await response.json());

package/dist/services/utils/time.js

@@ -1,4 +1,4 @@
-import { addDays, format, intervalToDuration, parse, subMinutes } from "date-fns";
+import { addDays, differenceInSeconds, format, intervalToDuration, parse, subDays, subMinutes } from "date-fns";
 export function tConv24(time24) {
     const date = parse(time24, "HH:mm", new Date());
     return format(date, "hh:mm a");
@@ -29,3 +29,50 @@ export function getNextPrayer(prayerTimes, now) {
         timeLeft,
     };
 }
+export function getPrayerProgress(prayerTimes, currentTime, nextPrayer) {
+    const prayerOrder = ["Fajr", "Chorouq", "Dhuhr", "Asr", "Maghrib", "Ishae"];
+    const nextIndex = prayerOrder.indexOf(nextPrayer);
+    const prevIndex = (nextIndex - 1 + prayerOrder.length) % prayerOrder.length;
+    const prevPrayerName = prayerOrder[prevIndex];
+    let prevDate = parse(prayerTimes[prevPrayerName], "HH:mm", currentTime);
+    let nextDate = parse(prayerTimes[nextPrayer], "HH:mm", currentTime);
+    if (nextPrayer === "Fajr" && currentTime.getHours() >= 12) {
+        nextDate = addDays(nextDate, 1);
+    }
+    else if (nextPrayer === "Fajr" && currentTime.getHours() < 12) {
+        prevDate = subDays(parse(prayerTimes.Ishae, "HH:mm", currentTime), 1);
+    }
+    const totalSeconds = differenceInSeconds(nextDate, prevDate);
+    const elapsedSeconds = differenceInSeconds(currentTime, prevDate);
+    const progress = Math.max(0, Math.min(1, elapsedSeconds / totalSeconds));
+    return progress;
+}
+export function getRamadanData(prayerTimes, tomorrowTimes, currentTime) {
+    const fajrToday = parse(prayerTimes.Fajr, "HH:mm", currentTime);
+    const maghribToday = parse(prayerTimes.Maghrib, "HH:mm", currentTime);
+    const isFasting = currentTime >= fajrToday && currentTime < maghribToday;
+    if (isFasting) {
+        const totalFastingSeconds = differenceInSeconds(maghribToday, fajrToday);
+        const elapsedFastingSeconds = differenceInSeconds(currentTime, fajrToday);
+        const fastingProgress = Math.max(0, Math.min(1, elapsedFastingSeconds / totalFastingSeconds));
+        return { type: "fasting", progress: fastingProgress };
+    }
+    if (tomorrowTimes) {
+        let nextImsakDate;
+        const imsakStr = getImsakTime(prayerTimes.Fajr);
+        const todayImsak = parse(imsakStr, "HH:mm", currentTime);
+        if (currentTime < todayImsak) {
+            nextImsakDate = todayImsak;
+        }
+        else {
+            const tomorrowImsakStr = getImsakTime(tomorrowTimes.Fajr);
+            nextImsakDate = parse(tomorrowImsakStr, "HH:mm", addDays(currentTime, 1));
+        }
+        const duration = intervalToDuration({ start: currentTime, end: nextImsakDate });
+        const timeLeft = [duration.hours, duration.minutes, duration.seconds]
+            .map((v) => String(v ?? 0).padStart(2, "0"))
+            .join(":");
+        return { type: "imsak", timeLeft };
+    }
+    return null;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "salat",
-  "version": "5.0.0",
+  "version": "5.0.1",
   "imports": {
     "#*": "./dist/*.js"
   },