Skip to content

Profile screen - #6

Merged
OumB2021 merged 4 commits into
mainfrom
profile-screen
Jun 29, 2026
Merged

Profile screen#6
OumB2021 merged 4 commits into
mainfrom
profile-screen

Conversation

@OumB2021

@OumB2021 OumB2021 commented Jun 29, 2026

Copy link
Copy Markdown
Owner

Summary by CodeRabbit

  • New Features
    • Added a full mobile Journal experience: home feed, profile grid, post detail view, contextual post actions (download/share/delete), and animated like interactions.
    • Introduced app-wide theming and gesture handling, plus a set of reusable UI components for headers, post cards/menus, and profile content.
  • Bug Fixes
    • Improved mobile tab bar and root layout behavior for better spacing and label visibility.
  • Documentation
    • Expanded and refined mobile engineering guidelines, including updated style/formatting rules and examples.

@coderabbitai

coderabbitai Bot commented Jun 29, 2026

Copy link
Copy Markdown

Review Change Stack

📝 Walkthrough

Walkthrough

Adds typed mobile theming, a themed tab bar, a home feed with post menus and likes, a grid-based profile screen with a detail panel, and updated AGENTS.md guidance for the root and mobile app.

Changes

Mobile App Updates

Layer / File(s) Summary
Theme contract and root wiring
apps/mobile/theme/theme.ts, apps/mobile/theme/ThemeProvider.tsx, apps/mobile/theme/index.ts, apps/mobile/theme/useTheme.ts, apps/mobile/app/_layout.tsx, apps/mobile/components/TabBar.tsx, apps/mobile/app/(tabs)/_layout.tsx
Defines typed theme objects and context access, re-exports them from the theme entrypoints, wraps the root layout with theming and gesture handling, and updates the tab bar to read theme tokens and new layout constants.
Home feed screen and components
apps/mobile/data/mockPosts.ts, apps/mobile/components/HomeHeader.tsx, apps/mobile/components/LikeButton.tsx, apps/mobile/components/PostCard.tsx, apps/mobile/components/PostMenu.tsx, apps/mobile/app/(tabs)/home.tsx
Adds mock post data, the home header, like control, feed card, anchored post menu, and the home tab screen that tracks likes and menu state in a FlatList.
Profile screen and detail panel
apps/mobile/data/profileMockData.ts, apps/mobile/components/profile/ProfileHeader.tsx, apps/mobile/components/profile/StatsBanner.tsx, apps/mobile/components/profile/GridImage.tsx, apps/mobile/components/profile/PostDetailPanel.tsx, apps/mobile/app/(tabs)/profile.tsx
Adds profile mock data, header and stats components, grid thumbnails, the post detail modal, and the profile tab screen that opens and dismisses selected posts.
AGENTS.md updates
AGENTS.md, apps/mobile/AGENTS.md, apps/mobile/CLAUDE 2.md
Updates the root AGENTS.md formatting and code snippets, and replaces the mobile AGENTS.md content with app-specific guidance.

Sequence Diagram(s)

sequenceDiagram
  participant HomeScreen
  participant PostCard
  participant LikeButton
  participant PostMenu
  HomeScreen->>PostCard: render post, liked state, like count
  PostCard->>LikeButton: render liked toggle
  LikeButton->>HomeScreen: onToggle() updates likedIds
  PostCard->>HomeScreen: onMenuOpen(anchor)
  HomeScreen->>PostMenu: render menu with anchor
  PostMenu->>HomeScreen: onClose()
Loading
sequenceDiagram
  participant ProfileScreen
  participant GridImage
  participant PostDetailPanel
  ProfileScreen->>GridImage: render grid item
  GridImage->>ProfileScreen: onPress(post)
  ProfileScreen->>PostDetailPanel: render selected post
  PostDetailPanel->>ProfileScreen: onClose()
Loading

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~60 minutes

Possibly related PRs

  • OumB2021/Journal#1: Introduces the initial comprehensive AGENTS.md guide that this PR expands and revises.
  • OumB2021/Journal#3: Modifies apps/mobile/app/_layout.tsx, which this PR extends with ThemeProvider and GestureHandlerRootView.
  • OumB2021/Journal#4: Touches apps/mobile/app/(tabs)/_layout.tsx and apps/mobile/components/TabBar.tsx, both updated here for theme-driven tab bar behavior.

Poem

🐇 I hopped through tabs from left to right,
With themed bright tools and menus light.
A feed to like, a grid to see,
A detail panel swipes with glee.
Journal glows in dark and day,
And bunny hops the tidy way.

