Skip to content

Commit aaffd33

Browse files
committed
chore(browser-ext): update dependencies and enhance AI provider integration
- Updated @biomejs/biome and other dependencies to version 2.3.8. - Refactored AI provider integration to support multiple providers (OpenAI, Anthropic, Google). - Enhanced UI components with cursor pointer styles for better user experience. - Added functionality to open the side panel when the extension icon is clicked. - Improved type safety in storage adapter and chat configuration. - Updated various packages to their latest versions for better performance and compatibility.
1 parent bcd6002 commit aaffd33

File tree

22 files changed

+1529
-1592
lines changed

22 files changed

+1529
-1592
lines changed

biome.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"root": true,
3-
"$schema": "https://biomejs.dev/schemas/2.3.2/schema.json",
3+
"$schema": "https://biomejs.dev/schemas/2.3.8/schema.json",
44
"formatter": {
55
"enabled": true,
66
"indentStyle": "space",

package.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -23,12 +23,12 @@
2323
"typecheck": "pnpm -r --if-present typecheck"
2424
},
2525
"devDependencies": {
26-
"@biomejs/biome": "^2.3.2",
26+
"@biomejs/biome": "^2.3.8",
2727
"@j178/prek": "^0.2.19",
2828
"@types/node": "^24.10.1",
29-
"@typescript/native-preview": "^7.0.0-dev.20251201.1",
30-
"@vitest/coverage-v8": "^4.0.6",
29+
"@typescript/native-preview": "7.0.0-dev.20251201.1",
30+
"@vitest/coverage-v8": "^4.0.14",
3131
"typescript": "^5.9.3",
32-
"vitest": "^4.0.6"
32+
"vitest": "^4.0.14"
3333
}
3434
}

packages/browser-ext/components/ui/button.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import type * as React from "react";
55
import { cn } from "~/lib/utils";
66

