chore: Integrate compositetypes into route

This commit is contained in:
Susmitha Girumala committed 2022-02-01 22:35:00 -05:00
1 parent 137f4ee3c8
commit f7a2dd14e3
9 files changed
+205 -156

No files matched your search

+1 -1
View File
@@ -26,7 +26,7 @@ export default class HostCatalogModel extends GeneratedHostCatalogModel {
* @type {boolean}
*/
get isUnknown() {
return this.isPlugin && !types.includes(this.plugin.name);
return this.isPlugin && !types.includes(this.plugin?.name);
}
/**
@@ -2,6 +2,8 @@
@onSubmit={{@submit}}
@cancel={{@cancel}}
@disabled={{@model.isSaving}}
@error={{@model.errors.base}}
@showEditToggle={{if @model.isNew false true}}
as |form|
>
<form.input
@@ -42,32 +44,33 @@
</field.errors>
{{/if}}
</form.textarea>
<form.fieldset>
<:title>{{t 'form.type.label'}}</:title>
<:body>
<form.radioGroup
@name='aws-types'
@changed={{@toggleType}}
@selectedValue='dynamic'
as |radioGroup|
>
<radioGroup.card
@label={{t 'resources.host-catalog.types.static'}}
@value='static'
@helperText={{t 'resources.host-catalog.form.types.static.help'}}
@layout='wide'
/>
<radioGroup.card
@label={{t 'resources.host-catalog.types.dynamic'}}
@value='dynamic'
@helperText={{t 'resources.host-catalog.form.types.dynamic.help'}}
@layout='wide'
/>
</form.radioGroup>
</:body>
</form.fieldset>
{{#if @model.isNew}}
<form.fieldset>
<:title>{{t 'form.type.label'}}</:title>
<:body>
<form.radioGroup
@name='types'
@selectedValue={{@model.type}}
@changed={{route-action 'changeType'}}
as |radioGroup|
>
<radioGroup.card
@label={{t 'resources.host-catalog.types.static'}}
@value='static'
@helperText={{t 'resources.host-catalog.form.types.static.help'}}
@layout='wide'
/>
<radioGroup.card
@label={{t 'resources.host-catalog.types.dynamic'}}
@value='plugin'
@helperText={{t 'resources.host-catalog.form.types.dynamic.help'}}
@layout='wide'
/>
</form.radioGroup>
</:body>
</form.fieldset>
{{#if @showDynamicPlugins}}
<form.fieldset>
<:title>{{t 'resources.host-catalog.form.provider-details'}}</:title>
<:body>
@@ -92,13 +95,32 @@
</form.radioGroup>
</:body>
</form.fieldset>
{{else}}
<form.fieldset>
<:title>{{t 'resources.host-catalog.form.provider-details'}}</:title>
<:body>
<form.radioGroup
@name='aws-plugin'
@selectedValue={{@model.compositeType}}
@disabled={{true}}
as |radioGroup|
>
<radioGroup.card
@label='AWS'
@value='aws'
@helperText={{t 'resources.host-catalog.form.types.static.help'}}
@layout='tile'
/>
</form.radioGroup>
</:body>
</form.fieldset>
{{/if}}
<form.input
@name='Region'
@type='region'
@value='region'
@label='Region'
@label='AWS Region'
readonly={{false}}
/>
@@ -2,6 +2,9 @@
@onSubmit={{@submit}}
@cancel={{@cancel}}
@disabled={{@model.isSaving}}
@disabled={{@model.isSaving}}
@error={{@model.errors.base}}
@showEditToggle={{if @model.isNew false true}}
as |form|
>
<form.input
@@ -42,32 +45,33 @@
</field.errors>
{{/if}}
</form.textarea>
<form.fieldset>
<:title>{{t 'form.type.label'}}</:title>
<:body>
<form.radioGroup
@name='aws-types'
@changed={{@toggleType}}
@selectedValue='dynamic'
as |radioGroup|
>
<radioGroup.card
@label={{t 'resources.host-catalog.types.static'}}
@value='static'
@helperText={{t 'resources.host-catalog.form.types.static.help'}}
@layout='wide'
/>
<radioGroup.card
@label={{t 'resources.host-catalog.types.dynamic'}}
@value='dynamic'
@helperText={{t 'resources.host-catalog.form.types.dynamic.help'}}
@layout='wide'
/>
</form.radioGroup>
</:body>
</form.fieldset>
{{#if @model.isNew}}
<form.fieldset>
<:title>{{t 'form.type.label'}}</:title>
<:body>
<form.radioGroup
@name='types'
@selectedValue={{@model.type}}
@changed={{route-action 'changeType'}}
as |radioGroup|
>
<radioGroup.card
@label={{t 'resources.host-catalog.types.static'}}
@value='static'
@helperText={{t 'resources.host-catalog.form.types.static.help'}}
@layout='wide'
/>
<radioGroup.card
@label={{t 'resources.host-catalog.types.dynamic'}}
@value='plugin'
@helperText={{t 'resources.host-catalog.form.types.dynamic.help'}}
@layout='wide'
/>
</form.radioGroup>
</:body>
</form.fieldset>
{{#if @showDynamicPlugins}}
<form.fieldset>
<:title>{{t 'resources.host-catalog.form.provider-details'}}</:title>
<:body>
@@ -92,13 +96,32 @@
</form.radioGroup>
</:body>
</form.fieldset>
{{else}}
<form.fieldset>
<:title>{{t 'resources.host-catalog.form.provider-details'}}</:title>
<:body>
<form.radioGroup
@name='azure-plugin'
@selectedValue={{@model.compositeType}}
@disabled={{true}}
as |radioGroup|
>
<radioGroup.card
@label='Azure'
@value='azure'
@helperText={{t 'resources.host-catalog.form.types.dynamic.help'}}
@layout='tile'
/>
</form.radioGroup>
</:body>
</form.fieldset>
{{/if}}
<form.input
@name='Region'
@type='region'
@value='region'
@label='Region'
@label='Azure Region'
readonly={{false}}
/>
@@ -1,24 +1,38 @@
{{#if @model.isNew}}
<div>{{@model.type}} {{@model.compositeType}}</div>
{{#if @model.isStatic}}
{{component
(concat 'form/host-catalog/' @model.compositeType)
model=@model
submit=@submit
cancel=@cancel
toggleType=this.toggleType
showDynamicPlugins=this.showDynamicPlugins
}}
{{/if}}
{{component
(concat 'form/host-catalog/' @model.compositeType)
model=@model
submit=@submit
cancel=@cancel
changeType=@changeType
}}
{{#if this.showDynamicPlugins}}
{{component
(concat 'form/host-catalog/' @model.compositeType)
model=@model
submit=@submit
cancel=@cancel
toggleType=this.toggleType
showDynamicPlugins=this.showDynamicPlugins
}}
{{!-- {{#if @model.isStatic}}
{{component
(concat 'form/host-catalog/' @model.type)
model=@model
submit=@submit
cancel=@cancel
form=form
toggleType=this.toggleType
showDynamicPlugins=this.showDynamicPlugins
}}
{{else if @model.isPlugin}}
Model is plugin
{{#if @model.isAWS}}
Model is Aws
{{else if @model.isAzure}}
Model is Azure
{{/if}}
{{/if}}
{{/if}} --}}
{{!-- {{#if @model.type}}
{{component
(concat 'form/auth-method/' @model.type)
model=@model
submit=@submit
cancel=@cancel
removeItemByIndex=@removeItemByIndex
addStringItem=@addStringItem
addAccountClaimMapItem=@addAccountClaimMapItem
}}
{{/if}} --}}
@@ -3,27 +3,27 @@ import { action } from '@ember/object';
import { tracked } from '@glimmer/tracking';
export default class FormHostCatalogIndexComponent extends Component {
// =properties
/**
/**
*/
@tracked showDynamicPlugins = false;
// =actions
// // =properties
// /**
// /**
// */
// @tracked showDynamicPlugins = false;
// // =actions
@action
toggleType(type) {
this.renderDynamicPlugins(type);
}
//show dynamic type radio cards -> aws and azure if the type is dynamic
//call route action to update the query and rerender the model if static is selected
renderDynamicPlugins(type) {
if (type === 'dynamic') {
this.showDynamicPlugins = true;
} else {
this.showDynamicPlugins = false;
//CHECK:how to call the action to update query param
this.args.model.type = 'static';
this.args.changeType();
}
}
// @action
// toggleType(type) {
// this.renderDynamicPlugins(type);
// }
// //show dynamic type radio cards -> aws and azure if the type is dynamic
// //call route action to update the query and rerender the model if static is selected
// renderDynamicPlugins(type) {
// if (type === 'dynamic') {
// this.showDynamicPlugins = true;
// } else {
// this.showDynamicPlugins = false;
// //CHECK:how to call the action to update query param
// // this.args.model.type = 'static';
// // this.args.changeType();
// }
// }
}
@@ -2,6 +2,8 @@
@onSubmit={{@submit}}
@cancel={{@cancel}}
@disabled={{@model.isSaving}}
@error={{@model.errors.base}}
@showEditToggle={{if @model.isNew false true}}
as |form|
>
<form.input
@@ -42,55 +44,59 @@
</field.errors>
{{/if}}
</form.textarea>
<form.fieldset>
<:title>{{t 'form.type.label'}}</:title>
<:body>
<form.radioGroup
@name='types'
@selectedValue={{@model.type}}
@changed={{@toggleType}}
as |radioGroup|
>
<radioGroup.card
@label={{t 'resources.host-catalog.types.static'}}
@value='static'
@helperText={{t 'resources.host-catalog.form.types.static.help'}}
@layout='wide'
/>
<radioGroup.card
@label={{t 'resources.host-catalog.types.dynamic'}}
@value='dynamic'
@helperText={{t 'resources.host-catalog.form.types.dynamic.help'}}
@layout='wide'
/>
</form.radioGroup>
</:body>
</form.fieldset>
{{#if @showDynamicPlugins}}
{{#if @model.isNew}}
<form.fieldset>
<:title>{{t 'resources.host-catalog.form.provider-details'}}</:title>
<:title>{{t 'form.type.label'}}</:title>
<:body>
<form.radioGroup
@name='plugins'
@name='types'
@selectedValue={{@model.type}}
@changed={{route-action 'changeType'}}
as |radioGroup|
>
<radioGroup.card
@label='AWS'
@value='aws'
@label={{t 'resources.host-catalog.types.static'}}
@value='static'
@helperText={{t 'resources.host-catalog.form.types.static.help'}}
@layout='tile'
@layout='wide'
/>
<radioGroup.card
@label='Azure'
@value='azure'
@label={{t 'resources.host-catalog.types.dynamic'}}
@value='plugin'
@helperText={{t 'resources.host-catalog.form.types.dynamic.help'}}
@layout='tile'
@layout='wide'
/>
</form.radioGroup>
</:body>
</form.fieldset>
{{#if @model.isPlugin}}
<form.fieldset>
<:title>{{t 'resources.host-catalog.form.provider-details'}}</:title>
<:body>
<form.radioGroup
@name='aws-plugins'
@selectedValue={{@model.compositeType}}
@changed={{route-action 'changeType'}}
as |radioGroup|
>
<radioGroup.card
@label='AWS'
@value='aws'
@helperText={{t 'resources.host-catalog.form.types.static.help'}}
@layout='tile'
/>
<radioGroup.card
@label='Azure'
@value='azure'
@helperText={{t 'resources.host-catalog.form.types.dynamic.help'}}
@layout='tile'
/>
</form.radioGroup>
</:body>
</form.fieldset>
{{/if}}
{{/if}}
{{#if (can 'save model' @model)}}
@@ -1,23 +1,7 @@
import Controller from '@ember/controller';
import { tracked } from '@glimmer/tracking';
import { action } from '@ember/object';
export default class ScopesScopeHostCatalogsNewController extends Controller {
// =attributes
queryParams = ['type'];
@tracked showDynamicPlugins = false;
@action
async toggleType(type) {
this.renderDynamicPlugins(type);
}
renderDynamicPlugins(type) {
if (type !== 'static') {
this.showDynamicPlugins = true;
} else {
this.showDynamicPlugins = false;
}
}
}
@@ -6,12 +6,12 @@ export default class ScopesScopeHostCatalogsNewRoute extends Route {
// =services
@service router;
// =attributes
queryParams = {
type: {
refreshModel: true,
replace: true,
},
};
@@ -21,17 +21,13 @@ export default class ScopesScopeHostCatalogsNewRoute extends Route {
* Creates a new unsaved host catalog belonging to the current scope.
* @return {HostCatalogModel}
*/
model(params) {
model() {
const scopeModel = this.modelFor('scopes.scope');
if (!params.type) params.type = 'static';
return this.store.createRecord('host-catalog', {
compositeType: params.type, //static or aws or azure
scopeModel,
});
return this.store.createRecord('host-catalog', { scopeModel });
}
afterModel(model) {
this.router.replaceWith({ queryParams: { type: model.compositeType } });
afterModel(model, transition) {
this.changeType(transition.to.queryParams?.type);
}
/**
@@ -40,6 +36,10 @@ export default class ScopesScopeHostCatalogsNewRoute extends Route {
*/
@action
async changeType(type) {
const model = this.modelFor('scopes.scope.host-catalogs.new');
if(!type) type = 'static'; // Unknown host catalog type defaults to 'static'
if (model.isUnknown) type = 'aws'; //Is this the default case for plugin type?
model.compositeType = type;
await this.router.replaceWith({ queryParams: { type } });
}
}
@@ -18,7 +18,7 @@
@model={{@model}}
@submit={{route-action 'save' @model}}
@cancel={{route-action 'cancel' @model}}
@changeType={{route-action 'changeType' @model.type}}
@changeType={{route-action 'changeType' @model}}
/>
</page.body>