fix: resolved navigator undefined error

components/AddEditHabitModal.tsx

@@ -52,6 +52,7 @@ export default function AddEditHabitModal({ onClose, onSave, habit, isTask }: Ad
   const [ruleText, setRuleText] = useState<string>(initialRuleText)
   const { currentUser } = useHelpers()
   const [isQuickDatesOpen, setIsQuickDatesOpen] = useState(false)
+  const [ruleError, setRuleError] = useState<string | null>(null); // State for validation message
   const [selectedUserIds, setSelectedUserIds] = useState<string[]>((habit?.userIds || []).filter(id => id !== currentUser?.id))
   const [usersData] = useAtom(usersAtom)
   const users = usersData.users
@@ -93,8 +94,6 @@ export default function AddEditHabitModal({ onClose, onSave, habit, isTask }: Ad
     })
   }
 
-  const { result, message: errorMessage } = convertHumanReadableFrequencyToMachineReadable({ text: ruleText, timezone: settings.system.timezone, isRecurring: isRecurRule });
-
   return (
     <Dialog open={true} onOpenChange={onClose}>
       <DialogContent>
@@ -204,9 +203,24 @@ export default function AddEditHabitModal({ onClose, onSave, habit, isTask }: Ad
               </div>
               {/* rrule input (habit) */}
               <div className="col-start-2 col-span-3 text-sm">
-                <span className={errorMessage ? 'text-destructive' : 'text-muted-foreground'}>
+                {(() => {
-                  {errorMessage ? errorMessage : convertMachineReadableFrequencyToHumanReadable({ frequency: result, isRecurRule, timezone: settings.system.timezone })}
+                  let displayText = '';
-                </span>
+                  let errorMessage: string | null = null;
+                  const { result, message } = convertHumanReadableFrequencyToMachineReadable({ text: ruleText, timezone: settings.system.timezone, isRecurring: isRecurRule });
+                  errorMessage = message;
+                  displayText = convertMachineReadableFrequencyToHumanReadable({ frequency: result, isRecurRule, timezone: settings.system.timezone })
+
+                  return (
+                    <>
+                      <span className={errorMessage ? 'text-destructive' : 'text-muted-foreground'}>
+                        {displayText}
+                      </span>
+                      {errorMessage && (
+                        <p className="text-destructive text-xs mt-1">{errorMessage}</p>
+                      )}
+                    </>
+                  );
+                })()}
               </div>
             </div>
             <div className="grid grid-cols-4 items-center gap-4">
@@ -324,7 +338,7 @@ export default function AddEditHabitModal({ onClose, onSave, habit, isTask }: Ad
             )}
           </div>
           <DialogFooter>
-            <Button type="submit" disabled={errorMessage !== null}>{habit ? 'Save Changes' : `Add ${isTask ? 'Task' : 'Habit'}`}</Button>
+            <Button type="submit">{habit ? 'Save Changes' : `Add ${isTask ? 'Task' : 'Habit'}`}</Button>
           </DialogFooter>
         </form>
       </DialogContent>

lib/client-helpers.ts

@@ -1,9 +1,8 @@
 // client helpers
 'use-client'
 
-import { useSession } from "next-auth/react"
-import { User, UserId } from './types'
 import { useAtom } from 'jotai'
+import { useSession } from "next-auth/react"
 import { usersAtom } from './atoms'
 import { checkPermission } from './utils'
 
@@ -14,7 +13,7 @@ export function useHelpers() {
   const currentUser = usersData.users.find((u) => u.id === currentUserId)
   // detect iOS: https://stackoverflow.com/a/9039885
   function iOS() {
-    return [
+    return typeof navigator !== "undefined" && ([
       'iPad Simulator',
       'iPhone Simulator',
       'iPod Simulator',
@@ -23,7 +22,7 @@ export function useHelpers() {
       'iPod',
     ].includes(navigator.platform)
     // iPad on iOS 13 detection
-    || (navigator.userAgent.includes("Mac") && "ontouchend" in document)
+    || (navigator.userAgent.includes("Mac") && "ontouchend" in document))
   }  
 
   return {