Criação do bloco de calendário

backend/src/plonegovbr/intranet/locales/en/LC_MESSAGES/plonegovbr.intranet.po

@@ -1,7 +1,7 @@
 msgid ""
 msgstr ""
 "Project-Id-Version: PACKAGE VERSION\n"
-"POT-Creation-Date: 2024-07-10 21:28+0000\n"
+"POT-Creation-Date: 2024-11-11 22:12+0000\n"
 "PO-Revision-Date: YEAR-MO-DA HO:MI +ZONE\n"
 "Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
 "Language-Team: LANGUAGE <LL@li.org>\n"

backend/src/plonegovbr/intranet/locales/plonegovbr.intranet.pot

@@ -4,7 +4,7 @@
 msgid ""
 msgstr ""
 "Project-Id-Version: PACKAGE VERSION\n"
-"POT-Creation-Date: 2024-07-10 21:28+0000\n"
+"POT-Creation-Date: 2024-11-11 22:12+0000\n"
 "PO-Revision-Date: YEAR-MO-DA HO:MI +ZONE\n"
 "Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
 "Language-Team: LANGUAGE <LL@li.org>\n"

backend/src/plonegovbr/intranet/locales/pt_BR/LC_MESSAGES/plonegovbr.intranet.po

@@ -1,7 +1,7 @@
 msgid ""
 msgstr ""
 "Project-Id-Version: PACKAGE VERSION\n"
-"POT-Creation-Date: 2024-07-10 21:28+0000\n"
+"POT-Creation-Date: 2024-11-11 22:12+0000\n"
 "PO-Revision-Date: YEAR-MO-DA HO:MI +ZONE\n"
 "Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
 "Language-Team: LANGUAGE <LL@li.org>\n"

frontend/packages/portalbrasil-intranet/locales/de/LC_MESSAGES/volto.po

@@ -11,6 +11,16 @@ msgstr ""
 "Content-Transfer-Encoding: \n"
 "Plural-Forms: \n"
 
+#. Default: "Adicionar descrição dos eventos?"
+#: components/Blocks/Calendario/schema
+msgid "Adicionar descrição dos eventos?"
+msgstr ""
+
+#. Default: "Calendário"
+#: components/Blocks/Calendario/schema
+msgid "Calendário"
+msgstr ""
+
 #. Default: "Close menu"
 #: components/Navigation/Navigation
 msgid "Close menu"
@@ -41,8 +51,14 @@ msgstr ""
 msgid "Powered by Portal Brasil: Intranet, Plone & Python"
 msgstr ""
 
+#. Default: "Query"
+#: components/Blocks/Calendario/schema
+msgid "Query"
+msgstr ""
+
 #. Default: "Título"
 #: components/Blocks/Areas/schema
+#: components/Blocks/Calendario/schema
 #: components/Blocks/Colaboradores/schema
 #: components/Blocks/Gestor/schema
 msgid "Título"

frontend/packages/portalbrasil-intranet/locales/en/LC_MESSAGES/volto.po

@@ -11,6 +11,16 @@ msgstr ""
 "Content-Transfer-Encoding: \n"
 "Plural-Forms: \n"
 
+#. Default: "Adicionar descrição dos eventos?"
+#: components/Blocks/Calendario/schema
+msgid "Adicionar descrição dos eventos?"
+msgstr ""
+
+#. Default: "Calendário"
+#: components/Blocks/Calendario/schema
+msgid "Calendário"
+msgstr ""
+
 #. Default: "Close menu"
 #: components/Navigation/Navigation
 msgid "Close menu"
@@ -41,8 +51,14 @@ msgstr ""
 msgid "Powered by Portal Brasil: Intranet, Plone & Python"
 msgstr ""
 
+#. Default: "Query"
+#: components/Blocks/Calendario/schema
+msgid "Query"
+msgstr ""
+
 #. Default: "Título"
 #: components/Blocks/Areas/schema
+#: components/Blocks/Calendario/schema
 #: components/Blocks/Colaboradores/schema
 #: components/Blocks/Gestor/schema
 msgid "Título"

frontend/packages/portalbrasil-intranet/locales/es/LC_MESSAGES/volto.po

@@ -11,6 +11,16 @@ msgstr ""
 "Content-Transfer-Encoding: \n"
 "Plural-Forms: \n"
 
+#. Default: "Adicionar descrição dos eventos?"
+#: components/Blocks/Calendario/schema
+msgid "Adicionar descrição dos eventos?"
+msgstr ""
+
+#. Default: "Calendário"
+#: components/Blocks/Calendario/schema
+msgid "Calendário"
+msgstr ""
+
 #. Default: "Close menu"
 #: components/Navigation/Navigation
 msgid "Close menu"
