Merge pull request #61 from Mikunj/feature/profile-nickname
Added profile sharing and setting nicknames.pull/65/head
commit
f900fc496d
@ -0,0 +1,35 @@
|
|||||||
|
/* global storage, _ */
|
||||||
|
/* global storage: false */
|
||||||
|
|
||||||
|
/* eslint-disable more/no-then */
|
||||||
|
|
||||||
|
// eslint-disable-next-line func-names
|
||||||
|
(function() {
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
window.Whisper = window.Whisper || {};
|
||||||
|
|
||||||
|
const PROFILE_ID = 'local-profile';
|
||||||
|
|
||||||
|
storage.getLocalProfile = () => {
|
||||||
|
const profile = storage.get(PROFILE_ID, null);
|
||||||
|
return profile;
|
||||||
|
}
|
||||||
|
|
||||||
|
storage.saveLocalProfile = async (profile) => {
|
||||||
|
const storedProfile = storage.get(PROFILE_ID, null);
|
||||||
|
|
||||||
|
// Only store the profile if we have a different object
|
||||||
|
if (storedProfile && _.isEqual(storedProfile, profile)) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
window.log.info('saving local profile ', profile);
|
||||||
|
await storage.put(PROFILE_ID, profile);
|
||||||
|
}
|
||||||
|
|
||||||
|
storage.removeLocalProfile = async () => {
|
||||||
|
window.log.info('removing local profile');
|
||||||
|
await storage.remove(PROFILE_ID);
|
||||||
|
}
|
||||||
|
})();
|
@ -0,0 +1,97 @@
|
|||||||
|
/* global Whisper, i18n, _ */
|
||||||
|
|
||||||
|
// eslint-disable-next-line func-names
|
||||||
|
(function() {
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
window.Whisper = window.Whisper || {};
|
||||||
|
|
||||||
|
Whisper.NicknameDialogView = Whisper.View.extend({
|
||||||
|
className: 'nickname-dialog modal',
|
||||||
|
templateName: 'nickname-dialog',
|
||||||
|
initialize(options) {
|
||||||
|
this.message = options.message;
|
||||||
|
this.name = options.name || '';
|
||||||
|
|
||||||
|
this.resolve = options.resolve;
|
||||||
|
this.okText = options.okText || i18n('ok');
|
||||||
|
|
||||||
|
this.reject = options.reject;
|
||||||
|
this.cancelText = options.cancelText || i18n('cancel');
|
||||||
|
|
||||||
|
this.clear = options.clear;
|
||||||
|
this.clearText = options.clearText || i18n('clear');
|
||||||
|
|
||||||
|
this.title = options.title;
|
||||||
|
|
||||||
|
this.render();
|
||||||
|
|
||||||
|
this.$input = this.$('input');
|
||||||
|
this.$input.val(this.name);
|
||||||
|
this.$input.focus();
|
||||||
|
|
||||||
|
this.validateNickname();
|
||||||
|
},
|
||||||
|
events: {
|
||||||
|
keyup: 'onKeyup',
|
||||||
|
'click .ok': 'ok',
|
||||||
|
'click .cancel': 'cancel',
|
||||||
|
'click .clear': 'clear',
|
||||||
|
change: 'validateNickname',
|
||||||
|
},
|
||||||
|
validateNickname() {
|
||||||
|
const nickname = this.$input.val();
|
||||||
|
|
||||||
|
if (_.isEmpty(nickname)) {
|
||||||
|
this.$('.clear').hide();
|
||||||
|
} else {
|
||||||
|
this.$('.clear').show();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
render_attributes() {
|
||||||
|
return {
|
||||||
|
message: this.message,
|
||||||
|
showCancel: !this.hideCancel,
|
||||||
|
cancel: this.cancelText,
|
||||||
|
ok: this.okText,
|
||||||
|
clear: this.clearText,
|
||||||
|
title: this.title,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
ok() {
|
||||||
|
const nickname = this.$input.val().trim();
|
||||||
|
|
||||||
|
this.remove();
|
||||||
|
if (this.resolve) {
|
||||||
|
this.resolve(nickname);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
cancel() {
|
||||||
|
this.remove();
|
||||||
|
if (this.reject) {
|
||||||
|
this.reject();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
clear() {
|
||||||
|
this.$input.val('').trigger('change');
|
||||||
|
},
|
||||||
|
onKeyup(event) {
|
||||||
|
this.validateNickname();
|
||||||
|
switch (event.key) {
|
||||||
|
case 'Enter':
|
||||||
|
this.ok();
|
||||||
|
break;
|
||||||
|
case 'Escape':
|
||||||
|
case 'Esc':
|
||||||
|
this.cancel();
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
event.preventDefault();
|
||||||
|
},
|
||||||
|
focusCancel() {
|
||||||
|
this.$('.cancel').focus();
|
||||||
|
},
|
||||||
|
});
|
||||||
|
})();
|
@ -0,0 +1,38 @@
|
|||||||
|
import React from 'react';
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
identityKey: string;
|
||||||
|
name?: string;
|
||||||
|
onEditProfile: () => void;
|
||||||
|
}
|
||||||
|
|
||||||
|
export class IdentityKeyHeader extends React.Component<Props> {
|
||||||
|
public render() {
|
||||||
|
const {
|
||||||
|
name,
|
||||||
|
identityKey,
|
||||||
|
onEditProfile,
|
||||||
|
} = this.props;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className='identity-key-container'>
|
||||||
|
<div className='identity-key-text-container'>
|
||||||
|
<div>
|
||||||
|
Your identity key: <span className='identity-key_bold'>{identityKey}</span>
|
||||||
|
</div>
|
||||||
|
{!!name &&
|
||||||
|
<div>
|
||||||
|
Your display name: <span className='identity-key_bold'>{name}</span>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
id='editProfile'
|
||||||
|
role="button"
|
||||||
|
onClick={onEditProfile}
|
||||||
|
className="identity-key-wrapper__pencil-icon"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in New Issue