Skip to content

Commit

Permalink
MOL-438/MOL-459: update loading state
Browse files Browse the repository at this point in the history
  • Loading branch information
tdang1-shopmacher committed Oct 3, 2024
1 parent 4e57a12 commit 5139473
Show file tree
Hide file tree
Showing 2 changed files with 17 additions and 22 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -117,7 +117,7 @@ const MethodDetails = (props: TMethodDetailsProps) => {
{(formProps) => {
return (
<CustomFormModalPage
title={formProps.values?.description}
title={formProps.values?.description ?? ''}
isOpen
onClose={() => props.onClose()}
formControls={
Expand Down
37 changes: 16 additions & 21 deletions application/src/components/welcome/welcome.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -67,12 +67,12 @@ const Welcome = () => {
container: OBJECT_CONTAINER_NAME,
});
const { extension } = useExtensionDestinationFetcher(EXTENSION_KEY);
const [viewLoading, setViewLoading] = useState<boolean>(true);
const [methods, setMethods] = useState<CustomMethodObject[]>([]);
const [refresh, setRefresh] = useState<number>(0);
const [noData, setNoData] = useState<boolean>(false);

const fetchedData = usePaymentMethodsFetcher(extension?.destination?.url);
const { fetchedData, fetchedDataLoading } = usePaymentMethodsFetcher(
extension?.destination?.url
);

const handleRefresh = useCallback(() => {
setRefresh((prev) => prev + 1);
Expand Down Expand Up @@ -101,9 +101,6 @@ const Welcome = () => {
})
);
setMethods(updatedMethods);
setViewLoading(false);
} else {
setNoData(true);
}
}, [customObjectUpdater, customObjectsPaginatedResult?.results, fetchedData]);

Expand All @@ -114,7 +111,6 @@ const Welcome = () => {
customObjectsPaginatedResult) ||
(refresh > 0 && extension?.destination?.url)
) {
setViewLoading(true);
FetchAndUpdateMethods();
setRefresh(0);
}
Expand All @@ -134,8 +130,18 @@ const Welcome = () => {
);
}

const NoDataFallback = !fetchedDataLoading ? (
<ContentNotification
data-testid="no-data-notification"
type="info"
intlMessage={messages.noData}
></ContentNotification>
) : (
<LoadingSpinner data-testid="loading-spinner" scale="l"></LoadingSpinner>
);

const MollieDataTable =
!loading && methods && methods.length > 0 ? (
!loading && methods && methods.length > 0 && fetchedData ? (
<Spacings.Stack scale="l">
<DataTable<NonNullable<CustomMethodObject>>
isCondensed
Expand Down Expand Up @@ -199,11 +205,7 @@ const Welcome = () => {
</Switch>
</Spacings.Stack>
) : (
<ContentNotification
data-testid="no-data-notification"
type="info"
intlMessage={messages.noData}
></ContentNotification>
NoDataFallback
);

return (
Expand All @@ -218,14 +220,7 @@ const Welcome = () => {
/>
</Spacings.Stack>
</PageContentFull>
{viewLoading && !noData ? (
<LoadingSpinner
data-testid="loading-spinner"
scale="l"
></LoadingSpinner>
) : (
MollieDataTable
)}
{MollieDataTable}
</Spacings.Stack>
);
};
Expand Down

0 comments on commit 5139473

Please sign in to comment.