feat: add title and description

collective · Jul 5, 2021 · 0b7be9f · 0b7be9f
1 parent 2390c88
commit 0b7be9f
Show file tree

Hide file tree

Showing 4 changed files with 43 additions and 0 deletions.
diff --git a/.gitignore b/.gitignore
@@ -14,3 +14,4 @@ dist
 .env.development.local
 .env.test.local
 .env.production.local
+*~
diff --git a/src/components/Edit.jsx b/src/components/Edit.jsx
@@ -64,6 +64,11 @@ class Edit extends SubblocksEdit {
     return (
       <div className="public-ui">
         <Segment>
+          {this.props.data.title && <h2>{this.props.data.title}</h2>}
+          {this.props.data.description && (
+            <p className="description">{this.props.data.description}</p>
+          )}
+
           <SubblocksWrapper node={this.node}>
             {this.state.subblocks.map((subblock, subindex) => (
               <Form.Field key={subindex}>

diff --git a/src/components/FormView.jsx b/src/components/FormView.jsx
@@ -68,6 +68,10 @@ const FormView = ({
     <div className="block form">
       <div className="public-ui">
         <Segment style={{ margin: '2rem 0' }} padded>
+          {data.title && <h2>{data.title}</h2>}
+          {data.description && (
+            <p className="description">{data.description}</p>
+          )}
           {formState.error ? (
             <Message error role="alert">
               <Message.Header as="h4">

diff --git a/src/components/Sidebar.jsx b/src/components/Sidebar.jsx
@@ -20,6 +20,7 @@ import {
   SelectWidget,
   ArrayWidget,
   FormFieldWrapper,
+  TextareaWidget,
 } from '@plone/volto/components';
 
 import upSVG from '@plone/volto/icons/up-key.svg';
@@ -30,6 +31,14 @@ import deleteSVG from '@plone/volto/icons/delete.svg';
 import { getFormData, exportCsvFormData, clearFormData } from '../actions';
 
 const messages = defineMessages({
+  title: {
+    id: 'title',
+    defaultMessage: 'Title',
+  },
+  description: {
+    id: 'description',
+    defaultMessage: 'Description',
+  },
   default_to: {
     id: 'form_to',
     defaultMessage: 'Recipients',
@@ -193,6 +202,30 @@ const Sidebar = ({
           </h2>
         </header>
         <Segment>
+          <TextWidget
+            id="title"
+            title={intl.formatMessage(messages.title)}
+            required={false}
+            value={data.title}
+            onChange={(name, value) => {
+              onChangeBlock(block, {
+                ...data,
+                [name]: value,
+              });
+            }}
+          />
+          <TextareaWidget
+            id="description"
+            title={intl.formatMessage(messages.description)}
+            required={false}
+            value={data.description}
+            onChange={(name, value) => {
+              onChangeBlock(block, {
+                ...data,
+                [name]: value,
+              });
+            }}
+          />
           <TextWidget
             id="default_to"
             title={intl.formatMessage(messages.default_to)}