Skip to content

Commit 9d40b13

Browse files
committed
DX: Improved auto imports (#6950)
Taken from: https://x.com/dillionverma/status/1917639091228926311
1 parent bda0f3e commit 9d40b13

File tree

72 files changed

+238
-213
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

72 files changed

+238
-213
lines changed

.vscode/settings.json

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,12 @@
99
"typescript.preferences.autoImportFileExcludePatterns": [
1010
"./packages/thirdweb/src/exports"
1111
],
12+
"typescript.preferences.autoImportSpecifierExcludeRegexes": [
13+
"@radix-ui",
14+
"next/router",
15+
"next/dist",
16+
"^lucide-react/dist/lucide-react.suffixed$"
17+
],
1218
"typescript.tsdk": "node_modules/typescript/lib",
1319
"[typescriptreact]": {
1420
"editor.defaultFormatter": "biomejs.biome"

apps/dashboard/lucide-react.d.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
declare module "lucide-react" {
2+
export * from "lucide-react/dist/lucide-react.suffixed";
3+
}

apps/dashboard/src/@/components/blocks/multi-select.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import {
99
} from "@/components/ui/popover";
1010
import { Separator } from "@/components/ui/separator";
1111
import { cn } from "@/lib/utils";
12-
import { CheckIcon, ChevronDown, SearchIcon, XIcon } from "lucide-react";
12+
import { CheckIcon, ChevronDownIcon, SearchIcon, XIcon } from "lucide-react";
1313
import {
1414
forwardRef,
1515
useCallback,
@@ -201,15 +201,15 @@ export const MultiSelect = forwardRef<HTMLButtonElement, MultiSelectProps>(
201201
orientation="vertical"
202202
className="flex h-full min-h-6"
203203
/>
204-
<ChevronDown className="h-4 cursor-pointer text-muted-foreground" />
204+
<ChevronDownIcon className="h-4 cursor-pointer text-muted-foreground" />
205205
</div>
206206
</div>
207207
) : (
208208
<div className="flex w-full items-center justify-between">
209209
<span className="text-muted-foreground text-sm">
210210
{placeholder}
211211
</span>
212-
<ChevronDown className="h-4 cursor-pointer text-muted-foreground" />
212+
<ChevronDownIcon className="h-4 cursor-pointer text-muted-foreground" />
213213
</div>
214214
)}
215215
</Button>

apps/dashboard/src/@/components/blocks/select-with-search.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import {
88
PopoverTrigger,
99
} from "@/components/ui/popover";
1010
import { cn } from "@/lib/utils";
11-
import { CheckIcon, ChevronDown, SearchIcon } from "lucide-react";
11+
import { CheckIcon, ChevronDownIcon, SearchIcon } from "lucide-react";
1212
import React, { useRef, useMemo, useEffect } from "react";
1313
import { useShowMore } from "../../lib/useShowMore";
1414
import { ScrollShadow } from "../ui/ScrollShadow/ScrollShadow";
@@ -131,7 +131,7 @@ export const SelectWithSearch = React.forwardRef<
131131
>
132132
{selectedOption?.label || placeholder}
133133
</span>
134-
<ChevronDown className="size-4 cursor-pointer text-muted-foreground" />
134+
<ChevronDownIcon className="size-4 cursor-pointer text-muted-foreground" />
135135
</div>
136136
</Button>
137137
</PopoverTrigger>

apps/dashboard/src/@/components/blocks/wallet-address.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import {
88
import { useThirdwebClient } from "@/constants/thirdweb.client";
99
import { resolveSchemeWithErrorHandler } from "@/lib/resolveSchemeWithErrorHandler";
1010
import { useClipboard } from "hooks/useClipboard";
11-
import { Check, Copy, XIcon } from "lucide-react";
11+
import { CheckIcon, CopyIcon, XIcon } from "lucide-react";
1212
import { useMemo } from "react";
1313
import { type ThirdwebClient, isAddress } from "thirdweb";
1414
import { ZERO_ADDRESS } from "thirdweb";
@@ -104,9 +104,9 @@ export function WalletAddress(props: {
104104
className="flex items-center gap-2"
105105
>
106106
{hasCopied ? (
107-
<Check className="h-4 w-4" />
107+
<CheckIcon className="h-4 w-4" />
108108
) : (
109-
<Copy className="h-4 w-4" />
109+
<CopyIcon className="h-4 w-4" />
110110
)}
111111
{hasCopied ? "Copied!" : "Copy"}
112112
</Button>

apps/dashboard/src/@/components/ui/DatePickerWithRange.tsx

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -9,11 +9,7 @@ import {
99
} from "@/components/ui/popover";
1010
import { cn } from "@/lib/utils";
1111
import { format, isBefore } from "date-fns";
12-
import {
13-
Calendar as CalendarIcon,
14-
CalendarX2Icon,
15-
ChevronDownIcon,
16-
} from "lucide-react";
12+
import { CalendarIcon, CalendarX2Icon, ChevronDownIcon } from "lucide-react";
1713
import React from "react";
1814
import { DynamicHeight } from "./DynamicHeight";
1915
import { TabButtons } from "./tabs";

apps/dashboard/src/@/components/ui/accordion.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
"use client";
22

33
import * as AccordionPrimitive from "@radix-ui/react-accordion";
4-
import { ChevronDown } from "lucide-react";
4+
import { ChevronDownIcon } from "lucide-react";
55
import * as React from "react";
66

77
import { cn } from "@/lib/utils";
@@ -34,7 +34,7 @@ const AccordionTrigger = React.forwardRef<
3434
{...props}
3535
>
3636
{children}
37-
<ChevronDown className="h-4 w-4 shrink-0 transition-transform duration-200" />
37+
<ChevronDownIcon className="h-4 w-4 shrink-0 transition-transform duration-200" />
3838
</AccordionPrimitive.Trigger>
3939
</AccordionPrimitive.Header>
4040
));

apps/dashboard/src/@/components/ui/breadcrumb.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { Slot } from "@radix-ui/react-slot";
2-
import { ChevronRight, MoreHorizontal } from "lucide-react";
2+
import { ChevronRightIcon, MoreHorizontalIcon } from "lucide-react";
33
import * as React from "react";
44

55
import { cn } from "@/lib/utils";
@@ -84,7 +84,7 @@ const BreadcrumbSeparator = ({
8484
className={cn("[&>svg]:size-3.5", className)}
8585
{...props}
8686
>
87-
{children ?? <ChevronRight />}
87+
{children ?? <ChevronRightIcon />}
8888
</li>
8989
);
9090
BreadcrumbSeparator.displayName = "BreadcrumbSeparator";
@@ -102,7 +102,7 @@ const BreadcrumbEllipsis = ({
102102
)}
103103
{...props}
104104
>
105-
<MoreHorizontal className="h-4 w-4" />
105+
<MoreHorizontalIcon className="h-4 w-4" />
106106
<span className="sr-only">More</span>
107107
</span>
108108
);

apps/dashboard/src/@/components/ui/calendar.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
"use client";
22

3-
import { ChevronLeft, ChevronRight } from "lucide-react";
3+
import { ChevronLeftIcon, ChevronRightIcon } from "lucide-react";
44
import type * as React from "react";
55
import { DayPicker } from "react-day-picker";
66

@@ -54,8 +54,8 @@ function Calendar({
5454
...classNames,
5555
}}
5656
components={{
57-
IconLeft: () => <ChevronLeft className="h-4 w-4" />,
58-
IconRight: () => <ChevronRight className="h-4 w-4" />,
57+
IconLeft: () => <ChevronLeftIcon className="size-4" />,
58+
IconRight: () => <ChevronRightIcon className="size-4" />,
5959
}}
6060
{...props}
6161
/>

apps/dashboard/src/@/components/ui/checkbox.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
"use client";
22

33
import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
4-
import { Check } from "lucide-react";
4+
import { CheckIcon } from "lucide-react";
55
import * as React from "react";
66

77
import { cn } from "@/lib/utils";
@@ -21,7 +21,7 @@ const Checkbox = React.forwardRef<
2121
<CheckboxPrimitive.Indicator
2222
className={cn("flex items-center justify-center text-current")}
2323
>
24-
<Check className="h-4 w-4" />
24+
<CheckIcon className="size-4" />
2525
</CheckboxPrimitive.Indicator>
2626
</CheckboxPrimitive.Root>
2727
));

apps/dashboard/src/@/components/ui/dialog.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
"use client";
22

33
import * as DialogPrimitive from "@radix-ui/react-dialog";
4-
import { X } from "lucide-react";
4+
import { XIcon } from "lucide-react";
55
import * as React from "react";
66

77
import { cn } from "@/lib/utils";
@@ -65,7 +65,7 @@ const DialogContent = React.forwardRef<
6565
dialogCloseClassName,
6666
)}
6767
>
68-
<X className="h-4 w-4" />
68+
<XIcon className="size-4" />
6969
<span className="sr-only">Close</span>
7070
</DialogPrimitive.Close>
7171
</DialogPrimitive.Content>

