import DataTable from '@/components/common/data-table';
import PageHeading from '@/components/common/page-heading';
import { Badge } from '@/components/ui/badge';
import { useApiSWR } from '@/hooks/useSWR';
import { SortingState } from '@tanstack/react-table';
import { useState } from 'react';
import { useTranslation } from 'react-i18next';

const ServerInfo = () => {
  const [sorting, setSorting] = useState<SortingState>([]);
  const { t } = useTranslation();
  type TServerInfo = {
    server_software: string;
    memory_limit: string;
    max_execution_time: string;
    upload_max_filesize: string;
    post_max_size: string;
  };

  const { data, isLoading } = useApiSWR<TServerInfo>(
    '/admin/settings/server-info',
  );

  const tableData = data
    ? [
        {
          subject: t('Server Software'),
          info: data.server_software,
        },
        {
          subject: t('Memory Limit'),
          info: data.memory_limit,
        },
        {
          subject: t('Max Execution Time'),
          info: data.max_execution_time,
        },
        {
          subject: t('Upload Max Filesize'),
          info: data.upload_max_filesize,
        },
        {
          subject: t('Post Max Size'),
          info: data.post_max_size,
        },
        {
          subject: t('Server Status'),
          info: t('Online'),
        },
      ]
    : [];

  return (
    <>
      <PageHeading
        title={t('Server Info')}
        description={t(
          'View server environment and PHP configuration details.',
        )}
      />
      <DataTable
        data={tableData}
        sorting={sorting}
        setSorting={setSorting}
        isLoading={isLoading}
        rounded
        structure={[
          {
            accessorKey: 'subject',
            header: t('Subject'),
          },
          {
            accessorKey: 'info',
            header: t('Info'),
            cell: ({ row, getValue }) => {
              const value = getValue();

              if (
                row.original.subject === t('Server Status') &&
                value === t('Online')
              ) {
                return <Badge variant="success">{value}</Badge>;
              }

              return value;
            },
          },
        ]}
      />
    </>
  );
};

ServerInfo.title = 'Server Info';

export default ServerInfo;