Close dialog on save

[elie222]

Generated description

Below is a concise technical summary of the changes proposed in this PR:

graph LR
BriefsOnboarding_("BriefsOnboarding"):::modified
NEXT_IMAGE_("NEXT_IMAGE"):::added
WritingStyleDialog_("WritingStyleDialog"):::modified
REACT_("REACT"):::added
BriefsOnboarding_ -- "Adds Next Image rendering communication illustration in card." --> NEXT_IMAGE_
WritingStyleDialog_ -- "Adds dialog open state using useState, auto-closes on save." --> REACT_
classDef added stroke:#15AA7A
classDef removed stroke:#CD5270
classDef modified stroke:#EDAC4C
linkStyle default stroke:#CBD5E1,font-size:13px

Loading

Implement automatic closure of the WritingStyleDialog upon successful saving, enhancing user experience. Update the BriefsOnboarding component to refine its visual presentation and component structure, incorporating new typography and an illustration.

Topic	Details
Close Dialog on Save	Close the WritingStyleDialog automatically after a successful save operation, improving user flow. Modified files (1) apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx Latest Contributors(1) User Commit Date elie222 Allow-editing-writing-... December 07, 2025
Briefs Onboarding UI	Refactor the BriefsOnboarding component to enhance its visual layout, update component usage, and integrate an illustration for improved aesthetics. Modified files (2) apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx README.md Latest Contributors(2) User Commit Date elie222 unused-imports December 31, 2025 eduardoleliss@gmail.com Copilot-deployment-ins... November 25, 2025

This pull request is reviewed by Baz. Review like a pro on (Baz).

Summary by CodeRabbit

• Documentation

  • Added "Popsy Illustrations" to the list of built-in tools.

• Bug Fixes

  • Fixed WritingStyle dialog to properly close after saving changes.

• Style

  • Improved onboarding page layout and visual presentation.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Review	Updated (UTC)
inbox-zero	Ready	Preview	Dec 31, 2025 11:27am

[coderabbitai]

📝 Walkthrough

Walkthrough

This PR adds a new tool link to the README and refactors two UI components: WritingStyleSetting now manages dialog open state directly and closes on successful save, while Onboarding simplifies its Card structure using direct Typography components and flattens the Item layout composition.

Changes

Cohort / File(s)	Summary
README Documentation README.md	Added new "Popsy Illustrations" link to the Built with section.
Dialog State Management apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx	Converted WritingStyleDialog from uncontrolled to controlled component by introducing local open state; dialog now closes via setOpen(false) on successful save, using open={open} and onOpenChange={setOpen} props.
Card Layout Restructuring apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx	Replaced Card subcomponents (CardHeader, CardTitle, CardDescription, CardContent) with direct Typography components (TypographyH3, SectionDescription); removed ItemMedia and simplified Item composition to a flattened ItemGroup structure with inline icons; adjusted spacing with mt-6 margins on ItemGroup and CardFooter.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Possibly related PRs

• Allow editing writing style #1074: Directly modifies the WritingStyleSetting component to implement controlled dialog state with open prop and onOpenChange handler.
• Fix flicker #1143: Makes overlapping structural changes to the Onboarding.tsx component, altering Card subcomponent usage and Item/icon composition patterns.

Poem

🐰 A dialog now obeys with grace,
No more uncontrolled space,
Cards shed their layers, simple and bright,
Icons dance in ItemGroup light,
Onboarding gleams—refactored just right! ✨

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	You can run @coderabbitai generate docstrings to improve docstring coverage.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The pull request title 'Close dialog on save' directly describes the main change in WritingStyleSetting.tsx, which is the primary modification. However, the changeset also includes unrelated updates to README.md and Onboarding.tsx that are not reflected in the title.

✨ Finishing touches

• 📝 Generate docstrings

---

📜 Recent review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 71635d1 and cd7e5b6.

📒 Files selected for processing (3)

• README.md
• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx
• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx

🧰 Additional context used

📓 Path-based instructions (16)

**/*.{ts,tsx}

📄 CodeRabbit inference engine (.cursor/rules/data-fetching.mdc)

**/*.{ts,tsx}: For API GET requests to server, use the swr package
Use result?.serverError with toastError from @/components/Toast for error handling in async operations

