fd5c0c9747
* applied eslint * add locales and lint the project * removed error boundary * updated locales * fix min files * fix locales
39 lines
1.1 KiB
TypeScript
39 lines
1.1 KiB
TypeScript
import React from 'react';
|
|
import { Tooltip } from 'UI';
|
|
import { Button } from 'antd';
|
|
import { PlusOutlined } from '@ant-design/icons';
|
|
import AddCardSelectionModal from 'Components/Dashboard/components/AddCardSelectionModal';
|
|
import { useStore } from 'App/mstore';
|
|
import { useTranslation } from 'react-i18next';
|
|
|
|
const MAX_CARDS = 29;
|
|
|
|
function CreateCardButton() {
|
|
const { t } = useTranslation();
|
|
const [open, setOpen] = React.useState(false);
|
|
const { dashboardStore } = useStore();
|
|
const dashboard: any = dashboardStore.selectedDashboard;
|
|
const canAddMore: boolean = dashboard?.widgets?.length <= MAX_CARDS;
|
|
|
|
return (
|
|
<>
|
|
<Tooltip
|
|
delay={0}
|
|
disabled={canAddMore}
|
|
title={t('The number of cards in one dashboard is limited to 30.')}
|
|
>
|
|
<Button
|
|
type="primary"
|
|
disabled={!canAddMore}
|
|
onClick={() => setOpen(true)}
|
|
icon={<PlusOutlined />}
|
|
>
|
|
{t('Add Card')}
|
|
</Button>
|
|
</Tooltip>
|
|
<AddCardSelectionModal open={open} onClose={() => setOpen(false)} />
|
|
</>
|
|
);
|
|
}
|
|
|
|
export default CreateCardButton;
|