homeflowjs 1.0.87 → 1.0.89
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/hooks/use-search-from-fragment.js +6 -2
- package/modal/modal.component.jsx +2 -2
- package/package.json +1 -1
- package/user/change-password-form/change-password-form.component.jsx +81 -1
- package/user/default-profile/account/account-edit.component.jsx +60 -58
- package/user/default-profile/account/account.component.jsx +8 -1
- package/user/default-profile/user-profile/user-profile-modal.component.jsx +2 -2
|
@@ -6,6 +6,7 @@ const useSearchFromFragment = ({
|
|
|
6
6
|
channel = 'sales',
|
|
7
7
|
count = 6, // page size
|
|
8
8
|
placeId,
|
|
9
|
+
branchId,
|
|
9
10
|
pageNumber,
|
|
10
11
|
}) => {
|
|
11
12
|
const [foundProperties, setFoundProperties] = useState(null);
|
|
@@ -16,7 +17,10 @@ const useSearchFromFragment = ({
|
|
|
16
17
|
const searchUrl = useCallback(() => {
|
|
17
18
|
let buildUrl = `/search.ljson?channel=${channel}`;
|
|
18
19
|
|
|
19
|
-
if (placeId) buildUrl += `&place_id=${placeId}`;
|
|
20
|
+
if (placeId && !branchId) buildUrl += `&place_id=${placeId}`;
|
|
21
|
+
|
|
22
|
+
if (!placeId && branchId) buildUrl += `&branch_id=${branchId}`;
|
|
23
|
+
|
|
20
24
|
if (count) buildUrl += `&count=${count}`;
|
|
21
25
|
|
|
22
26
|
buildUrl += `&fragment=${fragment}`;
|
|
@@ -24,7 +28,7 @@ const useSearchFromFragment = ({
|
|
|
24
28
|
if (pageNumber) buildUrl += `/page-${pageNumber}`;
|
|
25
29
|
|
|
26
30
|
return buildUrl;
|
|
27
|
-
}, [pageNumber]);
|
|
31
|
+
}, [pageNumber, placeId, branchId]);
|
|
28
32
|
|
|
29
33
|
useEffect(() => {
|
|
30
34
|
const findProperties = async () => {
|
|
@@ -38,7 +38,7 @@ const ModalBackground = ({ children }) => (
|
|
|
38
38
|
</div>
|
|
39
39
|
);
|
|
40
40
|
|
|
41
|
-
const Modal = ({ withUserModal, children }) => {
|
|
41
|
+
const Modal = ({ withUserModal, withPasswordChange, children }) => {
|
|
42
42
|
const modals = React.Children.map(children, (element, index) => {
|
|
43
43
|
if (!React.isValidElement(element)) return null;
|
|
44
44
|
|
|
@@ -65,7 +65,7 @@ const Modal = ({ withUserModal, children }) => {
|
|
|
65
65
|
path="/user"
|
|
66
66
|
render={({ location }) => (
|
|
67
67
|
<ModalBackground>
|
|
68
|
-
<LazyUserProfile />
|
|
68
|
+
<LazyUserProfile withPasswordChange={withPasswordChange} />
|
|
69
69
|
</ModalBackground>
|
|
70
70
|
)}
|
|
71
71
|
/>,
|
package/package.json
CHANGED
|
@@ -6,6 +6,7 @@ import notify from '../../app/notify';
|
|
|
6
6
|
const ERROR_MESSAGE = 'Something went wrong updating your password. Please try again later.';
|
|
7
7
|
|
|
8
8
|
const ChangePasswordForm = ({
|
|
9
|
+
accountEditType,
|
|
9
10
|
classNames,
|
|
10
11
|
onSuccessCallback,
|
|
11
12
|
onErrorCallback,
|
|
@@ -199,7 +200,84 @@ const ChangePasswordForm = ({
|
|
|
199
200
|
|
|
200
201
|
const loadingClassName = formData.loading ? changePasswordClassNames.buttonLoadingClassName : '';
|
|
201
202
|
|
|
202
|
-
return (
|
|
203
|
+
return accountEditType ? (
|
|
204
|
+
<div className="account-edit-password">
|
|
205
|
+
<h3 role="heading">Edit Your Password</h3>
|
|
206
|
+
<form className="profile-edit-form" onSubmit={(e) => handleSubmit(e)}>
|
|
207
|
+
<fieldset>
|
|
208
|
+
<div className="profile-edit-form__group">
|
|
209
|
+
<input
|
|
210
|
+
id="user-input-current_password"
|
|
211
|
+
type="password"
|
|
212
|
+
name="current_password"
|
|
213
|
+
value={formData.current_password}
|
|
214
|
+
onChange={(e) => handleInputs(e)}
|
|
215
|
+
required
|
|
216
|
+
{...(formData.loading && {
|
|
217
|
+
disabled: true,
|
|
218
|
+
})}
|
|
219
|
+
/>
|
|
220
|
+
<label
|
|
221
|
+
htmlFor="user-input-current_password"
|
|
222
|
+
className={formData.current_password ? 'shrink' : ''}
|
|
223
|
+
>
|
|
224
|
+
Current password
|
|
225
|
+
</label>
|
|
226
|
+
</div>
|
|
227
|
+
<div className="profile-edit-form__group">
|
|
228
|
+
<input
|
|
229
|
+
id="user-input-new_password"
|
|
230
|
+
type="password"
|
|
231
|
+
name="new_password"
|
|
232
|
+
value={formData.new_password}
|
|
233
|
+
onChange={(e) => handleInputs(e)}
|
|
234
|
+
required
|
|
235
|
+
{...(formData.loading && {
|
|
236
|
+
disabled: true,
|
|
237
|
+
})}
|
|
238
|
+
/>
|
|
239
|
+
<label
|
|
240
|
+
htmlFor="user-input-new_password"
|
|
241
|
+
className={formData.new_password ? 'shrink' : ''}
|
|
242
|
+
>
|
|
243
|
+
New password
|
|
244
|
+
</label>
|
|
245
|
+
</div>
|
|
246
|
+
<div className="profile-edit-form__group">
|
|
247
|
+
<input
|
|
248
|
+
id="user-input-new_password_confirmation"
|
|
249
|
+
type="password"
|
|
250
|
+
name="new_password_confirmation"
|
|
251
|
+
value={formData.new_password_confirmation}
|
|
252
|
+
onChange={(e) => handleInputs(e)}
|
|
253
|
+
required
|
|
254
|
+
{...(formData.loading && {
|
|
255
|
+
disabled: true,
|
|
256
|
+
})}
|
|
257
|
+
/>
|
|
258
|
+
<label
|
|
259
|
+
htmlFor="user-input-new_password_confirmation"
|
|
260
|
+
className={formData.new_password_confirmation ? 'shrink' : ''}
|
|
261
|
+
>
|
|
262
|
+
Repeat new password
|
|
263
|
+
</label>
|
|
264
|
+
</div>
|
|
265
|
+
<button
|
|
266
|
+
className="profile-edit-form__submit"
|
|
267
|
+
type="submit"
|
|
268
|
+
{...(formData.loading && {
|
|
269
|
+
disabled: true,
|
|
270
|
+
})}
|
|
271
|
+
>
|
|
272
|
+
<span>
|
|
273
|
+
{(Loader && formData.loading) && <Loader className="small" />}
|
|
274
|
+
{formData.loading ? submitTextSubmitting : submitText}
|
|
275
|
+
</span>
|
|
276
|
+
</button>
|
|
277
|
+
</fieldset>
|
|
278
|
+
</form>
|
|
279
|
+
</div>
|
|
280
|
+
) : (
|
|
203
281
|
<div className={changePasswordClassNames.formWrapperClassName}>
|
|
204
282
|
<form
|
|
205
283
|
className={changePasswordClassNames.formClassName}
|
|
@@ -262,6 +340,7 @@ const ChangePasswordForm = ({
|
|
|
262
340
|
};
|
|
263
341
|
|
|
264
342
|
ChangePasswordForm.propTypes = {
|
|
343
|
+
accountEditType: PropTypes.bool,
|
|
265
344
|
classNames: PropTypes.shape({
|
|
266
345
|
formWrapperClassName: PropTypes.string,
|
|
267
346
|
formClassName: PropTypes.string,
|
|
@@ -282,6 +361,7 @@ ChangePasswordForm.propTypes = {
|
|
|
282
361
|
};
|
|
283
362
|
|
|
284
363
|
ChangePasswordForm.defaultProps = {
|
|
364
|
+
accountEditType: false,
|
|
285
365
|
classNames: {
|
|
286
366
|
formWrapperClassName: '',
|
|
287
367
|
formClassName: '',
|
|
@@ -1,77 +1,79 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { connect } from 'react-redux';
|
|
3
3
|
import PropTypes from 'prop-types';
|
|
4
|
-
|
|
5
4
|
import UserEditForm from '../../user-edit-form/user-edit-form.component';
|
|
5
|
+
import ChangePasswordForm from '../../change-password-form/change-password-form.component';
|
|
6
6
|
import UserInput from '../../user-input/user-input.component';
|
|
7
7
|
import Loader from '../../../shared/loader.component';
|
|
8
8
|
|
|
9
|
-
const AccountEdit = ({ localUser, toggleEdit, updating }) => (
|
|
10
|
-
|
|
11
|
-
<
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
9
|
+
const AccountEdit = ({ localUser, toggleEdit, updating, withPasswordChange = false }) => (
|
|
10
|
+
<>
|
|
11
|
+
<div className="account-edit">
|
|
12
|
+
<h3 role="heading">Edit Your Profile</h3>
|
|
13
|
+
<UserEditForm className="profile-edit-form" callback={toggleEdit}>
|
|
14
|
+
<fieldset>
|
|
15
|
+
<div className="profile-edit-form__group">
|
|
16
|
+
<UserInput name="first_name" required />
|
|
17
|
+
<label htmlFor="user-input-first_name" className={localUser.first_name ? 'shrink' : ''}>First name</label>
|
|
18
|
+
</div>
|
|
19
19
|
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
20
|
+
<div className="profile-edit-form__group">
|
|
21
|
+
<UserInput name="last_name" required />
|
|
22
|
+
<label htmlFor="user-input-last_name" className={localUser.last_name ? 'shrink' : ''}>Last name</label>
|
|
23
|
+
</div>
|
|
24
24
|
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
25
|
+
<div className="profile-edit-form__group">
|
|
26
|
+
<UserInput name="email" required />
|
|
27
|
+
<label htmlFor="user-input-email" className={localUser.email ? 'shrink' : ''}>Email</label>
|
|
28
|
+
</div>
|
|
29
29
|
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
30
|
+
<div className="profile-edit-form__group">
|
|
31
|
+
<UserInput name="tel_home" pattern="^[+]?[0-9]{9,12}$" required />
|
|
32
|
+
<label htmlFor="user-input-tel_home" className={localUser.tel_home ? 'shrink' : ''}>Phone</label>
|
|
33
|
+
</div>
|
|
34
34
|
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
35
|
+
<div className="profile-edit-form__group">
|
|
36
|
+
<UserInput name="street_address" />
|
|
37
|
+
<label htmlFor="user-input-street_address" className={localUser.street_address ? 'shrink' : ''}>Street Address</label>
|
|
38
|
+
</div>
|
|
39
39
|
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
40
|
+
<div className="profile-edit-form__group">
|
|
41
|
+
<UserInput name="town" />
|
|
42
|
+
<label htmlFor="user-input-town" className={localUser.town ? 'shrink' : ''}>Town</label>
|
|
43
|
+
</div>
|
|
44
44
|
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
45
|
+
<div className="profile-edit-form__group">
|
|
46
|
+
<UserInput name="county" />
|
|
47
|
+
<label htmlFor="user-input-county" className={localUser.county ? 'shrink' : ''}>County</label>
|
|
48
|
+
</div>
|
|
49
49
|
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
50
|
+
<div className="profile-edit-form__group">
|
|
51
|
+
<UserInput name="postcode" />
|
|
52
|
+
<label htmlFor="user-input-postcode" className={localUser.postcode ? 'shrink' : ''}>Postcode</label>
|
|
53
|
+
</div>
|
|
54
54
|
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
55
|
+
<button
|
|
56
|
+
className="profile-edit-form__submit"
|
|
57
|
+
type="submit"
|
|
58
|
+
disabled={updating}
|
|
59
|
+
>
|
|
60
|
+
<span>
|
|
61
|
+
{updating ? <Loader className="small" /> : 'Update'}
|
|
62
|
+
</span>
|
|
63
|
+
</button>
|
|
64
64
|
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
65
|
+
<button
|
|
66
|
+
type="button"
|
|
67
|
+
className="profile-edit-form__cancel"
|
|
68
|
+
onClick={toggleEdit}
|
|
69
|
+
>
|
|
70
|
+
Cancel
|
|
71
|
+
</button>
|
|
72
|
+
</fieldset>
|
|
73
|
+
</UserEditForm>
|
|
74
|
+
</div>
|
|
75
|
+
{withPasswordChange && <ChangePasswordForm accountEditType />}
|
|
76
|
+
</>
|
|
75
77
|
);
|
|
76
78
|
|
|
77
79
|
AccountEdit.propTypes = {
|
|
@@ -48,7 +48,14 @@ class Account extends Component {
|
|
|
48
48
|
)
|
|
49
49
|
}
|
|
50
50
|
|
|
51
|
-
if (edit)
|
|
51
|
+
if (edit) {
|
|
52
|
+
return (
|
|
53
|
+
<AccountEdit
|
|
54
|
+
toggleEdit={this.toggleEdit}
|
|
55
|
+
withPasswordChange={this.props.withPasswordChange}
|
|
56
|
+
/>
|
|
57
|
+
);
|
|
58
|
+
}
|
|
52
59
|
|
|
53
60
|
return (
|
|
54
61
|
<div className="account-tab">
|
|
@@ -24,7 +24,7 @@ import './user-profile.styles.scss';
|
|
|
24
24
|
|
|
25
25
|
// TODO: Add forgotten password tab
|
|
26
26
|
|
|
27
|
-
const UserProfileModal = ({ currentUser, loading }) => {
|
|
27
|
+
const UserProfileModal = ({ currentUser, loading, withPasswordChange }) => {
|
|
28
28
|
if (loading) {
|
|
29
29
|
return (
|
|
30
30
|
<div style={loadingStyles}>
|
|
@@ -117,7 +117,7 @@ const UserProfileModal = ({ currentUser, loading }) => {
|
|
|
117
117
|
</Route>
|
|
118
118
|
|
|
119
119
|
<Route path="/user">
|
|
120
|
-
<Account />
|
|
120
|
+
<Account withPasswordChange={withPasswordChange} />
|
|
121
121
|
</Route>
|
|
122
122
|
</Switch>
|
|
123
123
|
</Router>
|