104 lines
3.3 KiB
TypeScript
104 lines
3.3 KiB
TypeScript
import { Button, Modal, DialogTrigger, Dialog, Column } from '@umami/react-zen';
|
|
import { useRouter } from 'next/navigation';
|
|
import {
|
|
useLoginQuery,
|
|
useMessages,
|
|
useModified,
|
|
useTeamsQuery,
|
|
useNavigation,
|
|
} from '@/components/hooks';
|
|
import { WebsiteDeleteForm } from './WebsiteDeleteForm';
|
|
import { WebsiteResetForm } from './WebsiteResetForm';
|
|
import { WebsiteTransferForm } from './WebsiteTransferForm';
|
|
import { ActionForm } from '@/components/common/ActionForm';
|
|
import { ROLES } from '@/lib/constants';
|
|
|
|
export function WebsiteData({ websiteId, onSave }: { websiteId: string; onSave?: () => void }) {
|
|
const { formatMessage, labels, messages } = useMessages();
|
|
const { user } = useLoginQuery();
|
|
const { touch } = useModified();
|
|
const { teamId, renderUrl } = useNavigation();
|
|
const router = useRouter();
|
|
const { result } = useTeamsQuery(user.id);
|
|
const canTransferWebsite =
|
|
(
|
|
!teamId &&
|
|
result.data.filter(({ teamUser }) =>
|
|
teamUser.find(
|
|
({ role, userId }) =>
|
|
[ROLES.teamOwner, ROLES.teamManager].includes(role) && userId === user.id,
|
|
),
|
|
)
|
|
).length > 0 ||
|
|
(teamId &&
|
|
!!result?.data
|
|
?.find(({ id }) => id === teamId)
|
|
?.teamUser.find(({ role, userId }) => role === ROLES.teamOwner && userId === user.id));
|
|
|
|
const handleSave = () => {
|
|
touch('websites');
|
|
onSave?.();
|
|
router.push(renderUrl(`/settings/websites`));
|
|
};
|
|
|
|
const handleReset = async () => {
|
|
onSave?.();
|
|
};
|
|
|
|
return (
|
|
<Column gap="6">
|
|
<ActionForm
|
|
label={formatMessage(labels.transferWebsite)}
|
|
description={formatMessage(messages.transferWebsite)}
|
|
>
|
|
<DialogTrigger>
|
|
<Button variant="secondary" isDisabled={!canTransferWebsite}>
|
|
{formatMessage(labels.transfer)}
|
|
</Button>
|
|
<Modal>
|
|
<Dialog title={formatMessage(labels.transferWebsite)}>
|
|
{({ close }) => (
|
|
<WebsiteTransferForm websiteId={websiteId} onSave={handleSave} onClose={close} />
|
|
)}
|
|
</Dialog>
|
|
</Modal>
|
|
</DialogTrigger>
|
|
</ActionForm>
|
|
|
|
<ActionForm
|
|
label={formatMessage(labels.resetWebsite)}
|
|
description={formatMessage(messages.resetWebsiteWarning)}
|
|
>
|
|
<DialogTrigger>
|
|
<Button variant="secondary">{formatMessage(labels.reset)}</Button>
|
|
<Modal>
|
|
<Dialog title={formatMessage(labels.resetWebsite)}>
|
|
{({ close }) => (
|
|
<WebsiteResetForm websiteId={websiteId} onSave={handleReset} onClose={close} />
|
|
)}
|
|
</Dialog>
|
|
</Modal>
|
|
</DialogTrigger>
|
|
</ActionForm>
|
|
|
|
<ActionForm
|
|
label={formatMessage(labels.deleteWebsite)}
|
|
description={formatMessage(messages.deleteWebsiteWarning)}
|
|
>
|
|
<DialogTrigger>
|
|
<Button data-test="button-delete" variant="danger">
|
|
{formatMessage(labels.delete)}
|
|
</Button>
|
|
<Modal>
|
|
<Dialog title={formatMessage(labels.deleteWebsite)}>
|
|
{({ close }) => (
|
|
<WebsiteDeleteForm websiteId={websiteId} onSave={handleSave} onClose={close} />
|
|
)}
|
|
</Dialog>
|
|
</Modal>
|
|
</DialogTrigger>
|
|
</ActionForm>
|
|
</Column>
|
|
);
|
|
}
|