refactor: adjust code formatting in UI components and update fetchProviders hook dependencies

Author: Ryosuke-Asano

src/components/console/SeparatorRow.tsx

@@ -8,9 +8,10 @@ export function SeparatorRow({ label }: SeparatorRowProps) {
   return (
     <HStack align="center" my={0.5} px={{ base: 0.5, md: 1 }} color="fg.muted">
       <Box flex="1" borderTopWidth="1px" borderColor="border" />
-      <Text fontSize="xs" px={{ base: 1, md: 2 }} whiteSpace="nowrap">{label}</Text>
+      <Text fontSize="xs" px={{ base: 1, md: 2 }} whiteSpace="nowrap">
+        {label}
+      </Text>
       <Box flex="1" borderTopWidth="1px" borderColor="border" />
     </HStack>
   );
 }
-

src/pages/settings/ProvidersPage.tsx

@@ -54,11 +54,12 @@ export function ProvidersPage() {
     const [isCreating, setIsCreating] = React.useState(false);
 
     // バリデーションスキーマ
-    const providerFormSchema = React.useMemo(() => z.object({
-        displayName: z.string().min(1, t("providers.displayNameRequired")),
-        apiKey: z.string().min(1, t("providers.apiKeyRequired")),
-        apiEndpoint: z.string().url(t("providers.apiEndpointInvalid")),
-    }), [t]);
+    const providerFormSchema = React.useMemo(() =>
+        z.object({
+            displayName: z.string().min(1, t("providers.displayNameRequired")),
+            apiKey: z.string().min(1, t("providers.apiKeyRequired")),
+            apiEndpoint: z.string().url(t("providers.apiEndpointInvalid")),
+        }), [t]);
 
     const {
         register,
@@ -97,7 +98,7 @@ export function ProvidersPage() {
         } finally {
             setLoading(false);
         }
-    }, []);
+    }, [t]);
 
     React.useEffect(() => {
         fetchProviders();
@@ -318,7 +319,9 @@ export function ProvidersPage() {
                                 <EmptyState
                                     icon={<LuServer />}
                                     title={t("providers.emptyTitle")}
-                                    description={t("providers.emptyDescription")}
+                                    description={t(
+                                        "providers.emptyDescription",
+                                    )}
                                     action={{
                                         label: t("providers.emptyAction"),
                                         onClick: startCreate,
@@ -399,7 +402,9 @@ export function ProvidersPage() {
                                                             ? (
                                                                 <>
                                                                     <IconButton
-                                                                        aria-label={t("providers.save")}
+                                                                        aria-label={t(
+                                                                            "providers.save",
+                                                                        )}
                                                                         size="sm"
                                                                         colorPalette="green"
                                                                         onClick={handleSubmitEdit(
@@ -416,7 +421,9 @@ export function ProvidersPage() {
                                                                         <LuCheck />
                                                                     </IconButton>
                                                                     <IconButton
-                                                                        aria-label={t("providers.cancel")}
+                                                                        aria-label={t(
+                                                                            "providers.cancel",
+                                                                        )}
                                                                         size="sm"
                                                                         variant="ghost"
                                                                         onClick={() => {
@@ -433,7 +440,9 @@ export function ProvidersPage() {
                                                             : (
                                                                 <>
                                                                     <IconButton
-                                                                        aria-label={t("providers.edit")}
+                                                                        aria-label={t(
+                                                                            "providers.edit",
+                                                                        )}
                                                                         size="sm"
                                                                         variant="ghost"
                                                                         onClick={() =>
@@ -444,7 +453,9 @@ export function ProvidersPage() {
                                                                         <LuPencil />
                                                                     </IconButton>
                                                                     <IconButton
-                                                                        aria-label={t("providers.delete")}
+                                                                        aria-label={t(
+                                                                            "providers.delete",
+                                                                        )}
                                                                         size="sm"
                                                                         variant="ghost"
                                                                         colorPalette="red"

src/pages/workflows/useWorkflowRun.ts

@@ -7,7 +7,10 @@
 import React from "react";
 import { clients } from "@/lib/grpc-clients";
 import type { RunWorkflowResponse } from "@/gen/sapphillon/v1/workflow_service_pb";
-import { WorkflowSourceByIdSchema } from "@/gen/sapphillon/v1/workflow_service_pb";
+import {
+  WorkflowSourceByIdSchema,
+  type WorkflowSourceById,
+} from "@/gen/sapphillon/v1/workflow_service_pb";
 import type { Workflow } from "@/gen/sapphillon/v1/workflow_pb";
 import { create } from "@bufbuild/protobuf";
 
@@ -69,7 +72,7 @@ export function useWorkflowRun(): UseWorkflowRunReturn {
           byId: create(WorkflowSourceByIdSchema, {
             workflowId,
             workflowCodeId: workflowCodeId || "",
-          }),
+          }) as WorkflowSourceById,
         });
         setRunRes(res);
         append({ kind: "message", payload: res });
@@ -95,7 +98,10 @@ export function useWorkflowRun(): UseWorkflowRunReturn {
       setRunRes(null);
       setRunning(true);
       try {
-        append({ kind: "message", payload: { stage: "save", status: "start" } });
+        append({
+          kind: "message",
+          payload: { stage: "save", status: "start" },
+        });
 
         // ワークフローを保存
         const saveResponse = await clients.workflow.updateWorkflow({
@@ -122,7 +128,7 @@ export function useWorkflowRun(): UseWorkflowRunReturn {
           byId: create(WorkflowSourceByIdSchema, {
             workflowId,
             workflowCodeId,
-          }),
+          }) as WorkflowSourceById,
         });
 
         setRunRes(res);