diff --git a/Form/Core/FileField.js b/Form/Core/FileField.js deleted file mode 100644 index 2a701d2..0000000 --- a/Form/Core/FileField.js +++ /dev/null @@ -1,31 +0,0 @@ -import tw from "twin.macro"; -import { useDropzone } from "react-dropzone"; -import { useMemo } from "react"; -import { useApiClient, useCompany } from "@utils/NejManager/NejProvider"; -import axios from "axios"; -import { useField } from "formik"; -import NejDropzone from "./NejDropzone"; - -/** - * Renders a file input field with dropzone functionality. - * - * @param {Object} props - The component props. - * @param {boolean} props.single - Whether to allow only one file to be uploaded - * @param {string | string[]} props.accept - Array of supported file extensions. - * @returns {JSX.Element} The rendered file input field. - */ -export function FileField({ single, accept, ...props }) { - const [field, meta, helpers] = useField(props); - - /** - * Handles the upload of files. - * - * @param {Array} files - The files to be uploaded. - */ - function onUpload(files) { - console.log(files) - field.onChange({ target: { value: single ? files[0] : files, name: field.name } }); - } - - return ; -} diff --git a/Form/Core/FileField.tsx b/Form/Core/FileField.tsx new file mode 100644 index 0000000..e61bf5e --- /dev/null +++ b/Form/Core/FileField.tsx @@ -0,0 +1,27 @@ +import { FieldHookConfig, useField } from "formik"; +import NejDropzone from "./NejDropzone"; +import { Accept } from "react-dropzone"; + +/** + * Renders a file input field with dropzone functionality. + * + * @param props - The component props. + * @param props.single - Whether to allow only one file to be uploaded + * @param props.accept - Array of supported file extensions. + * @returns {JSX.Element} The rendered file input field. + */ +export function FileField({ single, accept, ...props }: FieldHookConfig & { single?: boolean, accept?: Accept }) { + const [field, meta, helpers] = useField(props); + + /** + * Handles the upload of files. + * + * @param {Array} files - The files to be uploaded. + */ + function onUpload(files) { + console.log(files) + field.onChange({ target: { value: single ? files[0] : files, name: field.name } }); + } + + return ; +} diff --git a/Form/Core/NejDropzone.js b/Form/Core/NejDropzone.tsx similarity index 76% rename from Form/Core/NejDropzone.js rename to Form/Core/NejDropzone.tsx index 775e2b4..3283427 100644 --- a/Form/Core/NejDropzone.js +++ b/Form/Core/NejDropzone.tsx @@ -1,8 +1,6 @@ import tw from "twin.macro"; -import { useDropzone } from "react-dropzone"; -import { useMemo } from "react"; -import { useApiClient, useCompany } from "@utils/NejManager/NejProvider"; -import axios from "axios"; +import { Accept, FileError, useDropzone } from "react-dropzone"; +import { HTMLAttributes, useMemo } from "react"; /** * NejDropzone component for handling file uploads. @@ -15,8 +13,8 @@ import axios from "axios"; * @param {string} props.text - The text to be displayed in the dropzone. * @returns {JSX.Element} - NejDropzone component. */ -export default function NejDropzone({ value, accept, onDrop, validator, single, text, css, children, ...props }) { - +export default function NejDropzone({ value, accept, onDrop, validator, single, text, css, children, ...props }: HTMLAttributes & { value: File | File[], accept?: Accept, onDrop: (files: File[]) => void, validator?: (file: File) => FileError | FileError[] | null, single?: boolean, text?: string, css?: any, children?: any }) { + const { getRootProps, getInputProps, isFocused, isDragAccept, isDragReject } = useDropzone({ //validator: validator, onDropAccepted: onDrop, @@ -31,12 +29,14 @@ export default function NejDropzone({ value, accept, onDrop, validator, single, ...(isFocused && tw`bg-secondary`), ...(isDragAccept && tw`border-accent`), ...(isDragReject && tw`border-red-600`), - css + ...css }), [isFocused, isDragAccept, isDragReject, css] ); - let fil = value == null ? null : single ? [value] : value; + //if file is not array, make it 1 item array + const array = Array.isArray(value) ? value : [value]; + const fil = value == null ? null : array; return (
diff --git a/Table/NejReactTable.tsx b/Table/NejReactTable.tsx index efde574..e62b670 100644 --- a/Table/NejReactTable.tsx +++ b/Table/NejReactTable.tsx @@ -10,6 +10,8 @@ type TableInstanceProp = { export type NejReactTableOptions = Omit, "data"> & { data?: TData[] }; +export type CommonlyForwardedNejReactTableOptions = Omit, "data" | "columns"> + type Props = Xor< TableInstanceProp, NejReactTableOptions diff --git a/Table/useNejReactTable.ts b/Table/useNejReactTable.ts index 97af6b4..632ffe5 100644 --- a/Table/useNejReactTable.ts +++ b/Table/useNejReactTable.ts @@ -1,15 +1,20 @@ import { MRT_RowData, MRT_TableInstance, MRT_TableOptions, useMantineReactTable } from "mantine-react-table"; +import { NejReactTableOptions, TableInstance } from "./NejReactTable"; export const useNejReactTable = ( - tableOptions: MRT_TableOptions, -): MRT_TableInstance => { - return useMantineReactTable({ - enablePagination: false, - enableFullScreenToggle: false, - enableDensityToggle: false, - enableBottomToolbar: false, - enableTopToolbar: tableOptions.renderTopToolbarCustomActions != null, - ...tableOptions, - }); + tableOptions: NejReactTableOptions, +): TableInstance => { + return { + ...useMantineReactTable({ + enablePagination: false, + enableFullScreenToggle: false, + enableDensityToggle: false, + enableBottomToolbar: false, + enableTopToolbar: tableOptions.renderTopToolbarCustomActions != null, + ...tableOptions, + data: tableOptions.data ?? [], + }), + loading: tableOptions.data == null + }; } \ No newline at end of file diff --git a/macros/useMethod.macro.js b/macros/useMethod.macro.cjs similarity index 99% rename from macros/useMethod.macro.js rename to macros/useMethod.macro.cjs index 95cfe45..8248a55 100644 --- a/macros/useMethod.macro.js +++ b/macros/useMethod.macro.cjs @@ -78,7 +78,7 @@ function useMethod({ references, state, babel }) { let useStateHookImport = addNamed(declPath, "useState", "react"); let useCallbackHookImport = addNamed(declPath, "useCallback", "react"); - let servicePath = "@services/accounting-api"; + let servicePath = "@services/portal-api"; let apiErrorImport = addNamed(declPath, "ApiError", servicePath); let nejServicesPath = "@utils/NejManager/NejProvider"; diff --git a/macros/useMethod.macro.d.ts b/macros/useMethod.macro.d.ts index b90828b..a8d5664 100644 --- a/macros/useMethod.macro.d.ts +++ b/macros/useMethod.macro.d.ts @@ -1,5 +1,5 @@ -import { CancelablePromise, Error } from "src/services/accounting-api"; +import { CancelablePromise, Error } from "src/services/portal-api"; export default function useMethod(method: (...args: Arg) => CancelablePromise, onDone?: (data: T) => void, - onError?: (error: Error) => void = null): [(...args: Arg) => void, { data: T, loading: boolean, error: Error }]; + onError?: (error: Error) => void = null): [(...args: Arg) => CancelablePromise, { data: T, loading: boolean, error: Error }]; diff --git a/macros/useQuery.macro.js b/macros/useQuery.macro.cjs similarity index 98% rename from macros/useQuery.macro.js rename to macros/useQuery.macro.cjs index 5f17635..1bdf804 100644 --- a/macros/useQuery.macro.js +++ b/macros/useQuery.macro.cjs @@ -87,7 +87,7 @@ function useQuery({ references, state, babel }) { } let fullCallPathString = reduceCallee(call.callee) - let servicePath = "@services/accounting-api"; + let servicePath = "@services/portal-api"; let apiErrorImport = addNamed(declPath, "ApiError", servicePath); let useStateSrc = babel.template("[DATA, CALL_SET] = USE_STATE({data: null, error: null, loading: true})")({ diff --git a/macros/useQuery.macro.d.ts b/macros/useQuery.macro.d.ts index 7ebdcca..da15594 100644 --- a/macros/useQuery.macro.d.ts +++ b/macros/useQuery.macro.d.ts @@ -1,4 +1,4 @@ -import { CancelablePromise, Error } from "src/services/accounting-api"; +import { CancelablePromise, Error } from "src/services/portal-api"; //default export is a function /*