Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

4563 replace instance and audit logs dropdowns #4567

Open
wants to merge 12 commits into
base: main
Choose a base branch
from
+64 −40
Open

4563 replace instance and audit logs dropdowns #4567

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
598b7a2
replace instance logs haId selector with new ff-listbox
cstns Sep 24, 2024
348abbe
fix team members not being populated on page load
cstns Sep 25, 2024
6b26ce3
replace Audit Log Browser dropdowns with ff-listbox
cstns Sep 25, 2024
d9340de
sync with ff-listbox changes
cstns Sep 25, 2024
e424111
Merge branch '4559_create-a-new-listbox-component' into 4563_replace-…
cstns Sep 25, 2024
c9f71a8
qf failing e2e test
cstns Sep 25, 2024
938e8f2
qf
cstns Sep 25, 2024
5d7a276
fix failing e2e test
cstns Sep 25, 2024
6e06e7c
Merge branch '4559_create-a-new-listbox-component' into 4563_replace-…
cstns Sep 27, 2024
b478f28
Merge branch 'main' into 4563_replace-instance-and-audit-logs-dropdowns
cstns Sep 27, 2024
dd6dc30
Merge branch 'main' into 4563_replace-instance-and-audit-logs-dropdowns
Steve-Mcl Sep 27, 2024
402b670
Merge branch 'main' into 4563_replace-instance-and-audit-logs-dropdowns
cstns Oct 4, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
50 changes: 33 additions & 17 deletions frontend/src/components/audit-log/AuditLogBrowser.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,23 +9,21 @@
<slot name="extraFilters" />
<FormHeading class="mt-4">Event Type:</FormHeading>
<div data-el="filter-event-types">
<ff-dropdown v-model="auditFilters.type" class="w-full">
<ff-dropdown-option label="Show All" :value="undefined" />
<ff-dropdown-option
v-for="eType in auditFilters.types" :key="eType[1]"
:label="`${eType[0]}`" :value="eType[1]"
/>
</ff-dropdown>
<ff-listbox
v-model="auditFilters.type"
:options="typeOptions"
placeholder="Show All"
class="w-full"
/>
</div>
<FormHeading class="mt-4">User:</FormHeading>
<div data-el="filter-users">
<ff-dropdown v-model="auditFilters.user" class="w-full">
<ff-dropdown-option label="Show All" :value="undefined" />
<ff-dropdown-option
v-for="user in auditFilters.users" :key="user.username"
:label="`${user.name} (${user.username})`" :value="user.username"
/>
</ff-dropdown>
<ff-listbox
v-model="auditFilters.user"
:options="userOptions"
placeholder="Show All"
class="w-full"
/>
</div>
</div>
</div>
Expand All @@ -35,13 +33,15 @@
import SectionTopMenu from '../../components/SectionTopMenu.vue'

import AuditEventsService from '../../services/audit-events.js'
import FfListbox from '../../ui-components/components/form/ListBox.vue'
import FormHeading from '../FormHeading.vue'

import AuditLog from './AuditLog.vue'

