Merge branch 'master' of https://git.nejcraft.cz/Nejcraft/nej-react-utils

Form/Core/FileField.tsx

@@ -10,7 +10,7 @@ import { Accept } from "react-dropzone";
  * @param props.accept - Array of supported file extensions.
  * @returns {JSX.Element} The rendered file input field.
  */
-export function FileField({ single, accept, ...props }: FieldHookConfig<File | File[]> & { single?: boolean, accept?: Accept }) {
+export function FileField({ single, accept, ...props }: FieldHookConfig<File | File[]> & { single?: boolean, accept?: Accept | string }) {
   const [field, meta, helpers] = useField(props);
 
   /**

Form/Core/NejDropzone.tsx

@@ -13,12 +13,12 @@ import { HTMLAttributes, useMemo } from "react";
  * @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 }: HTMLAttributes<HTMLDivElement> & { value: File | File[], accept?: Accept, onDrop: (files: File[]) => void, validator?: (file: File) => FileError | FileError[] | null, single?: boolean, text?: string, css?: any, children?: any }) {
+export default function NejDropzone({ value, accept, onDrop, validator, single, text, css, children, ...props }: HTMLAttributes<HTMLDivElement> & { value: File | File[], accept?: Accept | string, 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,
-    accept: accept,
+    accept: typeof (accept) === "string" ? { [accept]: ["*.*"] } : accept,
     validator: validator,
     maxFiles: single ? 1 : undefined,
   });

Form/withForm.tsx

@@ -11,7 +11,7 @@ type FormProps<T> = {
 };
 export type WithFormProps<T, P> = P & FormProps<T>;
 type CleanedFormProps<P> = Omit<P, "refresh" | "afterSubmit" | "initialData">;
-export function withForm<T extends object, P extends FormProps<T>>(WrappedForm: React.ComponentType<CleanedFormProps<P>>, method: (client: ApiClient, project: OwnerResponse, props: P) => (body: T) => CancelablePromise<any>, submitText: string, trMethod?: (initialData: T, props: CleanedFormProps<P>) => T) {
+export function withForm<T extends object, P extends FormProps<T>>(WrappedForm: React.ComponentType<CleanedFormProps<P>>, method: (client: ApiClient, project: OwnerResponse, props: P) => (body: T) => CancelablePromise<any> | any, submitText: string, trMethod?: (initialData: T, props: CleanedFormProps<P>) => T) {
     return function GameFormWrapper({ refresh, afterSubmit, initialData, ...props }: P) {
         const client = useApiClient();
         const company = useOwner();

useModal.tsx

@@ -3,14 +3,14 @@ import { useCallback } from "react";
 
 export default function useModal<T>(
     Component: React.ComponentType<T>, 
-    title: string
+    defaulTitle: string
   ) {
-      const openModal = useCallback((params: T) => {
+      const openModal = useCallback((params: T, title?: string) => {
           modals.open({
-              title,
+              title: title ?? defaulTitle,
               children: <Component afterSubmit={() => modals.closeAll()} {...params} />,
           });
-      }, [Component, title]);
+      }, [Component, defaulTitle ]);
   
       return openModal;
 }