codeforlife 2.6.9 → 2.6.11

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+## [2.6.11](https://github.com/ocadotechnology/codeforlife-package-javascript/compare/v2.6.10...v2.6.11) (2025-02-25)
+
+
+### Bug Fixes
+
+* Portal frontend 40 ([#78](https://github.com/ocadotechnology/codeforlife-package-javascript/issues/78)) ([18082bb](https://github.com/ocadotechnology/codeforlife-package-javascript/commit/18082bbd60e2ec52dfaf072ca092c3812a25fab0))
+
+## [2.6.10](https://github.com/ocadotechnology/codeforlife-package-javascript/compare/v2.6.9...v2.6.10) (2025-02-25)
+
+
+### Bug Fixes
+
+* non field errors ([dddf8d5](https://github.com/ocadotechnology/codeforlife-package-javascript/commit/dddf8d5d1990c201ef72eff74b2d4f260ce4c7a4))
+
 ## [2.6.9](https://github.com/ocadotechnology/codeforlife-package-javascript/compare/v2.6.8...v2.6.9) (2025-02-25)
 
 

package/package.json

@@ -2,7 +2,7 @@
   "name": "codeforlife",
   "description": "Common frontend code",
   "private": false,
-  "version": "2.6.9",
+  "version": "2.6.11",
   "type": "module",
   "scripts": {
     "dev": "vite",

package/src/components/DownloadFileButton.tsx

@@ -0,0 +1,54 @@
+import { Button, type ButtonProps } from "@mui/material"
+import { type FC, useEffect } from "react"
+import { Download as DownloadIcon } from "@mui/icons-material"
+
+export type DownloadFileButtonProps = ButtonProps & {
+  file:
+    | Blob
+    | MediaSource
+    | {
+        text: string
+        mimeType: "plain" | "csv"
+        name: string
+        charset?: string
+        extension?: string
+      }
+}
+
+const DownloadFileButton: FC<DownloadFileButtonProps> = ({
+  children = "Download",
+  endIcon = <DownloadIcon />,
+  file,
+  ...otherButtonProps
+}) => {
+  let url: undefined | string = undefined
+  let anchorProps: undefined | { download?: string; href: string } = undefined
+  if ("mimeType" in file) {
+    let { text, mimeType, name, charset = "utf-8", extension } = file
+
+    if (!extension) extension = "." + { plain: "txt", csv: "csv" }[mimeType]
+
+    anchorProps = {
+      download: name + extension,
+      href: `data:text/${mimeType};charset=${charset},${encodeURIComponent(text)}`,
+    }
+  } else {
+    url = URL.createObjectURL(file)
+
+    anchorProps = { href: url }
+  }
+
+  useEffect(() => {
+    return () => {
+      if (url) URL.revokeObjectURL(url)
+    }
+  }, [url])
+
+  return (
+    <Button endIcon={endIcon} {...otherButtonProps} {...anchorProps}>
+      {children}
+    </Button>
+  )
+}
+
+export default DownloadFileButton

package/src/components/form/Form.tsx

@@ -45,7 +45,7 @@ const NonFieldErrors: FC<NonFieldErrorsProps> = ({
 }
 
 export type FormErrors<Values> = FormikErrors<
-  Omit<Values, "non_field_errors"> & { non_field_errors: string }
+  Omit<Values, "__all__"> & { __all__: string }
 >
 
 type _FormikProps<Values> = Omit<FormikProps<Values>, "errors"> & {
@@ -63,38 +63,38 @@ const BaseForm = <Values extends FormValues>({
   children,
   scrollIntoViewOptions = SCROLL_INTO_VIEW_OPTIONS,
   nonFieldErrorsProps,
-  fieldRefs,
+  fieldRefs = [],
   ...otherFormikProps
 }: BaseFormProps<Values>) => (
   <Formik {...otherFormikProps}>
     {/* @ts-expect-error */}
     {(formik: _FormikProps<Values>) => {
-      let nonFieldErrors: undefined | JSX.Element = undefined
-      if (Object.keys(formik.errors).length) {
-        if (typeof formik.errors.non_field_errors === "string") {
-          nonFieldErrors = (
-            <NonFieldErrors {...nonFieldErrorsProps}>
-              {formik.errors.non_field_errors}
-            </NonFieldErrors>
-          )
-        }
-        // If a submission was attempted and refs to the fields were provided.
-        else if (formik.isSubmitting && fieldRefs && fieldRefs.length) {
-          const errorNames = getKeyPaths(formik.errors)
-
-          const inputRef = fieldRefs.find(({ name }) =>
-            errorNames.includes(name),
-          )?.inputRef
-
-          if (inputRef?.current) {
-            inputRef.current.scrollIntoView(scrollIntoViewOptions)
-          }
-        }
+      const hasErrors = Boolean(Object.keys(formik.errors).length)
+      const hasNonFieldErrors =
+        hasErrors && typeof formik.errors.__all__ === "string"
+
+      // If a submission was attempted and refs to the fields were provided.
+      if (
+        hasErrors &&
+        !hasNonFieldErrors &&
+        formik.isSubmitting &&
+        fieldRefs.length
+      ) {
+        const errorNames = getKeyPaths(formik.errors)
+
+        const input = fieldRefs.find(({ name }) => errorNames.includes(name))
+          ?.inputRef.current
+
+        if (input) input.scrollIntoView(scrollIntoViewOptions)
       }
 
       return (
         <>
-          {nonFieldErrors}
+          {hasNonFieldErrors && (
+            <NonFieldErrors {...nonFieldErrorsProps}>
+              {formik.errors.__all__ as string}
+            </NonFieldErrors>
+          )}
           <FormikForm>
             {typeof children === "function" ? children(formik) : children}
           </FormikForm>

package/src/components/index.ts

@@ -6,6 +6,8 @@ export * from "./CopyIconButton"
 export { default as CopyIconButton } from "./CopyIconButton"
 export * from "./Countdown"
 export { default as Countdown } from "./Countdown"
+export * from "./DownloadFileButton"
+export { default as DownloadFileButton } from "./DownloadFileButton"
 export * from "./ElevatedAppBar"
 export { default as ElevatedAppBar } from "./ElevatedAppBar"
 export * from "./Image"