export default {
name: 'AuditLogPage',
components: {
FfListbox,
AuditLog,
SectionTopMenu,
FormHeading
Expand Down Expand Up @@ -75,6 +75,24 @@ export default {
}
}
},
computed: {
typeOptions () {
return [
{ label: 'Show All', value: undefined },
...this.auditFilters.types.map(type => ({ label: type[0], value: type[1][0] }))
]
},
userOptions () {
return [
{ label: 'Show All', value: undefined },
...this.auditFilters.users.map(user => ({
label: `${user.name} (${user.username})`,
value: user.username
}
))
]
}
},
watch: {
'auditFilters.user': function () {
if (this.loading || this.gettingEntries) {
Expand Down Expand Up @@ -120,9 +138,7 @@ export default {
params.append('username', this.auditFilters.user)
}
if (this.auditFilters.type) {
this.auditFilters.type.forEach((evt) => {
params.append('event', evt)
})
params.append('event', this.auditFilters.type)
}

this.$emit('load-entries', params)
Expand Down
5 changes: 3 additions & 2 deletions frontend/src/pages/instance/AuditLog.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,8 +39,9 @@ export default {
instance () {
this.$refs.AuditLog?.loadEntries()
},
'team.id' () {
this.loadUsers()
'team.id': {
handler: function (teamId) { if (teamId) this.loadUsers() },
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

addressed a bug where team members were not loaded when the page loaded, resulting in an empty users list

immediate: true
}
},
methods: {
Expand Down
20 changes: 13 additions & 7 deletions frontend/src/pages/instance/Logs.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,13 +4,12 @@
<template v-if="instance.ha?.replicas != undefined" #tools>
<div style="display: flex;align-items: center;">
<div class="mr-2"><strong>Replica:</strong></div>
<ff-dropdown ref="dropdown" v-model="selectedHAId" data-el="select-ha-replica">
<ff-dropdown-option label="All" value="all" />
<ff-dropdown-option
v-for="id in haIds" :key="id"
:label="id" :value="id"
/>
</ff-dropdown>
<ff-listbox
ref="dropdown"
v-model="selectedHAId"
data-el="select-ha-replica"
:options="haIdOptions"
/>
</div>
</template>
</SectionTopMenu>
Expand All @@ -20,12 +19,14 @@

<script>
import SectionTopMenu from '../../components/SectionTopMenu.vue'
import FfListbox from '../../ui-components/components/form/ListBox.vue'

import LogsShared from './components/InstanceLogs.vue'

export default {
name: 'InstanceLogs',
components: {
FfListbox,
LogsShared,
SectionTopMenu
},
Expand All @@ -42,6 +43,11 @@ export default {
selectedHAId: 'all'
}
},
computed: {
haIdOptions () {
return [{ label: 'All', value: 'all' }, ...this.haIds.map(id => ({ label: id, value: id }))]
}
},
methods: {
newHAId (id) {
if (!this.haIds.includes(id)) {
Expand Down
6 changes: 3 additions & 3 deletions test/e2e/frontend/cypress/tests-ee/instances/logs.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -82,16 +82,16 @@ describe('FlowForge - Instance - Logs', () => {
// open dropdown
cy.get('[data-el="select-ha-replica"]').click()
// check we have 3 options
cy.get('[data-el="select-ha-replica"] .ff-dropdown-option').should('have.length', 3)
cy.get('[data-el="select-ha-replica"] .option').should('have.length', 3)
// select the first HA Replica
cy.get('[data-el="select-ha-replica"] .ff-dropdown-option').eq(1).click()
cy.get('[data-el="select-ha-replica"] .option').eq(1).click()

// logs should now be filtered to the 3 we've defined for first replica
cy.get('[data-el="instance-log-row"]').should('have.length', 2)

// open dropdown and select "All"
cy.get('[data-el="select-ha-replica"]').click()
cy.get('[data-el="select-ha-replica"] .ff-dropdown-option').eq(0).click()
cy.get('[data-el="select-ha-replica"] .option').eq(0).click()

// logs should be restored
cy.get('[data-el="instance-log-row"]').should('have.length', 3)
Expand Down
23 changes: 12 additions & 11 deletions test/e2e/frontend/cypress/tests/team/audit-log.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,29 +26,30 @@ describe('FlowForge - Team Audit Log', () => {
})

it('provides a list of users to filter by', () => {
cy.get('[data-el="filter-users"]').find('.ff-dropdown-option').should('have.length', 3)
cy.get('[data-el="filter-users"]').click()
cy.get('[data-el="filter-users"] .option').should('have.length', 3)
})

it('enables filtering by a user', () => {
cy.get('[data-cy="filter-users"] .ff-dropdown-options').should('not.exist')
cy.get('[data-cy="filter-users"] .options').should('not.exist')

// Check Alice Skywalker Events - should be 4
cy.get('[data-el="filter-users"] .ff-dropdown').click()
cy.get('[data-el="filter-users"] .ff-dropdown-options').should('be.visible')
cy.get('[data-el="filter-users"]').click()
cy.get('[data-el="filter-users"] .options').should('be.visible')

cy.get('[data-el="filter-users"] .ff-dropdown-options > .ff-dropdown-option').eq(1).contains('Alice Skywalker').should('be.visible')
cy.get('[data-el="filter-users"] .ff-dropdown-options > .ff-dropdown-option').eq(1).click()
cy.get('[data-el="filter-users"] .options > .option').eq(1).contains('Alice Skywalker').should('be.visible')
cy.get('[data-el="filter-users"] .options > .option').eq(1).click()
cy.wait('@getAuditLog')

// length when running in isolation is 4, in tandem with the rest of the E2E tests - it's 6.
// // length when running in isolation is 4, in tandem with the rest of the E2E tests - it's 6.
cy.get('[data-el="audit-log"]').find('.ff-audit-entry').should('have.length.least', 4)

// Check Bob Solo Events - should be 0
cy.get('[data-el="filter-users"] .ff-dropdown').click()
cy.get('[data-el="filter-users"] .ff-dropdown-options').should('be.visible')
cy.get('[data-el="filter-users"]').click()
cy.get('[data-el="filter-users"] .options').should('be.visible')

cy.get('[data-el="filter-users"] .ff-dropdown-options > .ff-dropdown-option').eq(2).contains('Bob Solo').should('be.visible')
cy.get('[data-el="filter-users"] .ff-dropdown-options > .ff-dropdown-option').eq(2).click()
cy.get('[data-el="filter-users"] .options > .option').eq(2).contains('Bob Solo').should('be.visible')
cy.get('[data-el="filter-users"] .options > .option').eq(2).click()
cy.wait('@getAuditLog')

cy.get('[data-el="audit-log"]').find('.ff-audit-entry').should('have.length', 0)
Expand Down
Loading