1
1
<template >
2
2
<div >
3
- <div class =" form-group" >
4
- <label >
5
- Enter your AWS Access Key <a href =" http://docs.aws.amazon.com/general/latest/gr/managing-aws-access-keys.html" title =" http://docs.aws.amazon.com/general/latest/gr/managing-aws-access-keys.html" target =" _blank" rel =" noreferrer noopener" class =" badge bagde-pill badge-primary" >?</a >
6
- <br >
7
- Note: Make sure to use an IAM user with an acceptable policy attached (see <a
8
- href =" https://github.com/trailofbits/algo/blob/master/docs/deploy-from-ansible.md" target =" _blank" rel =" noreferrer noopener" >docs</a >)
9
- </label >
10
- <input
11
- type =" text"
12
- class =" form-control"
13
- name =" aws_access_key"
14
- v-on:blur =" load_regions"
15
- v-model =" aws_access_key"
16
- />
3
+ <div v-if =" ui_config_error && ui_config_error === 'missing_boto'" class =" form-text alert alert-danger" role =" alert" >
4
+ Python module "boto3" is missing, please install it to proceed
17
5
</div >
18
- <div class =" form-group" >
19
- <label >Enter your AWS Secret Key <a
20
- href =" http://docs.aws.amazon.com/general/latest/gr/managing-aws-access-keys.html" title =" http://docs.aws.amazon.com/general/latest/gr/managing-aws-access-keys.html" target =" _blank" rel =" noreferrer noopener" class =" badge bagde-pill badge-primary" >?</a ></label >
21
- <input
22
- type =" password"
23
- class =" form-control"
24
- name =" aws_secret_key"
25
- v-on:blur =" load_regions"
26
- v-model =" aws_secret_key" >
6
+ <div v-if =" ui_env_secrets" class =" form-text alert alert-success" role =" alert" >
7
+ AWS credentials were read from the environment variables
27
8
</div >
28
- <div class =" form-group" >
29
- <label v-if =" lightsail_regions.length === 0" >Please enter Access key and Secret key to select region</label >
30
- <label v-if =" is_loading" >Loading regions...</label >
31
- <label v-if =" lightsail_regions.length > 0" >What region should the server be located in?</label >
32
- <select name =" region"
33
- class =" form-control"
34
- v-model =" region"
35
- v-bind:disabled =" is_region_disabled" >
36
- <option value disabled >Select region</option >
37
- <option
38
- v-for =" (region, i) in lightsail_regions"
39
- v-bind:key =" region.displayName"
40
- v-bind:value =" region.name"
41
- >{{region.displayName}}</option >
42
- </select >
43
-
9
+ <div v-else >
10
+ <div class =" form-group" >
11
+ <label >
12
+ Enter your AWS Access Key <a href =" http://docs.aws.amazon.com/general/latest/gr/managing-aws-access-keys.html" title =" http://docs.aws.amazon.com/general/latest/gr/managing-aws-access-keys.html" target =" _blank" rel =" noreferrer noopener" class =" badge bagde-pill badge-primary" >?</a >
13
+ <br >
14
+ Note: Make sure to use an IAM user with an acceptable policy attached (see <a
15
+ href =" https://github.com/trailofbits/algo/blob/master/docs/deploy-from-ansible.md" target =" _blank" rel =" noreferrer noopener" >docs</a >)
16
+ </label >
17
+ <input
18
+ type =" text"
19
+ class =" form-control"
20
+ name =" aws_access_key"
21
+ v-on:blur =" load_regions"
22
+ v-model =" aws_access_key"
23
+ />
24
+ </div >
25
+ <div class =" form-group" >
26
+ <label >Enter your AWS Secret Key <a
27
+ href =" http://docs.aws.amazon.com/general/latest/gr/managing-aws-access-keys.html" title =" http://docs.aws.amazon.com/general/latest/gr/managing-aws-access-keys.html" target =" _blank" rel =" noreferrer noopener" class =" badge bagde-pill badge-primary" >?</a ></label >
28
+ <input
29
+ type =" password"
30
+ class =" form-control"
31
+ name =" aws_secret_key"
32
+ v-on:blur =" load_regions"
33
+ v-model =" aws_secret_key" >
34
+ </div >
44
35
</div >
36
+ <region-select v-model =" region"
37
+ v-bind:options =" ui_region_options"
38
+ v-bind:loading =" ui_loading_check || ui_loading_regions"
39
+ v-bind:error =" ui_region_error" >
40
+ </region-select >
45
41
<button class =" btn btn-primary"
46
42
type =" button"
47
43
v-on:click =" submit"
@@ -58,48 +54,93 @@ module.exports = {
58
54
aws_access_key: null ,
59
55
aws_secret_key: null ,
60
56
region: null ,
61
- lightsail_regions: [],
62
- is_loading: false
57
+ // ui helpoer variables
58
+ ui_region_options: [],
59
+ ui_env_secrets: null ,
60
+ ui_loading_check: false ,
61
+ ui_loading_regions: false ,
62
+ ui_config_error: null ,
63
+ ui_region_error: null
63
64
};
64
65
},
65
66
computed: {
66
- is_valid () {
67
- return this .aws_access_key && this .aws_secret_key && this .region ;
67
+ has_secrets () {
68
+ return this .ui_env_secrets || ( this .aws_access_key && this .aws_secret_key ) ;
68
69
},
69
- is_region_disabled () {
70
- return ! ( this .aws_access_key && this .aws_secret_key ) || this . is_loading ;
70
+ is_valid () {
71
+ return this .has_secrets && this .region ;
71
72
}
72
73
},
74
+ created : function () {
75
+ this .check_config ();
76
+ },
73
77
methods: {
78
+ check_config () {
79
+ this .ui_loading_check = true ;
80
+ fetch (" /aws_config" )
81
+ .then (r => {
82
+ if (r .status === 200 || r .status === 400 ) {
83
+ return r .json ();
84
+ }
85
+ throw new Error (r .status );
86
+ })
87
+ .then (response => {
88
+ if (response .has_secret ) {
89
+ this .ui_env_secrets = true ;
90
+ this .load_regions ();
91
+ } else if (response .error ) {
92
+ this .ui_config_error = response .error ;
93
+ }
94
+ })
95
+ .finally (() => {
96
+ this .ui_loading_check = false ;
97
+ });
98
+ },
74
99
load_regions () {
75
- if (this .aws_access_key && this .aws_secret_key && this .lightsail_regions .length === 0 ) {
76
- this .is_loading = true ;
100
+ if (this .has_secrets && this .ui_region_options .length === 0 ) {
101
+ this .ui_loading_regions = true ;
102
+ this .ui_region_error = false ;
103
+ const payload = this .ui_env_secrets ? {} : {
104
+ aws_access_key: this .aws_access_key ,
105
+ aws_secret_key: this .aws_secret_key
106
+ }
77
107
fetch (' /lightsail_regions' , {
78
108
method: ' post' ,
79
109
headers: {
80
110
' Content-Type' : ' application/json'
81
111
},
82
- body: JSON .stringify ({
83
- aws_access_key: this .aws_access_key ,
84
- aws_secret_key: this .aws_secret_key
85
- })
112
+ body: JSON .stringify (payload)
113
+ })
114
+ .then ((r ) => {
115
+ if (r .status === 200 ) {
116
+ return r .json ();
117
+ }
118
+ throw new Error (r .status );
86
119
})
87
- .then (r => r .json ())
88
120
.then (data => {
89
- this .lightsail_regions = data .regions ;
121
+ this .ui_region_options = data .regions .map (i => ({key: i .name , value: i .displayName }));
122
+ })
123
+ .catch ((err ) => {
124
+ this .ui_region_error = err;
90
125
})
91
126
.finally (() => {
92
- this .is_loading = false ;
127
+ this .ui_loading_regions = false ;
93
128
});
94
129
}
95
130
},
96
131
submit () {
97
- this .$emit (' submit' , {
98
- aws_access_key: this .aws_access_key ,
99
- aws_secret_key: this .aws_secret_key ,
132
+ let submit_value = {
100
133
region: this .region
101
- });
134
+ }
135
+ if (! this .ui_env_secrets ) {
136
+ submit_value[' aws_access_key' ] = this .aws_access_key ;
137
+ submit_value[' aws_secret_key' ] = this .aws_secret_key ;
138
+ }
139
+ this .$emit (' submit' , submit_value);
102
140
}
141
+ },
142
+ components: {
143
+ " region-select" : window .httpVueLoader (" /static/region-select.vue" ),
103
144
}
104
145
};
105
146
</script >
0 commit comments