Skip to content

Commit db5dd0e

Browse files
phillip-krugergsmet
phillip-kruger
authored and
gsmet
committed
DevUI: Add search for Arc tables
Signed-off-by: Phillip Kruger <[email protected]> (cherry picked from commit 5b3a604)
1 parent 25a7f53 commit db5dd0e

File tree

4 files changed

+188
-18
lines changed

4 files changed

+188
-18
lines changed

‎extensions/arc/deployment/src/main/resources/dev-ui/qwc-arc-beans.js‎

Lines changed: 42 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,12 @@ export class QwcArcBeans extends LitElement {
1818
jsonRpc = new JsonRpc(this);
1919

2020
static styles = css`
21+
:host {
22+
display: flex;
23+
flex-direction: column;
24+
height: 100%;
25+
}
26+
2127
.arctable {
2228
height: 100%;
2329
padding-bottom: 10px;
@@ -46,17 +52,23 @@ export class QwcArcBeans extends LitElement {
4652
overflow: hidden;
4753
height: 100%;
4854
}
55+
.filterBar {
56+
width: 99%;
57+
margin-left: 5px;
58+
}
4959
`;
5060

5161
static properties = {
5262
_beans: {state: true},
63+
_filteredBeans: {state: true},
5364
_beanIdsWithDependencyGraphs: {state: true},
5465
_selectedBean: {state: true}
5566
};
5667

5768
constructor() {
5869
super();
5970
this._beans = beans;
71+
this._filteredBeans = this._beans;
6072
this._beanIdsWithDependencyGraphs = beanIdsWithDependencyGraphs;
6173
this._selectedBean = null;
6274
}
@@ -74,11 +86,12 @@ export class QwcArcBeans extends LitElement {
7486
newBeans.push(bean);
7587
}
7688
this._beans = newBeans;
89+
this._filteredBeans = this._beans;
7790
});
7891
}
7992