77
const buttonVariants = cva(
8-
"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
8+
"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all cursor-pointer disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
99
{
1010
variants: {
1111
variant: {

packages/browser-ext/components/ui/dialog.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,7 @@ function DialogContent({
6767
{showCloseButton && (
6868
<DialogPrimitive.Close
6969
data-slot="dialog-close"
70-
className="ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4"
70+
className="ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden cursor-pointer disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4"
7171
>
7272
<XIcon />
7373
<span className="sr-only">Close</span>

packages/browser-ext/components/ui/dropdown-menu.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -74,7 +74,7 @@ function DropdownMenuItem({
7474
data-inset={inset}
7575
data-variant={variant}
7676
className={cn(
77-
"focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
77+
"focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
7878
className,
7979
)}
8080
{...props}
@@ -92,7 +92,7 @@ function DropdownMenuCheckboxItem({
9292
<DropdownMenuPrimitive.CheckboxItem
9393
data-slot="dropdown-menu-checkbox-item"
9494
className={cn(
95-
"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
95+
"focus:bg-accent focus:text-accent-foreground relative flex cursor-pointer items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
9696
className,
9797
)}
9898
checked={checked}
@@ -128,7 +128,7 @@ function DropdownMenuRadioItem({
128128
<DropdownMenuPrimitive.RadioItem
129129
data-slot="dropdown-menu-radio-item"
130130
className={cn(
131-
"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
131+
"focus:bg-accent focus:text-accent-foreground relative flex cursor-pointer items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
132132
className,
133133
)}
134134
{...props}
@@ -211,7 +211,7 @@ function DropdownMenuSubTrigger({
211211
data-slot="dropdown-menu-sub-trigger"
212212
data-inset={inset}
213213
className={cn(
214-
"focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8",
214+
"focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-pointer items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8",
215215
className,
216216
)}
217217
{...props}

packages/browser-ext/components/ui/select.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ function SelectTrigger({
3535
data-slot="select-trigger"
3636
data-size={size}
3737
className={cn(
38-
"border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
38+
"border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] cursor-pointer disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
3939
className,
4040
)}
4141
{...props}
@@ -105,7 +105,7 @@ function SelectItem({
105105
<SelectPrimitive.Item
106106
data-slot="select-item"
107107
className={cn(
108-
"focus:bg-accent focus:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
108+
"focus:bg-accent focus:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex w-full cursor-pointer items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
109109
className,
110110
)}
111111
{...props}

packages/browser-ext/package.json

Lines changed: 29 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -30,58 +30,60 @@
3030
"host-access-config.json"
3131
],
3232
"dependencies": {
33-
"@ai-sdk/openai": "^2.0.72",
33+
"@ai-sdk/anthropic": "^2.0.51",
34+
"@ai-sdk/google": "^2.0.44",
35+
"@ai-sdk/openai": "^2.0.75",
3436
"@aipexstudio/aipex-core": "workspace:*",
35-
"@modelcontextprotocol/sdk": "^1.17.4",
36-
"@radix-ui/react-avatar": "^1.1.10",
37+
"@modelcontextprotocol/sdk": "^1.23.0",
38+
"@radix-ui/react-avatar": "^1.1.11",
3739
"@radix-ui/react-collapsible": "^1.1.12",
3840
"@radix-ui/react-dialog": "^1.1.15",
3941
"@radix-ui/react-dropdown-menu": "^2.1.16",
4042
"@radix-ui/react-hover-card": "^1.1.15",
41-
"@radix-ui/react-progress": "^1.1.7",
43+
"@radix-ui/react-progress": "^1.1.8",
4244
"@radix-ui/react-scroll-area": "^1.2.10",
4345
"@radix-ui/react-select": "^2.2.6",
44-
"@radix-ui/react-slot": "^1.2.3",
46+
"@radix-ui/react-slot": "^1.2.4",
4547
"@radix-ui/react-tooltip": "^1.2.8",
4648
"@radix-ui/react-use-controllable-state": "^1.2.2",
47-
"ahooks": "^3.9.5",
48-
"ai": "^5.0.59",
49-
"assistant-ui": "^0.0.56",
49+
"ahooks": "^3.9.6",
50+
"ai": "^5.0.105",
51+
"assistant-ui": "^0.0.67",
5052
"bip39": "^3.1.0",
5153
"class-variance-authority": "^0.7.1",
5254
"clsx": "^2.1.1",
5355
"cmdk": "^1.1.1",
5456
"embla-carousel-react": "^8.6.0",
55-
"lucide-react": "^0.542.0",
56-
"markdown-to-jsx": "^7.7.10",
57+
"lucide-react": "^0.555.0",
58+
"markdown-to-jsx": "^9.3.0",
5759
"nanoid": "^5.1.6",
5860
"react": "19.2.0",
5961
"react-dom": "19.2.0",
60-
"react-syntax-highlighter": "^15.6.1",
62+
"react-syntax-highlighter": "^16.1.0",
6163
"remark-gfm": "^4.0.1",
62-
"streamdown": "^1.3.0",
63-
"tailwind-merge": "^3.3.1",
64-
"tailwindcss": "4.1.13",
64+
"streamdown": "^1.6.9",
65+
"tailwind-merge": "^3.4.0",
66+
"tailwindcss": "4.1.17",
6567
"tokenlens": "^1.3.1",
6668
"tw-animate-css": "^1.4.0",
6769
"use-stick-to-bottom": "^1.1.1",
68-
"zod": "^3.25.40"
70+
"zod": "^4.1.13"
6971
},
7072
"devDependencies": {
71-
"@crxjs/vite-plugin": "^2.2.0",
72-
"@tailwindcss/postcss": "^4.1.14",
73-
"@testing-library/jest-dom": "^6.6.3",
73+
"@crxjs/vite-plugin": "^2.2.1",
74+
"@tailwindcss/postcss": "^4.1.17",
75+
"@testing-library/jest-dom": "^6.9.1",
7476
"@testing-library/react": "^16.3.0",
75-
"@types/chrome": "0.0.258",
76-
"@types/react": "19.2.0",
77-
"@types/react-dom": "19.2.0",
77+
"@types/chrome": "0.1.31",
78+
"@types/react": "19.2.7",
79+
"@types/react-dom": "19.2.3",
7880
"@types/react-syntax-highlighter": "^15.5.13",
79-
"@vitejs/plugin-react": "^5.1.0",
80-
"jsdom": "^26.1.0",
81-
"postcss": "8.4.33",
82-
"postcss-modules": "^4.3.0",
81+
"@vitejs/plugin-react": "^5.1.1",
82+
"jsdom": "^27.2.0",
83+
"postcss": "8.5.6",
84+
"postcss-modules": "^6.0.1",
8385
"tailwindcss-cli": "^0.1.2",
84-
"vite": "^7.1.8",
85-
"vite-plugin-static-copy": "^3.1.3"
86+
"vite": "^7.2.6",
87+
"vite-plugin-static-copy": "^3.1.4"
8688
}
8789
}

packages/browser-ext/src/adapters/storage-adapter.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -91,8 +91,8 @@ export class Storage {
9191
) => {
9292
if (areaName === "local" && changes[key]) {
9393
callback({
94-
newValue: changes[key].newValue,
95-
oldValue: changes[key].oldValue,
94+
newValue: changes[key].newValue as T | undefined,
95+
oldValue: changes[key].oldValue as T | undefined,
9696
});
9797
}
9898
};

packages/browser-ext/src/background.ts

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,13 @@
33
* Handles extension lifecycle events and keyboard commands
44
*/
55

6+
// Open side panel when extension icon is clicked
7+
chrome.action.onClicked.addListener((tab) => {
8+
if (tab.id) {
9+
chrome.sidePanel.open({ tabId: tab.id });
10+
}
11+
});
12+
613
// Listen for keyboard command to open AIPex
714
chrome.commands.onCommand.addListener((command) => {
815
if (command === "open-aipex") {

packages/browser-ext/src/components/chatbot/components/settings-dialog.tsx

Lines changed: 36 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ import {
1717
SelectValue,
1818
} from "@/components/ui/select";
1919
import { cn } from "~/lib/utils";
20-
import type { ChatSettings, SettingsDialogProps } from "~/types";
20+
import type { AIProvider, ChatSettings, SettingsDialogProps } from "~/types";
2121
import { useComponentsContext, useConfigContext } from "../core/context";
2222

2323
type SettingsTab = "general" | "security";
@@ -40,6 +40,12 @@ const DEFAULT_THEMES = [
4040
{ value: "system", label: "System" },
4141
];
4242

43+
const DEFAULT_PROVIDERS: Array<{ value: AIProvider; label: string }> = [
44+
{ value: "openai", label: "OpenAI" },
45+
{ value: "anthropic", label: "Anthropic" },
46+
{ value: "google", label: "Google" },
47+
];
48+
4349
/**
4450
* Default SettingsDialog component
4551
*/
@@ -101,7 +107,7 @@ export function DefaultSettingsDialog({
101107
type="button"
102108
onClick={() => setActiveTab("general")}
103109
className={cn(
104-
"px-4 py-2 text-sm font-medium border-b-2 transition-colors",
110+
"px-4 py-2 text-sm font-medium border-b-2 transition-colors cursor-pointer",
105111
activeTab === "general"
106112
? "border-primary text-primary"
107113
: "border-transparent text-muted-foreground hover:text-foreground",
@@ -113,7 +119,7 @@ export function DefaultSettingsDialog({
113119
type="button"
114120
onClick={() => setActiveTab("security")}
115121
className={cn(
116-
"px-4 py-2 text-sm font-medium border-b-2 transition-colors",
122+
"px-4 py-2 text-sm font-medium border-b-2 transition-colors cursor-pointer",
117123
activeTab === "security"
118124
? "border-primary text-primary"
119125
: "border-transparent text-muted-foreground hover:text-foreground",
@@ -175,6 +181,33 @@ export function DefaultSettingsDialog({
175181
</Select>
176182
</div>
177183

184+
{/* AI Provider */}
185+
<div className="space-y-2">
186+
<label
187+
htmlFor="ai-provider-select"
188+
className="text-sm font-medium"
189+
>
190+
AI Provider
191+
</label>
192+
<Select
193+
value={tempSettings.aiProvider ?? "openai"}
194+
onValueChange={(value) =>
195+
updateTempSetting("aiProvider", value as AIProvider)
196+
}
197+
>
198+
<SelectTrigger id="ai-provider-select" className="w-full">
199+
<SelectValue />
200+
</SelectTrigger>
201+
<SelectContent>
202+
{DEFAULT_PROVIDERS.map((provider) => (
203+
<SelectItem key={provider.value} value={provider.value}>
204+
{provider.label}
205+
</SelectItem>
206+
))}
207+
</SelectContent>
208+
</Select>
209+
</div>
210+
178211
{/* AI Host */}
179212
<div className="space-y-2">
180213
<label htmlFor="ai-host-input" className="text-sm font-medium">

0 commit comments

Comments
 (0)