mirror of
https://github.com/simstudioai/sim.git
synced 2026-04-06 03:00:16 -04:00
fix(cmd-k): z-index + reoder tools, triggers (#1970)
* fix(cmd-k): z-index + reoder tools, triggers * fix more z-index styling
This commit is contained in:
committed by
GitHub
parent
383b6f05a6
commit
3a8f01f3e4
@@ -331,16 +331,35 @@ export function SearchModal({
|
||||
return items
|
||||
}, [workspaces, workflows, pages, blocks, triggers, tools, docs])
|
||||
|
||||
// Filter items based on search query
|
||||
const filteredItems = useMemo(() => {
|
||||
if (!searchQuery.trim()) return allItems
|
||||
const sectionOrder = useMemo<SearchItem['type'][]>(
|
||||
() => ['workspace', 'workflow', 'page', 'tool', 'trigger', 'block', 'doc'],
|
||||
[]
|
||||
)
|
||||
|
||||
const query = searchQuery.toLowerCase()
|
||||
return allItems.filter(
|
||||
(item) =>
|
||||
item.name.toLowerCase().includes(query) || item.description?.toLowerCase().includes(query)
|
||||
// Filter items based on search query and enforce section ordering
|
||||
const filteredItems = useMemo(() => {
|
||||
const orderMap = sectionOrder.reduce<Record<SearchItem['type'], number>>(
|
||||
(acc, type, index) => {
|
||||
acc[type] = index
|
||||
return acc
|
||||
},
|
||||
{} as Record<SearchItem['type'], number>
|
||||
)
|
||||
}, [allItems, searchQuery])
|
||||
|
||||
const baseItems = !searchQuery.trim()
|
||||
? allItems
|
||||
: allItems.filter(
|
||||
(item) =>
|
||||
item.name.toLowerCase().includes(searchQuery.toLowerCase()) ||
|
||||
item.description?.toLowerCase().includes(searchQuery.toLowerCase())
|
||||
)
|
||||
|
||||
return [...baseItems].sort((a, b) => {
|
||||
const aOrder = orderMap[a.type] ?? Number.MAX_SAFE_INTEGER
|
||||
const bOrder = orderMap[b.type] ?? Number.MAX_SAFE_INTEGER
|
||||
return aOrder - bOrder
|
||||
})
|
||||
}, [allItems, searchQuery, sectionOrder])
|
||||
|
||||
// Reset selected index when filtered items change
|
||||
useEffect(() => {
|
||||
@@ -469,7 +488,7 @@ export function SearchModal({
|
||||
<Dialog open={open} onOpenChange={onOpenChange}>
|
||||
<DialogPortal>
|
||||
<DialogOverlay
|
||||
className='bg-white/80 dark:bg-[#1b1b1b]/90'
|
||||
className='z-40 bg-white/80 dark:bg-[#1b1b1b]/90'
|
||||
style={{ backdropFilter: 'blur(4px)' }}
|
||||
/>
|
||||
<DialogPrimitive.Content className='fixed top-[15%] left-[50%] z-50 flex w-[500px] translate-x-[-50%] flex-col gap-[12px] p-0 focus:outline-none focus-visible:outline-none'>
|
||||
@@ -493,7 +512,8 @@ export function SearchModal({
|
||||
{/* Floating results container */}
|
||||
{filteredItems.length > 0 ? (
|
||||
<div className='scrollbar-thin scrollbar-thumb-border scrollbar-track-transparent max-h-[400px] overflow-y-auto rounded-[10px] py-[10px] shadow-sm'>
|
||||
{Object.entries(groupedItems).map(([type, items]) => {
|
||||
{sectionOrder.map((type) => {
|
||||
const items = groupedItems[type] || []
|
||||
if (items.length === 0) return null
|
||||
|
||||
return (
|
||||
|
||||
@@ -670,7 +670,7 @@ export function Subscription({ onOpenChange }: SubscriptionProps) {
|
||||
<SelectTrigger className='h-8 w-[200px] justify-between text-left text-xs'>
|
||||
<SelectValue placeholder='Select admin' />
|
||||
</SelectTrigger>
|
||||
<SelectContent align='start'>
|
||||
<SelectContent align='start' className='z-50'>
|
||||
<SelectGroup>
|
||||
<SelectLabel className='px-3 py-1 text-[11px] text-muted-foreground uppercase'>
|
||||
Workspace admins
|
||||
|
||||
Reference in New Issue
Block a user