mission_control-servers 0.1.2 → 0.1.4

Sign up to get free protection for your applications and to get access to all the features.
Files changed (24) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/builds/mission_control_servers_application.css +1 -0
  3. data/app/assets/config/mission_control_servers_manifest.js +1 -1
  4. data/app/assets/stylesheets/mission_control/servers/application.tailwind.css +75 -0
  5. data/app/controllers/mission_control/servers/scripts_controller.rb +42 -0
  6. data/app/javascript/mission_control/servers/controllers/dark_mode_controller.js +30 -0
  7. data/app/javascript/mission_control/servers/controllers/pie_chart_controller.js +44 -12
  8. data/app/views/layouts/mission_control/servers/application.html.erb +1 -3
  9. data/app/views/mission_control/servers/dashboards/cpu_histories/show.html.erb +3 -3
  10. data/app/views/mission_control/servers/dashboards/cpu_usages/show.html.erb +4 -6
  11. data/app/views/mission_control/servers/dashboards/disk_frees/show.html.erb +1 -1
  12. data/app/views/mission_control/servers/dashboards/memory_histories/show.html.erb +3 -3
  13. data/app/views/mission_control/servers/dashboards/memory_usages/show.html.erb +3 -3
  14. data/app/views/mission_control/servers/dashboards/project_tables/show.html.erb +16 -16
  15. data/app/views/mission_control/servers/projects/_form.html.erb +2 -2
  16. data/app/views/mission_control/servers/projects/edit.html.erb +11 -2
  17. data/app/views/mission_control/servers/projects/index.html.erb +16 -7
  18. data/app/views/mission_control/servers/projects/new.html.erb +11 -2
  19. data/app/views/mission_control/servers/projects/show.html.erb +8 -8
  20. data/config/tailwind.config.js +27 -0
  21. data/lib/mission_control/servers/version.rb +1 -1
  22. data/lib/tasks/mission_control/servers_tasks.rake +9 -4
  23. metadata +21 -4
  24. data/app/assets/stylesheets/mission_control/servers/application.css +0 -15
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 528c4f44febc66f16c62945fa9e7bf9cec90f03dd3ad0395418ebb64e1d3369b
4
- data.tar.gz: cf9ed213169883628541b48679c3d8410b06fee630e2c781a528035555fa7fdf
3
+ metadata.gz: e25964798f9391794ee02081c5559b0da5d48fe097f79a875c1576871f033802
4
+ data.tar.gz: 9c1cb252db02511ec4c8452aece369dec34799dce429e824477ee23ae46f2a1f
5
5
  SHA512:
