Form/FormikForm.tsx

@@ -1,6 +1,7 @@
 import { useTranslation } from "react-i18next";
 import { Form, Formik, FormikConfig, FormikErrors, FormikProps } from "formik";
-import { Button, Divider } from "@mantine/core";
+import { Divider } from "@shared/nej-react-components/Parts/Text";
+import Button from "@shared/nej-react-components/Parts/Button";
 
 //formik is defined as 
 //export declare function Formik<Values extends FormikValues = FormikValues, ExtraProps = {}>(props: FormikConfig<Values> & ExtraProps): React.JSX.Element;
@@ -36,9 +37,9 @@ export function FormikForm<Values extends object>({
       <Form>
         {createForm && createForm(values, handleChange, errors, touched)}
         {children}
-        <Divider my="md" />
+        <Divider />
         <div tw="flex justify-center items-center">
-          {onDelete && <Button onClick={onDelete} color="red">{t("Delete")}</Button>}
+          {onDelete && <Button onClick={onDelete} type="error">{t("Delete")}</Button>}
           {closeModal && <Button onClick={() => closeModal()}>{t("Close")}</Button>}
           <Button type="submit">{submitText}</Button>
         </div>

Form/withForm.tsx

@@ -1,19 +1,18 @@
 import { FormikForm } from "@shared/nej-react-utils/Form/FormikForm";
-import { useApiClient, useProject } from "@utils/NejManager/NejProvider";
+import { NejAccountingApiClient, CompanyResponse, CancelablePromise } from "@services/accounting-api";
+import { useApiClient, useCompany } from "@utils/NejManager/NejProvider";
 import useMethod from "../macros/useMethod.macro";
 import useQuery from "../macros/useQuery.macro";
-import { CancelablePromise, PortalApiClient, ProjectResponse } from "@services/portal-api";
 
 type FormProps<T> = {
     refresh: () => void;
-    afterSubmit?: (values: T) => void;
     initialData?: T;
 };
 export type WithFormProps<T, P> = P & FormProps<T>;
-export function withForm<T extends object, P extends FormProps<T>>(WrappedForm: React.ComponentType, method: (client: PortalApiClient, project: ProjectResponse, props: P) => (body: T) => CancelablePromise<any>, submitText: string) {
+export function withForm<T extends object, P extends FormProps<T>>(WrappedForm: React.ComponentType, method: (client: NejAccountingApiClient, company: CompanyResponse, props: P) => (body: T) => CancelablePromise<any>, submitText: string) {
-    return function GameFormWrapper({ refresh, afterSubmit, initialData, ...props }: P) {
+    return function GameFormWrapper({ refresh, initialData, ...props }: P) {
         const client = useApiClient();
-        const company = useProject();
+        const company = useCompany();
 
         const fnc = method(client, company, { ...props, initialData } as P);
         console.log(fnc);
@@ -26,7 +25,7 @@ export function withForm<T extends object, P extends FormProps<T>>(WrappedForm:
         return (
             <FormikForm
                 data={initialData || {} as T}
-                onSubmit={(values) => {submit(values); afterSubmit && afterSubmit(values)}}
+                onSubmit={(values) => submit(values)}
                 submitText={submitText}
             >
                 <WrappedForm />

Table/NejReactTable.tsx

@@ -1,18 +1,13 @@
-import { MantineReactTable, MRT_Cell, MRT_Column, MRT_Row, MRT_RowData, MRT_TableInstance, MRT_TableOptions, useMantineReactTable, Xor } from "mantine-react-table";
+import { MantineReactTable, MRT_RowData, MRT_TableInstance, MRT_TableOptions, useMantineReactTable, Xor } from "mantine-react-table";
 import { useNejReactTable } from "./useNejReactTable";
-import { LoadingOverlay } from "@mantine/core";
-import { ReactNode, RefObject } from "react";
 
-export type TableInstance<TData extends MRT_RowData> = MRT_TableInstance<TData> & { loading: boolean }
 type TableInstanceProp<TData extends MRT_RowData> = {
-    table: TableInstance<TData>;
+    table: MRT_TableInstance<TData>;
 };
 
-export type NejReactTableOptions<TData extends MRT_RowData> = Omit<MRT_TableOptions<TData>, "data"> & { data?: TData[] };
-
 type Props<TData extends MRT_RowData> = Xor<
     TableInstanceProp<TData>,
-    NejReactTableOptions<TData>
+    MRT_TableOptions<TData>
 >;
 
 const isTableInstanceProp = <TData extends MRT_RowData>(
@@ -20,21 +15,10 @@ const isTableInstanceProp = <TData extends MRT_RowData>(
 ): props is TableInstanceProp<TData> =>
     (props as TableInstanceProp<TData>).table !== undefined;
 
-export type RenderActionType<TData extends MRT_RowData, TValue = unknown> = (data: {
-    cell: MRT_Cell<TData, TValue>;
-    column: MRT_Column<TData, TValue>;
-    renderedCellValue: ReactNode | number | string;
-    renderedColumnIndex?: number;
-    renderedRowIndex?: number;
-    row: MRT_Row<TData>;
-    rowRef?: RefObject<HTMLTableRowElement>;
-    table: MRT_TableInstance<TData>;
-}) => React.ReactNode
-
 export const NejReactTable = <TData extends MRT_RowData>(
     props: Props<TData>,
 ) => {
-    let table: TableInstance<TData>;
+    let table: MRT_TableInstance<TData>;
 
     if (isTableInstanceProp(props)) {
         table = props.table;
@@ -42,8 +26,5 @@ export const NejReactTable = <TData extends MRT_RowData>(
         table = useNejReactTable(props);
     }
 
-    return <div tw="relative">
+    return <MantineReactTable {...props} />;
-        <LoadingOverlay visible={table.loading} />
-        <MantineReactTable table={table} />
-    </div>;
 };

format.js

@@ -1,12 +1,11 @@
-import { useCallback } from "react";
 import { useTranslation } from "react-i18next";
 
 export function useNumberFormat() {
   const { i18n } = useTranslation();
 
-  return (number: number, digits = 2, currency = null) => {
+  return (number, digits=2, currency=null) => {
     if (currency) {
-      if ((Math.round(number * (10 ** digits)) / (10 ** digits)) === 0)
+      if((Math.round(number * (10**digits))/(10**digits)) === 0)
         return "---";
       return new Intl.NumberFormat(i18n.language, {
         style: "currency",
@@ -26,9 +25,9 @@ export function useNumberFormat() {
 export function useDateFormat() {
   const { i18n } = useTranslation();
 
-  return (date: Date | string) => {
+  return (date) => {
-    if (typeof date === "undefined") return "---";
+    if(typeof date === "undefined") return "---";
-    if (typeof date === "string") date = new Date(date);
+    if(typeof date === "string") date = new Date(date);
 
     return new Intl.DateTimeFormat(i18n.language, {
       year: "numeric",
@@ -40,9 +39,9 @@ export function useDateFormat() {
 export function useDateTimeFormat() {
   const { i18n } = useTranslation();
 
-  return (date: Date | string) => {
+  return (date) => {
-    if (typeof date === "undefined") return "---";
+    if(typeof date === "undefined") return "---";
-    if (typeof date === "string") date = new Date(date);
+    if(typeof date === "string") date = new Date(date);
 
     return new Intl.DateTimeFormat(i18n.language, {
       year: "numeric",
@@ -55,25 +54,3 @@ export function useDateTimeFormat() {
     }).format(date);
   }
 }
-
-export function useLanguageFormat(){  
-  const { i18n } = useTranslation();
-
-  return useCallback((language: string) => {
-    return new Intl.DisplayNames(i18n.language, {
-      type: "language",
-      style: "short",
-    }).of(language);
-  }, [i18n.language]);
-}
-export function useCountryFormat(){  
-  const { i18n } = useTranslation();
-
-  return (region: string) => {
-    return new Intl.DisplayNames(i18n.language, {
-      type: "region",
-      style: "short",
-
-    }).of(region);
-  }
-}

useModal.tsx

@@ -8,7 +8,7 @@ export default function useModal<T>(
       const openModal = useCallback((params: T) => {
           modals.open({
               title,
-              children: <Component afterSubmit={() => modals.closeAll()} {...params} />,
+              children: <Component {...params} />,
           });
       }, [Component, title]);