Update shadcn/ui components to latest version and fix dialog backdrop blur #2014
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -6,7 +6,7 @@ import { | |
| DialogTitle, | ||
| } from '@/components/ui/dialog'; | ||
| import { Drawer, DrawerContent, DrawerHeader, DrawerTitle } from '@/components/ui/drawer'; | ||
| import { VisuallyHidden } from '@radix-ui/react-visually-hidden'; | ||
| import { type ReactElement } from 'react'; | ||
|
Contributor
There was a problem hiding this comment. 🧹 Nitpick (assertive) Type import nit — import ReactNode directly. Cleaner and consistent with TS strict prefs. -import { type ReactElement } from 'react';
+import type { ReactElement, ReactNode } from 'react';
...
type ResponsiveModalProps = {
- children: React.ReactNode;
+ children: ReactNode;
open: boolean;
onOpenChange: (open: boolean) => void;
};Also applies to: 13-17 🤖 Prompt for AI Agents |
||
| // import { useMedia } from 'react-use'; | ||
|
Contributor
There was a problem hiding this comment. 🧹 Nitpick (assertive) isDesktop hardcoded to true — mobile Drawer path is dead. Intended? If not deliberate, re-enable a media query so this actually responds. Speed is key; correctness too. -// import { useMedia } from 'react-use';
+import { useMedia } from 'react-use';
...
- const isDesktop = true;
+ const isDesktop = useMedia('(min-width: 768px)', true);Verify no hydration warnings and that Drawer renders below 768px. Also applies to: 24-27 🤖 Prompt for AI Agents |
||
|
|
||
|
|
||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -105,7 +105,7 @@ export const SetupInboxDialog = () => { | |
| <OldPhone className="fill-iconLight dark:fill-iconDark h-4 w-4" /> | ||
| </Button> | ||
| </DialogTrigger> | ||
| <DialogContent> | ||
| <DialogTitle>Set up your Inbox assistant</DialogTitle> | ||
| <DialogDescription> | ||
| <span className={showOtpInput ? 'hidden' : 'block'}> | ||
|
|
||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,4 +1,6 @@ | ||
| 'use client'; | ||
|
|
||
| import * as AccordionPrimitive from '@radix-ui/react-accordion'; | ||
| import { ChevronDown } from 'lucide-react'; | ||
| import * as React from 'react'; | ||
|
|
||
|
|
@@ -22,7 +24,7 @@ const AccordionTrigger = React.forwardRef< | |
| <AccordionPrimitive.Trigger | ||
| ref={ref} | ||
| className={cn( | ||
| 'flex flex-1 items-center justify-between py-4 font-medium transition-all hover:underline [&[data-state=open]>svg]:rotate-180', | ||
| className, | ||
| )} | ||
| {...props} | ||
|
|
@@ -40,7 +42,7 @@ const AccordionContent = React.forwardRef< | |
| >(({ className, children, ...props }, ref) => ( | ||
| <AccordionPrimitive.Content | ||
| ref={ref} | ||
| className="data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm transition-all" | ||
| {...props} | ||
| > | ||
| <div className={cn('pb-4 pt-0', className)}>{children}</div> | ||
|
|
||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,7 +1,8 @@ | ||
| import { cva, type VariantProps } from 'class-variance-authority'; | ||
| import * as React from 'react'; | ||
|
|
||
| import { cn } from '@/lib/utils'; | ||
|
|
||
| const alertVariants = cva( | ||
| 'relative w-full rounded-lg border p-4 [&>svg~*]:pl-7 [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground', | ||
| { | ||
|
|
||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,14 +1,17 @@ | ||
| 'use client'; | ||
|
|
||
| import * as AvatarPrimitive from '@radix-ui/react-avatar'; | ||
| import * as React from 'react'; | ||
|
|
||
| import { cn } from '@/lib/utils'; | ||
|
|
||
| const Avatar = React.forwardRef< | ||
| React.ElementRef<typeof AvatarPrimitive.Root>, | ||
| React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root> | ||
| >(({ className, ...props }, ref) => ( | ||
| <AvatarPrimitive.Root | ||
| ref={ref} | ||
| className={cn('relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full', className)} | ||
| {...props} | ||
| /> | ||
| )); | ||
|
|
@@ -32,7 +35,10 @@ const AvatarFallback = React.forwardRef< | |
| >(({ className, ...props }, ref) => ( | ||
| <AvatarPrimitive.Fallback | ||
| ref={ref} | ||
| className={cn( | ||
| 'bg-muted flex h-full w-full items-center justify-center rounded-full', | ||
| className, | ||
| )} | ||
| {...props} | ||
| /> | ||
| )); | ||
|
|
||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change | ||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
|
|
@@ -4,21 +4,16 @@ import * as React from 'react'; | |||||||||||||
| import { cn } from '@/lib/utils'; | ||||||||||||||
|
|
||||||||||||||
| const badgeVariants = cva( | ||||||||||||||
| 'inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2', | ||||||||||||||
| { | ||||||||||||||
|
Comment on lines
+7
to
8
Contributor
There was a problem hiding this comment. 🧹 Nitpick (assertive) 🛠️ Refactor suggestion Replace focus:outline-none → focus-visible:outline-hidden and wrap to ≤100 chars. - 'inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2',
+ 'inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold',
+ 'transition-colors focus-visible:outline-hidden focus-visible:ring-2',
+ 'focus-visible:ring-ring focus-visible:ring-offset-2',📝 Committable suggestion
Suggested change
🤖 Prompt for AI Agents |
||||||||||||||
| variants: { | ||||||||||||||
| variant: { | ||||||||||||||
| default: 'border-transparent bg-primary text-primary-foreground hover:bg-primary/80', | ||||||||||||||
| secondary: | ||||||||||||||
| 'border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80', | ||||||||||||||
| destructive: | ||||||||||||||
| 'border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80', | ||||||||||||||
| outline: 'text-foreground', | ||||||||||||||
| }, | ||||||||||||||
| }, | ||||||||||||||
| defaultVariants: { | ||||||||||||||
|
|
||||||||||||||
Oops, something went wrong.
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
🛠️ Refactor suggestion
Unify the sidebar token — single source of truth.
You introduced
--sidebarbut the theme still maps to--sidebar-background. Wire it up or delete the new var to avoid dead config.Apply this diff to use the new token across the theme:
If other files still consume
--sidebar-background, keep both and plan a follow-up sweep.Also applies to: 118-118, 166-174
🤖 Prompt for AI Agents