import React, { ReactElement } from 'react';
import LayoutAuthenticated from '../../layouts/Authenticated';
import { fetch } from '../../stores/funding_sources/funding_sourcesSlice';
import EntityRecordViewPage from '../../components/EntityPage/EntityRecordViewPage';

const FundingSourcesView = () => (
  <EntityRecordViewPage
    singularLabel="Funding Source"
    pluralLabel="Funding Sources"
    stateKey="funding_sources"
    recordKey="funding_sources"
    fetchRecord={fetch}
    listHref="/funding_sources/funding_sources-list"
    editHref={(id) => `/funding_sources/funding_sources-edit/?id=${id ?? ''}`}
  />
);

FundingSourcesView.getLayout = function getLayout(page: ReactElement) {
  return <LayoutAuthenticated permission={'READ_FUNDING_SOURCES'}>{page}</LayoutAuthenticated>;
};

export default FundingSourcesView;