apps/dashboard/src/@/components/ui/dropdown-menu.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
"use client";
22

33
import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
4-
import { Check, ChevronRight, Circle } from "lucide-react";
4+
import { CheckIcon, ChevronRightIcon, CircleIcon } from "lucide-react";
55
import * as React from "react";
66

77
import { cn } from "@/lib/utils";
@@ -34,7 +34,7 @@ const DropdownMenuSubTrigger = React.forwardRef<
3434
{...props}
3535
>
3636
{children}
37-
<ChevronRight className="ml-auto h-4 w-4" />
37+
<ChevronRightIcon className="ml-auto size-4" />
3838
</DropdownMenuPrimitive.SubTrigger>
3939
));
4040
DropdownMenuSubTrigger.displayName =
@@ -107,7 +107,7 @@ const DropdownMenuCheckboxItem = React.forwardRef<
107107
>
108108
<span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
109109
<DropdownMenuPrimitive.ItemIndicator>
110-
<Check className="h-4 w-4" />
110+
<CheckIcon className="size-4" />
111111
</DropdownMenuPrimitive.ItemIndicator>
112112
</span>
113113
{children}
@@ -130,7 +130,7 @@ const DropdownMenuRadioItem = React.forwardRef<
130130
>
131131
<span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
132132
<DropdownMenuPrimitive.ItemIndicator>
133-
<Circle className="h-2 w-2 fill-current" />
133+
<CircleIcon className="size-2 fill-current" />
134134
</DropdownMenuPrimitive.ItemIndicator>
135135
</span>
136136
{children}