**/*.{ts,tsx}: Use wrapper functions for Gmail message operations (get, list, batch, etc.) from @/utils/gmail/message.ts instead of direct API calls
Use wrapper functions for Gmail thread operations from @/utils/gmail/thread.ts instead of direct API calls
Use wrapper functions for Gmail label operations from @/utils/gmail/label.ts instead of direct API calls

**/*.{ts,tsx}: For early access feature flags, create hooks using the naming convention use[FeatureName]Enabled that return a boolean from useFeatureFlagEnabled("flag-key")
For A/B test variant flags, create hooks using the naming convention use[FeatureName]Variant that define variant types, use useFeatureFlagVariantKey() with type casting, and provide a default "control" fallback
Use kebab-case for PostHog feature flag keys (e.g., inbox-cleaner, pricing-options-2)
Always define types for A/B test variant flags (e.g., type PricingVariant = "control" | "variant-a" | "variant-b") and provide type safety through type casting

**/*.{ts,tsx}: Don't use primitive type aliases or misleading types
Don't use empty type parameters in type aliases and interfaces
Don't use this and super in static contexts
Don't use any or unknown as type constraints
Don't use the TypeScript directive @ts-ignore
Don't use TypeScript enums
Don't export imported variables
Don't add type annotations to variables, parameters, and class properties that are initialized with literal expressions
Don't use TypeScript namespaces
Don't use non-null assertions with the ! postfix operator
Don't use parameter properties in class constructors
Don't use user-defined types
Use as const instead of literal types and type annotations
Use either T[] or Array<T> consistently
Initialize each enum member value explicitly
Use export type for types
Use `impo...

Files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx
• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx

apps/web/app/(app)/**/*.{ts,tsx}

📄 CodeRabbit inference engine (.cursor/rules/page-structure.mdc)

apps/web/app/(app)/**/*.{ts,tsx}: Components for the page are either put in page.tsx, or in the apps/web/app/(app)/PAGE_NAME folder
If we're in a deeply nested component we will use swr to fetch via API
If you need to use onClick in a component, that component is a client component and file must start with use client

Files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx
• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx

**/*.{ts,tsx,js,jsx}

📄 CodeRabbit inference engine (.cursor/rules/prisma-enum-imports.mdc)

Always import Prisma enums from @/generated/prisma/enums instead of @/generated/prisma/client to avoid Next.js bundling errors in client components

Import Prisma using the project's centralized utility: import prisma from '@/utils/prisma'

Files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx
• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx

apps/web/**/*.{ts,tsx}

📄 CodeRabbit inference engine (.cursor/rules/project-structure.mdc)

Import specific lodash functions rather than entire lodash library to minimize bundle size (e.g., import groupBy from 'lodash/groupBy')

apps/web/**/*.{ts,tsx}: Use TypeScript with strict null checks
Do not export types/interfaces that are only used within the same file. Export later if needed

Files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx
• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx

**/*.{tsx,ts}

📄 CodeRabbit inference engine (.cursor/rules/ui-components.mdc)

**/*.{tsx,ts}: Use Shadcn UI and Tailwind for components and styling
Use next/image package for images
For API GET requests to server, use the swr package with hooks like useSWR to fetch data
For text inputs, use the Input component with registerProps for form integration and error handling

Files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx
• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx

**/*.{tsx,ts,css}

📄 CodeRabbit inference engine (.cursor/rules/ui-components.mdc)

Implement responsive design with Tailwind CSS using a mobile-first approach

Files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx
• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx

**/*.tsx

📄 CodeRabbit inference engine (.cursor/rules/ui-components.mdc)

**/*.tsx: Use the LoadingContent component to handle loading states instead of manual loading state management
For text areas, use the Input component with type='text', autosizeTextarea prop set to true, and registerProps for form integration

Files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx
• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx

**/*.{js,jsx,ts,tsx}

📄 CodeRabbit inference engine (.cursor/rules/ultracite.mdc)

