On focus search behaviour renders to 100 invites, all groups and the first page of current users
This commit is contained in:
parent
530c4fb00f
commit
bb98160317
1 changed files with 28 additions and 23 deletions
|
@ -28,9 +28,9 @@
|
|||
let inviting = false
|
||||
let searchFocus = false
|
||||
|
||||
//Or searching = true?
|
||||
let filtered = true
|
||||
$: console.log("filtering enabled ", filtered)
|
||||
// Initially filter entities without app access
|
||||
// Show all when false
|
||||
let filterByAppAccess = true
|
||||
|
||||
let appInvites = []
|
||||
let filteredInvites = []
|
||||
|
@ -38,7 +38,6 @@
|
|||
let filteredGroups = []
|
||||
let selectedGroup
|
||||
let userOnboardResponse = null
|
||||
|
||||
let userLimitReachedModal
|
||||
|
||||
$: queryIsEmail = emailValidator(query) === true
|
||||
|
@ -63,8 +62,9 @@
|
|||
appInvites = await getInvites()
|
||||
|
||||
//On Focus behaviour
|
||||
if (!filtered && (!query || query == "")) {
|
||||
filteredInvites = [...appInvites]
|
||||
if (!filterByAppAccess && (!query || query == "")) {
|
||||
filteredInvites =
|
||||
appInvites.length > 100 ? appInvites.slice(0, 100) : [...appInvites]
|
||||
return
|
||||
}
|
||||
|
||||
|
@ -77,9 +77,9 @@
|
|||
})
|
||||
}
|
||||
|
||||
$: filtered, prodAppId, filterInvites(query)
|
||||
$: filterByAppAccess, prodAppId, filterInvites(query)
|
||||
$: if (searchFocus === true) {
|
||||
filtered = false
|
||||
filterByAppAccess = false
|
||||
}
|
||||
|
||||
const usersFetch = fetchData({
|
||||
|
@ -99,9 +99,9 @@
|
|||
}
|
||||
await usersFetch.update({
|
||||
query: {
|
||||
appId: query ? null : prodAppId,
|
||||
appId: query || !filterByAppAccess ? null : prodAppId,
|
||||
email: query,
|
||||
paginated: query ? null : false,
|
||||
paginated: query || !filterByAppAccess ? null : false,
|
||||
},
|
||||
})
|
||||
await usersFetch.refresh()
|
||||
|
@ -127,7 +127,12 @@
|
|||
}
|
||||
|
||||
const debouncedUpdateFetch = Utils.debounce(searchUsers, 250)
|
||||
$: debouncedUpdateFetch(query, $store.builderSidePanel, loaded)
|
||||
$: debouncedUpdateFetch(
|
||||
query,
|
||||
$store.builderSidePanel,
|
||||
loaded,
|
||||
filterByAppAccess
|
||||
)
|
||||
|
||||
const updateAppUser = async (user, role) => {
|
||||
if (!prodAppId) {
|
||||
|
@ -202,9 +207,10 @@
|
|||
}
|
||||
|
||||
const searchGroups = (userGroups, query) => {
|
||||
let filterGroups = query?.length
|
||||
? userGroups
|
||||
: getAppGroups(userGroups, prodAppId)
|
||||
let filterGroups =
|
||||
query?.length || !filterByAppAccess
|
||||
? userGroups
|
||||
: getAppGroups(userGroups, prodAppId)
|
||||
return filterGroups
|
||||
.filter(group => {
|
||||
if (!query?.length) {
|
||||
|
@ -234,7 +240,7 @@
|
|||
}
|
||||
|
||||
// Adds the 'role' attribute and sets it to the current app.
|
||||
$: enrichedGroups = getEnrichedGroups($groups)
|
||||
$: enrichedGroups = getEnrichedGroups($groups, filterByAppAccess)
|
||||
$: filteredGroups = searchGroups(enrichedGroups, query)
|
||||
$: groupUsers = buildGroupUsers(filteredGroups, filteredUsers)
|
||||
$: allUsers = [...filteredUsers, ...groupUsers]
|
||||
|
@ -246,7 +252,7 @@
|
|||
specific roles for the app.
|
||||
*/
|
||||
const buildGroupUsers = (userGroups, filteredUsers) => {
|
||||
if (query) {
|
||||
if (query || !filterByAppAccess) {
|
||||
return []
|
||||
}
|
||||
// Must exclude users who have explicit privileges
|
||||
|
@ -371,7 +377,6 @@
|
|||
|
||||
onMount(() => {
|
||||
rendered = true
|
||||
// searchFocus = true
|
||||
})
|
||||
|
||||
function handleKeyDown(evt) {
|
||||
|
@ -447,20 +452,20 @@
|
|||
|
||||
<span
|
||||
class="search-input-icon"
|
||||
class:searching={query || !filtered}
|
||||
class:searching={query || !filterByAppAccess}
|
||||
on:click={() => {
|
||||
if (!filtered) {
|
||||
filtered = true
|
||||
if (!filterByAppAccess) {
|
||||
filterByAppAccess = true
|
||||
}
|
||||
if (!query) {
|
||||
return
|
||||
}
|
||||
query = null
|
||||
userOnboardResponse = null
|
||||
filtered = true
|
||||
filterByAppAccess = true
|
||||
}}
|
||||
>
|
||||
<Icon name={!filtered || query ? "Close" : "Search"} />
|
||||
<Icon name={!filterByAppAccess || query ? "Close" : "Search"} />
|
||||
</span>
|
||||
</div>
|
||||
|
||||
|
@ -581,7 +586,7 @@
|
|||
|
||||
{#if filteredUsers?.length}
|
||||
<div class="auth-entity-section">
|
||||
<div class="auth-entity-header ">
|
||||
<div class="auth-entity-header">
|
||||
<div class="auth-entity-title">Users</div>
|
||||
<div class="auth-entity-access-title">Access</div>
|
||||
</div>
|
||||
|
|
Loading…
Reference in a new issue