[UI] Add "Estimate cost button" to templates form #1678
Description
User can click a button to get an estimate of the monthly cost of a template after it has been filled out, if the template is not filled out show the usual render errors about missing value for CLUSTER_NAME etc.
Tasks breakdown
Displaying the feature
- As we can show and hide profiles / credentials show credential and profiles and kustomization depnding on new annotation Key #1626 we want to add another optional section:
templates.weave.works/cost-estimation-enabledto show / hide this section.falseby default
Interaction
- Add a button "Calculate estimate" which will call RenderTemplate on the BE and show the results
- Preview/render takes a second so show a spinner while requesting
- Any rendering error like "CLUSTER_NAME" not defined, should still be displayed so the user can fix them up
- Button should remain on the screen for user to click it again to re-estimate.
Showing estimate
- Show estimate, response will include
.range:- display
.rangeas 76 - 90 USD
- display
UI Polish that would be nice
- Clear the estimate if a param is changed
Appendix
For the curious, here are the supported currency values https://aws.amazon.com/premiumsupport/knowledge-center/supported-aws-currencies/
{
"AUD": "Australian Dollar",
"BRL": "Brazilian Real",
"CAD": "Canadian Dollar",
"CHF": "Swiss Franc",
"CNY": "Chinese Yuan (China UnionPay and Bank Redirect)",
"DKK": "Danish Krone",
"EUR": "Euro",
"GBP": "British Pound",
"HKD": "Hong Kong Dollar",
"JPY": "Japanese Yen",
"KRW": "South Korean Won",
"NOK": "Norwegian Krone",
"NZD": "New Zealand Dollar",
"SEK": "Swedish Krona",
"SGD": "Singapore Dollar",
"USD": "United States Dollar",
"ZAR": "South African Rand"
}
