@compill/admin 1.0.104 → 1.0.105
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +2054 -0
- package/dist/index.d.cts +565 -0
- package/dist/index.d.ts +565 -50
- package/dist/index.js +2000 -50
- package/package.json +17 -16
- package/dist/lib/SectionTitle.d.ts +0 -2
- package/dist/lib/SectionTitle.js +0 -4
- package/dist/lib/breadcrumbs/BreadCrumbs.d.ts +0 -15
- package/dist/lib/breadcrumbs/BreadCrumbs.js +0 -29
- package/dist/lib/buttons/DialogButton.d.ts +0 -7
- package/dist/lib/buttons/DialogButton.js +0 -15
- package/dist/lib/buttons/InvalidateButton.d.ts +0 -6
- package/dist/lib/buttons/InvalidateButton.js +0 -11
- package/dist/lib/buttons/NavigateButton.d.ts +0 -4
- package/dist/lib/buttons/NavigateButton.js +0 -12
- package/dist/lib/buttons/PublishButton.d.ts +0 -9
- package/dist/lib/buttons/PublishButton.js +0 -17
- package/dist/lib/buttons/UpdateButton.d.ts +0 -2
- package/dist/lib/buttons/UpdateButton.js +0 -11
- package/dist/lib/buttons/ViewButton.d.ts +0 -5
- package/dist/lib/buttons/ViewButton.js +0 -13
- package/dist/lib/cells/OrderCell.d.ts +0 -11
- package/dist/lib/cells/OrderCell.js +0 -26
- package/dist/lib/json/DetailsView.d.ts +0 -5
- package/dist/lib/json/DetailsView.js +0 -69
- package/dist/lib/json/EditItemView.d.ts +0 -2
- package/dist/lib/json/EditItemView.js +0 -6
- package/dist/lib/json/MultiQueryWrapper.d.ts +0 -5
- package/dist/lib/json/MultiQueryWrapper.js +0 -61
- package/dist/lib/json/QueryWrapper.d.ts +0 -6
- package/dist/lib/json/QueryWrapper.js +0 -29
- package/dist/lib/json/ScreenRenderer.d.ts +0 -6
- package/dist/lib/json/ScreenRenderer.js +0 -19
- package/dist/lib/json/ScreenTopBar.d.ts +0 -15
- package/dist/lib/json/ScreenTopBar.js +0 -18
- package/dist/lib/json/TabbedView.d.ts +0 -3
- package/dist/lib/json/TabbedView.js +0 -21
- package/dist/lib/json/buttons/ActionButton.d.ts +0 -14
- package/dist/lib/json/buttons/ActionButton.js +0 -11
- package/dist/lib/json/buttons/ConfirmationActionButton.d.ts +0 -26
- package/dist/lib/json/buttons/ConfirmationActionButton.js +0 -20
- package/dist/lib/json/dialog/DialogRenderer.d.ts +0 -11
- package/dist/lib/json/dialog/DialogRenderer.js +0 -14
- package/dist/lib/json/dialog/ItemDeleteDialog.d.ts +0 -17
- package/dist/lib/json/dialog/ItemDeleteDialog.js +0 -14
- package/dist/lib/json/dialog/ItemEditDialog.d.ts +0 -32
- package/dist/lib/json/dialog/ItemEditDialog.js +0 -77
- package/dist/lib/json/dialog/MultiQueryWrapperDialog.d.ts +0 -7
- package/dist/lib/json/dialog/MultiQueryWrapperDialog.js +0 -23
- package/dist/lib/json/dialog/QueryWrapperDialog.d.ts +0 -13
- package/dist/lib/json/dialog/QueryWrapperDialog.js +0 -20
- package/dist/lib/json/table/RefreshButton.d.ts +0 -3
- package/dist/lib/json/table/RefreshButton.js +0 -11
- package/dist/lib/json/table/TableRowActionsView.d.ts +0 -11
- package/dist/lib/json/table/TableRowActionsView.js +0 -36
- package/dist/lib/json/table/TableRowPublishPostButton.d.ts +0 -8
- package/dist/lib/json/table/TableRowPublishPostButton.js +0 -20
- package/dist/lib/json/table/TableView.d.ts +0 -3
- package/dist/lib/json/table/TableView.js +0 -65
- package/dist/lib/json/table/TableViewContext.d.ts +0 -14
- package/dist/lib/json/table/TableViewContext.js +0 -58
- package/dist/lib/json/table/useTableProps.d.ts +0 -3
- package/dist/lib/json/table/useTableProps.js +0 -57
- package/dist/lib/json/types/DetailsView.d.ts +0 -57
- package/dist/lib/json/types/DetailsView.js +0 -1
- package/dist/lib/json/types/EditItemDialog.d.ts +0 -4
- package/dist/lib/json/types/EditItemDialog.js +0 -1
- package/dist/lib/json/types/MultiQueryWrapper.d.ts +0 -18
- package/dist/lib/json/types/MultiQueryWrapper.js +0 -1
- package/dist/lib/json/types/MultiQueryWrapperDialog.d.ts +0 -13
- package/dist/lib/json/types/MultiQueryWrapperDialog.js +0 -1
- package/dist/lib/json/types/QueryWrapper.d.ts +0 -27
- package/dist/lib/json/types/QueryWrapper.js +0 -1
- package/dist/lib/json/types/QueryWrapperDialog.d.ts +0 -22
- package/dist/lib/json/types/QueryWrapperDialog.js +0 -1
- package/dist/lib/json/types/ScreenConfig.d.ts +0 -8
- package/dist/lib/json/types/ScreenConfig.js +0 -1
- package/dist/lib/json/types/TabbedView.d.ts +0 -22
- package/dist/lib/json/types/TabbedView.js +0 -1
- package/dist/lib/json/types/TableView.d.ts +0 -117
- package/dist/lib/json/types/TableView.js +0 -1
- package/dist/lib/layout/AdminLayout.d.ts +0 -13
- package/dist/lib/layout/AdminLayout.js +0 -15
- package/dist/lib/layout/ButtonBar.d.ts +0 -19
- package/dist/lib/layout/ButtonBar.js +0 -19
- package/dist/lib/layout/Content.d.ts +0 -9
- package/dist/lib/layout/Content.js +0 -9
- package/dist/lib/layout/PageTitleBar.d.ts +0 -6
- package/dist/lib/layout/PageTitleBar.js +0 -4
- package/dist/lib/layout/Sidebar.d.ts +0 -20
- package/dist/lib/layout/Sidebar.js +0 -12
- package/dist/lib/layout/menu/Menu.d.ts +0 -12
- package/dist/lib/layout/menu/Menu.js +0 -23
- package/dist/lib/layout/menu/MenuButton.d.ts +0 -6
- package/dist/lib/layout/menu/MenuButton.js +0 -5
- package/dist/lib/layout/menu/MenuConfig.d.ts +0 -13
- package/dist/lib/layout/menu/MenuConfig.js +0 -1
- package/dist/lib/layout/menu/MenuItem.d.ts +0 -11
- package/dist/lib/layout/menu/MenuItem.js +0 -11
- package/dist/lib/layout/menu/NextMenuItem.d.ts +0 -11
- package/dist/lib/layout/menu/NextMenuItem.js +0 -11
- package/dist/lib/layout/menu/SelectedIndicator.d.ts +0 -3
- package/dist/lib/layout/menu/SelectedIndicator.js +0 -4
- package/dist/lib/layout/menu/UserBlock.d.ts +0 -9
- package/dist/lib/layout/menu/UserBlock.js +0 -34
- package/dist/lib/modal/AttachDialog.d.ts +0 -30
- package/dist/lib/modal/AttachDialog.js +0 -73
- package/dist/lib/modal/FormActionDialog.d.ts +0 -23
- package/dist/lib/modal/FormActionDialog.js +0 -20
- package/dist/lib/page/PageContainer.d.ts +0 -2
- package/dist/lib/page/PageContainer.js +0 -5
- package/dist/lib/page/PageContentEditor.d.ts +0 -4
- package/dist/lib/page/PageContentEditor.js +0 -10
- package/dist/lib/page/PageMain.d.ts +0 -2
- package/dist/lib/page/PageMain.js +0 -5
- package/dist/lib/page/PageQueryStateContainer.d.ts +0 -21
- package/dist/lib/page/PageQueryStateContainer.js +0 -16
- package/dist/lib/page/PageSectionTitle.d.ts +0 -2
- package/dist/lib/page/PageSectionTitle.js +0 -4
- package/dist/lib/page/PageSidebar.d.ts +0 -2
- package/dist/lib/page/PageSidebar.js +0 -4
- package/dist/lib/page/PageSidebarSection.d.ts +0 -4
- package/dist/lib/page/PageSidebarSection.js +0 -5
- package/dist/lib/page/PageStateContainer.d.ts +0 -7
- package/dist/lib/page/PageStateContainer.js +0 -7
- package/dist/lib/page/PageSubSectionTitle.d.ts +0 -2
- package/dist/lib/page/PageSubSectionTitle.js +0 -4
- package/dist/lib/page/PageTitle.d.ts +0 -2
- package/dist/lib/page/PageTitle.js +0 -4
- package/dist/lib/page/PageTopBar.d.ts +0 -13
- package/dist/lib/page/PageTopBar.js +0 -78
- package/dist/lib/status/StatusBadge.d.ts +0 -4
- package/dist/lib/status/StatusBadge.js +0 -21
- package/dist/lib/table/TableColumnButton.d.ts +0 -1
- package/dist/lib/table/TableColumnButton.js +0 -53
- package/dist/lib/table/TableContainer.d.ts +0 -10
- package/dist/lib/table/TableContainer.js +0 -6
- package/dist/lib/table/TableContainerContext.d.ts +0 -18
- package/dist/lib/table/TableContainerContext.js +0 -40
- package/dist/lib/table/TableCreateButton.d.ts +0 -4
- package/dist/lib/table/TableCreateButton.js +0 -7
- package/dist/lib/table/TableFilterButton.d.ts +0 -2
- package/dist/lib/table/TableFilterButton.js +0 -8
- package/dist/lib/table/TableFilters.d.ts +0 -9
- package/dist/lib/table/TableFilters.js +0 -27
- package/dist/lib/table/TableMassActions.d.ts +0 -6
- package/dist/lib/table/TableMassActions.js +0 -9
- package/dist/lib/table/TableRowActionBar.d.ts +0 -10
- package/dist/lib/table/TableRowActionBar.js +0 -8
- package/dist/lib/table/TableRowActionButton.d.ts +0 -4
- package/dist/lib/table/TableRowActionButton.js +0 -5
- package/dist/lib/table/TableRowActionDialogButton.d.ts +0 -4
- package/dist/lib/table/TableRowActionDialogButton.js +0 -6
- package/dist/lib/table/TableRowDeleteButton.d.ts +0 -2
- package/dist/lib/table/TableRowDeleteButton.js +0 -6
- package/dist/lib/table/TableRowEditButton.d.ts +0 -2
- package/dist/lib/table/TableRowEditButton.js +0 -6
- package/dist/lib/table/TableRowNavigateButton.d.ts +0 -4
- package/dist/lib/table/TableRowNavigateButton.js +0 -14
- package/dist/lib/table/TableRowPublishPostButton.d.ts +0 -8
- package/dist/lib/table/TableRowPublishPostButton.js +0 -19
- package/dist/lib/table/TableRowViewButton.d.ts +0 -4
- package/dist/lib/table/TableRowViewButton.js +0 -13
- package/dist/lib/table/TableTopBar.d.ts +0 -8
- package/dist/lib/table/TableTopBar.js +0 -5
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
import { MutationQueryFn, MutationQueryKey } from "@compill/api";
|
|
2
|
-
import { ButtonProps, ModalProps } from "@valerya/ui";
|
|
3
|
-
interface ConfirmationActionButtonProps {
|
|
4
|
-
label: string;
|
|
5
|
-
buttonProps?: ButtonProps;
|
|
6
|
-
icon?: string;
|
|
7
|
-
queryKey: MutationQueryKey;
|
|
8
|
-
queryFn: MutationQueryFn<any, any>;
|
|
9
|
-
successMsg?: string;
|
|
10
|
-
errorMsg?: string;
|
|
11
|
-
invalidateParent?: boolean;
|
|
12
|
-
}
|
|
13
|
-
export declare function ConfirmationActionButton({ label, buttonProps, icon, queryKey, queryFn, successMsg, errorMsg, invalidateParent }: ConfirmationActionButtonProps): JSX.Element;
|
|
14
|
-
interface ConfirmationDialogProps extends Pick<ModalProps, "show" | "onClose"> {
|
|
15
|
-
title: string;
|
|
16
|
-
text: string;
|
|
17
|
-
positiveButtonLabel?: string;
|
|
18
|
-
negativeButtonLabel?: string;
|
|
19
|
-
queryKey: MutationQueryKey;
|
|
20
|
-
queryFn: MutationQueryFn<any, any>;
|
|
21
|
-
successMsg?: string;
|
|
22
|
-
errorMsg?: string;
|
|
23
|
-
invalidateParent?: boolean;
|
|
24
|
-
}
|
|
25
|
-
export declare function ConfirmationDialog({ title, text, positiveButtonLabel, negativeButtonLabel, queryKey, queryFn, successMsg, errorMsg, invalidateParent, show, onClose }: ConfirmationDialogProps): JSX.Element;
|
|
26
|
-
export {};
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "@soperio/jsx-runtime";
|
|
2
|
-
import { useApiMutation, useInvalidateParentMutation, useMutate } from "@compill/api";
|
|
3
|
-
import { ModalLoadingOverlay } from "@compill/components";
|
|
4
|
-
import { Button, Icon, Modal, ModalBody, ModalFooter, ModalHeader } from "@valerya/ui";
|
|
5
|
-
export function ConfirmationActionButton({ label, buttonProps, icon, queryKey, queryFn, successMsg, errorMsg, invalidateParent }) {
|
|
6
|
-
const mutation = invalidateParent ? useInvalidateParentMutation(queryFn, queryKey) : useApiMutation(queryFn, queryKey);
|
|
7
|
-
const mutate = useMutate(mutation, {
|
|
8
|
-
successMsg,
|
|
9
|
-
errorMsg
|
|
10
|
-
});
|
|
11
|
-
return (_jsxs(Button, { display: "flex", alignItems: "center", gap: "3", ...buttonProps, onClick: mutate, disabled: mutation.isLoading, children: [icon && _jsx(Icon, { path: icon }), label] }));
|
|
12
|
-
}
|
|
13
|
-
export function ConfirmationDialog({ title, text, positiveButtonLabel, negativeButtonLabel, queryKey, queryFn, successMsg, errorMsg, invalidateParent, show, onClose }) {
|
|
14
|
-
const mutation = invalidateParent ? useInvalidateParentMutation(queryFn, queryKey) : useApiMutation(queryFn, queryKey);
|
|
15
|
-
const mutate = useMutate(mutation, {
|
|
16
|
-
successMsg,
|
|
17
|
-
errorMsg
|
|
18
|
-
});
|
|
19
|
-
return (_jsxs(Modal, { show: show, onClose: onClose, children: [_jsx(ModalHeader, { children: _jsx("div", { textSize: "xl", fontWeight: "600", children: title }) }), _jsx(ModalBody, { children: text }), _jsxs(ModalFooter, { dflex: true, gap: "3", alignItems: "center", placeContent: "end", children: [_jsx(Button, { children: negativeButtonLabel || "Cancel" }), _jsx(Button, { onClick: mutate, children: positiveButtonLabel || "OK" })] }), mutation.isLoading && _jsx(ModalLoadingOverlay, {})] }));
|
|
20
|
-
}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import { EditItemDialogConfig } from "../types/EditItemDialog.js";
|
|
2
|
-
import { QueryWrapperDialogConfig } from "../types/QueryWrapperDialog.js";
|
|
3
|
-
import { MultiQueryWrapperDialogConfig } from "../types/MultiQueryWrapperDialog.js";
|
|
4
|
-
interface DialogRendererProps {
|
|
5
|
-
config: EditItemDialogConfig | QueryWrapperDialogConfig<any> | MultiQueryWrapperDialogConfig;
|
|
6
|
-
onClose: () => void;
|
|
7
|
-
invalidateQueryKey?: string[];
|
|
8
|
-
queryId?: string;
|
|
9
|
-
}
|
|
10
|
-
export declare function DialogRenderer({ config, onClose, invalidateQueryKey, queryId }: DialogRendererProps): JSX.Element | null;
|
|
11
|
-
export {};
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "@soperio/jsx-runtime";
|
|
2
|
-
import { ItemEditDialog } from "./ItemEditDialog.js";
|
|
3
|
-
import { QueryWrapperDialog } from "./QueryWrapperDialog.js";
|
|
4
|
-
import { MultiQueryWrapperDialog } from "./MultiQueryWrapperDialog.js";
|
|
5
|
-
export function DialogRenderer({ config, onClose, invalidateQueryKey, queryId }) {
|
|
6
|
-
const { type, ...props } = config;
|
|
7
|
-
if (config.type === "dialog")
|
|
8
|
-
return _jsx(ItemEditDialog, { ...props, queryId: queryId, invalidateQueryKey: invalidateQueryKey, show: true, onClose: onClose });
|
|
9
|
-
if (config.type === "query")
|
|
10
|
-
return _jsx(QueryWrapperDialog, { ...props, queryId: queryId, invalidateQueryKey: invalidateQueryKey, onClose: onClose });
|
|
11
|
-
if (config.type === "multiQuery")
|
|
12
|
-
return _jsx(MultiQueryWrapperDialog, { ...props, queryId: queryId, invalidateQueryKey: invalidateQueryKey, onClose: onClose });
|
|
13
|
-
return null;
|
|
14
|
-
}
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import { CRUDAPI } from "@compill/api";
|
|
2
|
-
import { ModalProps } from "@valerya/ui";
|
|
3
|
-
import React from "react";
|
|
4
|
-
export interface ItemDeleteDialogProps extends ModalProps {
|
|
5
|
-
itemLabel: string;
|
|
6
|
-
queryId: string;
|
|
7
|
-
api: CRUDAPI<any>;
|
|
8
|
-
apiFn?: string;
|
|
9
|
-
invalidateQueriesOnSuccess?: boolean;
|
|
10
|
-
invalidateQueryKey?: string[];
|
|
11
|
-
msg?: (itemLabel: string) => string | React.ReactNode;
|
|
12
|
-
actionButtonLabel?: string;
|
|
13
|
-
closeActionButtonLabel?: string;
|
|
14
|
-
title?: string;
|
|
15
|
-
onSuccess?: () => void;
|
|
16
|
-
}
|
|
17
|
-
export declare function ItemDeleteDialog({ title, actionButtonLabel, closeActionButtonLabel, itemLabel, queryId, api, apiFn, invalidateQueriesOnSuccess, invalidateQueryKey, size, md_boxSizing, msg, show, onClose, onSuccess, ...props }: ItemDeleteDialogProps): JSX.Element;
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "@soperio/jsx-runtime";
|
|
2
|
-
import { useApiMutation, useInvalidateParentMutation, useMutate } from "@compill/api";
|
|
3
|
-
import { ModalLoadingOverlay } from "@compill/components";
|
|
4
|
-
import { runIfFn } from "@soperio/react";
|
|
5
|
-
import { Button, Modal } from "@valerya/ui";
|
|
6
|
-
import React from "react";
|
|
7
|
-
export function ItemDeleteDialog({ title, actionButtonLabel, closeActionButtonLabel = "Cancel", itemLabel, queryId = "", api, apiFn, invalidateQueriesOnSuccess = true, invalidateQueryKey, size = "lg", md_boxSizing, msg, show, onClose, onSuccess, ...props }) {
|
|
8
|
-
const fn = apiFn ? api[apiFn] : api.delete;
|
|
9
|
-
const mutation = invalidateQueriesOnSuccess ? useInvalidateParentMutation(fn, invalidateQueryKey ?? api.queryKey)
|
|
10
|
-
: useApiMutation(fn, api.queryKey);
|
|
11
|
-
const mutate = useMutate(mutation, { onSuccess: () => { onClose?.(); onSuccess?.(); } });
|
|
12
|
-
const handleDelete = React.useCallback(() => mutate(queryId), [mutate, queryId]);
|
|
13
|
-
return (_jsxs(Modal, { size: size, show: show, onClose: onClose, scheme: "danger", variant: "glass", transition: true, ...props, children: [_jsx(Modal.Header, { children: title || `Delete ${itemLabel}` }), _jsxs(Modal.Body, { pb: "6", children: [!msg && `Do you really want to delete ${itemLabel}?`, msg && runIfFn(msg, itemLabel)] }), _jsxs(Modal.Footer, { dflex: true, placeContent: "end", spaceX: "3", children: [_jsx(Button, { disabled: mutation.isPending, onClick: onClose, variant: "borderless", scheme: "dark", me: "2", children: closeActionButtonLabel }), _jsx(Button, { scheme: "danger", disabled: mutation.isPending, onClick: handleDelete, children: actionButtonLabel || "Delete" })] }), mutation.isPending && _jsx(ModalLoadingOverlay, {})] }));
|
|
14
|
-
}
|
|
@@ -1,32 +0,0 @@
|
|
|
1
|
-
import { CRUDAPI } from "@compill/api";
|
|
2
|
-
import { FormRendererConfig } from "@compill/form";
|
|
3
|
-
import { UseMutationOptions, UseQueryOptions } from "@tanstack/react-query";
|
|
4
|
-
import { ModalProps } from "@valerya/ui";
|
|
5
|
-
import { FormikConfig } from "formik";
|
|
6
|
-
import React from "react";
|
|
7
|
-
export interface ItemEditDialogProps<TFormData extends {} = any, TResultData extends {} = any> extends Omit<ModalProps, "id" | "children" | "title" | "position"> {
|
|
8
|
-
itemLabel?: string;
|
|
9
|
-
queryId?: string;
|
|
10
|
-
api: CRUDAPI<any>;
|
|
11
|
-
initialValues?: any;
|
|
12
|
-
queryFetchOptions?: UseQueryOptions;
|
|
13
|
-
querySaveOptions?: UseMutationOptions<TResultData, unknown, TFormData>;
|
|
14
|
-
onSuccess?: (item: TResultData, response: any) => void;
|
|
15
|
-
onFetchError?: () => void;
|
|
16
|
-
fetchErrorMsg?: string;
|
|
17
|
-
onSaveError?: (item: TFormData) => void;
|
|
18
|
-
saveErrorMsg?: string;
|
|
19
|
-
fetchToFormData?: (item: TResultData) => TFormData;
|
|
20
|
-
formToQueryData?: (TFormData: any) => Partial<TResultData>;
|
|
21
|
-
invalidateQueriesOnSuccess?: boolean;
|
|
22
|
-
invalidateQueryKey?: string[];
|
|
23
|
-
retryText?: string;
|
|
24
|
-
cancelLabel?: string;
|
|
25
|
-
saveLabel?: string;
|
|
26
|
-
title?: ((item?: TResultData) => string);
|
|
27
|
-
formikProps: Omit<FormikConfig<any>, "initialValues" | "onSubmit">;
|
|
28
|
-
form: React.ReactNode | FormRendererConfig | ((item: TResultData) => FormRendererConfig);
|
|
29
|
-
show: boolean;
|
|
30
|
-
onClose: () => void;
|
|
31
|
-
}
|
|
32
|
-
export declare function ItemEditDialog<TFormData extends {}, TResultData extends {}>({ initialValues, itemLabel, queryId, api, queryFetchOptions, querySaveOptions, onSuccess, onFetchError, fetchErrorMsg, onSaveError, saveErrorMsg, fetchToFormData, formToQueryData, invalidateQueriesOnSuccess, invalidateQueryKey, retryText, cancelLabel, saveLabel, size, title, form, show, onClose, formikProps, ...props }: ItemEditDialogProps<TFormData, TResultData>): JSX.Element;
|
|
@@ -1,77 +0,0 @@
|
|
|
1
|
-
import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "@soperio/jsx-runtime";
|
|
2
|
-
import { useApiMutation, useApiQuery, useInvalidateParentMutation } from "@compill/api";
|
|
3
|
-
import { ModalLoadingOverlay, QueryLoadingState, RetryOnError } from "@compill/components";
|
|
4
|
-
import { FormRenderer } from "@compill/form";
|
|
5
|
-
import { isFunction } from "@soperio/react";
|
|
6
|
-
import { Button, Modal } from "@valerya/ui";
|
|
7
|
-
import { Form, Formik } from "formik";
|
|
8
|
-
import React from "react";
|
|
9
|
-
import { toast } from "react-toastify";
|
|
10
|
-
const defaultErrorMsg = "Oops, something went wrong...";
|
|
11
|
-
function nonNullValues(data) {
|
|
12
|
-
if (data) {
|
|
13
|
-
const nonNullData = { ...data };
|
|
14
|
-
for (const key in data)
|
|
15
|
-
nonNullData[key] = nonNullData[key] ?? "";
|
|
16
|
-
return nonNullData;
|
|
17
|
-
}
|
|
18
|
-
return data;
|
|
19
|
-
}
|
|
20
|
-
export function ItemEditDialog({ initialValues, itemLabel, queryId = "", api, queryFetchOptions, querySaveOptions, onSuccess, onFetchError, fetchErrorMsg = defaultErrorMsg, onSaveError, saveErrorMsg = defaultErrorMsg, fetchToFormData, formToQueryData, invalidateQueriesOnSuccess = true, invalidateQueryKey, retryText = "Retry", cancelLabel = "Cancel", saveLabel, size = "lg", title, form, show, onClose, formikProps, ...props }) {
|
|
21
|
-
const { isInitialLoading, isFetching, data, isError, error /*, error*/, refetch } = useApiQuery(api.queryKey, api.get, queryId, {
|
|
22
|
-
enabled: !( /*queryId == 0 || */queryId == "" || queryId == null || queryId == undefined), // means than this query is only enabled if the id is defined
|
|
23
|
-
onError: onFetchError,
|
|
24
|
-
...queryFetchOptions
|
|
25
|
-
});
|
|
26
|
-
// const [activeTab, setActiveTab] = React.useState(form && Array.isArray(form) ? form[0].key : "");
|
|
27
|
-
// const [showTab, setShowTab] = React.useState(true);
|
|
28
|
-
const mutation = invalidateQueriesOnSuccess ? useInvalidateParentMutation(api.upsert, invalidateQueryKey ?? api.queryKey, querySaveOptions)
|
|
29
|
-
: useApiMutation(api.upsert, api.queryKey, queryId, querySaveOptions);
|
|
30
|
-
const retry = React.useCallback(() => refetch(), [refetch]);
|
|
31
|
-
const saveItem = React.useCallback(async (item, actions) => {
|
|
32
|
-
// Clear mutation error if any
|
|
33
|
-
mutation.reset();
|
|
34
|
-
const formItem = formToQueryData ? formToQueryData(item) : { ...item };
|
|
35
|
-
await mutation.mutateAsync(formItem)
|
|
36
|
-
.then((response) => {
|
|
37
|
-
if (onSuccess)
|
|
38
|
-
onSuccess(formItem, response);
|
|
39
|
-
else
|
|
40
|
-
toast.success(`${title ? title(formItem) : formItem.name ?? formItem.title} ${queryId ? "saved" : "created"}`);
|
|
41
|
-
// closing delete modal
|
|
42
|
-
onClose?.();
|
|
43
|
-
})
|
|
44
|
-
.catch(error => {
|
|
45
|
-
console.error("on error", error);
|
|
46
|
-
if (onSaveError)
|
|
47
|
-
onSaveError(item);
|
|
48
|
-
else
|
|
49
|
-
toast.error(`Couldn't save ${title ? title(formItem) : formItem.name ?? formItem.title}`);
|
|
50
|
-
actions.setSubmitting(false);
|
|
51
|
-
});
|
|
52
|
-
}, [mutation, formToQueryData, onSuccess, onSaveError, onClose]);
|
|
53
|
-
// const switchTab = React.useCallback((tab: string) =>
|
|
54
|
-
// {
|
|
55
|
-
// setActiveTab(tab);
|
|
56
|
-
// setShowTab(false);
|
|
57
|
-
// setTimeout(function ()
|
|
58
|
-
// {
|
|
59
|
-
// setActiveTab(tab);
|
|
60
|
-
// setShowTab(true);
|
|
61
|
-
// }, 150);
|
|
62
|
-
// }, [setActiveTab])
|
|
63
|
-
return (_jsxs(Modal, { size: size, show: show, onClose: onClose, scheme: "light", transition: true, ...props, children: [_jsxs(Modal.Header, { children: [!isInitialLoading && queryId && `Edit ${title ? title(data) : data?.["name"] ?? data?.["title"] ?? data?.["name"] ?? ""}`, !queryId && `Create new ${itemLabel ?? "item"}`, Array.isArray(form) && (_jsx(_Fragment, {})
|
|
64
|
-
// <ul className="nav nav-bold nav-pills">
|
|
65
|
-
// {form.map(item =>
|
|
66
|
-
// <li key={item.key} className="nav-item cursor-pointer bg-hover-light rounded" onClick={() => switchTab(item.key)}>
|
|
67
|
-
// <span className={clsx("nav-link", activeTab === item.key && "active")} data-toggle="tab">{item.label}</span>
|
|
68
|
-
// </li>
|
|
69
|
-
// )}
|
|
70
|
-
// </ul>
|
|
71
|
-
)] }), isInitialLoading && (_jsx(Modal.Body, { children: _jsx(QueryLoadingState, { minW: "72" }) })), isError && (_jsx(Modal.Body, { children: _jsx(RetryOnError, { label: `${fetchErrorMsg} ${error}`, onClick: retry }) })), !isInitialLoading && !isError &&
|
|
72
|
-
(_jsx(_Fragment, { children: _jsx(Formik
|
|
73
|
-
// initialValues={fetchToFormData && queryId && data ? fetchToFormData(nonNullValues(data)) : nonNullValues(data) ?? initialValues(data) ?? {}}
|
|
74
|
-
, {
|
|
75
|
-
// initialValues={fetchToFormData && queryId && data ? fetchToFormData(nonNullValues(data)) : nonNullValues(data) ?? initialValues(data) ?? {}}
|
|
76
|
-
initialValues: fetchToFormData && queryId && data ? fetchToFormData(nonNullValues(data)) : nonNullValues(initialValues(data)) ?? {}, onSubmit: saveItem, ...formikProps, children: ({ setFieldValue, dirty, handleSubmit, isValid, values }) => (_jsxs(_Fragment, { children: [_jsx(Modal.Body, { pb: "6", children: _jsxs(Form, { children: [React.isValidElement(form) && form, Array.isArray(form) && _jsx(FormRenderer, { form: form }), isFunction(form) && _jsx(FormRenderer, { form: form(data ?? values) })] }) }), _jsxs(Modal.Footer, { dflex: true, placeContent: "end", spaceX: "3", children: [_jsx(Button, { disabled: mutation.isLoading, onClick: onClose, variant: "borderless", me: "2", children: cancelLabel }), _jsx(Button, { type: "submit", disabled: !dirty || mutation.isLoading /* || !isValid*/, onClick: () => handleSubmit(), children: saveLabel ? saveLabel : (queryId ? "Update" : "Create") })] })] })) }) })), mutation.isLoading && _jsx(ModalLoadingOverlay, {})] }));
|
|
77
|
-
}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import { MultiQueryWrapperDialogConfig } from "../types/MultiQueryWrapperDialog.js";
|
|
2
|
-
export type MultiQueryWrapperDialogProps = Omit<MultiQueryWrapperDialogConfig, "type"> & {
|
|
3
|
-
queryId?: string;
|
|
4
|
-
onClose: () => void;
|
|
5
|
-
invalidateQueryKey?: string[];
|
|
6
|
-
};
|
|
7
|
-
export declare function MultiQueryWrapperDialog({ queries, config, onClose, queryId, invalidateQueryKey }: MultiQueryWrapperDialogProps): JSX.Element;
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "@soperio/jsx-runtime";
|
|
2
|
-
import { useApiQueries } from "@compill/api";
|
|
3
|
-
import React from "react";
|
|
4
|
-
import { ItemEditDialog } from "./ItemEditDialog.js";
|
|
5
|
-
export function MultiQueryWrapperDialog({ queries, config, onClose, queryId, invalidateQueryKey }) {
|
|
6
|
-
const { data, isFetching, isError } = useApiQueries(queries.map(q => ({
|
|
7
|
-
queryKey: q.api.queryKey,
|
|
8
|
-
queryFn: q.fn == "get" ? q.api.get : q.api.getAll,
|
|
9
|
-
queryOptions: {
|
|
10
|
-
cacheTime: q.cache === false ? 0 : undefined,
|
|
11
|
-
staleTime: q.cache === false ? 0 : undefined
|
|
12
|
-
}
|
|
13
|
-
})));
|
|
14
|
-
const transformedData = React.useMemo(() => {
|
|
15
|
-
return data?.map((d, index) => queries[index]?.transformFn ? queries[index]?.transformFn?.(d) : d);
|
|
16
|
-
}, [data, queries]);
|
|
17
|
-
// TODO This is not really good
|
|
18
|
-
// So instead, add a isPreloading and isPreloadingError to ItemEditDialog to handle the cases
|
|
19
|
-
// if (isFetching)
|
|
20
|
-
// return null
|
|
21
|
-
// @ts-ignore
|
|
22
|
-
return _jsx(ItemEditDialog, { isPreloading: isFetching, ...config(...transformedData), queryId: queryId, invalidateQueryKey: invalidateQueryKey, show: true, onClose: onClose });
|
|
23
|
-
}
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { CRUDAPI, CRUD_MODEL } from "@compill/api";
|
|
2
|
-
import { QueryWrapperDialogConfig } from "../types/QueryWrapperDialog.js";
|
|
3
|
-
import { EditItemDialogConfig } from "../types/EditItemDialog.js";
|
|
4
|
-
export type QueryWrapperDialogProps<T extends CRUD_MODEL, U> = Omit<QueryWrapperDialogConfig<T, U>, "type"> & {
|
|
5
|
-
api: CRUDAPI<any>;
|
|
6
|
-
fn: "get" | "getTransformed" | "getAll" | "getAllTransformed";
|
|
7
|
-
transformFn?: (data: T) => U;
|
|
8
|
-
config: (data?: T | U) => Omit<EditItemDialogConfig, "type">;
|
|
9
|
-
onClose: () => void;
|
|
10
|
-
queryId?: string;
|
|
11
|
-
invalidateQueryKey?: string[];
|
|
12
|
-
};
|
|
13
|
-
export declare function QueryWrapperDialog<T extends CRUD_MODEL, U>({ api, fn, transformFn, config, onClose, queryId, invalidateQueryKey }: QueryWrapperDialogProps<T, U>): JSX.Element | null;
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "@soperio/jsx-runtime";
|
|
2
|
-
import { useApiQuery } from "@compill/api";
|
|
3
|
-
import React from "react";
|
|
4
|
-
import { ItemEditDialog } from "./ItemEditDialog.js";
|
|
5
|
-
export function QueryWrapperDialog({ api, fn, transformFn, config, onClose, queryId, invalidateQueryKey }) {
|
|
6
|
-
const { data, isFetching } = useApiQuery(api.queryKey, fn === "get" || fn === "getTransformed" ? api.get : api.getAll, undefined, { retryOnMount: false, refetchOnMount: false, refetchOnWindowFocus: false });
|
|
7
|
-
const transformedData = React.useMemo(() => {
|
|
8
|
-
if (data && (fn === "getTransformed" || fn === "getAllTransformed")) {
|
|
9
|
-
if (!transformFn)
|
|
10
|
-
console.warn(`QueryWrapperDialog: you forgot to pass transformFn as parameter for fn ${fn}`);
|
|
11
|
-
// @ts-ignore
|
|
12
|
-
return transformFn?.(data);
|
|
13
|
-
}
|
|
14
|
-
return data;
|
|
15
|
-
}, [data, fn, transformFn]);
|
|
16
|
-
if (isFetching)
|
|
17
|
-
return null;
|
|
18
|
-
// @ts-ignore
|
|
19
|
-
return _jsx(ItemEditDialog, { ...config(transformedData), queryId: queryId, invalidateQueryKey: invalidateQueryKey, show: true, onClose: onClose });
|
|
20
|
-
}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "@soperio/jsx-runtime";
|
|
2
|
-
import { useInvalidateQuery } from "@compill/api";
|
|
3
|
-
import { mdiRefresh } from "@mdi/js";
|
|
4
|
-
import { Icon } from "@valerya/ui";
|
|
5
|
-
import { ButtonBarButton } from "../../layout/ButtonBar.js";
|
|
6
|
-
import { useHotkeys } from "react-hotkeys-hook";
|
|
7
|
-
export function RefreshButton({ queryKey }) {
|
|
8
|
-
const invalidate = useInvalidateQuery(queryKey);
|
|
9
|
-
useHotkeys('ctrl+r', () => invalidate(), { preventDefault: true }, [invalidate]);
|
|
10
|
-
return (_jsx(ButtonBarButton, { scheme: "dark", size: "sm", aspectRatio: "square", variant: "borderless", onClick: invalidate, children: _jsx(Icon, { path: mdiRefresh }) }));
|
|
11
|
-
}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import { TableRowAction } from "../types/TableView.js";
|
|
2
|
-
import { API } from "@compill/admin-api";
|
|
3
|
-
interface TableRowActionViewProps {
|
|
4
|
-
row: any;
|
|
5
|
-
onAction: (action: TableRowAction, item: any) => void;
|
|
6
|
-
rowActions?: TableRowAction[] | ((item?: any) => TableRowAction[]);
|
|
7
|
-
api: API<any>;
|
|
8
|
-
queryKey: string[];
|
|
9
|
-
}
|
|
10
|
-
export declare function TableRowActionsView({ row, onAction, rowActions, api, queryKey }: TableRowActionViewProps): JSX.Element;
|
|
11
|
-
export {};
|
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@soperio/jsx-runtime";
|
|
2
|
-
import { mdiDelete, mdiEye, mdiOpenInNew, mdiPencil } from "@mdi/js";
|
|
3
|
-
import { Icon } from "@valerya/ui";
|
|
4
|
-
import { TableRowPublishPostButton } from "./TableRowPublishPostButton.js";
|
|
5
|
-
import React from "react";
|
|
6
|
-
import { TableRowActionButton } from "@compill/admin";
|
|
7
|
-
import { runIfFn } from "@soperio/react";
|
|
8
|
-
export function TableRowActionsView({ row, onAction, rowActions, api, queryKey }) {
|
|
9
|
-
const item = row.original;
|
|
10
|
-
return (_jsx("div", { dflex: true, w: "full", alignItems: "stretch", placeContent: "end", h: "full", children: runIfFn(rowActions, item)?.map((action, index) => (_jsxs(React.Fragment, { children: [action.type === "publish" && _jsx(TableRowPublishPostButton, { id: item.id, api: action.api ?? api, status: item.status, invalidateQueryKey: queryKey }), action.type == "custom" && _jsx(_Fragment, { children: action.component(item, queryKey, action.icon, action.label) }), !["publish", "custom"].includes(action.type) &&
|
|
11
|
-
(_jsx(ActionButton, { onClick: () => onAction(action, item), scheme: schemes[action.type], children: _jsx(Icon, { path: icons[action.type], size: "sm" }) }))] }, index))) }));
|
|
12
|
-
}
|
|
13
|
-
function ActionButton({ onClick, ...props }) {
|
|
14
|
-
const handleClick = React.useCallback((event) => {
|
|
15
|
-
event?.preventDefault();
|
|
16
|
-
event?.stopPropagation();
|
|
17
|
-
onClick?.(event);
|
|
18
|
-
}, [onClick]);
|
|
19
|
-
return (_jsx(TableRowActionButton, { onClick: handleClick, ...props }));
|
|
20
|
-
}
|
|
21
|
-
const icons = {
|
|
22
|
-
"link": mdiOpenInNew,
|
|
23
|
-
"view": mdiEye,
|
|
24
|
-
"edit": mdiPencil,
|
|
25
|
-
"delete": mdiDelete,
|
|
26
|
-
"publish": mdiDelete,
|
|
27
|
-
"custom": ""
|
|
28
|
-
};
|
|
29
|
-
const schemes = {
|
|
30
|
-
"link": "dark",
|
|
31
|
-
"view": "dark",
|
|
32
|
-
"edit": "dark",
|
|
33
|
-
"delete": "dark",
|
|
34
|
-
"publish": "dark",
|
|
35
|
-
"custom": "dark"
|
|
36
|
-
};
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import { ButtonProps } from "@valerya/ui";
|
|
2
|
-
import { API } from "@compill/admin-api";
|
|
3
|
-
export declare function TableRowPublishPostButton({ id, api, status, invalidateQueryKey, ...props }: {
|
|
4
|
-
id: string;
|
|
5
|
-
api: API<any>;
|
|
6
|
-
status: "draft" | "published";
|
|
7
|
-
invalidateQueryKey?: string[];
|
|
8
|
-
} & ButtonProps): JSX.Element;
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "@soperio/jsx-runtime";
|
|
2
|
-
import { Icon } from "@valerya/ui";
|
|
3
|
-
import { mdiPublish, mdiPublishOff } from "@mdi/js";
|
|
4
|
-
import { Button } from "@valerya/ui";
|
|
5
|
-
import React from "react";
|
|
6
|
-
import { useInvalidateParentMutation } from "@compill/api";
|
|
7
|
-
import { toast } from "react-toastify";
|
|
8
|
-
export function TableRowPublishPostButton({ id, api, status, invalidateQueryKey, ...props }) {
|
|
9
|
-
const isDraft = status == "draft";
|
|
10
|
-
const mutation = useInvalidateParentMutation(isDraft ? api.publish : api.unpublish, invalidateQueryKey ?? api.queryKey, { networkMode: "always" });
|
|
11
|
-
const publish = React.useCallback((event) => {
|
|
12
|
-
event?.preventDefault();
|
|
13
|
-
event?.stopPropagation();
|
|
14
|
-
mutation.reset();
|
|
15
|
-
mutation.mutateAsync(id)
|
|
16
|
-
.then(() => toast.success(isDraft ? "Published!" : "Unpublished!"))
|
|
17
|
-
.catch(error => toast.error(`Error: ${error}`));
|
|
18
|
-
}, [mutation, id]);
|
|
19
|
-
return (_jsx(Button, { variant: "borderless", corners: "square", scheme: "dark", onClick: publish, ...props, children: _jsx(Icon, { path: isDraft ? mdiPublish : mdiPublishOff, size: "sm" }) }));
|
|
20
|
-
}
|
|
@@ -1,65 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@soperio/jsx-runtime";
|
|
2
|
-
import { Table, useTableContext } from "@compill/table";
|
|
3
|
-
import { isFunction, runIfFn } from "@soperio/react";
|
|
4
|
-
import React from "react";
|
|
5
|
-
import { useParams } from "react-router-dom";
|
|
6
|
-
import { InvalidateButton } from "../../buttons/InvalidateButton.js";
|
|
7
|
-
import { PageContainer } from "../../page/PageContainer.js";
|
|
8
|
-
import { TableContainer } from "../../table/TableContainer.js";
|
|
9
|
-
import { TableCreateButton } from "../../table/TableCreateButton.js";
|
|
10
|
-
import { TableFilterButton } from "../../table/TableFilterButton.js";
|
|
11
|
-
import { TableTopBar } from "../../table/TableTopBar.js";
|
|
12
|
-
import { ButtonBar } from "../../layout/ButtonBar.js";
|
|
13
|
-
import { TableFilters } from "../../table/TableFilters.js";
|
|
14
|
-
import { TableMassActions } from "../../table/TableMassActions.js";
|
|
15
|
-
import { DialogRenderer } from "../dialog/DialogRenderer.js";
|
|
16
|
-
import { RefreshButton } from "./RefreshButton.js";
|
|
17
|
-
import { TableViewProvider, useTableViewContext } from "./TableViewContext.js";
|
|
18
|
-
import { useTableProps } from "./useTableProps.js";
|
|
19
|
-
function useId(queryField) {
|
|
20
|
-
const params = useParams();
|
|
21
|
-
if (queryField === undefined)
|
|
22
|
-
return undefined;
|
|
23
|
-
const { [queryField]: id } = params;
|
|
24
|
-
return id;
|
|
25
|
-
}
|
|
26
|
-
export function TableView({ queryField, title, subtitle, screen, ...props }) {
|
|
27
|
-
const id = useId(queryField);
|
|
28
|
-
const _screen = runIfFn(screen, id);
|
|
29
|
-
return (_jsx(PageContainer, { bgColor: "white", ...props, children: _jsx(TableContainer, { columns: _screen.table.columns, initialVisibleColumns: _screen.table.initialVisibleColumns, filtersMethod: _screen.table.filtersMethod, children: _jsx(TT, { id: id, title: title, subtitle: subtitle, screen: _screen }) }) }));
|
|
30
|
-
}
|
|
31
|
-
function TT({ id, title, subtitle, screen }) {
|
|
32
|
-
const { setRowSelection } = useTableContext();
|
|
33
|
-
const { api, table, filters, massActions, buttonBar, rowActions, createView, editView, deleteItem, breadcrumbs } = screen;
|
|
34
|
-
const tableApi = runIfFn(api, id ?? "");
|
|
35
|
-
return (_jsxs(_Fragment, { children: [_jsx(TableTopBar, { title: title, breadcrumbs: breadcrumbs, children: _jsx(TableButtonBar, { buttonBar: buttonBar, createView: createView, editView: editView, api: tableApi, queryKey: tableApi.queryKey, children: filters && _jsx(TableFilterButton, {}) }) }), filters &&
|
|
36
|
-
(_jsx(TableFilters, { form: filters.form, initialValues: filters.initialValues, schema: filters.schema, processInput: filters.processInput })), massActions && _jsx(TableMassActions, { actions: massActions.items }), _jsxs(TableViewProvider, { queryKey: tableApi.queryKey, editView: editView, deleteItem: deleteItem, children: [_jsx(TableWrapper, { table: { ...table, onSelectionChange: setRowSelection }, rowActions: rowActions, api: tableApi, subtitle: subtitle, queryParams: screen.queryParams }), _jsx(TableDialogManager, {})] })] }));
|
|
37
|
-
}
|
|
38
|
-
function TableButtonBar({ buttonBar, queryKey, createView, editView, api, children }) {
|
|
39
|
-
const createDialogFn = React.useCallback((data) => {
|
|
40
|
-
return (onClose) => {
|
|
41
|
-
const view = runIfFn(createView, data) ?? runIfFn(editView, null);
|
|
42
|
-
if (view.type == "customDialog")
|
|
43
|
-
return view.render({ show: true, onClose });
|
|
44
|
-
else
|
|
45
|
-
return _jsx(DialogRenderer, { config: view, onClose: onClose, invalidateQueryKey: api.queryKey });
|
|
46
|
-
};
|
|
47
|
-
}, [createView, editView, api]);
|
|
48
|
-
return (_jsxs(ButtonBar, { children: [_jsx(RefreshButton, { queryKey: queryKey }), buttonBar && buttonBar.map((button, index) => _jsxs(React.Fragment, { children: [button.type === "create" && editView &&
|
|
49
|
-
(_jsx(TableCreateButton, { buildDialog: createDialogFn(button.data), icon: button.icon, children: button.label })), button.type === "invalidate" && _jsx(InvalidateButton, { pathOrPermalink: button.pathOrPermalink }), button.type === "custom" && button.render()] }, index)), children] }));
|
|
50
|
-
}
|
|
51
|
-
function TableWrapper({ table, subtitle, rowActions, api, queryParams }) {
|
|
52
|
-
const tableProps = useTableProps(api, table, rowActions, queryParams);
|
|
53
|
-
const _subtitle = React.useMemo(() => {
|
|
54
|
-
if (!subtitle)
|
|
55
|
-
return undefined;
|
|
56
|
-
return (data) => {
|
|
57
|
-
return (_jsx("div", { textSize: "lg", textColor: "#475569", fontWeight: "600", children: isFunction(subtitle) ? subtitle(data) : subtitle }));
|
|
58
|
-
};
|
|
59
|
-
}, [subtitle]);
|
|
60
|
-
return _jsx(Table, { ...tableProps, p: "8", title: _subtitle });
|
|
61
|
-
}
|
|
62
|
-
function TableDialogManager() {
|
|
63
|
-
const { dialog } = useTableViewContext();
|
|
64
|
-
return dialog;
|
|
65
|
-
}
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { TableRowAction, TableViewDeleteItem, TableViewEditView } from "../types/TableView.js";
|
|
3
|
-
type TableViewContextProps = {
|
|
4
|
-
onAction: (action: TableRowAction, item: any) => void;
|
|
5
|
-
dialog?: React.ReactNode;
|
|
6
|
-
};
|
|
7
|
-
declare const useContext: () => TableViewContextProps;
|
|
8
|
-
export interface TableViewProviderProps extends React.PropsWithChildren {
|
|
9
|
-
queryKey: string[];
|
|
10
|
-
editView?: TableViewEditView | ((item: any) => TableViewEditView);
|
|
11
|
-
deleteItem?: TableViewDeleteItem | ((item: any) => TableViewDeleteItem);
|
|
12
|
-
}
|
|
13
|
-
declare function TableViewProvider({ editView, deleteItem, queryKey, children }: TableViewProviderProps): JSX.Element;
|
|
14
|
-
export { TableViewProvider, useContext as useTableViewContext };
|
|
@@ -1,58 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "@soperio/jsx-runtime";
|
|
2
|
-
import { useOpenLink } from "@compill/hooks";
|
|
3
|
-
import { createContext, runIfFn } from "@soperio/react";
|
|
4
|
-
import React from "react";
|
|
5
|
-
import { useNavigate } from "react-router-dom";
|
|
6
|
-
import { DialogRenderer } from "../dialog/DialogRenderer.js";
|
|
7
|
-
import { ItemDeleteDialog } from "../dialog/ItemDeleteDialog.js";
|
|
8
|
-
import { AppEnv } from "@compill/env";
|
|
9
|
-
const [provider, useContext] = createContext();
|
|
10
|
-
function TableViewProvider({ editView, deleteItem, queryKey, children }) {
|
|
11
|
-
const openLink = useOpenLink();
|
|
12
|
-
const navigate = useNavigate();
|
|
13
|
-
const [dialog, setDialog] = React.useState(null);
|
|
14
|
-
const onCloseDialog = React.useCallback(() => setDialog(null), [setDialog]);
|
|
15
|
-
const onAction = React.useCallback((action, item) => {
|
|
16
|
-
switch (action.type) {
|
|
17
|
-
case "view":
|
|
18
|
-
{
|
|
19
|
-
navigate(runIfFn(action.path, item));
|
|
20
|
-
break;
|
|
21
|
-
}
|
|
22
|
-
case "link":
|
|
23
|
-
{
|
|
24
|
-
openLink(`${AppEnv.websiteUrl()}/${runIfFn(action.path, item)}`);
|
|
25
|
-
break;
|
|
26
|
-
}
|
|
27
|
-
case "edit":
|
|
28
|
-
{
|
|
29
|
-
const editConfig = runIfFn(editView, item);
|
|
30
|
-
if (editConfig) {
|
|
31
|
-
if (editConfig.type == "customDialog") {
|
|
32
|
-
setDialog(editConfig.render({ show: true, onClose: onCloseDialog }));
|
|
33
|
-
}
|
|
34
|
-
else {
|
|
35
|
-
setDialog(_jsx(DialogRenderer, { onClose: onCloseDialog, config: editConfig, queryId: item.id, invalidateQueryKey: queryKey }));
|
|
36
|
-
}
|
|
37
|
-
}
|
|
38
|
-
break;
|
|
39
|
-
}
|
|
40
|
-
case "delete":
|
|
41
|
-
{
|
|
42
|
-
const deleteConfig = runIfFn(deleteItem, item);
|
|
43
|
-
setDialog(_jsx(ItemDeleteDialog, { show: true, onClose: onCloseDialog, queryId: item.id, invalidateQueryKey: queryKey, msg: item.msg, ...deleteConfig, itemLabel: runIfFn(deleteConfig.itemLabel, item) }));
|
|
44
|
-
// TODO
|
|
45
|
-
// const { initialValues, ...props } = editItem!!
|
|
46
|
-
// setDialog(<ItemEditDialog {...props} initialValues={runIfFn(initialValues, item)} show queryId={item?.id} onClose={onCloseDialog} />)
|
|
47
|
-
break;
|
|
48
|
-
}
|
|
49
|
-
}
|
|
50
|
-
}, [navigate, editView, deleteItem]);
|
|
51
|
-
const Provider = provider;
|
|
52
|
-
const value = {
|
|
53
|
-
dialog,
|
|
54
|
-
onAction
|
|
55
|
-
};
|
|
56
|
-
return _jsx(Provider, { value: value, children: children });
|
|
57
|
-
}
|
|
58
|
-
export { TableViewProvider, useContext as useTableViewContext };
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
import { API } from "@compill/admin-api";
|
|
2
|
-
import { TableRowAction, TableViewTable } from "../types/TableView.js";
|
|
3
|
-
export declare function useTableProps(api: API<any>, table: TableViewTable, rowActions?: TableRowAction[] | ((item?: any) => TableRowAction[]), queryParams?: any): any;
|
|
@@ -1,57 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "@soperio/jsx-runtime";
|
|
2
|
-
import { useOpenLink } from "@compill/hooks";
|
|
3
|
-
import { runIfFn } from "@soperio/react";
|
|
4
|
-
import { createColumnHelper } from "@tanstack/react-table";
|
|
5
|
-
import React from "react";
|
|
6
|
-
import { useNavigate } from "react-router-dom";
|
|
7
|
-
import { TableRowActionsView } from "./TableRowActionsView.js";
|
|
8
|
-
import { useTableViewContext } from "./TableViewContext.js";
|
|
9
|
-
import { useRouter } from "next/router";
|
|
10
|
-
import { AppEnv } from "@compill/env";
|
|
11
|
-
export function useTableProps(api, table, rowActions, queryParams) {
|
|
12
|
-
const navigate = useNavigate();
|
|
13
|
-
const nextRouter = useRouter();
|
|
14
|
-
const openLink = useOpenLink();
|
|
15
|
-
const { onAction } = useTableViewContext();
|
|
16
|
-
const { onRowClick, columns: c, ...props } = table;
|
|
17
|
-
const onRowClickHandler = React.useCallback((item) => {
|
|
18
|
-
const config = runIfFn(onRowClick, item);
|
|
19
|
-
if (config) {
|
|
20
|
-
switch (config.type) {
|
|
21
|
-
case "navigate":
|
|
22
|
-
{
|
|
23
|
-
navigate(runIfFn(config.path, item) ?? "");
|
|
24
|
-
break;
|
|
25
|
-
}
|
|
26
|
-
case "nextpush":
|
|
27
|
-
{
|
|
28
|
-
nextRouter.push(runIfFn(config.path, item));
|
|
29
|
-
break;
|
|
30
|
-
}
|
|
31
|
-
case "link":
|
|
32
|
-
{
|
|
33
|
-
openLink(`${AppEnv.websiteUrl()}/${runIfFn(config.path, item)}`);
|
|
34
|
-
break;
|
|
35
|
-
}
|
|
36
|
-
}
|
|
37
|
-
}
|
|
38
|
-
}, [navigate, onRowClick]);
|
|
39
|
-
const columns = React.useMemo(() => {
|
|
40
|
-
const columns = table.columns.concat([]);
|
|
41
|
-
if (rowActions) {
|
|
42
|
-
columns.push(createColumnHelper().display({
|
|
43
|
-
id: "actions",
|
|
44
|
-
header: "Actions",
|
|
45
|
-
cell: props => _jsx(TableRowActionsView, { row: props.row, onAction: onAction, rowActions: rowActions, api: api, queryKey: api.queryKey })
|
|
46
|
-
}));
|
|
47
|
-
}
|
|
48
|
-
return columns;
|
|
49
|
-
}, [table, onAction, rowActions, api]);
|
|
50
|
-
const tableProps = { ...props };
|
|
51
|
-
tableProps.columns = columns;
|
|
52
|
-
tableProps.onRowClick = onRowClickHandler;
|
|
53
|
-
tableProps.queryKey = api.queryKey;
|
|
54
|
-
tableProps.queryFilters = queryParams;
|
|
55
|
-
tableProps.queryFn = api.search;
|
|
56
|
-
return tableProps;
|
|
57
|
-
}
|