Fixes: Bugs fixed #10703 (#11154)

### What problem does this PR solve?

Fixes: Bugs fixed
- Removed invalid code,
- Modified the user center style,
- Added an automatic data source parsing switch.

### Type of change

- [x] Bug Fix (non-breaking change which fixes an issue)

web/src/pages/user-setting/components/user-setting-header/index.tsx

@@ -0,0 +1,44 @@
+import { Card, CardContent, CardHeader } from '@/components/ui/card';
+import { PropsWithChildren } from 'react';
+
+export const UserSettingHeader = ({
+  name,
+  description,
+}: {
+  name: string;
+  description?: string;
+}) => {
+  return (
+    <>
+      <header className="flex flex-col gap-1 justify-between items-start p-0">
+        <div className="text-2xl font-medium text-text-primary">{name}</div>
+        {description && (
+          <div className="text-sm text-text-secondary ">{description}</div>
+        )}
+      </header>
+      {/* <Separator className="border-border-button bg-border-button h-[0.5px]" /> */}
+    </>
+  );
+};
+
+export function Title({ children }: PropsWithChildren) {
+  return <span className="font-bold text-xl">{children}</span>;
+}
+
+type ProfileSettingWrapperCardProps = {
+  header: React.ReactNode;
+} & PropsWithChildren;
+
+export function ProfileSettingWrapperCard({
+  header,
+  children,
+}: ProfileSettingWrapperCardProps) {
+  return (
+    <Card className="w-full border-border-button bg-transparent relative border-[0.5px]">
+      <CardHeader className="border-b-[0.5px] border-border-button p-5 ">
+        {header}
+      </CardHeader>
+      <CardContent className="p-5">{children}</CardContent>
+    </Card>
+  );
+}