Proyectos de Subversion LeadersLinked - SPA

import React from 'react';

import { useNavigate } from 'react-router-dom';

import { useSelector } from 'react-redux';

import { useKnowledges } from '../hooks';

import { Grid, PageHeader, Pagination, SearchBar, Spinner } from '@shared/components';

import { KnowledgeCard } from '@knowledges/components';

export default function KnowledgesPage() {

  const navigate = useNavigate();

  const labels = useSelector(({ intl }) => intl.labels);

  const {

    loading,

    knowledges,

    // categories,

    linkAdd,

    page,

    pages,

    setPage,

    addKnowledge,

    searchKnowledge,

    editKnowledge,

    deleteKnowledge

  } = useKnowledges();

  return (

    <>

      <PageHeader

        title={labels.knowledge_area_title}

        onAdd={linkAdd ? () => addKnowledge(linkAdd) : null}

        labelAdd={labels.knowledge_area_add}

      />

      <SearchBar onChange={searchKnowledge} />

      {loading ? (

        <Spinner />

      ) : (

        <Grid

          items={knowledges}

          emptyMessage={labels.error_no_record_matched_your_query}

          renderItem={(knowledge) => (

            <KnowledgeCard

              key={knowledge.link_view}

              knowledge={knowledge}

              onClick={() => navigate(knowledge.link_view)}

              onEdit={() => editKnowledge(knowledge.link_edit)}

              onDelete={() => deleteKnowledge(knowledge.link_delete)}

            />

          )}

        />

      )}

      <Pagination page={page} pages={pages} onChange={setPage} />

    </>

  );

}