awing-library 2.1.2-dev.98 → 2.1.2-preview.1

package/dist/Features/SYSTEM/Group/SearchUser/container.test.js

@@ -0,0 +1,200 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { fireEvent, render, screen, waitFor } from "@testing-library/react";
+import { MockedProvider } from "@apollo/client/testing";
+import container from "./container.js";
+import { I18nextProvider } from "react-i18next";
+import i18next from "i18next";
+import "@testing-library/jest-dom";
+import "react";
+import { GetUsersDocument } from "../../Generated/graphql.js";
+jest.mock('../../../../Commons', ()=>({
+        ClassicDrawer: ({ children, onSubmit })=>/*#__PURE__*/ jsxs("div", {
+                "data-testid": "classic-drawer",
+                children: [
+                    children,
+                    /*#__PURE__*/ jsx("button", {
+                        onClick: onSubmit,
+                        children: "Submit"
+                    })
+                ]
+            })
+    }));
+jest.mock('./component', ()=>({
+        __esModule: true,
+        default: ({ users, listUserId, onListUserIdChange })=>/*#__PURE__*/ jsxs("div", {
+                "data-testid": "search-user-group",
+                children: [
+                    /*#__PURE__*/ jsx("ul", {
+                        children: users.map((user)=>/*#__PURE__*/ jsx("li", {
+                                children: user.name
+                            }, user.id))
+                    }),
+                    /*#__PURE__*/ jsx("button", {
+                        onClick: ()=>onListUserIdChange([
+                                1,
+                                2
+                            ]),
+                        "data-testid": "change-users",
+                        children: "Change Users"
+                    })
+                ]
+            })
+    }));
+const mockUsers = {
+    users: {
+        items: [
+            {
+                id: 1,
+                username: 'user1',
+                name: 'User 1'
+            },
+            {
+                id: 2,
+                username: 'user2',
+                name: 'User 2'
+            },
+            {
+                id: 3,
+                username: 'user3',
+                name: 'User 3'
+            }
+        ]
+    }
+};
+const mocks = [
+    {
+        request: {
+            query: GetUsersDocument
+        },
+        result: {
+            data: mockUsers
+        }
+    }
+];
+describe('AddUser Component', ()=>{
+    beforeEach(()=>{
+        jest.clearAllMocks();
+    });
+    it('renders loading state initially', ()=>{
+        render(/*#__PURE__*/ jsx(MockedProvider, {
+            mocks: mocks,
+            addTypename: false,
+            children: /*#__PURE__*/ jsx(I18nextProvider, {
+                i18n: i18next,
+                children: /*#__PURE__*/ jsx(container, {
+                    usersSelected: [],
+                    onChangeAddUser: ()=>{}
+                })
+            })
+        }));
+    });
+    it('renders users after loading', async ()=>{
+        render(/*#__PURE__*/ jsx(MockedProvider, {
+            mocks: mocks,
+            addTypename: false,
+            children: /*#__PURE__*/ jsx(I18nextProvider, {
+                i18n: i18next,
+                children: /*#__PURE__*/ jsx(container, {
+                    usersSelected: [],
+                    onChangeAddUser: ()=>{}
+                })
+            })
+        }));
+        await waitFor(()=>{
+            expect(screen.getByTestId('search-user-group')).toBeInTheDocument();
+        });
+    });
+    it('handles user selection change correctly', async ()=>{
+        const mockOnChangeAddUser = jest.fn();
+        render(/*#__PURE__*/ jsx(MockedProvider, {
+            mocks: mocks,
+            addTypename: false,
+            children: /*#__PURE__*/ jsx(I18nextProvider, {
+                i18n: i18next,
+                children: /*#__PURE__*/ jsx(container, {
+                    usersSelected: [],
+                    onChangeAddUser: mockOnChangeAddUser
+                })
+            })
+        }));
+        await waitFor(()=>{
+            expect(screen.getByTestId('search-user-group')).toBeInTheDocument();
+        });
+        fireEvent.click(screen.getByTestId('change-users'));
+        fireEvent.click(screen.getByText('Submit'));
+        await waitFor(()=>{
+            expect(mockOnChangeAddUser).toHaveBeenCalledWith([
+                {
+                    id: 1,
+                    username: 'user1',
+                    name: 'User 1'
+                },
+                {
+                    id: 2,
+                    username: 'user2',
+                    name: 'User 2'
+                }
+            ]);
+        });
+    });
+    it('filters out already selected users', async ()=>{
+        const selectedUsers = [
+            {
+                id: 1,
+                username: 'user1',
+                name: 'User 1'
+            }
+        ];
+        render(/*#__PURE__*/ jsx(MockedProvider, {
+            mocks: mocks,
+            addTypename: false,
+            children: /*#__PURE__*/ jsx(I18nextProvider, {
+                i18n: i18next,
+                children: /*#__PURE__*/ jsx(container, {
+                    usersSelected: selectedUsers,
+                    onChangeAddUser: ()=>{}
+                })
+            })
+        }));
+        await waitFor(()=>{
+            const userList = screen.getByTestId('search-user-group');
+            expect(userList).toBeInTheDocument();
+            expect(screen.queryByText('User 1')).not.toBeInTheDocument();
+            expect(screen.getByText('User 2')).toBeInTheDocument();
+        });
+    });
+    it('updates listUserId when usersSelected changes', async ()=>{
+        const { rerender } = render(/*#__PURE__*/ jsx(MockedProvider, {
+            mocks: mocks,
+            addTypename: false,
+            children: /*#__PURE__*/ jsx(I18nextProvider, {
+                i18n: i18next,
+                children: /*#__PURE__*/ jsx(container, {
+                    usersSelected: [],
+                    onChangeAddUser: ()=>{}
+                })
+            })
+        }));
+        const newSelectedUsers = [
+            {
+                id: 1,
+                username: 'user1',
+                name: 'User 1'
+            }
+        ];
+        rerender(/*#__PURE__*/ jsx(MockedProvider, {
+            mocks: mocks,
+            addTypename: false,
+            children: /*#__PURE__*/ jsx(I18nextProvider, {
+                i18n: i18next,
+                children: /*#__PURE__*/ jsx(container, {
+                    usersSelected: newSelectedUsers,
+                    onChangeAddUser: ()=>{}
+                })
+            })
+        }));
+        await waitFor(()=>{
+            expect(screen.getByTestId('search-user-group')).toBeInTheDocument();
+        });
+    });
+});

