Fix the `DialogContent/DialogTitle` error displayed in the console.

webview-ui/src/components/settings/ApiConfigManager.tsx

@@ -3,7 +3,7 @@ import { memo, useEffect, useRef, useState } from "react"
 import { ApiConfigMeta } from "../../../../src/shared/ExtensionMessage"
 import { Dropdown } from "vscrui"
 import type { DropdownOption } from "vscrui"
-import { Dialog, DialogContent } from "../ui/dialog"
+import { Dialog, DialogContent, DialogTitle } from "../ui/dialog"
 
 interface ApiConfigManagerProps {
 	currentApiConfigName?: string
@@ -298,9 +298,7 @@ const ApiConfigManager = ({
 					}}
 					aria-labelledby="new-profile-title">
 					<DialogContent className="p-4 max-w-sm">
-						<h2 id="new-profile-title" className="text-lg font-semibold mb-4">
-							New Configuration Profile
-						</h2>
+						<DialogTitle>New Configuration Profile</DialogTitle>
 						<button className="absolute right-4 top-4" aria-label="Close dialog" onClick={resetCreateState}>
 							<span className="codicon codicon-close" />
 						</button>

webview-ui/src/components/settings/__tests__/ApiConfigManager.test.tsx

@@ -41,6 +41,7 @@ jest.mock("@/components/ui/dialog", () => ({
 		</div>
 	),
 	DialogContent: ({ children }: any) => <div data-testid="dialog-content">{children}</div>,
+	DialogTitle: ({ children }: any) => <div data-testid="dialog-title">{children}</div>,
 }))
 
 describe("ApiConfigManager", () => {