Skip to content

Commit

Permalink
feat: get and display uploaded transfer offer
Browse files Browse the repository at this point in the history
  • Loading branch information
danielstefanequilobe committed Sep 8, 2022
1 parent 8952d3c commit 93d20e5
Show file tree
Hide file tree
Showing 4 changed files with 337 additions and 82 deletions.
185 changes: 117 additions & 68 deletions src/components/blocks/StagingDataGroups.js
Original file line number Diff line number Diff line change
Expand Up @@ -359,54 +359,68 @@ const StagingDataGroups = withTheme(
)}
{changeGroup?.isTransfer && (
<StyledDeleteGroupIcon>
<ToolTip
body={intl.formatMessage({
id: 'download-offer',
})}
placement={ToolTipPlacement.Top}
>
<DownloadOfferIcon
height={25}
width={25}
onClick={makerDownloadTransferOffer}
/>
</ToolTip>
<ToolTip
body={intl.formatMessage({
id: 'cancel-offer',
})}
placement={ToolTipPlacement.Top}
>
<RemoveIcon
width={22}
height={22}
onClick={() => dispatch(makerCancelTransferOffer())}
/>
</ToolTip>
<ToolTip
body={intl.formatMessage({
id: 'accept-offer',
})}
placement={ToolTipPlacement.Top}
>
<AcceptOfferIcon
width={27}
height={27}
onClick={() => dispatch(takerAcceptTransferOffer())}
/>
</ToolTip>
<ToolTip
body={intl.formatMessage({
id: 'cancel-offer',
})}
placement={ToolTipPlacement.Top}
>
<RemoveIcon
width={22}
height={22}
onClick={() => dispatch(takerCancelTransferOffer())}
/>
</ToolTip>
{changeGroup?.isMaker && (
<>
<ToolTip
body={intl.formatMessage({
id: 'download-offer',
})}
placement={ToolTipPlacement.Top}
>
<DownloadOfferIcon
height={25}
width={25}
onClick={makerDownloadTransferOffer}
/>
</ToolTip>
<ToolTip
body={intl.formatMessage({
id: 'cancel-offer',
})}
placement={ToolTipPlacement.Top}
>
<RemoveIcon
width={22}
height={22}
onClick={() =>
dispatch(makerCancelTransferOffer())
}
/>
</ToolTip>
</>
)}
{changeGroup?.isTaker && (
<>
<ToolTip
body={intl.formatMessage({
id: 'accept-offer',
})}
placement={ToolTipPlacement.Top}
>
<AcceptOfferIcon
width={27}
height={27}
onClick={() =>
dispatch(takerAcceptTransferOffer())
}
/>
</ToolTip>
<ToolTip
body={intl.formatMessage({
id: 'cancel-offer',
})}
placement={ToolTipPlacement.Top}
>
<RemoveIcon
width={22}
height={22}
onClick={() =>
dispatch(takerCancelTransferOffer())
}
/>
</ToolTip>
</>
)}
</StyledDeleteGroupIcon>
)}
{retryStagingData && (
Expand Down Expand Up @@ -445,27 +459,29 @@ const StagingDataGroups = withTheme(
}
/>
)}
{changeGroup.action === 'UPDATE' && (
<ChangeCard
data={changeGroup.diff.original}
headings={getDiff(
changeGroup.diff.original,
changeGroup.diff.change[0],
)}
onClick={() =>
setDetailedViewData({
record: changeGroup.diff.original,
changes: changeGroup.diff.change,
title: getTranslatedCardTitle(changeGroup),
action: changeGroup.action,
})
}
title={getTranslatedCardTitle(changeGroup)}
deletedIsVsible
displayInRed
/>
)}
{changeGroup.action === 'UPDATE' &&
!changeGroup.isTransfer && (
<ChangeCard
data={changeGroup.diff.original}
headings={getDiff(
changeGroup.diff.original,
changeGroup.diff.change[0],
)}
onClick={() =>
setDetailedViewData({
record: changeGroup.diff.original,
changes: changeGroup.diff.change,
title: getTranslatedCardTitle(changeGroup),
action: changeGroup.action,
})
}
title={getTranslatedCardTitle(changeGroup)}
deletedIsVsible
displayInRed
/>
)}
{changeGroup.action === 'UPDATE' &&
!changeGroup.isTransfer &&
changeGroup.diff.change.map((change, index) => (
<React.Fragment key={index}>
<ChangeCard
Expand All @@ -487,6 +503,39 @@ const StagingDataGroups = withTheme(
/>
</React.Fragment>
))}
{changeGroup.action === 'UPDATE' && changeGroup.isTransfer && (
<ChangeCard
data={changeGroup.diff.original}
headings={Object.keys(changeGroup.diff.original)}
onClick={() =>
setDetailedViewData({
record: changeGroup.diff.original,
changes: changeGroup.diff.change,
title: getTranslatedCardTitle(changeGroup),
action: changeGroup.action,
})
}
title={getTranslatedCardTitle(changeGroup)}
deletedIsVsible
displayInRed
/>
)}
{changeGroup.action === 'UPDATE' && changeGroup.isTransfer && (
<ChangeCard
data={changeGroup.diff.change[0]}
headings={Object.keys(changeGroup.diff.change[0])}
title={getTranslatedCardTitle(changeGroup)}
onClick={() =>
setDetailedViewData({
record: changeGroup.diff.original,
changes: changeGroup.diff.change,
title: getTranslatedCardTitle(changeGroup),
action: changeGroup.action,
})
}
addedIsVisible
/>
)}
</StyledChangeGroup>
)}
{!getIsChangeGroupValid(changeGroup) && (
Expand Down
44 changes: 31 additions & 13 deletions src/pages/Projects/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,10 @@ import { downloadTxtFile } from '../../utils/xlsxUtils';
import constants from '../../constants';
import { getUpdatedUrl } from '../../utils/urlUtils';
import { useWindowSize } from '../../components/hooks/useWindowSize';
import {
addIsMakerPropToChangeGroups,
convertProcessedOfferToStagingChangeGroups,
} from '../../utils/transferOfferUtils';

import {
APIDataTable,
Expand Down Expand Up @@ -337,21 +341,35 @@ const Projects = () => {
);
}, [projects, stagingData]);

useEffect(() => {
takerGetUploadedOffer();
}, [tabValue, isImportOfferModalVisible]);

// TODO need to implement passing the processedTransferOffer to the offers tab
console.log('processedTransferOffer', processedTransferOffer);

const pendingProjects = useMemo(
() =>
stagingData?.projects?.pending?.filter(item => !item.isTransfer) ?? [],
[stagingData],
);

const pendingOffers = useMemo(
() => stagingData?.projects?.pending?.filter(item => item.isTransfer) ?? [],
const pendingMakerOfferChangeGroups = useMemo(() => {
const makerChangeGroupsWithoutIsMakerProp =
stagingData?.projects?.pending?.filter(item => item.isTransfer) ?? [];
const makerChangeGroupsWithIsMakerProp = addIsMakerPropToChangeGroups(
makerChangeGroupsWithoutIsMakerProp,
);
return makerChangeGroupsWithIsMakerProp;
}, [stagingData]);

useEffect(() => {
dispatch(takerGetUploadedOffer());
}, [isImportOfferModalVisible]);

const pendingTakerOfferChangeGroups = useMemo(
() =>
processedTransferOffer !== null
? convertProcessedOfferToStagingChangeGroups(processedTransferOffer)
: [],
[processedTransferOffer],
);

const pendingTransferOffers = useMemo(
() => [...pendingMakerOfferChangeGroups, ...pendingTakerOfferChangeGroups],
[stagingData],
);

Expand Down Expand Up @@ -459,7 +477,7 @@ const Projects = () => {
{pageIsMyRegistryPage && (
<Tab
label={`${intl.formatMessage({ id: 'offers' })} (${
pendingOffers.length
pendingTransferOffers.length
})`}
/>
)}
Expand Down Expand Up @@ -581,17 +599,17 @@ const Projects = () => {
)}
</TabPanel>
<TabPanel value={tabValue} index={4}>
{pendingOffers.length === 0 && (
{pendingTransferOffers.length === 0 && (
<NoDataMessageContainer>
<H3>
<FormattedMessage id="no-pending-offers" />
</H3>
</NoDataMessageContainer>
)}
{pendingOffers.length > 0 && (
{pendingTransferOffers.length > 0 && (
<StagingDataGroups
headings={headings}
data={pendingOffers}
data={pendingTransferOffers}
modalSizeAndPosition={modalSizeAndPosition}
/>
)}
Expand Down
Loading

0 comments on commit 93d20e5

Please sign in to comment.