Tom Butcher
d16aa373be
All checks were successful
farmcontrol/farmcontrol-ui/pipeline/head This commit looks good
- Introduced NavigationTabsContext to manage tab state and navigation within the dashboard. - Added DashboardTabs component for improved tabbed navigation, allowing users to add, close, and reorder tabs. - Enhanced Dashboard layout to conditionally render tab panes based on the active tab, improving user experience. - Updated various components to utilize navigation tab context, ensuring consistent title management and tab interactions. - Implemented drag-and-drop functionality for tabs, enabling users to rearrange their workspace effectively. - Refactored CSS styles for dashboard tabs and panes to ensure proper layout and responsiveness across devices.
60 lines
1.3 KiB
JavaScript
60 lines
1.3 KiB
JavaScript
export const TAB_DRAG_MIME = 'application/x-farmcontrol-tab'
|
|
export const TAB_DRAG_TEXT_PREFIX = 'farmcontrol-tab:'
|
|
|
|
export const hasExternalTabDrag = (event) => {
|
|
const types = event?.dataTransfer?.types
|
|
if (!types) return false
|
|
const list = Array.from(types)
|
|
return (
|
|
list.includes(TAB_DRAG_MIME) ||
|
|
list.includes('text/plain') ||
|
|
list.includes('text/uri-list')
|
|
)
|
|
}
|
|
|
|
export const writeTabDragData = (event, payload) => {
|
|
const serialized = JSON.stringify(payload)
|
|
try {
|
|
event.dataTransfer.setData(TAB_DRAG_MIME, serialized)
|
|
} catch {
|
|
// Some engines only allow text/plain during dragstart.
|
|
}
|
|
event.dataTransfer.setData('text/plain', `${TAB_DRAG_TEXT_PREFIX}${serialized}`)
|
|
}
|
|
|
|
export const readTabDragData = (event) => {
|
|
const transfer = event?.dataTransfer
|
|
if (!transfer) return null
|
|
|
|
const custom = (() => {
|
|
try {
|
|
return transfer.getData(TAB_DRAG_MIME)
|
|
} catch {
|
|
return ''
|
|
}
|
|
})()
|
|
const plain = (() => {
|
|
try {
|
|
return transfer.getData('text/plain')
|
|
} catch {
|
|
return ''
|
|
}
|
|
})()
|
|
|
|
const raw = custom
|
|
? custom
|
|
: plain.startsWith(TAB_DRAG_TEXT_PREFIX)
|
|
? plain.slice(TAB_DRAG_TEXT_PREFIX.length)
|
|
: ''
|
|
|
|
if (!raw) return null
|
|
|
|
try {
|
|
const parsed = JSON.parse(raw)
|
|
if (!parsed?.tab?.id) return null
|
|
return parsed
|
|
} catch {
|
|
return null
|
|
}
|
|
}
|