Skip to content

Commit 5bba3c3

Browse files
JBBianchiJBBianchi
committed
fix(Dashboard): added key value pair editor
1 parent 6be09ce commit 5bba3c3

File tree

2 files changed

+54
-7
lines changed

2 files changed

+54
-7
lines changed

‎src/dashboard/Synapse.Dashboard/Features/Shared/KeyValuePairEditor/KeyValuePairEditor.razor

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
@namespace Synapse.Dashboard
2+
3+
<div>
4+
@if (Kvp == null)
5+
{
6+
<input class="form-control" placeholder="Key" type="text" value="@key" @onchange="e => OnPropertyChanged((editor) => editor.key = (string?)e.Value ?? string.Empty)" />
7+
}
8+
<input class="form-control" placeholder="Value" type="text" value="@value" @onchange="e => OnPropertyChanged((editor) => editor.value = (string?)e.Value ?? string.Empty)" />
9+
@if (Kvp == null)
10+
{
11+
<button class="btn btn-outline-dark" type="button" @onclick="OnAddClicked">Add</button>
12+
}
13+
</div>
14+
15+
@code {
16+
private string key = "";
17+
private string value = "";
18+
[Parameter] public KeyValuePair<string, string>? Kvp { get; set; }
19+
[Parameter] public EventCallback<KeyValuePair<string, string>> OnAdd { get; set; }
20+
[Parameter] public EventCallback<KeyValuePair<string, string>> OnChange { get; set; }
21+
22+
protected override void OnParametersSet()
23+
{
24+
if (this.Kvp.HasValue && (this.Kvp.Value.Key != this.key || this.Kvp.Value.Value != this.value))
25+
{
26+
this.key = this.Kvp.Value.Key;
27+
this.value = this.Kvp.Value.Value;
28+
}
29+
}
30+
31+
private void OnPropertyChanged(Action<KeyValuePairEditor> patch)
32+
{
33+
patch(this);
34+
this.OnChange.InvokeAsync(new KeyValuePair<string, string>(this.key, this.value));
35+
}
36+
37+
private void OnAddClicked()
38+
{
39+
this.OnAdd.InvokeAsync(new KeyValuePair<string, string>(this.key, this.value));
40+
this.key = "";
41+
this.value = "";
42+
}
43+
}

‎src/dashboard/Synapse.Dashboard/Pages/Correlations/Create/View.razor

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -91,14 +91,15 @@ else
9191
</div>
9292

9393
<h4 class="my-2">Conditions</h4>
94-
@for (int conditionIndex = 0; conditionIndex < command.Conditions.Count; conditionIndex++)
94+
@for (int i = 0; i < command.Conditions.Count; i++)
9595
{
96+
var conditionIndex = i;
9697
var condition = command.Conditions.ElementAt(conditionIndex);
9798
<Expander Class="border border-dark rounded-2 p-3 my-3">
9899
<Header>
99100
<div class="row">
100101
<div class="col-10">
101-
Condition @conditionIndex
102+
Condition @(conditionIndex + 1)
102103
</div>
103104
<div class="col-2">
104105
<button @onclick="e => OnRemoveCondition(condition)" title="Remove condition" class="btn btn-danger d-flex ms-auto"><span class="bi bi-trash-fill"></span></button>
@@ -108,14 +109,15 @@ else
108109
<Body>
109110
<div class="border border-dark rounded-2 p-3">
110111
<h5>Filters</h5>
111-
@for (int filterIndex = 0; filterIndex < condition.Filters.Count; filterIndex++)
112+
@for (int j = 0; j < condition.Filters.Count; j++)
112113
{
114+
var filterIndex = j;
113115
var filter = condition.Filters.ElementAt(filterIndex);
114116
<Expander Class="border border-secondary rounded-2 p-3 mb-3" IsExpanded="true">
115117
<Header>
116118
<div class="row">
117119
<div class="col-10">
118-
Filter @filterIndex
120+
Filter @(filterIndex + 1)
119121
</div>
120122
<div class="col-2">
121123
<button @onclick="e => OnRemoveFilterFromCondition(condition, filter)" title="Remove filter" class="btn btn-danger d-flex ms-auto"><span class="bi bi-trash-fill"></span></button>
@@ -124,6 +126,7 @@ else
124126
</Header>
125127
<Body>
126128
<h5>Attributes</h5>
129+
<KeyValuePairEditor OnAdd="((e) => OnAddOrUpdateConditionFilterAttribute(condition, filter, e.Key, e.Value))" />
127130
<table class="table table-striped">
128131
<thead>
129132
<tr>
@@ -133,14 +136,14 @@ else
133136
</thead>
134137
<tbody>
135138
@if (filter.Attributes != null
136-
&& filter.Attributes.Any())
139+
&& filter.Attributes.Any())
137140
{
138141
foreach (var attr in filter.Attributes)
139142
{
140143
<tr>
141144
<td>@attr.Key</td>
142145
<td>
143-
<input type="text" value="@attr.Value" @onchange="e => OnAddOrUpdateConditionFilterAttribute(condition, filter, attr.Key, (string)e.Value!)" placeholder="Value" title="The value of the context attribute to filter events by. Supports regular expressions" class="form-control" />
146+
<KeyValuePairEditor Kvp="attr" OnChange="((e) => OnAddOrUpdateConditionFilterAttribute(condition, filter, attr.Key, e.Value))" />
144147
</td>
145148
<td><button @onclick="e => OnRemoveAttributeFromConditionFilter(condition, filter, attr.Key)" class="btn btn-danger"><span class="bi bi-trash-fill"></span></button></td>
146149
</tr>
@@ -150,6 +153,7 @@ else
150153
</table>
151154

152155
<h5>Correlation Mappings</h5>
156+
<KeyValuePairEditor OnAdd="((e) => OnAddOrUpdateConditionFilterCorrelationMapping(condition, filter, e.Key, e.Value))" />
153157
<table class="table table-striped">
154158
<thead>
155159
<tr>
@@ -166,7 +170,7 @@ else
166170
<tr>
167171
<td>@mapping.Key</td>
168172
<td>
169-
<input type="text" value="@mapping.Value" @onchange="e => OnAddOrUpdateConditionFilterCorrelationMapping(condition, filter, mapping.Key, (string)e.Value!)" placeholder="Value" title="The value of the context attribute used to correlate filtered cloud events. Supports regular expressions" class="form-control" />
173+
<KeyValuePairEditor Kvp="mapping" OnChange="((e) => OnAddOrUpdateConditionFilterCorrelationMapping(condition, filter, mapping.Key, e.Value))" />
170174
</td>
171175
<td><button @onclick="e => OnRemoveCorrelationMappingFromConditionFilter(condition, filter, mapping.Key)" class="btn btn-danger"><span class="bi bi-trash-fill"></span></button></td>
172176
</tr>

0 commit comments

Comments
 (0)