solara 0.2.1 → 0.2.3

Sign up to get free protection for your applications and to get access to all the features.
Files changed (26) hide show
  1. checksums.yaml +4 -4
  2. data/solara/lib/core/aliases/alias_generator.rb +231 -57
  3. data/solara/lib/core/aliases/{solara_terminal_setup.rb → terminal_setup.rb} +69 -34
  4. data/solara/lib/core/brands/brands_manager.rb +15 -0
  5. data/solara/lib/core/dashboard/brand/BrandDetailView.js +1 -0
  6. data/solara/lib/core/dashboard/brand/brand.html +131 -132
  7. data/solara/lib/core/dashboard/brand/source/BrandRemoteSource.js +4 -4
  8. data/solara/lib/core/dashboard/brands/brands.html +79 -79
  9. data/solara/lib/core/dashboard/component/AddFieldSheet.js +105 -142
  10. data/solara/lib/core/dashboard/component/AliasesBottomSheet.js +85 -79
  11. data/solara/lib/core/dashboard/component/BrandOptionsBottomSheet.js +68 -67
  12. data/solara/lib/core/dashboard/component/ConfirmationDialog.js +66 -64
  13. data/solara/lib/core/dashboard/component/MessageBottomSheet.js +48 -48
  14. data/solara/lib/core/dashboard/component/OnboardBrandBottomSheet.js +128 -125
  15. data/solara/lib/core/dashboard/dashboard_server.rb +12 -5
  16. data/solara/lib/core/dashboard/handler/brand_alisases_handler.rb +1 -1
  17. data/solara/lib/core/dashboard/handler/brand_configurations_manager.rb +2 -2
  18. data/solara/lib/core/dashboard/handler/brand_icon_handler.rb +1 -1
  19. data/solara/lib/core/doctor/doctor_manager.rb +15 -1
  20. data/solara/lib/core/scripts/file_path.rb +9 -1
  21. data/solara/lib/core/scripts/solara_status_manager.rb +4 -0
  22. data/solara/lib/core/solara_configurator.rb +1 -1
  23. data/solara/lib/solara/version.rb +1 -1
  24. data/solara/lib/solara.rb +4 -2
  25. metadata +4 -5
  26. data/solara/lib/core/aliases/alias_generator_manager.rb +0 -29
