fix(media-transcoding): improve responsive styles (#2550)

* fix(media-transcoding): improve responsive styles

* fix: typecheck issue

packages/widgets/src/media-transcoding/index.ts

@@ -1,20 +1,20 @@
 import { IconTransform } from "@tabler/icons-react";
 import { z } from "zod";
 
+import { capitalize } from "@homarr/common";
+
 import { createWidgetDefinition } from "../definition";
 import { optionsBuilder } from "../options";
 
+export const views = ["workers", "queue", "statistics"] as const;
+
 export const { componentLoader, definition } = createWidgetDefinition("mediaTranscoding", {
   icon: IconTransform,
   createOptions() {
     return optionsBuilder.from((factory) => ({
       defaultView: factory.select({
         defaultValue: "statistics",
-        options: [
-          { label: "Workers", value: "workers" },
-          { label: "Queue", value: "queue" },
-          { label: "Statistics", value: "statistics" },
-        ],
+        options: views.map((view) => ({ label: capitalize(view), value: view })),
       }),
       queuePageSize: factory.number({ defaultValue: 10, validate: z.number().min(1).max(30) }),
     }));