@snteam/amplify-angular-core 1.0.41 → 1.0.42
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -3,7 +3,7 @@ import { Injectable, Component, Pipe, inject, Input, ChangeDetectionStrategy, mo
|
|
|
3
3
|
import * as i3$1 from '@angular/common';
|
|
4
4
|
import { CommonModule } from '@angular/common';
|
|
5
5
|
import * as i1 from '@angular/forms';
|
|
6
|
-
import { FormGroup, Validators, FormControl, ReactiveFormsModule, FormsModule } from '@angular/forms';
|
|
6
|
+
import { FormGroup, Validators, FormControl, ReactiveFormsModule, FormsModule, FormBuilder } from '@angular/forms';
|
|
7
7
|
import * as i4 from '@angular/material/input';
|
|
8
8
|
import { MatInputModule } from '@angular/material/input';
|
|
9
9
|
import * as i3 from '@angular/material/form-field';
|
|
@@ -30,9 +30,9 @@ import * as i4$1 from '@angular/router';
|
|
|
30
30
|
import { ActivatedRoute, Router } from '@angular/router';
|
|
31
31
|
import * as i5$2 from '@angular/material/tooltip';
|
|
32
32
|
import { MatTooltipModule } from '@angular/material/tooltip';
|
|
33
|
-
import * as
|
|
33
|
+
import * as i2 from '@angular/material/expansion';
|
|
34
34
|
import { MatExpansionModule } from '@angular/material/expansion';
|
|
35
|
-
import * as
|
|
35
|
+
import * as i4$2 from '@angular/material/card';
|
|
36
36
|
import { MatCardModule } from '@angular/material/card';
|
|
37
37
|
|
|
38
38
|
// Dynamic Relationship Loader Interfaces
|
|
@@ -5150,13 +5150,31 @@ class ConfigurationsComponent {
|
|
|
5150
5150
|
qcs = inject(QuestionControlService);
|
|
5151
5151
|
ams = inject(AmplifyModelService);
|
|
5152
5152
|
snackBar = inject(MatSnackBar);
|
|
5153
|
+
fb = inject(FormBuilder);
|
|
5153
5154
|
// Track which models exist in the schema
|
|
5154
5155
|
hasTableConfig = false;
|
|
5155
5156
|
hasFormView = false;
|
|
5156
5157
|
hasListView = false;
|
|
5157
5158
|
hasFieldConfig = false;
|
|
5159
|
+
// Relationship configuration management
|
|
5160
|
+
relationshipConfigs = [];
|
|
5161
|
+
showAddRelationshipConfig = false;
|
|
5162
|
+
editingRelationshipConfig = null;
|
|
5163
|
+
relationshipConfigForm;
|
|
5164
|
+
availableModels = [];
|
|
5165
|
+
availableFields = [];
|
|
5166
|
+
constructor() {
|
|
5167
|
+
this.relationshipConfigForm = this.fb.group({
|
|
5168
|
+
relationshipModel: ['', Validators.required],
|
|
5169
|
+
fieldName: ['', Validators.required],
|
|
5170
|
+
selectionSet: ['', Validators.required],
|
|
5171
|
+
description: ['']
|
|
5172
|
+
});
|
|
5173
|
+
}
|
|
5158
5174
|
ngOnInit() {
|
|
5159
5175
|
this.checkAvailableModels();
|
|
5176
|
+
this.loadRelationshipConfigs();
|
|
5177
|
+
this.loadAvailableModels();
|
|
5160
5178
|
}
|
|
5161
5179
|
get outputs() {
|
|
5162
5180
|
return this.amplifyOutputs || this.qcs.outputs;
|
|
@@ -5447,21 +5465,256 @@ return fields;
|
|
|
5447
5465
|
}
|
|
5448
5466
|
return 'text'; // Default fallback
|
|
5449
5467
|
}
|
|
5468
|
+
// Relationship Configuration Management Methods
|
|
5469
|
+
loadAvailableModels() {
|
|
5470
|
+
if (!this.outputs || !this.outputs.data || !this.outputs.data.model_introspection) {
|
|
5471
|
+
console.warn('ConfigurationsComponent: No model introspection data available for relationship configs');
|
|
5472
|
+
return;
|
|
5473
|
+
}
|
|
5474
|
+
const models = this.outputs.data.model_introspection.models;
|
|
5475
|
+
this.availableModels = Object.keys(models).sort();
|
|
5476
|
+
console.log('ConfigurationsComponent: Available models for relationship configs:', this.availableModels);
|
|
5477
|
+
}
|
|
5478
|
+
onRelationshipModelChange(event) {
|
|
5479
|
+
const selectedModel = event.value;
|
|
5480
|
+
this.loadAvailableFields(selectedModel);
|
|
5481
|
+
// Reset field name when model changes
|
|
5482
|
+
this.relationshipConfigForm.patchValue({ fieldName: '' });
|
|
5483
|
+
}
|
|
5484
|
+
loadAvailableFields(modelName) {
|
|
5485
|
+
if (!this.outputs || !this.outputs.data || !this.outputs.data.model_introspection) {
|
|
5486
|
+
this.availableFields = [];
|
|
5487
|
+
return;
|
|
5488
|
+
}
|
|
5489
|
+
const models = this.outputs.data.model_introspection.models;
|
|
5490
|
+
const modelData = models[modelName];
|
|
5491
|
+
if (!modelData || !modelData.fields) {
|
|
5492
|
+
this.availableFields = [];
|
|
5493
|
+
return;
|
|
5494
|
+
}
|
|
5495
|
+
// Get relationship fields from the selected model
|
|
5496
|
+
this.availableFields = Object.values(modelData.fields)
|
|
5497
|
+
.filter((field) => {
|
|
5498
|
+
// Include relationship fields (fields that reference other models)
|
|
5499
|
+
return field.association && field.association.connectionType;
|
|
5500
|
+
})
|
|
5501
|
+
.map((field) => ({
|
|
5502
|
+
name: field.name,
|
|
5503
|
+
label: this.formatFieldLabel(field.name),
|
|
5504
|
+
type: field.type
|
|
5505
|
+
}))
|
|
5506
|
+
.sort((a, b) => a.label.localeCompare(b.label));
|
|
5507
|
+
console.log('ConfigurationsComponent: Available relationship fields for', modelName, ':', this.availableFields);
|
|
5508
|
+
}
|
|
5509
|
+
loadRelationshipConfigs() {
|
|
5510
|
+
// Load from localStorage for now (could be extended to use Amplify model later)
|
|
5511
|
+
const stored = localStorage.getItem('snteam-relationship-configs');
|
|
5512
|
+
if (stored) {
|
|
5513
|
+
try {
|
|
5514
|
+
const config = JSON.parse(stored);
|
|
5515
|
+
this.relationshipConfigs = (config.relationships || []).map(rel => ({
|
|
5516
|
+
...rel,
|
|
5517
|
+
id: rel.id || this.generateId()
|
|
5518
|
+
}));
|
|
5519
|
+
console.log('ConfigurationsComponent: Loaded relationship configs:', this.relationshipConfigs);
|
|
5520
|
+
}
|
|
5521
|
+
catch (error) {
|
|
5522
|
+
console.error('ConfigurationsComponent: Error loading relationship configs:', error);
|
|
5523
|
+
this.relationshipConfigs = [];
|
|
5524
|
+
}
|
|
5525
|
+
}
|
|
5526
|
+
else {
|
|
5527
|
+
this.relationshipConfigs = [];
|
|
5528
|
+
}
|
|
5529
|
+
}
|
|
5530
|
+
saveRelationshipConfigsToStorage() {
|
|
5531
|
+
const config = {
|
|
5532
|
+
relationships: this.relationshipConfigs.map(({ id, ...config }) => config),
|
|
5533
|
+
defaultSelectionSet: ['id'],
|
|
5534
|
+
enableFallback: true
|
|
5535
|
+
};
|
|
5536
|
+
localStorage.setItem('snteam-relationship-configs', JSON.stringify(config));
|
|
5537
|
+
// Update the AmplifyModelService with the new configuration
|
|
5538
|
+
this.ams.setRelationshipConfig(config);
|
|
5539
|
+
console.log('ConfigurationsComponent: Saved relationship configs to storage and updated service');
|
|
5540
|
+
}
|
|
5541
|
+
saveRelationshipConfig() {
|
|
5542
|
+
if (!this.relationshipConfigForm.valid) {
|
|
5543
|
+
this.snackBar.open('Please fill in all required fields', 'Dismiss', { duration: 3000 });
|
|
5544
|
+
return;
|
|
5545
|
+
}
|
|
5546
|
+
const formValue = this.relationshipConfigForm.value;
|
|
5547
|
+
// Parse selection set from textarea (one field per line)
|
|
5548
|
+
const selectionSet = formValue.selectionSet
|
|
5549
|
+
.split('\n')
|
|
5550
|
+
.map((line) => line.trim())
|
|
5551
|
+
.filter((line) => line.length > 0);
|
|
5552
|
+
const config = {
|
|
5553
|
+
relationshipModel: formValue.relationshipModel,
|
|
5554
|
+
fieldName: formValue.fieldName,
|
|
5555
|
+
selectionSet: selectionSet,
|
|
5556
|
+
description: formValue.description || undefined,
|
|
5557
|
+
id: this.editingRelationshipConfig?.id || this.generateId()
|
|
5558
|
+
};
|
|
5559
|
+
if (this.editingRelationshipConfig) {
|
|
5560
|
+
// Update existing configuration
|
|
5561
|
+
const index = this.relationshipConfigs.findIndex(c => c.id === this.editingRelationshipConfig.id);
|
|
5562
|
+
if (index >= 0) {
|
|
5563
|
+
this.relationshipConfigs[index] = config;
|
|
5564
|
+
this.snackBar.open('Relationship configuration updated successfully', 'Dismiss', { duration: 3000 });
|
|
5565
|
+
}
|
|
5566
|
+
}
|
|
5567
|
+
else {
|
|
5568
|
+
// Check for duplicate configuration
|
|
5569
|
+
const existing = this.relationshipConfigs.find(c => c.relationshipModel === config.relationshipModel &&
|
|
5570
|
+
c.fieldName === config.fieldName);
|
|
5571
|
+
if (existing) {
|
|
5572
|
+
this.snackBar.open('Configuration for this relationship already exists', 'Dismiss', { duration: 3000 });
|
|
5573
|
+
return;
|
|
5574
|
+
}
|
|
5575
|
+
// Add new configuration
|
|
5576
|
+
this.relationshipConfigs.push(config);
|
|
5577
|
+
this.snackBar.open('Relationship configuration added successfully', 'Dismiss', { duration: 3000 });
|
|
5578
|
+
}
|
|
5579
|
+
this.saveRelationshipConfigsToStorage();
|
|
5580
|
+
this.cancelRelationshipConfigEdit();
|
|
5581
|
+
}
|
|
5582
|
+
editRelationshipConfig(config) {
|
|
5583
|
+
this.editingRelationshipConfig = config;
|
|
5584
|
+
this.showAddRelationshipConfig = true;
|
|
5585
|
+
// Load fields for the selected model
|
|
5586
|
+
this.loadAvailableFields(config.relationshipModel);
|
|
5587
|
+
// Populate form with existing values
|
|
5588
|
+
this.relationshipConfigForm.patchValue({
|
|
5589
|
+
relationshipModel: config.relationshipModel,
|
|
5590
|
+
fieldName: config.fieldName,
|
|
5591
|
+
selectionSet: config.selectionSet.join('\n'),
|
|
5592
|
+
description: config.description || ''
|
|
5593
|
+
});
|
|
5594
|
+
}
|
|
5595
|
+
deleteRelationshipConfig(config) {
|
|
5596
|
+
const index = this.relationshipConfigs.findIndex(c => c.id === config.id);
|
|
5597
|
+
if (index >= 0) {
|
|
5598
|
+
this.relationshipConfigs.splice(index, 1);
|
|
5599
|
+
this.saveRelationshipConfigsToStorage();
|
|
5600
|
+
this.snackBar.open('Relationship configuration deleted', 'Dismiss', { duration: 3000 });
|
|
5601
|
+
}
|
|
5602
|
+
}
|
|
5603
|
+
generateId() {
|
|
5604
|
+
return 'config_' + Date.now() + '_' + Math.random().toString(36).substr(2, 9);
|
|
5605
|
+
}
|
|
5606
|
+
cancelRelationshipConfigEdit() {
|
|
5607
|
+
this.showAddRelationshipConfig = false;
|
|
5608
|
+
this.editingRelationshipConfig = null;
|
|
5609
|
+
this.relationshipConfigForm.reset();
|
|
5610
|
+
this.availableFields = [];
|
|
5611
|
+
}
|
|
5612
|
+
loadDefaultRelationshipConfigs() {
|
|
5613
|
+
// Load some sensible default configurations
|
|
5614
|
+
const defaultConfigs = [
|
|
5615
|
+
{
|
|
5616
|
+
id: this.generateId(),
|
|
5617
|
+
relationshipModel: 'ListView',
|
|
5618
|
+
fieldName: 'table',
|
|
5619
|
+
selectionSet: [
|
|
5620
|
+
'id',
|
|
5621
|
+
'table',
|
|
5622
|
+
'table.id',
|
|
5623
|
+
'table.name',
|
|
5624
|
+
'table.title',
|
|
5625
|
+
'table.description'
|
|
5626
|
+
],
|
|
5627
|
+
description: 'Configuration for ListView -> Table relationship'
|
|
5628
|
+
},
|
|
5629
|
+
{
|
|
5630
|
+
id: this.generateId(),
|
|
5631
|
+
relationshipModel: 'FormViewField',
|
|
5632
|
+
fieldName: 'formView',
|
|
5633
|
+
selectionSet: [
|
|
5634
|
+
'id',
|
|
5635
|
+
'formView',
|
|
5636
|
+
'formView.id',
|
|
5637
|
+
'formView.name',
|
|
5638
|
+
'formView.title',
|
|
5639
|
+
'formView.description'
|
|
5640
|
+
],
|
|
5641
|
+
description: 'Configuration for FormViewField -> FormView relationship'
|
|
5642
|
+
},
|
|
5643
|
+
{
|
|
5644
|
+
id: this.generateId(),
|
|
5645
|
+
relationshipModel: 'ServiceCustomer',
|
|
5646
|
+
fieldName: 'service',
|
|
5647
|
+
selectionSet: [
|
|
5648
|
+
'id',
|
|
5649
|
+
'service',
|
|
5650
|
+
'service.id',
|
|
5651
|
+
'service.title',
|
|
5652
|
+
'service.cost',
|
|
5653
|
+
'service.price'
|
|
5654
|
+
],
|
|
5655
|
+
description: 'Configuration for ServiceCustomer -> Service relationship'
|
|
5656
|
+
},
|
|
5657
|
+
{
|
|
5658
|
+
id: this.generateId(),
|
|
5659
|
+
relationshipModel: 'ServiceCustomer',
|
|
5660
|
+
fieldName: 'customer',
|
|
5661
|
+
selectionSet: [
|
|
5662
|
+
'id',
|
|
5663
|
+
'customer',
|
|
5664
|
+
'customer.id',
|
|
5665
|
+
'customer.name',
|
|
5666
|
+
'customer.contact_preference'
|
|
5667
|
+
],
|
|
5668
|
+
description: 'Configuration for ServiceCustomer -> Customer relationship'
|
|
5669
|
+
}
|
|
5670
|
+
];
|
|
5671
|
+
// Only add configs that don't already exist
|
|
5672
|
+
let addedCount = 0;
|
|
5673
|
+
for (const defaultConfig of defaultConfigs) {
|
|
5674
|
+
const existing = this.relationshipConfigs.find(c => c.relationshipModel === defaultConfig.relationshipModel &&
|
|
5675
|
+
c.fieldName === defaultConfig.fieldName);
|
|
5676
|
+
if (!existing) {
|
|
5677
|
+
this.relationshipConfigs.push(defaultConfig);
|
|
5678
|
+
addedCount++;
|
|
5679
|
+
}
|
|
5680
|
+
}
|
|
5681
|
+
if (addedCount > 0) {
|
|
5682
|
+
this.saveRelationshipConfigsToStorage();
|
|
5683
|
+
this.snackBar.open(`Added ${addedCount} default relationship configurations`, 'Dismiss', { duration: 3000 });
|
|
5684
|
+
}
|
|
5685
|
+
else {
|
|
5686
|
+
this.snackBar.open('All default configurations already exist', 'Dismiss', { duration: 3000 });
|
|
5687
|
+
}
|
|
5688
|
+
}
|
|
5689
|
+
clearAllRelationshipConfigs() {
|
|
5690
|
+
if (this.relationshipConfigs.length === 0) {
|
|
5691
|
+
this.snackBar.open('No relationship configurations to clear', 'Dismiss', { duration: 3000 });
|
|
5692
|
+
return;
|
|
5693
|
+
}
|
|
5694
|
+
this.relationshipConfigs = [];
|
|
5695
|
+
this.saveRelationshipConfigsToStorage();
|
|
5696
|
+
this.snackBar.open('All relationship configurations cleared', 'Dismiss', { duration: 3000 });
|
|
5697
|
+
}
|
|
5450
5698
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ConfigurationsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5451
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: ConfigurationsComponent, isStandalone: true, selector: "snteam-configurations", inputs: { amplifyOutputs: "amplifyOutputs" }, ngImport: i0, template: "<div class=\"configurations-container\">\n <h2>System Configurations</h2>\n \n <mat-accordion multi=\"true\">\n \n <!-- Table Configs Section -->\n <mat-expansion-panel>\n <mat-expansion-panel-header>\n <mat-panel-title>\n <mat-icon>table_chart</mat-icon>\n <span class=\"panel-title\">Table Configs</span>\n </mat-panel-title>\n <mat-panel-description>\n Manage table configurations and settings\n </mat-panel-description>\n </mat-expansion-panel-header>\n \n <div class=\"panel-content\">\n @if (hasTableConfig) {\n <div class=\"section-actions\">\n <button mat-raised-button color=\"accent\" (click)=\"populateDefaultTableConfigs()\" class=\"populate-button\">\n <mat-icon>auto_fix_high</mat-icon>\n Populate Default Table Configs\n </button>\n <button mat-raised-button color=\"warn\" (click)=\"deleteTableConfigs()\" class=\"delete-button\">\n <mat-icon>delete</mat-icon>\n Delete All Table Configs\n </button>\n </div>\n <snteam-list-view \n [modelName]=\"'TableConfig'\"\n [useRouter]=\"true\"\n [showDeleteAction]=\"true\">\n </snteam-list-view>\n } @else {\n <mat-card class=\"error-card\">\n <mat-card-content>\n <mat-icon class=\"error-icon\">error_outline</mat-icon>\n <h3>TableConfig Model Not Found</h3>\n <p>The TableConfig model is not available in your Amplify schema. Please add it to your data model to manage table configurations.</p>\n <button mat-raised-button color=\"primary\" class=\"help-button\">\n <mat-icon>help</mat-icon>\n View Documentation\n </button>\n </mat-card-content>\n </mat-card>\n }\n </div>\n </mat-expansion-panel>\n\n <!-- Form Views Section -->\n <mat-expansion-panel>\n <mat-expansion-panel-header>\n <mat-panel-title>\n <mat-icon>dynamic_form</mat-icon>\n <span class=\"panel-title\">Form Views</span>\n </mat-panel-title>\n <mat-panel-description>\n Configure custom form layouts and field selections\n </mat-panel-description>\n </mat-expansion-panel-header>\n \n <div class=\"panel-content\">\n @if (hasFormView) {\n <div class=\"section-actions\">\n <button mat-raised-button color=\"warn\" (click)=\"deleteFormViews()\" class=\"delete-button\">\n <mat-icon>delete</mat-icon>\n Delete All Form Views\n </button>\n </div>\n <snteam-list-view \n [modelName]=\"'FormView'\"\n [useRouter]=\"true\"\n [showDeleteAction]=\"true\">\n </snteam-list-view>\n } @else {\n <mat-card class=\"error-card\">\n <mat-card-content>\n <mat-icon class=\"error-icon\">error_outline</mat-icon>\n <h3>FormView Model Not Found</h3>\n <p>The FormView model is not available in your Amplify schema. Please add it to your data model to create custom form configurations.</p>\n <button mat-raised-button color=\"primary\" class=\"help-button\">\n <mat-icon>help</mat-icon>\n View Documentation\n </button>\n </mat-card-content>\n </mat-card>\n }\n </div>\n </mat-expansion-panel>\n\n <!-- List Views Section -->\n <mat-expansion-panel>\n <mat-expansion-panel-header>\n <mat-panel-title>\n <mat-icon>view_list</mat-icon>\n <span class=\"panel-title\">List Views</span>\n </mat-panel-title>\n <mat-panel-description>\n Customize list displays and column configurations\n </mat-panel-description>\n </mat-expansion-panel-header>\n \n <div class=\"panel-content\">\n @if (hasListView) {\n <div class=\"section-actions\">\n <button mat-raised-button color=\"warn\" (click)=\"deleteListViews()\" class=\"delete-button\">\n <mat-icon>delete</mat-icon>\n Delete All List Views\n </button>\n </div>\n <snteam-list-view \n [modelName]=\"'ListView'\"\n [useRouter]=\"true\"\n [showDeleteAction]=\"true\">\n </snteam-list-view>\n } @else {\n <mat-card class=\"error-card\">\n <mat-card-content>\n <mat-icon class=\"error-icon\">error_outline</mat-icon>\n <h3>ListView Model Not Found</h3>\n <p>The ListView model is not available in your Amplify schema. Please add it to your data model to create custom list view configurations.</p>\n <button mat-raised-button color=\"primary\" class=\"help-button\">\n <mat-icon>help</mat-icon>\n View Documentation\n </button>\n </mat-card-content>\n </mat-card>\n }\n </div>\n </mat-expansion-panel>\n\n <!-- Field Configs Section -->\n <mat-expansion-panel>\n <mat-expansion-panel-header>\n <mat-panel-title>\n <mat-icon>settings</mat-icon>\n <span class=\"panel-title\">Field Configs</span>\n </mat-panel-title>\n <mat-panel-description>\n Configure field behavior, validation, and choices\n </mat-panel-description>\n </mat-expansion-panel-header>\n \n <div class=\"panel-content\">\n @if (hasFieldConfig) {\n <div class=\"section-actions\">\n <button mat-raised-button color=\"accent\" (click)=\"populateDefaultFieldConfigs()\" class=\"populate-button\">\n <mat-icon>auto_fix_high</mat-icon>\n Populate Default Field Configs\n </button>\n <button mat-raised-button color=\"warn\" (click)=\"deleteFieldConfigs()\" class=\"delete-button\">\n <mat-icon>delete</mat-icon>\n Delete All Field Configs\n </button>\n </div>\n <snteam-list-view \n [modelName]=\"'FieldConfig'\"\n [useRouter]=\"true\"\n [showDeleteAction]=\"true\">\n </snteam-list-view>\n } @else {\n <mat-card class=\"error-card\">\n <mat-card-content>\n <mat-icon class=\"error-icon\">error_outline</mat-icon>\n <h3>FieldConfig Model Not Found</h3>\n <p>The FieldConfig model is not available in your Amplify schema. Please add it to your data model to configure field behavior and validation.</p>\n <button mat-raised-button color=\"primary\" class=\"help-button\">\n <mat-icon>help</mat-icon>\n View Documentation\n </button>\n </mat-card-content>\n </mat-card>\n }\n </div>\n </mat-expansion-panel>\n\n </mat-accordion>\n</div>", styles: [".configurations-container{padding:20px;max-width:1200px;margin:0 auto}.configurations-container h2{margin-bottom:24px;color:#333;font-weight:500}.mat-expansion-panel{margin-bottom:16px;border-radius:8px;box-shadow:0 2px 4px #0000001a}.mat-expansion-panel-header{padding:16px 24px}.panel-title{margin-left:12px;font-weight:500;font-size:16px}.mat-panel-description{color:#666;font-size:14px}.panel-content{padding:16px 24px 24px;background-color:#fafafa}.error-card{text-align:center;padding:24px;background-color:#fff;border:2px dashed #ddd;border-radius:8px}.error-card mat-card-content{padding:0}.error-icon{font-size:48px;width:48px;height:48px;color:#ff9800;margin-bottom:16px}.error-card h3{margin:0 0 12px;color:#333;font-weight:500}.error-card p{color:#666;line-height:1.5;max-width:500px;margin:0 auto 20px}.help-button{margin-top:8px}.help-button mat-icon{margin-right:8px}.section-actions{margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid #e0e0e0;display:flex;gap:12px;flex-wrap:wrap}.generate-button{background-color:#2196f3;color:#fff}.generate-button mat-icon{margin-right:8px}.delete-button{background-color:#f44336;color:#fff}.delete-button mat-icon{margin-right:8px}.populate-button mat-icon{margin-right:8px}@media (max-width: 768px){.configurations-container{padding:16px}.panel-content{padding:12px 16px 16px}.error-card{padding:16px}.error-icon{font-size:36px;width:36px;height:36px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i1$1.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i1$1.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i1$1.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i1$1.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i1$1.MatExpansionPanelDescription, selector: "mat-panel-description" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i3$5.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i3$5.MatCardContent, selector: "mat-card-content" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3$3.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatSnackBarModule }, { kind: "component", type: ListViewComponent, selector: "snteam-list-view", inputs: ["modelName", "customItemTemplate", "hideNewButton", "title", "useRouter", "showRowActions", "showDeleteAction", "customRowActions"], outputs: ["itemClick", "newClick", "itemsLoaded", "itemDeleted"] }] });
|
|
5699
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: ConfigurationsComponent, isStandalone: true, selector: "snteam-configurations", inputs: { amplifyOutputs: "amplifyOutputs" }, ngImport: i0, template: "<div class=\"configurations-container\">\n <h2>System Configurations</h2>\n \n <mat-accordion multi=\"true\">\n \n <!-- Table Configs Section -->\n <mat-expansion-panel>\n <mat-expansion-panel-header>\n <mat-panel-title>\n <mat-icon>table_chart</mat-icon>\n <span class=\"panel-title\">Table Configs</span>\n </mat-panel-title>\n <mat-panel-description>\n Manage table configurations and settings\n </mat-panel-description>\n </mat-expansion-panel-header>\n \n <div class=\"panel-content\">\n @if (hasTableConfig) {\n <div class=\"section-actions\">\n <button mat-raised-button color=\"accent\" (click)=\"populateDefaultTableConfigs()\" class=\"populate-button\">\n <mat-icon>auto_fix_high</mat-icon>\n Populate Default Table Configs\n </button>\n <button mat-raised-button color=\"warn\" (click)=\"deleteTableConfigs()\" class=\"delete-button\">\n <mat-icon>delete</mat-icon>\n Delete All Table Configs\n </button>\n </div>\n <snteam-list-view \n [modelName]=\"'TableConfig'\"\n [useRouter]=\"true\"\n [showDeleteAction]=\"true\">\n </snteam-list-view>\n } @else {\n <mat-card class=\"error-card\">\n <mat-card-content>\n <mat-icon class=\"error-icon\">error_outline</mat-icon>\n <h3>TableConfig Model Not Found</h3>\n <p>The TableConfig model is not available in your Amplify schema. Please add it to your data model to manage table configurations.</p>\n <button mat-raised-button color=\"primary\" class=\"help-button\">\n <mat-icon>help</mat-icon>\n View Documentation\n </button>\n </mat-card-content>\n </mat-card>\n }\n </div>\n </mat-expansion-panel>\n\n <!-- Form Views Section -->\n <mat-expansion-panel>\n <mat-expansion-panel-header>\n <mat-panel-title>\n <mat-icon>dynamic_form</mat-icon>\n <span class=\"panel-title\">Form Views</span>\n </mat-panel-title>\n <mat-panel-description>\n Configure custom form layouts and field selections\n </mat-panel-description>\n </mat-expansion-panel-header>\n \n <div class=\"panel-content\">\n @if (hasFormView) {\n <div class=\"section-actions\">\n <button mat-raised-button color=\"warn\" (click)=\"deleteFormViews()\" class=\"delete-button\">\n <mat-icon>delete</mat-icon>\n Delete All Form Views\n </button>\n </div>\n <snteam-list-view \n [modelName]=\"'FormView'\"\n [useRouter]=\"true\"\n [showDeleteAction]=\"true\">\n </snteam-list-view>\n } @else {\n <mat-card class=\"error-card\">\n <mat-card-content>\n <mat-icon class=\"error-icon\">error_outline</mat-icon>\n <h3>FormView Model Not Found</h3>\n <p>The FormView model is not available in your Amplify schema. Please add it to your data model to create custom form configurations.</p>\n <button mat-raised-button color=\"primary\" class=\"help-button\">\n <mat-icon>help</mat-icon>\n View Documentation\n </button>\n </mat-card-content>\n </mat-card>\n }\n </div>\n </mat-expansion-panel>\n\n <!-- List Views Section -->\n <mat-expansion-panel>\n <mat-expansion-panel-header>\n <mat-panel-title>\n <mat-icon>view_list</mat-icon>\n <span class=\"panel-title\">List Views</span>\n </mat-panel-title>\n <mat-panel-description>\n Customize list displays and column configurations\n </mat-panel-description>\n </mat-expansion-panel-header>\n \n <div class=\"panel-content\">\n @if (hasListView) {\n <div class=\"section-actions\">\n <button mat-raised-button color=\"warn\" (click)=\"deleteListViews()\" class=\"delete-button\">\n <mat-icon>delete</mat-icon>\n Delete All List Views\n </button>\n </div>\n <snteam-list-view \n [modelName]=\"'ListView'\"\n [useRouter]=\"true\"\n [showDeleteAction]=\"true\">\n </snteam-list-view>\n } @else {\n <mat-card class=\"error-card\">\n <mat-card-content>\n <mat-icon class=\"error-icon\">error_outline</mat-icon>\n <h3>ListView Model Not Found</h3>\n <p>The ListView model is not available in your Amplify schema. Please add it to your data model to create custom list view configurations.</p>\n <button mat-raised-button color=\"primary\" class=\"help-button\">\n <mat-icon>help</mat-icon>\n View Documentation\n </button>\n </mat-card-content>\n </mat-card>\n }\n </div>\n </mat-expansion-panel>\n\n <!-- Field Configs Section -->\n <mat-expansion-panel>\n <mat-expansion-panel-header>\n <mat-panel-title>\n <mat-icon>settings</mat-icon>\n <span class=\"panel-title\">Field Configs</span>\n </mat-panel-title>\n <mat-panel-description>\n Configure field behavior, validation, and choices\n </mat-panel-description>\n </mat-expansion-panel-header>\n \n <div class=\"panel-content\">\n @if (hasFieldConfig) {\n <div class=\"section-actions\">\n <button mat-raised-button color=\"accent\" (click)=\"populateDefaultFieldConfigs()\" class=\"populate-button\">\n <mat-icon>auto_fix_high</mat-icon>\n Populate Default Field Configs\n </button>\n <button mat-raised-button color=\"warn\" (click)=\"deleteFieldConfigs()\" class=\"delete-button\">\n <mat-icon>delete</mat-icon>\n Delete All Field Configs\n </button>\n </div>\n <snteam-list-view \n [modelName]=\"'FieldConfig'\"\n [useRouter]=\"true\"\n [showDeleteAction]=\"true\">\n </snteam-list-view>\n } @else {\n <mat-card class=\"error-card\">\n <mat-card-content>\n <mat-icon class=\"error-icon\">error_outline</mat-icon>\n <h3>FieldConfig Model Not Found</h3>\n <p>The FieldConfig model is not available in your Amplify schema. Please add it to your data model to configure field behavior and validation.</p>\n <button mat-raised-button color=\"primary\" class=\"help-button\">\n <mat-icon>help</mat-icon>\n View Documentation\n </button>\n </mat-card-content>\n </mat-card>\n }\n </div>\n </mat-expansion-panel>\n\n <!-- Relationship Configs Section -->\n <mat-expansion-panel>\n <mat-expansion-panel-header>\n <mat-panel-title>\n <mat-icon>link</mat-icon>\n <span class=\"panel-title\">Relationship Configs</span>\n </mat-panel-title>\n <mat-panel-description>\n Configure GraphQL selection sets for relationship queries\n </mat-panel-description>\n </mat-expansion-panel-header>\n \n <div class=\"panel-content\">\n <div class=\"section-actions\">\n <button mat-raised-button color=\"primary\" (click)=\"showAddRelationshipConfig = !showAddRelationshipConfig\" class=\"add-button\">\n <mat-icon>{{ showAddRelationshipConfig ? 'close' : 'add' }}</mat-icon>\n {{ showAddRelationshipConfig ? 'Cancel' : 'Add Relationship Config' }}\n </button>\n <button mat-raised-button color=\"accent\" (click)=\"loadDefaultRelationshipConfigs()\" class=\"populate-button\">\n <mat-icon>auto_fix_high</mat-icon>\n Load Default Configs\n </button>\n <button mat-raised-button color=\"warn\" (click)=\"clearAllRelationshipConfigs()\" class=\"delete-button\">\n <mat-icon>delete</mat-icon>\n Clear All Configs\n </button>\n </div>\n\n <!-- Add/Edit Relationship Config Form -->\n @if (showAddRelationshipConfig) {\n <mat-card class=\"config-form-card\">\n <mat-card-header>\n <mat-card-title>\n <mat-icon>{{ editingRelationshipConfig ? 'edit' : 'add' }}</mat-icon>\n {{ editingRelationshipConfig ? 'Edit' : 'Add' }} Relationship Configuration\n </mat-card-title>\n </mat-card-header>\n <mat-card-content>\n <form [formGroup]=\"relationshipConfigForm\" (ngSubmit)=\"saveRelationshipConfig()\">\n <div class=\"form-row\">\n <mat-form-field appearance=\"outline\" class=\"full-width\">\n <mat-label>Relationship Model</mat-label>\n <mat-select formControlName=\"relationshipModel\" (selectionChange)=\"onRelationshipModelChange($event)\">\n @for (model of availableModels; track model) {\n <mat-option [value]=\"model\">{{ model }}</mat-option>\n }\n </mat-select>\n <mat-hint>The model that contains the relationship field</mat-hint>\n </mat-form-field>\n </div>\n\n <div class=\"form-row\">\n <mat-form-field appearance=\"outline\" class=\"full-width\">\n <mat-label>Field Name</mat-label>\n <mat-select formControlName=\"fieldName\">\n @for (field of availableFields; track field.name) {\n <mat-option [value]=\"field.name\">{{ field.label }}</mat-option>\n }\n </mat-select>\n <mat-hint>The relationship field in the selected model</mat-hint>\n </mat-form-field>\n </div>\n\n <div class=\"form-row\">\n <mat-form-field appearance=\"outline\" class=\"full-width\">\n <mat-label>Selection Set</mat-label>\n <textarea \n matInput \n formControlName=\"selectionSet\" \n rows=\"6\"\n placeholder=\"Enter GraphQL selection fields, one per line: id table table.id table.name table.title\">\n </textarea>\n <mat-hint>GraphQL fields to select for this relationship (one per line)</mat-hint>\n </mat-form-field>\n </div>\n\n <div class=\"form-row\">\n <mat-form-field appearance=\"outline\" class=\"full-width\">\n <mat-label>Description</mat-label>\n <input matInput formControlName=\"description\" placeholder=\"Optional description for this configuration\">\n <mat-hint>Optional description to document this configuration</mat-hint>\n </mat-form-field>\n </div>\n\n <div class=\"form-actions\">\n <button mat-raised-button color=\"primary\" type=\"submit\" [disabled]=\"!relationshipConfigForm.valid\">\n <mat-icon>save</mat-icon>\n {{ editingRelationshipConfig ? 'Update' : 'Save' }} Configuration\n </button>\n <button mat-button type=\"button\" (click)=\"cancelRelationshipConfigEdit()\">\n <mat-icon>cancel</mat-icon>\n Cancel\n </button>\n </div>\n </form>\n </mat-card-content>\n </mat-card>\n }\n\n <!-- Current Relationship Configurations -->\n <div class=\"current-configs\">\n <h3>Current Relationship Configurations</h3>\n @if (relationshipConfigs.length === 0) {\n <mat-card class=\"empty-state-card\">\n <mat-card-content>\n <mat-icon class=\"empty-icon\">link_off</mat-icon>\n <h4>No Relationship Configurations</h4>\n <p>Add relationship configurations to control GraphQL selection sets for relationship queries.</p>\n </mat-card-content>\n </mat-card>\n } @else {\n <div class=\"configs-list\">\n @for (config of relationshipConfigs; track config.id) {\n <mat-card class=\"config-card\">\n <mat-card-header>\n <mat-card-title>{{ config.relationshipModel }} \u2192 {{ config.fieldName }}</mat-card-title>\n <mat-card-subtitle>{{ config.description || 'No description' }}</mat-card-subtitle>\n <div class=\"card-actions\">\n <button mat-icon-button (click)=\"editRelationshipConfig(config)\" matTooltip=\"Edit Configuration\">\n <mat-icon>edit</mat-icon>\n </button>\n <button mat-icon-button color=\"warn\" (click)=\"deleteRelationshipConfig(config)\" matTooltip=\"Delete Configuration\">\n <mat-icon>delete</mat-icon>\n </button>\n </div>\n </mat-card-header>\n <mat-card-content>\n <div class=\"selection-set\">\n <strong>Selection Set:</strong>\n <div class=\"selection-fields\">\n @for (field of config.selectionSet; track field) {\n <span class=\"field-chip\">{{ field }}</span>\n }\n </div>\n </div>\n </mat-card-content>\n </mat-card>\n }\n </div>\n }\n </div>\n\n <!-- Configuration Status -->\n <div class=\"config-status\">\n <mat-card class=\"status-card\">\n <mat-card-content>\n <div class=\"status-info\">\n <mat-icon class=\"status-icon\">info</mat-icon>\n <div class=\"status-text\">\n <strong>Active Configurations: {{ relationshipConfigs.length }}</strong>\n <p>These configurations control how relationship data is queried from your GraphQL API.</p>\n </div>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </div>\n </mat-expansion-panel>\n\n </mat-accordion>\n</div>", styles: [".configurations-container{padding:20px;max-width:1200px;margin:0 auto}.configurations-container h2{margin-bottom:24px;color:#333;font-weight:500}.mat-expansion-panel{margin-bottom:16px;border-radius:8px;box-shadow:0 2px 4px #0000001a}.mat-expansion-panel-header{padding:16px 24px}.panel-title{margin-left:12px;font-weight:500;font-size:16px}.mat-panel-description{color:#666;font-size:14px}.panel-content{padding:16px 24px 24px;background-color:#fafafa}.error-card{text-align:center;padding:24px;background-color:#fff;border:2px dashed #ddd;border-radius:8px}.error-card mat-card-content{padding:0}.error-icon{font-size:48px;width:48px;height:48px;color:#ff9800;margin-bottom:16px}.error-card h3{margin:0 0 12px;color:#333;font-weight:500}.error-card p{color:#666;line-height:1.5;max-width:500px;margin:0 auto 20px}.help-button{margin-top:8px}.help-button mat-icon{margin-right:8px}.section-actions{margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid #e0e0e0;display:flex;gap:12px;flex-wrap:wrap}.generate-button{background-color:#2196f3;color:#fff}.generate-button mat-icon{margin-right:8px}.delete-button{background-color:#f44336;color:#fff}.delete-button mat-icon{margin-right:8px}.populate-button mat-icon{margin-right:8px}@media (max-width: 768px){.configurations-container{padding:16px}.panel-content{padding:12px 16px 16px}.error-card{padding:16px}.error-icon{font-size:36px;width:36px;height:36px}}.add-button{background-color:#4caf50;color:#fff}.add-button mat-icon{margin-right:8px}.config-form-card{margin:16px 0;background-color:#fff;border-radius:8px;box-shadow:0 2px 8px #0000001a}.config-form-card mat-card-header{background-color:#f5f5f5;border-radius:8px 8px 0 0;padding:16px 24px}.config-form-card mat-card-title{display:flex;align-items:center;font-size:18px;font-weight:500;color:#333}.config-form-card mat-card-title mat-icon{margin-right:12px;color:#2196f3}.config-form-card mat-card-content{padding:24px}.form-row{margin-bottom:20px}.full-width{width:100%}.form-actions{display:flex;gap:12px;margin-top:24px;padding-top:16px;border-top:1px solid #e0e0e0}.form-actions button mat-icon{margin-right:8px}.current-configs{margin-top:24px}.current-configs h3{margin-bottom:16px;color:#333;font-weight:500}.empty-state-card{text-align:center;padding:32px;background-color:#fff;border:2px dashed #ddd;border-radius:8px}.empty-state-card mat-card-content{padding:0}.empty-icon{font-size:48px;width:48px;height:48px;color:#bbb;margin-bottom:16px}.empty-state-card h4{margin:0 0 12px;color:#333;font-weight:500}.empty-state-card p{margin:0;color:#666;line-height:1.5}.configs-list{display:grid;gap:16px}.config-card{background-color:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a;transition:box-shadow .2s ease}.config-card:hover{box-shadow:0 4px 8px #00000026}.config-card mat-card-header{padding:16px 20px;border-bottom:1px solid #f0f0f0;display:flex;align-items:center;justify-content:space-between}.config-card mat-card-title{font-size:16px;font-weight:500;color:#333;margin:0}.config-card mat-card-subtitle{font-size:14px;color:#666;margin:4px 0 0}.card-actions{display:flex;gap:4px}.config-card mat-card-content{padding:16px 20px}.selection-set{margin:0}.selection-set strong{display:block;margin-bottom:8px;color:#333;font-size:14px}.selection-fields{display:flex;flex-wrap:wrap;gap:6px}.field-chip{display:inline-block;padding:4px 8px;background-color:#e3f2fd;color:#1976d2;border-radius:12px;font-size:12px;font-family:Roboto Mono,monospace;border:1px solid #bbdefb}.config-status{margin-top:24px}.status-card{background-color:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a}.status-card mat-card-content{padding:16px 20px}.status-info{display:flex;align-items:flex-start;gap:12px}.status-icon{color:#2196f3;margin-top:2px}.status-text strong{display:block;margin-bottom:4px;color:#333;font-size:16px}.status-text p{margin:0;color:#666;font-size:14px;line-height:1.5}@media (max-width: 768px){.config-form-card mat-card-content{padding:16px}.form-actions{flex-direction:column}.form-actions button{width:100%}.config-card mat-card-header{flex-direction:column;align-items:flex-start;gap:8px}.card-actions{align-self:flex-end}.selection-fields{gap:4px}.field-chip{font-size:11px;padding:3px 6px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i2.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i2.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i2.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i2.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i2.MatExpansionPanelDescription, selector: "mat-panel-description" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i4$2.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i4$2.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i4$2.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i4$2.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }, { kind: "directive", type: i4$2.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3$3.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i3$3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i5$2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatSnackBarModule }, { kind: "component", type: ListViewComponent, selector: "snteam-list-view", inputs: ["modelName", "customItemTemplate", "hideNewButton", "title", "useRouter", "showRowActions", "showDeleteAction", "customRowActions"], outputs: ["itemClick", "newClick", "itemsLoaded", "itemDeleted"] }] });
|
|
5452
5700
|
}
|
|
5453
5701
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ConfigurationsComponent, decorators: [{
|
|
5454
5702
|
type: Component,
|
|
5455
5703
|
args: [{ selector: 'snteam-configurations', standalone: true, imports: [
|
|
5456
5704
|
CommonModule,
|
|
5705
|
+
ReactiveFormsModule,
|
|
5457
5706
|
MatExpansionModule,
|
|
5458
5707
|
MatIconModule,
|
|
5459
5708
|
MatCardModule,
|
|
5460
5709
|
MatButtonModule,
|
|
5710
|
+
MatFormFieldModule,
|
|
5711
|
+
MatInputModule,
|
|
5712
|
+
MatSelectModule,
|
|
5713
|
+
MatTooltipModule,
|
|
5461
5714
|
MatSnackBarModule,
|
|
5462
5715
|
ListViewComponent
|
|
5463
|
-
], template: "<div class=\"configurations-container\">\n <h2>System Configurations</h2>\n \n <mat-accordion multi=\"true\">\n \n <!-- Table Configs Section -->\n <mat-expansion-panel>\n <mat-expansion-panel-header>\n <mat-panel-title>\n <mat-icon>table_chart</mat-icon>\n <span class=\"panel-title\">Table Configs</span>\n </mat-panel-title>\n <mat-panel-description>\n Manage table configurations and settings\n </mat-panel-description>\n </mat-expansion-panel-header>\n \n <div class=\"panel-content\">\n @if (hasTableConfig) {\n <div class=\"section-actions\">\n <button mat-raised-button color=\"accent\" (click)=\"populateDefaultTableConfigs()\" class=\"populate-button\">\n <mat-icon>auto_fix_high</mat-icon>\n Populate Default Table Configs\n </button>\n <button mat-raised-button color=\"warn\" (click)=\"deleteTableConfigs()\" class=\"delete-button\">\n <mat-icon>delete</mat-icon>\n Delete All Table Configs\n </button>\n </div>\n <snteam-list-view \n [modelName]=\"'TableConfig'\"\n [useRouter]=\"true\"\n [showDeleteAction]=\"true\">\n </snteam-list-view>\n } @else {\n <mat-card class=\"error-card\">\n <mat-card-content>\n <mat-icon class=\"error-icon\">error_outline</mat-icon>\n <h3>TableConfig Model Not Found</h3>\n <p>The TableConfig model is not available in your Amplify schema. Please add it to your data model to manage table configurations.</p>\n <button mat-raised-button color=\"primary\" class=\"help-button\">\n <mat-icon>help</mat-icon>\n View Documentation\n </button>\n </mat-card-content>\n </mat-card>\n }\n </div>\n </mat-expansion-panel>\n\n <!-- Form Views Section -->\n <mat-expansion-panel>\n <mat-expansion-panel-header>\n <mat-panel-title>\n <mat-icon>dynamic_form</mat-icon>\n <span class=\"panel-title\">Form Views</span>\n </mat-panel-title>\n <mat-panel-description>\n Configure custom form layouts and field selections\n </mat-panel-description>\n </mat-expansion-panel-header>\n \n <div class=\"panel-content\">\n @if (hasFormView) {\n <div class=\"section-actions\">\n <button mat-raised-button color=\"warn\" (click)=\"deleteFormViews()\" class=\"delete-button\">\n <mat-icon>delete</mat-icon>\n Delete All Form Views\n </button>\n </div>\n <snteam-list-view \n [modelName]=\"'FormView'\"\n [useRouter]=\"true\"\n [showDeleteAction]=\"true\">\n </snteam-list-view>\n } @else {\n <mat-card class=\"error-card\">\n <mat-card-content>\n <mat-icon class=\"error-icon\">error_outline</mat-icon>\n <h3>FormView Model Not Found</h3>\n <p>The FormView model is not available in your Amplify schema. Please add it to your data model to create custom form configurations.</p>\n <button mat-raised-button color=\"primary\" class=\"help-button\">\n <mat-icon>help</mat-icon>\n View Documentation\n </button>\n </mat-card-content>\n </mat-card>\n }\n </div>\n </mat-expansion-panel>\n\n <!-- List Views Section -->\n <mat-expansion-panel>\n <mat-expansion-panel-header>\n <mat-panel-title>\n <mat-icon>view_list</mat-icon>\n <span class=\"panel-title\">List Views</span>\n </mat-panel-title>\n <mat-panel-description>\n Customize list displays and column configurations\n </mat-panel-description>\n </mat-expansion-panel-header>\n \n <div class=\"panel-content\">\n @if (hasListView) {\n <div class=\"section-actions\">\n <button mat-raised-button color=\"warn\" (click)=\"deleteListViews()\" class=\"delete-button\">\n <mat-icon>delete</mat-icon>\n Delete All List Views\n </button>\n </div>\n <snteam-list-view \n [modelName]=\"'ListView'\"\n [useRouter]=\"true\"\n [showDeleteAction]=\"true\">\n </snteam-list-view>\n } @else {\n <mat-card class=\"error-card\">\n <mat-card-content>\n <mat-icon class=\"error-icon\">error_outline</mat-icon>\n <h3>ListView Model Not Found</h3>\n <p>The ListView model is not available in your Amplify schema. Please add it to your data model to create custom list view configurations.</p>\n <button mat-raised-button color=\"primary\" class=\"help-button\">\n <mat-icon>help</mat-icon>\n View Documentation\n </button>\n </mat-card-content>\n </mat-card>\n }\n </div>\n </mat-expansion-panel>\n\n <!-- Field Configs Section -->\n <mat-expansion-panel>\n <mat-expansion-panel-header>\n <mat-panel-title>\n <mat-icon>settings</mat-icon>\n <span class=\"panel-title\">Field Configs</span>\n </mat-panel-title>\n <mat-panel-description>\n Configure field behavior, validation, and choices\n </mat-panel-description>\n </mat-expansion-panel-header>\n \n <div class=\"panel-content\">\n @if (hasFieldConfig) {\n <div class=\"section-actions\">\n <button mat-raised-button color=\"accent\" (click)=\"populateDefaultFieldConfigs()\" class=\"populate-button\">\n <mat-icon>auto_fix_high</mat-icon>\n Populate Default Field Configs\n </button>\n <button mat-raised-button color=\"warn\" (click)=\"deleteFieldConfigs()\" class=\"delete-button\">\n <mat-icon>delete</mat-icon>\n Delete All Field Configs\n </button>\n </div>\n <snteam-list-view \n [modelName]=\"'FieldConfig'\"\n [useRouter]=\"true\"\n [showDeleteAction]=\"true\">\n </snteam-list-view>\n } @else {\n <mat-card class=\"error-card\">\n <mat-card-content>\n <mat-icon class=\"error-icon\">error_outline</mat-icon>\n <h3>FieldConfig Model Not Found</h3>\n <p>The FieldConfig model is not available in your Amplify schema. Please add it to your data model to configure field behavior and validation.</p>\n <button mat-raised-button color=\"primary\" class=\"help-button\">\n <mat-icon>help</mat-icon>\n View Documentation\n </button>\n </mat-card-content>\n </mat-card>\n }\n </div>\n </mat-expansion-panel>\n\n </mat-accordion>\n</div>", styles: [".configurations-container{padding:20px;max-width:1200px;margin:0 auto}.configurations-container h2{margin-bottom:24px;color:#333;font-weight:500}.mat-expansion-panel{margin-bottom:16px;border-radius:8px;box-shadow:0 2px 4px #0000001a}.mat-expansion-panel-header{padding:16px 24px}.panel-title{margin-left:12px;font-weight:500;font-size:16px}.mat-panel-description{color:#666;font-size:14px}.panel-content{padding:16px 24px 24px;background-color:#fafafa}.error-card{text-align:center;padding:24px;background-color:#fff;border:2px dashed #ddd;border-radius:8px}.error-card mat-card-content{padding:0}.error-icon{font-size:48px;width:48px;height:48px;color:#ff9800;margin-bottom:16px}.error-card h3{margin:0 0 12px;color:#333;font-weight:500}.error-card p{color:#666;line-height:1.5;max-width:500px;margin:0 auto 20px}.help-button{margin-top:8px}.help-button mat-icon{margin-right:8px}.section-actions{margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid #e0e0e0;display:flex;gap:12px;flex-wrap:wrap}.generate-button{background-color:#2196f3;color:#fff}.generate-button mat-icon{margin-right:8px}.delete-button{background-color:#f44336;color:#fff}.delete-button mat-icon{margin-right:8px}.populate-button mat-icon{margin-right:8px}@media (max-width: 768px){.configurations-container{padding:16px}.panel-content{padding:12px 16px 16px}.error-card{padding:16px}.error-icon{font-size:36px;width:36px;height:36px}}\n"] }]
|
|
5464
|
-
}], propDecorators: { amplifyOutputs: [{
|
|
5716
|
+
], template: "<div class=\"configurations-container\">\n <h2>System Configurations</h2>\n \n <mat-accordion multi=\"true\">\n \n <!-- Table Configs Section -->\n <mat-expansion-panel>\n <mat-expansion-panel-header>\n <mat-panel-title>\n <mat-icon>table_chart</mat-icon>\n <span class=\"panel-title\">Table Configs</span>\n </mat-panel-title>\n <mat-panel-description>\n Manage table configurations and settings\n </mat-panel-description>\n </mat-expansion-panel-header>\n \n <div class=\"panel-content\">\n @if (hasTableConfig) {\n <div class=\"section-actions\">\n <button mat-raised-button color=\"accent\" (click)=\"populateDefaultTableConfigs()\" class=\"populate-button\">\n <mat-icon>auto_fix_high</mat-icon>\n Populate Default Table Configs\n </button>\n <button mat-raised-button color=\"warn\" (click)=\"deleteTableConfigs()\" class=\"delete-button\">\n <mat-icon>delete</mat-icon>\n Delete All Table Configs\n </button>\n </div>\n <snteam-list-view \n [modelName]=\"'TableConfig'\"\n [useRouter]=\"true\"\n [showDeleteAction]=\"true\">\n </snteam-list-view>\n } @else {\n <mat-card class=\"error-card\">\n <mat-card-content>\n <mat-icon class=\"error-icon\">error_outline</mat-icon>\n <h3>TableConfig Model Not Found</h3>\n <p>The TableConfig model is not available in your Amplify schema. Please add it to your data model to manage table configurations.</p>\n <button mat-raised-button color=\"primary\" class=\"help-button\">\n <mat-icon>help</mat-icon>\n View Documentation\n </button>\n </mat-card-content>\n </mat-card>\n }\n </div>\n </mat-expansion-panel>\n\n <!-- Form Views Section -->\n <mat-expansion-panel>\n <mat-expansion-panel-header>\n <mat-panel-title>\n <mat-icon>dynamic_form</mat-icon>\n <span class=\"panel-title\">Form Views</span>\n </mat-panel-title>\n <mat-panel-description>\n Configure custom form layouts and field selections\n </mat-panel-description>\n </mat-expansion-panel-header>\n \n <div class=\"panel-content\">\n @if (hasFormView) {\n <div class=\"section-actions\">\n <button mat-raised-button color=\"warn\" (click)=\"deleteFormViews()\" class=\"delete-button\">\n <mat-icon>delete</mat-icon>\n Delete All Form Views\n </button>\n </div>\n <snteam-list-view \n [modelName]=\"'FormView'\"\n [useRouter]=\"true\"\n [showDeleteAction]=\"true\">\n </snteam-list-view>\n } @else {\n <mat-card class=\"error-card\">\n <mat-card-content>\n <mat-icon class=\"error-icon\">error_outline</mat-icon>\n <h3>FormView Model Not Found</h3>\n <p>The FormView model is not available in your Amplify schema. Please add it to your data model to create custom form configurations.</p>\n <button mat-raised-button color=\"primary\" class=\"help-button\">\n <mat-icon>help</mat-icon>\n View Documentation\n </button>\n </mat-card-content>\n </mat-card>\n }\n </div>\n </mat-expansion-panel>\n\n <!-- List Views Section -->\n <mat-expansion-panel>\n <mat-expansion-panel-header>\n <mat-panel-title>\n <mat-icon>view_list</mat-icon>\n <span class=\"panel-title\">List Views</span>\n </mat-panel-title>\n <mat-panel-description>\n Customize list displays and column configurations\n </mat-panel-description>\n </mat-expansion-panel-header>\n \n <div class=\"panel-content\">\n @if (hasListView) {\n <div class=\"section-actions\">\n <button mat-raised-button color=\"warn\" (click)=\"deleteListViews()\" class=\"delete-button\">\n <mat-icon>delete</mat-icon>\n Delete All List Views\n </button>\n </div>\n <snteam-list-view \n [modelName]=\"'ListView'\"\n [useRouter]=\"true\"\n [showDeleteAction]=\"true\">\n </snteam-list-view>\n } @else {\n <mat-card class=\"error-card\">\n <mat-card-content>\n <mat-icon class=\"error-icon\">error_outline</mat-icon>\n <h3>ListView Model Not Found</h3>\n <p>The ListView model is not available in your Amplify schema. Please add it to your data model to create custom list view configurations.</p>\n <button mat-raised-button color=\"primary\" class=\"help-button\">\n <mat-icon>help</mat-icon>\n View Documentation\n </button>\n </mat-card-content>\n </mat-card>\n }\n </div>\n </mat-expansion-panel>\n\n <!-- Field Configs Section -->\n <mat-expansion-panel>\n <mat-expansion-panel-header>\n <mat-panel-title>\n <mat-icon>settings</mat-icon>\n <span class=\"panel-title\">Field Configs</span>\n </mat-panel-title>\n <mat-panel-description>\n Configure field behavior, validation, and choices\n </mat-panel-description>\n </mat-expansion-panel-header>\n \n <div class=\"panel-content\">\n @if (hasFieldConfig) {\n <div class=\"section-actions\">\n <button mat-raised-button color=\"accent\" (click)=\"populateDefaultFieldConfigs()\" class=\"populate-button\">\n <mat-icon>auto_fix_high</mat-icon>\n Populate Default Field Configs\n </button>\n <button mat-raised-button color=\"warn\" (click)=\"deleteFieldConfigs()\" class=\"delete-button\">\n <mat-icon>delete</mat-icon>\n Delete All Field Configs\n </button>\n </div>\n <snteam-list-view \n [modelName]=\"'FieldConfig'\"\n [useRouter]=\"true\"\n [showDeleteAction]=\"true\">\n </snteam-list-view>\n } @else {\n <mat-card class=\"error-card\">\n <mat-card-content>\n <mat-icon class=\"error-icon\">error_outline</mat-icon>\n <h3>FieldConfig Model Not Found</h3>\n <p>The FieldConfig model is not available in your Amplify schema. Please add it to your data model to configure field behavior and validation.</p>\n <button mat-raised-button color=\"primary\" class=\"help-button\">\n <mat-icon>help</mat-icon>\n View Documentation\n </button>\n </mat-card-content>\n </mat-card>\n }\n </div>\n </mat-expansion-panel>\n\n <!-- Relationship Configs Section -->\n <mat-expansion-panel>\n <mat-expansion-panel-header>\n <mat-panel-title>\n <mat-icon>link</mat-icon>\n <span class=\"panel-title\">Relationship Configs</span>\n </mat-panel-title>\n <mat-panel-description>\n Configure GraphQL selection sets for relationship queries\n </mat-panel-description>\n </mat-expansion-panel-header>\n \n <div class=\"panel-content\">\n <div class=\"section-actions\">\n <button mat-raised-button color=\"primary\" (click)=\"showAddRelationshipConfig = !showAddRelationshipConfig\" class=\"add-button\">\n <mat-icon>{{ showAddRelationshipConfig ? 'close' : 'add' }}</mat-icon>\n {{ showAddRelationshipConfig ? 'Cancel' : 'Add Relationship Config' }}\n </button>\n <button mat-raised-button color=\"accent\" (click)=\"loadDefaultRelationshipConfigs()\" class=\"populate-button\">\n <mat-icon>auto_fix_high</mat-icon>\n Load Default Configs\n </button>\n <button mat-raised-button color=\"warn\" (click)=\"clearAllRelationshipConfigs()\" class=\"delete-button\">\n <mat-icon>delete</mat-icon>\n Clear All Configs\n </button>\n </div>\n\n <!-- Add/Edit Relationship Config Form -->\n @if (showAddRelationshipConfig) {\n <mat-card class=\"config-form-card\">\n <mat-card-header>\n <mat-card-title>\n <mat-icon>{{ editingRelationshipConfig ? 'edit' : 'add' }}</mat-icon>\n {{ editingRelationshipConfig ? 'Edit' : 'Add' }} Relationship Configuration\n </mat-card-title>\n </mat-card-header>\n <mat-card-content>\n <form [formGroup]=\"relationshipConfigForm\" (ngSubmit)=\"saveRelationshipConfig()\">\n <div class=\"form-row\">\n <mat-form-field appearance=\"outline\" class=\"full-width\">\n <mat-label>Relationship Model</mat-label>\n <mat-select formControlName=\"relationshipModel\" (selectionChange)=\"onRelationshipModelChange($event)\">\n @for (model of availableModels; track model) {\n <mat-option [value]=\"model\">{{ model }}</mat-option>\n }\n </mat-select>\n <mat-hint>The model that contains the relationship field</mat-hint>\n </mat-form-field>\n </div>\n\n <div class=\"form-row\">\n <mat-form-field appearance=\"outline\" class=\"full-width\">\n <mat-label>Field Name</mat-label>\n <mat-select formControlName=\"fieldName\">\n @for (field of availableFields; track field.name) {\n <mat-option [value]=\"field.name\">{{ field.label }}</mat-option>\n }\n </mat-select>\n <mat-hint>The relationship field in the selected model</mat-hint>\n </mat-form-field>\n </div>\n\n <div class=\"form-row\">\n <mat-form-field appearance=\"outline\" class=\"full-width\">\n <mat-label>Selection Set</mat-label>\n <textarea \n matInput \n formControlName=\"selectionSet\" \n rows=\"6\"\n placeholder=\"Enter GraphQL selection fields, one per line: id table table.id table.name table.title\">\n </textarea>\n <mat-hint>GraphQL fields to select for this relationship (one per line)</mat-hint>\n </mat-form-field>\n </div>\n\n <div class=\"form-row\">\n <mat-form-field appearance=\"outline\" class=\"full-width\">\n <mat-label>Description</mat-label>\n <input matInput formControlName=\"description\" placeholder=\"Optional description for this configuration\">\n <mat-hint>Optional description to document this configuration</mat-hint>\n </mat-form-field>\n </div>\n\n <div class=\"form-actions\">\n <button mat-raised-button color=\"primary\" type=\"submit\" [disabled]=\"!relationshipConfigForm.valid\">\n <mat-icon>save</mat-icon>\n {{ editingRelationshipConfig ? 'Update' : 'Save' }} Configuration\n </button>\n <button mat-button type=\"button\" (click)=\"cancelRelationshipConfigEdit()\">\n <mat-icon>cancel</mat-icon>\n Cancel\n </button>\n </div>\n </form>\n </mat-card-content>\n </mat-card>\n }\n\n <!-- Current Relationship Configurations -->\n <div class=\"current-configs\">\n <h3>Current Relationship Configurations</h3>\n @if (relationshipConfigs.length === 0) {\n <mat-card class=\"empty-state-card\">\n <mat-card-content>\n <mat-icon class=\"empty-icon\">link_off</mat-icon>\n <h4>No Relationship Configurations</h4>\n <p>Add relationship configurations to control GraphQL selection sets for relationship queries.</p>\n </mat-card-content>\n </mat-card>\n } @else {\n <div class=\"configs-list\">\n @for (config of relationshipConfigs; track config.id) {\n <mat-card class=\"config-card\">\n <mat-card-header>\n <mat-card-title>{{ config.relationshipModel }} \u2192 {{ config.fieldName }}</mat-card-title>\n <mat-card-subtitle>{{ config.description || 'No description' }}</mat-card-subtitle>\n <div class=\"card-actions\">\n <button mat-icon-button (click)=\"editRelationshipConfig(config)\" matTooltip=\"Edit Configuration\">\n <mat-icon>edit</mat-icon>\n </button>\n <button mat-icon-button color=\"warn\" (click)=\"deleteRelationshipConfig(config)\" matTooltip=\"Delete Configuration\">\n <mat-icon>delete</mat-icon>\n </button>\n </div>\n </mat-card-header>\n <mat-card-content>\n <div class=\"selection-set\">\n <strong>Selection Set:</strong>\n <div class=\"selection-fields\">\n @for (field of config.selectionSet; track field) {\n <span class=\"field-chip\">{{ field }}</span>\n }\n </div>\n </div>\n </mat-card-content>\n </mat-card>\n }\n </div>\n }\n </div>\n\n <!-- Configuration Status -->\n <div class=\"config-status\">\n <mat-card class=\"status-card\">\n <mat-card-content>\n <div class=\"status-info\">\n <mat-icon class=\"status-icon\">info</mat-icon>\n <div class=\"status-text\">\n <strong>Active Configurations: {{ relationshipConfigs.length }}</strong>\n <p>These configurations control how relationship data is queried from your GraphQL API.</p>\n </div>\n </div>\n </mat-card-content>\n </mat-card>\n </div>\n </div>\n </mat-expansion-panel>\n\n </mat-accordion>\n</div>", styles: [".configurations-container{padding:20px;max-width:1200px;margin:0 auto}.configurations-container h2{margin-bottom:24px;color:#333;font-weight:500}.mat-expansion-panel{margin-bottom:16px;border-radius:8px;box-shadow:0 2px 4px #0000001a}.mat-expansion-panel-header{padding:16px 24px}.panel-title{margin-left:12px;font-weight:500;font-size:16px}.mat-panel-description{color:#666;font-size:14px}.panel-content{padding:16px 24px 24px;background-color:#fafafa}.error-card{text-align:center;padding:24px;background-color:#fff;border:2px dashed #ddd;border-radius:8px}.error-card mat-card-content{padding:0}.error-icon{font-size:48px;width:48px;height:48px;color:#ff9800;margin-bottom:16px}.error-card h3{margin:0 0 12px;color:#333;font-weight:500}.error-card p{color:#666;line-height:1.5;max-width:500px;margin:0 auto 20px}.help-button{margin-top:8px}.help-button mat-icon{margin-right:8px}.section-actions{margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid #e0e0e0;display:flex;gap:12px;flex-wrap:wrap}.generate-button{background-color:#2196f3;color:#fff}.generate-button mat-icon{margin-right:8px}.delete-button{background-color:#f44336;color:#fff}.delete-button mat-icon{margin-right:8px}.populate-button mat-icon{margin-right:8px}@media (max-width: 768px){.configurations-container{padding:16px}.panel-content{padding:12px 16px 16px}.error-card{padding:16px}.error-icon{font-size:36px;width:36px;height:36px}}.add-button{background-color:#4caf50;color:#fff}.add-button mat-icon{margin-right:8px}.config-form-card{margin:16px 0;background-color:#fff;border-radius:8px;box-shadow:0 2px 8px #0000001a}.config-form-card mat-card-header{background-color:#f5f5f5;border-radius:8px 8px 0 0;padding:16px 24px}.config-form-card mat-card-title{display:flex;align-items:center;font-size:18px;font-weight:500;color:#333}.config-form-card mat-card-title mat-icon{margin-right:12px;color:#2196f3}.config-form-card mat-card-content{padding:24px}.form-row{margin-bottom:20px}.full-width{width:100%}.form-actions{display:flex;gap:12px;margin-top:24px;padding-top:16px;border-top:1px solid #e0e0e0}.form-actions button mat-icon{margin-right:8px}.current-configs{margin-top:24px}.current-configs h3{margin-bottom:16px;color:#333;font-weight:500}.empty-state-card{text-align:center;padding:32px;background-color:#fff;border:2px dashed #ddd;border-radius:8px}.empty-state-card mat-card-content{padding:0}.empty-icon{font-size:48px;width:48px;height:48px;color:#bbb;margin-bottom:16px}.empty-state-card h4{margin:0 0 12px;color:#333;font-weight:500}.empty-state-card p{margin:0;color:#666;line-height:1.5}.configs-list{display:grid;gap:16px}.config-card{background-color:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a;transition:box-shadow .2s ease}.config-card:hover{box-shadow:0 4px 8px #00000026}.config-card mat-card-header{padding:16px 20px;border-bottom:1px solid #f0f0f0;display:flex;align-items:center;justify-content:space-between}.config-card mat-card-title{font-size:16px;font-weight:500;color:#333;margin:0}.config-card mat-card-subtitle{font-size:14px;color:#666;margin:4px 0 0}.card-actions{display:flex;gap:4px}.config-card mat-card-content{padding:16px 20px}.selection-set{margin:0}.selection-set strong{display:block;margin-bottom:8px;color:#333;font-size:14px}.selection-fields{display:flex;flex-wrap:wrap;gap:6px}.field-chip{display:inline-block;padding:4px 8px;background-color:#e3f2fd;color:#1976d2;border-radius:12px;font-size:12px;font-family:Roboto Mono,monospace;border:1px solid #bbdefb}.config-status{margin-top:24px}.status-card{background-color:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a}.status-card mat-card-content{padding:16px 20px}.status-info{display:flex;align-items:flex-start;gap:12px}.status-icon{color:#2196f3;margin-top:2px}.status-text strong{display:block;margin-bottom:4px;color:#333;font-size:16px}.status-text p{margin:0;color:#666;font-size:14px;line-height:1.5}@media (max-width: 768px){.config-form-card mat-card-content{padding:16px}.form-actions{flex-direction:column}.form-actions button{width:100%}.config-card mat-card-header{flex-direction:column;align-items:flex-start;gap:8px}.card-actions{align-self:flex-end}.selection-fields{gap:4px}.field-chip{font-size:11px;padding:3px 6px}}\n"] }]
|
|
5717
|
+
}], ctorParameters: () => [], propDecorators: { amplifyOutputs: [{
|
|
5465
5718
|
type: Input
|
|
5466
5719
|
}] } });
|
|
5467
5720
|
|