feat: add prayer frequency tracking with 1-7 slider and frequency compliance calculation

src/app/page.tsx

@@ -24,6 +24,8 @@ interface Prayer {
   prayFor?: string;
   answered?: boolean;
   answerDetails?: string;
+  prayFrequency?: number; // 1-7 times per week
+  lastPrayedFor?: string; // ISO date string
 }
 
 export default function Home() {
@@ -37,6 +39,7 @@ export default function Home() {
   const [prayFor, setPrayFor] = useState('');
   const [answered, setAnswered] = useState(false);
   const [answerDetails, setAnswerDetails] = useState('');
+  const [prayFrequency, setPrayFrequency] = useState(1); // 1-7 times per week
 
   const { user, loading: authLoading } = useAuth();
 
@@ -106,6 +109,8 @@ export default function Home() {
         prayFor: prayFor || undefined,
         answered,
         answerDetails: answerDetails || undefined,
+        prayFrequency,
+        lastPrayedFor: answered ? undefined : new Date().toISOString().split('T')[0],
       };
 
       if (editingPrayer) {
@@ -142,6 +147,7 @@ export default function Home() {
     setPrayFor(prayer.prayFor || '');
     setAnswered(prayer.answered || false);
     setAnswerDetails(prayer.answerDetails || '');
+    setPrayFrequency(prayer.prayFrequency || 1);
     setActiveTab('compose');
   };
 
@@ -221,6 +227,8 @@ export default function Home() {
           onAnsweredChange={setAnswered}
           answerDetails={answerDetails}
           onAnswerDetailsChange={setAnswerDetails}
+          prayFrequency={prayFrequency}
+          onPrayFrequencyChange={setPrayFrequency}
           onSubmit={handleSubmit}
           isEditing={!!editingPrayer}
         />

src/components/AnsweredPrayers.tsx

@@ -8,6 +8,8 @@ interface Prayer {
   prayFor?: string;
   answered?: boolean;
   answerDetails?: string;
+  prayFrequency?: number; // 1-7 times per week
+  lastPrayedFor?: string; // ISO date string
 }
 
 interface AnsweredPrayersProps {

src/components/DailyEntry.tsx

@@ -14,6 +14,8 @@ interface DailyEntryProps {
   onAnsweredChange?: (answered: boolean) => void;
   answerDetails?: string;
   onAnswerDetailsChange?: (details: string) => void;
+  prayFrequency?: number;
+  onPrayFrequencyChange?: (frequency: number) => void;
   onSubmit: (e: React.FormEvent) => void;
   loading?: boolean;
   isEditing?: boolean;
@@ -30,6 +32,8 @@ export default function DailyEntry({
   onAnsweredChange,
   answerDetails = '',
   onAnswerDetailsChange,
+  prayFrequency = 1,
+  onPrayFrequencyChange,
   onSubmit,
   loading = false,
   isEditing = false,
@@ -116,6 +120,28 @@ export default function DailyEntry({
             </label>
           </div>
 
+          {/* Prayer Frequency Slider */}
+          <div className="bg-slate-800/40 backdrop-blur-xl rounded-xl p-4 border border-slate-700/50">
+            <div className="mb-3">
+              <label className="block text-sm font-semibold text-slate-300 mb-2">📅 Pray For (times per week)</label>
+              <div className="flex items-center justify-between">
+                <input
+                  type="range"
+                  min="1"
+                  max="7"
+                  value={prayFrequency}
+                  onChange={(e) => onPrayFrequencyChange?.(parseInt(e.target.value))}
+                  className="flex-1 h-2 bg-slate-700 rounded-lg appearance-none cursor-pointer accent-blue-500"
+                />
+                <span className="ml-4 text-lg font-bold text-blue-400 min-w-[50px]">{prayFrequency}x</span>
+              </div>
+              <div className="flex justify-between text-xs text-slate-500 mt-2">
+                <span>1× week</span>
+                <span>Daily</span>
+              </div>
+            </div>
+          </div>
+
           {/* Answer Details */}
           {answered && (
             <div className="bg-green-900/20 backdrop-blur-xl rounded-xl p-4 border border-green-500/30 animate-in fade-in-50 duration-300">

src/components/HomePage.tsx

@@ -11,6 +11,8 @@ interface Prayer {
   prayFor?: string;
   answered?: boolean;
   answerDetails?: string;
+  prayFrequency?: number; // 1-7 times per week
+  lastPrayedFor?: string; // ISO date string
 }
 
 interface HomePageProps {
@@ -52,7 +54,23 @@ export default function HomePage({ prayers, todayCount, onStartPraying, onSelect
     return streak;
   };
   
+  // Calculate frequency compliance - how many active items being prayed for
+  const frequencyCompliance = () => {
+    const activePrayers = prayers.filter(p => !p.answered && p.prayFrequency);
+    if (activePrayers.length === 0) return 0;
+    
+    // Check today's date
+    const todayPrayers = prayers.filter(p => p.date === today);
+    return {
+      total: activePrayers.length,
+      prayedToday: activePrayers.filter(ap => 
+        todayPrayers.some(tp => tp.prayFor === ap.prayFor || tp.id === ap.id)
+      ).length,
+    };
+  };
+  
   const streak = calculateStreak();
+  const frequencyStats = frequencyCompliance();
   
   // Calculate more stats
   const avgPrayerLength = totalPrayers > 0 

src/components/ReflectionsList.tsx

@@ -9,6 +9,8 @@ interface Prayer {
   text: string;
   prayFor?: string;
   answered?: boolean;
+  prayFrequency?: number; // 1-7 times per week
+  lastPrayedFor?: string; // ISO date string
 }
 
 interface PrayerListProps {

src/components/ThingsToPrayFor.tsx

@@ -10,6 +10,8 @@ interface Prayer {
   prayFor?: string;
   answered?: boolean;
   answerDetails?: string;
+  prayFrequency?: number; // 1-7 times per week
+  lastPrayedFor?: string; // ISO date string
 }
 
 interface ThingsToPrayForProps {
@@ -89,13 +91,35 @@ export default function ThingsToPrayFor({ prayers, onEdit }: ThingsToPrayForProp
                             <p className="text-base text-slate-200 group-hover:text-white line-clamp-3">
                               {prayer.text}
                             </p>
-                            <div className="mt-3 flex items-center justify-between text-xs">
-                              <span className="text-slate-500">
-                                {daysAgo === 0 ? 'Today' : daysAgo === 1 ? 'Yesterday' : `${daysAgo} days ago`}
-                              </span>
-                              <span className="text-blue-400 opacity-0 group-hover:opacity-100 transition-opacity">
-                                Edit & Mark Answered →
-                              </span>
+                            <div className="mt-3 space-y-2">
+                              <div className="flex items-center justify-between text-xs">
+                                <span className="text-slate-500">
+                                  {daysAgo === 0 ? 'Today' : daysAgo === 1 ? 'Yesterday' : `${daysAgo} days ago`}
+                                </span>
+                                <span className="text-blue-400 opacity-0 group-hover:opacity-100 transition-opacity">
+                                  Edit →
+                                </span>
+                              </div>
+                              {prayer.prayFrequency && (
+                                <div className="flex items-center gap-2">
+                                  <div className="text-xs font-semibold text-amber-400">Pray:</div>
+                                  <div className="flex gap-1">
+                                    {Array.from({ length: prayer.prayFrequency }).map((_, i) => (
+                                      <div
+                                        key={i}
+                                        className="w-2 h-2 rounded-full bg-amber-400/60"
+                                      />
+                                    ))}
+                                    {Array.from({ length: 7 - prayer.prayFrequency }).map((_, i) => (
+                                      <div
+                                        key={`empty-${i}`}
+                                        className="w-2 h-2 rounded-full bg-slate-600/40"
+                                      />
+                                    ))}
+                                  </div>
+                                  <span className="text-xs text-slate-400">× per week</span>
+                                </div>
+                              )}
                             </div>
                           </div>
                         </div>