package/dist/Features/SYSTEM/Group/SearchUser/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './container';
+//# sourceMappingURL=index.d.ts.map

package/dist/Features/SYSTEM/Group/SearchUser/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/Features/SYSTEM/Group/SearchUser/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC"}

package/dist/Features/SYSTEM/Group/SearchUser/index.js

@@ -0,0 +1,2 @@
+import container from "./container.js";
+export { container as default };

package/dist/Features/SYSTEM/Group/Services.d.ts

@@ -0,0 +1,43 @@
+import type { Group, GroupInput } from './types';
+import type { CustomPagingRequestInput, PagingQueryInput } from '../../types';
+import { User } from '../User/types';
+import { MenuOption, ValueBase } from '../../../AWING/interface';
+import { fetchOptionsType } from '../../../AWING/AsyncAutocomplete';
+export type GroupServices = {
+    getRoleTags: fetchOptionsType<MenuOption<ValueBase>>;
+    /** Get Users
+     * @param p - PagingQueryInput<Users> - Không truyền param sẽ lấy tất cả Users
+     */
+    getUsers: (p?: PagingQueryInput<User>) => Promise<{
+        users: User[];
+        total: number;
+    }>;
+    getGroups: (p?: {
+        input: CustomPagingRequestInput;
+    }) => Promise<{
+        groups: Group[];
+        total: number;
+    }>;
+    /** Delete Group by ID */
+    deleteGroup: (p: {
+        id: number;
+    }) => void;
+    getGroupById: (p: {
+        id: number;
+    }) => Promise<Group>;
+    /** Create new Group */
+    createGroup: (p: {
+        input: GroupInput;
+    }) => Promise<void>;
+    /** Update Group by ID */
+    updateGroup: (p: {
+        input: GroupInput;
+        id: number;
+        versionId?: number;
+    }) => Promise<void>;
+    /** Loading khi lấy dữ liệu */
+    isLoading: boolean;
+    /** Loading khi submit dữ liệu */
+    isSubmitLoading: boolean;
+};
+//# sourceMappingURL=Services.d.ts.map

