homeflowjs 0.9.8 → 0.9.11

package/README.md

@@ -12,6 +12,7 @@ Please see the [HomeflowJS developer documentation](https://developer.homeflow.c
 
 To work on this package locally, use `yarn link` to link the theme directly to your local copy of homeflowjs (or just specify `file:~/projects/homeflowjs` in the theme's `package.json` file).
 
+
 Make sure you have cache disabled in Webpack or your changes to HomeflowJS may not be updated locally. You can set this in your Webpack config in whichever theme you are using for testing:
 
 ```

package/app/hf-initialize.jsx

@@ -57,7 +57,7 @@ const hfInitialize = () => {
     if (hash.includes('flash/')) {
       const flash = hash.split('flash/')[1];
       const message = Homeflow.get(`flash-message-${flash}`);
-      const type = hashTypes[flash];
+      const type = flash.includes('error') ? 'error' : hashTypes[flash];
 
       notify(message, type, { duration: 10000 });
     }

package/app/notify.js

@@ -6,7 +6,20 @@ import { sanitizeText } from '../utils/index';
 const notify = (message, type, config = {}) => {
   if (!message) return;
 
+  const customStyle = Homeflow.get('custom_toastify_styles') || null;
   const color = { error: '#dc3545' }[type] || '#28a745'; // default is success
+  let className = '';
+  let style = { background: color };
+
+  if (type === 'error' && customStyle !== null) {
+    className = `${customStyle.className} ${customStyle.className}-error`;
+    style = { ...customStyle.error };
+  }
+
+  if (type === 'success' && customStyle !== null) {
+    className = `${customStyle.className} ${customStyle.className}-success`;
+    style = { ...customStyle.success };
+  }
 
   Toastify({
     duration: 3000,
@@ -16,7 +29,8 @@ const notify = (message, type, config = {}) => {
     stopOnFocus: true,
     text: sanitizeText(message),
     escapeMarkup: false,
-    style: { background: color },
+    className,
+    style,
     ...config,
   }).showToast();
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "homeflowjs",
-  "version": "0.9.8",
+  "version": "0.9.11",
   "description": "JavaScript toolkit for Homeflow themes",
   "main": "index.js",
   "scripts": {

package/properties/save-property-button/save-property-button.component.jsx

@@ -1,6 +1,8 @@
 import React from 'react';
 import { connect } from 'react-redux';
 
+import PropTypes from 'prop-types';
+
 import { addSavedProperty, removeSavedProperty } from '../../actions/properties.actions';
 import notify from '../../app/notify';
 
@@ -14,9 +16,10 @@ const SavePropertyButton = (props) => {
     addSavedProperty,
     removeSavedProperty,
     style,
+    notificationMessage,
   } = props;
 
-  const isSaved = !!savedProperties.find(p => p.property_id === parseInt(propertyId, 10));
+  const isSaved = !!savedProperties.find((p) => p.property_id === parseInt(propertyId, 10));
 
   const toggleProperty = (e) => {
     e.preventDefault();
@@ -24,14 +27,15 @@ const SavePropertyButton = (props) => {
 
     if (isSaved) {
       removeSavedProperty(propertyId);
-      notify('Saved property removed.', 'success');
+      notify(notificationMessage || 'Saved property removed.', 'success');
     } else {
       addSavedProperty(propertyId);
-      notify('Property saved.', 'success');
+      notify(notificationMessage || 'Property saved.', 'success');
     }
   };
 
   return (
+    // eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/anchor-is-valid
     <a
       style={style}
       onClick={toggleProperty}
@@ -42,8 +46,23 @@ const SavePropertyButton = (props) => {
   );
 };
 
+SavePropertyButton.propTypes = {
+  propertyId: PropTypes.number.isRequired,
+  savedProperties: PropTypes.array,
+  notificationMessage: PropTypes.string,
+  className: PropTypes.string,
+  style: PropTypes.object,
+  UnsavedComponent: PropTypes.element.isRequired,
+  SavedComponent: PropTypes.element.isRequired,
+  addSavedProperty: PropTypes.func.isRequired,
+  removeSavedProperty: PropTypes.func.isRequired,
+};
+
 SavePropertyButton.defaultProps = {
   savedProperties: [],
+  notificationMessage: null,
+  className: '',
+  style: {},
 };
 
 const mapStateToProps = (state) => ({

package/search/save-search-button/save-search-button.component.jsx

@@ -1,6 +1,8 @@
 import React from 'react';
 import { connect } from 'react-redux';
 
+import PropTypes from 'prop-types';
+
 import { addSavedSearchAsync, removeSavedSearchAsync } from '../../actions/search.actions';
 import { findSavedSearch } from '../../utils';
 import notify from '../../app/notify';
@@ -9,12 +11,14 @@ const SaveSearchButton = (props) => {
   const {
     search,
     className,
-    savedSearches = [],
+    savedSearches,
     UnsavedComponent,
     SavedComponent,
     addSavedSearchAsync,
     removeSavedSearchAsync,
     style,
+    notificationMessage,
+    showNotification,
   } = props;
 
   const savedSearch = findSavedSearch(savedSearches, search);
@@ -22,17 +26,17 @@ const SaveSearchButton = (props) => {
   const toggleSearch = (e) => {
     e.preventDefault();
 
-
     if (savedSearch) {
       removeSavedSearchAsync(savedSearch);
-      notify('Saved search removed.', 'success');
+      notify((showNotification && notificationMessage) ? notificationMessage : 'Saved search removed.', 'success');
     } else {
       addSavedSearchAsync(search);
-      notify('Search saved.', 'success');
+      notify(notificationMessage || 'Search saved.', 'success');
     }
-  }
+  };
 
   return (
+    // eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/anchor-is-valid
     <a
       style={style}
       onClick={toggleSearch}
@@ -43,7 +47,28 @@ const SaveSearchButton = (props) => {
   );
 };
 
-const mapStateToProps = state => ({
+SaveSearchButton.propTypes = {
+  search: PropTypes.object.isRequired,
+  className: PropTypes.string,
+  savedSearches: PropTypes.array,
+  UnsavedComponent: PropTypes.element.isRequired,
+  SavedComponent: PropTypes.element.isRequired,
+  addSavedSearchAsync: PropTypes.func.isRequired,
+  removeSavedSearchAsync: PropTypes.func.isRequired,
+  style: PropTypes.object,
+  notificationMessage: PropTypes.string,
+  showNotification: PropTypes.bool,
+};
+
+SaveSearchButton.defaultProps = {
+  savedSearches: [],
+  notificationMessage: null,
+  className: '',
+  style: {},
+  showNotification: false,
+};
+
+const mapStateToProps = (state) => ({
   search: state.search.currentSearch,
   savedSearches: state.search.savedSearches,
 });