cdd-cli 3.1.9 → 3.2.0

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.
Files changed (45) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/coverage/clover.xml +604 -0
  3. package/coverage/coverage-final.json +17 -0
  4. package/coverage/lcov-report/base.css +224 -0
  5. package/coverage/lcov-report/block-navigation.js +87 -0
  6. package/coverage/lcov-report/favicon.png +0 -0
  7. package/coverage/lcov-report/helpers/constants.js.html +235 -0
  8. package/coverage/lcov-report/helpers/containerOptionsBuilder.js.html +211 -0
  9. package/coverage/lcov-report/helpers/dockerService/serviceComponents/containerActions.js.html +853 -0
  10. package/coverage/lcov-report/helpers/dockerService/serviceComponents/containerList.js.html +289 -0
  11. package/coverage/lcov-report/helpers/dockerService/serviceComponents/index.html +131 -0
  12. package/coverage/lcov-report/helpers/index.html +176 -0
  13. package/coverage/lcov-report/helpers/logger.js.html +424 -0
  14. package/coverage/lcov-report/helpers/safeCall.js.html +139 -0
  15. package/coverage/lcov-report/helpers/validationHelpers.js.html +394 -0
  16. package/coverage/lcov-report/hooks/creation/index.html +146 -0
  17. package/coverage/lcov-report/hooks/creation/useContainerActions.js.html +292 -0
  18. package/coverage/lcov-report/hooks/creation/useContainerCreation.js.html +478 -0
  19. package/coverage/lcov-report/hooks/creation/useLogsViewer.js.html +238 -0
  20. package/coverage/lcov-report/hooks/debug/index.html +116 -0
  21. package/coverage/lcov-report/hooks/debug/useDebugLogs.js.html +172 -0
  22. package/coverage/lcov-report/hooks/index.html +161 -0
  23. package/coverage/lcov-report/hooks/navigation/index.html +116 -0
  24. package/coverage/lcov-report/hooks/navigation/useContainerSelection.js.html +160 -0
  25. package/coverage/lcov-report/hooks/useContainerCommandRouter.js.html +415 -0
  26. package/coverage/lcov-report/hooks/useControls.js.html +685 -0
  27. package/coverage/lcov-report/hooks/useEraseConfirmation.js.html +202 -0
  28. package/coverage/lcov-report/hooks/useExitHandler.js.html +283 -0
  29. package/coverage/lcov-report/index.html +191 -0
  30. package/coverage/lcov-report/prettify.css +1 -0
  31. package/coverage/lcov-report/prettify.js +2 -0
  32. package/coverage/lcov-report/sort-arrow-sprite.png +0 -0
  33. package/coverage/lcov-report/sorter.js +210 -0
  34. package/coverage/lcov.info +1216 -0
  35. package/package.json +1 -1
  36. package/src/helpers/constants.js +20 -0
  37. package/src/helpers/dockerService/serviceComponents/containerActions.js +55 -8
  38. package/src/helpers/validationHelpers.js +75 -18
  39. package/src/hooks/creation/useContainerCreation.js +19 -4
  40. package/src/hooks/useControls.js +8 -3
  41. package/test/containerActions.test.js +104 -13
  42. package/test/containerOptionsBuilder.test.js +36 -0
  43. package/test/useContainerCreation.dom.test.js +43 -2
  44. package/test/useControls.dom.test.js +117 -0
  45. package/test/validationHelpers.test.js +51 -0
