Merge branch 'release/2.9.0'

.env.example

@@ -0,0 +1,9 @@
+NEXT_PUBLIC_FORM_KEY=
+NEXT_PUBLIC_HUBSPOT=
+NEXT_PUBLIC_HUBSPOT_SITE=
+NEXT_PUBLIC_WORDPRESS_URL=http://marceloglacial.com/brinca
+NEXT_PUBLIC_CLOUDINARY_API_URL=https://api.cloudinary.com/v1_1
+NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME=
+GOOGLE_PRIVATE_KEY=
+GOOGLE_SHEET_ID=
+GOOGLE_CLIENT_EMAIL=

.gitignore

@@ -34,3 +34,5 @@ yarn-error.log*
 
 # vercel
 .vercel
+
+secrets.json

components/Blocks/BusinessCard/BusinessCard.js

@@ -0,0 +1,50 @@
+import Image from 'next/image';
+import BusinessCardFooter from './BusinessCardFooter';
+
+const BusinessCard = ({
+  active,
+  title,
+  description,
+  image,
+  membership,
+  address,
+  category,
+  email,
+  facebook,
+  instagram,
+  phone,
+  website,
+  whatsapp,
+}) => {
+  if (active !== 'TRUE') return false;
+
+  const hasImage = image && membership;
+  const footerProps = {
+    address,
+    category,
+    email,
+    facebook,
+    instagram,
+    phone,
+    website,
+    whatsapp,
+    iconSize: `24px`,
+  };
+
+  return (
+    <div className='card card--business'>
+      <div className='card-body'>
+        <div className={`card-img-top ${!hasImage ? 'hidden' : ''}`}>
+          {hasImage && <Image src={image} width={130} height={100} />}
+        </div>
+        <div className='card-info'>
+          <div className='card-title'>{title}</div>
+          <div className='card-description'>{description}</div>
+        </div>
+      </div>
+      <BusinessCardFooter {...footerProps} />
+    </div>
+  );
+};
+
+export default BusinessCard;

components/Blocks/BusinessCard/BusinessCardFooter.js

@@ -0,0 +1,67 @@
+import getPhoneNumber from 'functions/getPhoneNumber';
+import getSocialLink from 'functions/getSocialLink';
+import { BsWhatsapp, BsFacebook, BsInstagram } from 'react-icons/bs';
+
+const BusinessCardFooter = ({
+  address,
+  category,
+  email,
+  facebook,
+  instagram,
+  phone,
+  website,
+  whatsapp,
+  iconSize,
+}) => {
+  return (
+    <div className='card-footer'>
+      <div className='card-meta'>
+        {address && <div className='card-address'>{address}</div>}
+        {email && (
+          <div className='card-email'>
+            <a href={`mailto:${email}`}>{email}</a>
+          </div>
+        )}
+        {phone && (
+          <div className='card-phone'>
+            <a href={`tel:${getPhoneNumber(phone)}`}>{phone}</a>
+          </div>
+        )}
+        {website && (
+          <div className='card-url'>
+            <a href={website} target={`_blank`}>
+              {website}
+            </a>
+          </div>
+        )}
+        <div className='card-social'>
+          {whatsapp && (
+            <a
+              href={`https://wa.me/${getPhoneNumber(whatsapp)}`}
+              target='_blank'
+            >
+              <BsWhatsapp className='card-icon' size={iconSize} />
+            </a>
+          )}
+          {facebook && (
+            <a
+              href={`https://facebook.com/${getSocialLink(facebook)}`}
+              target='_blank'
+            >
+              <BsFacebook className='card-icon' size={iconSize} />
+            </a>
+          )}
+          {instagram && (
+            <a
+              href={`https://instagram.com/${getSocialLink(instagram)}`}
+              target='_blank'
+            >
+              <BsInstagram className='card-icon' size={iconSize} />
+            </a>
+          )}
+        </div>
+      </div>
+    </div>
+  );
+};
+export default BusinessCardFooter;

components/Blocks/Form/Form.js

@@ -67,7 +67,7 @@ const Form = (props) => {
         handleServerResponse(true, 'Obrigado por enviar essa mensagem.');
       })
       .catch((error) => {
-        console.log('error', error);
+        console.error('error', error);
         handleServerResponse(false, 'Error!');
       });
   };

components/Blocks/Form/components/FormDropdown.js

@@ -0,0 +1,31 @@
+const FormDropDown = (props) => {
+  const { id, name, label, value, required, options } =
+    props.attributes || props;
+  const { handleOnChange } = props;
+  return (
+    <div className={`form__group form__group--select`}>
+      <label className='label' htmlFor={id}>
+        {label}
+      </label>
+      <select
+        name={name}
+        id={id}
+        className={`select`}
+        defaultValue={value || ''}
+        required={required || false}
+        onChange={(e) => handleOnChange(e)}
+      >
+        <option value=''>--------</option>
+        {options?.map((item, index) => {
+          const { label, value } = item;
+          return (
+            <option value={value} key={index}>
+              {label}
+            </option>
+          );
+        })}
+      </select>
+    </div>
+  );
+};
+export default FormDropDown;

components/Blocks/Form/components/FormField.js

@@ -4,11 +4,13 @@ import FormTextArea from './FormTextArea';
 import FormSelect from './FormSelect';
 import FormMultiple from './FormMultiple';
 import FormCheckbox from './FormCheckbox';
