Untitled

import { useRouter } from 'next/router';
import { ReactElement, useEffect, useReducer, useState } from 'react';
import { fetchPovLice } from 'src/api';
import Layout from 'src/layouts';
import useSWR from 'swr';

import { Box, Link, Stack, Typography, useTheme } from '@mui/material';

import { Iconify, Page } from '@shared/components';
import { ICON } from '@shared/config';
import replaceObjectNullValues from '@shared/utils/replaceObjectNullValues';

// import PovLicaOverview from '../components/PovLicaOverview';
// import PovLicaPoUgovoruPage from './interna-revizija-po-ugovoru';

PovLicaPage.getLayout = function getLayout(page: ReactElement) {
  return <Layout disableSearch>{page}</Layout>;
};

PovLicaPage.requiredRoles = ['admin', 'test-role'];

const reducer = (state: any, action: any) => {
  switch (action.type) {
    case 'SET_VISIBLE':
      return {
        ...state,
        visibleModal: false,
        visibleDetails: false,
        isPovLicaCopy: false,
      };
    // case 'SET_VISIBLE_MODAL':
    //   return { ...state, visibleModal: action.payload };
    // case 'SET_VISIBLE_DIALOG':
    //   return { ...state, visibleDialog: action.payload };
    // case 'SET_VISIBLE_DETAILS':
    //   return { ...state, visibleDetails: action.payload };
    // case 'SET_SELECTED_BLAGAJNA_IZLAZ':
    //   return { ...state, selectedPovLica: action.payload };
    // case 'SET_VISIBLE_DELETE_BLAGAJNA_IZLAZ_DIALOG':
    //   return { ...state, visibleDeletePovLicaDialog: action.payload };
    // case 'SET_IS_BLAGAJNA_IZLAZ_COPY':
    //   return { ...state, isPovLicaCopy: action.payload };
    case 'SET_ORDER':
      return { ...state, order: action.payload };
    default:
      return state;
  }
};
type Props = {
  prefetchedData?: Record<string, any>;
};
interface IOrderProps {
  id: string;
}
interface IPovLicaProps {
  id: string;
  sifra: string;
  naziv: string;
  vrsta_grupe: string;
  nazivVrste: string;
}

const initialState = {
  visibleModal: false,
  visibleDialog: false,
  isPovLicaCopy: false,
  selectedInternaRevizije: [] as IPovLicaProps[],
  selectedPovLica: {
    id: '',
    sifra: '',
    naziv: '',
    vrsta_grupe: '',
    nazivVrste: '',
  } as IPovLicaProps,
  order: {
    id: '',
  } as IOrderProps,
};
export default function PovLicaPage({ prefetchedData }: Props) {
  const router = useRouter();
  const theme = useTheme();
  const [state, dispatch] = useReducer(reducer, initialState);

  const {
    data: PovLicaData = {
      id: '',
      sifra: '',
      naziv: '',
      vrsta_grupe: '',
      nazivVrste: '',
    },
    mutate: PovLicaMutate,
  } = useSWR(
    router.isReady && state.order.id ? [state.order.id] : [],
    fetchPovLice,
    {
      fallbackData: prefetchedData,
    }
  );

  useEffect(() => {
    if (!router.isReady) return;
    const { id } = router.query;
    dispatch({
      type: 'SET_ORDER',
      payload: {
        id: id as string,
      },
    });
  }, [router.isReady, router.query]);
  const [openDeleteDialog, setDeleteEditDialog] = useState(false);

  return (
    <Page title="Povezana lica">
      <Box
        display={'flex'}
        flexDirection={{ sm: 'row', xs: 'column' }}
        justifyContent={'space-between'}
        mb={5}
      >
        <Stack
          direction={'row'}
          spacing={2}
          sx={{ display: 'flex', alignItems: 'center' }}
          mb={{ xs: 2, sm: 0 }}
        >
          <Link
            component="button"
            onClick={() => router.push('/povezana-lica-grupe')}
            variant="subtitle1"
            underline="always"
            color="primary.dark"
          >
            Povezana lica grupe
          </Link>
          <Iconify
            icon={'akar-icons:triangle-fill'}
            rotate={1}
            color={theme.palette.primary.dark}
            width={ICON.SMALL}
          />
          <Typography variant="h3">Povezana lica ({PovLicaData.id})</Typography>
        </Stack>
        <Box></Box>
      </Box>
      {/* <PovLicaOverview
        theme={theme}
        PovLicaData={replaceObjectNullValues(PovLicaData)}
        PovLicaMutate={PovLicaMutate}
      /> */}
      {/* <PovLicaPoUgovoruPage
        PovLica={PovLicaData.broj}
      /> */}
    </Page>
  );
}