[READ-ONLY] Mirror of https://github.com/vitest-dev/vitest. Next generation testing framework powered by Vite.
vitest.dev
test
testing-tools
vite
feat(ui): save splitpanes size to local storage (#5166)
authored by
Eduardo San Martin Morote
and committed by
GitHub
(Feb 12, 2024, 9:44 AM +0100)
c28b4c26
38f79321
+12
-8
+12
-8
packages/ui/client/pages/index.vue
+12
-8
packages/ui/client/pages/index.vue
···
4
4
import { coverageUrl, coverageVisible, initializeNavigation } from '../composables/navigation'
5
5
6
6
const dashboardVisible = initializeNavigation()
7
-
const mainSizes = reactive([33, 67])
8
-
const detailSizes = reactive([33, 67])
7
+
const mainSizes = useLocalStorage<[left: number, right: number]>('vitest-ui_splitpanes-mainSizes', [33, 67], {
8
+
initOnMounted: true,
9
+
})
10
+
const detailSizes = useLocalStorage<[left: number, right: number]>('vitest-ui_splitpanes-detailSizes', [33, 67], {
11
+
initOnMounted: true,
12
+
})
9
13
10
14
const onMainResized = useDebounceFn((event: { size: number }[]) => {
11
15
event.forEach((e, i) => {
12
-
mainSizes[i] = e.size
16
+
mainSizes.value[i] = e.size
13
17
})
14
18
}, 0)
15
19
const onModuleResized = useDebounceFn((event: { size: number }[]) => {
16
20
event.forEach((e, i) => {
17
-
detailSizes[i] = e.size
21
+
detailSizes.value[i] = e.size
18
22
})
19
23
}, 0)
20
24
21
25
function resizeMain() {
22
26
const width = window.innerWidth
23
27
const panelWidth = Math.min(width / 3, 300)
24
-
mainSizes[0] = (100 * panelWidth) / width
25
-
mainSizes[1] = 100 - mainSizes[0]
28
+
mainSizes.value[0] = (100 * panelWidth) / width
29
+
mainSizes.value[1] = 100 - mainSizes.value[0]
26
30
// initialize suite width with the same navigation panel width in pixels (adjust its % inside detail's split pane)
27
-
detailSizes[0] = (100 * panelWidth) / (width - panelWidth)
28
-
detailSizes[1] = 100 - detailSizes[0]
31
+
detailSizes.value[0] = (100 * panelWidth) / (width - panelWidth)
32
+
detailSizes.value[1] = 100 - detailSizes.value[0]
29
33
}
30
34
</script>
31
35