6
- metadata.gz: 72e1c4ea0a8a93a9fdcb4033d64dd2d92230d333c7475b3218a0386edc91c16c660019ac14b311d37a73bedcb4dc15d95143c4e91a71418212ce0380c26f61f8
7
- data.tar.gz: 5fd770c81254b978a83c340240dc57445ddb7377e69238a4be2d72be4e1a54236f26038e4f3394cb984ac8a73bc057b9ff1b4fdb1b17182837e1cf97accd4902
6
+ metadata.gz: 24788c8c091e43933bbcc4f506ce45a465a6f28239490df1a4b6bf6b412256874f5fc99745c9b666e81971c53c42ae10b3ecb3ad6300026baf7bc3e5cfc77e6d
7
+ data.tar.gz: 21364e9ef5e4759f97f61e868bb2f4f7fe44b2a7fa75283b8e2ccc4f3e82861cc5f9e8b7398cd0a99260918a1250f4ad6ce1899b06af9597d8e9622f7770836c
data/app/assets/builds/mission_control_servers_application.css ADDED
@@ -0,0 +1 @@
1
+ /*! tailwindcss v3.4.1 | MIT License | https://tailwindcss.com*/*,:after,:before{border:0 solid #e5e7eb;box-sizing:border-box}:after,:before{--tw-content:""}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:normal;-webkit-tap-highlight-color:transparent;font-family:Inter var,ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-variation-settings:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:normal;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{font-feature-settings:inherit;color:inherit;font-family:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;background-color:initial;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:initial}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{color:#9ca3af;opacity:1}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]{display:none}[multiple],[type=date],[type=datetime-local],[type=email],[type=month],[type=number],[type=password],[type=search],[type=tel],[type=text],[type=time],[type=url],[type=week],select,textarea{--tw-shadow:0 0 #0000;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;border-color:#6b7280;border-radius:0;border-width:1px;font-size:1rem;line-height:1.5rem;padding:.5rem .75rem}[multiple]:focus,[type=date]:focus,[type=datetime-local]:focus,[type=email]:focus,[type=month]:focus,[type=number]:focus,[type=password]:focus,[type=search]:focus,[type=tel]:focus,[type=text]:focus,[type=time]:focus,[type=url]:focus,[type=week]:focus,select:focus,textarea:focus{--tw-ring-inset:var(--tw-empty,/*!*/ /*!*/);--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#2563eb;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);border-color:#2563eb;box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);outline:2px solid #0000;outline-offset:2px}input::-moz-placeholder,textarea::-moz-placeholder{color:#6b7280;opacity:1}input::placeholder,textarea::placeholder{color:#6b7280;opacity:1}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-date-and-time-value{min-height:1.5em}::-webkit-datetime-edit,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-meridiem-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-year-field{padding-bottom:0;padding-top:0}select{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3E%3C/svg%3E");background-position:right .5rem center;background-repeat:no-repeat;background-size:1.5em 1.5em;padding-right:2.5rem;-webkit-print-color-adjust:exact;print-color-adjust:exact}[multiple]{background-image:none;background-position:0 0;background-repeat:unset;background-size:initial;padding-right:.75rem;-webkit-print-color-adjust:unset;print-color-adjust:unset}[type=checkbox],[type=radio]{--tw-shadow:0 0 #0000;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;background-origin:border-box;border-color:#6b7280;border-width:1px;color:#2563eb;display:inline-block;flex-shrink:0;height:1rem;padding:0;-webkit-print-color-adjust:exact;print-color-adjust:exact;-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:middle;width:1rem}[type=checkbox]{border-radius:0}[type=radio]{border-radius:100%}[type=checkbox]:focus,[type=radio]:focus{--tw-ring-inset:var(--tw-empty,/*!*/ /*!*/);--tw-ring-offset-width:2px;--tw-ring-offset-color:#fff;--tw-ring-color:#2563eb;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);outline:2px solid #0000;outline-offset:2px}[type=checkbox]:checked,[type=radio]:checked{background-color:currentColor;background-position:50%;background-repeat:no-repeat;background-size:100% 100%;border-color:#0000}[type=checkbox]:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3E%3Cpath d='M12.207 4.793a1 1 0 0 1 0 1.414l-5 5a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1 1.414-1.414L6.5 9.086l4.293-4.293a1 1 0 0 1 1.414 0z'/%3E%3C/svg%3E")}[type=radio]:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='3'/%3E%3C/svg%3E")}[type=checkbox]:checked:focus,[type=checkbox]:checked:hover,[type=checkbox]:indeterminate,[type=radio]:checked:focus,[type=radio]:checked:hover{background-color:currentColor;border-color:#0000}[type=checkbox]:indeterminate{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:100% 100%}[type=checkbox]:indeterminate:focus,[type=checkbox]:indeterminate:hover{background-color:currentColor;border-color:#0000}[type=file]{background:unset;border-color:inherit;border-radius:0;border-width:0;font-size:unset;line-height:inherit;padding:0}[type=file]:focus{outline:1px solid ButtonText;outline:1px auto -webkit-focus-ring-color}body{background-color:rgb(255 255 255/var(--tw-bg-opacity));color:rgb(17 24 39/var(--tw-text-opacity))}:is(.dark body),body{--tw-bg-opacity:1;--tw-text-opacity:1}:is(.dark body){background-color:rgb(17 24 39/var(--tw-bg-opacity));color:rgb(209 213 219/var(--tw-text-opacity))}h1,h2,h3,h4,h5,h6{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}:is(.dark h1),:is(.dark h2),:is(.dark h3),:is(.dark h4),:is(.dark h5),:is(.dark h6){--tw-text-opacity:1;color:rgb(209 213 219/var(--tw-text-opacity))}*,::backdrop,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.text-gray-light{--tw-text-opacity:1;color:rgb(107 114 128/var(--tw-text-opacity))}:is(.dark .text-gray-light){--tw-text-opacity:1;color:rgb(156 163 175/var(--tw-text-opacity))}.text-gray-normal{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity))}:is(.dark .text-gray-normal){--tw-text-opacity:1;color:rgb(209 213 219/var(--tw-text-opacity))}.btn{--tw-shadow:0 1px 2px 0 #0000000d;--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color);--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-inset:inset;align-items:center;border-radius:.375rem;box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000);display:inline-flex;font-size:.875rem;font-weight:600;line-height:1.25rem;padding:.5rem .75rem}.btn-default{--tw-bg-opacity:1;--tw-text-opacity:1;--tw-ring-opacity:1;--tw-ring-color:rgb(209 213 219/var(--tw-ring-opacity));background-color:rgb(255 255 255/var(--tw-bg-opacity));color:rgb(17 24 39/var(--tw-text-opacity))}.btn-default:hover{--tw-bg-opacity:1;background-color:rgb(249 250 251/var(--tw-bg-opacity))}:is(.dark .btn-default){--tw-bg-opacity:1;--tw-text-opacity:1;--tw-ring-opacity:1;--tw-ring-color:rgb(75 85 99/var(--tw-ring-opacity));background-color:rgb(31 41 55/var(--tw-bg-opacity));color:rgb(209 213 219/var(--tw-text-opacity))}:is(.dark .btn-default:hover){--tw-bg-opacity:1;background-color:rgb(55 65 81/var(--tw-bg-opacity))}.btn-primary{--tw-bg-opacity:1;--tw-text-opacity:1;--tw-ring-opacity:1;--tw-ring-color:rgb(99 102 241/var(--tw-ring-opacity));background-color:rgb(79 70 229/var(--tw-bg-opacity));color:rgb(255 255 255/var(--tw-text-opacity))}.btn-primary:hover{--tw-bg-opacity:1;background-color:rgb(67 56 202/var(--tw-bg-opacity))}:is(.dark .btn-primary){--tw-bg-opacity:1;--tw-text-opacity:1;--tw-ring-opacity:1;--tw-ring-color:rgb(129 140 248/var(--tw-ring-opacity));background-color:rgb(49 46 129/var(--tw-bg-opacity));color:rgb(156 163 175/var(--tw-text-opacity))}:is(.dark .btn-primary:hover){--tw-bg-opacity:1;background-color:rgb(129 140 248/var(--tw-bg-opacity))}.btn-danger{--tw-bg-opacity:1;--tw-text-opacity:1;--tw-ring-opacity:1;--tw-ring-color:rgb(239 68 68/var(--tw-ring-opacity));background-color:rgb(220 38 38/var(--tw-bg-opacity));color:rgb(255 255 255/var(--tw-text-opacity))}.btn-danger:hover{--tw-bg-opacity:1;background-color:rgb(185 28 28/var(--tw-bg-opacity))}:is(.dark .btn-danger){--tw-bg-opacity:1;--tw-text-opacity:1;--tw-ring-opacity:1;--tw-ring-color:rgb(248 113 113/var(--tw-ring-opacity));background-color:rgb(127 29 29/var(--tw-bg-opacity));color:rgb(209 213 219/var(--tw-text-opacity))}:is(.dark .btn-danger:hover){--tw-bg-opacity:1;background-color:rgb(248 113 113/var(--tw-bg-opacity))}.btn-primary-subtle{--tw-bg-opacity:1;--tw-text-opacity:1;background-color:rgb(238 242 255/var(--tw-bg-opacity));color:rgb(79 70 229/var(--tw-text-opacity))}.btn-primary-subtle:hover{--tw-bg-opacity:1;background-color:rgb(224 231 255/var(--tw-bg-opacity))}:is(.dark .btn-primary-subtle){--tw-bg-opacity:1;--tw-text-opacity:1;background-color:rgb(55 48 163/var(--tw-bg-opacity));color:rgb(199 210 254/var(--tw-text-opacity))}:is(.dark .btn-primary-subtle:hover){--tw-bg-opacity:1;background-color:rgb(67 56 202/var(--tw-bg-opacity))}.card-heading{--tw-text-opacity:1;color:rgb(17 24 39/var(--tw-text-opacity));font-size:1.875rem;font-weight:600;letter-spacing:-.025em;line-height:2.25rem;order:-9999}:is(.dark .card-heading){--tw-text-opacity:1;color:rgb(156 163 175/var(--tw-text-opacity))}.progress-bar{--tw-bg-opacity:1;background-color:rgb(209 213 219/var(--tw-bg-opacity))}:is(.dark .progress-bar){--tw-bg-opacity:1;background-color:rgb(75 85 99/var(--tw-bg-opacity))}.progress{--tw-bg-opacity:1;background-color:rgb(79 70 229/var(--tw-bg-opacity))}:is(.dark .progress){--tw-bg-opacity:1;background-color:rgb(55 48 163/var(--tw-bg-opacity))}.sr-only{clip:rect(0,0,0,0);border-width:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.static{position:static}.fixed{position:fixed}.relative{position:relative}.inset-0{inset:0}.z-10{z-index:10}.m-4{margin:1rem}.-mx-4{margin-left:-1rem;margin-right:-1rem}.-my-2{margin-bottom:-.5rem;margin-top:-.5rem}.mx-4{margin-left:1rem;margin-right:1rem}.mx-auto{margin-left:auto;margin-right:auto}.my-10{margin-bottom:2.5rem;margin-top:2.5rem}.my-4{margin-bottom:1rem;margin-top:1rem}.mb-2{margin-bottom:.5rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.mt-5{margin-top:1.25rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.block{display:block}.inline-block{display:inline-block}.flex{display:flex}.table{display:table}.flow-root{display:flow-root}.grid{display:grid}.hidden{display:none}.h-full{height:100%}.min-h-full{min-height:100%}.w-full{width:100%}.min-w-0{min-width:0}.min-w-full{min-width:100%}.max-w-2xl{max-width:42rem}.max-w-4xl{max-width:56rem}.max-w-7xl{max-width:80rem}.max-w-lg{max-width:32rem}.flex-1{flex:1 1 0%}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.list-inside{list-style-position:inside}.list-disc{list-style-type:disc}.appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.flex-col{flex-direction:column}.items-end{align-items:flex-end}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-0{gap:0}.gap-0\.5{gap:.125rem}.divide-y>:not([hidden])~:not([hidden]){--tw-divide-y-reverse:0;border-bottom-width:calc(1px*var(--tw-divide-y-reverse));border-top-width:calc(1px*(1 - var(--tw-divide-y-reverse)))}.divide-gray-200>:not([hidden])~:not([hidden]){--tw-divide-opacity:1;border-color:rgb(229 231 235/var(--tw-divide-opacity))}.divide-gray-300>:not([hidden])~:not([hidden]){--tw-divide-opacity:1;border-color:rgb(209 213 219/var(--tw-divide-opacity))}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.whitespace-nowrap{white-space:nowrap}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:1rem}.rounded-lg{border-radius:.5rem}.rounded-md{border-radius:.375rem}.border{border-width:1px}.border-red-400{--tw-border-opacity:1;border-color:rgb(248 113 113/var(--tw-border-opacity))}.bg-blue-500{--tw-bg-opacity:1;background-color:rgb(59 130 246/var(--tw-bg-opacity))}.bg-gray-300{--tw-bg-opacity:1;background-color:rgb(209 213 219/var(--tw-bg-opacity))}.bg-gray-400\/5{background-color:#9ca3af0d}.bg-gray-500{--tw-bg-opacity:1;background-color:rgb(107 114 128/var(--tw-bg-opacity))}.bg-gray-700{--tw-bg-opacity:1;background-color:rgb(55 65 81/var(--tw-bg-opacity))}.bg-indigo-600{--tw-bg-opacity:1;background-color:rgb(79 70 229/var(--tw-bg-opacity))}.bg-red-100{--tw-bg-opacity:1;background-color:rgb(254 226 226/var(--tw-bg-opacity))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.bg-opacity-75{--tw-bg-opacity:0.75}.p-4{padding:1rem}.p-8{padding:2rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-2\.5{padding-left:.625rem;padding-right:.625rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-1{padding-bottom:.25rem;padding-top:.25rem}.py-1\.5{padding-bottom:.375rem;padding-top:.375rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.py-3{padding-bottom:.75rem;padding-top:.75rem}.py-3\.5{padding-bottom:.875rem;padding-top:.875rem}.py-4{padding-top:1rem}.pb-4,.py-4{padding-bottom:1rem}.pl-3{padding-left:.75rem}.pl-4{padding-left:1rem}.pr-3{padding-right:.75rem}.pr-4{padding-right:1rem}.pt-5{padding-top:1.25rem}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.align-middle{vertical-align:middle}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-6xl{font-size:3.75rem;line-height:1}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-semibold{font-weight:600}.leading-6{line-height:1.5rem}.leading-7{line-height:1.75rem}.leading-tight{line-height:1.25}.tracking-tight{letter-spacing:-.025em}.text-blue-600{--tw-text-opacity:1;color:rgb(37 99 235/var(--tw-text-opacity))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128/var(--tw-text-opacity))}.text-gray-600{--tw-text-opacity:1;color:rgb(75 85 99/var(--tw-text-opacity))}.text-gray-700{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity))}.text-gray-900{--tw-text-opacity:1;color:rgb(17 24 39/var(--tw-text-opacity))}.text-red-700{--tw-text-opacity:1;color:rgb(185 28 28/var(--tw-text-opacity))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.shadow{--tw-shadow:0 1px 3px 0 #0000001a,0 1px 2px -1px #0000001a;--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)}.shadow,.shadow-sm{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 #0000000d;--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.shadow-xl{--tw-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a;--tw-shadow-colored:0 20px 25px -5px var(--tw-shadow-color),0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.ring-1{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.ring-gray-300{--tw-ring-opacity:1;--tw-ring-color:rgb(209 213 219/var(--tw-ring-opacity))}.transition{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-150,.transition-all{transition-duration:.15s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.hover\:bg-blue-600:hover{--tw-bg-opacity:1;background-color:rgb(37 99 235/var(--tw-bg-opacity))}.hover\:bg-indigo-500:hover{--tw-bg-opacity:1;background-color:rgb(99 102 241/var(--tw-bg-opacity))}.hover\:text-blue-800:hover{--tw-text-opacity:1;color:rgb(30 64 175/var(--tw-text-opacity))}.focus\:outline-none:focus{outline:2px solid #0000;outline-offset:2px}.focus-visible\:outline:focus-visible{outline-style:solid}.focus-visible\:outline-2:focus-visible{outline-width:2px}.focus-visible\:outline-offset-2:focus-visible{outline-offset:2px}.focus-visible\:outline-indigo-600:focus-visible{outline-color:#4f46e5}:is(.dark .dark\:bg-gray-900){--tw-bg-opacity:1;background-color:rgb(17 24 39/var(--tw-bg-opacity))}@media (min-width:640px){.sm\:-mx-6{margin-left:-1.5rem;margin-right:-1.5rem}.sm\:mx-0{margin-left:0;margin-right:0}.sm\:my-8{margin-bottom:2rem;margin-top:2rem}.sm\:ml-16{margin-left:4rem}.sm\:mt-0{margin-top:0}.sm\:block{display:block}.sm\:inline{display:inline}.sm\:flex{display:flex}.sm\:w-full{width:100%}.sm\:flex-auto{flex:1 1 auto}.sm\:flex-none{flex:none}.sm\:grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:items-center{align-items:center}.sm\:truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sm\:rounded-lg{border-radius:.5rem}.sm\:p-6{padding:1.5rem}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:py-8{padding-bottom:2rem;padding-top:2rem}.sm\:pl-6{padding-left:1.5rem}.sm\:pr-6{padding-right:1.5rem}.sm\:text-3xl{font-size:1.875rem;line-height:2.25rem}.sm\:text-4xl{font-size:2.25rem;line-height:2.5rem}.sm\:tracking-tight{letter-spacing:-.025em}}@media (min-width:768px){.md\:max-w-3xl{max-width:48rem}}@media (min-width:1024px){.lg\:-mx-8{margin-left:-2rem;margin-right:-2rem}.lg\:ml-4{margin-left:1rem}.lg\:mt-0{margin-top:0}.lg\:flex{display:flex}.lg\:table-cell{display:table-cell}.lg\:max-w-none{max-width:none}.lg\:grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:items-center{align-items:center}.lg\:justify-between{justify-content:space-between}.lg\:px-8{padding-left:2rem}.lg\:pr-8,.lg\:px-8{padding-right:2rem}}
data/app/assets/config/mission_control_servers_manifest.js CHANGED
@@ -1,3 +1,3 @@
1
- //= link_directory ../stylesheets/mission_control/servers .css
1
+ //= link_tree ../builds/ .css
2
2
  //= link_directory ../../javascript/mission_control/servers .js
3
3
  //= link_directory ../../javascript/mission_control/servers/controllers .js
data/app/assets/stylesheets/mission_control/servers/application.tailwind.css ADDED
@@ -0,0 +1,75 @@
1
+ @tailwind base;
2
+ @tailwind components;
3
+ @tailwind utilities;
4
+
5
+ @layer base {
6
+ body {
7
+ @apply bg-white text-gray-900;
8
+ @apply dark:bg-gray-900 dark:text-gray-300;
9
+ }
10
+
11
+ h1, h2, h3, h4, h5, h6 {
12
+ @apply text-white;
13
+ @apply dark:text-gray-300;
14
+ }
15
+ }
16
+
17
+ @layer components {
18
+ .text-gray-light {
19
+ @apply text-gray-500 ;
20
+ @apply dark:text-gray-400;
21
+ }
22
+
23
+ .text-gray-normal {
24
+ @apply text-gray-700 ;
25
+ @apply dark:text-gray-300;
26
+ }
27
+ }
28
+
29
+ @layer components {
30
+ .btn {
31
+ @apply inline-flex items-center rounded-md;
32
+ @apply px-3 py-2 text-sm font-semibold;
33
+ @apply shadow-sm ring-1 ring-inset;
34
+ }
35
+
36
+ .btn-default {
37
+ @apply bg-white text-gray-900 ring-gray-300 hover:bg-gray-50;
38
+ @apply dark:bg-gray-800 dark:text-gray-300 dark:ring-gray-600 dark:hover:bg-gray-700;
39
+ }
40
+
41
+ .btn-primary {
42
+ @apply bg-indigo-600 text-white ring-indigo-500 hover:bg-indigo-700;
43
+ @apply dark:bg-indigo-900 dark:text-gray-400 dark:ring-indigo-400 dark:hover:bg-indigo-400;
44
+ }
45
+
46
+ .btn-danger {
47
+ @apply bg-red-600 text-white ring-red-500 hover:bg-red-700;
48
+ @apply dark:bg-red-900 dark:text-gray-300 dark:ring-red-400 dark:hover:bg-red-400;
49
+ }
50
+
51
+ .btn-primary-subtle {
52
+ @apply bg-indigo-50 text-indigo-600 hover:bg-indigo-100;
53
+ @apply dark:bg-indigo-800 dark:text-indigo-200 dark:hover:bg-indigo-700;
54
+ }
55
+ }
56
+
57
+ @layer components {
58
+ .card-heading {
59
+ @apply order-first text-3xl font-semibold tracking-tight;
60
+ @apply text-gray-900;
61
+ @apply dark:text-gray-400;
62
+ }
63
+ }
64
+
65
+ @layer components {
66
+ .progress-bar {
67
+ @apply bg-gray-300;
68
+ @apply dark:bg-gray-600;
69
+ }
70
+
71
+ .progress {
72
+ @apply bg-indigo-600;
73
+ @apply dark:bg-indigo-800;
74
+ }
75
+ }
data/app/controllers/mission_control/servers/scripts_controller.rb CHANGED
@@ -18,6 +18,29 @@ module MissionControl::Servers
18
18
 
19
19
  def script_content
20
20
  <<~SCRIPT
21
+ if [ "$(id -u)" -eq 0 ]; then
22
+ SUDO=""
23
+ else
24
+ if command -v sudo > /dev/null; then
25
+ SUDO="sudo"
26
+ else
27
+ echo "Script needs to be run as root or with sudo installed."
28
+ exit 1
29
+ fi
30
+ fi
31
+
32
+ if command -v apt-get > /dev/null; then
33
+ $SUDO apt-get update
34
+ $SUDO apt-get install -y curl cron
35
+ elif command -v yum > /dev/null; then
36
+ $SUDO yum install -y curl cronie
37
+ elif command -v zypper > /dev/null; then
38
+ $SUDO zypper install -y curl cron
39
+ else
40
+ echo "Unsupported package manager. Please install curl and cron manually."
41
+ exit 1
42
+ fi
43
+
21
44
  cat <<'EOF' > metrics.sh
22
45
  #!/bin/bash
23
46
 
@@ -41,6 +64,25 @@ module MissionControl::Servers
41
64
 
42
65
  cron_job="* * * * * $(pwd)/metrics.sh"
43
66
  (crontab -l 2>/dev/null | grep -v -F "$cron_job"; echo "$cron_job") | crontab -
67
+ echo
68
+
69
+ echo "████████████████████████████████████████████████████████████████████████████"
70
+ echo "█ █"
71
+ echo "█ ██╗███╗ ██╗███████╗████████╗ █████╗ ██╗ ██╗ ███████╗██████╗ █"
72
+ echo "█ ██║████╗ ██║██╔════╝╚══██╔══╝██╔══██╗██║ ██║ ██╔════╝██╔══██╗ █"
73
+ echo "█ ██║██╔██╗ ██║███████╗ ██║ ███████║██║ ██║ █████╗ ██║ ██║ █"
74
+ echo "█ ██║██║╚██╗██║╚════██║ ██║ ██╔══██║██║ ██║ ██╔══╝ ██║ ██║ █"
75
+ echo "█ ██║██║ ╚████║███████║ ██║ ██║ ██║███████╗███████╗███████╗██████╔╝ █"
76
+ echo "█ ╚═╝╚═╝ ╚═══╝╚══════╝ ╚═╝ ╚═╝ ╚═╝╚══════╝╚══════╝╚══════╝╚═════╝ █"
77
+ echo "█ █"
78
+ echo "█ Metrics script installed and scheduled to run every minute. █"
79
+ echo "█ This script is idempotent and can be run multiple times. █"
80
+ echo "█ █"
81
+ echo "█ To uninstall, remove the cron job (crontab -e) and █"
82
+ echo "█ delete the metrics.sh file. █"
83
+ echo "█ █"
84
+ echo "████████████████████████████████████████████████████████████████████████████"
85
+
44
86
  SCRIPT
45
87
  end
46
88
  end
data/app/javascript/mission_control/servers/controllers/dark_mode_controller.js ADDED
@@ -0,0 +1,30 @@
1
+ import { Controller } from "@hotwired/stimulus"
2
+
3
+ export default class extends Controller {
4
+ connect() {
5
+ this.toggleDarkMode();
6
+ }
7
+
8
+ toggleDarkMode() {
9
+ if (localStorage.getItem('darkMode') === 'true') {
10
+ document.documentElement.classList.add('dark');
11
+ this.element.innerHTML = 'Light Mode';
12
+ } else {
13
+ document.documentElement.classList.remove('dark');
14
+ this.element.innerHTML = 'Dark Mode';
15
+ }
16
+ }
17
+
18
+ toggle() {
19
+ let htmlClasses = document.documentElement.classList;
20
+ if (htmlClasses.contains('dark')) {
21
+ htmlClasses.remove('dark');
22
+ localStorage.setItem('darkMode', 'false');
23
+ this.element.innerHTML = 'Dark Mode';
24
+ } else {
25
+ htmlClasses.add('dark');
26
+ localStorage.setItem('darkMode', 'true');
27
+ this.element.innerHTML = 'Light Mode';
28
+ }
29
+ }
30
+ }
data/app/javascript/mission_control/servers/controllers/pie_chart_controller.js CHANGED
@@ -8,25 +8,57 @@ export default class extends Controller {
8
8
  idleLabel: String,
9
9
  usedLabel: String,
10
10
  idleColor: "rgb(235, 235, 235)",
11
- usedColor: "rgb(54, 162, 235)"
11
+ idleDarkColor: "rgb(32, 32, 32)",
12
+ usedColor: "rgb(54, 162, 235)",
13
+ usedDarkColor: "rgb(32, 32, 128)",
14
+ darkBorderColor: "rgb(255, 255, 255, 0.1)",
15
+ lightBorderColor: "rgb(0, 0, 0, 0.1)"
12
16
  }
17
+
13
18
  connect() {
14
- const ctx = this.element
15
- new Chart(ctx, {
19
+ this.observeHtmlClassChanges();
20
+ this.displayChart();
21
+ }
22
+
23
+ observeHtmlClassChanges() {
24
+ const observer = new MutationObserver(mutations => {
25
+ mutations.forEach(mutation => {
26
+ if (mutation.type === "attributes" && mutation.attributeName === "class") {
27
+ this.updateChartColors();
28
+ }
29
+ });
30
+ });
31
+ observer.observe(document.documentElement, { attributes: true });
32
+ }
33
+
34
+ updateChartColors() {
35
+ const isDarkMode = document.documentElement.classList.contains('dark');
36
+ const idleColor = isDarkMode ? this.idleDarkColorValue : this.idleColorValue;
37
+ const usedColor = isDarkMode ? this.usedDarkColorValue : this.usedColorValue;
38
+ this.chart.data.datasets.forEach(dataset => {
39
+ dataset.backgroundColor = [usedColor, idleColor];
40
+ dataset.borderColor = isDarkMode ? this.darkBorderColorValue : this.lightBorderColorValue;
41
+ });
42
+ this.chart.update();
43
+ }
44
+
45
+ displayChart() {
46
+ const isDarkMode = document.documentElement.classList.contains('dark');
47
+ const idleColor = isDarkMode ? this.idleDarkColorValue : this.idleColorValue;
48
+ const usedColor = isDarkMode ? this.usedDarkColorValue : this.usedColorValue;
49
+ this.chart = new Chart(this.element, {
16
50
  type: 'doughnut',
17
51
  data: {
18
52
  labels: [this.usedLabelValue, this.idleLabelValue],
19
- datasets: [
20
- {
21
- label: this.labelValue,
22
- data: [this.usedValue, this.idleValue],
23
- backgroundColor: [this.usedColorValue,this.idleColorValue],
24
- hoverOffset: 4
25
- }
26
- ]
53
+ datasets: [{
54
+ label: this.labelValue,
55
+ data: [this.usedValue, this.idleValue],
56
+ backgroundColor: [usedColor, idleColor],
57
+ borderColor: isDarkMode ? this.darkBorderColorValue : this.lightBorderColorValue,
58
+ hoverOffset: 4
59
+ }]
27
60
  },
28
61
  options: { animation: false }
29
62
  });
30
63
  }
31
-
32
64
  }
data/app/views/layouts/mission_control/servers/application.html.erb CHANGED
@@ -5,10 +5,8 @@
5
5
  <%= csrf_meta_tags %>
6
6
  <%= csp_meta_tag %>
7
7
  <meta name="viewport" content="width=device-width,initial-scale=1">
8
- <script src="https://cdn.tailwindcss.com?plugins=forms,typography"></script>
9
8
  <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
10
-
11
- <%= stylesheet_link_tag "mission_control/servers/application", media: "all" %>
9
+ <%= stylesheet_link_tag "mission_control_servers_application", media: "all" %>
12
10
  <%= javascript_importmap_tags "application-mcs" %>
13
11
  </head>
14
12
  <body class="h-full">
data/app/views/mission_control/servers/dashboards/cpu_histories/show.html.erb CHANGED
@@ -1,6 +1,6 @@
1
1
  <%= turbo_frame_tag dom_id(@project, [@hostname, :cpu_history].join('-')) do %>
2
- <div class="progress-bar bg-gray-300" style="height: 5px; width: 100%;">
3
- <div class="progress bg-blue-500" data-refresh-target="progressBar" style="height: 100%; width: 100%;"></div>
2
+ <div class="progress-bar" style="height: 5px; width: 100%;">
3
+ <div class="progress" data-refresh-target="progressBar" style="height: 100%; width: 100%;"></div>
4
4
  </div>
5
5
  <div class="flex flex-col bg-gray-400/5 p-8">
6
6
  <dt class="text-sm font-semibold leading-6 text-gray-600">
@@ -10,6 +10,6 @@
10
10
  data-line-chart-data-array-value="<%= @cpu_history_data[:cpu_usages] %>"
11
11
  data-line-chart-color-value="rgb(54, 162, 235)"></canvas>
12
12
  </dt>
13
- <dd class="order-first text-3xl font-semibold tracking-tight text-gray-900">CPU History</dd>
13
+ <dd class="card-heading">CPU History</dd>
14
14
  </div>
15
15
  <% end %>
data/app/views/mission_control/servers/dashboards/cpu_usages/show.html.erb CHANGED
@@ -1,6 +1,6 @@
1
1
  <%= turbo_frame_tag dom_id(@project, [@hostname, :cpu_usage].join('-')) do %>
2
- <div class="progress-bar bg-gray-300" style="height: 5px; width: 100%;">
3
- <div class="progress bg-blue-500" data-refresh-target="progressBar" style="height: 100%; width: 100%;"></div>
2
+ <div class="progress-bar" style="height: 5px; width: 100%;">
3
+ <div class="progress" data-refresh-target="progressBar" style="height: 100%; width: 100%;"></div>
4
4
  </div>
5
5
  <div class="flex flex-col bg-gray-400/5 p-8">
6
6
  <dt class="text-sm font-semibold leading-6 text-gray-600">
@@ -8,11 +8,9 @@
8
8
  data-pie-chart-label-value="CPU Usage"
9
9
  data-pie-chart-idle-value="<%= 100.0 - @service.cpu %>"
10
10
  data-pie-chart-idle-label-value="Idle"
11
- data-pie-chart-idle-color-value="rgb(235, 235, 235)"
12
11
  data-pie-chart-used-value="<%= @service.cpu %>"
13
- data-pie-chart-used-label-value="Active"
14
- data-pie-chart-used-color-value="rgb(54, 162, 235)"></canvas>
12
+ data-pie-chart-used-label-value="Active"></canvas>
15
13
  </dt>
16
- <dd class="order-first text-3xl font-semibold tracking-tight text-gray-900">CPU Usage</dd>
14
+ <dd class="card-heading">CPU Usage</dd>
17
15
  </div>
18
16
  <% end %>
data/app/views/mission_control/servers/dashboards/disk_frees/show.html.erb CHANGED
@@ -6,6 +6,6 @@
6
6
  <dt class="text-6xl font-semibold leading-6 mt-5 text-gray-600">
7
7
  <%= @service.disk_free %>
8
8
  </dt>
9
- <dd class="order-first text-3xl font-semibold tracking-tight text-gray-900">Disk Free</dd>
9
+ <dd class="card-heading">Disk Free</dd>
10
10
  </div>
11
11
  <% end %>
data/app/views/mission_control/servers/dashboards/memory_histories/show.html.erb CHANGED
@@ -1,6 +1,6 @@
1
1
  <%= turbo_frame_tag dom_id(@project, [@hostname, :memory_history].join('-')) do %>
2
- <div class="progress-bar bg-gray-300" style="height: 5px; width: 100%;">
3
- <div class="progress bg-blue-500" data-refresh-target="progressBar" style="height: 100%; width: 100%;"></div>
2
+ <div class="progress-bar" style="height: 5px; width: 100%;">
3
+ <div class="progress" data-refresh-target="progressBar" style="height: 100%; width: 100%;"></div>
4
4
  </div>
5
5
  <div class="flex flex-col bg-gray-400/5 p-8">
6
6
  <dt class="text-sm font-semibold leading-6 text-gray-600">
@@ -10,6 +10,6 @@
10
10
  data-line-chart-data-array-value="<%= @memory_history_data[:memory_usages] %>"
11
11
  data-line-chart-color-value="rgb(54, 162, 235)"></canvas>
12
12
  </dt>
13
- <dd class="order-first text-3xl font-semibold tracking-tight text-gray-900">Memory Used History</dd>
13
+ <dd class="card-heading">Memory Used History</dd>
14
14
  </div>
15
15
  <% end %>
data/app/views/mission_control/servers/dashboards/memory_usages/show.html.erb CHANGED
@@ -1,6 +1,6 @@
1
1
  <%= turbo_frame_tag dom_id(@project, [@hostname, :memory_usage].join('-')) do %>
2
- <div class="progress-bar bg-gray-300" style="height: 5px; width: 100%;">
3
- <div class="progress bg-blue-500" data-refresh-target="progressBar" style="height: 100%; width: 100%;"></div>
2
+ <div class="progress-bar" style="height: 5px; width: 100%;">
3
+ <div class="progress" data-refresh-target="progressBar" style="height: 100%; width: 100%;"></div>
4
4
  </div>
5
5
  <div class="flex flex-col bg-gray-400/5 p-8">
6
6
  <dt class="text-sm font-semibold leading-6 text-gray-600">
@@ -13,6 +13,6 @@
13
13
  data-pie-chart-used-label-value="Active"
14
14
  data-pie-chart-used-color-value="rgb(54, 162, 235)"></canvas>
15
15
  </dt>
16
- <dd class="order-first text-3xl font-semibold tracking-tight text-gray-900">Memory Usage</dd>
16
+ <dd class="card-heading">Memory Usage</dd>
17
17
  </div>
18
18
  <% end %>
data/app/views/mission_control/servers/dashboards/project_tables/show.html.erb CHANGED
@@ -1,17 +1,17 @@
1
1
  <%= turbo_frame_tag dom_id(@project, "table") do %>
2
2
  <div class="mx-4 my-4 ring-1 ring-gray-300 sm:mx-0 sm:rounded-lg">
3
- <div class="progress-bar ring-1 ring-gray-300 sm:mx-0 sm:rounded-lg bg-gray-300" style="height: 5px; width: 100%;">
4
- <div class="progress bg-blue-500 ring-1 ring-gray-300 sm:mx-0 sm:rounded-lg" data-refresh-target="progressBar" style="height: 100%; width: 100%;"></div>
3
+ <div class="progress-bar" style="height: 5px; width: 100%;">
4
+ <div class="progress" data-refresh-target="progressBar" style="height: 100%; width: 100%;"></div>
5
5
  </div>
6
6
  <table class="min-w-full divide-y divide-gray-300">
7
7
  <thead>
8
8
  <tr>
9
- <th scope="col" class="py-3.5 pl-4 pr-3 text-left text-sm font-semibold text-gray-900 sm:pl-6">Hostname</th>
10
- <th scope="col" class="px-3 py-3.5 text-left text-sm font-semibold text-gray-900">CPU Usage</th>
11
- <th scope="col" class="hidden px-3 py-3.5 text-left text-sm font-semibold text-gray-900 lg:table-cell">Memory Used</th>
12
- <th scope="col" class="hidden px-3 py-3.5 text-left text-sm font-semibold text-gray-900 lg:table-cell">Memory Used %</th>
13
- <th scope="col" class="hidden px-3 py-3.5 text-left text-sm font-semibold text-gray-900 lg:table-cell">Memory Free</th>
14
- <th scope="col" class="hidden px-3 py-3.5 text-left text-sm font-semibold text-gray-900 lg:table-cell">Disk Free</th>
9
+ <th scope="col" class="py-3.5 pl-4 pr-3 text-left text-sm font-semibold text-gray-normal sm:pl-6">Hostname</th>
10
+ <th scope="col" class="px-3 py-3.5 text-left text-sm font-semibold text-gray-normal">CPU Usage</th>
11
+ <th scope="col" class="hidden px-3 py-3.5 text-left text-sm font-semibold text-gray-normal lg:table-cell">Memory Used</th>
12
+ <th scope="col" class="hidden px-3 py-3.5 text-left text-sm font-semibold text-gray-normal lg:table-cell">Memory Used %</th>
13
+ <th scope="col" class="hidden px-3 py-3.5 text-left text-sm font-semibold text-gray-normal lg:table-cell">Memory Free</th>
14
+ <th scope="col" class="hidden px-3 py-3.5 text-left text-sm font-semibold text-gray-normal lg:table-cell">Disk Free</th>
15
15
  <th scope="col" class="relative py-3.5 pl-3 pr-4 sm:pr-6">
16
16
  <span class="sr-only">Select</span>
17
17
  </th>
@@ -21,16 +21,16 @@
21
21
  <% @project.services.group_by(&:hostname).each do |hostname, services| %>
22
22
  <tr>
23
23
  <td class="relative py-4 pl-4 pr-3 text-sm sm:pl-6">
24
- <div class="font-medium text-gray-900"><%= hostname%></div>
24
+ <div class="font-medium text-gray-normal"><%= hostname%></div>
25
25
  </td>
26
- <td class="px-3 py-3.5 text-sm text-gray-500 lg:table-cell"><%= services.last.cpu %>%</td>
27
- <td class="hidden px-3 py-3.5 text-sm text-gray-500 lg:table-cell"><%= number_to_human_size(services.last.mem_used.to_f * 1.megabyte) %></td>
28
- <td class="hidden px-3 py-3.5 text-sm text-gray-500 lg:table-cell"><%= services.last.mem_percent %>%</td>
29
- <td class="hidden px-3 py-3.5 text-sm text-gray-500 lg:table-cell"><%= number_to_human_size(services.last.mem_free.to_f * 1.megabyte) %></td>
30
- <td class="hidden px-3 py-3.5 text-sm text-gray-500 lg:table-cell"><%= services.last.disk_free %></td>
26
+ <td class="px-3 py-3.5 text-sm text-gray-light lg:table-cell"><%= services.last.cpu %>%</td>
27
+ <td class="hidden px-3 py-3.5 text-sm text-gray-light lg:table-cell"><%= number_to_human_size(services.last.mem_used.to_f * 1.megabyte) %></td>
28
+ <td class="hidden px-3 py-3.5 text-sm text-gray-light lg:table-cell"><%= services.last.mem_percent %>%</td>
29
+ <td class="hidden px-3 py-3.5 text-sm text-gray-light lg:table-cell"><%= number_to_human_size(services.last.mem_free.to_f * 1.megabyte) %></td>
30
+ <td class="hidden px-3 py-3.5 text-sm text-gray-light lg:table-cell"><%= services.last.disk_free %></td>
31
31
  <td class="relative py-3.5 pl-3 pr-4 text-right text-sm font-medium sm:pr-6">
32
- <%= link_to "Dashboard", project_path(@project, hostname: hostname), target: :_top, class: "inline-flex items-center rounded-md bg-white px-2.5 py-1.5 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50 disabled:cursor-not-allowed disabled:opacity-30 disabled:hover:bg-white" %>
33
- <%= link_to "Remove", project_path(@project, hostname: hostname), data: { "turbo-method": :delete, "turbo-confirm": "Are you sure?" }, class: "inline-flex items-center rounded-md bg-white px-2.5 py-1.5 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50 disabled:cursor-not-allowed disabled:opacity-30 disabled:hover:bg-white" %>
32
+ <%= link_to "Dashboard", project_path(@project, hostname: hostname), target: :_top, class: "btn btn-default" %>
33
+ <%= link_to "Remove", project_path(@project, hostname: hostname), data: { "turbo-method": :delete, "turbo-confirm": "Are you sure?" }, class: "btn btn-danger" %>
34
34
  </td>
35
35
  </tr>
36
36
  <% end %>
data/app/views/mission_control/servers/projects/_form.html.erb CHANGED
@@ -21,7 +21,7 @@
21
21
  </div>
22
22
 
23
23
  <div class="flex items-center justify-between">
24
- <%= form.submit class: "bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline" %>
25
- <%= link_to "Cancel", project, class: "text-blue-600 px-4 hover:text-blue-800 transition duration-150 ease-in-out" %>
24
+ <%= form.submit class: "btn btn-primary btn-block" %>
25
+ <%= link_to "Cancel", project, class: "text-gray-light px-4 transition duration-150 ease-in-out" %>
26
26
  </div>
27
27
  <% end %>
data/app/views/mission_control/servers/projects/edit.html.erb CHANGED
@@ -1,9 +1,18 @@
1
+ <div class="lg:flex lg:items-center lg:justify-between">
2
+ <div class="min-w-0 flex-1"></div>
3
+ <div class="mt-5 flex lg:ml-4 lg:mt-0">
4
+ <span class="hidden sm:block">
5
+ <button data-controller="dark-mode" data-action="click->dark-mode#toggle" class="btn btn-default">Dark Mode</button>
6
+ </span>
7
+ </div>
8
+ </div>
9
+
1
10
  <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 my-10">
2
- <h1 class="text-2xl text-center font-semibold text-gray-900 mb-8">Editing project</h1>
11
+ <h1 class="text-2xl text-center font-semibold text-gray-normal mb-8">Editing project</h1>
3
12
 
4
13
  <%= render "form", project: @project %>
5
14
 
6
15
  <div class="text-center mt-6">
7
- <%= link_to "Back to projects", projects_path, class: "text-blue-600 px-4 hover:text-blue-800 transition duration-150 ease-in-out" %>
16
+ <%= link_to "Back to projects", projects_path, class: "text-gray-light px-4 transition duration-150 ease-in-out" %>
8
17
  </div>
9
18
  </div>
data/app/views/mission_control/servers/projects/index.html.erb CHANGED
@@ -1,12 +1,21 @@
1
+ <div class="lg:flex lg:items-center lg:justify-between">
2
+ <div class="min-w-0 flex-1"></div>
3
+ <div class="mt-5 flex lg:ml-4 lg:mt-0">
4
+ <span class="hidden sm:block">
5
+ <button data-controller="dark-mode" data-action="click->dark-mode#toggle" class="btn btn-default">Dark Mode</button>
6
+ </span>
7
+ </div>
8
+ </div>
9
+
1
10
  <div class="px-4 sm:px-6 lg:px-8">
2
11
  <div class="sm:flex sm:items-center">
3
12
  <div class="sm:flex-auto">
4
- <h1 class="text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl">Projects</h1>
5
- <p class="mt-2 text-sm text-gray-700">Resource monitor for your Ruby on Rails applications.</p>
13
+ <h1 class="text-3xl font-bold tracking-tight sm:text-4xl">Projects</h1>
14
+ <p class="mt-2 text-sm text-gray-normal">Resource monitor for your Ruby on Rails applications.</p>
6
15
  </div>
7
16
  <div class="mt-4 sm:ml-16 sm:mt-0 sm:flex-none">
8
17
  <% if allowed_to_create_project? %>
9
- <%= link_to "New project", new_project_path, class: "block rounded-md bg-indigo-600 px-3 py-2 text-center text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600" %>
18
+ <%= link_to "New project", new_project_path, class: "btn btn-primary" %>
10
19
  <% end %>
11
20
  </div>
12
21
  </div>
@@ -14,13 +23,13 @@
14
23
  <div class="-mx-4 -my-2 overflow-x-auto sm:-mx-6 lg:-mx-8">
15
24
  <div class="inline-block min-w-full py-2 align-middle">
16
25
  <table class="min-w-full divide-y divide-gray-300">
17
- <tbody class="divide-y divide-gray-200 bg-white">
26
+ <tbody class="divide-y divide-gray-200">
18
27
  <% @projects.each do |project| %>
19
28
  <tr>
20
- <td class="whitespace-nowrap text-2xl font-bold tracking-tight text-gray-900 sm:text-3xl"><%= project.title %></td>
29
+ <td class="whitespace-nowrap text-2xl font-bold tracking-tight text-gray-normal sm:text-3xl"><%= project.title %></td>
21
30
  <td class="relative whitespace-nowrap py-4 pl-3 pr-4 text-right text-sm font-medium sm:pr-6 lg:pr-8">
22
- <%= link_to "Dashboards", project, target: :_top, class: "rounded-md bg-indigo-50 px-2.5 py-1.5 text-sm font-semibold text-indigo-600 shadow-sm hover:bg-indigo-100" %>
23
- <%= link_to "Remove", project, data: { "turbo-method": :delete, "turbo-confirm": "Are you sure?" }, class: "inline-flex items-center rounded-md bg-white px-2.5 py-1.5 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50 disabled:cursor-not-allowed disabled:opacity-30 disabled:hover:bg-white" %>
31
+ <%= link_to "Dashboards", project, target: :_top, class: "btn btn-default" %>
32
+ <%= link_to "Remove", project, data: { "turbo-method": :delete, "turbo-confirm": "Are you sure?" }, class: "btn btn-danger" %>
24
33
  </td>
25
34
  </tr>
26
35
  <tr>
data/app/views/mission_control/servers/projects/new.html.erb CHANGED
@@ -1,9 +1,18 @@
1
+ <div class="lg:flex lg:items-center lg:justify-between">
2
+ <div class="min-w-0 flex-1"></div>
3
+ <div class="mt-5 flex lg:ml-4 lg:mt-0">
4
+ <span class="hidden sm:block">
5
+ <button data-controller="dark-mode" data-action="click->dark-mode#toggle" class="btn btn-default">Dark Mode</button>
6
+ </span>
7
+ </div>
8
+ </div>
9
+
1
10
  <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 my-10">
2
- <h1 class="text-2xl text-center font-semibold text-gray-900 mb-8">New Project</h1>
11
+ <h1 class="text-2xl text-center font-semibold text-gray-normal mb-8">New Project</h1>
3
12
 
4
13
  <%= render "form", project: @project %>
5
14
 
6
15
  <div class="text-center mt-6">
7
- <%= link_to "Back to projects", projects_path, class: "text-blue-600 hover:text-blue-800 transition duration-150 ease-in-out" %>
16
+ <%= link_to "Back to projects", projects_path, class: "text-gray-light transition duration-150 ease-in-out" %>
8
17
  </div>
9
18
  </div>
data/app/views/mission_control/servers/projects/show.html.erb CHANGED
@@ -5,25 +5,25 @@
5
5
 
6
6
  <div class="mt-5 flex lg:ml-4 lg:mt-0">
7
7
  <span class="hidden sm:block">
8
- <%= link_to edit_project_path(@project), class: "inline-flex items-center rounded-md bg-white px-3 py-2 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50" do %>
8
+ <button data-controller="dark-mode" data-action="click->dark-mode#toggle" class="btn btn-default">Dark Mode</button>
9
+
10
+ <%= link_to edit_project_path(@project), class: "btn btn-default" do %>
9
11
  Edit
10
12
  <% end %>
11
- <%= link_to projects_path, class: "inline-flex items-center rounded-md bg-white px-3 py-2 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50" do %>
12
- Projects
13
- <% end %>
13
+ <%= link_to projects_path, class: "btn btn-default" do %>Projects<% end %>
14
14
 
15
15
  <span data-controller="dialog copy">
16
- <button data-action="click->dialog#show" class="rounded-md bg-indigo-50 px-2.5 py-1.5 text-sm font-semibold text-indigo-600 shadow-sm hover:bg-indigo-100">
16
+ <button data-action="click->dialog#show" class="btn btn-primary-subtle">
17
17
  Deploy
18
18
  </button>
19
19
  <div data-dialog-target="modal" class="hidden fixed z-10 inset-0 overflow-y-auto" aria-labelledby="modal-title" role="dialog" aria-modal="true">
20
20
  <div data-action="click->dialog#hide" class="fixed inset-0 bg-gray-500 bg-opacity-75"></div>
21
21
  <div class="flex items-end justify-center min-h-full p-4 text-center sm:items-center">
22
- <div class="relative bg-white rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 md:max-w-3xl sm:w-full">
22
+ <div class="relative bg-white dark:bg-gray-900 rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 md:max-w-3xl sm:w-full">
23
23
  <div class="px-4 pt-5 pb-4 sm:p-6">
24
24
  <h3 class="text-lg leading-6 font-medium text-gray-900" id="modal-title">Installation Instructions</h3>
25
25
  <div class="mt-2">
26
- <p class="text-sm text-gray-500">
26
+ <p class="text-sm text-gray-light">
27
27
  You'll make a cURL request from each server that you want to monitor.
28
28
  Copy and paste the script below to each server to start sending metrics to your dashboard.
29
29
  </p>
@@ -43,7 +43,7 @@
43
43
  </div>
44
44
 
45
45
  <% @services.each do |hostname, services| %>
46
- <div class="bg-white py-4 sm:py-8">
46
+ <div class="py-4 sm:py-8">
47
47
  <div class="mx-auto max-w-7xl px-6 lg:px-8">
48
48
  <div class="mx-auto max-w-2xl lg:max-w-none">
49
49
  <div class="text-center">
data/config/tailwind.config.js ADDED
@@ -0,0 +1,27 @@
1
+ const defaultTheme = require('tailwindcss/defaultTheme')
2
+
3
+ module.exports = {
4
+ darkMode: 'class',
5
+ content: [
6
+ './public/*.html',
7
+ './app/helpers/**/*.rb',
8
+ './app/javascript/**/*.js',
9
+ './app/views/**/*.{erb,haml,html,slim}'
10
+ ],
11
+ options: {
12
+ safelist: ['btn-primary-subtle'],
13
+ },
14
+ theme: {
15
+ extend: {
16
+ fontFamily: {
17
+ sans: ['Inter var', ...defaultTheme.fontFamily.sans],
18
+ },
19
+ },
20
+ },
21
+ plugins: [
22
+ require('@tailwindcss/forms'),
23
+ require('@tailwindcss/aspect-ratio'),
24
+ require('@tailwindcss/typography'),
25
+ require('@tailwindcss/container-queries'),
26
+ ]
27
+ }
data/lib/mission_control/servers/version.rb CHANGED
@@ -1,5 +1,5 @@
1
1
  module MissionControl
2
2
  module Servers
3
- VERSION = "0.1.2"
3
+ VERSION = "0.1.4"
4
4
  end
5
5
  end
data/lib/tasks/mission_control/servers_tasks.rake CHANGED
@@ -1,4 +1,9 @@
1
- # desc "Explaining what the task does"
2
- # task :mission_control_servers do
3
- # # Task goes here
4
- # end
1
+ task :tailwind_engine_watch do
2
+ require "tailwindcss-rails"
3
+ # NOTE: tailwindcss-rails is an engine
4
+ system "#{Tailwindcss::Engine.root.join("exe/tailwindcss")} \
5
+ -i #{MissionControl::Servers::Engine.root.join("app/assets/stylesheets/mission_control/servers/application.tailwind.css")} \
6
+ -o #{MissionControl::Servers::Engine.root.join("app/assets/builds/mission_control_servers_application.css")} \
7
+ -c #{MissionControl::Servers::Engine.root.join("config/tailwind.config.js")} \
8
+ --minify -w"
9
+ end
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: mission_control-servers
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.1.2
4
+ version: 0.1.4
5
5
  platform: ruby
6
6
  authors:
7
7
  - Dave Kimura
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2024-02-08 00:00:00.000000000 Z
11
+ date: 2024-02-09 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: rails
@@ -66,6 +66,20 @@ dependencies:
66
66
  - - ">="
67
67
  - !ruby/object:Gem::Version
68
68
  version: '0'
69
+ - !ruby/object:Gem::Dependency
70
+ name: tailwindcss-rails
71
+ requirement: !ruby/object:Gem::Requirement
72
+ requirements:
73
+ - - ">="
74
+ - !ruby/object:Gem::Version
75
+ version: '0'
76
+ type: :runtime
77
+ prerelease: false
78
+ version_requirements: !ruby/object:Gem::Requirement
79
+ requirements:
80
+ - - ">="
81
+ - !ruby/object:Gem::Version
82
+ version: '0'
69
83
  description: Dashboard for managing servers.
70
84
  email:
71
85
  - dave@k-innovations.net
@@ -76,8 +90,9 @@ files:
76
90
  - MIT-LICENSE
77
91
  - README.md
78
92
  - Rakefile
93
+ - app/assets/builds/mission_control_servers_application.css
79
94
  - app/assets/config/mission_control_servers_manifest.js
80
- - app/assets/stylesheets/mission_control/servers/application.css
95
+ - app/assets/stylesheets/mission_control/servers/application.tailwind.css
81
96
  - app/controllers/mission_control/servers/application_controller.rb
82
97
  - app/controllers/mission_control/servers/dashboards/cpu_histories_controller.rb
83
98
  - app/controllers/mission_control/servers/dashboards/cpu_usages_controller.rb
@@ -99,6 +114,7 @@ files:
99
114
  - app/javascript/mission_control/servers/application.js
100
115
  - app/javascript/mission_control/servers/controllers/application.js
101
116
  - app/javascript/mission_control/servers/controllers/copy_controller.js
117
+ - app/javascript/mission_control/servers/controllers/dark_mode_controller.js
102
118
  - app/javascript/mission_control/servers/controllers/dialog_controller.js
103
119
  - app/javascript/mission_control/servers/controllers/index.js
104
120
  - app/javascript/mission_control/servers/controllers/line_chart_controller.js
@@ -123,6 +139,7 @@ files:
123
139
  - app/views/mission_control/servers/projects/show.html.erb
124
140
  - config/importmap.rb
125
141
  - config/routes.rb
142
+ - config/tailwind.config.js
126
143
  - db/migrate/20240205020304_create_mission_control_servers_projects.rb
127
144
  - db/migrate/20240205031009_create_mission_control_servers_services.rb
128
145
  - lib/mission_control/servers.rb
@@ -152,7 +169,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
152
169
  - !ruby/object:Gem::Version
153
170
  version: '0'
154
171
  requirements: []
155
- rubygems_version: 3.5.5
172
+ rubygems_version: 3.5.6
156
173
  signing_key:
157
174
  specification_version: 4
158
175
  summary: Dashboard for managing servers.
data/app/assets/stylesheets/mission_control/servers/application.css DELETED
@@ -1,15 +0,0 @@
1
- /*
2
- * This is a manifest file that'll be compiled into application.css, which will include all the files
3
- * listed below.
4
- *
5
- * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
6
- * or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
7
- *
8
- * You're free to add application-wide styles to this file and they'll appear at the bottom of the
9
- * compiled file so the styles you add here take precedence over styles defined in any other CSS/SCSS
10
- * files in this directory. Styles in this file should be added after the last require_* statement.
11
- * It is generally better to create a new file per style scope.
12
- *
13
- *= require_tree .
14
- *= require_self
15
- */