saleor-dashboard/src/giftCards/GiftCardsList/GiftCardsListHeader/GiftCardsListHeaderAlert.tsx
2023-03-17 08:41:44 +01:00

49 lines
1.5 KiB
TypeScript

import { useGiftCardProductsCountQuery } from "@dashboard/graphql";
import useLocalStorage from "@dashboard/hooks/useLocalStorage";
import { Alert } from "@saleor/macaw-ui";
import React from "react";
import { useIntl } from "react-intl";
import { giftCardsListHeaderMenuItemsMessages as messages } from "../messages";
import GiftCardsListHeaderAlertContent from "./GiftCardsListHeaderAlertContent";
const GiftCardsListHeaderAlert: React.FC = () => {
const intl = useIntl();
const [selectedChannel] = useLocalStorage("channel", "");
const { data: giftCardProductsCount, loading: giftCardProductsCountLoading } =
useGiftCardProductsCountQuery({
variables: {
channel: selectedChannel,
},
});
const giftCardProductTypesExist =
giftCardProductsCount?.giftCardProductTypes.totalCount > 0;
const giftCardProductsExist =
giftCardProductsCount?.giftCardProducts.totalCount > 0;
const showNoGiftCardProductsAlert =
!giftCardProductsCountLoading &&
(!giftCardProductTypesExist || !giftCardProductsExist);
if (showNoGiftCardProductsAlert) {
return (
<Alert
title={intl.formatMessage(messages.noGiftCardsAlertTitle)}
variant="warning"
close={false}
className="remove-icon-background"
>
<GiftCardsListHeaderAlertContent
giftCardProductTypesExist={giftCardProductTypesExist}
giftCardProductsExist={giftCardProductsExist}
/>
</Alert>
);
}
return null;
};
export default GiftCardsListHeaderAlert;