Skip to content

Commit bdaf97f

Browse files
subirjollySubir JollyGene Hynson
authored
fix: fix subscriptions search and add test (#4724)
* fix: fix subscriptions search and add test * Update src/writeData/subscriptions/components/SubscriptionsLanding.tsx Co-authored-by: Gene Hynson <ghynson@influxdata.com> Co-authored-by: Subir Jolly <sjolly@influxdata.com> Co-authored-by: Gene Hynson <ghynson@influxdata.com>
1 parent 5d47a13 commit bdaf97f

File tree

2 files changed

+144
-6
lines changed

2 files changed

+144
-6
lines changed

‎cypress/e2e/cloud/subscriptions.test.ts‎

Lines changed: 123 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,129 @@ describe('Subscriptions', () => {
3030
)
3131
)
3232

33+
const deleteSubscription = (subscription: string) => {
34+
cy.getByTestID('subscription-card')
35+
.contains(subscription)
36+
// delete
37+
.parents('[data-testid="subscription-card"]')
38+
.find('[data-testid="context-delete-menu--button"]')
39+
.first()
40+
.click()
41+
cy.getByTestID('context-delete-menu--confirm-button').should('be.visible')
42+
cy.getByTestID('context-delete-menu--confirm-button').click()
43+
cy.wait('@DeleteSubscription')
44+
cy.wait('@GetSubscriptions')
45+
}
46+
47+
const createBasicLPSubscription = (name: string) => {
48+
cy.getByTestID('subscriptions--tab').click()
49+
cy.getByTestID('create-subscription-button--control-bar')
50+
.should('be.visible')
51+
.first()
52+
.click()
53+
54+
// broker form
55+
cy.getByTestID('create-broker-form-overlay').should('be.visible')
56+
// back to create landing
57+
cy.getByTestID('create-broker-form--cancel').should('be.visible')
58+
cy.getByTestID('create-broker-form--cancel').click()
59+
// return to broker form
60+
cy.getByTestID('create-subscription-button--control-bar').should(
61+
'be.visible'
62+
)
63+
cy.getByTestID('create-subscription-button--control-bar')
64+
.first()
65+
.click()
66+
cy.getByTestID('create-broker-form-overlay').should('be.visible')
67+
// fill in broker form
68+
cy.getByTestID('create-broker-form--name').type(name)
69+
cy.getByTestID('create-broker-form--description').type('My Description')
70+
cy.getByTestID('dropdown')
71+
.contains('MQTT')
72+
.click()
73+
cy.getByTestID('create-broker-form--host').type('localhost')
74+
cy.getByTestID('create-broker-form--port').type('1883')
75+
cy.getByTestID('create-broker-form--submit').click()
76+
// subscription form
77+
cy.getByTestID('create-subscription-form--overlay-form').should(
78+
'be.visible'
79+
)
80+
// back to broker form
81+
cy.getByTestID('create-subscription-form--back').should('be.visible')
82+
cy.getByTestID('create-subscription-form--back').click()
83+
cy.getByTestID('create-broker-form-overlay').should('be.visible')
84+
// return to subscription
85+
cy.getByTestID('create-broker-form--submit').should('be.visible')
86+
cy.getByTestID('create-broker-form--submit').click()
87+
cy.getByTestID('create-subscription-form--overlay-form').should(
88+
'be.visible'
89+
)
90+
// fill in subscription form
91+
cy.getByTestID('create-subscription-form--topic').type('topic')
92+
cy.getByTestID('list-item')
93+
.contains('defbuck')
94+
.click()
95+
cy.getByTestID('create-subscription-form--submit').click()
96+
// parsing form
97+
cy.getByTestID('create-parsing-form-overlay').should('be.visible')
98+
// back to subscription
99+
cy.getByTestID('create-parsing-form--back').should('be.visible')
100+
cy.getByTestID('create-parsing-form--back').click()
101+
cy.getByTestID('create-subscription-form--overlay-form').should(
102+
'be.visible'
103+
)
104+
105+
// return to parsing
106+
cy.getByTestID('create-subscription-form--submit').click()
107+
// line protocol
108+
cy.getByTestID('create-parsing-form-line-protocol--button').click()
109+
cy.getByTestID('create-parsing-form--submit').click()
110+
111+
// wait for intercepts
112+
cy.wait('@CreateSubscription')
113+
cy.wait('@GetSubscriptions')
114+
}
115+
116+
it('should filter listing', () => {
117+
const subscription1 = 'My Subscription'
118+
const subscription2 = 'Your Subscription'
119+
createBasicLPSubscription(subscription1)
120+
createBasicLPSubscription(subscription2)
121+
122+
// subscriptions list view
123+
cy.get('.subscriptions-list').should('be.visible')
124+
cy.getByTestID('subscription-card')
125+
.should('be.visible')
126+
.should('have.length', 2)
127+
128+
// Search for subscription1 name(partial match)
129+
cy.getByTestID('search-widget')
130+
.clear()
131+
.type('my ')
132+
cy.getByTestID('subscription-card')
133+
.should('be.visible')
134+
.should('have.length', 1)
135+
cy.getByTestID('dismiss-button').click()
136+
cy.getByTestID('subscription-card')
137+
.should('be.visible')
138+
.should('have.length', 2)
139+
140+
// Search for subscription2 name(partial match)
141+
cy.getByTestID('search-widget')
142+
.clear()
143+
.type('your ')
144+
cy.getByTestID('subscription-card')
145+
.should('be.visible')
146+
.should('have.length', 1)
147+
cy.getByTestID('dismiss-button').click()
148+
cy.getByTestID('subscription-card')
149+
.should('be.visible')
150+
.should('have.length', 2)
151+
152+
deleteSubscription(subscription1)
153+
deleteSubscription(subscription2)
154+
})
155+
33156
it('should navigate to empty subscriptions page via sources tab', () => {
34157
cy.getByTestID('tree-nav-toggle').should('be.visible')
35158
cy.getByTestID('tree-nav-toggle').click()

‎src/writeData/subscriptions/components/SubscriptionsLanding.tsx‎

Lines changed: 21 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -51,15 +51,30 @@ const SubscriptionsLanding: FC = () => {
5151
sortType: SortTypes.String,
5252
sortDirection: Sort.Ascending,
5353
})
54+
const [filteredSubscriptions, setFilteredSubscriptions] = useState([])
55+
5456
useEffect(() => {
5557
event('visited subscriptions page', {}, {feature: 'subscriptions'})
5658
}, [])
57-
const filteredSubscriptions =
58-
subscriptions && search
59-
? subscriptions.filter(
60-
s => s.name.toLowerCase() === search.toLowerCase().trim()
61-
)
62-
: subscriptions
59+
60+
useEffect(() => {
61+
if (!subscriptions || !subscriptions.length) {
62+
setFilteredSubscriptions([])
63+
return
64+
}
65+
66+
const lowerCaseSearch = search.toLowerCase().trim()
67+
if (!lowerCaseSearch) {
68+
setFilteredSubscriptions(subscriptions)
69+
return
70+
}
71+
72+
const filtered = subscriptions.filter(s =>
73+
s.name.toLowerCase().includes(lowerCaseSearch)
74+
)
75+
setFilteredSubscriptions(filtered)
76+
}, [subscriptions, search])
77+
6378
const handleSort = (subscriptions: Subscription[]): Subscription[] => {
6479
let sortedSubscriptions
6580
if (sortOptions.sortDirection === Sort.Ascending) {

0 commit comments

Comments
 (0)