@@ -41,8 +51,14 @@ msgstr ""
 msgid "Powered by Portal Brasil: Intranet, Plone & Python"
 msgstr ""
 
+#. Default: "Query"
+#: components/Blocks/Calendario/schema
+msgid "Query"
+msgstr ""
+
 #. Default: "Título"
 #: components/Blocks/Areas/schema
+#: components/Blocks/Calendario/schema
 #: components/Blocks/Colaboradores/schema
 #: components/Blocks/Gestor/schema
 msgid "Título"

frontend/packages/portalbrasil-intranet/locales/pt_BR/LC_MESSAGES/volto.po

@@ -11,6 +11,16 @@ msgstr ""
 "Content-Transfer-Encoding: \n"
 "Plural-Forms: \n"
 
+#. Default: "Adicionar descrição dos eventos?"
+#: components/Blocks/Calendario/schema
+msgid "Adicionar descrição dos eventos?"
+msgstr ""
+
+#. Default: "Calendário"
+#: components/Blocks/Calendario/schema
+msgid "Calendário"
+msgstr ""
+
 #. Default: "Close menu"
 #: components/Navigation/Navigation
 msgid "Close menu"
@@ -41,8 +51,14 @@ msgstr ""
 msgid "Powered by Portal Brasil: Intranet, Plone & Python"
 msgstr ""
 
+#. Default: "Query"
+#: components/Blocks/Calendario/schema
+msgid "Query"
+msgstr ""
+
 #. Default: "Título"
 #: components/Blocks/Areas/schema
+#: components/Blocks/Calendario/schema
 #: components/Blocks/Colaboradores/schema
 #: components/Blocks/Gestor/schema
 msgid "Título"

frontend/packages/portalbrasil-intranet/locales/volto.pot

@@ -1,7 +1,7 @@
 msgid ""
 msgstr ""
 "Project-Id-Version: Plone\n"
-"POT-Creation-Date: 2024-07-10T21:28:22.781Z\n"
+"POT-Creation-Date: 2024-11-11T22:26:07.242Z\n"
 "Last-Translator: Plone i18n <plone-i18n@lists.sourceforge.net>\n"
 "Language-Team: Plone i18n <plone-i18n@lists.sourceforge.net>\n"
 "Content-Type: text/plain; charset=utf-8\n"
@@ -13,6 +13,16 @@ msgstr ""
 "Preferred-Encodings: utf-8\n"
 "Domain: volto\n"
 
+#. Default: "Adicionar descrição dos eventos?"
+#: components/Blocks/Calendario/schema
+msgid "Adicionar descrição dos eventos?"
+msgstr ""
+
+#. Default: "Calendário"
+#: components/Blocks/Calendario/schema
+msgid "Calendário"
+msgstr ""
+
 #. Default: "Close menu"
 #: components/Navigation/Navigation
 msgid "Close menu"
@@ -43,8 +53,14 @@ msgstr ""
 msgid "Powered by Portal Brasil: Intranet, Plone & Python"
 msgstr ""
 
+#. Default: "Query"
+#: components/Blocks/Calendario/schema
+msgid "Query"
+msgstr ""
+
 #. Default: "Título"
 #: components/Blocks/Areas/schema
+#: components/Blocks/Calendario/schema
 #: components/Blocks/Colaboradores/schema
 #: components/Blocks/Gestor/schema
 msgid "Título"

frontend/packages/portalbrasil-intranet/package.json

