Skip to content

Commit

Permalink
Merge pull request #352 from credebl/fix-ecosystem-issues
Browse files Browse the repository at this point in the history
Fix: Invitation list page issues
  • Loading branch information
nishad-ayanworks authored Oct 17, 2023
2 parents e7279f4 + d49b3d5 commit 3224ee6
Showing 5 changed files with 117 additions and 57 deletions.
2 changes: 1 addition & 1 deletion src/api/invitations.ts
Original file line number Diff line number Diff line change
@@ -233,7 +233,7 @@ export const getEcosystemInvitations = async (pageNumber: number, pageSize: numb
}

// Accept/ Reject Invitations
export const acceptRejectEcosystemInvitations = async (invitationId: number, orgId: number, status: string, orgName: string, orgDid: string) => {
export const acceptRejectEcosystemInvitations = async (invitationId: string, orgId: number, status: string, orgName: string, orgDid: string) => {

const url = `${apiRoutes.Ecosystem.root}/${orgId}${apiRoutes.Ecosystem.invitations}/${invitationId}`

127 changes: 94 additions & 33 deletions src/components/EcosystemInvite/EcoSystemReceivedInvitations.tsx
Original file line number Diff line number Diff line change
@@ -7,14 +7,13 @@ import {
import { AlertComponent } from '../AlertComponent';
import type { AxiosResponse } from 'axios';
import BreadCrumbs from '../BreadCrumbs';
import type { Invitation } from '../organization/interfaces/invitations';
import type { Organisation } from '../organization/interfaces';
import { apiStatusCodes, storageKeys } from '../../config/CommonConstant';
import { pathRoutes } from '../../config/pathRoutes';
import { EmptyListMessage } from '../EmptyListComponent';
import CustomSpinner from '../CustomSpinner';
import { getFromLocalStorage } from '../../api/Auth';
import { getOrganizations } from '../../api/organization';
import { getOrganizationById, getOrganizations } from '../../api/organization';
import EcoInvitationList from './EcoInvitationList';
import { getOrgDetails } from '../../config/ecosystem';
import BackButton from '../../commonComponents/backbutton'
@@ -25,6 +24,10 @@ const initialPageState = {
total: 0,
};

interface IOrgData {
orgDid: string
orgName: string
}

export interface EcosystemInvitation {
ecosystem: []
@@ -38,6 +41,8 @@ export interface EcosystemInvitation {
orgId: string
status: string
email: string
selected?: boolean
orgData?: IOrgData
}


@@ -51,6 +56,7 @@ const ReceivedInvitations = () => {
const [selectedId, setSelectedId] = useState<number>();
const [searchText, setSearchText] = useState('');
const [invitationsData, setInvitationsData] = useState<Array<EcosystemInvitation> | null>(null);
const [getOrgError, setGetOrgError] = useState<string | null>(null);

const onPageChange = (page: number) => {
setCurrentPage({
@@ -59,8 +65,6 @@ const ReceivedInvitations = () => {
});
};

const props = { openModal, setOpenModal };

const getAllOrganizationsForEcosystem = async () => {
setLoading(true);
const response = await getOrganizations(
@@ -104,7 +108,7 @@ const ReceivedInvitations = () => {
if (data?.statusCode === apiStatusCodes.API_STATUS_SUCCESS) {
const totalPages = data?.data?.totalPages;

const invitationList = data?.data?.invitations.filter((invitation: { status: string; }) => {
const invitationList = data?.data?.invitations?.filter((invitation: { status: string; }) => {
return invitation.status === 'pending'
})
setInvitationsData(invitationList);
@@ -134,31 +138,77 @@ const ReceivedInvitations = () => {
}, [searchText, openModal, currentPage.pageNumber]);

const respondToEcosystemInvitations = async (
invite: Invitation,
invite: EcosystemInvitation,
status: string,
) => {
setLoading(true);
const orgDetails = await getOrgDetails()
const response = await acceptRejectEcosystemInvitations(
invite.id,
Number(selectedId),
status,
orgDetails.orgName,
orgDetails.orgDid
);
const { data } = response as AxiosResponse;
if (data?.statusCode === apiStatusCodes.API_STATUS_CREATED) {
setMessage(data?.message);
setLoading(false);
getAllInvitations()
} else {
setError(response as string);
setLoading(false);
try {
const orgDid = invite?.orgData?.orgDid || ""
const orgName = invite?.orgData?.orgName || ""
if (orgDid) {
const response = await acceptRejectEcosystemInvitations(
invite.id,
Number(selectedId),
status,
orgName,
orgDid
);
setLoading(false)
const { data } = response as AxiosResponse;
if (data?.statusCode === apiStatusCodes.API_STATUS_CREATED) {
setMessage(data?.message);
getAllInvitations()
} else {
setError(response as string);
}
}
setLoading(false)
} catch (err) {
console.log("ERROR - Accept/Reject Ecosystem::", err)
}
};

const handleDropdownChange = (e: { target: { value: any } }) => {
const getSelectedOrgDetails = async (orgId: string): Promise<IOrgData | null> => {
try {
const response = await getOrganizationById(orgId);
const { data } = response as AxiosResponse;
const orgData = data?.data
if (data?.statusCode === apiStatusCodes.API_STATUS_SUCCESS) {
if (orgData.org_agents[0]?.orgDid) {
setGetOrgError(null)
return {
orgDid: orgData.org_agents[0]?.orgDid || "",
orgName: orgData.name
}
} else {
setGetOrgError("Please create your wallet for this organization to accept the invitation.")
return null
}
}
return null
} catch (err) {
console.log("ERROR::", err)
return null
}
}

const handleDropdownChange = async (e: { target: { value: any } }, id: string) => {
const value = e.target.value;
const orgData: IOrgData | null | undefined = await getSelectedOrgDetails(value)
const updateInvitationData = invitationsData && invitationsData.length > 0 ? invitationsData.map((item) => {
if (id === item.id) {
return {
...item,
orgId: value,
selected: true,
orgData: orgData || undefined
}
}
return {
...item,
selected: false
}
}) : null
setInvitationsData(updateInvitationData)
setSelectedId(value);
};

@@ -226,15 +276,15 @@ const ReceivedInvitations = () => {
/>

{loading ? (
<div className="flex items-center justify-center mb-4">
<div className="flex items-center justify-center px-12">
<CustomSpinner />
</div>
) : invitationsData && invitationsData?.length > 0 ? (
<div id={selectedId?.toString()} className="p-2 mb-4 bg-white 2xl:col-span-2 dark:border-gray-700 sm:p-3 dark:bg-gray-800">
<div id={selectedId?.toString()} className="flow-root">
<ul id={selectedId?.toString()}>
{invitationsData.map((invitation) => (
<Card key={invitation.id} className="p-4 mb-4">
<Card key={invitation.id} className="p-2 mb-4">
<div id={invitation.email} className="flex flex-wrap justify-between 2xl:flex align-center">
<div id={invitation.email} className=" xl:mb-4 2xl:mb-0">
<EcoInvitationList
@@ -264,6 +314,7 @@ const ReceivedInvitations = () => {
'accepted',
)
}
disabled={!invitation?.orgData}
id={invitation.id}
className='mx-5 mt-5 text-base font-medium text-center text-white bg-primary-700 hover:!bg-primary-800 rounded-lg hover:bg-primary-800 focus:ring-4 focus:ring-primary-300 sm:w-auto dark:bg-primary-700 dark:hover:!bg-primary-800 dark:focus:ring-primary-800"'
>
@@ -272,24 +323,34 @@ const ReceivedInvitations = () => {
</Button>
</div>
</div>

<div>
<div className='flex items-center h-fit'>
<select
className="bg-gray-50 border border-gray-300 text-gray-900 sm:text-sm rounded-lg focus:ring-primary-500 focus:border-primary-500 block w-full pl-10 p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
className="ml-3 bg-gray-50 border border-gray-300 text-gray-900 sm:text-sm rounded-lg focus:ring-primary-500 focus:border-primary-500 block w-full pl-10 p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
id="dropdown"
onChange={handleDropdownChange}
value={selectedId}
onChange={(e) => handleDropdownChange(e, invitation.id)}
value={invitation.orgId || ""}
>
<option value="">Select Organization</option>
{organizationsList &&
organizationsList.length > 0 &&
organizationsList.map((orgs) => {
return (
<option key={orgs.id} value={orgs.id}>{orgs.name}</option>
<option key={orgs.id} value={orgs.id.toString()}>{orgs.name}</option>
);
})}
</select>
</div>
</div>
{
invitation.selected &&
<AlertComponent
message={getOrgError}
type={'failure'}
onAlertClose={() => {
setGetOrgError(null);
}}
/>
}
</Card>
))}
</ul>
@@ -304,7 +365,7 @@ const ReceivedInvitations = () => {
)
)}

{currentPage.total > 1 && <div className="flex items-center justify-end mb-4">
{currentPage.total > 1 && <div className="flex items-center justify-end mb-4">
<Pagination
currentPage={currentPage.pageNumber}
onPageChange={onPageChange}
41 changes: 20 additions & 21 deletions src/components/Resources/Schema/SchemasList.tsx
Original file line number Diff line number Diff line change
@@ -144,11 +144,11 @@ const SchemaList = (props: { schemaSelectionCallback: (schemaId: string, schemaD
useEffect(() => {
fetchOrganizationDetails()
const checkEcosystemData = async () => {
const data: ICheckEcosystem = await checkEcosystem();
setIsEcosystemData(data)
}
checkEcosystemData();
const data: ICheckEcosystem = await checkEcosystem();
setIsEcosystemData(data)
}

checkEcosystemData();
}, [])

const createSchemaTitle = isEcosystemData?.isEcosystemMember ? "Request Endorsement" : "Create"
@@ -172,22 +172,21 @@ const SchemaList = (props: { schemaSelectionCallback: (schemaId: string, schemaD
<SearchInput
onInputChange={onSearch}
/>
{
!isEcosystemData?.isEnabledEcosystem &&
<select onChange={handleFilter} id="schamfilter"
className="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500 h-11">
<option selected>Organization's schema</option>
{options.map((opt) => (
<option
key={opt}
className=""
value={opt}
>
{opt}
</option>
))}
</select>
}

<select onChange={handleFilter} id="schamfilter"
className="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500 h-11">
<option selected>Organization's schema</option>
{options.map((opt) => (
<option
key={opt}
className=""
value={opt}
>
{opt}
</option>
))}
</select>

</div>
<div className='flex space-x-2'>
{walletStatus ? <RoleViewButton
2 changes: 1 addition & 1 deletion src/components/organization/OrgDropDown.tsx
Original file line number Diff line number Diff line change
@@ -103,7 +103,7 @@ const OrgDropDown = () => {
>
{orgList?.length > 0 ? (
<ul
className="max-h-48 py-2 overflow-y-auto text-gray-700 dark:text-gray-200 text-sm"
className="max-h-48 py-2 overflow-y-auto text-gray-700 dark:text-gray-200 text-sm scrollbar scrollbar-w-3 scrollbar-thumb-rounded-[0.25rem] scrollbar-track-slate-200 scrollbar-thumb-gray-400 dark:scrollbar-track-gray-900 dark:scrollbar-thumb-gray-700"
aria-labelledby="dropdownUsersButton"
>
{orgList?.map((org) => {
Original file line number Diff line number Diff line change
@@ -238,7 +238,7 @@ const SendInvitationModal = (props: {
<ul className="divide-y divide-gray-200 dark:divide-gray-700">
{invitations.map((invitation) => (
<li key={invitation.email} className="p-2">
<div className="flex justify-between xl:block 2xl:flex align-center 2xl:space-x-4">
<div className="flex justify-between 2xl:flex align-center 2xl:space-x-4">
<div className="flex flex-wrap space-x-4 xl:mb-4 2xl:mb-0 dark:text-white">
<div>
<svg

0 comments on commit 3224ee6

Please sign in to comment.