package/dist/Features/SYSTEM/Group/Services.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Services.d.ts","sourceRoot":"","sources":["../../../../src/Features/SYSTEM/Group/Services.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AACjD,OAAO,KAAK,EAAE,wBAAwB,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AACjF,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AACrC,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AACxD,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAE3D,MAAM,MAAM,aAAa,GAAG;IAExB,WAAW,EAAE,gBAAgB,CAAC,UAAU,CAAC,SAAS,CAAC,CAAC,CAAC;IACrD;;OAEG;IACH,QAAQ,EAAE,CAAC,CAAC,CAAC,EAAE,gBAAgB,CAAC,IAAI,CAAC,KAAK,OAAO,CAAC;QAAE,KAAK,EAAE,IAAI,EAAE,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAEpF,SAAS,EAAE,CAAC,CAAC,CAAC,EAAE;QAAE,KAAK,EAAE,wBAAwB,CAAA;KAAE,KAAK,OAAO,CAAC;QAAE,MAAM,EAAE,KAAK,EAAE,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAEpG,yBAAyB;IACzB,WAAW,EAAE,CAAC,CAAC,EAAE;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAEzC,YAAY,EAAE,CAAC,CAAC,EAAE;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE,KAAK,OAAO,CAAC,KAAK,CAAC,CAAC;IAEpD,uBAAuB;IACvB,WAAW,EAAE,CAAC,CAAC,EAAE;QAAE,KAAK,EAAE,UAAU,CAAA;KAAE,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAEzD,yBAAyB;IACzB,WAAW,EAAE,CAAC,CAAC,EAAE;QAAE,KAAK,EAAE,UAAU,CAAC;QAAC,EAAE,EAAE,MAAM,CAAC;QAAC,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAEzF,8BAA8B;IAC9B,SAAS,EAAE,OAAO,CAAC;IAEnB,iCAAiC;IACjC,eAAe,EAAE,OAAO,CAAC;CAC5B,CAAC"}

package/dist/Features/SYSTEM/Group/User/component.d.ts

@@ -0,0 +1,10 @@
+import * as React from 'react';
+import { User } from '../../User/types';
+interface UserComponentProps {
+    rows: User[];
+    onSubmitData?: (users: User[]) => void;
+    isAcceptanced?: boolean;
+}
+declare const UserInGroupComponent: React.FC<UserComponentProps>;
+export default UserInGroupComponent;
+//# sourceMappingURL=component.d.ts.map

package/dist/Features/SYSTEM/Group/User/component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../../../../../src/Features/SYSTEM/Group/User/component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;AAElD,UAAU,kBAAkB;IACxB,IAAI,EAAE,IAAI,EAAE,CAAC;IACb,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC;IACvC,aAAa,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,QAAA,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CA8BtD,CAAC;AACF,eAAe,oBAAoB,CAAC"}

package/dist/Features/SYSTEM/Group/User/component.js

@@ -0,0 +1,40 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useCallback } from "react";
+import lodash from "lodash";
+import SearchUser from "../SearchUser/index.js";
+import EnhancedTable from "../EnhancedTable/index.js";
+import { Constants } from "../../../../Commons/Constant.js";
+import { Route, Routes } from "react-router";
+const UserInGroupComponent = (props)=>{
+    const { rows, onSubmitData } = props;
+    const handleUserDeleted = useCallback((ids, _description)=>{
+        if (ids.length > 0) onSubmitData && onSubmitData(rows.filter((x)=>void 0 !== x.id && !ids.includes(x.id)));
+    }, [
+        onSubmitData,
+        rows
+    ]);
+    const handleChangeAddUser = (users)=>{
+        const newUsers = lodash.cloneDeep(rows);
+        users?.map((x)=>newUsers.push(x));
+        onSubmitData && onSubmitData(newUsers);
+    };
+    return /*#__PURE__*/ jsxs(Fragment, {
+        children: [
+            /*#__PURE__*/ jsx(EnhancedTable, {
+                rows: rows,
+                onChangeDeleted: handleUserDeleted
+            }),
+            /*#__PURE__*/ jsx(Routes, {
+                children: /*#__PURE__*/ jsx(Route, {
+                    path: Constants.ADD_USER_TO_GROUP_PATH,
+                    element: /*#__PURE__*/ jsx(SearchUser, {
+                        onChangeAddUser: handleChangeAddUser,
+                        usersSelected: rows
+                    })
+                }, Constants.ADD_USER_TO_GROUP_PATH)
+            })
+        ]
+    });
+};
+const component = UserInGroupComponent;
+export { component as default };

package/dist/Features/SYSTEM/Group/User/component.test.js