**/*.{js,jsx,ts,tsx}: Don't use accessKey attribute on any HTML element
Don't set aria-hidden="true" on focusable elements
Don't add ARIA roles, states, and properties to elements that don't support them
Don't use distracting elements like <marquee> or <blink>
Only use the scope prop on <th> elements
Don't assign non-interactive ARIA roles to interactive HTML elements
Make sure label elements have text content and are associated with an input
Don't assign interactive ARIA roles to non-interactive HTML elements
Don't assign tabIndex to non-interactive HTML elements
Don't use positive integers for tabIndex property
Don't include "image", "picture", or "photo" in img alt prop
Don't use explicit role property that's the same as the implicit/default role
Make static elements with click handlers use a valid role attribute
Always include a title element for SVG elements
Give all elements requiring alt text meaningful information for screen readers
Make sure anchors have content that's accessible to screen readers
Assign tabIndex to non-interactive HTML elements with aria-activedescendant
Include all required ARIA attributes for elements with ARIA roles
Make sure ARIA properties are valid for the element's supported roles
Always include a type attribute for button elements
Make elements with interactive roles and handlers focusable
Give heading elements content that's accessible to screen readers (not hidden with aria-hidden)
Always include a lang attribute on the html element
Always include a title attribute for iframe elements
Accompany onClick with at least one of: onKeyUp, onKeyDown, or onKeyPress
Accompany onMouseOver/onMouseOut with onFocus/onBlur
Include caption tracks for audio and video elements
Use semantic elements instead of role attributes in JSX
Make sure all anchors are valid and navigable
Ensure all ARIA properties (aria-*) are valid
Use valid, non-abstract ARIA roles for elements with ARIA roles
Use valid AR...

Files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx
• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx

**/*.{jsx,tsx}

📄 CodeRabbit inference engine (.cursor/rules/ultracite.mdc)

**/*.{jsx,tsx}: Don't use unnecessary fragments
Don't pass children as props
Don't use the return value of React.render
Make sure all dependencies are correctly specified in React hooks
Make sure all React hooks are called from the top level of component functions
Don't forget key props in iterators and collection literals
Don't define React components inside other components
Don't use event handlers on non-interactive elements
Don't assign to React component props
Don't use both children and dangerouslySetInnerHTML props on the same element
Don't use dangerous JSX props
Don't use Array index in keys
Don't insert comments as text nodes
Don't assign JSX properties multiple times
Don't add extra closing tags for components without children
Use <>...</> instead of <Fragment>...</Fragment>
Watch out for possible "wrong" semicolons inside JSX elements
Make sure void (self-closing) elements don't have children
Don't use target="_blank" without rel="noopener"
Don't use <img> elements in Next.js projects
Don't use <head> elements in Next.js projects

Files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx
• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx

!(pages/_document).{jsx,tsx}

📄 CodeRabbit inference engine (.cursor/rules/ultracite.mdc)

Don't use the next/head module in pages/_document.js on Next.js projects

Files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx
• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx
• README.md

**/*.{js,ts,jsx,tsx}

📄 CodeRabbit inference engine (.cursor/rules/utilities.mdc)

**/*.{js,ts,jsx,tsx}: Use lodash utilities for common operations (arrays, objects, strings)
Import specific lodash functions to minimize bundle size (e.g., import groupBy from 'lodash/groupBy')

Files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx
• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx

apps/web/**/*.{ts,tsx,js,jsx}

📄 CodeRabbit inference engine (apps/web/CLAUDE.md)

apps/web/**/*.{ts,tsx,js,jsx}: Use @/ path aliases for imports from project root
Prefer self-documenting code over comments; use descriptive variable and function names instead of explaining intent with comments
Add helper functions to the bottom of files, not the top
All imports go at the top of files, no mid-file dynamic imports

Files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx
• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx

apps/web/app/**/*.{ts,tsx}

📄 CodeRabbit inference engine (apps/web/CLAUDE.md)

Follow NextJS app router structure with (app) directory

Files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx
• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx

apps/web/**/*.{tsx,jsx}

📄 CodeRabbit inference engine (apps/web/CLAUDE.md)

apps/web/**/*.{tsx,jsx}: Follow tailwindcss patterns with prettier-plugin-tailwindcss for class sorting
Prefer functional components with hooks in React
Use shadcn/ui components when available
Ensure responsive design with mobile-first approach in components
Follow consistent naming conventions using PascalCase for components
Use LoadingContent component for async data with loading and error states
Use React Hook Form with Zod validation for form handling
Use result?.serverError with toastError and toastSuccess for error handling in forms

