Dashboard: Remove chakra provider from team/settings/notifications page (#7479)

<!--

## title your PR with this format: "[SDK/Dashboard/Portal] Feature/Fix: Concise title for the changes"

If you did not copy the branch name from Linear, paste the issue tag here (format is TEAM-0000):

## Notes for the reviewer

Anything important to call out? Be sure to also clarify these in your comments.

## How to test

Unit tests, playground, etc.

-->

<!-- start pr-codex -->

---

## PR-Codex overview
This PR focuses on refactoring the notifications settings page by renaming components, updating the layout, and improving the user interface for managing notifications.

### Detailed summary
- Deleted `SettingsNotificationsPage` and replaced it with `Notifications`.
- Updated the main page layout to include a header and description for notifications.
- Enhanced the `Notifications` component with a new background and border styling.
- Added a separator line in the `Notifications` component.
- Removed unnecessary wrapper from `SettingSwitch` layout.

> ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your question}`

<!-- end pr-codex -->

Author: MananTank

apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/members/TeamMembersSettingsPage.tsx

@@ -27,7 +27,7 @@ export function TeamMembersSettingsPage(props: {
   return (
     <div>
       <h2 className="font-semibold text-2xl tracking-tight">Members</h2>
-      <p className="text-muted-foreground text-sm">
+      <p className="text-muted-foreground">
         Manage team members and invitations
       </p>
 

apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/notifications/Notifications.tsx

@@ -37,14 +37,16 @@ export const Notifications: React.FC<NotificationsProps> = ({ account }) => {
   };
 
   return (
-    <div>
+    <div className="p-4 bg-card border rounded-lg">
       <SettingSwitch
         checked={preferences?.billing === "email"}
         description="Approaching and exceeding usage credits"
         label="Reminders"
         onCheckedChange={(v) => handleChange("billing", v)}
       />
 
+      <div className="border-t border-dashed my-4" />
+
       <SettingSwitch
         checked={preferences?.updates === "email"}
         description="New features and key product updates"
@@ -63,7 +65,7 @@ function SettingSwitch(props: {
 }) {
   const id = useId();
   return (
-    <div className="flex items-center justify-between gap-6 border-border border-b py-6">
+    <div className="flex items-center justify-between gap-6">
       <div>
         <Label className="text-foreground text-lg" htmlFor={id}>
           {props.label}

apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/notifications/NotificationsPage.tsx

@@ -1,6 +1,5 @@
-import { ChakraProviderSetup } from "chakra/ChakraProviderSetup";
 import { getValidAccount } from "../../../../../../account/settings/getAccount";
-import { SettingsNotificationsPage } from "./NotificationsPage";
+import { Notifications } from "./Notifications";
 
 export default async function Page(props: {
   params: Promise<{
@@ -13,8 +12,15 @@ export default async function Page(props: {
   );
 
   return (
-    <ChakraProviderSetup>
-      <SettingsNotificationsPage account={account} />
-    </ChakraProviderSetup>
+    <div>
+      <div className="mb-4">
+        <h1 className="font-semibold text-2xl tracking-tight">Notifications</h1>
+        <p className="text-muted-foreground">
+          Configure your email notification preferences
+        </p>
+      </div>
+
+      <Notifications account={account} />
+    </div>
   );
 }