feat(problemset): enhance header component with back button and className prop

- Replace problem-header.tsx with new header.tsx implementation
- Add BackButton functionality to navigate to home page
- Make className prop configurable using cn utility
- Maintain existing user avatar functionality

src/features/problemset/components/header.tsx

@@ -0,0 +1,25 @@
+import { cn } from "@/lib/utils";
+import { Suspense } from "react";
+import { BackButton } from "@/components/back-button";
+import { UserAvatar, UserAvatarSkeleton } from "@/components/user-avatar";
+
+interface ProblemsetHeaderProps {
+  className?: string;
+}
+
+export const ProblemsetHeader = ({ className }: ProblemsetHeaderProps) => {
+  return (
+    <header className={cn("flex h-12 flex-none items-center", className)}>
+      <div className="container mx-auto flex h-full items-center justify-between px-4">
+        <div className="flex items-center">
+          <BackButton href="/" />
+        </div>
+        <div className="flex items-center">
+          <Suspense fallback={<UserAvatarSkeleton />}>
+            <UserAvatar />
+          </Suspense>
+        </div>
+      </div>
+    </header>
+  );
+};

src/features/problemset/components/problemset-header.tsx

@@ -1,18 +0,0 @@
-import { Suspense } from "react";
-import { UserAvatar, UserAvatarSkeleton } from "@/components/user-avatar";
-
-const ProblemsetHeader = () => {
-  return (
-    <header className="flex h-12 flex-none items-center">
-      <div className="container mx-auto flex h-full items-center justify-end px-4">
-        <div className="flex items-center">
-          <Suspense fallback={<UserAvatarSkeleton />}>
-            <UserAvatar />
-          </Suspense>
-        </div>
-      </div>
-    </header>
-  );
-};
-
-export { ProblemsetHeader };