Files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx
• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx

apps/web/**/*.{ts,tsx,js,jsx,json,css}

📄 CodeRabbit inference engine (apps/web/CLAUDE.md)

Format code with Prettier

Files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx
• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx

*.md

📄 CodeRabbit inference engine (.cursor/rules/task-list.mdc)

*.md: Create task lists in markdown files named TASKS.md or with a descriptive feature-specific name (e.g., ASSISTANT_CHAT.md) in the project root to track project progress
Structure task list markdown files with sections: Feature Name Implementation (title), description, Completed Tasks, In Progress Tasks, Future Tasks, Implementation Plan, and Relevant Files subsections
Update task list markdown files by marking tasks as completed with [x], adding new identified tasks, and moving tasks between Completed/In Progress/Future sections as appropriate
Keep the 'Relevant Files' section in task list markdown files updated with file paths that have been created or modified, brief descriptions of each file's purpose, and status indicators (e.g., ✅) for completed components

Files:

• README.md

🧠 Learnings (21)

📚 Learning: 2025-11-25T14:38:56.992Z

Learnt from: CR
Repo: elie222/inbox-zero PR: 0
File: .cursor/rules/project-structure.mdc:0-0
Timestamp: 2025-11-25T14:38:56.992Z
Learning: Components with `onClick` handlers must be client components marked with the `use client` directive

Applied to files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx
• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx

📚 Learning: 2025-12-21T12:21:37.794Z

Learnt from: CR
Repo: elie222/inbox-zero PR: 0
File: apps/web/CLAUDE.md:0-0
Timestamp: 2025-12-21T12:21:37.794Z
Learning: Applies to apps/web/**/*.{tsx,jsx} : Use React Hook Form with Zod validation for form handling

Applied to files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx

📚 Learning: 2025-11-25T14:36:51.389Z

Learnt from: CR
Repo: elie222/inbox-zero PR: 0
File: .cursor/rules/form-handling.mdc:0-0
Timestamp: 2025-11-25T14:36:51.389Z
Learning: Applies to **/*Form.{ts,tsx} : Use React Hook Form with Zod for form validation

Applied to files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx

📚 Learning: 2025-11-25T14:38:18.874Z

Learnt from: CR
Repo: elie222/inbox-zero PR: 0
File: .cursor/rules/page-structure.mdc:0-0
Timestamp: 2025-11-25T14:38:18.874Z
Learning: Applies to apps/web/app/(app)/**/*.tsx : If you need to use `onClick` in a component, that component must be a client component and file must start with `use client` directive

Applied to files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx
• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx

📚 Learning: 2025-11-25T14:36:53.147Z

Learnt from: CR
Repo: elie222/inbox-zero PR: 0
File: .cursor/rules/form-handling.mdc:0-0
Timestamp: 2025-11-25T14:36:53.147Z
Learning: Applies to **/*Form.{ts,tsx} : Use React Hook Form with Zod for validation in form components

Applied to files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx

📚 Learning: 2025-11-25T14:36:51.389Z

Learnt from: CR
Repo: elie222/inbox-zero PR: 0
File: .cursor/rules/form-handling.mdc:0-0
Timestamp: 2025-11-25T14:36:51.389Z
Learning: Applies to **/*Form.{ts,tsx} : Validate form inputs before submission using React Hook Form and Zod resolver

Applied to files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx

📚 Learning: 2025-11-25T14:38:23.265Z

Learnt from: CR
Repo: elie222/inbox-zero PR: 0
File: .cursor/rules/page-structure.mdc:0-0
Timestamp: 2025-11-25T14:38:23.265Z
Learning: Applies to apps/web/app/(app)/**/*.{ts,tsx} : If you need to use `onClick` in a component, that component is a client component and file must start with `use client`

Applied to files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx
• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx

📚 Learning: 2025-11-25T14:37:09.306Z