@@ -58,7 +58,9 @@
   },
   "peerDependencies": {
     "react": "18.2.0",
-    "react-dom": "18.2.0"
+    "react-dom": "18.2.0",
+    "@internationalized/date": "*",
+    "react-aria-components": "*"
   },
   "devDependencies": {
     "@plone/scripts": "^3.6.1",

frontend/packages/portalbrasil-intranet/src/components/Blocks/Calendario/Data.jsx

@@ -0,0 +1,34 @@
+import React from 'react';
+import { BlockDataForm } from '@plone/volto/components';
+import { calendarioSchema } from './schema';
+import { useIntl } from 'react-intl';
+
+const CalendarioBlockData = (props) => {
+  const { data, block, onChangeBlock, blocksConfig, navRoot, contentType } =
+    props;
+
+  const intl = useIntl();
+  const schema = calendarioSchema({ ...props, intl });
+  const onChangeField = (id, value) => {
+    onChangeBlock(block, {
+      ...data,
+      [id]: value,
+    });
+  };
+
+  return (
+    <BlockDataForm
+      schema={schema}
+      title={schema.title}
+      onChangeField={onChangeField}
+      onChangeBlock={onChangeBlock}
+      formData={data}
+      block={block}
+      blocksConfig={blocksConfig}
+      navRoot={navRoot}
+      contentType={contentType}
+    />
+  );
+};
+
+export default CalendarioBlockData;

frontend/packages/portalbrasil-intranet/src/components/Blocks/Calendario/DefaultView.jsx

@@ -0,0 +1,67 @@
+import React, { useState } from 'react';
+import PropTypes from 'prop-types';
+import { injectIntl } from 'react-intl';
+import { Container } from '@plone/components';
+import CalendarioEventos from '../../CalendarioEventos/CalendarioEventos';
+import { When } from '@plone/volto/components/theme/View/EventDatesInfo';
+import '@plone/components/src/styles/basic/Calendar.css';
+
+const Evento = ({ item }, hasDescription) => {
+  return (
+    <Container className={'evento'}>
+      <h3>{item.title}</h3>
+      <When start={item.start} end={item.end} />
+      {hasDescription && <p>{item.description}</p>}
+    </Container>
+  );
+};
+
+const EventosLista = ({ items }) => {
+  return (
+    <Container className={'eventos-lista'}>
+      {items && items.map((item, idx) => <Evento key={idx} item={item} />)}
+    </Container>
+  );
+};
+
+const CalendarioView = (props) => {
+  const { className, data, items, hasDescription } = props;
+  const { heading } = data;
+  const [date, setDate] = useState();
+  const dateItems = date && items && items[date.toString()];
+  return (
+    <div className={`block calendarioBlock ${className}`}>
+      <h2>{heading}</h2>
+      <Container className={'wrapper'}>
+        <div className={'calendario column'}>
+          <CalendarioEventos items={items} onChange={setDate} />
+        </div>
+        <div className={'eventos column'}>
+          {dateItems && (
+            <EventosLista items={dateItems} hasDescription={hasDescription} />
+          )}
+        </div>
+      </Container>
+    </div>
+  );
+};
+
+/**
+ * Property types.
+ * @property {Object} propTypes Property types.
+ * @static
+ */
+CalendarioView.propTypes = {
+  heading: PropTypes.string,
+};
+
+/**
+ * Default properties.
+ * @property {Object} defaultProps Default properties.
+ * @static
+ */
+CalendarioView.defaultProps = {
+  heading: 'Eventos',
+};
+
+export default injectIntl(CalendarioView);

frontend/packages/portalbrasil-intranet/src/components/Blocks/Calendario/Edit.jsx

@@ -0,0 +1,24 @@
+import React from 'react';
+import { withBlockExtensions } from '@plone/volto/helpers';
+import { SidebarPortal } from '@plone/volto/components';
+
+import CalendarioBlockData from './Data';
+import CalendarioBlockView from './View';
+
+const CalendarioBlockEdit = (props) => {
+  const { data, onChangeBlock, block, selected } = props;
+  return (
+    <>
+      <CalendarioBlockView {...props} isEditMode />
+      <SidebarPortal selected={selected}>
+        <CalendarioBlockData
+          data={data}
+          block={block}
+          onChangeBlock={onChangeBlock}
+        />
+      </SidebarPortal>
+    </>
+  );
+};
+
+export default withBlockExtensions(CalendarioBlockEdit);

frontend/packages/portalbrasil-intranet/src/components/Blocks/Calendario/View.jsx

@@ -0,0 +1,47 @@
+import React from 'react';
+import { withBlockExtensions } from '@plone/volto/helpers';
+import CalendarioView from './DefaultView';
+import { parseDate } from '@internationalized/date';
+import withQuerystringResults from './withQuerystringResults';
+
+const groupByDate = (items) => {
+  return items.reduce((map, obj) => {
+    if (!obj.start) {
+      return map;
+    }
+
+    let start = obj.start ? parseDate(obj.start.slice(0, 10)) : null;
+    const end = obj.end ? parseDate(obj.end.slice(0, 10)) : start;
+
+    while (start < end) {
+      const key = start.toString();
+
+      if (key) {
+        if (map[key] === undefined) {
+          map[key] = [];
+        }
+        map[key].push(obj);
+      }
+
+      start = start.add({ days: 1 });
+    }
+    return map;
+  }, {});
+};
+
+const CalendarioBlockView = withQuerystringResults((props) => {
+  const { data, isEditMode, path, pathname, className, listingItems } = props;
+  const items = listingItems ? groupByDate(listingItems) : {};
+
+  return (
+    <CalendarioView
+      data={data}
+      path={path ?? pathname}
+      isEditMode={isEditMode}
+      className={className}
+      items={items}
+    />
+  );
+});
+
+export default withBlockExtensions(CalendarioBlockView);