From 00c533bce9f6e8ae638abf2d1e5c084a735a7572 Mon Sep 17 00:00:00 2001 From: bhavanakarwade Date: Wed, 2 Aug 2023 16:19:43 +0530 Subject: [PATCH] feat: created an empty list custom component Signed-off-by: bhavanakarwade --- src/api/organization.ts | 4 +- src/components/EmptyListComponent/index.tsx | 29 +++ src/components/Resources/Schema/Schemas.tsx | 28 ++- .../organization/OrganizationsList.tsx | 49 ++--- .../organization/invitations/Invitations.tsx | 29 ++- .../invitations/ReceivedInvitations.tsx | 206 +++++++++--------- src/pages/index.astro | 9 +- src/services/apiRequests.ts | 31 +-- 8 files changed, 211 insertions(+), 174 deletions(-) create mode 100644 src/components/EmptyListComponent/index.tsx diff --git a/src/api/organization.ts b/src/api/organization.ts index 4a2dc41c8..7d86e933b 100644 --- a/src/api/organization.ts +++ b/src/api/organization.ts @@ -130,7 +130,7 @@ export const getOrgDashboard = async (orgId: string) => { } try { - return axiosGet(axiosPayload); + return await axiosGet(axiosPayload); } catch (error) { const err = error as Error @@ -235,7 +235,7 @@ export const getOrganizationUsers = async () => { } try { - return axiosGet(axiosPayload); + return await axiosGet(axiosPayload); } catch (error) { const err = error as Error diff --git a/src/components/EmptyListComponent/index.tsx b/src/components/EmptyListComponent/index.tsx new file mode 100644 index 000000000..77aa4e16a --- /dev/null +++ b/src/components/EmptyListComponent/index.tsx @@ -0,0 +1,29 @@ +import { ReactElement } from "react"; + +export const EmptyListMessage = ({ message, description, buttonContent, svgComponent, onClick } + : { + message: string, + description: string, + buttonContent?: string, + svgComponent?: ReactElement, + + onClick?: () => void, + }) => { + return ( +
+

{message}

+

{description}

+ { + buttonContent + && + } + +
+ ) +}; + diff --git a/src/components/Resources/Schema/Schemas.tsx b/src/components/Resources/Schema/Schemas.tsx index 93d91f112..b547659dc 100644 --- a/src/components/Resources/Schema/Schemas.tsx +++ b/src/components/Resources/Schema/Schemas.tsx @@ -12,6 +12,7 @@ import SearchInput from '../../SearchInput'; import { getAllSchemas } from '../../../api/Schema'; import { getFromLocalStorage } from '../../../api/Auth'; import { pathRoutes } from '../../../config/pathRoutes'; +import { EmptyListMessage } from '../../EmptyListComponent'; const SchemaList = () => { const [schemaList, setSchemaList] = useState([]) @@ -57,7 +58,9 @@ const SchemaList = () => { } }; - + const createSchema = () => { + window.location.href = `${pathRoutes.organizations.createSchema}?OrgId=${orgId}` + } useEffect(() => { getSchemaList(schemaListAPIParameter) @@ -102,9 +105,7 @@ const SchemaList = () => { @@ -153,21 +151,13 @@ const OrganizationsList = () => { setOpenModal={ props.setOpenModal } /> - { - setMessage(null) - setError(null) - }} - /> {loading ?
- : organizationsList && organizationsList?.length > 0 &&
+ : organizationsList && organizationsList?.length > 0 ? (
{ organizationsList.map((org) => ( redirectOrgDashboard(org.id)} className='transform transition duration-500 hover:scale-105 hover:bg-gray-50 cursor-pointer'> @@ -210,7 +200,14 @@ const OrganizationsList = () => { )) } -
+
) : ( + + }/>) }
diff --git a/src/components/organization/invitations/Invitations.tsx b/src/components/organization/invitations/Invitations.tsx index df7996e80..f71e22bb6 100644 --- a/src/components/organization/invitations/Invitations.tsx +++ b/src/components/organization/invitations/Invitations.tsx @@ -13,6 +13,7 @@ import { TextTittlecase } from '../../../utils/TextTransform'; import { apiStatusCodes } from '../../../config/CommonConstant'; import { getOrganizationInvitations } from '../../../api/invitations'; import { getOrganizations } from '../../../api/organization'; +import { EmptyListMessage } from '../../EmptyListComponent'; const initialPageState = { pageNumber: 1, @@ -47,6 +48,8 @@ const Invitations = () => { const response = await getOrganizationInvitations(currentPage.pageNumber, currentPage.pageSize, searchText); const { data } = response as AxiosResponse + setLoading(false) + if (data?.statusCode === apiStatusCodes.API_STATUS_SUCCESS) { const totalPages = data?.data?.totalPages; @@ -61,11 +64,7 @@ const Invitations = () => { ...currentPage, total: totalPages }) - } else { - setError(response as string) - } - - setLoading(false) + } } //This useEffect is called when the searchText changes @@ -124,21 +123,13 @@ const Invitations = () => { props.setOpenModal } /> - { - setMessage(null) - setError(null) - }} - /> {loading ?
- : invitationsList && invitationsList?.length > 0 &&
0 ? (
@@ -227,7 +218,15 @@ const Invitations = () => { }
-
+
) : ( + + } + />) }
diff --git a/src/components/organization/invitations/ReceivedInvitations.tsx b/src/components/organization/invitations/ReceivedInvitations.tsx index c920e09db..2d3b40539 100644 --- a/src/components/organization/invitations/ReceivedInvitations.tsx +++ b/src/components/organization/invitations/ReceivedInvitations.tsx @@ -15,6 +15,7 @@ import { TextTittlecase } from '../../../utils/TextTransform'; import { apiStatusCodes } from '../../../config/CommonConstant'; import { getOrganizations } from '../../../api/organization'; import { pathRoutes } from '../../../config/pathRoutes'; +import { EmptyListMessage } from '../../EmptyListComponent'; const initialPageState = { pageNumber: 1, @@ -62,8 +63,6 @@ const ReceivedInvitations = () => { ...currentPage, total: totalPages }) - } else { - setError(response as string) } setLoading(false) @@ -99,7 +98,7 @@ const ReceivedInvitations = () => { if (data?.statusCode === apiStatusCodes.API_STATUS_SUCCESS) { setMessage(data?.message) setLoading(false) - window.location.href=pathRoutes.organizations.root + window.location.href = pathRoutes.organizations.root } else { setError(response as string) setLoading(false) @@ -121,9 +120,12 @@ const ReceivedInvitations = () => { className="p-4 bg-white border border-gray-200 rounded-lg shadow-sm 2xl:col-span-2 dark:border-gray-700 sm:p-6 dark:bg-gray-800" >
- + {invitationsList && invitationsList?.length > 0 ? + + : + null}
{ props.setOpenModal } /> - { - setMessage(null) - setError(null) - }} - /> {loading ?
- : invitationsList && invitationsList?.length > 0 &&
0 ? (
-
-
    - { - invitationsList.map((invitation) => ( - -
  • -
    -
    -
    - - - - - - - - - - - - - - -
    -
    -

    - {invitation.organisation.name} -

    - -
    -
      -
    • -
      -
      - Roles: - {invitation.orgRoles && - invitation.orgRoles.length > 0 && - invitation.orgRoles.map((role: OrgRole, index: number) => { - return ( - - {role.name.charAt(0).toUpperCase() + role.name.slice(1)} - - ); - })} -
      + > +
      +
        + { + invitationsList.map((invitation) => ( + +
      • +
        +
        +
        + + + + + + + + + + + + + + +
        +
        +

        + {invitation.organisation.name} +

        + +
        +
          +
        • +
          +
          + Roles: + {invitation.orgRoles && + invitation.orgRoles.length > 0 && + invitation.orgRoles.map((role: OrgRole, index: number) => { + return ( + + {role.name.charAt(0).toUpperCase() + role.name.slice(1)} + + ); + })} +
          -
          -
          • -
        +
        +
        • +
      -
      - {/*

      + {/*

      Received On: {invitation.createDateTime.split('T')[0]}

      */} -
      -
    +
    -
    -
    -
    - - +
    -
    +
    +
    + + +
    -
    -
    • - )) - } -
-
- -
+
+ + + )) + } + +
+ +
) : () }
diff --git a/src/pages/index.astro b/src/pages/index.astro index 045f6d57f..e646a3a46 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -27,9 +27,14 @@ import { pathRoutes } from '../config/pathRoutes.js'; >
+ + + Sign in
See our repository