fix(testcase): improve empty state layout and i18n

messages/en.json

@@ -213,7 +213,8 @@
   },
   "Testcase": {
     "Table": {
-      "Case": "Case"
+      "Case": "Case",
+      "Empty": "No test cases found for this problem."
     }
   },
   "WorkspaceEditorHeader": {

messages/zh.json

@@ -213,7 +213,8 @@
   },
   "Testcase": {
     "Table": {
-      "Case": "样例"
+      "Case": "样例",
+      "Empty": "该题目暂无测试用例。"
     }
   },
   "WorkspaceEditorHeader": {

src/features/problems/testcase/panel.tsx

@@ -11,7 +11,7 @@ interface TestcasePanelProps {
 
 export const TestcasePanel = ({ problemId }: TestcasePanelProps) => {
   return (
-    <PanelLayout>
+    <PanelLayout isScroll={false}>
       <Suspense fallback={<TestcaseContentSkeleton />}>
         <TestcaseContent problemId={problemId} />
       </Suspense>

src/features/problems/testcase/table.tsx

@@ -2,7 +2,7 @@ import prisma from "@/lib/prisma";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { getTranslations } from "next-intl/server";
-import { Card, CardContent } from "@/components/ui/card";
+import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
 
 interface TestcaseTableProps {
@@ -19,15 +19,14 @@ export const TestcaseTable = async ({ problemId }: TestcaseTableProps) => {
 
   if (testcases.length === 0) {
     return (
-      <Card>
-        <CardContent className="p-4 text-center">
-          No testcases found for this problem.
-        </CardContent>
-      </Card>
+      <div className="flex h-full w-full items-center justify-center p-4 text-center text-muted-foreground">
+        {t("Empty")}
+      </div>
     );
   }
 
   return (
+    <ScrollArea className="h-full">
       <Tabs defaultValue={testcases[0].id} className="items-center px-5 py-4">
         <TabsList className="bg-transparent p-0">
           {testcases.map((testcase, index) => (
@@ -62,5 +61,7 @@ export const TestcaseTable = async ({ problemId }: TestcaseTableProps) => {
           </TabsContent>
         ))}
       </Tabs>
+      <ScrollBar orientation="horizontal" />
+    </ScrollArea>
   );
 };