@@ -3,83 +3,89 @@ class AliasesBottomSheet extends HTMLElement {
3
3
  super();
4
4
  this.attachShadow({ mode: 'open' });
5
5
  this.shadowRoot.innerHTML = `
6
- <style>
7
- .aliases-bottom-sheet {
8
- display: none;
9
- position: fixed;
10
- bottom: 0;
11
- left: 0;
12
- right: 0;
13
- background-color: white;
14
- border-top-left-radius: 20px;
15
- border-top-right-radius: 20px;
16
- box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
17
- z-index: 1000;
18
- padding: 20px;
19
- transition: transform 0.3s ease-out;
20
- transform: translateY(100%);
21
- max-width: 700px;
22
- margin: 0 auto;
23
- width: 100%;
24
- max-height: 80vh;
25
- overflow-y: auto;
26
- }
27
- .aliases-bottom-sheet.show {
28
- transform: translateY(0);
29
- }
30
- .aliases-bottom-sheet h3 {
31
- color: var(--primary-color);
32
- margin-top: 0;
33
- }
34
- .aliases-bottom-sheet ul {
35
- list-style-type: none;
36
- padding: 0;
37
- }
38
- .aliases-bottom-sheet li {
39
- margin-bottom: 10px;
40
- font-family: monospace;
41
- background-color: #f1f1f1;
42
- padding: 5px;
43
- border-radius: 5px;
44
- }
45
- .overlay {
46
- display: none;
47
- position: fixed;
48
- top: 0;
49
- left: 0;
50
- right: 0;
51
- bottom: 0;
52
- background: rgba(0, 0, 0, 0.5);
53
- z-index: 999;
54
- }
55
- .close-aliases {
56
- background-color: var(--primary-color);
57
- color: white;
58
- border: none;
59
- padding: 10px 20px;
60
- border-radius: 5px;
61
- cursor: pointer;
62
- font-size: 16px;
63
- transition: background-color 0.3s ease;
64
- margin-top: 20px;
65
- }
66
- .close-aliases:hover {
67
- background-color: #3a7bc8;
68
- }
69
- </style>
70
- <div class="overlay"></div>
71
- <div class="aliases-bottom-sheet" id="aliasesSheet">
72
- <h3>Aliases</h3>
73
- <div id="commonAliases">
74
- <h4>Common Aliases</h4>
75
- <ul id="commonAliasesList"></ul>
76
- </div>
77
- <div id="brandAliases">
78
- <h4>Brand Aliases</h4>
79
- <ul id="brandAliasesList"></ul>
80
- </div>
81
- <button class="close-aliases" id="closeAliases">Close</button>
82
- </div>
6
+ <style>
7
+ .aliases-bottom-sheet {
8
+ display: none;
9
+ position: fixed;
10
+ bottom: 0;
11
+ left: 0;
12
+ right: 0;
13
+ background-color: white;
14
+ border-top-left-radius: 14px;
15
+ border-top-right-radius: 14px;
16
+ box-shadow: 0 -1.4px 7px rgba(0, 0, 0, 0.1);
17
+ z-index: 1000;
18
+ padding: 14px;
19
+ transition: transform 0.3s ease-out;
20
+ transform: translateY(100%);
21
+ max-width: 490px;
22
+ margin: 0 auto;
23
+ width: 100%;
24
+ max-height: 56vh;
25
+ overflow-y: auto;
26
+ }
27
+ .aliases-bottom-sheet.show {
28
+ transform: translateY(0);
29
+ }
30
+ .aliases-bottom-sheet h3 {
31
+ color: var(--primary-color);
32
+ margin-top: 0;
33
+ font-size: 16.8px;
34
+ }
35
+ .aliases-bottom-sheet h4 {
36
+ font-size: 14px;
37
+ }
38
+ .aliases-bottom-sheet ul {
39
+ list-style-type: none;
40
+ padding: 0;
41
+ }
42
+ .aliases-bottom-sheet li {
43
+ margin-bottom: 7px;
44
+ font-family: monospace;
45
+ background-color: #f1f1f1;
46
+ padding: 3.5px;
47
+ border-radius: 3.5px;
48
+ font-size: 11.2px;
49
+ }
50
+ .overlay {
51
+ display: none;
52
+ position: fixed;
53
+ top: 0;
54
+ left: 0;
55
+ right: 0;
56
+ bottom: 0;
57
+ background: rgba(0, 0, 0, 0.5);
58
+ z-index: 999;
59
+ }
60
+ .close-aliases {
61
+ background-color: var(--primary-color);
62
+ color: white;
63
+ border: none;
64
+ padding: 7px 14px;
65
+ border-radius: 3.5px;
66
+ cursor: pointer;
67
+ font-size: 11.2px;
68
+ transition: background-color 0.3s ease;
69
+ margin-top: 14px;
70
+ }
71
+ .close-aliases:hover {
72
+ background-color: #3a7bc8;
73
+ }
74
+ </style>
75
+
76
+ <div class="overlay"></div>
77
+ <div class="aliases-bottom-sheet" id="aliasesSheet">
78
+ <h3>Aliases</h3>
79
+ <div id="commonAliases">
80
+ <h4>Common Aliases</h4>
81
+ <ul id="commonAliasesList"></ul>
82
+ </div>
83
+ <div id="brandAliases">
84
+ <h4>Brand Aliases</h4>
85
+ <ul id="brandAliasesList"></ul>
86
+ </div>
87
+ <button class="close-aliases" id="closeAliases">Close</button>
88
+ </div>
83
89
  `;
84
90
 
85
91
  this.aliasesBottomSheet = this.shadowRoot.getElementById('aliasesSheet');
@@ -101,7 +107,7 @@ class AliasesBottomSheet extends HTMLElement {
101
107
 
102
108
  aliases.aliases.common_aliases.forEach(alias => {
103
109
  const li = document.createElement('li');
104
- li.textContent = alias.replace(pattern, '').trim();
110
+ li.textContent = alias[0].replace(pattern, '').trim();
105
111
  commonAliasesList.appendChild(li);
106
112
  });
107
113
 
@@ -109,7 +115,7 @@ class AliasesBottomSheet extends HTMLElement {
109
115
 
110
116
  brandAliases.forEach(alias => {
111
117
  const li = document.createElement('li');
112
- li.textContent = alias.replace(pattern, '').trim();
118
+ li.textContent = alias[0].replace(pattern, '').trim();
113
119
  brandAliasesList.appendChild(li);
114
120
  });
115
121
  this.aliasesBottomSheet.style.display = 'block';
@@ -4,73 +4,74 @@ class BrandOptionsBottomSheet extends HTMLElement {
4
4
  this.attachShadow({mode: 'open'});
5
5
 
6
6
  this.shadowRoot.innerHTML = `
7
- <head>
8
- <style>
9
- .bottom-sheet {
10
- display: none;
11
- position: fixed;
12
- bottom: 0;
13
- left: 0;
14
- right: 0;
15
- background-color: white;
16
- border-top-left-radius: 20px;
17
- border-top-right-radius: 20px;
18
- box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
19
- z-index: 1000;
20
- padding: 20px;
21
- transition: transform 0.3s ease-out;
22
- transform: translateY(100%);
23
- max-width: 700px;
24
- margin: 0 auto;
25
- width: 100%;
26
- }
27
- .bottom-sheet.show {
28
- transform: translateY(0);
29
- }
30
- .bottom-sheet ul {
31
- list-style-type: none;
32
- padding: 0;
33
- margin: 0;
34
- }
35
- .bottom-sheet li {
36
- padding: 15px 20px;
37
- cursor: pointer;
38
- transition: background-color 0.3s ease;
39
- display: flex;
40
- align-items: center;
41
- }
42
- .bottom-sheet li:hover {
43
- background-color: var(--background-color);
44
- }
45
- .bottom-sheet li i {
46
- margin-right: 15px;
47
- font-size: 20px;
48
- width: 24px;
49
- text-align: center;
50
- }
51
- .overlay {
52
- display: none;
53
- position: fixed;
54
- top: 0;
55
- left: 0;
56
- right: 0;
57
- bottom: 0;
58
- background: rgba(0, 0, 0, 0.5);
59
- z-index: 999;
60
- }
61
- </style>
62
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css">
63
- </head>
64
- <div class="overlay"></div>
65
- <div class="bottom-sheet" id="bottomSheet">
66
- <ul>
67
- <li id="cloneOption" class="clone-option"><i class="fas fa-copy"></i>Clone</li>
68
- <li id="doctorOption" class="doctor-option"><i class="fas fa-stethoscope"></i>Doctor</li>
69
- <li id="offboardOption" class="offboard-option"><i class="fas fa-trash-alt"></i>Offboard</li>
70
- <li id="aliasesOption" class="aliases-option"><i class="fas fa-terminal"></i>Terminal aliases</li>
71
- <li id="settingsOption" class="settings-option"><i class="fas fa-cog"></i>Settings</li>
72
- </ul>
73
- </div>
7
+ <head>
8
+ <style>
9
+ .bottom-sheet {
10
+ display: none;
11
+ position: fixed;
12
+ bottom: 0;
13
+ left: 0;
14
+ right: 0;
15
+ background-color: white;
16
+ border-top-left-radius: 14px;
17
+ border-top-right-radius: 14px;
18
+ box-shadow: 0 -1.4px 7px rgba(0, 0, 0, 0.1);
19
+ z-index: 1000;
20
+ padding: 14px;
21
+ transition: transform 0.3s ease-out;
22
+ transform: translateY(100%);
23
+ max-width: 490px;
24
+ margin: 0 auto;
25
+ width: 100%;
26
+ }
27
+ .bottom-sheet.show {
28
+ transform: translateY(0);
29
+ }
30
+ .bottom-sheet ul {
31
+ list-style-type: none;
32
+ padding: 0;
33
+ margin: 0;
34
+ }
35
+ .bottom-sheet li {
36
+ padding: 10.5px 14px;
37
+ cursor: pointer;
38
+ transition: background-color 0.3s ease;
39
+ display: flex;
40
+ align-items: center;
41
+ font-size: 12.6px;
42
+ }
43
+ .bottom-sheet li:hover {
44
+ background-color: var(--background-color);
45
+ }
46
+ .bottom-sheet li i {
47
+ margin-right: 10.5px;
48
+ font-size: 14px;
49
+ width: 16.8px;
50
+ text-align: center;
51
+ }
52
+ .overlay {
53
+ display: none;
54
+ position: fixed;
55
+ top: 0;
56
+ left: 0;
57
+ right: 0;
58
+ bottom: 0;
59
+ background: rgba(0, 0, 0, 0.5);
60
+ z-index: 999;
61
+ }
62
+ </style>
63
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css">
64
+ </head>
65
+ <div class="overlay"></div>
66
+ <div class="bottom-sheet" id="bottomSheet">
67
+ <ul>
68
+ <li id="cloneOption" class="clone-option"><i class="fas fa-copy"></i>Clone</li>
69
+ <li id="doctorOption" class="doctor-option"><i class="fas fa-stethoscope"></i>Doctor</li>
70
+ <li id="offboardOption" class="offboard-option"><i class="fas fa-trash-alt"></i>Offboard</li>
71
+ <li id="aliasesOption" class="aliases-option"><i class="fas fa-terminal"></i>Terminal aliases</li>
72
+ <li id="settingsOption" class="settings-option"><i class="fas fa-cog"></i>Settings</li>
73
+ </ul>
74
+ </div>
74
75
  `;
75
76
 
76
77
  this.bottomSheet = this.shadowRoot.getElementById('bottomSheet');
@@ -7,70 +7,72 @@ class ConfirmationDialog extends HTMLElement {
7
7
 
8
8
  render() {
9
9
  this.shadowRoot.innerHTML = `
10
- <style>
11
- .confirmation-dialog {
12
- display: none;
13
- position: fixed;
14
- top: 50%;
15
- left: 50%;
16
- transform: translate(-50%, -50%);
17
- background-color: white;
18
- padding: 20px;
19
- border-radius: 10px;
20
- box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
21
- z-index: 1001;
22
- text-align: center;
23
- }
24
- .confirmation-dialog h3 {
25
- margin-top: 0;
26
- color: var(--primary-color);
27
- }
28
- .confirmation-dialog .buttons {
29
- margin-top: 20px;
30
- }
31
- .confirmation-dialog button {
32
- margin: 0 10px;
33
- padding: 10px 20px;
34
- border: none;
35
- border-radius: 5px;
36
- cursor: pointer;
37
- font-size: 16px;
38
- transition: background-color 0.3s ease;
39
- }
40
- .confirmation-dialog .confirm {
41
- background-color: #dc3545;
42
- color: white;
43
- }
44
- .confirmation-dialog .cancel {
45
- background-color: #ccc;
46
- color: #333;
47
- }
48
- .confirmation-dialog .confirm:hover {
49
- background-color: #c82333;
50
- }
51
- .confirmation-dialog .cancel:hover {
52
- background-color: #bbb;
53
- }
54
- .overlay {
55
- display: none;
56
- position: fixed;
57
- top: 0;
58
- left: 0;
59
- width: 100%;
60
- height: 100%;
61
- background: rgba(0, 0, 0, 0.5);
62
- z-index: 999;
63
- }
64
- </style>
65
- <div class="overlay" id="overlay"></div>
66
- <div class="confirmation-dialog" id="confirmationDialog">
67
- <h3>Confirm Action</h3>
68
- <p id="confirmationMessage"></p>
69
- <div class="buttons">
70
- <button class="confirm" id="confirmButton">Confirm</button>
71
- <button id="cancelButton">Cancel</button>
72
- </div>
73
- </div>
10
+ <style>
11
+ .confirmation-dialog {
12
+ display: none;
13
+ position: fixed;
14
+ top: 50%;
15
+ left: 50%;
16
+ transform: translate(-50%, -50%);
17
+ background-color: white;
18
+ padding: 14px;
19
+ border-radius: 7px;
20
+ box-shadow: 0 2.8px 4.2px rgba(0, 0, 0, 0.1);
21
+ z-index: 1001;
22
+ text-align: center;
23
+ font-size: 11.2px;
24
+ }
25
+ .confirmation-dialog h3 {
26
+ margin-top: 0;
27
+ color: var(--primary-color);
28
+ font-size: 15.4px;
29
+ }
30
+ .confirmation-dialog .buttons {
31
+ margin-top: 14px;
32
+ }
33
+ .confirmation-dialog button {
34
+ margin: 0 7px;
35
+ padding: 7px 14px;
36
+ border: none;
37
+ border-radius: 3.5px;
38
+ cursor: pointer;
39
+ font-size: 11.2px;
40
+ transition: background-color 0.3s ease;
41
+ }
42
+ .confirmation-dialog .confirm {
43
+ background-color: #dc3545;
44
+ color: white;
45
+ }
46
+ .confirmation-dialog .cancel {
47
+ background-color: #ccc;
48
+ color: #333;
49
+ }
50
+ .confirmation-dialog .confirm:hover {
51
+ background-color: #c82333;
52
+ }
53
+ .confirmation-dialog .cancel:hover {
54
+ background-color: #bbb;
55
+ }
56
+ .overlay {
57
+ display: none;
58
+ position: fixed;
59
+ top: 0;
60
+ left: 0;
61
+ width: 100%;
62
+ height: 100%;
63
+ background: rgba(0, 0, 0, 0.5);
64
+ z-index: 999;
65
+ }
66
+ </style>
67
+ <div class="overlay" id="overlay"></div>
68
+ <div class="confirmation-dialog" id="confirmationDialog">
69
+ <h3>Confirm Action</h3>
70
+ <p id="confirmationMessage"></p>
71
+ <div class="buttons">
72
+ <button class="confirm" id="confirmButton">Confirm</button>
73
+ <button class="cancel" id="cancelButton">Cancel</button>
74
+ </div>
75
+ </div>
74
76
  `;
75
77
 
76
78
  this.confirmationDialog = this.shadowRoot.getElementById('confirmationDialog');
@@ -3,54 +3,54 @@ class MessageBottomSheet extends HTMLElement {
3
3
  super();
4
4
  this.attachShadow({mode: 'open'});
5
5
  this.shadowRoot.innerHTML = `
6
- <style>
7
- .message-bottom-sheet {
8
- display: none;
9
- position: fixed;
10
- bottom: 0;
11
- left: 0;
12
- right: 0;
13
- background-color: white;
14
- border-top-left-radius: 20px;
15
- border-top-right-radius: 20px;
16
- box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
17
- z-index: 1000;
18
- padding: 20px;
19
- transition: transform 0.3s ease-out;
20
- transform: translateY(100%);
21
- max-width: 1000px;
22
- margin: 0 auto;
23
- width: 100%;
24
- }
25
- .message-bottom-sheet.show {
26
- transform: translateY(0);
27
- }
28
- .message-content {
29
- max-height: 300px; /* Set a maximum height */
30
- overflow-y: auto; /* Enable vertical scrolling */
31
- margin-bottom: 20px;
32
- }
33
- .close-message {
34
- width: 10%;
35
- margin: 20px;
36
- padding: 10px;
37
- background-color: var(--primary-color);
38
- color: white;
39
- border: none;
40
- border-radius: 5px;
41
- cursor: pointer;
42
- }
43
-
44
- .close-message:hover {
45
- background-color: #0056b3; /* Darker shade on hover */
46
- }
47
- </style>
48
- <div class="message-bottom-sheet" id="messageBottomSheet">
49
- <div class="message-content" id="messageContent"></div>
50
- <button class="close-message" id="closeMessage">Close</button>
51
- </div>
52
- <div id="overlay" class="overlay" style="display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.5); z-index: 999;"></div>
53
- `;
6
+ <style>
7
+ .message-bottom-sheet {
8
+ display: none;
9
+ position: fixed;
10
+ bottom: 0;
11
+ left: 0;
12
+ right: 0;
13
+ background-color: white;
14
+ border-top-left-radius: 14px;
15
+ border-top-right-radius: 14px;
16
+ box-shadow: 0 -1.4px 7px rgba(0, 0, 0, 0.1);
17
+ z-index: 1000;
18
+ padding: 14px;
19
+ transition: transform 0.3s ease-out;
20
+ transform: translateY(100%);
21
+ max-width: 700px;
22
+ margin: 0 auto;
23
+ width: 100%;
24
+ }
25
+ .message-bottom-sheet.show {
26
+ transform: translateY(0);
27
+ }
28
+ .message-content {
29
+ max-height: 210px; /* Reduced from 300px */
30
+ overflow-y: auto;
31
+ margin-bottom: 14px;
32
+ }
33
+ .close-message {
34
+ width: 7%;
35
+ margin: 14px;
36
+ padding: 7px;
37
+ background-color: var(--primary-color);
38
+ color: white;
39
+ border: none;
40
+ border-radius: 3.5px;
41
+ cursor: pointer;
42
+ font-size: 11.2px;
43
+ }
44
+ .close-message:hover {
45
+ background-color: #0056b3;
46
+ }
47
+ </style>
48
+ <div class="message-bottom-sheet" id="messageBottomSheet">
49
+ <div class="message-content" id="messageContent"></div>
50
+ <button class="close-message" id="closeMessage">Close</button>
51
+ </div>
52
+ <div id="overlay" class="overlay" style="display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.5); z-index: 999;"></div>
53
+ `;
54
54
 
55
55
  this.messageBottomSheet = this.shadowRoot.getElementById('messageBottomSheet');
56
56
  this.messageContent = this.shadowRoot.getElementById('messageContent');