diff --git a/browser/components/Status/Status.tsx b/browser/components/Status/Status.tsx index ef87cbc6..98cfaa3b 100644 --- a/browser/components/Status/Status.tsx +++ b/browser/components/Status/Status.tsx @@ -1,6 +1,5 @@ import { Center, Flex } from "@mantine/core" import type { ReactNode } from "react" -import { useTranslation } from "react-i18next" import * as icons from "#icons.ts" import classes from "./Status.module.css" @@ -13,7 +12,6 @@ export interface StatusProps { export function Status(props: StatusProps) { const { status } = props - const { t } = useTranslation() const getIcon = (): ReactNode => { if (status === "pending") @@ -22,8 +20,6 @@ export function Status(props: StatusProps) { return if (status === "error") return - if (status === "fault") - return return null } @@ -31,7 +27,6 @@ export function Status(props: StatusProps) { if (status === "pending") return props.pendingTitle if (status === "success") return props.successTitle if (status === "error") return props.errorTitle - if (status === "fault") return t("Please try again later") return "" } diff --git a/browser/examples/package-invalid-data-external.json b/browser/examples/package-invalid-data-external.json index 862f279b..041fd457 100644 --- a/browser/examples/package-invalid-data-external.json +++ b/browser/examples/package-invalid-data-external.json @@ -6,7 +6,7 @@ "created": "invalid-date-format", "resources": [ { - "name": "test-data", + "name": "table", "type": "table", "path": "table-invalid.csv", "schema": "schema.json" diff --git a/browser/examples/package-invalid-data-internal.json b/browser/examples/package-invalid-data-internal.json index 91021090..438aa217 100644 --- a/browser/examples/package-invalid-data-internal.json +++ b/browser/examples/package-invalid-data-internal.json @@ -6,7 +6,7 @@ "created": "invalid-date-format", "resources": [ { - "name": "test-data", + "name": "table", "type": "table", "data": [ ["id", "name", "email", "age", "score", "status"], diff --git a/browser/examples/package.json b/browser/examples/package.json index 50fae8c6..2f22a0f6 100644 --- a/browser/examples/package.json +++ b/browser/examples/package.json @@ -6,7 +6,7 @@ "created": "invalid-date-format", "resources": [ { - "name": "test-data", + "name": "table", "type": "table", "data": [ ["id", "name", "email", "age", "score", "status"], diff --git a/browser/routes/package/validate/Dialog.tsx b/browser/routes/package/validate/Dialog.tsx index 06f7c949..ce97d1b9 100644 --- a/browser/routes/package/validate/Dialog.tsx +++ b/browser/routes/package/validate/Dialog.tsx @@ -8,22 +8,27 @@ import { store } from "./store.ts" export function ValidatePackageDialog() { const { t } = useTranslation() + const error = store.useState(state => state.error) const report = store.useState(state => state.report) - const isFault = store.useState(state => state.isFault) const isPending = store.useState(state => state.isPending) const isDialogOpen = store.useState(state => state.isDialogOpen) const handleOpenChange = (isDialogOpen: boolean) => { - store.setState({ isDialogOpen, isFault: undefined, report: undefined }) + store.setState({ isDialogOpen, error: undefined, report: undefined }) } const getStatus = () => { if (report) return report.valid ? "success" : "error" if (isPending) return "pending" - if (isFault) return "fault" + if (error) return "error" return undefined } + const getErrorTitle = () => { + if (error) return t(error.message as any) + return "Invalid data package" + } + return ( diff --git a/browser/routes/package/validate/queries.ts b/browser/routes/package/validate/queries.ts index 8342a5fc..507627f0 100644 --- a/browser/routes/package/validate/queries.ts +++ b/browser/routes/package/validate/queries.ts @@ -20,7 +20,7 @@ export function useValidatePackage() { }, onError: error => { console.log(error) - store.setState({ isFault: true }) + store.setState({ error }) }, }) } diff --git a/browser/routes/package/validate/store.ts b/browser/routes/package/validate/store.ts index 208df628..2b25c32f 100644 --- a/browser/routes/package/validate/store.ts +++ b/browser/routes/package/validate/store.ts @@ -4,8 +4,8 @@ import type { api } from "#runtimes/browser/api.ts" export interface State { isDialogOpen?: boolean isPending?: boolean - isFault?: boolean report?: Awaited> + error?: Error } export const store = createStore("validatePackage") diff --git a/browser/routes/root.tsx b/browser/routes/root.tsx index f329b12a..499a5947 100644 --- a/browser/routes/root.tsx +++ b/browser/routes/root.tsx @@ -64,12 +64,12 @@ export function Layout(props: { children: React.ReactNode }) { - {links.map(link => ( + {links.map((link, index) => ( ))} diff --git a/service/endpoint.ts b/service/endpoint.ts new file mode 100644 index 00000000..caefadc0 --- /dev/null +++ b/service/endpoint.ts @@ -0,0 +1,16 @@ +import { os } from "@orpc/server" + +export const baseEndpoint = os.errors({ + ERROR: {}, +}) + +const errorMiddleware = baseEndpoint.middleware(async ({ next, errors }) => { + try { + return await next() + } catch (error) { + const message = error instanceof Error ? error.message : String(error) + throw errors.ERROR({ message }) + } +}) + +export const endpoint = baseEndpoint.use(errorMiddleware) diff --git a/service/endpoints/package/validate.ts b/service/endpoints/package/validate.ts index 6cb5335d..f27a97a7 100644 --- a/service/endpoints/package/validate.ts +++ b/service/endpoints/package/validate.ts @@ -1,8 +1,8 @@ import * as dpkit from "@dpkit/lib" -import { os } from "@orpc/server" import * as z from "zod" +import { endpoint } from "../../endpoint.ts" -export const validatePackage = os +export const validatePackage = endpoint .route({ method: "POST", path: "/package/validate",