apps/dashboard/src/@/components/ui/input-otp.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
"use client";
22

33
import { OTPInput, OTPInputContext } from "input-otp";
4-
import { Dot } from "lucide-react";
4+
import { DotIcon } from "lucide-react";
55
import * as React from "react";
66

77
import { cn } from "@/lib/utils";
@@ -65,7 +65,7 @@ const InputOTPSeparator = React.forwardRef<
6565
>(({ ...props }, ref) => (
6666
// biome-ignore lint/a11y/useFocusableInteractive: pure shadcn component - it works
6767
<div ref={ref} role="separator" {...props}>
68-
<Dot />
68+
<DotIcon />
6969
</div>
7070
));
7171
InputOTPSeparator.displayName = "InputOTPSeparator";

apps/dashboard/src/@/components/ui/pagination.tsx

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,8 @@
1-
import { ChevronLeft, ChevronRight, MoreHorizontal } from "lucide-react";
1+
import {
2+
ChevronLeftIcon,
3+
ChevronRightIcon,
4+
MoreHorizontalIcon,
5+
} from "lucide-react";
26
import * as React from "react";
37

48
import { Button, type ButtonProps } from "@/components/ui/button";
@@ -66,7 +70,7 @@ const PaginationPrevious = ({
6670
className={cn("h-10 gap-1 pl-2.5", className)}
6771
{...props}
6872
>
69-
<ChevronLeft className="h-4 w-4" />
73+
<ChevronLeftIcon className="size-4" />
7074
<span className="max-sm:hidden">Previous</span>
7175
</PaginationLink>
7276
);
@@ -83,7 +87,7 @@ const PaginationNext = ({
8387
{...props}
8488
>
8589
<span className="max-sm:hidden">Next</span>
86-
<ChevronRight className="h-4 w-4" />
90+
<ChevronRightIcon className="size-4" />
8791
</PaginationLink>
8892
);
8993
PaginationNext.displayName = "PaginationNext";
@@ -100,7 +104,7 @@ const PaginationEllipsis = ({
100104
)}
101105
{...props}
102106
>
103-
<MoreHorizontal className="h-4 w-4" />
107+
<MoreHorizontalIcon className="size-4" />
104108
<span className="sr-only">More pages</span>
105109
</span>
106110
);

apps/dashboard/src/@/components/ui/radio-group.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
"use client";
22

33
import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
4-
import { Circle } from "lucide-react";
4+
import { CircleIcon } from "lucide-react";
55
import * as React from "react";
66

77
import { cn } from "@/lib/utils";
@@ -35,7 +35,7 @@ const RadioGroupItem = React.forwardRef<
3535
{...props}
3636
>
3737
<RadioGroupPrimitive.Indicator className="flex items-center justify-center">
38-
<Circle className="h-2.5 w-2.5 fill-current text-current" />
38+
<CircleIcon className="size-2.5 fill-current text-current" />
3939
</RadioGroupPrimitive.Indicator>
4040
</RadioGroupPrimitive.Item>
4141
);
@@ -59,11 +59,11 @@ const RadioGroupItemButton = React.forwardRef<
5959
<div className="flex aspect-square h-4 w-4 items-center justify-center rounded-full border text-inverted ring-offset-background transition-all focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 group-hover:border-foreground/25 group-data-[state=checked]:border-inverted">
6060
{/* Show on checked */}
6161
<RadioGroupPrimitive.Indicator className="flex items-center justify-center rounded-full transition-all">
62-
<Circle className="h-2 w-2 fill-current text-current" />
62+
<CircleIcon className="size-2 fill-current text-current" />
6363
</RadioGroupPrimitive.Indicator>
6464
{/* Show on hover */}
6565
<div className="hidden items-center justify-center rounded-full text-foreground/25 transition-all group-hover:flex group-data-[state=checked]:hidden">
66-
<Circle className="h-2 w-2 fill-current text-current" />
66+
<CircleIcon className="size-2 fill-current text-current" />
6767
</div>
6868
</div>
6969
<Label className="cursor-pointer">{props.children}</Label>