@@ -0,0 +1,133 @@
+import { jsx } from "react/jsx-runtime";
+import "react";
+import { fireEvent, render, screen } from "@testing-library/react";
+import { MemoryRouter } from "react-router";
+import component from "./component.js";
+import "@testing-library/jest-dom";
+jest.mock('../EnhancedTable', ()=>({
+        __esModule: true,
+        default: ({ rows, onChangeDeleted })=>/*#__PURE__*/ jsx("div", {
+                "data-testid": "enhanced-table",
+                children: /*#__PURE__*/ jsx("button", {
+                    onClick: ()=>onChangeDeleted([
+                            '1',
+                            '2'
+                        ], 'delete'),
+                    "data-testid": "delete-button",
+                    children: "Delete Users"
+                })
+            })
+    }));
+jest.mock('../SearchUser', ()=>({
+        __esModule: true,
+        default: ({ onChangeAddUser, usersSelected })=>/*#__PURE__*/ jsx("div", {
+                "data-testid": "search-user",
+                children: /*#__PURE__*/ jsx("button", {
+                    onClick: ()=>onChangeAddUser([
+                            {
+                                id: '3',
+                                name: 'User 3'
+                            }
+                        ]),
+                    "data-testid": "add-button",
+                    children: "Add User"
+                })
+            })
+    }));
+jest.mock('../../../../Commons/Constant', ()=>({
+        Constants: {
+            ADD_USER_TO_GROUP_PATH: '/add-user'
+        }
+    }));
+describe('UserInGroupComponent', ()=>{
+    const mockRows = [
+        {
+            id: '1',
+            name: 'User 1'
+        },
+        {
+            id: '2',
+            name: 'User 2'
+        }
+    ];
+    const mockOnSubmitData = jest.fn();
+    const defaultProps = {
+        rows: mockRows,
+        onSubmitData: mockOnSubmitData,
+        isAcceptanced: false
+    };
+    beforeEach(()=>{
+        jest.clearAllMocks();
+    });
+    it('renders EnhancedTableComponent', ()=>{
+        render(/*#__PURE__*/ jsx(MemoryRouter, {
+            children: /*#__PURE__*/ jsx(component, {
+                ...defaultProps
+            })
+        }));
+        expect(screen.getByTestId('enhanced-table')).toBeInTheDocument();
+    });
+    it('handles user deletion correctly', ()=>{
+        render(/*#__PURE__*/ jsx(MemoryRouter, {
+            children: /*#__PURE__*/ jsx(component, {
+                ...defaultProps
+            })
+        }));
+        const deleteButton = screen.getByTestId('delete-button');
+        fireEvent.click(deleteButton);
+        expect(mockOnSubmitData).toHaveBeenCalledTimes(1);
+        expect(mockOnSubmitData).toHaveBeenCalledWith([]);
+    });
+    it('handles adding new users correctly', ()=>{
+        render(/*#__PURE__*/ jsx(MemoryRouter, {
+            initialEntries: [
+                '/add-user'
+            ],
+            children: /*#__PURE__*/ jsx(component, {
+                ...defaultProps
+            })
+        }));
+        const addButton = screen.getByTestId('add-button');
+        fireEvent.click(addButton);
+        expect(mockOnSubmitData).toHaveBeenCalledTimes(1);
+        expect(mockOnSubmitData).toHaveBeenCalledWith([
+            {
+                id: '1',
+                name: 'User 1'
+            },
+            {
+                id: '2',
+                name: 'User 2'
+            },
+            {
+                id: '3',
+                name: 'User 3'
+            }
+        ]);
+    });
+    it('does not call onSubmitData when it is not provided', ()=>{
+        const propsWithoutSubmit = {
+            rows: mockRows,
+            isAcceptanced: false
+        };
+        render(/*#__PURE__*/ jsx(MemoryRouter, {
+            children: /*#__PURE__*/ jsx(component, {
+                ...propsWithoutSubmit
+            })
+        }));
+        const deleteButton = screen.getByTestId('delete-button');
+        fireEvent.click(deleteButton);
+        expect(mockOnSubmitData).not.toHaveBeenCalled();
+    });
+    it('renders SearchUser component on add-user route', ()=>{
+        render(/*#__PURE__*/ jsx(MemoryRouter, {
+            initialEntries: [
+                '/add-user'
+            ],
+            children: /*#__PURE__*/ jsx(component, {
+                ...defaultProps
+            })
+        }));
+        expect(screen.getByTestId('search-user')).toBeInTheDocument();
+    });
+});

package/dist/Features/SYSTEM/Group/container.d.ts

@@ -0,0 +1,3 @@
+declare const UserGroupContainer: () => import("react/jsx-runtime").JSX.Element;
+export default UserGroupContainer;
+//# sourceMappingURL=container.d.ts.map

package/dist/Features/SYSTEM/Group/container.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"container.d.ts","sourceRoot":"","sources":["../../../../src/Features/SYSTEM/Group/container.tsx"],"names":[],"mappings":"AAYA,QAAA,MAAM,kBAAkB,+CAwIvB,CAAC;AACF,eAAe,kBAAkB,CAAC"}

