Merge branch 'main' into chriszhu__better_metric_chartingk

This commit is contained in:
Chris Zhu
2025-04-01 22:24:52 -07:00
35 changed files with 316 additions and 78 deletions

View File

@@ -17,7 +17,8 @@ export default class extends Controller {
}
async filterRepositories(e) {
this.searchFunc(e)
e.preventDefault();
this.searchFunc(e);
}
closeModal() {

View File

@@ -1,5 +1,5 @@
import { Controller } from "@hotwired/stimulus"
import { renderHelmChartCard, getLogoImageUrl } from "../utils/helm_charts"
import { renderHelmChartCard, helmChartHeader } from "../utils/helm_charts"
import { debounce } from "../utils"
export default class extends Controller {
@@ -9,10 +9,12 @@ export default class extends Controller {
connect() {
this.input = this.element.querySelector(`input[name="add_on[metadata][helm_chart][helm_chart.name]"]`)
// disable autocomplete
this.input.setAttribute('autocomplete', 'off')
// Create and append dropdown
this.dropdown = document.createElement('ul')
this.dropdown.className = 'hidden absolute z-10 w-full mt-1 menu bg-base-100 rounded-box shadow-lg'
this.dropdown.className = 'hidden absolute z-10 w-full mt-1 menu bg-base-200 block rounded-box shadow-lg max-h-[300px] overflow-y-auto'
this.element.appendChild(this.dropdown)
// Bind search handler with debounce
@@ -39,15 +41,8 @@ export default class extends Controller {
}
this.dropdown.innerHTML = packages.map(pkg => `
<li class="p-2 cursor-pointer" data-package-name="${pkg.name}" data-package-data="${encodeURIComponent(JSON.stringify(pkg))}">
<div class="font-medium flex items-center">
<img src="${getLogoImageUrl(pkg)}" alt="${pkg.name} logo" class="w-8 h-8 mr-2"/>
<div>
${pkg.name}
<br/>
<div class="text-sm text-base-content/70">${pkg.description}</div>
</div>
</div>
<li class="p-2" data-package-name="${pkg.name}" data-package-data="${encodeURIComponent(JSON.stringify(pkg))}">
${helmChartHeader(pkg)}
</li>
`).join('')

View File

@@ -172,8 +172,10 @@ export default class extends Controller {
cost(breakdown) {
return breakdown.reduce((sum, b) => sum + (typeof b.cost === 'number' ? b.cost : 0), 0);
}
render(service, breakdown) {
const serviceName = this.pricesValue[service].name
const supportsCanine = this.pricesValue[service].canine
if (breakdown.error) {
return `
<div class="flex items-center justify-between mb-2">
@@ -188,7 +190,7 @@ export default class extends Controller {
const header = `
<div class="flex items-center justify-between mb-2">
<div class="flex items-center">
<span class="font-medium">${serviceName}</span>
<span class="font-medium">${serviceName}${supportsCanine ? '<span class="ml-2 mr-1">+</span><img src="/images/logo-full.png" class="inline h-8" />' : ''}</span>
</div>
<div class="text-emerald-400 font-semibold total-cost">${total == 0 ? 'FREE' : `$${total}.00`}</div>
</div>

View File

@@ -15,8 +15,8 @@ export default class extends Controller {
showConnectionInstructions(event) {
event.preventDefault();
const text = `KUBECONFIG=/path/to/kubeconfig.yml kubectl exec -it -n ${event.target.dataset.namespace} ${event.target.dataset.podName} -- /bin/bash`
const text = `KUBECONFIG=/path/to/${event.target.dataset.clusterName}-kubeconfig.yml kubectl exec -it -n ${event.target.dataset.namespace} ${event.target.dataset.podName} -- /bin/bash`
this.commandTarget.textContent = text
click_outside_modal.showModal()
}
}
}