chore(ui): mark React component props read-only (Sonar S6759)

apps/mobile/app/(tabs)/calendar/_components/calendar-day-detail.tsx

@@ -58,7 +58,7 @@ export function CalendarDayDetail({
   displayTime,
   t,
   tokens,
-}: CalendarDayDetailProps) {
+}: Readonly<CalendarDayDetailProps>) {
   const styles = useMemo(() => createStyles(tokens), [tokens]);
 
   const renderEntry = (item: CalendarDayEntry, index: number) => {

apps/mobile/app/(tabs)/calendar/_components/calendar-day-entry.tsx

@@ -106,7 +106,7 @@ export function CalendarDayEntryRow({
   statusAccessibilityLabel,
   displayTime,
   isLast,
-}: CalendarDayEntryRowProps) {
+}: Readonly<CalendarDayEntryRowProps>) {
   const styles = useMemo(() => createStyles(tokens), [tokens]);
 
   return (

apps/mobile/app/(tabs)/calendar/_components/calendar-grid.tsx

@@ -95,7 +95,7 @@ export function CalendarGrid({
   language,
   t,
   tokens,
-}: CalendarGridProps) {
+}: Readonly<CalendarGridProps>) {
   const styles = useMemo(() => createStyles(tokens), [tokens]);
 
   const grid = (

apps/mobile/app/(tabs)/calendar/_components/calendar-shell.tsx

@@ -193,7 +193,7 @@ export function CalendarHeader({
   onCurrentMonth,
   onSelectYear,
   tokens,
-}: CalendarHeaderProps) {
+}: Readonly<CalendarHeaderProps>) {
   const styles = useMemo(() => createStyles(tokens), [tokens]);
   const monthNavRef = useRef<View>(null);
   useTourTarget("tour-calendar-month-nav", monthNavRef);
@@ -292,7 +292,7 @@ export function CalendarWeekNav({
   onNextWeek,
   onCurrentWeek,
   tokens,
-}: CalendarWeekNavProps) {
+}: Readonly<CalendarWeekNavProps>) {
   const styles = useMemo(() => createStyles(tokens), [tokens]);
 
   return (
@@ -345,7 +345,7 @@ export function CalendarLegend({
   partialLabel,
   missedLabel,
   tokens,
-}: CalendarLegendProps) {
+}: Readonly<CalendarLegendProps>) {
   const styles = useMemo(() => createStyles(tokens), [tokens]);
   const legendRef = useRef<View>(null);
   useTourTarget("tour-calendar-legend", legendRef);

apps/mobile/app/login-atoms.tsx

@@ -4,7 +4,7 @@ import Svg, { Circle, Path } from 'react-native-svg'
 
 const AnimatedSvg = Animated.createAnimatedComponent(Svg)
 
-export function Spinner({ size = 16, color }: { size?: number; color: string }) {
+export function Spinner({ size = 16, color }: Readonly<{ size?: number; color: string }>) {
   const rotation = useMemo(() => new Animated.Value(0), [])
 
   useEffect(() => {

apps/mobile/components/bottom-sheet-modal.tsx

@@ -52,7 +52,7 @@ export function BottomSheetModal({
   onAttemptDismiss,
   contentManagesScroll = false,
   children,
-}: BottomSheetModalProps) {
+}: Readonly<BottomSheetModalProps>) {
   const { currentScheme, currentTheme } = useAppTheme()
   const { t } = useTranslation()
   const tokens = useMemo(

apps/mobile/components/goal-card.tsx

@@ -18,7 +18,7 @@ interface GoalCardProps {
   tourTargetId?: string
 }
 
-export function GoalCard({ goal, onPress, onLongPress, tourTargetId }: GoalCardProps) {
+export function GoalCard({ goal, onPress, onLongPress, tourTargetId }: Readonly<GoalCardProps>) {
   const { t } = useTranslation()
   const { currentScheme, currentTheme } = useAppTheme()
   const tokens = useMemo(

apps/mobile/components/goals/create-goal-modal.tsx

@@ -43,7 +43,7 @@ interface CreateGoalRequest {
   type?: 'Standard' | 'Streak'
 }
 
-export function CreateGoalModal({ open, onClose }: CreateGoalModalProps) {
+export function CreateGoalModal({ open, onClose }: Readonly<CreateGoalModalProps>) {
   const { t } = useTranslation()
   const translate = useCallback(
     (key: string, values?: Record<string, unknown>) => t(key, values),

apps/mobile/components/goals/edit-goal-modal.tsx

@@ -47,7 +47,7 @@ interface UpdateGoalRequest {
   deadline?: string | null
 }
 
-export function EditGoalModal({ open, onClose, goal }: EditGoalModalProps) {
+export function EditGoalModal({ open, onClose, goal }: Readonly<EditGoalModalProps>) {
   const { t } = useTranslation()
   const translate = useCallback(
     (key: string, values?: Record<string, unknown>) => t(key, values),

apps/mobile/components/goals/goal-detail-drawer.tsx

@@ -44,7 +44,7 @@ export function GoalDetailDrawer({
   open,
   onClose,
   goalId,
-}: GoalDetailDrawerProps) {
+}: Readonly<GoalDetailDrawerProps>) {
   const { t, i18n } = useTranslation()
   const translate = useCallback(
     (key: string, values?: Record<string, unknown>) => t(key, values),

apps/mobile/components/habit-list/confirm-dialogs.tsx

@@ -59,7 +59,7 @@ export function HabitListConfirmDialogs({
   autoLogParentName,
   onConfirmAutoLogParent,
   onCancelAutoLogParent,
-}: HabitListConfirmDialogsProps) {
+}: Readonly<HabitListConfirmDialogsProps>) {
   const isSkipParent = autoLogParentMode === 'skip'
   return (
     <>

apps/mobile/components/habit-list/date-group-section.tsx

@@ -46,7 +46,7 @@ export function HabitListDateGroupSection({
   group,
   overdueLabel,
   renderHabit,
-}: HabitListDateGroupSectionProps) {
+}: Readonly<HabitListDateGroupSectionProps>) {
   const { currentScheme, currentTheme } = useAppTheme()
   const tokens = createTokensV2(currentScheme, currentTheme)
 

apps/mobile/components/habit-list/drill-panel.tsx

@@ -38,7 +38,7 @@ export function DrillHabitItem({
   styles,
   getDrillChildren,
   renderHabitCard,
-}: DrillHabitItemProps) {
+}: Readonly<DrillHabitItemProps>) {
   const grandChildren = getDrillChildren(child.id)
   return (
     <View style={styles.sectionInset}>
@@ -60,7 +60,7 @@ interface DrillFooterProps {
 }
 
 /** Add-sub-habit affordance shown below the drill list. */
-export function DrillFooter({ styles, label, onAddSubHabit }: DrillFooterProps) {
+export function DrillFooter({ styles, label, onAddSubHabit }: Readonly<DrillFooterProps>) {
   const { currentScheme, currentTheme } = useAppTheme()
   const tokens = createTokensV2(currentScheme, currentTheme)
 

apps/mobile/components/habit-list/empty-state.tsx

@@ -38,7 +38,7 @@ export function HabitListEmptyState({
   askAstraLabel,
   onAskAstra,
   variant = 'primary',
-}: HabitListEmptyStateProps) {
+}: Readonly<HabitListEmptyStateProps>) {
   const { currentScheme, currentTheme } = useAppTheme()
   const tokens = createTokensV2(currentScheme, currentTheme)
   const isAstraPrompt = variant === 'primary'
@@ -109,7 +109,7 @@ interface SkeletonCardStyles {
   skeletonCheck: StyleProp<ViewStyle>
 }
 
-export function SkeletonCard({ styles: cardStyles }: { styles: SkeletonCardStyles }) {
+export function SkeletonCard({ styles: cardStyles }: Readonly<{ styles: SkeletonCardStyles }>) {
   const prefersReducedMotion = usePrefersReducedMotion()
   const pulse = useSharedValue(1)
 

apps/mobile/components/habit-list/move-parent-dialog.tsx

@@ -121,7 +121,7 @@ export function MoveParentDialog({
   onClose,
   onConfirm,
   onSelectOption,
-}: MoveParentDialogProps) {
+}: Readonly<MoveParentDialogProps>) {
   const { currentScheme, currentTheme } = useAppTheme()
   const tokens = createTokensV2(currentScheme, currentTheme)
   const styles = createStyles(tokens)

apps/mobile/components/habits/habit-checklist.tsx

@@ -61,7 +61,7 @@ function EditableChecklistItem({
   isLast,
   styles,
   tokens,
-}: EditableChecklistItemProps) {
+}: Readonly<EditableChecklistItemProps>) {
   const { t } = useTranslation()
   const [localText, setLocalText] = useState(text)
 

apps/mobile/components/profile/profile-nav-icon.tsx

@@ -16,10 +16,10 @@ import type { ProfileNavIconKey } from '@orbit/shared/utils/profile-navigation'
 export function ProfileNavIcon({
   iconKey,
   color,
-}: {
+}: Readonly<{
   iconKey: ProfileNavIconKey
   color: string
-}) {
+}>) {
   switch (iconKey) {
     case 'settings':
       return <Settings size={22} color={color} strokeWidth={1.8} />

apps/mobile/components/tour/tour-provider.tsx

@@ -24,7 +24,7 @@ const HABITS_TOUR_SCROLL_Y = 220
  * mock data, and cleanup.
  * Mirrors the web TourProvider: global registry, scroll into view, continuous re-measurement.
  */
-export function TourProvider({ children }: { children: React.ReactNode }) {
+export function TourProvider({ children }: Readonly<{ children: React.ReactNode }>) {
   const router = useRouter()
   const pathname = usePathname()
   const insets = useSafeAreaInsets()

apps/mobile/components/tour/tour-replay-modal.tsx

@@ -40,7 +40,7 @@ interface TourReplayModalProps {
   onClose: () => void
 }
 
-export function TourReplayModal({ visible, onClose }: TourReplayModalProps) {
+export function TourReplayModal({ visible, onClose }: Readonly<TourReplayModalProps>) {
   const { t } = useTranslation()
   const { currentScheme, currentTheme } = useAppTheme()
   const tokens = useMemo(

apps/mobile/components/tour/tour-spotlight.tsx

@@ -17,7 +17,7 @@ interface TourSpotlightProps {
   targetRect: TourTargetRect | null
 }
 
-export function TourSpotlight({ targetRect }: TourSpotlightProps) {
+export function TourSpotlight({ targetRect }: Readonly<TourSpotlightProps>) {
   const { width: screenWidth, height: screenHeight } = useWindowDimensions()
   const { currentScheme, currentTheme } = useAppTheme()
   const tokens = useMemo(

apps/mobile/components/tour/tour-tooltip.tsx

@@ -63,7 +63,7 @@ export function TourTooltip({
   onNext,
   onPrev,
   onSkip,
-}: TourTooltipProps) {
+}: Readonly<TourTooltipProps>) {
   const { t } = useTranslation()
   const { currentScheme, currentTheme } = useAppTheme()
   const tokens = useMemo(
@@ -228,11 +228,11 @@ function ProgressDot({
   state,
   color,
   reduceMotion,
-}: {
+}: Readonly<{
   state: ProgressDotState
   color: string
   reduceMotion: boolean
-}) {
+}>) {
   const [scaleX] = useState(() => new Animated.Value(state === 'active' ? 1 : 0.5))
 
   useEffect(() => {

apps/mobile/components/ui/year-picker.tsx

@@ -21,7 +21,7 @@ export function YearPicker({
   selectedYear,
   onSelectYear,
   tokens,
-}: YearPickerProps) {
+}: Readonly<YearPickerProps>) {
   const scrollRef = useRef<ScrollView>(null)
   const years = useMemo(() => buildYearRange(selectedYear), [selectedYear])
 

apps/web/app/(public)/u/[slug]/page.tsx

@@ -61,7 +61,7 @@ export async function generateMetadata({ params }: PageParams): Promise<Metadata
   }
 }
 
-export default async function PublicProfileSlugPage({ params }: PageParams) {
+export default async function PublicProfileSlugPage({ params }: Readonly<PageParams>) {
   const { slug } = await params
   const view = await fetchView(slug)
   if (!view) notFound()

apps/web/components/tour/tour-tooltip.tsx

@@ -201,7 +201,7 @@ export function TourTooltip({
   onNext,
   onPrev,
   onSkip,
-}: TourTooltipProps) {
+}: Readonly<TourTooltipProps>) {
   const t = useTranslations()
   const [pos, setPos] = useState<{ top: number; left: number } | null>(null)
   const [mode, setMode] = useState<'float' | 'sheet-top' | 'sheet-bottom'>('sheet-bottom')

sonar-project.properties

@@ -40,4 +40,6 @@ sonar.coverage.exclusions=apps/web/app/**/layout.tsx,apps/mobile/app/**/_layout.
 #   apps/mobile/lib/plural.ts                   one-line re-export of @orbit/shared/utils/plural.
 #   apps/mobile/lib/theme.ts                    createTokensV2 per-layer token derivation; repetitive shapes mirror the scheme structure.
 #   packages/shared/src/theme/color-schemes.ts  6 near-identical per-scheme literal blocks; data, not logic.
-sonar.cpd.exclusions=apps/web/app/actions/**,apps/mobile/stores/**,apps/mobile/lib/habit-request-builders.ts,apps/mobile/lib/habit-optimistic-helpers.ts,apps/mobile/lib/plural.ts,apps/mobile/lib/theme.ts,packages/shared/src/theme/color-schemes.ts
+#   apps/mobile/components/habit-list/confirm-dialogs.tsx        verbatim web/mobile HabitListConfirmDialogs parity mirror: identical props-driven JSX body,
+#   apps/web/components/habits/habit-list/confirm-dialogs.tsx    but ConfirmDialog + t() are platform-specific (NativeWind vs shadcn / i18next vs next-intl), so it can't move to packages/shared.
+sonar.cpd.exclusions=apps/web/app/actions/**,apps/mobile/stores/**,apps/mobile/lib/habit-request-builders.ts,apps/mobile/lib/habit-optimistic-helpers.ts,apps/mobile/lib/plural.ts,apps/mobile/lib/theme.ts,packages/shared/src/theme/color-schemes.ts,apps/mobile/components/habit-list/confirm-dialogs.tsx,apps/web/components/habits/habit-list/confirm-dialogs.tsx