+import FormDropDown from './FormDropdown';
 
 const FormField = (props) => {
-  const { type } = props.attributes;
+  const { type } = props.attributes || props;
   const fieldTypes = {
     textfield: <FormInput {...props} />,
+    file: <FormInput {...props} />,
     email: <FormInput {...props} />,
     phoneNumber: <FormInput {...props} />,
     url: <FormInput {...props} />,
@@ -17,6 +19,7 @@ const FormField = (props) => {
     selectboxes: <FormMultiple {...props} />,
     checkbox: <FormCheckbox {...props} />,
     menu: <FormSelect {...props} />,
+    dropdown: <FormDropDown {...props} />,
   };
   return (
     <div className={styles.formItem} data-aos='fade-in'>

components/Blocks/Form/components/FormInput.js

@@ -8,6 +8,8 @@ const FormInput = (props) => {
     type,
     validate: { required },
     validation,
+    placeholder,
+    name,
   } = attributes;
   const title = label;
   const validationType = validation && validation.type;
@@ -25,9 +27,10 @@ const FormInput = (props) => {
       <input
         type={inputTypes[finalType] || finalType}
         id={id}
-        name={title}
+        name={name || title}
         className={input}
         onChange={(e) => handleOnChange(e, key)}
+        placeholder={placeholder}
         required={required}
       />
     </>

components/Blocks/Form/components/FormSelect.js

@@ -4,11 +4,12 @@ const FormSelect = (props) => {
   const {
     id,
     key,
-    headings,
+    headings = {},
     validate: { required },
     answers: { choices },
+    label,
   } = attributes;
-  const title = headings[0].heading;
+  const title = headings[0]?.heading || label;
 
   return (
     <>
@@ -22,7 +23,7 @@ const FormSelect = (props) => {
         onChange={(e) => handleOnChange(e, key)}
       >
         <option value={'nenhuma'}>Escolha uma opção</option>
-        {choices.map((item) => (
+        {choices?.map((item) => (
           <option key={item.id} value={item.text}>
             {item.text}
           </option>

components/Blocks/Hubspot/Forms.js

@@ -69,8 +69,6 @@ const HubSpotForms = (props) => {
       },
     });
 
-    console.log(raw);
-
     const requestOptions = {
       method: 'POST',
       headers: myHeaders,
@@ -87,7 +85,7 @@ const HubSpotForms = (props) => {
         response.status === 200 && setFormStatus(true);
       })
       .catch((error) => {
-        console.log('error', error);
+        console.error('error', error);
       });
   };
 

components/Blocks/InstaFeed/InstaFeed.js

@@ -8,7 +8,7 @@ const InstaFeed = (props) => {
   const isThumbnail = imageType === 'thumbnail';
 
   if (isError) {
-    console.log(isError);
+    console.error(isError);
     return <p>Error!</p>;
   }
   if (isLoading) return <p>Loading ...</p>;

components/Blocks/Partners/Partners.js

@@ -0,0 +1,22 @@
+import filterData from 'functions/filterData';
+import { getGold, getSilver } from 'functions/getPartners';
+import PartnersGroup from './PartnersGroup';
+
+const Partners = (props) => {
+  const { data, filter } = props;
+  const partnersGold = filterData(getGold(data), filter);
+  const partnersSilver = filterData(getSilver(data), filter);
+  const hasPartners = partnersGold && partnersSilver;
+
+  if (!hasPartners) return <section>loading...</section>;
+
+  return (
+    <section className='partners pt-0'>
+      <div className='partners__body'>
+        <PartnersGroup title={'Associados'} partners={partnersGold} />
+        <PartnersGroup title={'Comunidade'} partners={partnersSilver} />
+      </div>
+    </section>
+  );
+};
+export default Partners;

components/Blocks/Partners/PartnersContent.js

@@ -0,0 +1,27 @@
+import Link from 'next/link';
+
+const PartnersContent = (props) => {
+  return (
+    <div className='partners__content'>
+      <p>
+        Aqui você encontra produtos e serviços de brasileiros para brasileiros
+      </p>
+      <p>
+        Quer ver sua empresa aqui também?{' '}
+        <Link href='/parceiros/cadastro'>
+          Clique aqui para preencher o formulário
+        </Link>{' '}
+        ou envie um e-mail para{' '}
+        <a href='mailto:business@brinca.ca'>business@brinca.ca</a> com logotipo,
+        nome da empresa, endereço, telefone, e-mail, site e descrição de sua
+        empresa e/ou serviço em uma frase, além do e-mail cadastrado como membro
+        da BRINCA.
+      </p>
+      <h6>
+        Atenção: A BRINCA não se responsabiliza por produtos ou serviços
+        anunciados nesta página.
+      </h6>
+    </div>
+  );
+};
+export default PartnersContent;

components/Blocks/Partners/PartnersFilter.js

@@ -0,0 +1,39 @@
+import Button from 'components/Button/Button';
+import { useState } from 'react';
+import PartnersFilterList from './PartnersFilterList';
+import PartnersTags from './PartnersTags';
+
+const PartnersFilter = ({
+  title = 'Filtros',
+  categories = [],
+  checked,
+  setChecked,
+}) => {
+  const [isOpen, setIsOpen] = useState(false);
+  const categoriesProps = {
+    title: 'Categorias',
+    setIsOpen,
+    isOpen,
+    checked,
+    setChecked,
+    list: categories,
+  };
+  const tagsProps = {
+    tags: checked,
+    setTags: setChecked,
+  };
+
+  return (
+    <div className='partners__filter'>
+      <div className='partners__filter-header'>
+        <div className='partners__filter-title'>{title}</div>
+        <PartnersFilterList {...categoriesProps} />
+      </div>
+      <div className='partners__filter-body'>
+        <PartnersTags {...tagsProps} />
+      </div>
+    </div>
+  );
+};
+
+export default PartnersFilter;