Learnt from: CR
Repo: elie222/inbox-zero PR: 0
File: .cursor/rules/fullstack-workflow.mdc:0-0
Timestamp: 2025-11-25T14:37:09.306Z
Learning: Applies to apps/web/components/**/*Form*.tsx : Use React Hook Form with Zod validation (`zodResolver`) for form handling, with form components using `register`, `handleSubmit`, and error handling from the hook

Applied to files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx

📚 Learning: 2025-11-25T14:39:49.448Z

Learnt from: CR
Repo: elie222/inbox-zero PR: 0
File: .cursor/rules/server-actions.mdc:0-0
Timestamp: 2025-11-25T14:39:49.448Z
Learning: Applies to apps/web/utils/actions/*.ts : Implement all server actions using the `next-safe-action` library with actionClient, actionClientUser, or adminActionClient for type safety and validation

Applied to files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx

📚 Learning: 2025-11-25T14:40:13.649Z

Learnt from: CR
Repo: elie222/inbox-zero PR: 0
File: .cursor/rules/ui-components.mdc:0-0
Timestamp: 2025-11-25T14:40:13.649Z
Learning: Applies to **/*.{tsx,ts,jsx,js} : For text areas in forms, use the `Input` component with `type='text'`, `autosizeTextarea` prop, `rows`, `name`, `placeholder`, `registerProps` from react-hook-form, and `error` props

Applied to files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx

📚 Learning: 2025-12-21T12:21:37.794Z

Learnt from: CR
Repo: elie222/inbox-zero PR: 0
File: apps/web/CLAUDE.md:0-0
Timestamp: 2025-12-21T12:21:37.794Z
Learning: Applies to apps/web/**/*.{tsx,jsx} : Use `result?.serverError` with `toastError` and `toastSuccess` for error handling in forms

Applied to files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx

📚 Learning: 2025-11-25T14:37:09.306Z

Learnt from: CR
Repo: elie222/inbox-zero PR: 0
File: .cursor/rules/fullstack-workflow.mdc:0-0
Timestamp: 2025-11-25T14:37:09.306Z
Learning: Applies to apps/web/components/**/*Form*.tsx : Handle form submission results using `result?.serverError` to show error toasts and `toastSuccess` to show success messages after server action completion

Applied to files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx

📚 Learning: 2025-11-25T14:36:40.146Z

Learnt from: CR
Repo: elie222/inbox-zero PR: 0
File: .cursor/rules/data-fetching.mdc:0-0
Timestamp: 2025-11-25T14:36:40.146Z
Learning: Applies to **/*.{ts,tsx} : Use `result?.serverError` with `toastError` from `@/components/Toast` for error handling in async operations

Applied to files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx

📚 Learning: 2025-11-25T14:36:36.276Z

Learnt from: CR
Repo: elie222/inbox-zero PR: 0
File: .cursor/rules/data-fetching.mdc:0-0
Timestamp: 2025-11-25T14:36:36.276Z
Learning: Applies to **/*.{ts,tsx} : Import error and success toast utilities from '@/components/Toast' for displaying notifications

Applied to files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx

📚 Learning: 2025-11-25T14:36:36.276Z

Learnt from: CR
Repo: elie222/inbox-zero PR: 0
File: .cursor/rules/data-fetching.mdc:0-0
Timestamp: 2025-11-25T14:36:36.276Z
Learning: Applies to **/*.{ts,tsx} : Use `result?.serverError` with `toastError` and `toastSuccess` for error handling in server actions

Applied to files:

• apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx

📚 Learning: 2025-07-08T13:14:07.449Z

Learnt from: elie222
Repo: elie222/inbox-zero PR: 537
File: apps/web/app/(app)/[emailAccountId]/clean/onboarding/page.tsx:30-34
Timestamp: 2025-07-08T13:14:07.449Z
Learning: The clean onboarding page in apps/web/app/(app)/[emailAccountId]/clean/onboarding/page.tsx is intentionally Gmail-specific and should show an error for non-Google email accounts rather than attempting to support multiple providers.

Applied to files:

• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx

📚 Learning: 2025-11-25T14:38:56.992Z

Learnt from: CR
Repo: elie222/inbox-zero PR: 0
File: .cursor/rules/project-structure.mdc:0-0
Timestamp: 2025-11-25T14:38:56.992Z
Learning: Applies to apps/web/components/ui/**/*.tsx : Shadcn UI components are located in `components/ui` directory

