diff --git a/app/(dashboard)/dashboard/_components/ProtocolUploader.tsx b/app/(dashboard)/dashboard/_components/ProtocolUploader.tsx index 8901ed9b..34883666 100644 --- a/app/(dashboard)/dashboard/_components/ProtocolUploader.tsx +++ b/app/(dashboard)/dashboard/_components/ProtocolUploader.tsx @@ -23,8 +23,10 @@ import { useRouter } from 'next/navigation'; import { DatabaseError } from '~/utils/databaseError'; import { ensureError } from '~/utils/ensureError'; import { ValidationError } from '@codaco/protocol-validation'; -import Link from 'next/link'; import { ErrorDetails } from '~/components/ErrorDetails'; +import { XCircle } from 'lucide-react'; +import Link from '~/components/Link'; +import { AlertDescription } from '~/components/ui/Alert'; type ErrorState = { title: string; @@ -39,6 +41,7 @@ type ProgressState = { export default function ProtocolUploader() { const router = useRouter(); + const utils = api.useUtils(); const [error, setError] = useState(null); const [progress, setProgress] = useState(null); const { toast } = useToast(); @@ -77,13 +80,62 @@ export default function ProtocolUploader() { ); // This function will throw on validation errors, with type ValidationError - await validateProtocol(protocolJson); + const validationResult = await validateProtocol(protocolJson); + + if (!validationResult.isValid) { + // eslint-disable-next-line no-console + console.log('validationResult', validationResult); + + setError({ + title: 'The protocol is invalid!', + description: ( + <> + + The protocol you uploaded is invalid. See the details below + for specific validation errors that were found. + + + If you believe that your protocol should be valid please ask + for help via our{' '} + + community forum + + . + + + ), + additionalContent: ( + +
    + {[ + ...validationResult.schemaErrors, + ...validationResult.logicErrors, + ].map((validationError, i) => ( +
  • + + + {validationError.message}{' '} + + ({validationError.path}) + + +
    • + ))} +
+ + ), + }); + + setProgress(null); + return; + } // After this point, assume the protocol is valid. const assets = await getProtocolAssets(protocolJson, zip); - console.log('assets', assets); - setProgress({ percent: 0, status: 'Uploading assets...', @@ -151,59 +203,18 @@ export default function ProtocolUploader() { setProgress(null); await clientRevalidateTag('protocol.get.all'); + await utils.protocol.get.all.invalidate(); router.refresh(); } catch (e) { // eslint-disable-next-line no-console console.log(e); const error = ensureError(e); - - // Validation errors come from @codaco/protocol-validation - if (error instanceof ValidationError) { - setError({ - title: 'Protocol was invalid!', - description: ( - <> -

- The protocol you uploaded was invalid. Please see the details - below for specific validation errors that were found. -

-

- If you believe that your protocol should be valid please ask - for help via our{' '} - - community forum - - . -

