'use client';
import { useEffect, useState } from 'react';
import { Item, Tabs, useToasts, Button, Text, Icon, Icons, Loading } from 'react-basics';
import { useRouter } from 'next/navigation';
import Link from 'next/link';
import PageHeader from 'components/layout/PageHeader';
import WebsiteEditForm from './[id]/WebsiteEditForm';
import WebsiteData from './[id]/WebsiteData';
import TrackingCode from './[id]/TrackingCode';
import ShareUrl from './[id]/ShareUrl';
import useApi from 'components/hooks/useApi';
import useMessages from 'components/hooks/useMessages';
export function WebsiteSettings({ websiteId, openExternal = false, analyticsUrl }) {
const router = useRouter();
const { formatMessage, labels, messages } = useMessages();
const { get, useQuery } = useApi();
const { showToast } = useToasts();
const { data, isLoading } = useQuery({
queryKey: ['website', websiteId],
queryFn: () => get(`/websites/${websiteId}`),
enabled: !!websiteId,
gcTime: 0,
});
const [values, setValues] = useState(null);
const [tab, setTab] = useState('details');
const showSuccess = () => {
showToast({ message: formatMessage(messages.saved), variant: 'success' });
};
const handleSave = data => {
showSuccess();
setValues(state => ({ ...state, ...data }));
};
const handleReset = async value => {
if (value === 'delete') {
router.push('/settings/websites');
} else if (value === 'reset') {
showSuccess();
}
};
useEffect(() => {
if (data) {
setValues(data);
}
}, [data]);
if (isLoading || !values) {
return ;
}
return (
<>
- {formatMessage(labels.details)}
- {formatMessage(labels.trackingCode)}
- {formatMessage(labels.shareUrl)}
- {formatMessage(labels.data)}
{tab === 'details' && (
)}
{tab === 'tracking' && }
{tab === 'share' && (
)}
{tab === 'data' && }
>
);
}
export default WebsiteSettings;