8093
render() {
81-
if (this._beans) {
94+
if (this._filteredBeans) {
8295
if (this._selectedBean) {
8396
return this._renderBeanGraph();
8497
} else {
@@ -89,8 +102,35 @@ export class QwcArcBeans extends LitElement {
89102
}
90103
}
91104

105+
_renderFilterBar(){
106+
return html`<vaadin-text-field
107+
placeholder="Search"
108+
class="filterBar"
109+
@value-changed="${(e) => {
110+
const searchTerm = (e.detail.value || '').trim();
111+
const matchesTerm = (value) => {
112+
if(value){
113+
return value.toLowerCase().includes(searchTerm.toLowerCase());
114+
}
115+
}
116+
if(searchTerm?.trim()){
117+
this._filteredBeans = this._beans.filter(
118+
({ providerType, kind }) => {
119+
return !searchTerm ||
120+
matchesTerm(providerType?.name) ||
121+
matchesTerm(kind)
122+
});
123+
}else{
124+
this._filteredBeans = this._beans;
125+
}
126+
}}">
127+
<vaadin-icon slot="prefix" icon="font-awesome-solid:magnifying-glass"></vaadin-icon>
128+
</vaadin-text-field>`;
129+
}
130+
92131
_renderBeanList(){
93-
return html`<vaadin-grid .items="${this._beans}" class="arctable" theme="no-border">
132+
return html`${this._renderFilterBar()}
133+
<vaadin-grid .items="${this._filteredBeans}" class="arctable" theme="no-border">
94134
<vaadin-grid-sort-column path="providerType.name" auto-width
95135
header="Bean"
96136
${columnBodyRenderer(this._beanRenderer, [])}

‎extensions/arc/deployment/src/main/resources/dev-ui/qwc-arc-interceptors.js‎

Lines changed: 43 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,12 @@ import 'qui-badge';
1212
export class QwcArcInterceptors extends LitElement {
1313

1414
static styles = css`
15+
:host {
16+
display: flex;
17+
flex-direction: column;
18+
height: 100%;
19+
}
20+
1521
.arctable {
1622
height: 100%;
1723
padding-bottom: 10px;
@@ -24,21 +30,28 @@ export class QwcArcInterceptors extends LitElement {
2430
.annotation {
2531
color: var(--lumo-contrast-50pct);
2632
}
33+
34+
.filterBar {
35+
width: 99%;
36+
margin-left: 5px;
37+
}
2738
`;
2839

2940
static properties = {
30-
_interceptors: {attribute: false}
41+
_interceptors: {attribute: false},
42+
_filteredInterceptors: {attribute: false}
3143
};
3244

3345
constructor() {
3446
super();
3547
this._interceptors = interceptors;
48+
this._filteredInterceptors = this._interceptors;
3649
}
3750

3851
render() {
39-
if(this._interceptors){
40-
return html`
41-
<vaadin-grid .items="${this._interceptors}" class="arctable" theme="no-border">
52+
if(this._filteredInterceptors){
53+
return html`${this._renderFilterBar()}
54+
<vaadin-grid .items="${this._filteredInterceptors}" class="arctable" theme="no-border">
4255
<vaadin-grid-sort-column path="interceptorClass.name" auto-width
4356
header="Interceptor Class"
4457
${columnBodyRenderer(this._classRenderer, [])}
@@ -67,6 +80,32 @@ export class QwcArcInterceptors extends LitElement {
6780
}
6881
}
6982

83+
_renderFilterBar(){
84+
return html`<vaadin-text-field
85+
placeholder="Search"
86+
class="filterBar"
87+
@value-changed="${(e) => {
88+
const searchTerm = (e.detail.value || '').trim();
89+
const matchesTerm = (value) => {
90+
if(value){
91+
return value.toLowerCase().includes(searchTerm.toLowerCase());
92+
}
93+
}
94+
if(searchTerm?.trim()){
95+
this._filteredInterceptors = this._interceptors.filter(
96+
({ interceptorClass, priority }) => {
97+
return !searchTerm ||
98+
matchesTerm(interceptorClass?.name) ||
99+
matchesTerm(priority.toString())
100+
});
101+
}else{
102+
this._filteredInterceptors = this._interceptors;
103+
}
104+
}}">
105+
<vaadin-icon slot="prefix" icon="font-awesome-solid:magnifying-glass"></vaadin-icon>
106+
</vaadin-text-field>`;
107+
}
108+
70109
_classRenderer(bean){
71110
return html`
72111
<code>${bean.interceptorClass.name}</code>

‎extensions/arc/deployment/src/main/resources/dev-ui/qwc-arc-observers.js‎

Lines changed: 42 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,11 @@ import 'qui-ide-link';
1313
export class QwcArcObservers extends LitElement {
1414

1515
static styles = css`
16+
:host {
17+
display: flex;
18+
flex-direction: column;
19+
height: 100%;
20+
}
1621
.arctable {
1722
height: 100%;
1823
padding-bottom: 10px;
@@ -33,22 +38,28 @@ export class QwcArcObservers extends LitElement {
3338
.annotation {
3439
color: var(--lumo-contrast-50pct);
3540
}
41+
.filterBar {
42+
width: 99%;
43+
margin-left: 5px;
44+
}
3645
`;
3746

3847
static properties = {
39-
_observers: {attribute: false}
48+
_observers: {attribute: false},
49+
_filteredObservers: {state: true}
4050
};
4151

4252
constructor() {
4353
super();
4454
this._observers = observers;
55+
this._filteredObservers = this._observers;
4556
}
4657

4758
render() {
48-
if(this._observers){
59+
if(this._filteredObservers){
4960

50-
return html`
51-
<vaadin-grid .items="${this._observers}" class="arctable" theme="no-border">
61+
return html`${this._renderFilterBar()}
62+
<vaadin-grid .items="${this._filteredObservers}" class="arctable" theme="no-border">
5263
5364
<vaadin-grid-sort-column path="declaringClass.name" auto-width
5465
header="Source"
@@ -90,6 +101,33 @@ export class QwcArcObservers extends LitElement {
90101
}
91102
}
92103

104+
_renderFilterBar(){
105+
return html`<vaadin-text-field
106+
placeholder="Search"
107+
class="filterBar"
108+
@value-changed="${(e) => {
109+
const searchTerm = (e.detail.value || '').trim();
110+
const matchesTerm = (value) => {
111+
if(value){
112+
return value.toLowerCase().includes(searchTerm.toLowerCase());
113+
}
114+
}
115+
if(searchTerm?.trim()){
116+
this._filteredObservers = this._observers.filter(
117+
({ declaringClass, observedType , priority}) => {
118+
return !searchTerm ||
119+
matchesTerm(declaringClass?.name) ||
120+
matchesTerm(observedType?.name) ||
121+
matchesTerm(priority.toString())
122+
});
123+
}else{
124+
this._filteredObservers = this._observers;
125+
}
126+
}}">
127+
<vaadin-icon slot="prefix" icon="font-awesome-solid:magnifying-glass"></vaadin-icon>
128+
</vaadin-text-field>`;
129+
}
130+
93131
_sourceRenderer(bean){
94132
return html`<qui-ide-link fileName='${bean.declaringClass.name}'><code>${bean.declaringClass.name}</code><code class="method">#${bean.methodName}()</code></qui-ide-link>`;
95133
}

‎extensions/arc/deployment/src/main/resources/dev-ui/qwc-arc-removed-components.js‎

Lines changed: 61 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -18,32 +18,48 @@ import 'qui-ide-link';
1818
export class QwcArcRemovedComponents extends LitElement {
1919
static styles = css`
2020
.fullHeight {
21-
height: 100%;
21+
height: 100%;
2222
}
23+
24+
.searchableGrid {
25+
display: flex;
26+
flex-direction: column;
27+
height: 100%;
28+
}
29+
2330
code {
24-
font-size: 85%;
31+
font-size: 85%;
2532
}
2633
2734
.annotation {
28-
color: var(--lumo-contrast-50pct);
35+
color: var(--lumo-contrast-50pct);
2936
}
3037
3138
.producer {
32-
color: var(--lumo-primary-text-color);
39+
color: var(--lumo-primary-text-color);
40+
}
41+
42+
.filterBar {
43+
width: 99%;
44+
margin-left: 5px;
3345
}
3446
`;
3547

3648
static properties = {
3749
_removedBeans: {state: true},
50+
_filteredRemovedBeans: {state: true},
3851
_removedDecorators: {state: true},
3952
_removedInterceptors: {state: true},
53+
_filteredRemovedInterceptors: {state: true},
4054
};
4155

4256
constructor() {
4357
super();
4458
this._removedBeans = removedBeans;
59+
this._filteredRemovedBeans = this._removedBeans;
4560
this._removedDecorators = removedDecorators;
4661
this._removedInterceptors = removedInterceptors;
62+
this._filteredRemovedInterceptors = this._removedInterceptors;
4763
}
4864

4965
render() {
@@ -75,8 +91,8 @@ export class QwcArcRemovedComponents extends LitElement {
7591

7692
if (this._removedBeans.length > 0) {
7793

78-
return html`
79-
<vaadin-grid .items="${this._removedBeans}" theme="no-border" class="fullHeight">
94+
return html`${this._renderFilterBar(0)}
95+
<vaadin-grid .items="${this._filteredRemovedBeans}" theme="no-border" class="searchableGrid">
8096
<vaadin-grid-sort-column path="providerType.name" auto-width
8197
header="Bean"
8298
${columnBodyRenderer(this._beanRenderer, [])}
@@ -95,6 +111,43 @@ export class QwcArcRemovedComponents extends LitElement {
95111
}
96112
}
97113

114+
_renderFilterBar(tab){
115+
return html`<vaadin-text-field
116+
placeholder="Search"
117+
class="filterBar"
118+
@value-changed="${(e) => {
119+
const searchTerm = (e.detail.value || '').trim();
120+
const matchesTerm = (value) => {
121+
if(value){
122+
return value.toLowerCase().includes(searchTerm.toLowerCase());
123+
}
124+
}
125+
if(tab === 0){
126+
if(searchTerm?.trim()){
127+
this._filteredRemovedBeans = this._removedBeans.filter(
128+
({ providerType}) => {
129+
return !searchTerm ||
130+
matchesTerm(providerType?.name)
131+
});
132+
}else{
133+
this._filteredRemovedBeans = this._removedBeans;
134+
}
135+
}else if (tab === 2){
136+
if(searchTerm?.trim()){
137+
this._filteredRemovedInterceptors = this._removedInterceptors.filter(
138+
({ interceptorClass}) => {
139+
return !searchTerm ||
140+
matchesTerm(interceptorClass?.name)
141+
});
142+
}else{
143+
this._filteredRemovedInterceptors = this._removedInterceptors;
144+
}
145+
}
146+
}}">
147+
<vaadin-icon slot="prefix" icon="font-awesome-solid:magnifying-glass"></vaadin-icon>
148+
</vaadin-text-field>`;
149+
}
150+
98151
_renderRemovedDecorators(){
99152
if (this._removedDecorators.length > 0) {
100153
return html`TODO: Not yet implemented`;
@@ -106,8 +159,8 @@ export class QwcArcRemovedComponents extends LitElement {
106159

107160
_renderRemovedInterceptors(){
108161
if (this._removedInterceptors.length > 0) {
109-
return html`
110-
<vaadin-grid .items="${this._removedInterceptors}" theme="no-border" class="fullHeight">
162+
return html`${this._renderFilterBar(2)}
163+
<vaadin-grid .items="${this._filteredRemovedInterceptors}" theme="no-border" class="fullHeight">
111164
<vaadin-grid-sort-column path="interceptorClass.name" auto-width
112165
header="Interceptor"
113166
${columnBodyRenderer(this._interceptorRenderer, [])}

0 commit comments

Comments
 (0)