- - ), - additionalContent: ( - - <> -

{error.message}

-

Errors:

-
    - {error.logicErrors.map((e, i) => ( -
  • {e}
    • - ))} - {error.schemaErrors.map((e, i) => ( -
  • {e}
    • - ))} -
- - - ), - }); - } // Database errors are thrown inside our tRPC router - else if (error instanceof DatabaseError) { + if (error instanceof DatabaseError) { setError({ title: 'Database error during protocol import', - description: error.message, + description: {error.message}, additionalContent: ( 
{error.originalError.toString()}
@@ -213,17 +224,15 @@ export default function ProtocolUploader() { } else { setError({ title: 'Error importing protocol', - description: - 'There was an unknown error while importing your protocol. The information below might help us to debug the issue.', + description: ( + + There was an unknown error while importing your protocol. The + information below might help us to debug the issue. + + ), additionalContent: ( - 
-                  Message: 
-                  {error.message}
-
-                  Stack: 
-                  {error.stack}
-
+ 
{error.message}
 ), }); diff --git a/app/(dashboard)/dashboard/_components/ProtocolsTable/ProtocolsTable.tsx b/app/(dashboard)/dashboard/_components/ProtocolsTable/ProtocolsTable.tsx index 4919f093..d86be3fd 100644 --- a/app/(dashboard)/dashboard/_components/ProtocolsTable/ProtocolsTable.tsx +++ b/app/(dashboard)/dashboard/_components/ProtocolsTable/ProtocolsTable.tsx @@ -13,16 +13,13 @@ export const ProtocolsTable = ({ }: { initialData: ProtocolWithInterviews[]; }) => { - const { isLoading, data: protocols } = api.protocol.get.all.useQuery( - undefined, - { - initialData, - refetchOnMount: false, - onError(error) { - throw new Error(error.message); - }, + const { data: protocols } = api.protocol.get.all.useQuery(undefined, { + initialData, + refetchOnMount: false, + onError(error) { + throw new Error(error.message); }, - ); + }); const [showAlertDialog, setShowAlertDialog] = useState(false); const [protocolsToDelete, setProtocolsToDelete] = @@ -35,7 +32,6 @@ export const ProtocolsTable = ({ return ( <> - {isLoading &&
Loading...
} { - const { signOut, isLoading } = useSession(); + const { signOut } = useSession(); return (
- +
); }; diff --git a/components/ErrorDetails.tsx b/components/ErrorDetails.tsx index 66a4f777..acd15bc3 100644 --- a/components/ErrorDetails.tsx +++ b/components/ErrorDetails.tsx @@ -2,7 +2,7 @@ import type { PropsWithChildren } from 'react'; export const ErrorDetails = (props: PropsWithChildren) => { return ( -
+
{props.children}
); diff --git a/components/ui/ErrorDialog.tsx b/components/ui/ErrorDialog.tsx index 8227b506..ea952663 100644 --- a/components/ui/ErrorDialog.tsx +++ b/components/ui/ErrorDialog.tsx @@ -34,9 +34,7 @@ const ErrorDialog = ({ {title} - {description && ( - {description} - )} + {description} {additionalContent} diff --git a/package.json b/package.json index 9480d4fd..47eb4d66 100644 --- a/package.json +++ b/package.json @@ -19,7 +19,7 @@ "seed": "tsx prisma/seed.ts" }, "dependencies": { - "@codaco/protocol-validation": "3.0.0-alpha.2", + "@codaco/protocol-validation": "3.0.0-alpha.4", "@codaco/shared-consts": "^0.0.2", "@headlessui/react": "^1.7.17", "@hookform/resolvers": "^3.3.2", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index f3b4efbd..d0540da5 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -6,8 +6,8 @@ settings: dependencies: '@codaco/protocol-validation': - specifier: 3.0.0-alpha.2 - version: 3.0.0-alpha.2(@types/eslint@8.44.6)(eslint-config-prettier@9.0.0)(eslint@8.52.0) + specifier: 3.0.0-alpha.4 + version: 3.0.0-alpha.4(@types/eslint@8.44.6)(eslint-config-prettier@9.0.0)(eslint@8.52.0) '@codaco/shared-consts': specifier: ^0.0.2 version: 0.0.2 @@ -1683,8 +1683,8 @@ packages: resolution: {integrity: sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw==} dev: true - /@codaco/protocol-validation@3.0.0-alpha.2(@types/eslint@8.44.6)(eslint-config-prettier@9.0.0)(eslint@8.52.0): - resolution: {integrity: sha512-8eOC5sUiTl8sJhOZ2PsQ5exiogcx5oYKRb6epI28pA9dr2uXpYCiZ/P5CnZJJysDc4hzOoJddbR4L/3jFQNnCQ==} + /@codaco/protocol-validation@3.0.0-alpha.4(@types/eslint@8.44.6)(eslint-config-prettier@9.0.0)(eslint@8.52.0): + resolution: {integrity: sha512-2vV5Tga/zco/vrdDwkmirkiEqvwq+pduV4U4bHJhIgivxFSxswy6Ae7VLsbgOsFRaypx/SMrh7kF9wmU30liLQ==} dependencies: '@codaco/shared-consts': 0.0.2 '@types/lodash-es': 4.17.10