apps/dashboard/src/@/components/ui/select.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
"use client";
22

33
import * as SelectPrimitive from "@radix-ui/react-select";
4-
import { Check, ChevronDown } from "lucide-react";
4+
import { CheckIcon, ChevronDownIcon } from "lucide-react";
55
import * as React from "react";
66

77
import { cn } from "@/lib/utils";
@@ -28,7 +28,7 @@ const SelectTrigger = React.forwardRef<
2828
>
2929
{children}
3030
<SelectPrimitive.Icon asChild>
31-
<ChevronDown className={cn("h-4 w-4 opacity-50", chevronClassName)} />
31+
<ChevronDownIcon className={cn("h-4 w-4 opacity-50", chevronClassName)} />
3232
</SelectPrimitive.Icon>
3333
</SelectPrimitive.Trigger>
3434
));
@@ -127,7 +127,7 @@ const SelectItem = React.forwardRef<
127127
>
128128
<span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
129129
<SelectPrimitive.ItemIndicator>
130-
<Check className="h-4 w-4" />
130+
<CheckIcon className="size-4" />
131131
</SelectPrimitive.ItemIndicator>
132132
</span>
133133

apps/dashboard/src/@/components/ui/sheet.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
import * as SheetPrimitive from "@radix-ui/react-dialog";
44
import { type VariantProps, cva } from "class-variance-authority";
5-
import { X } from "lucide-react";
5+
import { XIcon } from "lucide-react";
66
import * as React from "react";
77

88
import { cn } from "@/lib/utils";
@@ -66,7 +66,7 @@ const SheetContent = React.forwardRef<
6666
>
6767
{children}
6868
<SheetPrimitive.Close className="absolute top-4 right-4 rounded-sm border-border opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary">
69-
<X className="h-4 w-4" />
69+
<XIcon className="size-4" />
7070
<span className="sr-only">Close</span>
7171
</SheetPrimitive.Close>
7272
</SheetPrimitive.Content>

apps/dashboard/src/@/components/ui/sidebar.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ import { useIsMobile } from "@/hooks/use-mobile";
2121
import { cn } from "@/lib/utils";
2222
import { Slot } from "@radix-ui/react-slot";
2323
import { type VariantProps, cva } from "class-variance-authority";
24-
import { PanelLeft } from "lucide-react";
24+
import { PanelLeftIcon } from "lucide-react";
2525
import * as React from "react";
2626

2727
const SIDEBAR_COOKIE_NAME = "sidebar_state";
@@ -288,7 +288,7 @@ const SidebarTrigger = React.forwardRef<
288288
}}
289289
{...props}
290290
>
291-
<PanelLeft />
291+
<PanelLeftIcon />
292292
<span className="sr-only">Toggle Sidebar</span>
293293
</Button>
294294
);

apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/(chainPage)/components/client/NextSteps.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
"use client";
22
import { useTrack } from "hooks/analytics/useTrack";
3-
import { FileText } from "lucide-react";
3+
import { FileTextIcon } from "lucide-react";
44
import Link from "next/link";
55
import type { ChainMetadata } from "thirdweb/chains";
66
import { SectionTitle } from "../server/SectionTitle";
@@ -14,7 +14,7 @@ export default function NextSteps(props: { chain: ChainMetadata }) {
1414
<SectionTitle title="Next Steps" />
1515
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2 md:grid-cols-3">
1616
<div className="relative flex gap-3 rounded-lg border bg-card p-4 pr-8 transition-colors hover:border-active-border">
17-
<FileText className="mt-0.5 size-5 shrink-0" />
17+
<FileTextIcon className="mt-0.5 size-5 shrink-0" />
1818
<div>
1919
<h3 className="mb-1.5 font-medium">
2020
<Link

0 commit comments

Comments
 (0)