Dashboard: Remove chakra provider from team/settings/notifications page

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>
   );
 }