import { AxiosErrorResponse, BasePageProps, Book, UploadType } from '@/types';
import { authentication, errorMessageFormatter, localeLinkGenerator } from '@/utils';
import Layout from '@/components/layouts';
import { GetServerSideProps, NextPage } from 'next';
import { useTranslation } from 'next-i18next';
import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
import { Empty, Form, Tabs, UploadFile } from 'antd';
import { useQuery, useQueryClient } from '@tanstack/react-query';
import { bookKeys, getBookById } from '@/services/book';
import { useRouter } from 'next/router';
import { toast } from 'react-toastify';
import Initialize from '@/components/globals/Initialize';
import { mediaResponseToFormValue } from '@/transformer/media/media';
import conditionalReturn from '@/utils/conditionalReturn';
import BookDetailTab from '@/components/book/tabs/BookDetailTab';

const BookId: NextPage<BasePageProps> = ({ member }) => {
    const { t } = useTranslation(['book', 'layout', 'common', 'messages']);
    const router = useRouter();
    const [editBookForm] = Form.useForm<Book & { uploadFile: UploadFile[] }>();
    const { bookId } = router.query;
    const queryClient = useQueryClient();

    // Query
    const getBookDetailsQuery = useQuery({
        queryKey: bookKeys.id(bookId as string),
        queryFn: async () => {
            const response = await getBookById(bookId as string);
            return response.data;
        },
        onError: (error: AxiosErrorResponse & Error) => {
            toast.error(t(errorMessageFormatter(error)));
        },
        onSuccess(data) {
            editBookForm.setFieldsValue({
                name: data.name,
                description: data.description,
                uploadType: data.uploadType,
                ...(data.uploadType === UploadType.LINK && { link: data.link }),
                ...conditionalReturn(data.uploadType === UploadType.FILE, { uploadFile: data.bookMedias.map(mediaResponseToFormValue) }),
            });
        },
    });

    if (getBookDetailsQuery.isLoading) {
        return <Initialize />;
    }

    const onTabChangeHandler = (key: string) => {
        if (key === 'activityLog') {
            queryClient.invalidateQueries(['activityLog']);
        }
    };

    // Data
    const seoConfig = {
        title: t('book'),
    };

    const breadCrumbItems = [
        {
            label: t('layout:book'),
            path: '/book-order',
        },
        {
            label: getBookDetailsQuery.data?.name ?? t('common:no-data'),
            path: '/',
        },
    ];

    const tabItems = [
        // Book Detail Tab
        {
            label: t('book'),
            key: 'book',
            children: <BookDetailTab />,
        },
    ];

    return (
        <Layout member={member} breadCrumbItems={breadCrumbItems} activeMenu={['book-order']} seoConfig={seoConfig}>
            {!getBookDetailsQuery.data ? (
                <Empty />
            ) : (
                <div>
                    <Tabs items={tabItems} onChange={onTabChangeHandler} className="bg-white p-9 pt-5 rounded-lg" />
                </div>
            )}
        </Layout>
    );
};

export const getServerSideProps: GetServerSideProps = async ({ req, locale, resolvedUrl }) => {
    try {
        const authResponse = await authentication(req);

        return {
            props: {
                member: authResponse,
                ...(await serverSideTranslations(locale as string, ['book', 'layout', 'common', 'messages', 'book-request', 'api-messages'])),
            },
        };
    } catch (error: any) {
        if (error.response?.data?.unauthorized) {
            return {
                redirect: {
                    destination: localeLinkGenerator(locale, `/unauthorized`),
                    permanent: false,
                },
            };
        }

        return {
            redirect: {
                destination: localeLinkGenerator(locale, `/?redirect=/${resolvedUrl}`),
                permanent: false,
            },
        };
    }
};

export default BookId;