phx-react 1.3.1680 → 1.3.1681

package/dist/esm/components/FormTarget/graphql/query.js

@@ -366,4 +366,165 @@ export const GET_CLASSROOM_BY_USER_IDS = `
   }
 }
 `;
+export const FIND_STUDENT_BY_USER_CODE = `
+query FindStudentByUserCodes($userCodes: [String!]!, $schoolId: Int!) {
+  allCoreStudentPublicProfileStudents(
+    filter: {
+      deletedAt: { isNull: true }
+      userCode: { in: $userCodes }
+      schoolId: { equalTo: $schoolId }
+    }
+  ) {
+    pageInfo {
+      endCursor
+      hasNextPage
+      hasPreviousPage
+      startCursor
+    }
+    nodes {
+      userCode
+      gradeId
+      studentId
+      coreStudentPublicGradeByGradeIdAndSchoolId {
+        name
+        id: rowId
+      }
+      coreStudentPublicUserByStudentIdAndSchoolId {
+        coreStudentPublicRelationshipUsersByStudentIdAndSchoolId(
+          filter: {
+            deletedAt: { isNull: true }
+            schoolId: { equalTo: $schoolId }
+          }
+        ) {
+          nodes {
+            parentId
+            relationshipCode
+            rowId
+          }
+        }
+      }
+      coreStudentPublicProgramMapEducationalLevelByProgramEducationalIdAndSchoolId {
+        coreStudentPublicEducationalLevelByEducationalLevelIdAndSchoolId {
+          code
+          name
+          id: rowId
+        }
+      }
+    }
+  }
+}
+
+`;
+// TODO: filter isQuitJob
+export const FIND_STAFF_BY_USER_CODE = `
+query FindStaffByUserCodes($userCodes: [String!]!, $schoolId: Int!) {
+  allCoreAdminPublicUsers(
+    filter: {
+      deletedAt: { isNull: true }
+      schoolId: { equalTo: $schoolId }
+      coreAdminPublicProfileStaffByStaffIdAndSchoolId: {
+        userCode: { in: $userCodes }
+        deletedAt: { isNull: true }
+        schoolId: { equalTo: $schoolId }
+      }
+    }
+  ) {
+    pageInfo {
+      endCursor
+      hasNextPage
+      hasPreviousPage
+      startCursor
+    }
+    nodes {
+      id: rowId
+      fullName
+      phoneNumber
+      emailSecondary
+      email
+      isUseEmailSecondary
+      coreAdminPublicProfileStaffByStaffIdAndSchoolId {
+        userCode
+      }
+    }
+  }
+}
+`;
+export const FIND_TEACHER_BY_USER_CODE = `
+query FindTeacherByUserCodes($userCodes: [String!]!, $schoolId: Int!) {
+  allCoreAdminPublicProfileTeachers(
+    filter: {
+      deletedAt: { isNull: true }
+      userCode: { in: $userCodes }
+      schoolId: { equalTo: $schoolId }
+    }
+  ) {
+    pageInfo {
+      endCursor
+      hasNextPage
+      hasPreviousPage
+      startCursor
+    }
+    nodes {
+      userCode
+      coreAdminPublicEducationalLevelGroupByEducationalLevelGroupIdAndSchoolId {
+        id: rowId
+        name
+        schoolId
+      }
+      coreAdminPublicUserByTeacherIdAndSchoolId {
+        email
+        emailSecondary
+        fullName
+        id: rowId
+        phoneNumber
+        isUseEmailSecondary
+        isEmailValid
+        isEmailSecondaryValid
+      }
+    }
+  }
+}
+  `;
+export const FIND_USER_INFO = `
+  query findUserInfo($ids: [Int!]!, $schoolId: Int!) {
+    allCoreAdminPublicUsers(
+      filter: {
+        rowId: {in: $ids}
+        deletedAt: {isNull: true}
+        schoolId: {equalTo: $schoolId}
+      }
+    ) {
+      nodes {
+        email
+        fullName
+        isEmailValid
+        isEmailSecondaryValid
+        isUseEmailSecondary
+        id: rowId
+      }
+    }
+  }
+`;
+export const FIND_CLASSROOM_BY_USER_IDS = `
+  query FindClassroomByUserIds($userIds: [Int!]!, $schoolYearId: Int!, $schoolId: Int!) {
+    allCoreAcademicPublicClassroomStudents(
+      filter: {
+        deletedAt: {isNull: true}
+        coreAcademicPublicClassroomByClassroomIdAndSchoolId: {
+          schoolYearId: {equalTo: $schoolYearId}
+        }
+        studentId: { in: $userIds }
+        schoolId: { equalTo: $schoolId }
+      }
+    ) {
+      nodes {
+        coreAcademicPublicClassroomByClassroomIdAndSchoolId {
+          name
+          rowId
+        }
+        studentId
+      }
+    }
+  }
+`;
 //# sourceMappingURL=query.js.map

package/dist/esm/components/FormTarget/graphql/query.js.map

