@@ -12,10 +12,13 @@ import { InputSkin } from 'react-polymorph/lib/skins/simple/InputSkin';
1212import SVGInline from 'react-svg-inline' ;
1313import classNames from 'classnames' ;
1414import styles from './WalletImportFileDialog.scss' ;
15+ import RadioSet from '../../widgets/RadioSet' ;
1516import DialogCloseButton from '../../widgets/DialogCloseButton' ;
1617import closeCrossThin from '../../../assets/images/close-cross-thin.inline.svg' ;
1718import penIcon from '../../../assets/images/pen.inline.svg' ;
1819import LoadingSpinner from '../../widgets/LoadingSpinner' ;
20+ import { ImportFromOptions } from '../../../types/walletExportTypes' ;
21+ import type { ImportFromOption } from '../../../types/walletExportTypes' ;
1922
2023const messages = defineMessages ( {
2124 title : {
@@ -35,18 +38,30 @@ const messages = defineMessages({
3538 defaultMessage : '!!!Select Daedalus state folder:' ,
3639 description : 'Select Daedalus state folder:' ,
3740 } ,
41+ secretFileLabel : {
42+ id : 'wallet.import.file.dialog.secretFileLabel' ,
43+ defaultMessage : "!!!Select Daedalus 'secret.key' file:" ,
44+ description : "Select Daedalus 'secret.key' file:" ,
45+ } ,
3846 buttonLabel : {
3947 id : 'wallet.import.file.dialog.buttonLabel' ,
4048 defaultMessage : '!!!Import wallets' ,
4149 description : 'Import wallets' ,
4250 } ,
43- noWallets : {
44- id : 'wallet.import.file.dialog.noWallets ' ,
51+ stateDirNoWallets : {
52+ id : 'wallet.import.file.dialog.stateDirNoWallets ' ,
4553 defaultMessage :
4654 '!!!No wallets found. Make sure you have selected a Daedalus state directory which contains the ‘Secrets’ or `Secrets-1.0` folder with a `secret.key` file inside.' ,
4755 description :
4856 'No wallets found. Make sure you have selected a Daedalus state directory which contains the ‘Secrets’ or `Secrets-1.0` folder with a `secret.key` file inside.' ,
4957 } ,
58+ secretFileNoWallets : {
59+ id : 'wallet.import.file.dialog.secretFileNoWallets' ,
60+ defaultMessage :
61+ '!!!No wallets found. Make sure you have selected a valid `secret.key` file.' ,
62+ description :
63+ 'No wallets found. Make sure you have selected a valid `secret.key` file.' ,
64+ } ,
5065 linkLabel : {
5166 id : 'wallet.import.file.dialog.linkLabel' ,
5267 defaultMessage : '!!!Learn more' ,
@@ -58,6 +73,21 @@ const messages = defineMessages({
5873 '!!!https://iohk.zendesk.com/hc/en-us/articles/900000623463' ,
5974 description : '"Learn more" link URL on the wallet import file dialog' ,
6075 } ,
76+ importFromLabel : {
77+ id : 'wallet.import.file.dialog.importFromLabel' ,
78+ defaultMessage : '!!!Import from:' ,
79+ description : 'Import from:' ,
80+ } ,
81+ stateDirOptionLabel : {
82+ id : 'wallet.import.file.dialog.stateDirOptionLabel' ,
83+ defaultMessage : '!!!Daedalus state directory' ,
84+ description : 'Daedalus state directory' ,
85+ } ,
86+ secretFileOptionLabel : {
87+ id : 'wallet.import.file.dialog.secretFileOptionLabel' ,
88+ defaultMessage : "!!!Daedalus 'secret.key' file" ,
89+ description : "Daedalus 'secret.key' file" ,
90+ } ,
6191} ) ;
6292
6393type Props = {
@@ -68,24 +98,48 @@ type Props = {
6898 onClose : Function ,
6999 onOpenExternalLink : Function ,
70100 onSelectExportSourcePath : Function ,
101+ onResetExportSourcePath : Function ,
71102 exportSourcePath : string ,
103+ defaultExportSourcePath : string ,
104+ } ;
105+
106+ type State = {
107+ importFrom : ImportFromOption ,
72108} ;
73109
74110@observer
75- export default class WalletImportFileDialog extends Component < Props > {
111+ export default class WalletImportFileDialog extends Component < Props , State > {
76112 static contextTypes = {
77113 intl : intlShape . isRequired ,
78114 } ;
79115
80- stateFolderInput : Input ;
116+ state = {
117+ importFrom : ImportFromOptions . STATE_DIR ,
118+ } ;
119+
120+ importPathInput : Input ;
81121
82122 componentWillMount ( ) {
83123 // Reset migration data
84124 this. props . onOpen ( ) ;
85125 }
86126
127+ onSetImportFromOption = ( importFrom : ImportFromOption ) => {
128+ if ( this . state . importFrom !== importFrom ) {
129+ this . props . onResetExportSourcePath ( ) ;
130+ this . setState ( { importFrom } ) ;
131+ }
132+ } ;
133+
134+ isImportFromStateDir = ( importFrom : ImportFromOption ) = >
135+ importFrom === ImportFromOptions . STATE_DIR ;
136+
137+ isImportFromSecretFile = ( importFrom : ImportFromOption ) =>
138+ importFrom === ImportFromOptions . SECRET_FILE ;
139+
87140 render ( ) {
88141 const { intl } = this . context ;
142+ const { importFrom } = this . state ;
89143 const {
90144 exportErrors,
91145 isSubmitting,
@@ -94,23 +148,27 @@ export default class WalletImportFileDialog extends Component<Props> {
94148 onOpenExternalLink,
95149 onSelectExportSourcePath,
96150 exportSourcePath,
151+ defaultExportSourcePath,
97152 } = this . props ;
98153 const title = intl . formatMessage ( messages . title ) ;
99154 const description = < FormattedHTMLMessage { ...messages . description } /> ;
100155 const stateFolderLabel = intl . formatMessage ( messages . stateFolderLabel ) ;
156+ const secretFileLabel = intl . formatMessage ( messages . secretFileLabel ) ;
101157 const buttonLabel = ! isSubmitting ? (
102158 intl . formatMessage ( messages . buttonLabel )
103159 ) : (
104160 < LoadingSpinner />
105161 ) ;
106162 const linkLabel = intl . formatMessage ( messages . linkLabel ) ;
107- const noWalletError = intl . formatMessage ( messages . noWallets ) ;
163+ const noWalletError = intl . formatMessage (
164+ messages [ `${ importFrom } ]
165+ ) ;
108166 const onLinkClick = ( ) =>
109167 onOpenExternalLink ( intl . formatMessage ( messages . linkUrl ) ) ;
110168
111169 const resetErrorCheck =
112- this . stateFolderInput &&
113- this . stateFolderInput . inputElement . current . value !== exportSourcePath ;
170+ this . importPathInput &&
171+ this . importPathInput . inputElement . current . value !== exportSourcePath ;
114172 const error = ! resetErrorCheck && exportErrors !== '' ;
115173
116174 const inputClasses = classNames ( [
@@ -119,7 +177,11 @@ export default class WalletImportFileDialog extends Component<Props> {
119177 ] ) ;
120178
121179 const buttonClasses = classNames ( styles . actionButton , [
122- isSubmitting || error ? styles . disabled : null ,
180+ isSubmitting ||
181+ error ||
182+ ( this . isImportFromSecretFile ( importFrom ) && ! exportSourcePath )
183+ ? styles . disabled
184+ : null ,
123185 ] ) ;
124186
125187 return (
@@ -141,39 +203,79 @@ export default class WalletImportFileDialog extends Component<Props> {
141203 < div className = { styles . content } >
142204 < div className = { styles . title } > { title } </ div >
143205 < div className = { styles . description } > { description } </ div >
206+
207+ < div className = { styles . radioButtons } >
208+ < RadioSet
209+ label = { intl . formatMessage ( messages . importFromLabel ) }
210+ items = { Object . keys ( ImportFromOptions ) . map ( ( key : string ) => {
211+ const importFromOption : ImportFromOption =
212+ ImportFromOptions [ key ] ;
213+ return {
214+ key : importFromOption ,
215+ label : intl . formatMessage (
216+ messages [ `${ importFromOption } ]
217+ ) ,
218+ selected : importFrom === importFromOption ,
219+ onChange : ( ) =>
220+ this . onSetImportFromOption ( importFromOption ) ,
221+ } ;
222+ } ) }
223+ verticallyAligned
224+ />
225+ </ div >
226+
144227 < div className = { styles . stateFolderContainer } >
145- < p className = { styles . stateFolderLabel } > { stateFolderLabel } </ p >
228+ < p className = { styles . stateFolderLabel } >
229+ { this . isImportFromStateDir ( importFrom )
230+ ? stateFolderLabel
231+ : secretFileLabel }
232+ </ p >
146233 < div className = { styles . stateFolderInputWrapper } >
147234 < Input
148235 type = "text"
149236 className = { inputClasses }
150237 ref = { input => {
151- this . stateFolderInput = input ;
238+ this . importPathInput = input ;
152239 } }
153240 skin = { InputSkin }
154- value = { exportSourcePath }
241+ value = {
242+ exportSourcePath ||
243+ ( this . isImportFromStateDir ( importFrom )
244+ ? defaultExportSourcePath
245+ : '' )
246+ }
247+ placeholder = {
248+ this . isImportFromStateDir ( importFrom )
249+ ? defaultExportSourcePath
250+ : 'secret.key'
251+ }
155252 />
156253 < Button
157254 className = { styles . selectStateDirectoryButton }
158- onClick = { onSelectExportSourcePath }
255+ onClick = { ( ) => onSelectExportSourcePath ( { importFrom } ) }
159256 label = { < SVGInline svg = { penIcon } className = { styles . penIcon } /> }
160257 skin = { ButtonSkin }
161258 />
162259 </ div >
163260 { error && < p className = { styles . noWalletError } > { noWalletError } </ p > }
164261 </ div >
262+
165263 < div className = { styles . action } >
166264 < Button
167265 className = { buttonClasses }
168- disabled = { isSubmitting || error }
266+ disabled = {
267+ isSubmitting ||
268+ error ||
269+ ( this . isImportFromSecretFile ( importFrom ) && ! exportSourcePath )
270+ }
169271 label = { buttonLabel }
170272 onClick = { onConfirm }
171273 skin = { ButtonSkin }
172274 />
173275 </ div >
276+
174277 < Link
175278 className = { styles . learnMoreLink }
176- disabled = { isSubmitting }
177279 onClick = { onLinkClick }
178280 label = { linkLabel }
179281 skin = { LinkSkin }
0 commit comments