package/coverage/lcov-report/hooks/creation/useContainerCreation.js.html ADDED
@@ -0,0 +1,478 @@
1
+
2
+ <!doctype html>
3
+ <html lang="en">
4
+
5
+ <head>
6
+ <title>Code coverage report for hooks/creation/useContainerCreation.js</title>
7
+ <meta charset="utf-8" />
8
+ <link rel="stylesheet" href="../../prettify.css" />
9
+ <link rel="stylesheet" href="../../base.css" />
10
+ <link rel="shortcut icon" type="image/x-icon" href="../../favicon.png" />
11
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
12
+ <style type='text/css'>
13
+ .coverage-summary .sorter {
14
+ background-image: url(../../sort-arrow-sprite.png);
15
+ }
16
+ </style>
17
+ </head>
18
+
19
+ <body>
20
+ <div class='wrapper'>
21
+ <div class='pad1'>
22
+ <h1><a href="../../index.html">All files</a> / <a href="index.html">hooks/creation</a> useContainerCreation.js</h1>
23
+ <div class='clearfix'>
24
+
25
+ <div class='fl pad1y space-right2'>
26
+ <span class="strong">73.01% </span>
27
+ <span class="quiet">Statements</span>
28
+ <span class='fraction'>46/63</span>
29
+ </div>
30
+
31
+
32
+ <div class='fl pad1y space-right2'>
33
+ <span class="strong">88% </span>
34
+ <span class="quiet">Branches</span>
35
+ <span class='fraction'>22/25</span>
36
+ </div>
37
+
38
+
39
+ <div class='fl pad1y space-right2'>
40
+ <span class="strong">60% </span>
41
+ <span class="quiet">Functions</span>
42
+ <span class='fraction'>3/5</span>
43
+ </div>
44
+
45
+
46
+ <div class='fl pad1y space-right2'>
47
+ <span class="strong">72.58% </span>
48
+ <span class="quiet">Lines</span>
49
+ <span class='fraction'>45/62</span>
50
+ </div>
51
+
52
+
53
+ </div>
54
+ <p class="quiet">
55
+ Press <em>n</em> or <em>j</em> to go to the next uncovered block, <em>b</em>, <em>p</em> or <em>k</em> for the previous block.
56
+ </p>
57
+ <template id="filterTemplate">
58
+ <div class="quiet">
59
+ Filter:
60
+ <input type="search" id="fileSearch">
61
+ </div>
62
+ </template>
63
+ </div>
64
+ <div class='status-line medium'></div>
65
+ <pre><table class="coverage">
66
+ <tr><td class="line-count quiet"><a name='L1'></a><a href='#L1'>1</a>
67
+ <a name='L2'></a><a href='#L2'>2</a>
68
+ <a name='L3'></a><a href='#L3'>3</a>
69
+ <a name='L4'></a><a href='#L4'>4</a>
70
+ <a name='L5'></a><a href='#L5'>5</a>
71
+ <a name='L6'></a><a href='#L6'>6</a>
72
+ <a name='L7'></a><a href='#L7'>7</a>
73
+ <a name='L8'></a><a href='#L8'>8</a>
74
+ <a name='L9'></a><a href='#L9'>9</a>
75
+ <a name='L10'></a><a href='#L10'>10</a>
76
+ <a name='L11'></a><a href='#L11'>11</a>
77
+ <a name='L12'></a><a href='#L12'>12</a>
78
+ <a name='L13'></a><a href='#L13'>13</a>
79
+ <a name='L14'></a><a href='#L14'>14</a>
80
+ <a name='L15'></a><a href='#L15'>15</a>
81
+ <a name='L16'></a><a href='#L16'>16</a>
82
+ <a name='L17'></a><a href='#L17'>17</a>
83
+ <a name='L18'></a><a href='#L18'>18</a>
84
+ <a name='L19'></a><a href='#L19'>19</a>
85
+ <a name='L20'></a><a href='#L20'>20</a>
86
+ <a name='L21'></a><a href='#L21'>21</a>
87
+ <a name='L22'></a><a href='#L22'>22</a>
88
+ <a name='L23'></a><a href='#L23'>23</a>
89
+ <a name='L24'></a><a href='#L24'>24</a>
90
+ <a name='L25'></a><a href='#L25'>25</a>
91
+ <a name='L26'></a><a href='#L26'>26</a>
92
+ <a name='L27'></a><a href='#L27'>27</a>
93
+ <a name='L28'></a><a href='#L28'>28</a>
94
+ <a name='L29'></a><a href='#L29'>29</a>
95
+ <a name='L30'></a><a href='#L30'>30</a>
96
+ <a name='L31'></a><a href='#L31'>31</a>
97
+ <a name='L32'></a><a href='#L32'>32</a>
98
+ <a name='L33'></a><a href='#L33'>33</a>
99
+ <a name='L34'></a><a href='#L34'>34</a>
100
+ <a name='L35'></a><a href='#L35'>35</a>
101
+ <a name='L36'></a><a href='#L36'>36</a>
102
+ <a name='L37'></a><a href='#L37'>37</a>
103
+ <a name='L38'></a><a href='#L38'>38</a>
104
+ <a name='L39'></a><a href='#L39'>39</a>
105
+ <a name='L40'></a><a href='#L40'>40</a>
106
+ <a name='L41'></a><a href='#L41'>41</a>
107
+ <a name='L42'></a><a href='#L42'>42</a>
108
+ <a name='L43'></a><a href='#L43'>43</a>
109
+ <a name='L44'></a><a href='#L44'>44</a>
110
+ <a name='L45'></a><a href='#L45'>45</a>
111
+ <a name='L46'></a><a href='#L46'>46</a>
112
+ <a name='L47'></a><a href='#L47'>47</a>
113
+ <a name='L48'></a><a href='#L48'>48</a>
114
+ <a name='L49'></a><a href='#L49'>49</a>
115
+ <a name='L50'></a><a href='#L50'>50</a>
116
+ <a name='L51'></a><a href='#L51'>51</a>
117
+ <a name='L52'></a><a href='#L52'>52</a>
118
+ <a name='L53'></a><a href='#L53'>53</a>
119
+ <a name='L54'></a><a href='#L54'>54</a>
120
+ <a name='L55'></a><a href='#L55'>55</a>
121
+ <a name='L56'></a><a href='#L56'>56</a>
122
+ <a name='L57'></a><a href='#L57'>57</a>
123
+ <a name='L58'></a><a href='#L58'>58</a>
124
+ <a name='L59'></a><a href='#L59'>59</a>
125
+ <a name='L60'></a><a href='#L60'>60</a>
126
+ <a name='L61'></a><a href='#L61'>61</a>
127
+ <a name='L62'></a><a href='#L62'>62</a>
128
+ <a name='L63'></a><a href='#L63'>63</a>
129
+ <a name='L64'></a><a href='#L64'>64</a>
130
+ <a name='L65'></a><a href='#L65'>65</a>
131
+ <a name='L66'></a><a href='#L66'>66</a>
132
+ <a name='L67'></a><a href='#L67'>67</a>
133
+ <a name='L68'></a><a href='#L68'>68</a>
134
+ <a name='L69'></a><a href='#L69'>69</a>
135
+ <a name='L70'></a><a href='#L70'>70</a>
136
+ <a name='L71'></a><a href='#L71'>71</a>
137
+ <a name='L72'></a><a href='#L72'>72</a>
138
+ <a name='L73'></a><a href='#L73'>73</a>
139
+ <a name='L74'></a><a href='#L74'>74</a>
140
+ <a name='L75'></a><a href='#L75'>75</a>
141
+ <a name='L76'></a><a href='#L76'>76</a>
142
+ <a name='L77'></a><a href='#L77'>77</a>
143
+ <a name='L78'></a><a href='#L78'>78</a>
144
+ <a name='L79'></a><a href='#L79'>79</a>
145
+ <a name='L80'></a><a href='#L80'>80</a>
146
+ <a name='L81'></a><a href='#L81'>81</a>
147
+ <a name='L82'></a><a href='#L82'>82</a>
148
+ <a name='L83'></a><a href='#L83'>83</a>
149
+ <a name='L84'></a><a href='#L84'>84</a>
150
+ <a name='L85'></a><a href='#L85'>85</a>
151
+ <a name='L86'></a><a href='#L86'>86</a>
152
+ <a name='L87'></a><a href='#L87'>87</a>
153
+ <a name='L88'></a><a href='#L88'>88</a>
154
+ <a name='L89'></a><a href='#L89'>89</a>
155
+ <a name='L90'></a><a href='#L90'>90</a>
156
+ <a name='L91'></a><a href='#L91'>91</a>
157
+ <a name='L92'></a><a href='#L92'>92</a>
158
+ <a name='L93'></a><a href='#L93'>93</a>
159
+ <a name='L94'></a><a href='#L94'>94</a>
160
+ <a name='L95'></a><a href='#L95'>95</a>
161
+ <a name='L96'></a><a href='#L96'>96</a>
162
+ <a name='L97'></a><a href='#L97'>97</a>
163
+ <a name='L98'></a><a href='#L98'>98</a>
164
+ <a name='L99'></a><a href='#L99'>99</a>
165
+ <a name='L100'></a><a href='#L100'>100</a>
166
+ <a name='L101'></a><a href='#L101'>101</a>
167
+ <a name='L102'></a><a href='#L102'>102</a>
168
+ <a name='L103'></a><a href='#L103'>103</a>
169
+ <a name='L104'></a><a href='#L104'>104</a>
170
+ <a name='L105'></a><a href='#L105'>105</a>
171
+ <a name='L106'></a><a href='#L106'>106</a>
172
+ <a name='L107'></a><a href='#L107'>107</a>
173
+ <a name='L108'></a><a href='#L108'>108</a>
174
+ <a name='L109'></a><a href='#L109'>109</a>
175
+ <a name='L110'></a><a href='#L110'>110</a>
176
+ <a name='L111'></a><a href='#L111'>111</a>
177
+ <a name='L112'></a><a href='#L112'>112</a>
178
+ <a name='L113'></a><a href='#L113'>113</a>
179
+ <a name='L114'></a><a href='#L114'>114</a>
180
+ <a name='L115'></a><a href='#L115'>115</a>
181
+ <a name='L116'></a><a href='#L116'>116</a>
182
+ <a name='L117'></a><a href='#L117'>117</a>
183
+ <a name='L118'></a><a href='#L118'>118</a>
184
+ <a name='L119'></a><a href='#L119'>119</a>
185
+ <a name='L120'></a><a href='#L120'>120</a>
186
+ <a name='L121'></a><a href='#L121'>121</a>
187
+ <a name='L122'></a><a href='#L122'>122</a>
188
+ <a name='L123'></a><a href='#L123'>123</a>
189
+ <a name='L124'></a><a href='#L124'>124</a>
190
+ <a name='L125'></a><a href='#L125'>125</a>
191
+ <a name='L126'></a><a href='#L126'>126</a>
192
+ <a name='L127'></a><a href='#L127'>127</a>
193
+ <a name='L128'></a><a href='#L128'>128</a>
194
+ <a name='L129'></a><a href='#L129'>129</a>
195
+ <a name='L130'></a><a href='#L130'>130</a>
196
+ <a name='L131'></a><a href='#L131'>131</a>
197
+ <a name='L132'></a><a href='#L132'>132</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
198
+ <span class="cline-any cline-neutral">&nbsp;</span>
199
+ <span class="cline-any cline-neutral">&nbsp;</span>
200
+ <span class="cline-any cline-neutral">&nbsp;</span>
201
+ <span class="cline-any cline-neutral">&nbsp;</span>
202
+ <span class="cline-any cline-neutral">&nbsp;</span>
203
+ <span class="cline-any cline-neutral">&nbsp;</span>
204
+ <span class="cline-any cline-neutral">&nbsp;</span>
205
+ <span class="cline-any cline-neutral">&nbsp;</span>
206
+ <span class="cline-any cline-neutral">&nbsp;</span>
207
+ <span class="cline-any cline-neutral">&nbsp;</span>
208
+ <span class="cline-any cline-neutral">&nbsp;</span>
209
+ <span class="cline-any cline-neutral">&nbsp;</span>
210
+ <span class="cline-any cline-neutral">&nbsp;</span>
211
+ <span class="cline-any cline-neutral">&nbsp;</span>
212
+ <span class="cline-any cline-neutral">&nbsp;</span>
213
+ <span class="cline-any cline-neutral">&nbsp;</span>
214
+ <span class="cline-any cline-yes">51x</span>
215
+ <span class="cline-any cline-yes">51x</span>
216
+ <span class="cline-any cline-yes">51x</span>
217
+ <span class="cline-any cline-yes">51x</span>
218
+ <span class="cline-any cline-yes">51x</span>
219
+ <span class="cline-any cline-yes">51x</span>
220
+ <span class="cline-any cline-yes">51x</span>
221
+ <span class="cline-any cline-neutral">&nbsp;</span>
222
+ <span class="cline-any cline-neutral">&nbsp;</span>
223
+ <span class="cline-any cline-neutral">&nbsp;</span>
224
+ <span class="cline-any cline-neutral">&nbsp;</span>
225
+ <span class="cline-any cline-neutral">&nbsp;</span>
226
+ <span class="cline-any cline-yes">32x</span>
227
+ <span class="cline-any cline-yes">9x</span>
228
+ <span class="cline-any cline-yes">1x</span>
229
+ <span class="cline-any cline-yes">1x</span>
230
+ <span class="cline-any cline-yes">1x</span>
231
+ <span class="cline-any cline-neutral">&nbsp;</span>
232
+ <span class="cline-any cline-yes">8x</span>
233
+ <span class="cline-any cline-yes">8x</span>
234
+ <span class="cline-any cline-yes">8x</span>
235
+ <span class="cline-any cline-yes">8x</span>
236
+ <span class="cline-any cline-neutral">&nbsp;</span>
237
+ <span class="cline-any cline-yes">23x</span>
238
+ <span class="cline-any cline-yes">8x</span>
239
+ <span class="cline-any cline-yes">8x</span>
240
+ <span class="cline-any cline-yes">8x</span>
241
+ <span class="cline-any cline-yes">8x</span>
242
+ <span class="cline-any cline-neutral">&nbsp;</span>
243
+ <span class="cline-any cline-yes">15x</span>
244
+ <span class="cline-any cline-neutral">&nbsp;</span>
245
+ <span class="cline-any cline-yes">8x</span>
246
+ <span class="cline-any cline-yes">1x</span>
247
+ <span class="cline-any cline-yes">1x</span>
248
+ <span class="cline-any cline-yes">1x</span>
249
+ <span class="cline-any cline-neutral">&nbsp;</span>
250
+ <span class="cline-any cline-yes">7x</span>
251
+ <span class="cline-any cline-yes">24x</span>
252
+ <span class="cline-any cline-neutral">&nbsp;</span>
253
+ <span class="cline-any cline-yes">7x</span>
254
+ <span class="cline-any cline-yes">7x</span>
255
+ <span class="cline-any cline-yes">7x</span>
256
+ <span class="cline-any cline-yes">2x</span>
257
+ <span class="cline-any cline-yes">2x</span>
258
+ <span class="cline-any cline-yes">5x</span>
259
+ <span class="cline-any cline-no">&nbsp;</span>
260
+ <span class="cline-any cline-no">&nbsp;</span>
261
+ <span class="cline-any cline-neutral">&nbsp;</span>
262
+ <span class="cline-any cline-yes">5x</span>
263
+ <span class="cline-any cline-yes">5x</span>
264
+ <span class="cline-any cline-neutral">&nbsp;</span>
265
+ <span class="cline-any cline-yes">7x</span>
266
+ <span class="cline-any cline-neutral">&nbsp;</span>
267
+ <span class="cline-any cline-yes">7x</span>
268
+ <span class="cline-any cline-neutral">&nbsp;</span>
269
+ <span class="cline-any cline-yes">7x</span>
270
+ <span class="cline-any cline-yes">7x</span>
271
+ <span class="cline-any cline-yes">1x</span>
272
+ <span class="cline-any cline-yes">1x</span>
273
+ <span class="cline-any cline-yes">1x</span>
274
+ <span class="cline-any cline-neutral">&nbsp;</span>
275
+ <span class="cline-any cline-neutral">&nbsp;</span>
276
+ <span class="cline-any cline-yes">6x</span>
277
+ <span class="cline-any cline-neutral">&nbsp;</span>
278
+ <span class="cline-any cline-neutral">&nbsp;</span>
279
+ <span class="cline-any cline-neutral">&nbsp;</span>
280
+ <span class="cline-any cline-neutral">&nbsp;</span>
281
+ <span class="cline-any cline-neutral">&nbsp;</span>
282
+ <span class="cline-any cline-neutral">&nbsp;</span>
283
+ <span class="cline-any cline-neutral">&nbsp;</span>
284
+ <span class="cline-any cline-no">&nbsp;</span>
285
+ <span class="cline-any cline-no">&nbsp;</span>
286
+ <span class="cline-any cline-no">&nbsp;</span>
287
+ <span class="cline-any cline-no">&nbsp;</span>
288
+ <span class="cline-any cline-no">&nbsp;</span>
289
+ <span class="cline-any cline-no">&nbsp;</span>
290
+ <span class="cline-any cline-no">&nbsp;</span>
291
+ <span class="cline-any cline-no">&nbsp;</span>
292
+ <span class="cline-any cline-neutral">&nbsp;</span>
293
+ <span class="cline-any cline-neutral">&nbsp;</span>
294
+ <span class="cline-any cline-neutral">&nbsp;</span>
295
+ <span class="cline-any cline-neutral">&nbsp;</span>
296
+ <span class="cline-any cline-neutral">&nbsp;</span>
297
+ <span class="cline-any cline-neutral">&nbsp;</span>
298
+ <span class="cline-any cline-neutral">&nbsp;</span>
299
+ <span class="cline-any cline-no">&nbsp;</span>
300
+ <span class="cline-any cline-no">&nbsp;</span>
301
+ <span class="cline-any cline-no">&nbsp;</span>
302
+ <span class="cline-any cline-no">&nbsp;</span>
303
+ <span class="cline-any cline-no">&nbsp;</span>
304
+ <span class="cline-any cline-no">&nbsp;</span>
305
+ <span class="cline-any cline-no">&nbsp;</span>
306
+ <span class="cline-any cline-neutral">&nbsp;</span>
307
+ <span class="cline-any cline-neutral">&nbsp;</span>
308
+ <span class="cline-any cline-yes">51x</span>
309
+ <span class="cline-any cline-neutral">&nbsp;</span>
310
+ <span class="cline-any cline-neutral">&nbsp;</span>
311
+ <span class="cline-any cline-neutral">&nbsp;</span>
312
+ <span class="cline-any cline-neutral">&nbsp;</span>
313
+ <span class="cline-any cline-neutral">&nbsp;</span>
314
+ <span class="cline-any cline-neutral">&nbsp;</span>
315
+ <span class="cline-any cline-neutral">&nbsp;</span>
316
+ <span class="cline-any cline-neutral">&nbsp;</span>
317
+ <span class="cline-any cline-neutral">&nbsp;</span>
318
+ <span class="cline-any cline-neutral">&nbsp;</span>
319
+ <span class="cline-any cline-neutral">&nbsp;</span>
320
+ <span class="cline-any cline-neutral">&nbsp;</span>
321
+ <span class="cline-any cline-neutral">&nbsp;</span>
322
+ <span class="cline-any cline-neutral">&nbsp;</span>
323
+ <span class="cline-any cline-neutral">&nbsp;</span>
324
+ <span class="cline-any cline-neutral">&nbsp;</span>
325
+ <span class="cline-any cline-neutral">&nbsp;</span>
326
+ <span class="cline-any cline-neutral">&nbsp;</span>
327
+ <span class="cline-any cline-neutral">&nbsp;</span>
328
+ <span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import { useState } from "react";
329
+ import { validatePorts, validateEnvVars } from "../../helpers/validationHelpers.js";
330
+ import { IMAGE_PROFILES } from "../../helpers/constants.js";
331
+ import { safeCall } from "../../helpers/safeCall.js";
332
+ &nbsp;
333
+ /**
334
+ * Custom hook to manage the container creation flow, step by step.
335
+ * Handles input, validation, and feedback for each creation step.
336
+ *
337
+ * @param {Object} params
338
+ * @param {Function} params.onCreate - Callback when creation is confirmed
339
+ * @param {Function} params.onCancel - Callback when creation is cancelled
340
+ * @param {Array&lt;string&gt;} params.dbImages - List of DB image names for env var warning (legacy)
341
+ * @param {Object} [params.imageProfiles] - Image profiles map for contextual validation
342
+ * @returns {Object} Creation state, setters, and helpers
343
+ */
344
+ export function useContainerCreation({ onCreate, onCancel, dbImages = <span class="branch-0 cbranch-no" title="branch not covered" >[],</span> imageProfiles = IMAGE_PROFILES }) {
345
+ const [step, setStep] = useState(0); // 0: image, 1: name, 2: ports, 3: env
346
+ const [imageName, setImageName] = useState("");
347
+ const [containerName, setContainerName] = useState("");
348
+ const [portInput, setPortInput] = useState("");
349
+ const [envInput, setEnvInput] = useState("");
350
+ const [message, setMessage] = useState("");
351
+ const [messageColor, setMessageColor] = useState("yellow");
352
+ &nbsp;
353
+ /**
354
+ * Advances to the next step, with validation and feedback.
355
+ */
356
+ function nextStep() {
357
+ if (step === 0) {
358
+ if (!imageName.trim()) {
359
+ setMessage("Image name cannot be empty.");
360
+ setMessageColor("red");
361
+ return;
362
+ }
363
+ setStep(1);
364
+ setMessage("Optional: Enter container name or leave empty and press Enter");
365
+ setMessageColor("yellow");
366
+ return;
367
+ }
368
+ if (step === 1) {
369
+ setStep(2);
370
+ setMessage("Optional: Enter ports (format 8080:80,443:443) or leave empty and press Enter");
371
+ setMessageColor("yellow");
372
+ return;
373
+ }
374
+ if (step === 2) {
375
+ // Ports are now optional - only validate if provided
376
+ if (portInput.trim() &amp;&amp; !validatePorts(portInput)) {
377
+ setMessage("Port format must be host:container and both must be numbers (e.g. 8080:80)");
378
+ setMessageColor("red");
379
+ return;
380
+ }
381
+ setStep(3);
382
+ const isDb = dbImages.some(db =&gt; imageName.trim().toLowerCase().includes(db));
383
+ // Check if the image has a profile with required env vars
384
+ const baseName = imageName.trim().toLowerCase().split(":")[0].split("/").pop();
385
+ const profile = imageProfiles[baseName];
386
+ if (profile &amp;&amp; profile.requiredEnv &amp;&amp; profile.requiredEnv.length) {
387
+ setMessage(`Required env vars for ${baseName}: ${profile.requiredEnv.join(", ")}. Enter as VAR=val,VAR2=val2`);
388
+ setMessageColor("yellow");
389
+ } else <span class="missing-if-branch" title="if path not taken" >I</span>if (isDb) {
390
+ <span class="cstat-no" title="statement not covered" > setMessage("Warning: This image usually requires environment variables (e.g. MYSQL_ROOT_PASSWORD=my-secret-pw for MySQL, POSTGRES_PASSWORD=yourpassword for Postgres). Enter them as VAR=val,VAR2=val2 or leave empty and press Enter.");</span>
391
+ <span class="cstat-no" title="statement not covered" > setMessageColor("yellow");</span>
392
+ } else {
393
+ setMessage("Optional: Enter environment variables (format VAR1=val1,VAR2=val2) or leave empty and press Enter");
394
+ setMessageColor("yellow");
395
+ }
396
+ return;
397
+ }
398
+ <span class="missing-if-branch" title="else path not taken" >E</span>if (step === 3) {
399
+ // Contextual env validation using image profiles
400
+ const result = validateEnvVars(envInput, imageName, imageProfiles);
401
+ if (!result.valid) {
402
+ setMessage(result.errors.join(" | "));
403
+ setMessageColor("red");
404
+ return;
405
+ }
406
+ // Final step: call onCreate with all data (safely)
407
+ safeCall(onCreate, { imageName, containerName, portInput, envInput });
408
+ }
409
+ }
410
+ &nbsp;
411
+ /**
412
+ * Cancels the creation process and resets state.
413
+ */
414
+ function <span class="fstat-no" title="function not covered" >cancelCreation(</span>) {
415
+ <span class="cstat-no" title="statement not covered" > setStep(0);</span>
416
+ <span class="cstat-no" title="statement not covered" > setImageName("");</span>
417
+ <span class="cstat-no" title="statement not covered" > setContainerName("");</span>
418
+ <span class="cstat-no" title="statement not covered" > setPortInput("");</span>
419
+ <span class="cstat-no" title="statement not covered" > setEnvInput("");</span>
420
+ <span class="cstat-no" title="statement not covered" > setMessage("");</span>
421
+ <span class="cstat-no" title="statement not covered" > setMessageColor("yellow");</span>
422
+ <span class="cstat-no" title="statement not covered" > safeCall(onCancel);</span>
423
+ }
424
+ &nbsp;
425
+ /**
426
+ * Resets all creation state to initial values without triggering onCancel.
427
+ * Used by the command router when the user presses 'c' to open the creation wizard.
428
+ */
429
+ function <span class="fstat-no" title="function not covered" >resetCreation(</span>) {
430
+ <span class="cstat-no" title="statement not covered" > setStep(0);</span>
431
+ <span class="cstat-no" title="statement not covered" > setImageName("");</span>
432
+ <span class="cstat-no" title="statement not covered" > setContainerName("");</span>
433
+ <span class="cstat-no" title="statement not covered" > setPortInput("");</span>
434
+ <span class="cstat-no" title="statement not covered" > setEnvInput("");</span>
435
+ <span class="cstat-no" title="statement not covered" > setMessage("Insert the name of the image to create: ");</span>
436
+ <span class="cstat-no" title="statement not covered" > setMessageColor("yellow");</span>
437
+ }
438
+ &nbsp;
439
+ return {
440
+ step,
441
+ setStep,
442
+ imageName,
443
+ setImageName,
444
+ containerName,
445
+ setContainerName,
446
+ portInput,
447
+ setPortInput,
448
+ envInput,
449
+ setEnvInput,
450
+ message,
451
+ setMessage,
452
+ messageColor,
453
+ setMessageColor,
454
+ nextStep,
455
+ cancelCreation,
456
+ resetCreation,
457
+ };
458
+ }
459
+ &nbsp;</pre></td></tr></table></pre>
460
+
461
+ <div class='push'></div><!-- for sticky footer -->
462
+ </div><!-- /wrapper -->
463
+ <div class='footer quiet pad2 space-top1 center small'>
464
+ Code coverage generated by
465
+ <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
466
+ at 2026-04-25T17:40:28.828Z
467
+ </div>
468
+ <script src="../../prettify.js"></script>
469
+ <script>
470
+ window.onload = function () {
471
+ prettyPrint();
472
+ };
473
+ </script>
474
+ <script src="../../sorter.js"></script>
475
+ <script src="../../block-navigation.js"></script>
476
+ </body>
477
+ </html>
478
+