@@ -1 +1 @@
-{"version":3,"file":"query.js","sourceRoot":"","sources":["../../../../../src/components/FormTarget/graphql/query.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AACvC,OAAO,EAAE,cAAc,EAAsB,MAAM,gBAAgB,CAAA;AAEnE,MAAM,CAAC,MAAM,gBAAgB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2C/B,CAAA;AAED,MAAM,gBAAgB,GAAG,CAAC,MAAiB,EAAE,YAAoB,EAAE,QAAgB,EAAE,EAAE;IACrF,MAAM,aAAa,GAAG;QACpB,CAAC,SAAS,CAAC,OAAO,CAAC,EAAE;;;;;;;;;oGAS2E,YAAY;;;;;;;;;KAS3G;QACD,CAAC,SAAS,CAAC,KAAK,CAAC,EAAE;;;;;;;;;KASlB;QACD,CAAC,SAAS,CAAC,OAAO,CAAC,EAAE;;;;;;;;;;;;;;;;;;;;uCAoBc,YAAY;kCACjB,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA6BrC;QACD,CAAC,SAAS,CAAC,UAAU,CAAC,EAAE,EAAE;QAC1B,CAAC,SAAS,CAAC,MAAM,CAAC,EAAE,EAAE;KACvB,CAAA;IAED,OAAO,aAAa,CAAC,MAAM,CAAC,CAAA;AAC9B,CAAC,CAAA;AAED,MAAM,qBAAqB,GAAG,CAAC,EAAE,MAAM,EAAyD,EAAU,EAAE;IAC1G,IAAI,MAAM,KAAK,SAAS,CAAC,KAAK,EAAE,CAAC;QAC/B,OAAO;QACH;;;cAGM;KACT,CAAA;IACH,CAAC;IACD,IAAI,MAAM,KAAK,SAAS,CAAC,OAAO,EAAE,CAAC;QACjC,OAAO;;gCAEqB,cAAc,CAAC,QAAQ;;;KAGlD,CAAA;IACH,CAAC;IAED,IAAI,MAAM,KAAK,SAAS,CAAC,OAAO,EAAE,CAAC;QACjC,OAAO;;;;;KAKN,CAAA;IACH,CAAC;IAED,OAAO,EAAE,CAAA;AACX,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,EAAsB,EAAE,EAAE,CAAC;;;;;;;;;;;;;UAatF,qBAAqB,CAAC,EAAE,MAAM,EAAE,CAAC;;;;;;;;;;;;;;;;;QAiBnC,gBAAgB,CAAC,MAAM,EAAE,YAAY,EAAE,QAAQ,CAAC;;;;;;;IAOpD,CAAA;AAEJ,MAAM,CAAC,MAAM,kBAAkB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2CjC,CAAA;AAED,MAAM,CAAC,MAAM,wBAAwB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqFvC,CAAA;AACD,MAAM,CAAC,MAAM,mBAAmB,GAAG;;;;;;;CAOlC,CAAA;AAED,MAAM,CAAC,MAAM,yBAAyB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+BxC,CAAA"}
+{"version":3,"file":"query.js","sourceRoot":"","sources":["../../../../../src/components/FormTarget/graphql/query.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AACvC,OAAO,EAAE,cAAc,EAAsB,MAAM,gBAAgB,CAAA;AAEnE,MAAM,CAAC,MAAM,gBAAgB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2C/B,CAAA;AAED,MAAM,gBAAgB,GAAG,CAAC,MAAiB,EAAE,YAAoB,EAAE,QAAgB,EAAE,EAAE;IACrF,MAAM,aAAa,GAAG;QACpB,CAAC,SAAS,CAAC,OAAO,CAAC,EAAE;;;;;;;;;oGAS2E,YAAY;;;;;;;;;KAS3G;QACD,CAAC,SAAS,CAAC,KAAK,CAAC,EAAE;;;;;;;;;KASlB;QACD,CAAC,SAAS,CAAC,OAAO,CAAC,EAAE;;;;;;;;;;;;;;;;;;;;uCAoBc,YAAY;kCACjB,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA6BrC;QACD,CAAC,SAAS,CAAC,UAAU,CAAC,EAAE,EAAE;QAC1B,CAAC,SAAS,CAAC,MAAM,CAAC,EAAE,EAAE;KACvB,CAAA;IAED,OAAO,aAAa,CAAC,MAAM,CAAC,CAAA;AAC9B,CAAC,CAAA;AAED,MAAM,qBAAqB,GAAG,CAAC,EAAE,MAAM,EAAyD,EAAU,EAAE;IAC1G,IAAI,MAAM,KAAK,SAAS,CAAC,KAAK,EAAE,CAAC;QAC/B,OAAO;QACH;;;cAGM;KACT,CAAA;IACH,CAAC;IACD,IAAI,MAAM,KAAK,SAAS,CAAC,OAAO,EAAE,CAAC;QACjC,OAAO;;gCAEqB,cAAc,CAAC,QAAQ;;;KAGlD,CAAA;IACH,CAAC;IAED,IAAI,MAAM,KAAK,SAAS,CAAC,OAAO,EAAE,CAAC;QACjC,OAAO;;;;;KAKN,CAAA;IACH,CAAC;IAED,OAAO,EAAE,CAAA;AACX,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,EAAsB,EAAE,EAAE,CAAC;;;;;;;;;;;;;UAatF,qBAAqB,CAAC,EAAE,MAAM,EAAE,CAAC;;;;;;;;;;;;;;;;;QAiBnC,gBAAgB,CAAC,MAAM,EAAE,YAAY,EAAE,QAAQ,CAAC;;;;;;;IAOpD,CAAA;AAEJ,MAAM,CAAC,MAAM,kBAAkB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2CjC,CAAA;AAED,MAAM,CAAC,MAAM,wBAAwB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqFvC,CAAA;AACD,MAAM,CAAC,MAAM,mBAAmB,GAAG;;;;;;;CAOlC,CAAA;AAED,MAAM,CAAC,MAAM,yBAAyB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+BxC,CAAA;AAED,MAAM,CAAC,MAAM,yBAAyB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgDxC,CAAA;AAED,yBAAyB;AACzB,MAAM,CAAC,MAAM,uBAAuB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgCtC,CAAA;AAED,MAAM,CAAC,MAAM,yBAAyB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCtC,CAAA;AAEH,MAAM,CAAC,MAAM,cAAc,GAAG;;;;;;;;;;;;;;;;;;;CAmB7B,CAAA;AAED,MAAM,CAAC,MAAM,0BAA0B,GAAG;;;;;;;;;;;;;;;;;;;;;CAqBzC,CAAA"}

package/dist/esm/components/FormTarget/hooks/use-import-user.d.ts

@@ -0,0 +1,5 @@
+import { ERoleCode } from '../constant';
+import { IFilterValueItem } from '../type/target';
+export declare const useImportUser: () => {
+    findUserByUserCodes: (target: ERoleCode, userCodes: Array<string>) => Promise<Array<IFilterValueItem>>;
+};

package/dist/esm/components/FormTarget/hooks/use-import-user.js

@@ -0,0 +1,163 @@
+import PHXFuncGetLoggedInfo from '../../Func/getLoginInfo';
+import { PHXClientQueryV6 } from '../../Func/GRPC/PHXGrpcClientV6';
+import PHXGetCurrentYearWithTermV3 from '../../Func/SchoolYearV3/getSchoolYearV3';
+import { ECoreSchemaGroup, ERoleCode } from '../constant';
+import { FIND_USER_INFO, FIND_CLASSROOM_BY_USER_IDS, FIND_STUDENT_BY_USER_CODE, FIND_STAFF_BY_USER_CODE, FIND_TEACHER_BY_USER_CODE, } from '../graphql/query';
+export const useImportUser = () => {
+    var _a, _b;
+    const userInfo = PHXFuncGetLoggedInfo();
+    const schoolId = userInfo === null || userInfo === void 0 ? void 0 : userInfo.school_id;
+    const schoolYear = PHXGetCurrentYearWithTermV3();
+    const schoolYearId = (_b = (_a = schoolYear === null || schoolYear === void 0 ? void 0 : schoolYear.current_school_year) === null || _a === void 0 ? void 0 : _a.schoolYear) === null || _b === void 0 ? void 0 : _b.id;
+    const formatStaffData = (data) => data.map((item) => ({
+        id: item.id,
+        code: item.coreAdminPublicProfileStaffByStaffIdAndSchoolId.userCode,
+        phone: item.phoneNumber,
+        email: item.email,
+        name: item.fullName,
+        emailSecondary: item.emailSecondary,
+        isUseEmailSecondary: item.isUseEmailSecondary,
+        full_name: item.fullName,
+    }));
+    const formatTeacherData = (data) => data.map((item) => ({
+        id: item.coreAdminPublicUserByTeacherIdAndSchoolId.id,
+        code: item.userCode,
+        phone: item.coreAdminPublicUserByTeacherIdAndSchoolId.phoneNumber,
+        email: item.coreAdminPublicUserByTeacherIdAndSchoolId.email,
+        name: item.coreAdminPublicUserByTeacherIdAndSchoolId.fullName,
+        emailSecondary: item.coreAdminPublicUserByTeacherIdAndSchoolId.emailSecondary,
+        isUseEmailSecondary: item.coreAdminPublicUserByTeacherIdAndSchoolId.isUseEmailSecondary,
+        full_name: item.coreAdminPublicUserByTeacherIdAndSchoolId.fullName,
+    }));
+    const formatStudentData = (data, userInfoMap = {}) => data.map((item) => {
+        var _a, _b, _c, _d, _e, _f, _g;
+        const parents = (_c = (_b = (_a = item.coreStudentPublicUserByStudentIdAndSchoolId) === null || _a === void 0 ? void 0 : _a.coreStudentPublicRelationshipUsersByStudentIdAndSchoolId) === null || _b === void 0 ? void 0 : _b.nodes) === null || _c === void 0 ? void 0 : _c.map((node) => {
+            var _a;
+            return ({
+                id: node.parentId,
+                relationship_code: node.relationshipCode || '',
+                full_name: ((_a = userInfoMap[node.parentId]) === null || _a === void 0 ? void 0 : _a.fullName) || '',
+            });
+        });
+        return {
+            id: Number(item.studentId),
+            code: item.userCode,
+            name: item.fullName || '',
+            full_name: item.fullName || '',
+            educational_level: (_e = (_d = item.coreStudentPublicProgramMapEducationalLevelByProgramEducationalIdAndSchoolId) === null || _d === void 0 ? void 0 : _d.coreStudentPublicEducationalLevelByEducationalLevelIdAndSchoolId) === null || _e === void 0 ? void 0 : _e.name,
+            grade: (_f = item.coreStudentPublicGradeByGradeIdAndSchoolId) === null || _f === void 0 ? void 0 : _f.name,
+            classroom: (_g = item.classroom) === null || _g === void 0 ? void 0 : _g.name,
+            parents: parents || [],
+        };
+    });
+    const findUserInFo = async (ids) => {
+        const { data } = await PHXClientQueryV6({
+            schemaGroup: ECoreSchemaGroup.CORE_ADMIN,
+            variables: {
+                ids,
+                schoolId,
+            },
+            query: FIND_USER_INFO,
+        });
+        return data.allCoreAdminPublicUsers.nodes;
+    };
+    const findClassroomByUserIds = async (userIds, querySchoolYearId, querySchoolId) => {
+        const { data } = await PHXClientQueryV6({
+            schemaGroup: ECoreSchemaGroup.CORE_ACADEMIC,
+            variables: {
+                userIds,
+                schoolYearId: querySchoolYearId,
+                schoolId: querySchoolId,
+            },
+            query: FIND_CLASSROOM_BY_USER_IDS,
+        });
+        return data.allCoreAcademicPublicClassroomStudents.nodes;
+    };
+    const findStudentByUserCodes = async (userCodes) => {
+        const { data } = await PHXClientQueryV6({
+            schemaGroup: ECoreSchemaGroup.CORE_STUDENT,
+            variables: {
+                userCodes,
+                schoolId,
+            },
+            query: FIND_STUDENT_BY_USER_CODE,
+        });
+        const result = data.allCoreStudentPublicProfileStudents.nodes;
+        const userIds = new Set();
+        result.forEach((item) => {
+            var _a, _b;
+            userIds.add(item.studentId);
+            const parentNodes = (_b = (_a = item.coreStudentPublicUserByStudentIdAndSchoolId) === null || _a === void 0 ? void 0 : _a.coreStudentPublicRelationshipUsersByStudentIdAndSchoolId) === null || _b === void 0 ? void 0 : _b.nodes;
+            parentNodes === null || parentNodes === void 0 ? void 0 : parentNodes.forEach((node) => {
+                if (node.parentId) {
+                    userIds.add(node.parentId);
+                }
+            });
+        });
+        const studentInfo = await findUserInFo(Array.from(userIds));
+        const userInfoMap = {};
+        studentInfo.forEach((user) => {
+            userInfoMap[user.id] = user;
+        });
+        const classroomData = await findClassroomByUserIds(Array.from(new Set(result.map((item) => item.studentId))), schoolYearId, schoolId);
+        const classroomMap = {};
+        classroomData.forEach((item) => {
+            classroomMap[item.studentId] = item.coreAcademicPublicClassroomByClassroomIdAndSchoolId;
+        });
+        const mergeData = result.map((item) => {
+            const userDetail = userInfoMap[item.studentId];
+            const classroom = classroomMap[item.studentId];
+            return {
+                ...item,
+                fullName: userDetail === null || userDetail === void 0 ? void 0 : userDetail.fullName,
+                classroom: classroom
+                    ? {
+                        id: classroom.rowId,
+                        name: classroom.name,
+                    }
+                    : undefined,
+            };
+        });
+        return formatStudentData(mergeData, userInfoMap);
+    };
+    const findStaffByUserCodes = async (userCodes) => {
+        const { data } = await PHXClientQueryV6({
+            schemaGroup: ECoreSchemaGroup.CORE_ADMIN,
+            variables: {
+                userCodes,
+                schoolId,
+            },
+            query: FIND_STAFF_BY_USER_CODE,
+        });
+        const result = data.allCoreAdminPublicUsers.nodes;
+        return formatStaffData(result);
+    };
+    const findTeacherByUserCodes = async (userCodes) => {
+        const { data } = await PHXClientQueryV6({
+            schemaGroup: ECoreSchemaGroup.CORE_ADMIN,
+            variables: {
+                userCodes,
+                schoolId,
+            },
+            query: FIND_TEACHER_BY_USER_CODE,
+        });
+        const result = data.allCoreAdminPublicProfileTeachers.nodes;
+        return formatTeacherData(result);
+    };
+    const findUserByUserCodes = async (target, userCodes) => {
+        switch (target) {
+            case ERoleCode.STUDENT:
+                return findStudentByUserCodes(userCodes);
+            case ERoleCode.STAFF:
+                return findStaffByUserCodes(userCodes);
+            case ERoleCode.TEACHER:
+                return findTeacherByUserCodes(userCodes);
+            default:
+                return [];
+        }
+    };
+    return {
+        findUserByUserCodes,
+    };
+};
+//# sourceMappingURL=use-import-user.js.map

package/dist/esm/components/FormTarget/hooks/use-import-user.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-import-user.js","sourceRoot":"","sources":["../../../../../src/components/FormTarget/hooks/use-import-user.ts"],"names":[],"mappings":"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"}

package/dist/esm/components/FormTarget/type/target.d.ts

@@ -148,3 +148,8 @@ export interface ITargetGroupBuilderProps {
 export declare enum EStudentStatus {
     STUDYING = 2
 }
+export interface IInvalidUser {
+    code: string;
+    reason?: string;
+    reasonDetail?: string;
+}

package/dist/esm/components/FormTarget/type/user.d.ts

@@ -0,0 +1,77 @@
+export interface IStaffData {
+    id: number;
+    fullName: string;
+    phoneNumber: string;
+    emailSecondary?: string;
+    email?: string;
+    isUseEmailSecondary?: boolean;
+    coreAdminPublicProfileStaffByStaffIdAndSchoolId: {
+        userCode: string;
+    };
+}
+export interface IStudentDataV5 {
+    userCode: string;
+    studentId: number;
+    coreStudentPublicGradeByGradeIdAndSchoolId: {
+        name: string;
+        id: number;
+    };
+    coreStudentPublicUserByStudentIdAndSchoolId: {
+        coreStudentPublicRelationshipUsersByStudentIdAndSchoolId?: {
+            nodes: Array<{
+                parentId: number;
+                relationshipCode: string;
+                id: number;
+            }>;
+        };
+    };
+    coreStudentPublicProgramMapEducationalLevelByProgramEducationalIdAndSchoolId: {
+        coreStudentPublicEducationalLevelByEducationalLevelIdAndSchoolId: {
+            code: string;
+            name: string;
+            id: number;
+        };
+    };
+}
+export interface IStudentMergeData extends IStudentDataV5 {
+    fullName?: string;
+    phoneNumber?: string;
+    email?: string;
+    emailSecondary?: string;
+    isUseEmailSecondary?: boolean;
+    isEmailValid?: boolean;
+    isEmailSecondaryValid?: boolean;
+    classroom?: {
+        id: number;
+        name: string;
+    };
+}
+export interface ITeacherDataV5 {
+    userCode: string;
+    coreAdminPublicEducationalLevelGroupByEducationalLevelGroupIdAndSchoolId: {
+        id: number;
+        name?: string;
+        schoolId?: number;
+    };
+    id: number;
+    coreAdminPublicUserByTeacherIdAndSchoolId: {
+        email: string;
+        emailSecondary?: string;
+        fullName: string;
+        id: number;
+        phoneNumber?: string;
+        isUseEmailSecondary?: boolean;
+        isEmailValid?: boolean;
+        isEmailSecondaryValid?: boolean;
+    };
+}
+export interface IUserInfoV5 {
+    id: number;
+    fullName: string;
+    phoneNumber: string;
+    emailSecondary?: string;
+    email?: string;
+    isUseEmailSecondary?: boolean;
+    isEmailValid?: boolean;
+    isEmailSecondaryValid?: boolean;
+}

package/dist/esm/components/FormTarget/type/user.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=user.js.map

package/dist/esm/components/FormTarget/type/user.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"user.js","sourceRoot":"","sources":["../../../../../src/components/FormTarget/type/user.ts"],"names":[],"mappings":""}

package/dist/esm/components/UploadFile/ButtonUpload.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 export declare function ButtonUpload({ fileType, handleUploadClick, helpText, loading, disabled, }: {
     fileType: string;
     handleUploadClick(): void;
-    helpText: string;
+    helpText?: string;
     loading?: boolean;
     disabled?: boolean;
 }): React.JSX.Element;

package/dist/esm/components/UploadFile/FormUpload.d.ts

@@ -1,2 +1,25 @@
 import React from 'react';
-export declare function FormUpload({ fileName, fileType, handleCheckboxChange, handleFileChange, helpText, isImage, label, length, link, oneImg, selectedImages, setIsModalOpen, showImage, isHorizontalLayout, customNextImage, actionTextDelete, twoColumn, disabled, }: any): React.JSX.Element;
+export interface IFormUploadProps {
+    actionTextDelete?: boolean;
+    customNextImage?: {
+        height?: number;
+        width?: number;
+    };
+    disabled?: boolean;
+    fileName?: string;
+    fileType?: 'excel' | 'image' | 'file' | 'pdf';
+    handleCheckboxChange?(index: number): void;
+    handleFileChange(event: React.ChangeEvent<HTMLInputElement>): void | Promise<void>;
+    helpText?: string;
+    isHorizontalLayout?: boolean;
+    isImage?: boolean;
+    label?: string;
+    length?: number;
+    link?: Array<string>;
+    oneImg?: boolean;
+    selectedImages?: Array<number>;
+    setIsModalOpen?(isOpen: boolean): void;
+    showImage?: boolean;
+    twoColumn?: boolean;
+}
+export declare function FormUpload({ actionTextDelete, customNextImage, disabled, fileName, fileType, handleCheckboxChange, handleFileChange, helpText, isHorizontalLayout, isImage, label, length, link, oneImg, selectedImages, setIsModalOpen, showImage, twoColumn, }: IFormUploadProps): React.JSX.Element;

package/dist/esm/components/UploadFile/FormUpload.js

@@ -4,7 +4,7 @@ import { ButtonUpload } from './ButtonUpload';
 import { classNames } from '../types';
 import { PHXButton } from '../Button';
 import { PHXSpinner } from '../Loading';
-export function FormUpload({ fileName, fileType, handleCheckboxChange, handleFileChange, helpText, isImage, label, length, link, oneImg, selectedImages, setIsModalOpen, showImage, isHorizontalLayout, customNextImage, actionTextDelete, twoColumn, disabled, }) {
+export function FormUpload({ actionTextDelete, customNextImage, disabled, fileName = '', fileType = 'excel', handleCheckboxChange, handleFileChange, helpText, isHorizontalLayout, isImage, label, length, link = [], oneImg, selectedImages = [], setIsModalOpen, showImage, twoColumn, }) {
     const fileInputRef = useRef(null);
     const [showLargeImage, setShowLargeImage] = useState(false);
     const [largeImageUrl, setLargeImageUrl] = useState('');
@@ -63,44 +63,57 @@ export function FormUpload({ fileName, fileType, handleCheckboxChange, handleFil
             setFile(fileName);
         }
     }, [link]);
+    const renderFileInput = (className, id, ref) => (React.createElement("input", { ref: ref, accept: `${(fileType === 'excel' && '.xlsx, .xls') ||
+            (fileType === 'image' && '.jpg, .jpeg, .png, .gif, .webp') ||
+            (fileType === 'file' && '.pdf, .png,.jpg, .jpeg') ||
+            (fileType === 'pdf' && '.pdf')}`, className: className, id: id, name: id, onChange: handleAwaitUpdate, type: 'file' }));
     return (React.createElement(React.Fragment, null,
         React.createElement("div", { className: classNames('mb-1 flex text-xs font-normal text-gray-700', label ? 'justify-between' : '') }, label && React.createElement("label", null, label)),
         showSelectedTitle && (React.createElement("div", { className: 'flex justify-between ' },
-            React.createElement("div", { className: '-pl-2 text-xs leading-5 text-gray-600 mb-4' },
+            React.createElement("div", { className: '-pl-2 mb-4 text-xs leading-5 text-gray-600' },
                 length,
                 " \u1EA3nh \u0111\u00E3 \u0111\u01B0\u1EE3c ch\u1ECDn"),
-            actionTextDelete ? (React.createElement("p", { className: 'text-xs font-normal text-red-700 hover:underline cursor-pointer', onClick: () => setIsModalOpen(true) }, "Xo\u00E1 \u1EA3nh")) : (React.createElement(PHXButton, { deleted: true, onClick: () => setIsModalOpen(true), size: 'micro' }, "X\u00F3a")))),
+            actionTextDelete ? (React.createElement("div", { className: 'cursor-pointer text-xs font-normal text-red-700 hover:underline', onClick: () => setIsModalOpen === null || setIsModalOpen === void 0 ? void 0 : setIsModalOpen(true), onKeyDown: (e) => {
+                    if (e.key === 'Enter' || e.key === ' ') {
+                        setIsModalOpen === null || setIsModalOpen === void 0 ? void 0 : setIsModalOpen(true);
+                    }
+                }, role: 'button', tabIndex: 0 }, "Xo\u00E1 \u1EA3nh")) : (React.createElement(PHXButton, { deleted: true, onClick: () => setIsModalOpen === null || setIsModalOpen === void 0 ? void 0 : setIsModalOpen(true), size: 'micro' }, "X\u00F3a")))),
         React.createElement("div", { className: 'relative' },
             isImage && (React.createElement("div", { className: `${oneImg ? 'flex justify-center rounded-lg bg-gray-100' : classCheckColumn}` }, listImage === null || listImage === void 0 ? void 0 :
                 listImage.map((src, index) => {
                     const isSelectImage = (selectedImages === null || selectedImages === void 0 ? void 0 : selectedImages.length) > 0;
                     return (React.createElement("div", { key: index, className: `group relative overflow-hidden ${!oneImg ? 'aspect-square rounded-[10px] border' : ''}` },
-                        customNextImage ? (React.createElement(Image, { alt: 'img', className: ` object-contain ${oneImg ? 'max-h-[180px]' : 'h-full w-full object-contain'} ${selectedImages.includes(index) ? 'opacity-60' : ''}`, height: (customNextImage === null || customNextImage === void 0 ? void 0 : customNextImage.height) || 180, src: src, width: (customNextImage === null || customNextImage === void 0 ? void 0 : customNextImage.width) || 400 })) : (React.createElement("img", { alt: 'img', className: ` object-contain ${oneImg ? 'max-h-[180px]' : 'h-full w-full object-contain'} ${selectedImages.includes(index) ? 'opacity-60' : ''}`, src: src })),
+                        customNextImage ? (React.createElement("img", { alt: 'img', className: ` object-contain ${oneImg ? 'max-h-[180px]' : 'h-full w-full object-contain'} ${selectedImages.includes(index) ? 'opacity-60' : ''}`, height: (customNextImage === null || customNextImage === void 0 ? void 0 : customNextImage.height) || 180, src: src, width: (customNextImage === null || customNextImage === void 0 ? void 0 : customNextImage.width) || 400 })) : (React.createElement("img", { alt: 'img', className: ` object-contain ${oneImg ? 'max-h-[180px]' : 'h-full w-full object-contain'} ${selectedImages.includes(index) ? 'opacity-60' : ''}`, src: src })),
                         React.createElement("button", { className: `absolute inset-0 flex items-center justify-center bg-black  text-white opacity-0 transition-opacity duration-300 group-hover:opacity-100 ${!oneImg ? 'bg-opacity-60' : 'bg-opacity-0'}`, onClick: () => {
                                 if (isSelectImage) {
-                                    handleCheckboxChange(index);
+                                    handleCheckboxChange === null || handleCheckboxChange === void 0 ? void 0 : handleCheckboxChange(index);
                                 }
                                 else {
                                     handleImageClick(src);
                                 }
                             }, type: 'button' }),
                         !oneImg && (React.createElement("div", { className: `z-8 absolute left-[0.3rem] top-0 opacity-0 ${(selectedImages === null || selectedImages === void 0 ? void 0 : selectedImages.length) > 0 ? 'opacity-100' : 'group-hover:opacity-100'}` },
-                            React.createElement("input", { checked: selectedImages.includes(index), className: 'h-[16px] w-[16px] cursor-pointer rounded-[4px]   text-black  checked:bg-black checked:ring-0 focus:outline-none focus:ring-0', onChange: () => handleCheckboxChange(index), type: 'checkbox' })))));
+                            React.createElement("input", { checked: selectedImages.includes(index), className: 'h-[16px] w-[16px] cursor-pointer rounded-[4px]   text-black  checked:bg-black checked:ring-0 focus:outline-none focus:ring-0', onChange: () => handleCheckboxChange === null || handleCheckboxChange === void 0 ? void 0 : handleCheckboxChange(index), type: 'checkbox' })))));
                 }),
-                !showMoreImage && (link === null || link === void 0 ? void 0 : link.length) > limitImageShow && (React.createElement("div", { className: 'group relative aspect-square overflow-hidden rounded-lg border' },
+                !showMoreImage && link.length > limitImageShow && (React.createElement("div", { className: 'group relative aspect-square overflow-hidden rounded-lg border' },
                     React.createElement("img", { alt: 'img', className: 'mx-auto h-full object-cover', src: link === null || link === void 0 ? void 0 : link[limitImageShow + 1] }),
                     React.createElement("button", { className: 'absolute inset-0 flex items-center justify-center bg-black bg-opacity-60 text-white backdrop-blur-sm  transition-opacity duration-300 ', onClick: () => setShowMoreImage(true), type: 'button' },
                         React.createElement("p", null,
                             "+",
                             ((link === null || link === void 0 ? void 0 : link.length) || 0) - limitImageShow)))),
-                (link === null || link === void 0 ? void 0 : link.length) > 0 && !oneImg && (React.createElement("button", { className: '  flex  aspect-square items-center justify-center rounded-lg border border-dashed border-gray-300 bg-[#F7F7F7] transition-all hover:bg-[#f1f1f1]', onClick: handleUploadClick, type: 'button' }, loading ? (React.createElement(PHXSpinner, null)) : (React.createElement("svg", { className: 'h-5 w-5', fill: 'none', stroke: 'currentColor', strokeWidth: '1.5', viewBox: '0 0 24 24', xmlns: 'http://www.w3.org/2000/svg' },
+                link.length > 0 && !oneImg && (React.createElement("button", { className: '  flex  aspect-square items-center justify-center rounded-lg border border-dashed border-gray-300 bg-[#F7F7F7] transition-all hover:bg-[#f1f1f1]', onClick: handleUploadClick, type: 'button' }, loading ? (React.createElement(PHXSpinner, null)) : (React.createElement("svg", { className: 'h-5 w-5', fill: 'none', stroke: 'currentColor', strokeWidth: '1.5', viewBox: '0 0 24 24', xmlns: 'http://www.w3.org/2000/svg' },
                     React.createElement("path", { d: 'M12 4.5v15m7.5-7.5h-15', strokeLinecap: 'round', strokeLinejoin: 'round' }))))),
-                showLargeImage && (React.createElement("div", { className: 'fixed left-0 top-0 z-50 flex h-full w-full items-center justify-center bg-black bg-opacity-70', id: 'large-image-container', onClick: () => setShowLargeImage(false) },
-                    React.createElement("img", { alt: 'Large Image', className: 'max-h-full max-w-full', onClick: (e) => e.stopPropagation(), src: largeImageUrl }))))),
+                showLargeImage && (React.createElement("div", { className: 'fixed left-0 top-0 z-50 flex h-full w-full items-center justify-center bg-black bg-opacity-70', id: 'large-image-container', onClick: () => setShowLargeImage(false), onKeyDown: (e) => {
+                        if (e.key === 'Enter' || e.key === ' ') {
+                            setShowLargeImage(false);
+                        }
+                    }, role: 'button', tabIndex: 0 },
+                    React.createElement(Image, { alt: 'Large Image', className: 'max-h-full max-w-full', onClick: (e) => e.stopPropagation(), src: largeImageUrl }))))),
             showButtonWithOneImage && (React.createElement("div", { className: ' mt-3  flex  gap-2 ' },
                 React.createElement(PHXButton, { disabled: disabled, loading: loading, onClick: handleUploadClick, secondary: true, size: 'micro' }, "Thay \u0111\u1ED5i"),
-                React.createElement(PHXButton, { deleted: true, onClick: () => setIsModalOpen(true), size: 'micro' }, "Xo\u00E1 \u1EA3nh"))),
-            ((link === null || link === void 0 ? void 0 : link.length) === 0 || isHorizontalLayout) && (React.createElement(React.Fragment, null, !file ? (React.createElement("div", { className: classNames('flex flex-col justify-center rounded-lg border border-dashed border-gray-900/25 px-5 pb-8 pt-8 ', disabled ? 'cursor-not-allowed' : 'hover:bg-[#f7f7f7] cursor-pointer') },
+                React.createElement(PHXButton, { deleted: true, onClick: () => setIsModalOpen === null || setIsModalOpen === void 0 ? void 0 : setIsModalOpen(true), size: 'micro' }, "Xo\u00E1 \u1EA3nh"))),
+            ((link === null || link === void 0 ? void 0 : link.length) === 0 || isHorizontalLayout) && (React.createElement(React.Fragment, null, !file ? (React.createElement("div", { className: classNames('relative flex flex-col justify-center rounded-lg border border-dashed border-gray-900/25 px-5 pb-8 pt-8 ', disabled ? 'cursor-not-allowed' : 'cursor-pointer hover:bg-[#f7f7f7]') },
+                renderFileInput('absolute inset-0 z-10 h-full w-full cursor-pointer opacity-0'),
                 React.createElement("div", { className: 'flex flex-col items-center justify-center' },
                     React.createElement(ButtonUpload, { disabled: disabled, fileType: fileType, handleUploadClick: () => {
                             handleUploadClick();
@@ -110,17 +123,15 @@ export function FormUpload({ fileName, fileType, handleCheckboxChange, handleFil
                         React.createElement("div", { className: 'h-full bg-gray-200 p-6' },
                             React.createElement("svg", { "aria-hidden": 'true', className: 'h-5 w-5', focusable: 'false', viewBox: '0 0 20 20' },
                                 React.createElement("path", { d: 'M6.75 4c-.69 0-1.25.56-1.25 1.25v9.5c0 .69.56 1.25 1.25 1.25h6.5c.69 0 1.25-.56 1.25-1.25v-9a.75.75 0 0 1 1.5 0v9a2.75 2.75 0 0 1-2.75 2.75h-6.5a2.75 2.75 0 0 1-2.75-2.75v-9.5a2.75 2.75 0 0 1 2.75-2.75h3a2.75 2.75 0 0 1 2.75 2.75v6.25a2.5 2.5 0 0 1-5 0v-5.5a.75.75 0 0 1 1.5 0v5.5a1 1 0 1 0 2 0v-6.25c0-.69-.56-1.25-1.25-1.25h-3Z', fillRule: 'evenodd' }))),
-                        React.createElement("p", { className: 'truncate w-[15ch] flex-1 md:w-[20ch] sm:w-full px-2 text-sm text-gray-600' }, fileName),
+                        React.createElement("p", { className: 'w-[15ch] flex-1 truncate px-2 text-sm text-gray-600 sm:w-full md:w-[20ch]' }, fileName),
                         React.createElement("div", { className: 'pr-4' },
                             React.createElement(PHXButton, { disabled: disabled, loading: loading, onClick: handleUploadClick, secondary: true, size: 'micro' }, "Thay \u0111\u1ED5i")))))))),
-            (link === null || link === void 0 ? void 0 : link.length) > 0 && !isImage && !isHorizontalLayout && (React.createElement("div", { className: classNames('flex flex-col justify-center rounded-lg border border-dashed border-gray-900/25 px-5 pb-8 pt-8 ', disabled ? 'cursor-not-allowed' : 'hover:bg-[#f7f7f7] cursor-pointer') },
+            (link === null || link === void 0 ? void 0 : link.length) > 0 && !isImage && !isHorizontalLayout && (React.createElement("div", { className: classNames('relative flex flex-col justify-center rounded-lg border border-dashed border-gray-900/25 px-5 pb-8 pt-8 ', disabled ? 'cursor-not-allowed' : 'cursor-pointer hover:bg-[#f7f7f7]') },
+                renderFileInput('absolute inset-0 z-10 h-full w-full cursor-pointer opacity-0'),
                 React.createElement("div", { className: 'flex flex-col items-center justify-center' }, fileType === 'file' && !showImage ? (React.createElement("div", { className: 'flex h-full items-center justify-center rounded-lg py-6 ' },
                     React.createElement(PHXSpinner, { className: 'h-5 w-5' }))) : (React.createElement(React.Fragment, null,
                     React.createElement("p", { className: 'mt-2 text-sm text-gray-600' }, fileName),
                     React.createElement(ButtonUpload, { disabled: disabled, fileType: fileType, handleUploadClick: handleUploadClick, helpText: helpText, loading: loading }))))))),
-        React.createElement("input", { ref: fileInputRef, accept: `${(fileType === 'excel' && '.xlsx, .xls') ||
-                (fileType === 'image' && '.jpg, .jpeg, .png, .gif, .webp') ||
-                (fileType === 'file' && '.pdf, .png,.jpg, .jpeg') ||
-                (fileType === 'pdf' && '.pdf')}`, className: 'sr-only', id: 'file-upload', name: 'file-upload', onChange: handleAwaitUpdate, type: 'file' })));
+        renderFileInput('sr-only', 'file-upload', fileInputRef)));
 }
 //# sourceMappingURL=FormUpload.js.map