🚥 Pre-merge checks | ✅ 3 | ❌ 2

❌ Failed checks (1 warning, 1 inconclusive)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 5.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
Title check ❓ Inconclusive The title is related to the changes, but it is too generic to convey the main profile-screen overhaul. Rename it to summarize the primary change, e.g. "Build out mobile profile screen" or similar.
✅ Passed checks (3 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.
✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch profile-screen

Comment @coderabbitai help to get the list of available commands.

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 9

🧹 Nitpick comments (7)
apps/mobile/theme/theme.ts (1)

60-73: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Preserve the theme contract at compile time.

The repeated as casts make these objects unchecked, so a token/key mismatch can slip through silently. Prefer satisfies Theme here and let the token exports keep their own exact types. As per coding guidelines, apps/mobile/**/*.{ts,tsx}: “Use strict TypeScript in the mobile app: no any, keep types simple and readable, and share types/schemas through @journal/shared instead of redefining them.”

Proposed change
-export const lightTheme: Theme = {
+export const lightTheme = {
   scheme: 'light',
-  colors: lightColors as ThemeColors,
-  static: staticColors as StaticColors,
-  spacing: spacing as Spacing,
-  radii: radii as Radii,
-};
+  colors: lightColors,
+  static: staticColors,
+  spacing,
+  radii,
+} satisfies Theme;
 
-export const darkTheme: Theme = {
+export const darkTheme = {
   scheme: 'dark',
-  colors: darkColors as ThemeColors,
-  static: staticColors as StaticColors,
-  spacing: spacing as Spacing,
-  radii: radii as Radii,
-};
+  colors: darkColors,
+  static: staticColors,
+  spacing,
+  radii,
+} satisfies Theme;
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@apps/mobile/theme/theme.ts` around lines 60 - 73, The theme objects in
lightTheme and darkTheme are using unchecked type assertions, which can hide
token/key mismatches. Update the Theme definitions to use satisfies Theme
instead of as ThemeColors/StaticColors/Spacing/Radii casts, and keep the
imported token objects’ existing types intact so compile-time checks validate
the theme contract. Focus on the lightTheme and darkTheme symbols in theme.ts
and remove redundant casting while preserving readability and strict mobile
TypeScript conventions.

Source: Coding guidelines

apps/mobile/theme/ThemeProvider.tsx (1)

5-17: 🎯 Functional Correctness | 🔵 Trivial | ⚡ Quick win

Fail fast when useTheme is used outside the provider.

createContext(darkTheme) turns a missing provider into a silent fallback, which makes wiring bugs hard to spot. Use Theme | null and throw in useTheme() instead.

Proposed change
-export const ThemeContext = createContext<Theme>(darkTheme);
+export const ThemeContext = createContext<Theme | null>(null);
@@
 export function useTheme(): Theme {
-  return useContext(ThemeContext);
+  const theme = useContext(ThemeContext);
+  if (!theme) {
+    throw new Error('useTheme must be used within ThemeProvider');
+  }
+  return theme;
 }
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@apps/mobile/theme/ThemeProvider.tsx` around lines 5 - 17, The ThemeContext
currently uses a default darkTheme value, which hides missing provider wiring;
update ThemeContext and useTheme in ThemeProvider.tsx to use a null-safe context
instead of a silent fallback. Make ThemeContext hold Theme | null, keep
ThemeProvider as the only place that supplies a real theme, and have useTheme()
throw an error when the context value is null so consumers fail fast outside the
provider.
apps/mobile/components/profile/ProfileHeader.tsx (1)

25-27: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Use a Tailwind utility for the static text leading.

lineHeight: 21 is fixed styling on a Text, so it should live in className (for example, leading-[21px]) instead of inline style. As per coding guidelines, apps/mobile/**/*.{ts,tsx}: "Use NativeWind / Tailwind classes for styling throughout the mobile app; avoid StyleSheet unless a style cannot be expressed with class names."

🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@apps/mobile/components/profile/ProfileHeader.tsx` around lines 25 - 27, The
ProfileHeader Text uses an inline fixed lineHeight style instead of a Tailwind
utility. Move the static leading value into the existing className on the Text
component in ProfileHeader so it uses a NativeWind class like a leading utility,
and remove the inline style while keeping the current text styling intact.

Source: Coding guidelines

apps/mobile/components/profile/StatsBanner.tsx (1)

11-15: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Keep this banner in NativeWind instead of StyleSheet.

The gap, padding, and radius here are all static on RN primitives, so they can be expressed directly with className rather than inline style/StyleSheet. As per coding guidelines, apps/mobile/**/*.{ts,tsx}: "Use NativeWind / Tailwind classes for styling throughout the mobile app; avoid StyleSheet unless a style cannot be expressed with class names."

Also applies to: 22-39

🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@apps/mobile/components/profile/StatsBanner.tsx` around lines 11 - 15, The
StatsBanner layout is still using inline/static styling instead of NativeWind
classes. Update the relevant JSX in StatsBanner to express the fixed gap,
padding, and radius directly via className on the RN primitives, and remove any
StyleSheet or inline style usage for those static values. Keep the styling
consistent with the existing Text and View structure in StatsBanner so the
component remains fully NativeWind-based.

Source: Coding guidelines

apps/mobile/components/profile/PostDetailPanel.tsx (1)

312-456: 📐 Maintainability & Code Quality | 🔵 Trivial | 🏗️ Heavy lift

Most of this modal can still live in NativeWind.

Outside of Modal, Animated.View, keyboard handling, and runtime theme values, this is mostly fixed layout/typography on RN primitives. Moving those static styles out of StyleSheet and into className will keep the mobile UI aligned with the app’s styling rule. As per coding guidelines, apps/mobile/**/*.{ts,tsx}: "Use NativeWind / Tailwind classes for styling throughout the mobile app; avoid StyleSheet unless a style cannot be expressed with class names."

🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@apps/mobile/components/profile/PostDetailPanel.tsx` around lines 312 - 456,
The static layout and typography styles in PostDetailPanel should be moved out
of StyleSheet and into NativeWind className usage, since only Modal,
Animated.View, keyboard handling, and runtime theme-dependent values need inline
styles. Update the affected RN primitives in PostDetailPanel (for example the
content, author/comment rows, buttons, text, separators, and input) to use
Tailwind classes instead of the styles object, and keep StyleSheet only for
values that cannot be expressed with class names.

Source: Coding guidelines

apps/mobile/app/(tabs)/profile.tsx (1)

82-110: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Keep the route layout styles in className.

The list/header/grid spacing here is all static, so it can be expressed directly with NativeWind instead of a route-local StyleSheet. As per coding guidelines, apps/mobile/**/*.{ts,tsx}: "Use NativeWind / Tailwind classes for styling throughout the mobile app; avoid StyleSheet unless a style cannot be expressed with class names."

🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@apps/mobile/app/`(tabs)/profile.tsx around lines 82 - 110, Move the static
layout styling in the profile route from the local StyleSheet into NativeWind
className usage. Update the relevant list, header, grid header, label, column
wrapper, and separator elements in the profile screen so their
spacing/alignment/font styles are expressed directly on the components, and
remove the unused StyleSheet definition if nothing else depends on it. Use the
existing profile screen structure and className props to keep styling consistent
with the mobile app guidelines.

Source: Coding guidelines

apps/mobile/components/HomeHeader.tsx (1)

6-8: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Move the static letterSpacing into a Tailwind class.

This header is otherwise NativeWind-styled, so the inline letterSpacing: 4 unnecessarily breaks the mobile styling rule. tracking-[4px] keeps it consistent and theme-friendly. As per coding guidelines, "Use NativeWind/Tailwind classes for styling everywhere except the documented exceptions..." and "avoid StyleSheet unless a style cannot be expressed with class names."

🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@apps/mobile/components/HomeHeader.tsx` around lines 6 - 8, The HomeHeader
Text styling mixes NativeWind with an inline letterSpacing value, which should
be moved into the component’s Tailwind classes. Update the Text element in
HomeHeader to replace the static style prop with the equivalent NativeWind
tracking utility, keeping the styling consistent and theme-friendly while
preserving the same spacing behavior.

Source: Coding guidelines

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@AGENTS.md`:
- Around line 176-181: The example currently skips the fail-fast DATABASE_URL
validation by using process.env.DATABASE_URL! before creating the postgres
client. Update the AGENTS.md example to mirror the real initialization flow in
db/index.ts: explicitly check for DATABASE_URL first and only then construct the
client with postgres and drizzle. Keep the example aligned with the existing db
client setup symbols (postgres, drizzle, db) so it demonstrates early config
validation instead of deferred connection failure.

In `@apps/mobile/app/`(tabs)/_layout.tsx:
- Around line 10-13: The floating tab bar setup in the tabs layout needs a
shared bottom inset contract so scrollable screens don’t end up hidden behind
it. Update the tab screen layout in _layout.tsx together with the tab content
screen in home.tsx to reserve enough bottom space for the absolute TabBar
rendering in TabBar.tsx (bottom offset plus bar height), and apply that same
inset strategy consistently across tab screens instead of relying on only
spacing.lg.

In `@apps/mobile/components/PostCard.tsx`:
- Around line 24-35: The menu anchor calculation in handleMenuPress always
positions the dropdown below the trigger using y + height + 4, which can push
the fixed PostMenu off-screen near the bottom. Update the anchor logic to check
the available viewport space before calling onMenuOpen, and either clamp the
vertical position within the screen bounds or flip the menu to open above the
trigger when there isn’t enough room below. Use the existing
menuBtnRef.measureInWindow and Dimensions-based screen measurement to keep the
placement responsive.

In `@apps/mobile/components/PostMenu.tsx`:
- Around line 50-102: The PostMenu action rows are wired to empty onPress
handlers, so Download, Share, and Delete Post do nothing and the menu never
dismisses. Update PostMenu to use real callbacks passed in via props (or
remove/disable the rows until implemented), and make sure each handler closes
the modal after invoking its action; use the existing Pressable blocks and the
PostMenu component as the main places to update.

In `@apps/mobile/components/profile/GridImage.tsx`:
- Around line 27-31: The GridImage container is using flex: 1, which makes the
last item expand to fill an entire row in the profile grid. Update the GridImage
styling so the item keeps a fixed two-column grid basis instead of stretching,
or adjust the data/rendering in profile.tsx to add a spacer for odd counts. Use
the GridImage container style and the FlatList in profile.tsx as the main places
to fix this.
- Around line 15-21: The GridImage tile is currently an unlabeled pressable
image, so update the Pressable in GridImage to be explicitly accessible by
setting accessibilityRole to button and adding an accessibilityLabel derived
from post.title and post.category. Use the existing post, handlePress, and
Pressable/Image structure in GridImage.tsx to keep the label tied to the
specific post being opened.

In `@apps/mobile/components/profile/PostDetailPanel.tsx`:
- Around line 96-97: The modal surface in PostDetailPanel is hardcoded to a dark
background, which bypasses the theme system and breaks light mode. Update the
styling in styles.root to use a theme-aware surface color from useTheme(), such
as colors.bgBase, so the Animated.View/SafeAreaView modal matches the rest of
the themed text and borders. Apply the same change anywhere else the same modal
surface styling is reused.
- Around line 114-127: The icon-only dismiss controls in PostDetailPanel lack
accessible names, so update both Pressable dismiss buttons (the back control and
the close control near the other referenced spot) to expose
accessibilityRole="button" and explicit accessibilityLabel/accessibilityHint
values. Keep the existing handlers like handleClose and the related Pressable
wrappers, but add labels that clearly describe the action so assistive-tech
users can identify and dismiss the panel.

In `@apps/mobile/components/TabBar.tsx`:
- Around line 78-80: The floating tab bar positioning in TabBar still uses a
fixed bottom offset, which ignores devices with larger safe-area insets. Update
the TabBar component to read the bottom inset from BottomTabBarProps and use
that value when positioning the outer container instead of the hardcoded offset.
Make sure the existing tab bar layout and styling still work with the new
inset-aware positioning, including the related placement logic elsewhere in
TabBar.

---

Nitpick comments:
In `@apps/mobile/app/`(tabs)/profile.tsx:
- Around line 82-110: Move the static layout styling in the profile route from
the local StyleSheet into NativeWind className usage. Update the relevant list,
header, grid header, label, column wrapper, and separator elements in the
profile screen so their spacing/alignment/font styles are expressed directly on
the components, and remove the unused StyleSheet definition if nothing else
depends on it. Use the existing profile screen structure and className props to
keep styling consistent with the mobile app guidelines.

In `@apps/mobile/components/HomeHeader.tsx`:
- Around line 6-8: The HomeHeader Text styling mixes NativeWind with an inline
letterSpacing value, which should be moved into the component’s Tailwind
classes. Update the Text element in HomeHeader to replace the static style prop
with the equivalent NativeWind tracking utility, keeping the styling consistent
and theme-friendly while preserving the same spacing behavior.

In `@apps/mobile/components/profile/PostDetailPanel.tsx`:
- Around line 312-456: The static layout and typography styles in
PostDetailPanel should be moved out of StyleSheet and into NativeWind className
usage, since only Modal, Animated.View, keyboard handling, and runtime
theme-dependent values need inline styles. Update the affected RN primitives in
PostDetailPanel (for example the content, author/comment rows, buttons, text,
separators, and input) to use Tailwind classes instead of the styles object, and
keep StyleSheet only for values that cannot be expressed with class names.

In `@apps/mobile/components/profile/ProfileHeader.tsx`:
- Around line 25-27: The ProfileHeader Text uses an inline fixed lineHeight
style instead of a Tailwind utility. Move the static leading value into the
existing className on the Text component in ProfileHeader so it uses a
NativeWind class like a leading utility, and remove the inline style while
keeping the current text styling intact.

In `@apps/mobile/components/profile/StatsBanner.tsx`:
- Around line 11-15: The StatsBanner layout is still using inline/static styling
instead of NativeWind classes. Update the relevant JSX in StatsBanner to express
the fixed gap, padding, and radius directly via className on the RN primitives,
and remove any StyleSheet or inline style usage for those static values. Keep
the styling consistent with the existing Text and View structure in StatsBanner
so the component remains fully NativeWind-based.

In `@apps/mobile/theme/theme.ts`:
- Around line 60-73: The theme objects in lightTheme and darkTheme are using
unchecked type assertions, which can hide token/key mismatches. Update the Theme
definitions to use satisfies Theme instead of as
ThemeColors/StaticColors/Spacing/Radii casts, and keep the imported token
objects’ existing types intact so compile-time checks validate the theme
contract. Focus on the lightTheme and darkTheme symbols in theme.ts and remove
redundant casting while preserving readability and strict mobile TypeScript
conventions.

In `@apps/mobile/theme/ThemeProvider.tsx`:
- Around line 5-17: The ThemeContext currently uses a default darkTheme value,
which hides missing provider wiring; update ThemeContext and useTheme in
ThemeProvider.tsx to use a null-safe context instead of a silent fallback. Make
ThemeContext hold Theme | null, keep ThemeProvider as the only place that
supplies a real theme, and have useTheme() throw an error when the context value
is null so consumers fail fast outside the provider.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: a96a401c-d5d2-4a05-a5a4-493f6fb2e4b5

📥 Commits

Reviewing files that changed from the base of the PR and between cc15817 and dcb573d.

📒 Files selected for processing (22)
  • AGENTS.md
  • apps/mobile/AGENTS.md
  • apps/mobile/CLAUDE 2.md
  • apps/mobile/app/(tabs)/_layout.tsx
  • apps/mobile/app/(tabs)/home.tsx
  • apps/mobile/app/(tabs)/profile.tsx
  • apps/mobile/app/_layout.tsx
  • apps/mobile/components/HomeHeader.tsx
  • apps/mobile/components/LikeButton.tsx
  • apps/mobile/components/PostCard.tsx
  • apps/mobile/components/PostMenu.tsx
  • apps/mobile/components/TabBar.tsx
  • apps/mobile/components/profile/GridImage.tsx
  • apps/mobile/components/profile/PostDetailPanel.tsx
  • apps/mobile/components/profile/ProfileHeader.tsx
  • apps/mobile/components/profile/StatsBanner.tsx
  • apps/mobile/data/mockPosts.ts
  • apps/mobile/data/profileMockData.ts
  • apps/mobile/theme/ThemeProvider.tsx
  • apps/mobile/theme/index.ts
  • apps/mobile/theme/theme.ts
  • apps/mobile/theme/useTheme.ts
💤 Files with no reviewable changes (1)
  • apps/mobile/CLAUDE 2.md

Comment thread AGENTS.md
Comment on lines +176 to +181
import { drizzle } from "drizzle-orm/postgres-js";
import postgres from "postgres";
import * as schema from "./schema";

const client = postgres(process.env.DATABASE_URL!, { prepare: false })
export const db = drizzle(client, { schema })
const client = postgres(process.env.DATABASE_URL!, { prepare: false });
export const db = drizzle(client, { schema });

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Restore the fail-fast DATABASE_URL check in the example.

packages/db/src/index.ts validates DATABASE_URL before creating the client. Using process.env.DATABASE_URL! here hides that guard and encourages a later connection-time failure instead of an early config error.

🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@AGENTS.md` around lines 176 - 181, The example currently skips the fail-fast
DATABASE_URL validation by using process.env.DATABASE_URL! before creating the
postgres client. Update the AGENTS.md example to mirror the real initialization
flow in db/index.ts: explicitly check for DATABASE_URL first and only then
construct the client with postgres and drizzle. Keep the example aligned with
the existing db client setup symbols (postgres, drizzle, db) so it demonstrates
early config validation instead of deferred connection failure.

Source: Linked repositories

Comment thread apps/mobile/app/(tabs)/_layout.tsx
Comment thread apps/mobile/components/PostCard.tsx
Comment thread apps/mobile/components/PostMenu.tsx
Comment thread apps/mobile/components/profile/GridImage.tsx Outdated
Comment thread apps/mobile/components/profile/GridImage.tsx
Comment thread apps/mobile/components/profile/PostDetailPanel.tsx Outdated
Comment thread apps/mobile/components/profile/PostDetailPanel.tsx
Comment thread apps/mobile/components/TabBar.tsx Outdated

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@apps/mobile/components/profile/PostDetailPanel.tsx`:
- Around line 159-169: The Follow affordance in PostDetailPanel is inert because
the Pressable has no onPress handler. Update the PostDetailPanel component to
either wire this Pressable to the existing follow action handler if one exists,
or change the UI to a non-interactive element/disabled state until follow
behavior is implemented. Make sure the interactive intent matches the actual
behavior for the Follow button.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: 67d92800-d0b1-4e66-b59a-44baf5ef68b5

📥 Commits

Reviewing files that changed from the base of the PR and between dcb573d and 3ccf2d0.

📒 Files selected for processing (12)
  • apps/mobile/app/(tabs)/home.tsx
  • apps/mobile/app/(tabs)/profile.tsx
  • apps/mobile/components/HomeHeader.tsx
  • apps/mobile/components/PostCard.tsx
  • apps/mobile/components/PostMenu.tsx
  • apps/mobile/components/TabBar.tsx
  • apps/mobile/components/profile/GridImage.tsx
  • apps/mobile/components/profile/PostDetailPanel.tsx
  • apps/mobile/components/profile/ProfileHeader.tsx
  • apps/mobile/components/profile/StatsBanner.tsx
  • apps/mobile/theme/ThemeProvider.tsx
  • apps/mobile/theme/theme.ts
🚧 Files skipped from review as they are similar to previous changes (9)
  • apps/mobile/components/HomeHeader.tsx
  • apps/mobile/components/profile/ProfileHeader.tsx
  • apps/mobile/components/PostMenu.tsx
  • apps/mobile/theme/theme.ts
  • apps/mobile/components/TabBar.tsx
  • apps/mobile/app/(tabs)/profile.tsx
  • apps/mobile/app/(tabs)/home.tsx
  • apps/mobile/components/PostCard.tsx
  • apps/mobile/components/profile/GridImage.tsx

Comment on lines +159 to +169
<Pressable
className="px-[14px] py-[6px] rounded-full border"
style={{ borderColor: colors.textPrimary }}
>
<Text
className="font-sans-semibold text-[13px]"
style={{ color: colors.textPrimary }}
>
Follow
</Text>
</Pressable>

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Avoid rendering an inert Follow button.

This Pressable has no onPress, so the visible Follow affordance does nothing. Either wire the follow action or render it as non-interactive until that behavior exists.

Proposed minimal fallback
-                    <Pressable
+                    <View
                       className="px-[14px] py-[6px] rounded-full border"
                       style={{ borderColor: colors.textPrimary }}
                     >
                       <Text
                         className="font-sans-semibold text-[13px]"
                         style={{ color: colors.textPrimary }}
                       >
                         Follow
                       </Text>
-                    </Pressable>
+                    </View>
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
<Pressable
className="px-[14px] py-[6px] rounded-full border"
style={{ borderColor: colors.textPrimary }}
>
<Text
className="font-sans-semibold text-[13px]"
style={{ color: colors.textPrimary }}
>
Follow
</Text>
</Pressable>
<View
className="px-[14px] py-[6px] rounded-full border"
style={{ borderColor: colors.textPrimary }}
>
<Text
className="font-sans-semibold text-[13px]"
style={{ color: colors.textPrimary }}
>
Follow
</Text>
</View>
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@apps/mobile/components/profile/PostDetailPanel.tsx` around lines 159 - 169,
The Follow affordance in PostDetailPanel is inert because the Pressable has no
onPress handler. Update the PostDetailPanel component to either wire this
Pressable to the existing follow action handler if one exists, or change the UI
to a non-interactive element/disabled state until follow behavior is
implemented. Make sure the interactive intent matches the actual behavior for
the Follow button.

@OumB2021
OumB2021 merged commit c379913 into main Jun 29, 2026
4 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant