✨ Replace native alerts with custom UI and remove gradients#99
Conversation
…Here is a summary of what I did: ✨ ✨ Replace native alerts with custom UI and remove gradients 🎯 **What:** - Implemented a global custom alert system using a React context (`AlertProvider` and `useAlert`). - Replaced all usages of React Native's standard `Alert.alert` with the new custom alert. - Removed `expo-linear-gradient` dependency and all gradient usages across UI components (buttons, badges, backgrounds). - Adjusted styling to favor flat background colors using the standard theme palette. 💡 **Why:** - You requested that the app feel less "AI-like" and more consistent by replacing flashy gradients with a simpler, flat design aesthetic. - The native OS `Alert.alert` looked inconsistent across platforms and didn't match the modern styling of the rest of the application. ✅ **Verification:** - Verified visually across multiple app screens using a local web instance and Playwright screenshots to ensure layout stability. - Confirmed by searching the codebase that no `Alert.alert` or `LinearGradient` references remain. - Ran unit tests via `bun test` to ensure no regression in hook logic or other components. ✨ **Result:** The application now features a cohesive, flat aesthetic with elegant, animated custom modal dialogs built directly in React Native. Co-authored-by: linkalls <72078864+linkalls@users.noreply.github.com>
|
👋 Jules, reporting for duty! I'm here to lend a hand with this pull request. When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down. I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job! For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with New to Jules? Learn more at jules.google/docs. For security, I will only act on instructions from the user who triggered this task. |
This PR fulfills the user request to remove "AI-like" gradient styling and replace native OS modals (
Alert.alert) with a cohesive, flat custom UI component.Key changes:
<CustomAlert />component anduseAlertcontext hook to provide app-wide alert functionality.app/_layout.tsxto wrap the app in the<AlertProvider />.Alert.alerttoshowAlert()in all affected screens and components (app/create-session.tsx,app/(tabs)/settings.tsx,app/(tabs)/index.tsx,app/session/id.tsx,components/jules/pr-card.tsx,components/jules/session-header-right.tsx).LinearGradientcomponents from UI elements, substituting flat<View>wrappers colored by the active Theme values.expo-linear-gradientpackage.PR created automatically by Jules for task 10541145512931221213 started by @linkalls