Exercicio 39.2: Implementa conexão com endpoint de secretarias

frontend/packages/volto-portal-governo/src/actions/secretarias/secretarias.js

@@ -0,0 +1,10 @@
+import { LIST_SECRETARIAS } from '../../constants/ActionTypes';
+export function listSecretarias() {
+  return {
+    type: LIST_SECRETARIAS,
+    request: {
+      op: 'get',
+      path: '@secretarias',
+    },
+  };
+}

frontend/packages/volto-portal-governo/src/components/Blocks/SecretariasBlock/DefaultView.jsx

@@ -1,14 +1,36 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { Container } from '@plone/components';
+import { UniversalLink } from '@plone/volto/components';
+
+const SecretariaSummary = ({ content }) => {
+  const { gestor } = content;
+  return (
+    <Container className={`secretaria summary`}>
+      <h4>
+        <UniversalLink item={content}>{content.title}</UniversalLink>
+      </h4>
+      {gestor && <span>{gestor.title}</span>}
+    </Container>
+  );
+};
+
 const SecretariasView = (props) => {
-  const { headline, className } = props;
+  const { secretarias, headline, className } = props;
   return (
     <Container narrow className={`block secretarias ${className}`}>
       <h3>{headline}</h3>
+      <Container className={`secretarias listing`}>
+        {secretarias &&
+          secretarias.length > 0 &&
+          secretarias.map(function (secretaria, i) {
+            return <SecretariaSummary content={secretaria} key={i} />;
+          })}
+      </Container>
     </Container>
   );
 };
+
 /**
  * Property types.
  * @property {Object} propTypes Property types.
@@ -17,6 +39,7 @@ const SecretariasView = (props) => {
 SecretariasView.propTypes = {
   headline: PropTypes.string,
 };
+
 /**
  * Default properties.
  * @property {Object} defaultProps Default properties.
@@ -25,4 +48,5 @@ SecretariasView.propTypes = {
 SecretariasView.defaultProps = {
   headline: 'Secretarias',
 };
+
 export default SecretariasView;

frontend/packages/volto-portal-governo/src/constants/ActionTypes.js

@@ -0,0 +1 @@
+export const LIST_SECRETARIAS = 'LIST_SECRETARIAS';

frontend/packages/volto-portal-governo/src/index.js

@@ -4,15 +4,19 @@ import GestorEdit from './components/Blocks/GestorBlock/Edit';
 import GestorView from './components/Blocks/GestorBlock/View';
 import gestorSVG from '@plone/volto/icons/user.svg';
 
-//secretarias
-import ListaSecretariasEdit from './components/Blocks/SecretariasBlock/Edit';
-import ListaSecretariasView from './components/Blocks/SecretariasBlock/View';
-import secretariasSVG from '@plone/volto/icons/user.svg';
+/// Secretarias
+import SecretariasBlockEdit from './components/Blocks/SecretariasBlock/Edit';
+import SecretariasBlockView from './components/Blocks/SecretariasBlock/View';
+import secretariaSVG from '@plone/volto/icons/home.svg';
 
 // Views
 import PessoaView from './components/Views/PessoaView';
 import SecretariaView from './components/Views/SecretariaView';
 
+// Reducers
+import defaultReducers from '@plone/volto/reducers';
+import secretarias from './reducers/secretarias/secretarias';
+
 const applyConfig = (config) => {
   config.settings = {
     ...config.settings,
@@ -44,16 +48,23 @@ const applyConfig = (config) => {
     view: GestorView,
     sidebarTab: 1,
   };
-  /// Bloco Lista Secretarias
-  config.blocks.blocksConfig.listaSecretariasBlock = {
-    id: 'listaSecretariasBlock',
-    title: 'Lista de Secretarias',
+  /// Bloco Secretarias
+  config.blocks.blocksConfig.secretariasBlock = {
+    id: 'secretariasBlock',
+    title: 'Listagem de Secretarias',
     group: 'procergs',
-    icon: secretariasSVG,
-    edit: ListaSecretariasEdit,
-    view: ListaSecretariasView,
+    icon: secretariaSVG,
+    edit: SecretariasBlockEdit,
+    view: SecretariasBlockView,
+    sidebarTab: 1,
   };
 
+  // Reducers
+  const localReducers = {
+    ...defaultReducers,
+    secretarias,
+  };
+  config.addonReducers = { ...config.addonReducers, ...localReducers };
   return config;
 };
 

frontend/packages/volto-portal-governo/src/reducers/secretarias/secretarias.js

@@ -0,0 +1,31 @@
+import { LIST_SECRETARIAS } from '../../constants/ActionTypes';
+const initialState = {
+  data: [],
+  loading: false,
+  error: null,
+};
+export default function secretarias(state = initialState, action = {}) {
+  switch (action.type) {
+    case `${LIST_SECRETARIAS}_PENDING`:
+      return {
+        ...state,
+        data: [],
+        error: null,
+        loading: true,
+      };
+    case `${LIST_SECRETARIAS}_SUCCESS`:
+      return {
+        ...state,
+        data: action.result,
+        error: null,
+      };
+    case `${LIST_SECRETARIAS}_FAIL`:
+      return {
+        ...state,
+        data: [],
+        error: action.error.response.error,
+      };
+    default:
+      return state;
+  }
+}