♻️(frontend) extract closeSidePanel action at the store level

Extract the logic that closes the side panel into a utility function
declared at the store module level, as recommended by Valtio.

This avoids re-creating the function on every render and prevents
extra re-renders in components that use it.
This commit is contained in:
lebaudantoine
2026-07-28 10:00:33 +02:00
parent 12eba9dcb8
commit c8fc153f19
2 changed files with 7 additions and 5 deletions
@@ -1,4 +1,4 @@
import { layoutStore } from '@/stores/layout'
import { closeSidePanel, layoutStore } from '@/stores/layout'
import { css } from '@/styled-system/css'
import { Heading } from 'react-aria-components'
import { text } from '@/primitives/Text'
@@ -199,10 +199,7 @@ export const SidePanel = () => {
ref={asideRef}
title={title}
ariaLabel={t('ariaLabel', { title })}
onClose={() => {
layoutStore.activePanelId = null
layoutStore.activeSubPanelId = null
}}
onClose={closeSidePanel}
closeButtonTooltip={t('closeButton', {
content: t(`content.${activeSubPanelId || activePanelId}`),
})}
+5
View File
@@ -34,3 +34,8 @@ export const setPinnedTrack = (trackRef: TrackReferenceOrPlaceholder): void => {
export const clearPinnedTrack = (): void => {
layoutStore.pinnedTrackRef = undefined
}
export const closeSidePanel = (): void => {
layoutStore.activePanelId = null
layoutStore.activeSubPanelId = null
}