package/dist/Features/SYSTEM/Group/container.js

@@ -0,0 +1,138 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { PageManagement } from "../../../AWING/index.js";
+import { Constants } from "../../../Commons/Constant.js";
+import { useAppHelper } from "../../../Context/index.js";
+import { Direction } from "../../types.js";
+import { convertArrayFiltersToCondition } from "../../../Helpers/query.js";
+import { isUndefined } from "lodash";
+import { useCallback, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { useNavigate } from "react-router";
+import { useContextGroup } from "./context.js";
+const UserGroupContainer = ()=>{
+    const { t } = useTranslation();
+    const navigate = useNavigate();
+    const { confirm, snackbar } = useAppHelper();
+    const { tableRef, services } = useContextGroup();
+    const [loading, setLoading] = useState(true);
+    const [groups, setGroups] = useState([]);
+    const [totalCount, setTotalCount] = useState(0);
+    const queryData = useCallback((queryInput)=>{
+        let sorts = [];
+        queryInput.sortModel?.forEach((model)=>{
+            sorts.push({
+                direction: 'asc' === model.sort ? Direction.Asc : Direction.Desc,
+                field: model.field
+            });
+        });
+        if (sorts.length <= 0) sorts = [
+            {
+                direction: Direction.Desc,
+                field: 'id'
+            }
+        ];
+        if (services) services.getGroups({
+            input: {
+                where: {
+                    ...convertArrayFiltersToCondition([
+                        {
+                            key: 'name',
+                            value: queryInput?.searchString?.trim() ?? '',
+                            type: 'contains'
+                        }
+                    ])
+                },
+                order: sorts,
+                skip: queryInput.pageSize && queryInput.pageIndex ? queryInput.pageSize * queryInput.pageIndex : 0,
+                take: queryInput.pageSize ?? Constants.PAGE_SIZE_DEFAULT
+            }
+        }).then((data)=>{
+            const items = data?.groups;
+            setLoading(false);
+            if (items) {
+                setGroups(items ?? []);
+                setTotalCount(data.total);
+            }
+        });
+    }, [
+        services?.getGroups,
+        services?.getRoleTags
+    ]);
+    const onUserGroupDelete = (id)=>{
+        if (!isUndefined(id) && services) services.deleteGroup({
+            id
+        });
+    };
+    return /*#__PURE__*/ jsx(PageManagement, {
+        title: t('UserGroup.Title'),
+        onChangeQueryInput: queryData,
+        confirmDelete: confirm,
+        columns: [
+            {
+                field: 'id',
+                headerName: 'ID',
+                sortable: true,
+                width: '100px'
+            },
+            {
+                field: 'name',
+                headerName: t('UserGroup.Name'),
+                sortable: true,
+                TableCellProps: {
+                    sx: {
+                        wordBreak: 'break-word'
+                    }
+                },
+                valueGetter: (row)=>/*#__PURE__*/ jsxs(Fragment, {
+                        children: [
+                            row?.isSystem && /*#__PURE__*/ jsx("span", {
+                                style: {
+                                    backgroundColor: '#c49f47',
+                                    color: '#ffffff',
+                                    fontSize: '13px',
+                                    marginLeft: '4px',
+                                    padding: '1px 4px',
+                                    borderRadius: '2px'
+                                },
+                                children: "System"
+                            }),
+                            /*#__PURE__*/ jsx("span", {
+                                style: {
+                                    marginLeft: '8px'
+                                },
+                                children: row?.name
+                            })
+                        ]
+                    })
+            },
+            {
+                field: "description",
+                headerName: t("UserGroup.Description"),
+                TableCellProps: {
+                    sx: {
+                        wordBreak: 'break-word'
+                    }
+                }
+            },
+            {
+                field: 'totalUser',
+                headerName: t('UserGroup.TotalUser'),
+                TableCellProps: {
+                    align: 'right'
+                },
+                valueGetter: (row)=>row?.users?.length ?? 0
+            }
+        ],
+        loading: loading,
+        ref: tableRef,
+        getRowId: (row)=>row?.id ?? '',
+        onDelete: (id)=>onUserGroupDelete(Number(id)),
+        rows: groups,
+        showNotificationSuccess: ()=>snackbar('success'),
+        totalOfRows: totalCount,
+        onCreateButtonClick: ()=>navigate(Constants.CREATE_PATH),
+        onRowClick: (id)=>navigate(`${Constants.EDIT_PATH}/${id}`)
+    });
+};
+const container = UserGroupContainer;
+export { container as default };