#434

frontend/src/components/layout/MainArea.tsx

@@ -8,10 +8,11 @@ import type { FC, ReactNode } from 'react'
 
 type Props = {
     children:   ReactNode
-    className?: string }
+    className?: string
+    animateLayout?: boolean }
 
 
-const MainArea: FC<Props> = ({ children, className }) => {
+const MainArea: FC<Props> = ({ children, className, animateLayout = true }) => {
   const behaviourSettings = useClientBehaviourSettings ()
   const animationMode = behaviourSettings.animation ?? 'normal'
   const layoutTransition = clientAnimationTransition (
@@ -23,7 +24,7 @@ const MainArea: FC<Props> = ({ children, className }) => {
       <motion.main
 	  transition={{ layout: layoutTransition }}
 	  className={cn ('flex-1 overflow-y-auto p-4', className)}
-	  layout={animationMode === 'off' ? false : 'position'}>
+	  layout={(animationMode === 'off' || !animateLayout) ? false : 'position'}>
 	{children}
       </motion.main>)
 }

frontend/src/components/layout/SidebarComponent.tsx

@@ -16,6 +16,7 @@ type Props = {
     className?:    string
     maxWidth?:     number
     maxWidthRatio?: number
+    animateLayout?: boolean
     onWidthChange?: (width: number) => void
     sidebarKey:    string
     side?:         SidebarSide }
@@ -69,6 +70,7 @@ const SidebarComponent: FC<Props> = ({
     className,
     maxWidth,
     maxWidthRatio,
+    animateLayout = true,
     onWidthChange,
     sidebarKey,
     side = 'left',
@@ -316,7 +318,7 @@ const SidebarComponent: FC<Props> = ({
   return (
       <motion.div
 	  ref={rootRef}
-	  layout={animationMode === 'off' ? false : 'position'}
+	  layout={(animationMode === 'off' || !animateLayout) ? false : 'position'}
 	  transition={{ layout: layoutTransition }}
 	  style={style}
 	  className={cn (