Applied to files:

• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx

📚 Learning: 2025-11-25T14:38:07.606Z

Learnt from: CR
Repo: elie222/inbox-zero PR: 0
File: .cursor/rules/llm.mdc:0-0
Timestamp: 2025-11-25T14:38:07.606Z
Learning: Applies to apps/web/utils/ai/**/*.ts : Use XML-like tags to structure data in prompts, remove excessive whitespace and truncate long inputs, and format data consistently across similar LLM functions

Applied to files:

• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx

📚 Learning: 2025-12-21T12:21:37.794Z

Learnt from: CR
Repo: elie222/inbox-zero PR: 0
File: apps/web/CLAUDE.md:0-0
Timestamp: 2025-12-21T12:21:37.794Z
Learning: Applies to apps/web/**/*.{tsx,jsx} : Use shadcn/ui components when available

Applied to files:

• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx

📚 Learning: 2025-11-25T14:40:13.649Z

Learnt from: CR
Repo: elie222/inbox-zero PR: 0
File: .cursor/rules/ui-components.mdc:0-0
Timestamp: 2025-11-25T14:40:13.649Z
Learning: Applies to **/*.{tsx,ts,jsx,js} : Use Shadcn UI and Tailwind for components and styling

Applied to files:

• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx

📚 Learning: 2025-11-25T14:40:15.063Z

Learnt from: CR
Repo: elie222/inbox-zero PR: 0
File: .cursor/rules/ui-components.mdc:0-0
Timestamp: 2025-11-25T14:40:15.063Z
Learning: Applies to **/*.{tsx,ts} : Use Shadcn UI and Tailwind for components and styling

Applied to files:

• apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx

🧬 Code graph analysis (1)

apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx (3)

apps/web/components/new-landing/common/Card.tsx (1)

• Card (67-105)

apps/web/components/Typography.tsx (2)

• TypographyH3 (125-125)
• SectionDescription (127-127)

apps/web/components/ui/item.tsx (5)

• ItemGroup (187-187)
• Item (183-183)
• ItemContent (185-185)
• ItemTitle (189-189)
• ItemDescription (190-190)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (3)

• GitHub Check: Baz Reviewer
• GitHub Check: Macroscope - Correctness Check
• GitHub Check: test

🔇 Additional comments (8)

README.md (1)

69-69: LGTM! Clean documentation addition.

Adding Popsy Illustrations to the Built with section is appropriate and follows the existing format.

apps/web/app/(app)/[emailAccountId]/assistant/settings/WritingStyleSetting.tsx (3)

62-62: LGTM! Controlled dialog state introduced.

The local open state correctly manages the dialog's visibility as a controlled component.

---

82-82: LGTM! Dialog closes on successful save.

This change achieves the PR objective by closing the dialog when the writing style is successfully saved.

---

98-98: LGTM! Dialog is now a controlled component.

The open and onOpenChange props correctly wire the dialog to the local state, enabling programmatic control of the dialog's visibility.

apps/web/app/(app)/[emailAccountId]/briefs/Onboarding.tsx (4)

3-19: LGTM! Import updates align with the UI refactoring.

The import changes correctly reflect the shift from a complex Card structure to a simpler layout using Typography components and direct Item composition.

---

33-48: LGTM! Simplified Card structure with illustration.

The refactoring replaces the nested CardHeader/CardContent structure with a cleaner layout featuring a centered illustration and Typography components. The use of next/image follows project guidelines.

Note: The unoptimized prop is used for the SVG image, which is appropriate since Next.js image optimization typically doesn't provide benefits for SVGs.

---

50-78: LGTM! Flattened ItemGroup structure improves readability.

The refactoring removes the ItemMedia pattern and flattens the Item structure, making each item's composition clearer. The consistent use of text-blue-500 for icons maintains visual coherence.

---

80-99: LGTM! CardFooter usage is appropriate.

The CardFooter retains its functionality while the Card structure is simplified. Using CardFooter without CardHeader is unconventional but aligns with the intentional simplification in this refactoring.

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[cubic-dev-ai]

No issues found across 3 files