Main Menu: Bring back animations toggle (#2209)

src/components/left/main/LeftMainHeader.tsx

@@ -72,6 +72,7 @@ type StateProps =
   }
   & Pick<GlobalState, 'connectionState' | 'isSyncing' | 'canInstall'>;
 
+const ANIMATION_LEVEL_OPTIONS = [0, 1, 2];
 const LEGACY_VERSION_URL = 'https://web.telegram.org/?legacy=1';
 const WEBK_VERSION_URL = 'https://web.telegram.org/k/';
 
@@ -202,6 +203,17 @@ const LeftMainHeader: FC<OwnProps & StateProps> = ({
     switchTheme(newTheme, animationLevel === ANIMATION_LEVEL_MAX);
   }, [animationLevel, setSettingOption, theme]);
 
+  const handleAnimationLevelChange = useCallback((e: React.SyntheticEvent<HTMLElement>) => {
+    e.stopPropagation();
+
+    const newLevel = animationLevel === 0 ? 2 : 0;
+    ANIMATION_LEVEL_OPTIONS.forEach((_, i) => {
+      document.body.classList.toggle(`animation-level-${i}`, newLevel === i);
+    });
+
+    setSettingOption({ animationLevel: newLevel });
+  }, [animationLevel, setSettingOption]);
+
   const handleChangelogClick = useCallback(() => {
     window.open(BETA_CHANGELOG_URL, '_blank', 'noopener');
   }, []);
@@ -284,6 +296,17 @@ const LeftMainHeader: FC<OwnProps & StateProps> = ({
               noAnimation
             />
           </MenuItem>
+          <MenuItem
+            icon="animations"
+            onClick={handleAnimationLevelChange}
+          >
+            <span className="menu-item-name capitalize">{lang('Appearance.Animations').toLowerCase()}</span>
+            <Switcher
+              id="animations"
+              label="Toggle Animations"
+              checked={animationLevel > 0}
+            />
+          </MenuItem>
           <MenuItem
             icon="help"
             onClick={handleOpenTipsChat}